:root{
    --bg-0:#050a16;
    --bg-1:#071228;
    --bg-2:#0a1830;
    --cyan:#2dd9d2;
    --cyan-soft:#7df0e8;
    --cyan-deep:#0c9c93;
    --blue-deep:#0d2a63;
    --blue-mid:#1c5fd6;
    --text-hi:#f4f9fb;
    --text-mid:#a9bdd6;
    --text-low:#5d7290;
    --glass-fill:rgba(10,24,48,0.50);
    --glass-fill-strong:rgba(13,29,56,0.72);
    --line:rgba(255,255,255,0.08);
    --line-strong:rgba(255,255,255,0.16);
    --radius-card:22px;
    --gold:#f3cd7e;
    --gold-deep:#c9962f;
    --shadow-deep: 0 30px 80px -22px rgba(0,0,0,0.75), 0 0 0 1px rgba(255,255,255,0.02) inset;
    --shadow-glow: 0 0 60px -18px rgba(45,217,210,0.35);
  }
  html[data-theme="light"]{
    --bg-0:#eef6fa;
    --bg-1:#e6f3f6;
    --bg-2:#dbeef2;
    --cyan:#0c9c93;
    --cyan-soft:#0c9c93;
    --cyan-deep:#067b73;
    --text-hi:#0a1830;
    --text-mid:#3e5670;
    --text-low:#7f93a8;
    --glass-fill:rgba(255,255,255,0.55);
    --glass-fill-strong:rgba(255,255,255,0.78);
    --line:rgba(10,30,50,0.08);
    --line-strong:rgba(10,30,50,0.16);
    --shadow-deep: 0 30px 80px -22px rgba(20,80,110,0.22), 0 0 0 1px rgba(255,255,255,0.6) inset;
    --shadow-glow: 0 0 60px -18px rgba(12,156,147,0.25);
    --gold:#b9842a;
    --gold-deep:#8f661f;
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{ scroll-behavior:smooth; }
  body{
    font-family:'Inter', system-ui, sans-serif;
    background:var(--bg-0); color:var(--text-hi);
    min-height:100vh; overflow-x:hidden; position:relative;
    transition:background .5s ease, color .5s ease;
  }
  h1,h2,h3,.font-display{ font-family:'Poppins', sans-serif; }
  ::selection{ background:rgba(45,217,210,0.3); }
  img{ display:block; max-width:100%; }
  .container{ max-width:1180px; margin:0 auto; padding:0 32px; }

  /* ---------- background atmosphere ---------- */
  .bg-vignette{ position:fixed; inset:0; z-index:0; background:radial-gradient(ellipse 70% 50% at 50% 0%, transparent 30%, var(--bg-0) 95%); pointer-events:none; }
  .bg-glow-top{ position:fixed; top:-12%; left:50%; transform:translateX(-50%); width:1200px; height:800px; background:radial-gradient(ellipse 50% 45% at 50% 0%, rgba(28,95,214,0.30), rgba(45,217,210,0.10) 40%, transparent 72%); filter:blur(14px); z-index:0; pointer-events:none; transition:opacity .5s ease; }
  html[data-theme="light"] .bg-glow-top{ opacity:.45; }
  .bg-rain{ position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.35;
    background-image: repeating-linear-gradient(100deg, transparent 0 38px, var(--line) 38px 39px);
    mask-image: radial-gradient(ellipse 75% 60% at 50% 10%, black 5%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse 75% 60% at 50% 10%, black 5%, transparent 70%);
  }
  .bg-dots{ position:fixed; inset:0; z-index:0; opacity:.5; pointer-events:none;
    background-image: radial-gradient(var(--line-strong) 1px, transparent 1px);
    background-size:60px 60px; background-position:center -10px;
    mask-image: radial-gradient(ellipse 70% 45% at 50% 8%, black 0%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse 70% 45% at 50% 8%, black 0%, transparent 70%);
  }

  /* ---------- nav ---------- */
  header{ position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; max-width:1180px; margin:0 auto; padding:20px 32px; }
  .header-fill{ position:fixed; top:0; left:0; right:0; height:80px; z-index:40; background:linear-gradient(var(--bg-0), rgba(5,10,22,0)); backdrop-filter:blur(10px); -webkit-mask-image:linear-gradient(black 55%, transparent); pointer-events:none; }
  .brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:17px; letter-spacing:-0.01em; color:var(--text-hi); font-family:'Poppins',sans-serif; }
  .brand-mark{ width:30px; height:30px; }

  .nav-links{ display:flex; align-items:center; gap:30px; }
  .nav-links a{ font-size:13.5px; font-weight:500; color:var(--text-mid); text-decoration:none; transition:color .2s ease; }
  .nav-links a:hover{ color:var(--text-hi); }

  .btn-pill{
    display:inline-flex; align-items:center; gap:8px; padding:10px 22px; border-radius:999px;
    font-size:13.5px; font-weight:600; cursor:pointer; text-decoration:none; border:1px solid var(--line-strong);
    background:linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02));
    color:var(--text-hi); transition:all .25s ease; position:relative; overflow:hidden;
  }
  .btn-pill::before{ content:""; position:absolute; top:0; bottom:0; left:0; width:40%; background:linear-gradient(90deg, transparent, rgba(255,255,255,0.55), transparent); transform:translateX(-130%) skewX(-18deg); pointer-events:none; }
  .btn-pill:hover::before{ animation:btnShine .85s ease; }
  .btn-pill:hover{ border-color:rgba(45,217,210,0.55); box-shadow:0 0 0 1px rgba(45,217,210,0.18), 0 10px 26px -10px rgba(45,217,210,0.45); transform:translateY(-1px); }
  .btn-pill.primary{ background:linear-gradient(180deg, var(--cyan-soft), var(--cyan)); color:#04241f; border-color:rgba(255,255,255,0.4); font-weight:700; }
  .btn-pill.primary:hover{ filter:brightness(1.05); box-shadow:0 12px 30px -10px rgba(45,217,210,0.6); }

  /* ---------- hero ---------- */
  .hero{ position:relative; z-index:3; padding:64px 0 70px; overflow:hidden; }
  .hero-bg{ position:absolute; inset:0; z-index:-1; --img-op:.4; }
  .hero-bg img{ width:100%; height:100%; object-fit:cover; }
  .hero-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, var(--bg-0) 0%, rgba(5,10,22,0.55) 35%, var(--bg-0) 100%); }
  .hero-inner{ max-width:740px; margin:0 auto; text-align:center; padding:0 24px; }
  .eyebrow{ display:inline-flex; align-items:center; gap:10px; font-size:12.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--cyan-soft); background:rgba(45,217,210,0.08); border:1px solid rgba(45,217,210,0.25); padding:7px 16px; border-radius:999px; margin-bottom:26px; animation:heroPop .7s cubic-bezier(.16,1,.3,1) both; }
  .eyebrow .dot{ width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 8px var(--cyan); animation:dotPulse 2.4s ease-in-out .8s infinite; }
  .hero h1{ font-size:64px; line-height:1.05; font-weight:800; letter-spacing:-0.03em; margin-bottom:22px;
    background:linear-gradient(180deg, #ffffff 10%, var(--cyan-soft) 70%, var(--cyan) 100%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
    filter:drop-shadow(0 0 44px rgba(45,217,210,0.28));
    animation:heroRise .9s cubic-bezier(.16,1,.3,1) .14s both, glowBreathe 4.5s ease-in-out 1.2s infinite;
  }
  html[data-theme="light"] .hero h1{ background:linear-gradient(180deg, #0a1830 0%, var(--cyan-deep) 90%); -webkit-background-clip:text; background-clip:text; filter:none; animation:heroRise .9s cubic-bezier(.16,1,.3,1) .14s both; }
  .hero p.sub{ font-size:17.5px; line-height:1.65; color:var(--text-mid); max-width:520px; margin:0 auto 36px; animation:heroRise .9s cubic-bezier(.16,1,.3,1) .3s both; }
  .hero-cta{ display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:64px; animation:heroPop .8s cubic-bezier(.16,1,.3,1) .46s both; }
  .hero-cta .btn-pill{ padding:13px 26px; font-size:14.5px; }

  .stat-strip{ display:flex; align-items:stretch; justify-content:center; gap:0; max-width:920px; margin:0 auto; border-radius:20px; overflow:hidden; background:var(--glass-fill); border:1px solid var(--line-strong); backdrop-filter:blur(20px); box-shadow:var(--shadow-deep); }
  .stat-cell{ flex:1; padding:24px 18px; text-align:center; border-right:1px solid var(--line); }
  .stat-cell:last-child{ border-right:none; }
  .stat-cell .num{ font-family:'Poppins',sans-serif; font-size:25px; font-weight:700; color:var(--text-hi); margin-bottom:4px; }
  .stat-cell .lbl{ font-size:12px; color:var(--text-low); letter-spacing:.02em; }

  /* ---------- animation keyframes ---------- */
  @keyframes heroRise{ from{ opacity:0; transform:translateY(32px); } to{ opacity:1; transform:translateY(0); } }
  @keyframes heroPop{ from{ opacity:0; transform:translateY(14px) scale(.92); } to{ opacity:1; transform:translateY(0) scale(1); } }
  @keyframes heroFade{ from{ opacity:0; } to{ opacity:1; } }
  @keyframes glowBreathe{ 0%,100%{ filter:drop-shadow(0 0 44px rgba(45,217,210,0.28)); } 50%{ filter:drop-shadow(0 0 70px rgba(45,217,210,0.5)); } }
  @keyframes glowBreatheGold{ 0%,100%{ filter:drop-shadow(0 0 16px rgba(243,205,126,0.35)); } 50%{ filter:drop-shadow(0 0 30px rgba(243,205,126,0.6)); } }
  @keyframes dotPulse{ 0%,100%{ box-shadow:0 0 8px var(--cyan); transform:scale(1); } 50%{ box-shadow:0 0 16px var(--cyan), 0 0 3px var(--cyan-soft); transform:scale(1.3); } }
  @keyframes vShimmer{ 0%{ background-position:0% 0; } 100%{ background-position:-220% 0; } }
  @keyframes btnShine{ from{ transform:translateX(-130%) skewX(-18deg); } to{ transform:translateX(230%) skewX(-18deg); } }

  /* ---------- reveal (scroll-triggered entrance) ---------- */
  .reveal{ opacity:0; transform:translateY(26px) scale(.97); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
  .reveal.visible{ opacity:1; transform:translateY(0) scale(1); }
  .reveal-left{ opacity:0; transform:translateX(-46px); transition:opacity .85s cubic-bezier(.16,1,.3,1), transform .85s cubic-bezier(.16,1,.3,1); }
  .reveal-left.visible{ opacity:1; transform:translateX(0); }
  .reveal-right{ opacity:0; transform:translateX(46px); transition:opacity .85s cubic-bezier(.16,1,.3,1), transform .85s cubic-bezier(.16,1,.3,1); }
  .reveal-right.visible{ opacity:1; transform:translateX(0); }

  /* staggered cascade for grid/list children */
  .feature-grid .reveal:nth-child(1),.tools-grid .reveal:nth-child(1),.steps-row .reveal:nth-child(1),.trust-grid .reveal:nth-child(1),.about-list .reveal:nth-child(1){ transition-delay:0s; }
  .feature-grid .reveal:nth-child(2),.tools-grid .reveal:nth-child(2),.steps-row .reveal:nth-child(2),.trust-grid .reveal:nth-child(2),.about-list .reveal:nth-child(2){ transition-delay:.09s; }
  .feature-grid .reveal:nth-child(3),.tools-grid .reveal:nth-child(3),.steps-row .reveal:nth-child(3),.trust-grid .reveal:nth-child(3),.about-list .reveal:nth-child(3){ transition-delay:.18s; }
  .feature-grid .reveal:nth-child(4),.tools-grid .reveal:nth-child(4),.steps-row .reveal:nth-child(4),.trust-grid .reveal:nth-child(4),.about-list .reveal:nth-child(4){ transition-delay:.27s; }
  .feature-grid .reveal:nth-child(5),.steps-row .reveal:nth-child(5){ transition-delay:.36s; }
  .feature-grid .reveal:nth-child(6),.steps-row .reveal:nth-child(6){ transition-delay:.45s; }

  /* animated underline accent that draws in under section titles */
  .section-title{ position:relative; }
  .section-head .section-title::after{ content:""; display:block; width:0; height:3px; margin:16px auto 0; border-radius:999px; background:linear-gradient(90deg, var(--cyan), var(--cyan-soft)); transition:width .8s cubic-bezier(.16,1,.3,1) .25s; }
  .section-head.reveal.visible .section-title::after{ width:64px; }

  /* ---------- image load-up: instant fade, no blur/scale wind-up ---------- */
  .img-reveal{ overflow:hidden; --img-op:1; }
  .img-reveal:not(.loaded){ background:linear-gradient(100deg, var(--glass-fill) 15%, var(--line-strong) 40%, var(--glass-fill) 65%); background-size:220% 100%; animation:vShimmer 1.6s ease-in-out infinite; }
  .img-reveal img{ opacity:0; transition:opacity .16s linear; }
  .img-reveal.loaded{ animation:none; background:none; }
  .img-reveal.loaded img{ opacity:var(--img-op); }
  .img-reveal.loaded:hover img{ transform:scale(1.035); transition:transform .35s cubic-bezier(.16,1,.3,1), opacity .16s linear; }

  /* price glow pulse - premium accent on price tags */
  .ultimate-price .amt, .price-glow{ animation:glowBreatheGold 4.5s ease-in-out infinite; }

  /* staggered numbered-step cascade */
  .vsteps .vstep:nth-child(1){ transition-delay:0s; }
  .vsteps .vstep:nth-child(2){ transition-delay:.1s; }
  .vsteps .vstep:nth-child(3){ transition-delay:.2s; }
  .vsteps .vstep:nth-child(4){ transition-delay:.3s; }

  @media (prefers-reduced-motion: reduce){
    .reveal, .reveal-left, .reveal-right{ opacity:1; transform:none; transition:none; }
    .section-head .section-title::after{ transition:none; width:64px; }
    .hero .eyebrow, .page-hero .eyebrow, .eyebrow .dot, .hero h1, .page-hero h1, .hero p.sub, .page-hero p, .hero-cta, .crumb-row, .ultimate-price .amt, .price-glow{ animation:none !important; }
    .img-reveal, .img-reveal img{ animation:none !important; transition:none !important; }
    .img-reveal img{ opacity:1 !important; transform:none !important; filter:none !important; }
    .btn-pill::before{ display:none !important; }
  }

  /* ---------- sections ---------- */
  .section{ position:relative; z-index:3; padding:130px 0 0; }
  .section-head{ max-width:600px; margin:0 auto 54px; text-align:center; }
  .eyebrow-sm{ display:inline-block; font-size:12.5px; font-weight:650; letter-spacing:.07em; text-transform:uppercase; color:var(--cyan-soft); margin-bottom:14px; }
  .section-title{ font-size:36px; font-weight:750; letter-spacing:-0.025em; line-height:1.18; margin-bottom:14px; }
  .section-sub{ font-size:16px; line-height:1.6; color:var(--text-mid); }

  /* ---------- glass card base ---------- */
  .glass{ background:var(--glass-fill); border:1px solid var(--line-strong); backdrop-filter:blur(24px) saturate(140%); -webkit-backdrop-filter:blur(24px) saturate(140%); box-shadow:var(--shadow-deep); position:relative; }
  .glass::before{ content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; background:linear-gradient(160deg, rgba(255,255,255,0.32), rgba(255,255,255,0) 35%, rgba(255,255,255,0) 65%, rgba(255,255,255,0.07)); -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; }
  .corner-dot{ position:absolute; width:5px; height:5px; border-radius:50%; background:var(--line-strong); }
  .corner-dot.tl{ top:12px; left:12px; } .corner-dot.tr{ top:12px; right:12px; }
  .corner-dot.bl{ bottom:12px; left:12px; } .corner-dot.br{ bottom:12px; right:12px; }

  /* ---------- 3D icon ---------- */
  .icon3d{ width:52px; height:52px; border-radius:16px; position:relative; flex-shrink:0; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(145deg, rgba(255,255,255,0.16), rgba(255,255,255,0.02));
    border:1px solid var(--line-strong);
    box-shadow: 0 1px 0 rgba(255,255,255,0.18) inset, 0 -10px 18px -12px rgba(0,0,0,0.55) inset, 0 14px 26px -12px rgba(0,0,0,0.55), 0 0 24px -8px rgba(45,217,210,0.45);
    transform:perspective(600px) rotateX(10deg) rotateY(-10deg);
    transition:transform .45s cubic-bezier(.16,1,.3,1);
  }
  .icon3d::after{ content:""; position:absolute; top:3px; left:9px; right:9px; height:46%; background:linear-gradient(180deg, rgba(255,255,255,0.3), transparent); border-radius:50% 50% 60% 60% / 100% 100% 60% 60%; pointer-events:none; opacity:.55; }
  .icon3d svg{ position:relative; z-index:1; filter:drop-shadow(0 2px 5px rgba(0,0,0,0.45)); width:24px; height:24px; }
  .icon3d.sm{ width:34px; height:34px; border-radius:11px; } .icon3d.sm svg{ width:16px; height:16px; }

  /* ---------- about section ---------- */
  .about-grid{ display:grid; grid-template-columns:1fr 0.9fr; gap:60px; align-items:center; }
  .about-copy .eyebrow-sm{ display:block; }
  .about-copy h2{ font-size:33px; font-weight:750; letter-spacing:-0.02em; line-height:1.2; margin-bottom:16px; }
  .about-copy > p{ font-size:15.5px; line-height:1.7; color:var(--text-mid); margin-bottom:26px; }
  .about-list{ display:flex; flex-direction:column; gap:16px; }
  .about-item{ display:flex; align-items:flex-start; gap:14px; }
  .about-item h4{ font-size:14.5px; font-weight:650; color:var(--text-hi); margin-bottom:2px; }
  .about-item p{ font-size:13px; color:var(--text-low); line-height:1.5; }
  .about-photo{ border-radius:26px; padding:10px; overflow:hidden; }
  .about-photo img{ border-radius:18px; width:100%; height:520px; object-fit:cover; object-position:top center; }

  /* ---------- market / stats section ---------- */
  .market-card{ border-radius:28px; overflow:hidden; position:relative; }
  .market-grid{ display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
  .market-copy{ padding:54px 50px; display:flex; flex-direction:column; justify-content:center; }
  .market-copy h2{ font-size:30px; font-weight:750; letter-spacing:-0.02em; margin-bottom:16px; line-height:1.22; }
  .market-copy p{ font-size:15px; line-height:1.7; color:var(--text-mid); margin-bottom:24px; }
  .market-stats{ display:flex; gap:28px; }
  .market-stats div .n{ font-family:'Poppins',sans-serif; font-size:24px; font-weight:700; color:var(--cyan-soft); }
  .market-stats div .l{ font-size:12px; color:var(--text-low); margin-top:2px; }
  .market-img{ position:relative; min-height:420px; }
  .market-img img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
  .market-img::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, var(--glass-fill-strong) 0%, transparent 22%); }

  /* ---------- feature spotlight (image cards) ---------- */
  .spotlight{ display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:center; margin-bottom:96px; border-radius:28px; overflow:visible; }
  .spotlight:last-child{ margin-bottom:0; }
  .spotlight.flip{ grid-template-columns:1fr 1fr; }
  .spotlight.flip .spot-media{ order:2; }
  .spotlight.flip .spot-copy{ order:1; }
  .spot-media{ border-radius:24px; padding:9px; }
  .spot-media .ph{ border-radius:17px; overflow:hidden; position:relative; }
  .spot-media img{ width:100%; height:440px; object-fit:cover; object-position:top center; display:block; }
  .spot-copy .badge-pay{ display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px; background:rgba(45,217,210,0.1); border:1px solid rgba(45,217,210,0.3); color:var(--cyan-soft); font-size:13px; font-weight:650; margin-bottom:18px; }
  .spot-copy h3{ font-size:28px; font-weight:750; letter-spacing:-0.02em; margin-bottom:14px; }
  .spot-copy p{ font-size:15px; line-height:1.7; color:var(--text-mid); margin-bottom:22px; }
  .spot-feature-list{ display:flex; flex-direction:column; gap:12px; margin-bottom:26px; }
  .spot-feature-list li{ list-style:none; display:flex; align-items:center; gap:10px; font-size:14px; color:var(--text-hi); }
  .spot-feature-list li svg{ flex-shrink:0; }

  .pay-table{ width:100%; border-collapse:collapse; margin-bottom:24px; border-radius:14px; overflow:hidden; border:1px solid var(--line-strong); }
  .pay-table th{ background:rgba(45,217,210,0.08); font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--cyan-soft); font-weight:650; padding:11px 14px; text-align:left; }
  .pay-table td{ padding:11px 14px; font-size:13.5px; color:var(--text-mid); border-top:1px solid var(--line); }
  .pay-table td.hi{ color:var(--text-hi); font-weight:600; }

  /* ---------- feature grid (icon cards) ---------- */
  .feature-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; }
  .feature-card{ padding:28px; border-radius:18px; transition:transform .35s ease, box-shadow .35s ease; }
  .feature-card:hover{ transform:translateY(-4px); box-shadow:0 24px 50px -28px rgba(45,150,217,0.4); }
  .feature-card:hover .icon3d{ transform:perspective(600px) rotateX(0deg) rotateY(0deg) scale(1.06); }
  .feature-card .top-row{ display:flex; align-items:flex-start; justify-content:space-between; }
  .feature-card h3{ font-size:16.5px; font-weight:650; margin:18px 0 8px; letter-spacing:-0.01em; }
  .feature-card p{ font-size:13.5px; line-height:1.6; color:var(--text-mid); }
  .pay-pill{ font-size:11.5px; font-weight:650; color:var(--cyan-soft); background:rgba(45,217,210,0.1); border:1px solid rgba(45,217,210,0.25); padding:5px 10px; border-radius:999px; white-space:nowrap; }

  /* ---------- vireon ultimate ---------- */
  .ultimate-card{ border-radius:30px; padding:54px 56px; position:relative; overflow:hidden; }
  .ultimate-card::after{ content:""; position:absolute; top:-40%; right:-10%; width:520px; height:420px; background:radial-gradient(ellipse, rgba(243,205,126,0.18), transparent 70%); pointer-events:none; }
  .ultimate-badge{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:650; letter-spacing:.04em; color:var(--gold); background:rgba(243,205,126,0.1); border:1px solid rgba(243,205,126,0.35); padding:7px 16px; border-radius:999px; margin-bottom:26px; }
  .ultimate-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:center; }
  .ultimate-copy h2{ font-size:32px; font-weight:750; letter-spacing:-0.02em; line-height:1.2; margin:10px 0 16px; }
  .ultimate-copy > p{ font-size:15px; line-height:1.7; color:var(--text-mid); margin-bottom:26px; max-width:380px; }
  .ultimate-price{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:28px; }
  .ultimate-price .amt{ font-family:'Poppins',sans-serif; font-size:42px; font-weight:800; color:var(--text-hi); letter-spacing:-0.02em; }
  .ultimate-price .period{ font-size:13px; color:var(--text-low); }
  .price-note{ display:inline-block; font-size:11.5px; font-weight:650; color:var(--gold); background:rgba(243,205,126,0.1); border:1px solid rgba(243,205,126,0.3); padding:3px 10px; border-radius:999px; white-space:nowrap; }
  .ultimate-list{ display:flex; flex-direction:column; gap:16px; }
  .ultimate-list li{ list-style:none; display:flex; align-items:center; gap:14px; font-size:14.5px; color:var(--text-hi); font-weight:500; }
  .ultimate-list .tick{ flex-shrink:0; width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(180deg, var(--gold), var(--gold-deep)); box-shadow:0 4px 12px -4px rgba(243,205,126,0.6); }
  .btn-pill.gold{ background:linear-gradient(180deg, var(--gold), var(--gold-deep)); color:#2a1d04; border-color:rgba(255,255,255,0.4); font-weight:700; }
  .btn-pill.gold:hover{ filter:brightness(1.06); box-shadow:0 12px 30px -10px rgba(243,205,126,0.55); }

  /* ---------- financial tools ---------- */
  .tools-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
  .tool-card{ padding:34px; border-radius:22px; }
  .tool-card .icon3d{ margin-bottom:20px; }
  .tool-card h3{ font-size:21px; font-weight:700; margin-bottom:8px; letter-spacing:-0.01em; }
  .tool-card .tagline{ font-size:14px; color:var(--cyan-soft); font-weight:600; margin-bottom:14px; }
  .tool-card p.desc{ font-size:14.5px; color:var(--text-mid); line-height:1.65; margin-bottom:22px; }
  .check-row{ display:flex; align-items:center; gap:10px; margin-bottom:12px; font-size:13.5px; color:var(--text-hi); }

  /* ---------- how it works ---------- */
  .steps-row{ position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
  .steps-row::before{ content:""; position:absolute; top:26px; left:8%; right:8%; height:1px; background:repeating-linear-gradient(90deg, var(--line-strong) 0 6px, transparent 6px 12px); z-index:0; }
  .step-card{ position:relative; z-index:1; text-align:center; }
  .step-num{ font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--cyan-soft); margin-bottom:18px; }
  .step-card .icon3d{ margin:0 auto; background:var(--bg-0); }
  html[data-theme="light"] .step-card .icon3d{ background:var(--glass-fill-strong); }
  .step-card h3{ font-size:16px; font-weight:650; margin:18px 0 8px; }
  .step-card p{ font-size:13.5px; line-height:1.6; color:var(--text-mid); max-width:230px; margin:0 auto; }

  /* ---------- FAQ ---------- */
  .faq-list{ max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:14px; }
  .faq-item{ border-radius:16px; overflow:hidden; }
  .faq-q{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px; cursor:pointer; font-size:15px; font-weight:600; color:var(--text-hi); list-style:none; }
  .faq-q::-webkit-details-marker{ display:none; }
  .faq-chev{ flex-shrink:0; width:20px; height:20px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(45,217,210,0.1); border:1px solid rgba(45,217,210,0.25); transition:transform .3s ease; }
  details[open] .faq-chev{ transform:rotate(45deg); }
  .faq-a{ padding:0 24px 22px; font-size:14px; line-height:1.7; color:var(--text-mid); }

  /* ---------- CTA ---------- */
  .cta-section{ padding-bottom:0; }
  .cta-card{ position:relative; max-width:920px; margin:0 auto; text-align:center; padding:80px 40px; border-radius:30px; overflow:hidden; }
  .cta-bg-img{ position:absolute; inset:0; z-index:0; --img-op:.5; }
  .cta-bg-img img{ width:100%; height:100%; object-fit:cover; }
  .cta-bg-img::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(5,10,22,0.55), var(--glass-fill-strong) 70%); }
  .cta-card > *{ position:relative; z-index:1; }
  .cta-card h2{ font-size:36px; font-weight:750; letter-spacing:-0.025em; margin-bottom:14px; }
  .cta-card p{ font-size:16px; color:var(--text-mid); margin-bottom:32px; max-width:440px; margin-left:auto; margin-right:auto; }
  .cta-actions{ display:flex; align-items:center; justify-content:center; gap:12px; }
  .cta-actions .btn-pill{ padding:13px 26px; font-size:14.5px; }

  /* ---------- footer ---------- */
  footer{ position:relative; z-index:3; margin-top:140px; border-top:1px solid var(--line); padding:64px 0 0; }
  .footer-grid{ display:grid; grid-template-columns:1.5fr repeat(4, 1fr); gap:32px; padding-bottom:56px; }
  .footer-brand p{ font-size:13.5px; color:var(--text-low); line-height:1.6; margin:14px 0 22px; max-width:250px; }
  .social-row{ display:flex; gap:10px; }
  .social-btn{ width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; background:var(--glass-fill); border:1px solid var(--line); color:var(--text-mid); transition:all .2s ease; }
  .social-btn:hover{ color:var(--text-hi); border-color:var(--line-strong); transform:translateY(-2px); }
  .social-btn svg{ width:15px; height:15px; }
  .footer-col h4{ font-size:12.5px; font-weight:650; letter-spacing:.04em; text-transform:uppercase; color:var(--text-low); margin-bottom:18px; }
  .footer-col a{ display:block; font-size:14px; color:var(--text-mid); text-decoration:none; margin-bottom:13px; transition:color .2s ease; }
  .footer-col a:hover{ color:var(--text-hi); }
  .footer-bottom{ display:flex; align-items:center; justify-content:space-between; padding:24px 0; border-top:1px solid var(--line); }
  .footer-bottom p{ font-size:12.5px; color:var(--text-low); }
  .toggle-pill{ display:flex; align-items:center; gap:4px; padding:4px; border-radius:999px; background:var(--glass-fill-strong); border:1px solid var(--line-strong); }
  .toggle-opt{ width:30px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:999px; cursor:pointer; color:var(--text-low); transition:all .25s ease; border:none; background:transparent; }
  .toggle-opt.active{ background:linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.04)); color:var(--text-hi); }
  .toggle-opt svg{ width:14px; height:14px; }

  @media (max-width:980px){
    .ultimate-grid{ grid-template-columns:1fr; gap:32px; }
    .ultimate-card{ padding:40px 28px; }
    .about-grid{ grid-template-columns:1fr; gap:40px; }
    .about-photo img{ height:340px; }
    .market-grid{ grid-template-columns:1fr; }
    .market-img{ min-height:260px; order:-1; }
    .spotlight, .spotlight.flip{ grid-template-columns:1fr; gap:28px; }
    .spotlight.flip .spot-media{ order:0; } .spotlight.flip .spot-copy{ order:1; }
    .spot-media img{ height:300px; }
    .feature-grid{ grid-template-columns:repeat(2,1fr); }
    .tools-grid{ grid-template-columns:1fr; }
    .steps-row{ grid-template-columns:repeat(2,1fr); row-gap:40px; }
    .steps-row::before{ display:none; }
    .footer-grid{ grid-template-columns:repeat(2,1fr); }
    .nav-links{ display:none; }
    .stat-strip{ flex-wrap:wrap; }
    .stat-cell{ flex:1 1 50%; border-bottom:1px solid var(--line); }
  }
  @media (max-width:640px){
    .hero h1{ font-size:42px; }
    .hero p.sub{ font-size:15.5px; }
    header{ padding:18px 20px; }
    .section{ padding-top:90px; }
    .section-title{ font-size:27px; }
    .feature-grid{ grid-template-columns:1fr; }
    .footer-grid{ grid-template-columns:1fr; gap:36px; }
    .steps-row{ grid-template-columns:1fr; }
    .market-copy{ padding:36px 26px; }
  }

