:root{
  --bg:#FFFFFF;
  --ink:#0E1116;
  --ink-soft:#3A3F47;
  --muted:#8A8F98;
  --line:#ECEDF0;
  --chip:#F4F5F7;
  --yellow:#FFD400;
  --yellow-deep:#F5C518;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
a,button,summary,[role="button"]{-webkit-tap-highlight-color:transparent}
a:focus,button:focus,summary:focus{outline:none}
:root{--header-h:73px}
html{
  font-size:16px;
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:var(--header-h);
}
section[id]{scroll-margin-top:var(--header-h)}
html,body{
  background:var(--bg);color:var(--ink);
  font-family:'Onest',-apple-system,'Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body{min-height:100vh;font-size:clamp(14px, 1vw + 0.6rem, 16px);line-height:1.55;letter-spacing:-0.005em}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3{line-height:1.1;letter-spacing:-0.025em;text-wrap:balance}
p{text-wrap:pretty}

/* ---------- HEADER ---------- */
header{
  position:sticky;top:0;z-index:50;
  background:#fff;
  border-bottom:1px solid var(--line);
}
.nav{
  max-width:1360px;
  margin:0 auto;
  padding:18px 40px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:40px;
}

/* ---- logo ---- */
.logo{
  display:inline-flex;align-items:center;gap:10px;
  font-weight:700;
  font-size:18px;
  line-height:1;
  letter-spacing:-0.01em;
}
.logo-mark{
  width:38px;height:38px;
  background:var(--yellow);
  border-radius:10px;
  display:grid;place-items:center;
  position:relative;
}
.logo-mark svg{display:block}
.logo-img{
  height:var(--logo-h-desktop, 44px);width:auto;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 4px 10px rgba(245,197,24,.25));
}
.qr-logo-img{
  height:22px;width:auto;
  object-fit:contain;
  display:block;
}
.logo-text{display:flex;flex-direction:column;gap:2px}
.logo-text b{font-weight:700;font-size:18px;color:var(--ink)}
.logo-text span{font-weight:500;font-size:13px;color:var(--muted)}

/* ---- menu ---- */
nav.menu{
  display:flex;
  justify-content:center;
  gap:6px;
}
nav.menu a{
  display:inline-flex;align-items:center;gap:6px;
  padding:10px 16px;
  font-size:15px;
  font-weight:500;
  color:var(--ink-soft);
  border-radius:10px;
  transition:.2s ease;
}
nav.menu a:hover{color:var(--ink);background:var(--chip)}
nav.menu a.has-sub::after{
  content:"";
  width:8px;height:8px;
  border-right:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;
  transform:rotate(45deg) translate(-1px,-1px);
  opacity:.55;
}

/* ---- right actions ---- */
.actions{display:flex;align-items:center;gap:10px}

.btn-login{
  padding:11px 20px;
  font-size:14px;font-weight:600;
  color:var(--ink);
  border-radius:999px;
  transition:.2s ease;
}
.btn-login:hover{background:var(--chip)}

.btn-register{
  display:inline-flex;align-items:center;gap:8px;
  padding:11px 22px;
  font-size:14px;font-weight:600;
  background:var(--yellow);
  color:var(--ink);
  border-radius:999px;
  transition:.2s ease;
  box-shadow:0 6px 18px -8px rgba(245,197,24,.9);
}
.btn-register:hover{background:var(--yellow-deep);transform:translateY(-1px)}
.btn-register svg{display:block}
.btn-register .lbl-mobile{display:none}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(900px 700px at 100% 0%, rgba(255,212,0,.55) 0%, rgba(255,212,0,0) 55%),
    radial-gradient(600px 500px at 0% 100%, rgba(255,243,168,.55) 0%, rgba(255,243,168,0) 60%),
    linear-gradient(155deg, #FFFFFF 0%, #FFFBE0 60%, #FFF3A8 100%);
  border-bottom:1px solid var(--line);
}
.hero::before{display:none}
.hero-bg{display:none}

.hero{min-height:calc(100dvh - var(--header-h));display:flex;align-items:center}
.hero-inner{
  position:relative;
  width:100%;
  max-width:1360px;
  margin:0 auto;
  padding:40px 40px;
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:clamp(32px, 4vw, 60px);
  align-items:center;
}

/* left */
.hero-left{display:flex;flex-direction:column;gap:24px}

.hero-eyebrow{
  display:inline-flex;align-items:center;gap:14px;
  align-self:flex-start;
  font-size:12px;font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.18em;
  color:var(--ink-soft);
}
.hero-eyebrow .bar{
  width:36px;height:2px;
  background:var(--yellow-deep);
}
.hero-eyebrow .num{
  font-family:'Geist',sans-serif;
  font-weight:700;
  color:var(--ink);
  letter-spacing:0.1em;
}
.hero-eyebrow .txt{color:var(--ink-soft)}

.hero-title{
  font-size:clamp(32px, 4.6vw + 0.4rem, 64px);
  line-height:1.04;
  font-weight:600;
  letter-spacing:-0.035em;
  color:var(--ink);
}
.hero-title .accent{
  color:var(--yellow-deep);
  font-weight:600;
}

.hero-sub{
  font-size:clamp(15px, 0.4vw + 0.85rem, 18px);
  line-height:1.6;
  color:var(--ink-soft);
  max-width:560px;
}

.hero-actions{
  display:flex;flex-wrap:wrap;gap:12px;
  margin-top:8px;
}
.hero-cta{
  padding:16px 26px;
  font-size:15px;
}
.btn-secondary{
  display:inline-flex;align-items:center;gap:8px;
  padding:16px 26px;
  font-size:15px;font-weight:600;
  background:#fff;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:999px;
  transition:.2s ease;
}
.btn-secondary:hover{border-color:var(--ink);transform:translateY(-1px)}

/* right */
.hero-right{
  position:relative;
  min-height:520px;
  display:flex;align-items:center;justify-content:center;
}
.card-stage{
  position:relative;
  width:100%;
  max-width:560px;
  aspect-ratio:1/1;
}
/* scenes cycle */
.scene{
  position:absolute;inset:0;
  display:grid;place-items:center;
  opacity:0;
  transition:opacity .6s ease;
}
.scene-card{animation:sceneCard 9s ease-in-out infinite}
.scene-qr{animation:sceneQR 9s ease-in-out infinite}
.scene-success{animation:sceneSuccess 9s ease-in-out infinite}

@keyframes sceneCard{
  0%,30%{opacity:1;transform:scale(1)}
  35%,90%{opacity:0;transform:scale(.94)}
  98%,100%{opacity:1;transform:scale(1)}
}
@keyframes sceneQR{
  0%,32%{opacity:0;transform:scale(.94)}
  38%,62%{opacity:1;transform:scale(1)}
  68%,100%{opacity:0;transform:scale(.94)}
}
@keyframes sceneSuccess{
  0%,62%{opacity:0;transform:translateY(20px) scale(.96)}
  70%,88%{opacity:1;transform:translateY(0) scale(1)}
  94%,100%{opacity:0;transform:translateY(-10px) scale(.96)}
}

.card-img{
  width:100%;height:100%;
  object-fit:contain;
  filter:drop-shadow(0 40px 60px rgba(245,197,24,.25)) drop-shadow(0 20px 30px rgba(14,17,22,.12));
}

/* ---- QR scene (banking style) ---- */
.qr-frame{
  position:relative;
  width:min(78%, 360px);
  background:#fff;
  border-radius:24px;
  padding:18px 18px 16px;
  box-shadow:
    0 40px 80px -28px rgba(14,17,22,.22),
    0 0 0 1px rgba(14,17,22,.05),
    inset 0 2px 0 rgba(255,212,0,.15);
  border-top:3px solid var(--yellow);
}
.qr-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:2px 4px 12px;
  font-size:12px;
}
.qr-logo{
  display:inline-flex;align-items:center;gap:6px;
  font-weight:700;
  color:var(--ink);
  letter-spacing:-0.01em;
}
.qr-logo svg{display:block}
.qr-pay{
  margin-left:2px;
  padding:2px 7px;
  background:var(--yellow);
  color:var(--ink);
  border-radius:6px;
  font-size:10px;
  letter-spacing:0.06em;
  font-weight:700;
}
.qr-status{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:600;
  color:var(--ink-soft);
  text-transform:uppercase;
  letter-spacing:.1em;
}
.qr-pulse{
  width:7px;height:7px;border-radius:50%;
  background:var(--yellow-deep);
  position:relative;
  animation:qrPulse 1.4s ease-out infinite;
}
@keyframes qrPulse{
  0%{box-shadow:0 0 0 0 rgba(245,197,24,.7)}
  100%{box-shadow:0 0 0 8px rgba(245,197,24,0)}
}

