:root { --ink:#050606; --paper:#f4f1e7; --blue:#229ed9; --acid:#d8ff3e; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
.page-shell { min-height:100svh; position:relative; overflow:hidden; display:flex; flex-direction:column; background:radial-gradient(circle at 82% 42%, rgba(34,158,217,.22), transparent 26%), linear-gradient(115deg,#050606 0%,#090b0c 65%,#041219 100%); }
.page-shell::before { content:""; position:absolute; inset:0; background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:46px 46px; mask-image:linear-gradient(to right,transparent,black); pointer-events:none; }
.noise { position:absolute; inset:0; opacity:.08; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); }
.nav { position:relative; z-index:2; display:flex; justify-content:space-between; align-items:center; padding:24px clamp(24px,5vw,76px); border-bottom:1px solid rgba(255,255,255,.12); }
.brand { display:flex; flex-direction:column; font-weight:950; font-size:17px; line-height:.78; letter-spacing:-.08em; transform:skew(-6deg); }
.brand span:last-child { color:var(--acid); }
.nav-join { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.12em; display:flex; gap:10px; align-items:center; }
.hero { width:min(1200px,100%); margin:auto; position:relative; z-index:1; padding:64px clamp(24px,5vw,76px) 42px; }
.eyebrow { font-size:11px; letter-spacing:.22em; font-weight:800; text-transform:uppercase; display:flex; align-items:center; gap:10px; color:#bfc5c7; margin-bottom:24px; }
.live-dot { width:7px; height:7px; background:var(--acid); border-radius:50%; box-shadow:0 0 0 5px rgba(216,255,62,.12),0 0 20px rgba(216,255,62,.65); }
h1 { font-size:clamp(50px,8.4vw,124px); line-height:.82; letter-spacing:-.075em; font-weight:950; margin:0; max-width:1050px; text-transform:uppercase; }
h1 em { color:var(--acid); font-style:normal; display:inline-block; transform:skew(-4deg); text-shadow:0 0 50px rgba(216,255,62,.15); }
.intro { color:#aeb4b7; max-width:490px; font-size:clamp(15px,1.5vw,20px); line-height:1.55; margin:30px 0 34px; }
.action-row { display:flex; gap:14px; align-items:stretch; flex-wrap:wrap; }
.countdown-card { min-width:252px; display:flex; gap:14px; align-items:center; padding:12px 18px 12px 12px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.035); backdrop-filter:blur(12px); }
.timer-ring { --progress:0deg; width:54px; aspect-ratio:1; border-radius:50%; background:conic-gradient(var(--acid) var(--progress),rgba(255,255,255,.12) 0); display:grid; place-items:center; position:relative; }
.timer-ring::after { content:""; position:absolute; inset:4px; border-radius:50%; background:#0a0d0e; }
.timer-ring span { position:relative; z-index:1; font-size:19px; font-weight:900; font-variant-numeric:tabular-nums; }
.micro-label { color:#7d8589; font-size:8px; font-weight:800; letter-spacing:.18em; display:block; margin-bottom:5px; }
.countdown-card strong { font-size:13px; letter-spacing:.08em; }
.primary-cta { min-width:330px; background:var(--paper); color:var(--ink); display:flex; align-items:center; gap:13px; padding:12px 17px; transition:transform .2s,background .25s; }
.primary-cta:hover { transform:translateY(-3px); background:var(--acid); }
.primary-cta.ready { background:var(--acid); }
.primary-cta span { display:flex; flex-direction:column; font-size:16px; font-weight:900; }
.primary-cta small { font-size:8px; letter-spacing:.15em; color:#6f7475; margin-bottom:4px; }
.primary-cta b { margin-left:auto; font-size:20px; }
.telegram-mark { flex:none; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--blue); color:white; overflow:hidden; }
.plane { font-size:19px; transform:rotate(-28deg) translateY(-1px); }
.social-proof { margin-top:34px; padding-top:26px; border-top:1px solid rgba(255,255,255,.12); display:flex; gap:16px; align-items:center; max-width:680px; }
.avatars { display:flex; }
.avatars span { width:34px; height:34px; margin-right:-8px; border:2px solid #090b0c; border-radius:50%; display:grid; place-items:center; background:#202528; font-size:10px; font-weight:900; }
.avatars span:nth-child(2){background:var(--blue)} .avatars span:nth-child(3){background:var(--acid);color:#050606}
.social-proof>div:nth-child(2){display:flex;flex-direction:column}.social-proof strong{font-size:17px}.social-proof span:not(.live-dot){font-size:8px;letter-spacing:.15em;color:#7d8589;margin-top:3px}
.rating { margin-left:auto; display:flex; flex-direction:column; align-items:flex-end; }.rating span { color:var(--acid)!important; letter-spacing:.08em!important;font-size:10px!important}.rating small{font-size:8px;color:#7d8589;letter-spacing:.15em;margin-top:5px}
footer { position:relative; z-index:1; padding:18px clamp(24px,5vw,76px); display:flex; justify-content:space-between; font-size:8px; letter-spacing:.18em; color:#697074; }
@media(max-width:650px){.nav{padding:20px 22px}.hero{padding:48px 22px 28px}h1{font-size:16vw;line-height:.84}.intro{margin:24px 0}.action-row>*{width:100%;min-width:0}.social-proof{align-items:flex-start;flex-wrap:wrap}.rating{margin-left:0;width:100%;align-items:flex-start}footer{padding:18px 22px;gap:14px;flex-direction:column}.page-shell::before{background-size:30px 30px}.nav-join{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.primary-cta{transition:none}}