/* ================= shared multi-page additions ================= */

/* mobile nav drawer */
.menu-btn{ display:none; width:38px; height:38px; border-radius:10px; align-items:center; justify-content:center; background:var(--glass-fill); border:1px solid var(--line-strong); color:var(--text-hi); cursor:pointer; }
.menu-btn svg{ width:18px; height:18px; }
.mobile-nav{ position:fixed; inset:0; z-index:80; background:rgba(5,10,22,0.75); backdrop-filter:blur(6px); display:none; opacity:0; transition:opacity .25s ease; }
.mobile-nav.open{ display:block; opacity:1; }
.mobile-nav-panel{ position:absolute; top:0; right:0; bottom:0; width:78%; max-width:340px; background:var(--glass-fill-strong); border-left:1px solid var(--line-strong); backdrop-filter:blur(24px); padding:26px 26px; display:flex; flex-direction:column; gap:6px; transform:translateX(100%); transition:transform .3s cubic-bezier(.16,1,.3,1); }
.mobile-nav.open .mobile-nav-panel{ transform:translateX(0); }
.mobile-nav-panel a{ padding:14px 4px; font-size:15.5px; font-weight:600; color:var(--text-hi); text-decoration:none; border-bottom:1px solid var(--line); }
.mobile-nav-close{ align-self:flex-end; width:34px; height:34px; border-radius:9px; background:var(--glass-fill); border:1px solid var(--line-strong); color:var(--text-hi); display:flex; align-items:center; justify-content:center; cursor:pointer; margin-bottom:10px; }
@media (max-width:900px){ .menu-btn{ display:flex; } }

