:root { color-scheme: light; --ink:#10252a; --teal:#006c70; --paper:#f4f1e9; --line:rgba(16,37,42,.13); }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:var(--paper); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 80% 20%,rgba(0,108,112,.12),transparent 32%),radial-gradient(circle at 5% 95%,rgba(255,104,79,.10),transparent 28%); }
.site-head, main, footer { width:min(1180px,calc(100% - 48px)); margin:auto; position:relative; }
.site-head { height:92px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:10px; color:inherit; text-decoration:none; font-weight:850; font-size:21px; letter-spacing:-.04em; }
.brand i { width:17px; height:17px; border:5px solid var(--teal); border-radius:50%; box-shadow:7px -5px 0 -4px #ff684f; }
.locale { padding:3px; display:flex; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.48); }
.locale button { width:42px; height:32px; border:0; border-radius:999px; background:transparent; color:#617074; font-weight:800; cursor:pointer; }
.locale button.active { color:white; background:var(--ink); }
.hero { min-height:calc(100vh - 180px); display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:7vw; padding:48px 0 72px; }
.copy { max-width:650px; }
.eyebrow { display:inline-flex; padding:8px 12px; border-radius:999px; color:var(--teal); background:rgba(0,108,112,.09); font-size:12px; font-weight:850; text-transform:uppercase; letter-spacing:.09em; }
h1 { margin:24px 0 22px; font-size:clamp(58px,6vw,88px); line-height:.92; letter-spacing:-.07em; }
.copy p { max-width:590px; margin:0 0 30px; color:#586a6d; font-size:clamp(17px,2vw,21px); line-height:1.55; }
.telegram { display:inline-flex; min-height:58px; align-items:center; justify-content:center; padding:0 25px; border-radius:18px; color:white; background:var(--teal); box-shadow:0 16px 38px rgba(0,108,112,.2); font-weight:850; text-decoration:none; }
.copy small { display:block; margin-top:13px; color:#7b888a; }
.visual { aspect-ratio:1; position:relative; overflow:hidden; border-radius:42px; background:linear-gradient(145deg,#102b30,#06191d); box-shadow:0 34px 80px rgba(16,37,42,.24); }
.visual::after { content:""; position:absolute; inset:0; background:linear-gradient(135deg,rgba(255,255,255,.06),transparent 42%,rgba(0,108,112,.24)); }
.orbit { position:absolute; border:1px solid rgba(145,229,220,.22); border-radius:50%; }
.orbit.one { inset:12%; }.orbit.two { inset:25%; }.orbit.three { inset:38%; }
.signal { position:absolute; z-index:2; left:50%; top:46%; display:flex; align-items:end; gap:7px; transform:translate(-50%,-50%); }
.signal span { width:11px; border-radius:8px; background:#8ee3d9; box-shadow:0 0 24px rgba(142,227,217,.25); }
.signal span:nth-child(1){height:28px}.signal span:nth-child(2){height:47px}.signal span:nth-child(3){height:69px}.signal span:nth-child(4){height:94px;background:#ff765e}
.route { position:absolute; z-index:2; left:12%; right:12%; bottom:12%; display:flex; align-items:center; gap:10px; color:white; font-size:12px; }
.route b { width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.15); border-radius:14px; background:rgba(255,255,255,.08); }
.route i { height:1px; flex:1; background:linear-gradient(90deg,#8ee3d9,rgba(142,227,217,.15)); }
footer { min-height:88px; padding:24px 0; display:flex; justify-content:space-between; border-top:1px solid var(--line); color:#778587; font-size:13px; }
@media (max-width:800px){.site-head,main,footer{width:min(100% - 32px,620px)}.hero{grid-template-columns:1fr;padding-top:24px}.visual{max-width:520px}.site-head{height:76px}h1{font-size:clamp(54px,16vw,82px)}footer{margin-top:38px;gap:18px;flex-direction:column}.copy small{line-height:1.45}}