.qr-code{
  position:relative;
  width:100%;
  aspect-ratio:1/1;
  padding:14px;
  background:linear-gradient(180deg, #FFFCEC 0%, #FFFFFF 100%);
  border-radius:14px;
}
.qr-inner{
  position:relative;
  width:100%;height:100%;
  border-radius:8px;
  overflow:hidden;
  background:#fff;
  isolation:isolate;
}
.qr-inner svg{display:block;width:100%;height:100%}
.qr-inner::before{
  /* subtle desaturation during scan that lifts at the end */
  content:"";
  position:absolute;inset:0;
  background:rgba(14,17,22,.04);
  pointer-events:none;
  z-index:1;
  animation:qrTint 9s ease-in-out infinite;
}
@keyframes qrTint{
  0%,32%{opacity:0}
  35%,57%{opacity:1}
  61%,100%{opacity:0}
}

/* sharp beam */
.scan-line{
  position:absolute;
  left:0;right:0;
  top:0;
  height:2px;
  background:linear-gradient(90deg,
    rgba(255,212,0,0) 0%,
    rgba(255,212,0,.6) 10%,
    #FFEE80 45%,
    #FFE15A 50%,
    #FFEE80 55%,
    rgba(255,212,0,.6) 90%,
    rgba(255,212,0,0) 100%);
  box-shadow:
    0 0 14px 1px rgba(245,197,24,.95),
    0 0 32px 6px rgba(245,197,24,.45);
  border-radius:2px;
  animation:scanMove 9s cubic-bezier(.5,.05,.25,1) infinite;
  pointer-events:none;
  z-index:3;
  will-change:top,opacity;
}
/* soft trailing wash above beam */
.scan-line::before{
  content:"";
  position:absolute;
  left:4%;right:4%;
  bottom:2px;
  height:90px;
  background:linear-gradient(180deg,
    rgba(255,212,0,0) 0%,
    rgba(255,212,0,.05) 35%,
    rgba(255,212,0,.18) 70%,
    rgba(255,222,40,.36) 100%);
  filter:blur(2px);
  border-radius:2px;
  pointer-events:none;
}
/* tiny travelling spark on the beam */
.scan-line::after{
  content:"";
  position:absolute;
  top:-2px;
  left:50%;
  width:8px;height:6px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 12px 4px rgba(255,255,255,.9), 0 0 24px 8px rgba(255,212,0,.6);
  animation:sparkSlide 9s cubic-bezier(.5,.05,.25,1) infinite;
}
@keyframes scanMove{
  0%,32%   {top:0;opacity:0}
  34%      {top:0;opacity:1}
  58%      {top:calc(100% - 2px);opacity:1}
  61%      {top:calc(100% - 2px);opacity:0}
  62%,100% {top:0;opacity:0}
}
@keyframes sparkSlide{
  0%,33%,62%,100%{opacity:0;left:50%}
  35%{opacity:1;left:20%}
  40%{left:75%}
  45%{left:25%}
  50%{left:72%}
  55%{left:48%}
  58%{opacity:1;left:55%}
  61%{opacity:0}
}

/* corner brackets — react to scan progress */
.corner{
  position:absolute;
  width:22px;height:22px;
  border:2.5px solid var(--yellow-deep);
  border-radius:4px;
  z-index:2;
  pointer-events:none;
  transition:none;
  animation:cornerPulse 9s ease-in-out infinite;
  filter:drop-shadow(0 0 0 rgba(245,197,24,0));
}
.corner.tl{top:6px;left:6px;border-right:none;border-bottom:none}
.corner.tr{top:6px;right:6px;border-left:none;border-bottom:none;animation-delay:.05s}
.corner.bl{bottom:6px;left:6px;border-right:none;border-top:none;animation-delay:.1s}
.corner.br{bottom:6px;right:6px;border-left:none;border-top:none;animation-delay:.15s}
@keyframes cornerPulse{
  0%,57%{
    border-color:var(--yellow-deep);
    filter:drop-shadow(0 0 0 rgba(245,197,24,0));
    transform:scale(1);
  }
  60%{
    border-color:#FFE968;
    filter:drop-shadow(0 0 10px rgba(255,222,40,.95));
    transform:scale(1.18);
  }
  68%,100%{
    border-color:var(--yellow-deep);
    filter:drop-shadow(0 0 0 rgba(245,197,24,0));
    transform:scale(1);
  }
}

/* "Распознано" badge at bottom of QR */
.qr-inner > .scan-detected{
  position:absolute;
  left:50%;bottom:10px;
  transform:translateX(-50%) translateY(8px);
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 12px 6px 8px;
  background:#0E1116;
  color:#FFE15A;
  border-radius:999px;
  font-family:'JetBrains Mono','Geist',monospace;
  font-size:10.5px;font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
  opacity:0;
  z-index:4;
  box-shadow:0 8px 20px -8px rgba(11,13,16,.6);
  animation:detectedShow 9s ease-in-out infinite;
}
.qr-inner > .scan-detected::before{
  content:"";
  width:12px;height:12px;
  border-radius:50%;
  background:#34C759;
  box-shadow:0 0 0 0 rgba(52,199,89,.6);
}
@keyframes detectedShow{
  0%,60%{opacity:0;transform:translateX(-50%) translateY(8px)}
  63%{opacity:1;transform:translateX(-50%) translateY(0)}
  66%{opacity:1;transform:translateX(-50%) translateY(0)}
  68%,100%{opacity:0;transform:translateX(-50%) translateY(-2px)}
}

.qr-foot{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 6px 4px;
}
.qr-foot > div:first-child{display:flex;flex-direction:column;gap:2px}
.qr-foot b{font-weight:700;font-size:18px;color:var(--ink);letter-spacing:-0.01em}
.qr-foot span{font-size:12px;color:var(--muted)}
.qr-foot-tag{
  padding:6px 10px;
  background:var(--chip);
  border-radius:8px;
  font-size:11px;font-weight:700;
  color:var(--ink);
  letter-spacing:.08em;
}

/* success scene */
.success-card{
  display:flex;align-items:center;gap:16px;
  padding:22px 26px;
  background:#fff;
  border-radius:20px;
  box-shadow:0 30px 60px -20px rgba(14,17,22,.18), 0 0 0 1px rgba(14,17,22,.06);
  min-width:min(82%, 380px);
}
.success-icon{flex-shrink:0}
.success-text{display:flex;flex-direction:column;gap:2px;flex:1}
.success-text b{font-weight:700;font-size:16px;color:var(--ink)}
.success-text span{font-size:13px;color:var(--muted)}
.success-amount{
  font-weight:700;
  font-size:15px;
  color:var(--ink);
  padding:8px 12px;
  background:var(--yellow);
  border-radius:10px;
}

.float-chip{
  opacity:0;
  transform:translateY(16px);
  animation:chipIn .7s cubic-bezier(.2,.7,.2,1) forwards;
}
.chip-rub{animation-delay:.8s}
.chip-usdt{animation-delay:1s}
@keyframes chipIn{
  to{opacity:1;transform:translateY(0)}
}

.hero-left > *{
  opacity:0;
  transform:translateY(20px);
  animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) forwards;
}
.hero-left > *:nth-child(1){animation-delay:.05s}
.hero-left > *:nth-child(2){animation-delay:.15s}
.hero-left > *:nth-child(3){animation-delay:.25s}
.hero-left > *:nth-child(4){animation-delay:.35s}
@keyframes fadeUp{
  to{opacity:1;transform:translateY(0)}
}

