:root{
  --bg:#06070c;
  --panel:rgba(255,255,255,.075);
  --panel-2:rgba(255,255,255,.045);
  --line:rgba(255,255,255,.14);
  --text:#fbfcf8;
  --muted:rgba(251,252,248,.74);
  --soft:rgba(251,252,248,.52);
  --gold:#f5d36a;
  --gold-dark:#d99a24;
  --cyan:#59ffe0;
  --green:#20d58a;
  --danger:#ff657a;
  --shadow:0 24px 100px rgba(0,0,0,.46);
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--text);
  background:
    linear-gradient(115deg, transparent 0 36%, rgba(245,211,106,.055) 37%, transparent 39%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 92px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.03) 0 1px, transparent 1px 92px),
    linear-gradient(180deg, #06070c 0%, #0b1017 48%, #06070c 100%);
  min-height:100vh;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit;text-decoration:none}
p,h1,h2,h3{margin:0}
.container{width:min(var(--max), calc(100% - 40px));margin:0 auto}

.topbar{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(6,7,12,.88);
  border-bottom:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(18px);
}
.topbar-inner{
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}
.brand{display:flex;align-items:center;gap:12px;font-weight:900}
.brand-mark{
  width:44px;height:44px;border-radius:8px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#ffe99b,#d99a24);
  color:#06070c;
  box-shadow:0 14px 42px rgba(217,154,36,.24);
}
.brand-title strong{display:block;font-size:14px}
.brand-title span{display:block;margin-top:4px;color:var(--soft);font-size:11px}
.links{display:flex;align-items:center;gap:18px;color:var(--muted);font-size:14px}
.links a{padding:10px 0;border-bottom:1px solid transparent}
.links a:hover,.links a.active{color:var(--text);border-color:var(--gold)}
.phone-page-menu{display:none}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:0 20px;
  border-radius:8px;
  font-weight:900;
  border:1px solid rgba(255,255,255,.14);
  transition:.2s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:linear-gradient(135deg,#f5d36a,#d99a24,#ffe99b);color:#06070c}
.btn-dark{background:rgba(255,255,255,.05);color:var(--text)}
.btn-green{background:linear-gradient(135deg,#4dffb2,#0f9f65);color:#06100c}

.hero{padding:96px 0 72px;position:relative}
.eyebrow{
  display:inline-flex;
  align-items:center;
  padding:10px 14px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.055);
  color:#e8fbf5;
  font-size:12px;
  font-weight:900;
}
h1{
  margin-top:18px;
  max-width:950px;
  font-size:clamp(42px,7vw,78px);
  line-height:.98;
  letter-spacing:0;
  text-wrap:balance;
}
.lead{
  margin-top:22px;
  max-width:820px;
  color:var(--muted);
  font-size:18px;
  line-height:1.9;
  text-wrap:pretty;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}

.section{padding:82px 0}
.section-head{max-width:850px;margin-bottom:30px}
.section-head.center{text-align:center;margin-left:auto;margin-right:auto}
.kicker{
  display:inline-flex;
  margin-bottom:14px;
  padding:9px 12px;
  border-radius:8px;
  color:#e8fbf5;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.045);
  font-size:12px;
  font-weight:900;
}
h2{font-size:clamp(30px,4.2vw,52px);line-height:1.1;text-wrap:balance}
h3{font-size:24px;line-height:1.18}
.gold{color:var(--gold)}

.grid{display:grid;gap:18px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.card{
  position:relative;
  overflow:hidden;
  border-radius:8px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.038)),rgba(8,10,16,.72);
  box-shadow:var(--shadow);
}
.card::before{
  content:"";
  position:absolute;inset:0;
  background:repeating-linear-gradient(135deg,rgba(255,255,255,.032) 0 1px,transparent 1px 18px);
  pointer-events:none;
}
.card-inner{position:relative;z-index:1;padding:28px}
.card p,.article p,.list li{color:var(--muted);line-height:1.78}
.list{display:grid;gap:12px;margin:18px 0 0;padding:0;list-style:none}
.list li{padding:14px 14px 14px 44px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);border-radius:8px;position:relative}
.list li::before{
  content:"";
  position:absolute;left:15px;top:21px;
  width:10px;height:10px;border-radius:2px;background:var(--gold);
  box-shadow:0 0 18px rgba(245,211,106,.35);
}

.module{display:grid;grid-template-columns:92px 1fr;gap:14px;align-items:start}
.module-number{color:var(--gold);font-weight:900}
.price{font-size:34px;font-weight:950;color:var(--gold);line-height:1.1}
.note{margin-top:22px;padding:18px;border-radius:8px;border:1px solid rgba(245,211,106,.24);background:rgba(245,211,106,.08);color:#fff2c7;line-height:1.75}
.faq{display:grid;gap:14px}
.faq details{border:1px solid rgba(255,255,255,.12);border-radius:8px;background:rgba(255,255,255,.045);padding:18px}
.faq summary{cursor:pointer;font-weight:900}
.faq p{margin-top:12px;color:var(--muted);line-height:1.75}

.article{max-width:820px}
.article h2{margin-top:46px;font-size:34px}
.article p{margin-top:16px;font-size:17px}
.article ul{margin-top:16px}

.footer{padding:44px 0;color:var(--soft);border-top:1px solid rgba(255,255,255,.10)}
.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center}

@media (min-width:901px){
  .phone-page-menu{display:none!important}
}

@media (max-width:900px){
  .links{display:none}
  .phone-page-menu{
    display:grid!important;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    align-items:center;
    gap:9px;
    width:min(var(--max), calc(100% - 22px));
    margin:0 auto;
    padding:0 0 14px;
    overflow:visible;
  }
  .phone-page-menu a{
    min-width:0;
    min-height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 8px;
    border-radius:8px;
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.14);
    color:rgba(251,252,248,.9);
    font-size:13px;
    font-weight:850;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .phone-page-menu a[aria-current="page"]{
    color:#06070c;
    background:linear-gradient(135deg,#f5d36a,#d99a24,#ffe99b);
    border-color:rgba(255,244,194,.48);
  }
  .phone-page-menu a.phone-page-menu-join{
    color:#06100c;
    background:linear-gradient(135deg,#4dffb2,#0f9f65);
    border-color:rgba(142,255,204,.42);
  }
  .grid-2,.grid-3{grid-template-columns:1fr}
  .topbar .btn{display:none}
  .brand-title span{display:none}
  .hero{padding:68px 0 54px}
  .section{padding:62px 0}
  .footer-inner{display:grid}
}

@media (max-width:360px){
  .phone-page-menu{grid-template-columns:repeat(2, minmax(0, 1fr))}
}