/* breadcrumb trail on inner pages */
.crumb-row{ position:relative; z-index:3; max-width:1180px; margin:0 auto; padding:0 32px; display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--text-low); margin-top:8px; animation:heroFade .6s ease both; }
.crumb-row a{ color:var(--text-low); text-decoration:none; }
.crumb-row a:hover{ color:var(--cyan-soft); }
.crumb-row .sep{ opacity:.5; }
.crumb-row .cur{ color:var(--text-mid); }

/* page hero (inner pages, no big image) */
.page-hero{ position:relative; z-index:3; padding:52px 0 20px; text-align:center; }
.page-hero .eyebrow{ margin-bottom:20px; }
.page-hero h1{ font-size:44px; font-weight:800; letter-spacing:-0.03em; line-height:1.12; margin-bottom:16px;
  background:linear-gradient(180deg, #ffffff 15%, var(--cyan-soft) 90%); -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:heroRise .9s cubic-bezier(.16,1,.3,1) .12s both; }
html[data-theme="light"] .page-hero h1{ background:linear-gradient(180deg, #0a1830 0%, var(--cyan-deep) 90%); -webkit-background-clip:text; background-clip:text; }
.page-hero p{ font-size:16px; color:var(--text-mid); max-width:560px; margin:0 auto; line-height:1.6; animation:heroRise .9s cubic-bezier(.16,1,.3,1) .26s both; }

/* prose / article typography */
.prose{ max-width:760px; margin:0 auto; }
.prose h2{ font-size:25px; font-weight:700; letter-spacing:-0.015em; margin:44px 0 14px; }
.prose h2:first-child{ margin-top:0; }
.prose h3{ font-size:18px; font-weight:650; margin:26px 0 10px; color:var(--text-hi); }
.prose p{ font-size:15.5px; line-height:1.8; color:var(--text-mid); margin-bottom:16px; }
.prose ul, .prose ol{ margin:0 0 18px 22px; color:var(--text-mid); font-size:15.5px; line-height:1.8; }
.prose li{ margin-bottom:6px; }
.prose strong{ color:var(--text-hi); }
.prose a{ color:var(--cyan-soft); text-decoration:underline; text-underline-offset:3px; }

/* numbered vertical steps (how-to-register) */
.vsteps{ display:flex; flex-direction:column; gap:0; margin:28px 0 36px; }
.vstep{ position:relative; display:flex; gap:20px; padding-bottom:34px; }
.vstep:last-child{ padding-bottom:0; }
.vstep::before{ content:""; position:absolute; left:21px; top:46px; bottom:0; width:1px; background:repeating-linear-gradient(180deg, var(--line-strong) 0 5px, transparent 5px 10px); }
.vstep:last-child::before{ display:none; }
.vstep .vnum{ flex-shrink:0; width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-family:'Poppins',sans-serif; font-weight:700; font-size:16px; color:var(--text-hi);
  background:linear-gradient(145deg, rgba(255,255,255,0.14), rgba(255,255,255,0.02)); border:1px solid var(--line-strong);
  box-shadow:0 1px 0 rgba(255,255,255,0.15) inset, 0 10px 20px -10px rgba(0,0,0,0.5), 0 0 20px -8px rgba(45,217,210,0.4); position:relative; z-index:1; }
.vstep .vbody h3{ margin:6px 0 6px; font-size:17px; }
.vstep .vbody p{ font-size:14.5px; color:var(--text-mid); line-height:1.7; }

/* callout / safety note */
.callout{ display:flex; gap:14px; padding:20px 22px; border-radius:16px; margin:26px 0; }
.callout.info{ background:rgba(45,217,210,0.06); border:1px solid rgba(45,217,210,0.25); }
.callout.warn{ background:rgba(243,205,126,0.07); border:1px solid rgba(243,205,126,0.3); }
.callout svg{ flex-shrink:0; margin-top:2px; }
.callout p{ font-size:14px; line-height:1.65; color:var(--text-mid); margin:0; }
.callout strong{ color:var(--text-hi); }

/* forms */
.form-card{ max-width:480px; margin:0 auto; padding:38px 34px; border-radius:24px; }
.form-card h2{ font-size:24px; font-weight:750; margin-bottom:6px; letter-spacing:-0.015em; }
.form-card .form-sub{ font-size:14px; color:var(--text-mid); margin-bottom:26px; line-height:1.6; }
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:12.5px; font-weight:600; color:var(--text-mid); margin-bottom:7px; }
.field input, .field select{ width:100%; padding:12px 14px; border-radius:11px; background:rgba(127,140,170,0.08); border:1px solid var(--line); color:var(--text-hi); font-size:14px; font-family:inherit; outline:none; transition:border-color .2s ease, background .2s ease; appearance:none; }
.field select{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237df0e8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; background-size:16px; padding-right:38px; }
.field select option{ background:var(--bg-1); color:var(--text-hi); }
.field input::placeholder{ color:var(--text-low); }
.field input:focus, .field select:focus{ border-color:rgba(45,217,210,0.55); background:rgba(127,140,170,0.13); }
.field-check{ display:flex; align-items:flex-start; gap:10px; font-size:12.5px; color:var(--text-low); line-height:1.5; margin-bottom:22px; }
.field-check input{ margin-top:2px; accent-color:var(--cyan); }
.form-submit{ width:100%; padding:13px 14px; border-radius:12px; }
.form-note{ text-align:center; font-size:12px; color:var(--text-low); margin-top:16px; line-height:1.6; }
.form-note a{ color:var(--cyan-soft); text-decoration:none; font-weight:600; }

/* two-column info + form layout */
.split-layout{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:flex-start; }
.split-layout .side-info h2{ font-size:26px; font-weight:750; margin-bottom:14px; letter-spacing:-0.02em; }
.split-layout .side-info > p{ font-size:15px; color:var(--text-mid); line-height:1.7; margin-bottom:24px; }
@media (max-width:900px){ .split-layout{ grid-template-columns:1fr; gap:36px; } }

/* comparison table (upgrade page) */
.compare-wrap{ max-width:820px; margin:0 auto; border-radius:22px; overflow:hidden; }
.compare-table{ width:100%; border-collapse:collapse; }
.compare-table th{ padding:18px 20px; text-align:left; font-family:'Poppins',sans-serif; font-size:15px; font-weight:700; border-bottom:1px solid var(--line-strong); }
.compare-table th.col-ultimate{ color:var(--gold); }
.compare-table td{ padding:15px 20px; font-size:13.5px; color:var(--text-mid); border-bottom:1px solid var(--line); }
.compare-table td.feat{ color:var(--text-hi); font-weight:500; }
.compare-table td svg{ display:block; }
.compare-table tr:last-child td{ border-bottom:none; }

/* trust / legit checklist */
.trust-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.trust-card{ padding:24px; border-radius:16px; display:flex; gap:14px; align-items:flex-start; }
.trust-card h4{ font-size:14.5px; font-weight:650; margin-bottom:6px; color:var(--text-hi); }
.trust-card p{ font-size:13px; color:var(--text-mid); line-height:1.6; }
@media (max-width:640px){ .trust-grid{ grid-template-columns:1fr; } .split-layout{ grid-template-columns:1fr; } }

/* domain badge */
.domain-badge{ display:inline-flex; align-items:center; gap:8px; padding:9px 18px; border-radius:999px; background:rgba(45,217,210,0.08); border:1px solid rgba(45,217,210,0.3); font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--cyan-soft); margin:14px 0 6px; }

/* ---------- success overlay (form -> redirect handoff) ---------- */
.success-overlay{ position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; padding:24px;
  background:rgba(4,9,20,0.6); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  opacity:0; visibility:hidden; transition:opacity .35s ease, visibility 0s linear .35s; }
.success-overlay.show{ opacity:1; visibility:visible; transition:opacity .35s ease, visibility 0s linear 0s; }
.success-modal{ position:relative; width:100%; max-width:380px; text-align:center; padding:40px 32px 34px; border-radius:24px;
  background:var(--glass-fill-strong); border:1px solid var(--line-strong); backdrop-filter:blur(30px) saturate(160%); -webkit-backdrop-filter:blur(30px) saturate(160%);
  box-shadow:var(--shadow-deep); transform:translateY(18px) scale(.94); opacity:0; transition:transform .5s cubic-bezier(.34,1.56,.64,1), opacity .4s ease; }
.success-overlay.show .success-modal{ transform:translateY(0) scale(1); opacity:1; }
.success-ring{ width:76px; height:76px; margin:0 auto 22px; position:relative; }
.success-ring::before{ content:""; position:absolute; inset:-10px; border-radius:50%; background:radial-gradient(circle, rgba(45,217,210,0.35), transparent 70%); opacity:0; }
.success-overlay.show .success-ring::before{ animation:successPulse 1.4s ease-out .3s infinite; }
.success-ring svg{ width:100%; height:100%; }
.success-ring circle{ fill:none; stroke:url(#iG); stroke-width:3; stroke-linecap:round; stroke-dasharray:163; stroke-dashoffset:163; }
.success-overlay.show .success-ring circle{ animation:successCircle .7s cubic-bezier(.65,0,.45,1) .1s forwards; }
.success-ring path{ fill:none; stroke:var(--cyan-soft); stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:34; stroke-dashoffset:34; }
.success-overlay.show .success-ring path{ animation:successCheck .35s cubic-bezier(.65,0,.45,1) .75s forwards; }
.success-modal h3{ font-family:'Poppins',sans-serif; font-size:21px; font-weight:750; letter-spacing:-0.01em; margin-bottom:10px; color:var(--text-hi); }
.success-modal p{ font-size:14px; line-height:1.6; color:var(--text-mid); margin-bottom:22px; }
.success-progress{ height:4px; border-radius:999px; background:rgba(127,140,170,0.18); overflow:hidden; }
.success-progress-bar{ height:100%; width:0%; border-radius:999px; background:linear-gradient(90deg, var(--cyan), var(--cyan-soft)); }
.success-overlay.show .success-progress-bar{ animation:successProgress 1.7s linear .2s forwards; }
@keyframes successCircle{ to{ stroke-dashoffset:0; } }
@keyframes successCheck{ to{ stroke-dashoffset:0; } }
@keyframes successProgress{ from{ width:0%; } to{ width:100%; } }
@keyframes successPulse{ 0%{ opacity:.55; transform:scale(.85); } 100%{ opacity:0; transform:scale(1.35); } }
@media (prefers-reduced-motion: reduce){
  .success-overlay, .success-modal, .success-ring::before, .success-ring circle, .success-ring path, .success-progress-bar{ animation:none !important; transition:none !important; }
  .success-overlay.show .success-modal{ transform:none; opacity:1; }
  .success-ring circle{ stroke-dashoffset:0; }
  .success-ring path{ stroke-dashoffset:0; }
}

/* small util */
.center{ text-align:center; }
.mt-24{ margin-top:24px; }
.mb-0{ margin-bottom:0 !important; }