/* scroll-reveal */
.reveal{
  opacity:0;
  transform:translateY(30px);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.22s}
.reveal-delay-3{transition-delay:.34s}
.reveal-delay-4{transition-delay:.46s}

.float-chip{
  position:absolute;
  display:flex;align-items:center;gap:12px;
  padding:12px 18px 12px 12px;
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.9);
  border-radius:16px;
  box-shadow:0 14px 40px -16px rgba(14,17,22,.18);
  font-size:13px;
  z-index:2;
}
.float-chip b{display:block;font-weight:700;color:var(--ink);font-size:14px;margin-bottom:2px}
.float-chip span{color:var(--muted)}
.float-chip .chip-icon{
  width:38px;height:38px;
  display:grid;place-items:center;
  background:var(--yellow);
  border-radius:12px;
  font-weight:700;
  font-size:20px;
  color:var(--ink);
}
.chip-rub{top:-9%;left:-4%}
.chip-usdt{bottom:-9%;right:-2%}

/* responsive */
@media (max-width: 1024px){
  .hero,.value,.features,.web3{min-height:auto;display:block}
  .hero-inner{
    grid-template-columns:1fr;
    padding:56px 24px 80px;
    gap:48px;
  }
  .hero-right{min-height:420px}
  .card-stage{max-width:420px}
}
@media (max-width: 1024px){
  .scene-qr,.scene-success,.float-chip{display:none}
  .scene-card{animation:none;opacity:1}
  .hero{
    background:
      radial-gradient(120% 55% at 100% 0%, rgba(255,212,0,.32) 0%, rgba(255,212,0,0) 65%),
      radial-gradient(80% 40% at 0% 100%, rgba(255,243,168,.45) 0%, rgba(255,243,168,0) 70%),
      linear-gradient(180deg, #FFFEF6 0%, #FFFFFF 70%);
  }
}
@media (max-width: 600px){
  .hero-inner{padding:32px 18px 56px;gap:28px}
  .hero-eyebrow{font-size:11px;letter-spacing:.14em;gap:10px}
  .hero-eyebrow .bar{width:24px}
  .hero-left{gap:18px}
  .hero-title{font-size:clamp(28px, 8.5vw, 38px);letter-spacing:-0.03em}
  .hero-sub{font-size:14.5px;line-height:1.55}
  .hero-actions{margin-top:4px;gap:10px}
  .hero-cta,.btn-secondary{padding:13px 22px;font-size:14px}
  .hero-right{min-height:auto}
  .card-stage{max-width:280px;aspect-ratio:1/1;margin:0 auto}
  .card-img{filter:drop-shadow(0 24px 36px rgba(245,197,24,.22)) drop-shadow(0 12px 18px rgba(14,17,22,.10))}
}

/* ---- burger ---- */
.burger{
  display:none;
  width:44px;height:44px;
  background:var(--chip);
  border:none;
  border-radius:12px;
  cursor:pointer;
  position:relative;
  transition:.2s ease;
}
.burger:hover{background:#ECEEF1}
.burger span{
  position:absolute;
  left:12px;right:12px;height:2px;
  background:var(--ink);
  border-radius:2px;
  transition:.3s cubic-bezier(.2,.7,.2,1);
}
.burger span:nth-child(1){top:15px}
.burger span:nth-child(2){top:21px;width:14px}
.burger span:nth-child(3){top:27px}
body.menu-open .burger span:nth-child(1){top:21px;transform:rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){top:21px;transform:rotate(-45deg);width:auto;left:12px;right:12px}

/* ---- mobile drawer ---- */
.drawer{
  position:fixed;
  top:0;right:0;
  width:min(88vw, 380px);
  height:100dvh;
  background:#fff;
  box-shadow:-20px 0 50px -20px rgba(0,0,0,.15);
  transform:translateX(100%);
  transition:transform .35s cubic-bezier(.2,.7,.2,1);
  z-index:60;
  display:flex;flex-direction:column;
  padding:24px 24px 32px;
  overflow-y:auto;
}
body.menu-open .drawer{transform:translateX(0)}
.drawer-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:20px;
  border-bottom:1px solid var(--line);
  margin-bottom:20px;
}
.drawer-close{
  width:44px;height:44px;
  background:var(--chip);
  border:none;border-radius:12px;
  cursor:pointer;
  position:relative;
  transition:.2s ease;
}
.drawer-close:hover{background:#ECEEF1}
.drawer-close::before,.drawer-close::after{
  content:"";
  position:absolute;
  top:50%;left:50%;
  width:18px;height:2px;
  background:var(--ink);
  border-radius:2px;
}
.drawer-close::before{transform:translate(-50%,-50%) rotate(45deg)}
.drawer-close::after{transform:translate(-50%,-50%) rotate(-45deg)}
.drawer-menu{display:flex;flex-direction:column;gap:2px}
.drawer-menu a{
  padding:14px 16px;
  font-size:17px;font-weight:600;
  color:var(--ink);
  border-radius:12px;
  display:flex;justify-content:space-between;align-items:center;
}
.drawer-menu a:hover{background:var(--chip)}
.drawer-menu a::after{
  content:"→";
  color:var(--muted);
  font-weight:400;
}
.drawer-actions{
  margin-top:auto;
  padding-top:24px;
  display:flex;flex-direction:column;gap:10px;
}
.drawer-actions .btn-login,
.drawer-actions .btn-register{
  display:flex;justify-content:center;
  padding:14px;
  font-size:15px;
  width:100%;
}
.drawer-actions .btn-login{
  background:var(--chip);
  border-radius:14px;
}
.drawer-actions .btn-register{
  border-radius:14px;
}

.overlay{
  position:fixed;inset:0;
  background:rgba(14,17,22,.4);
  backdrop-filter:blur(4px);
  opacity:0;visibility:hidden;
  transition:.3s ease;
  z-index:55;
}
body.menu-open .overlay{opacity:1;visibility:visible}
body.menu-open{overflow:hidden}

/* breakpoints */
@media (max-width: 1024px){
  nav.menu{display:none}
  .nav{padding:14px 16px;gap:12px;grid-template-columns:auto 1fr auto}
  .burger{display:none}
  .drawer,.overlay{display:none !important}
  .actions{margin-left:auto;justify-content:flex-end}
  /* на мобильных показываем короткий вариант «Войти» */
  header .actions .btn-register .lbl-desktop{display:none}
  header .actions .btn-register .lbl-mobile{display:inline}
  header .actions .btn-register{padding:10px 20px;font-size:13.5px}
  header .actions .btn-register svg{display:none}
}
@media (max-width: 520px){
  .nav{padding:10px 14px;gap:10px}
  /* мелкий брендинг рядом с лого */
  header .logo{min-width:0;gap:9px}
  header .logo .logo-text{min-width:0;gap:1px}
  header .logo .logo-text b{font-size:14px;letter-spacing:-0.02em;line-height:1.1}
  header .logo .logo-text span{font-size:10.5px;line-height:1.2;letter-spacing:0}
  /* в подвале — оба текста видны (без изменений) */
  .logo-mark{width:34px;height:34px}
  .logo-img{height:var(--logo-h-mobile, 36px)}
  .burger{width:40px;height:40px;margin-left:2px}
  .btn-register{padding:10px 16px;font-size:13px}
  .btn-register svg{display:none}
}

/* ---------- VALUE PROPOSITION ---------- */
.value{
  background:#fff;
  border-bottom:1px solid var(--line);
  min-height:calc(100dvh - var(--header-h));
  display:flex;align-items:center;
}
.value-inner{
  width:100%;
  max-width:1360px;
  margin:0 auto;
  padding:64px 40px;
}
.value-head{
  max-width:780px;
  margin-bottom:clamp(28px, 4vh, 56px);
  display:flex;flex-direction:column;gap:clamp(12px, 2vh, 18px);
}
.value-title{
  font-size:clamp(26px, 3.4vw + 0.4rem, 48px);
  line-height:1.08;
  font-weight:600;
  letter-spacing:-0.03em;
  color:var(--ink);
}
.value-title .accent{
  color:var(--yellow-deep);
  font-weight:600;
}
.value-sub{
  font-size:clamp(14.5px, 0.35vw + 0.82rem, 17px);
  line-height:1.6;
  color:var(--ink-soft);
  max-width:620px;
}

.value-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
}
.value-card{
  position:relative;
  display:flex;flex-direction:column;
  gap:14px;
  padding:32px 28px 28px;
  background:#FAFAF7;
  border:1px solid var(--line);
  border-radius:20px;
  transition:.25s ease;
}
.value-card:hover{
  transform:translateY(-2px);
  border-color:#D9D6C6;
  box-shadow:0 14px 40px -22px rgba(14,17,22,.18);
}
.value-card.highlight{
  background:linear-gradient(180deg, #FFF8D6 0%, #FFFCEC 100%);
  border-color:rgba(245,197,24,.4);
}
.value-icon{
  width:56px;height:56px;
  background:var(--yellow);
  border-radius:14px;
  display:grid;place-items:center;
  margin-bottom:6px;
  color:var(--ink);
  box-shadow:inset 0 -3px 0 rgba(14,17,22,.06), 0 8px 22px -10px rgba(245,197,24,.7);
}
.value-icon svg{stroke:currentColor;stroke-width:1.75;width:26px;height:26px}
.value-card h3{
  font-size:clamp(18px, 0.5vw + 1rem, 22px);
  font-weight:600;
  letter-spacing:-0.02em;
  color:var(--ink);
  line-height:1.22;
}
.value-card p{
  font-size:clamp(13.5px, 0.3vw + 0.78rem, 15px);
  line-height:1.6;
  color:var(--ink-soft);
}
.value-tag{
  display:inline-flex;align-items:center;
  margin-top:auto;
  padding-top:18px;
  border-top:1px dashed rgba(14,17,22,.12);
  font-size:13px;font-weight:600;
  color:var(--ink);
  letter-spacing:-0.005em;
}

.value-foot{
  margin-top:clamp(24px, 3vh, 48px);
  padding:24px 28px;
  background:var(--ink);
  border-radius:18px;
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;
}
.value-foot p{
  color:#fff;
  font-size:clamp(14px, 0.3vw + 0.85rem, 17px);
  font-weight:500;
  max-width:560px;
  line-height:1.5;
}
.value-foot .btn-register{
  background:var(--yellow);
}

@media (max-width: 1024px){
  .value-inner{padding:72px 24px 80px}
  .value-grid{grid-template-columns:1fr;gap:14px}
  .value-card{padding:26px 22px 22px}
  .value-head{margin-bottom:36px}
}
@media (max-width: 520px){
  .value-inner{padding:56px 16px 64px}
  .value-foot{padding:20px;flex-direction:column;align-items:flex-start}
  .value-foot p{font-size:15px}
}

/* ---------- FEATURES (wallet capabilities) ---------- */
.features{
  position:relative;
  background:linear-gradient(180deg, #FFFCEC 0%, #FFFFFF 100%);
  border-bottom:1px solid var(--line);
  min-height:calc(100dvh - var(--header-h));
  display:flex;align-items:center;
}
.features-inner{
  width:100%;
  max-width:1360px;
  margin:0 auto;
  padding:64px 40px;
}
.features-head{
  max-width:780px;
  margin-bottom:clamp(24px, 3vh, 40px);
  display:flex;flex-direction:column;gap:clamp(10px, 1.5vh, 18px);
}

.features-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  grid-auto-rows:minmax(clamp(140px, 16vh, 200px), auto);
  gap:clamp(10px, 1vw, 16px);
}
.feat-card{
  position:relative;
  display:flex;flex-direction:column;
  gap:10px;
  padding:clamp(18px, 2vw, 26px) clamp(18px, 2vw, 24px);
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  transition:.25s ease;
  overflow:hidden;
}
.feat-card:hover{
  transform:translateY(-2px);
  border-color:#D9D6C6;
  box-shadow:0 18px 40px -22px rgba(14,17,22,.16);
}
.feat-wide{
  background:var(--ink);
  color:#fff;
  border-color:var(--ink);
}
.feat-wide:hover{border-color:var(--ink);box-shadow:0 24px 50px -22px rgba(14,17,22,.5)}
.feat-card.feat-wide h3{color:#fff}
.feat-card.feat-wide p{color:rgba(255,255,255,.7)}
.feat-card.feat-wide .feat-icon{background:var(--yellow);color:var(--ink)}
.feat-card.feat-wide .feat-tag{color:var(--yellow);border-top-color:rgba(255,255,255,.15)}

.feat-highlight{
  background:linear-gradient(180deg, #FFF8D6 0%, #FFFCEC 100%);
  border-color:rgba(245,197,24,.4);
}

.feat-icon{
  width:48px;height:48px;
  background:var(--yellow);
  color:var(--ink);
  border-radius:12px;
  display:grid;place-items:center;
  box-shadow:inset 0 -2px 0 rgba(14,17,22,.06), 0 6px 18px -10px rgba(245,197,24,.7);
}
.feat-icon svg{stroke:currentColor;stroke-width:1.75;width:22px;height:22px}

.feat-card h3{
  font-size:clamp(16px, 0.4vw + 0.9rem, 19px);
  font-weight:600;
  letter-spacing:-0.02em;
  color:var(--ink);
  line-height:1.25;
}
.feat-card p{
  font-size:clamp(13px, 0.25vw + 0.78rem, 14.5px);
  line-height:1.55;
  color:var(--ink-soft);
}
.feat-tag{
  display:inline-flex;align-items:center;
  margin-top:auto;
  padding-top:14px;
  border-top:1px dashed rgba(14,17,22,.12);
  font-size:12px;font-weight:600;
  letter-spacing:.02em;
  color:var(--ink-soft);
}

@media (max-width: 1280px){
  .features-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 1024px){
  .features-inner{padding:64px 24px}
  .features-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:auto}
}
@media (max-width: 600px){
  .features-inner{padding:48px 16px}
  .features-grid{grid-template-columns:1fr;gap:12px}
  .feat-card{padding:22px 20px 20px}
}

/* ---------- WEB3 + LICENSE ---------- */
.web3{
  position:relative;
  background:
    radial-gradient(1200px 700px at 90% 10%, #FFE968 0%, rgba(255,233,104,0) 60%),
    radial-gradient(900px 600px at 10% 90%, #F5C518 0%, rgba(245,197,24,0) 55%),
    linear-gradient(135deg, #FFD400 0%, #FFCC00 100%);
  overflow:hidden;
  padding:64px 0;
  border-bottom:1px solid rgba(14,17,22,.06);
  min-height:calc(100dvh - var(--header-h));
  display:flex;align-items:center;
}
.web3-inner{
  width:100%;
  max-width:1360px;
  margin:0 auto;
  padding:0 40px;
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:clamp(32px, 4vw, 60px);
  align-items:center;
}
.web3-content{display:flex;flex-direction:column;gap:22px;max-width:560px}
.hero-eyebrow .bar.dark{background:var(--ink)}

.web3-title{
  font-size:clamp(32px, 4.4vw + 0.4rem, 60px);
  line-height:1.05;
  font-weight:600;
  letter-spacing:-0.035em;
  color:var(--ink);
}
.web3-sub{
  font-size:clamp(15px, 0.4vw + 0.85rem, 18px);
  line-height:1.6;
  color:rgba(14,17,22,.78);
  max-width:520px;
}
.web3-actions{margin-top:10px}

.btn-dark{
  display:inline-flex;align-items:center;gap:8px;
  padding:16px 30px;
  font-size:15px;font-weight:600;
  background:var(--ink);
  color:#fff;
  border-radius:999px;
  transition:.25s ease;
  box-shadow:0 10px 30px -14px rgba(14,17,22,.5);
}
.btn-dark:hover{transform:translateY(-1px);background:#000}

.web3-media{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  min-height:auto;
}
.web3-video{
  width:100%;
  max-width:560px;
  height:auto;
  max-height:640px;
  object-fit:contain;
  filter:drop-shadow(0 40px 60px rgba(14,17,22,.25));
  border-radius:24px;
  background:transparent;
}

/* stats */
.web3-stats{
  max-width:1360px;
  margin:64px auto 0;
  padding:0 40px;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:16px;
}
.stat{
  padding:24px 26px;
  background:rgba(255,255,255,.45);
  border:1px solid rgba(255,255,255,.7);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-radius:20px;
  display:flex;flex-direction:column;gap:8px;
  transition:.25s ease;
}
.stat:hover{background:rgba(255,255,255,.65);transform:translateY(-2px)}
.stat-val{
  font-size:clamp(28px, 2vw + 0.6rem, 38px);
  font-weight:600;
  letter-spacing:-0.03em;
  color:var(--ink);
  line-height:1;
}
.stat-val small{
  font-size:13px;
  font-weight:600;
  color:rgba(14,17,22,.6);
  letter-spacing:0;
  margin-left:4px;
}
.stat-val .pct{font-weight:600}
.stat-label{
  font-size:14px;
  color:rgba(14,17,22,.7);
  font-weight:500;
}

@media (max-width: 1024px){
  .web3{padding:52px 0 52px}
  .web3-inner{grid-template-columns:1fr;gap:32px;padding:0 24px}
  .web3-media{order:2}
  .web3-video{max-width:380px}
}
@media (max-width: 600px){
  .web3{padding:44px 0 44px}
  .web3-inner{padding:0 16px;gap:24px}
  .web3-video{max-width:300px}
}

/* ---------- HOW IT WORKS ---------- */
.how{
  background:#FAFAF7;
  border-bottom:1px solid var(--line);
  min-height:calc(100dvh - var(--header-h));
  display:flex;align-items:center;
}
.how-inner{
  width:100%;
  max-width:1360px;
  margin:0 auto;
  padding:64px 40px;
}
.how-head{
  max-width:780px;
  margin-bottom:clamp(36px, 5vh, 64px);
  display:flex;flex-direction:column;gap:clamp(12px, 2vh, 18px);
}

.how-steps{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}
.how-line{
  position:absolute;
  top:32px;
  left:8%;right:8%;
  height:2px;
  background-image:linear-gradient(to right, var(--yellow-deep) 50%, transparent 50%);
  background-size:14px 2px;
  background-repeat:repeat-x;
  z-index:0;
}

.step{
  position:relative;
  z-index:1;
  display:flex;flex-direction:column;gap:14px;
  padding:24px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  transition:.25s ease;
}
.step:hover{
  transform:translateY(-3px);
  border-color:#D9D6C6;
  box-shadow:0 18px 40px -22px rgba(14,17,22,.16);
}
.step-num{
  font-size:13px;
  font-weight:700;
  letter-spacing:.18em;
  color:var(--yellow-deep);
}
.step-icon{
  width:56px;height:56px;
  background:var(--yellow);
  color:var(--ink);
  border-radius:14px;
  display:grid;place-items:center;
  box-shadow:inset 0 -2px 0 rgba(14,17,22,.06), 0 8px 22px -10px rgba(245,197,24,.7);
}
.step-icon svg{stroke:currentColor;stroke-width:1.75;width:26px;height:26px}
.step h3{
  font-size:clamp(18px, 0.5vw + 1rem, 22px);
  font-weight:600;
  letter-spacing:-0.02em;
  color:var(--ink);
  line-height:1.22;
}
.step p{
  font-size:clamp(13px, 0.25vw + 0.78rem, 14.5px);
  line-height:1.55;
  color:var(--ink-soft);
}

.how-foot{
  margin-top:clamp(28px, 4vh, 48px);
  padding:20px 28px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;
}
.how-foot-text{
  font-size:15px;font-weight:500;
  color:var(--ink-soft);
}

@media (max-width: 1024px){
  .how{min-height:auto;display:block}
  .how-inner{padding:64px 24px}
  .how-steps{grid-template-columns:repeat(2,1fr);gap:14px}
  .how-line{display:none}
}
@media (max-width: 600px){
  .how-inner{padding:48px 16px}
  .how-steps{grid-template-columns:1fr;gap:12px}
  .how-foot{padding:16px 20px;flex-direction:column;align-items:flex-start}
}

/* ---------- PRICING ---------- */
.pricing{
  background:#FAFAF7;
  border-bottom:1px solid var(--line);
  min-height:calc(100dvh - var(--header-h));
  display:flex;align-items:center;
}
.pricing-inner{
  width:100%;
  max-width:1360px;
  margin:0 auto;
  padding:64px 40px;
}
.pricing-head{
  max-width:780px;
  margin-bottom:clamp(28px, 4vh, 56px);
  display:flex;flex-direction:column;gap:clamp(12px, 2vh, 18px);
}

.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
  align-items:stretch;
}
.plan{
  position:relative;
  display:flex;flex-direction:column;
  padding:32px 28px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  transition:.25s ease;
}
.plan:hover{
  transform:translateY(-3px);
  border-color:#D9D6C6;
  box-shadow:0 18px 40px -22px rgba(14,17,22,.16);
}
.plan-featured{
  background:linear-gradient(180deg, #FFFCEC 0%, #FFFFFF 100%);
  border:1px solid rgba(245,197,24,.5);
  box-shadow:0 24px 60px -28px rgba(245,197,24,.5);
}
.plan-badge{
  position:absolute;
  top:-12px;left:50%;
  transform:translateX(-50%);
  padding:6px 14px;
  background:var(--yellow);
  color:var(--ink);
  border-radius:999px;
  font-size:12px;font-weight:700;
  letter-spacing:.02em;
  box-shadow:0 8px 20px -8px rgba(245,197,24,.7);
}

.plan-head{
  display:flex;flex-direction:column;gap:6px;
  padding-bottom:18px;
  border-bottom:1px dashed var(--line);
}
.plan-head h3{
  font-size:clamp(20px, 0.6vw + 1rem, 24px);
  font-weight:600;
  letter-spacing:-0.025em;
  color:var(--ink);
}
.plan-head p{
  font-size:14px;
  color:var(--ink-soft);
  line-height:1.5;
}

.plan-price{
  padding:18px 0 14px;
}
.plan-price .amount{
  font-size:clamp(22px, 1.4vw + 0.6rem, 30px);
  font-weight:600;
  letter-spacing:-0.025em;
  color:var(--ink);
}

.plan-list{
  list-style:none;
  display:flex;flex-direction:column;gap:10px;
  margin:6px 0 24px;
  flex:1;
}
.plan-list li{
  display:flex;align-items:flex-start;gap:10px;
  font-size:14px;
  color:var(--ink-soft);
  line-height:1.4;
}
.plan-list li i{
  flex-shrink:0;
  margin-top:1px;
  color:var(--yellow-deep);
}
.plan-list li i svg{stroke:currentColor;stroke-width:2.5;width:16px;height:16px}
.plan-list li.muted{color:var(--muted)}
.plan-list li.muted i{color:var(--muted)}

.plan-cta{
  display:flex;justify-content:center;
  width:100%;
  padding:14px;
  font-size:14px;
  margin-top:auto;
}

@media (max-width: 1024px){
  .pricing{min-height:auto;display:block}
  .pricing-inner{padding:64px 24px}
  .pricing-grid{grid-template-columns:1fr;gap:14px;max-width:520px;margin:0 auto}
  .plan{padding:28px 24px}
  .plan-featured{order:-1}
}
@media (max-width: 600px){
  .pricing-inner{padding:48px 16px}
  .plan{padding:24px 20px}
}

/* ---------- FOOTER ---------- */
.footer{
  background:var(--ink);
  color:rgba(255,255,255,.7);
}
.footer-inner{
  max-width:1360px;
  margin:0 auto;
  padding:48px 40px 32px;
  display:flex;flex-direction:column;gap:32px;
}
.footer-logo{color:#fff}
.footer-logo .logo-text b{color:#fff}
.footer-logo .logo-text span{color:rgba(255,255,255,.55)}

.footer-links{
  display:flex;flex-wrap:wrap;gap:8px 28px;
  padding:24px 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.footer-links a{
  font-size:14px;font-weight:500;
  color:rgba(255,255,255,.7);
  transition:.2s ease;
}
.footer-links a:hover{color:#fff}

.footer-bottom{
  font-size:13px;
  color:rgba(255,255,255,.45);
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
}
.footer-social{display:flex;gap:10px}
.footer-social a{
  width:40px;height:40px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.7);
  border:1px solid rgba(255,255,255,.08);
  transition:.2s ease;
}
.footer-social a:hover{
  background:var(--accent);
  color:#0a0a0a;
  border-color:var(--accent);
  transform:translateY(-2px);
}
.footer-social i{width:18px;height:18px}

@media (max-width: 600px){
  .footer-inner{padding:36px 20px 24px;gap:24px}
  .footer-links{flex-direction:column;gap:12px;padding:20px 0}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:16px}
}

/* ---------- LEGAL PAGES ---------- */
.legal{
  padding:80px 0 96px;
  background:#fff;
}
.legal-inner{
  max-width:820px;
  margin:0 auto;
  padding:0 40px;
}
.legal-back{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:500;
  color:var(--ink-soft);
  margin-bottom:32px;
  transition:.2s ease;
}
.legal-back:hover{color:var(--ink)}
.legal h1{
  font-size:clamp(28px, 3.4vw + 0.4rem, 44px);
  line-height:1.1;
  font-weight:600;
  letter-spacing:-0.025em;
  color:var(--ink);
  margin-bottom:14px;
}
.legal .legal-meta{
  font-size:13px;
  color:var(--muted);
  margin-bottom:36px;
  padding-bottom:24px;
  border-bottom:1px solid var(--line);
  letter-spacing:.05em;
  text-transform:uppercase;
}
.legal h2{
  font-size:clamp(18px, 1vw + 0.7rem, 22px);
  font-weight:600;
  letter-spacing:-0.02em;
  color:var(--ink);
  margin:32px 0 14px;
}
.legal p, .legal li{
  font-size:15px;
  line-height:1.7;
  color:var(--ink-soft);
  margin-bottom:12px;
}
.legal ul,.legal ol{
  padding-left:22px;
  margin-bottom:12px;
}
.legal li{margin-bottom:8px}
.legal strong{color:var(--ink);font-weight:600}
@media (max-width: 600px){
  .legal{padding:48px 0 64px}
  .legal-inner{padding:0 20px}
}

/* ---------- FAQ ---------- */
.faq{
  background:#fff;
  border-bottom:1px solid var(--line);
  min-height:calc(100dvh - var(--header-h));
  display:flex;align-items:center;
}
.faq-inner{
  width:100%;
  max-width:920px;
  margin:0 auto;
  padding:64px 40px;
}
.faq-head{
  text-align:center;
  margin-bottom:clamp(28px, 4vh, 48px);
  display:flex;flex-direction:column;gap:clamp(12px, 2vh, 18px);
  align-items:center;
}
.faq-head .hero-eyebrow{align-self:center}
.faq-head .value-sub{max-width:560px;margin:0 auto}

.faq-list{
  display:flex;flex-direction:column;gap:10px;
}
.faq-item{
  background:#FAFAF7;
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  transition:.25s ease;
}
.faq-item:hover{border-color:#D9D6C6}
.faq-item[open]{
  background:#fff;
  border-color:rgba(245,197,24,.4);
  box-shadow:0 18px 40px -22px rgba(245,197,24,.25);
}
.faq-item summary{
  display:flex;align-items:center;gap:18px;
  padding:22px 26px;
  cursor:pointer;
  list-style:none;
  user-select:none;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-q{
  flex:1;
  font-size:clamp(15px, 0.4vw + 0.85rem, 18px);
  font-weight:600;
  color:var(--ink);
  letter-spacing:-0.02em;
  line-height:1.4;
}
.faq-toggle{
  flex-shrink:0;
  width:38px;height:38px;
  background:var(--chip);
  border-radius:50%;
  display:grid;place-items:center;
  transition:.25s ease;
  position:relative;
}
.faq-toggle::before,.faq-toggle::after{
  content:"";
  position:absolute;
  width:14px;height:2px;
  background:var(--ink);
  border-radius:2px;
  transition:.25s ease;
}
.faq-toggle::after{transform:rotate(90deg)}
.faq-item[open] .faq-toggle{background:var(--yellow);transform:rotate(180deg)}
.faq-item[open] .faq-toggle::after{transform:rotate(0deg);opacity:0}
.faq-a{
  padding:0 26px 24px 26px;
  font-size:15px;
  line-height:1.65;
  color:var(--ink-soft);
  max-width:720px;
}

@media (max-width: 1024px){
  .faq{min-height:auto;display:block}
  .faq-inner{padding:56px 24px}
}
@media (max-width: 600px){
  .faq-inner{padding:44px 16px}
  .faq-item summary{padding:18px 18px;gap:14px}
  .faq-a{padding:0 18px 20px 18px;font-size:14px}
  .faq-toggle{width:32px;height:32px}
  .faq-head{text-align:left;align-items:flex-start}
  .faq-head .hero-eyebrow{align-self:flex-start}
}

/* ---------- FINAL CTA ---------- */
.cta{
  position:relative;
  background:linear-gradient(180deg, #FFFEF6 0%, #FFFCEC 100%);
  color:var(--ink);
  overflow:hidden;
  padding:110px 0;
  border-bottom:1px solid var(--line);
}
.cta-bg{
  position:absolute;inset:-10%;
  pointer-events:none;
  background:
    radial-gradient(420px 320px at 20% 30%, rgba(255,212,0,.45) 0%, transparent 60%),
    radial-gradient(380px 280px at 80% 70%, rgba(255,243,168,.55) 0%, transparent 60%),
    radial-gradient(300px 240px at 50% 90%, rgba(255,200,0,.30) 0%, transparent 65%);
  animation:ctaBgFlow 18s ease-in-out infinite;
  filter:blur(6px);
}
@keyframes ctaBgFlow{
  0%,100%{transform:translate(0%, 0%) scale(1)}
  25%{transform:translate(3%, -2%) scale(1.05)}
  50%{transform:translate(-2%, 2%) scale(.98)}
  75%{transform:translate(2%, 3%) scale(1.04)}
}

.cta-inner{
  position:relative;
  max-width:880px;
  margin:0 auto;
  padding:0 40px;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:26px;
}

.cta .hero-eyebrow{align-self:center}
.cta .hero-eyebrow .bar.light{background:var(--yellow-deep)}

.cta-title{
  font-size:clamp(34px, 5vw + 0.4rem, 68px);
  line-height:1.04;
  font-weight:600;
  letter-spacing:-0.035em;
  color:var(--ink);
  max-width:780px;
}
.cta-title .accent{
  color:var(--yellow-deep);
  font-weight:600;
}

.cta-sub{
  font-size:clamp(15px, 0.4vw + 0.85rem, 18px);
  line-height:1.6;
  color:var(--ink-soft);
  max-width:560px;
}

.cta-actions{
  display:flex;flex-wrap:wrap;gap:18px;
  align-items:center;justify-content:center;
  margin-top:10px;
}
.cta-primary{
  padding:18px 34px;
  font-size:15.5px;
  box-shadow:0 18px 40px -14px rgba(245,197,24,.7);
}
.cta-primary:hover{box-shadow:0 22px 48px -14px rgba(245,197,24,.9)}
.cta-secondary{
  font-size:14.5px;font-weight:500;
  color:var(--ink-soft);
  padding:8px 4px;
  transition:.2s;
  border-bottom:1px solid transparent;
}
.cta-secondary:hover{color:var(--ink);border-bottom-color:var(--ink)}

@media (max-width: 1024px){
  .cta{padding:72px 0}
  .cta-inner{padding:0 24px;gap:20px}
}
@media (max-width: 600px){
  .cta{padding:56px 0}
  .cta-inner{padding:0 18px;gap:18px}
  .cta-actions{flex-direction:column;gap:14px}
  .cta-primary{width:100%;justify-content:center}
}

/* ---------- MOBILE BOTTOM NAV ---------- */
.mobnav{display:none}

@media (max-width: 1024px){
  .mobnav{
    display:flex;
    position:fixed;
    left:10px;right:10px;
    bottom:calc(10px + env(safe-area-inset-bottom, 0px));
    z-index:60;
    padding:8px 6px;
    background:rgba(255,255,255,.85);
    backdrop-filter:saturate(1.5) blur(18px);
    -webkit-backdrop-filter:saturate(1.5) blur(18px);
    border:1px solid rgba(14,17,22,.06);
    border-radius:22px;
    box-shadow:0 18px 40px -14px rgba(14,17,22,.18), 0 4px 14px -6px rgba(14,17,22,.08);
    justify-content:space-around;
    align-items:stretch;
    gap:4px;
  }
  .mobnav-item{
    flex:1;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;
    padding:8px 4px;
    border-radius:14px;
    font-size:10.5px;font-weight:600;
    letter-spacing:-0.005em;
    color:var(--ink-soft);
    transition:.18s ease;
  }
  .mobnav-item i,.mobnav-item svg{
    width:22px;height:22px;
    stroke-width:1.8;
    flex-shrink:0;
  }
  .mobnav-item:hover{color:var(--ink);background:rgba(14,17,22,.04)}
  .mobnav-item.active{color:var(--ink)}
  .mobnav-item.active i,.mobnav-item.active svg{color:var(--yellow-deep)}

  .mobnav-cta{
    color:var(--ink);
  }
  .mobnav-cta i,.mobnav-cta svg{
    background:var(--yellow);
    color:var(--ink);
    border-radius:10px;
    padding:5px;
    width:30px;height:30px;
    box-shadow:0 6px 14px -6px rgba(245,197,24,.7);
  }

  /* content padding to clear bottom nav */
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom, 0px))}
  .footer{margin-bottom:0}
}

@media (max-width: 380px){
  .mobnav-item{font-size:9.5px;padding:7px 2px;gap:2px}
  .mobnav-item i,.mobnav-item svg{width:20px;height:20px}
}