:root{
      --bg:#070b12;
      --bg-2:#0b1018;
      --bg-3:#0f1420;
      --bg-4:#131a28;
      --ink:#f7f8fb;
      --text:#d5d9e3;
      --muted:#8e96ab;
      --muted-2:#70788f;
      --line:rgba(255,255,255,.08);
      --line-2:rgba(255,255,255,.12);
      --surface:rgba(255,255,255,.04);
      --surface-2:rgba(255,255,255,.06);
      --surface-3:rgba(255,255,255,.08);
      --blue:#5a72ff;
      --blue-2:#7ea5ff;
      --copper:#c9a44d;
      --gold:#c9a44d;
      --gold-2:#f3df95;
      --gold-deep:#8f732c;
      --copper-2:#f3df95;
      --emerald:#43c59e;
      --danger:#ff7f89;
      --shadow-xl:0 40px 110px rgba(0,0,0,.45);
      --shadow-lg:0 22px 60px rgba(0,0,0,.32);
      --shadow-md:0 14px 32px rgba(0,0,0,.22);
      --radius-xl:36px;
      --radius-lg:28px;
      --radius-md:20px;
      --radius-sm:16px;
      --container:1240px;
      --header-h:84px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      min-width:320px;
      font-family:Inter,system-ui,sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at 12% 10%, rgba(90,114,255,.14), transparent 0 24%),
        radial-gradient(circle at 84% 14%, rgba(201,164,77,.12), transparent 0 20%),
        linear-gradient(180deg, #070b12 0%, #080d14 100%);
      overflow-x:hidden;
    }

    body::before{
      content:"";
      position:fixed;
      inset:0;
      z-index:-2;
      pointer-events:none;
      background:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
      background-size:58px 58px;
      mask-image:radial-gradient(circle at 50% 20%, rgba(0,0,0,.9), rgba(0,0,0,.2) 62%, transparent 100%);
      opacity:.35;
    }

    body::after{
      content:"";
      position:fixed;
      left:0; right:0; top:0; bottom:0;
      z-index:-3;
      pointer-events:none;
      background:radial-gradient(circle at center, rgba(255,255,255,.03), transparent 64%);
      mix-blend-mode:soft-light;
    }

    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%}
    button,input{font:inherit}

    .container{
      width:min(calc(100% - 32px), var(--container));
      margin:0 auto;
    }

    .site-header{
      position:sticky;
      top:0;
      z-index:90;
      height:var(--header-h);
      display:flex;
      align-items:center;
      background:linear-gradient(180deg, rgba(7,11,18,.78), rgba(7,11,18,.58));
      backdrop-filter:blur(18px);
      border-bottom:1px solid transparent;
      transition:border-color .25s ease, background .25s ease;
    }

    .site-header.scrolled{
      border-bottom-color:rgba(255,255,255,.06);
      background:linear-gradient(180deg, rgba(7,11,18,.92), rgba(9,13,20,.82));
    }

    .header-inner{
      display:grid;
      grid-template-columns:auto 1fr auto;
      align-items:center;
      gap:22px;
      width:100%;
    }

    .brand{
      display:flex;
      align-items:center;
      gap:14px;
      min-width:0;
    }

    .brand-mark{
      width:42px;
      height:42px;
      flex:none;
      filter:drop-shadow(0 10px 20px rgba(0,0,0,.25));
    }

    .brand-copy{
      min-width:0;
      display:flex;
      flex-direction:column;
      gap:2px;
    }

    .brand-title{
      font-family:Manrope,Inter,sans-serif;
      font-weight:800;
      font-size:1.06rem;
      letter-spacing:-.04em;
      color:var(--ink);
    }

    .brand-sub{
      font-size:.72rem;
      color:rgba(255,255,255,.56);
      text-transform:uppercase;
      letter-spacing:.14em;
    }

    .site-nav{
      justify-self:center;
      display:flex;
      align-items:center;
      gap:8px;
      padding:8px;
      border-radius:999px;
      background:rgba(255,255,255,.03);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
    }

    .site-nav a{
      color:rgba(255,255,255,.75);
      padding:10px 16px;
      border-radius:999px;
      font-size:.96rem;
      font-weight:600;
      transition:color .2s ease, background .2s ease;
    }

    .site-nav a:hover{
      background:rgba(255,255,255,.06);
      color:var(--ink);
    }

    .header-actions{
      display:flex;
      align-items:center;
      gap:12px;
    }

    .menu-toggle{
      display:none;
      width:46px;
      height:46px;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.08);
      background:rgba(255,255,255,.04);
      color:var(--ink);
      cursor:pointer;
    }

    .btn{
      position:relative;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      height:56px;
      padding:0 24px;
      border-radius:999px;
      border:1px solid transparent;
      font-weight:800;
      letter-spacing:-.02em;
      cursor:pointer;
      transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
      white-space:nowrap;
    }

    .btn:hover{transform:translateY(-2px)}

    .btn-primary{
      color:#fff;
      background:linear-gradient(135deg, #4962ff 0%, #677dff 48%, #98adff 100%);
      box-shadow:0 18px 42px rgba(90,114,255,.32);
    }

    .btn-primary:hover{box-shadow:0 26px 60px rgba(90,114,255,.42)}

    .btn-ghost{
      color:var(--ink);
      background:rgba(255,255,255,.045);
      border-color:rgba(255,255,255,.08);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
      backdrop-filter:blur(10px);
    }

    .btn-ghost:hover{
      background:rgba(255,255,255,.08);
      border-color:rgba(255,255,255,.13);
    }

    .btn-small{height:46px;padding:0 18px;font-size:.95rem}

    .zone{
      position:relative;
      overflow:clip;
    }

    .zone .container{
      position:relative;
      z-index:2;
    }

    .zone-sep-top::before,
    .zone-sep-bottom::after{
      content:"";
      position:absolute;
      left:0;
      right:0;
      height:1px;
      z-index:1;
      background:linear-gradient(90deg, transparent, rgba(255,255,255,.13), transparent);
    }

    .zone-sep-top::before{top:0}
    .zone-sep-bottom::after{bottom:0}

    .hero-zone{
      padding:40px 0 86px;
      background:
        radial-gradient(circle at 22% 12%, rgba(90,114,255,.16), transparent 0 26%),
        radial-gradient(circle at 84% 22%, rgba(201,164,77,.14), transparent 0 22%),
        linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
        linear-gradient(180deg, #070b12 0%, #0b1018 100%);
    }

    .hero-zone::before{
      content:"";
      position:absolute;
      inset:-14% -8% auto auto;
      width:54vw;
      height:54vw;
      max-width:780px;
      max-height:780px;
      border-radius:50%;
      background:conic-gradient(from 210deg, rgba(90,114,255,.14), rgba(201,164,77,.14), rgba(255,255,255,0) 55%, rgba(90,114,255,.16));
      filter:blur(48px);
      opacity:.65;
      z-index:0;
    }

    .hero-grid{
      display:grid;
      grid-template-columns:minmax(0, 1.02fr) minmax(0, .98fr);
      gap:48px;
      align-items:center;
      min-height:calc(100vh - var(--header-h) - 40px);
      padding:18px 0 0;
    }

    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:12px;
      min-height:42px;
      padding:0 16px;
      border-radius:999px;
      color:#e9edf7;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.08);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
      backdrop-filter:blur(10px);
      font-size:.86rem;
      font-weight:700;
      letter-spacing:.12em;
      text-transform:uppercase;
    }

    .eyebrow::before{
      content:"";
      width:8px;
      height:8px;
      border-radius:50%;
      background:linear-gradient(135deg, var(--copper), var(--blue-2));
      box-shadow:0 0 0 7px rgba(255,255,255,.035);
    }

    h1,h2,h3,h4,p{margin:0}
    h1,h2,h3{
      font-family:Manrope,Inter,sans-serif;
      color:var(--ink);
      letter-spacing:-.05em;
    }

    h1{
      font-size:clamp(3rem, 6vw, 6.2rem);
      line-height:.96;
    }

    h2{
      font-size:clamp(2rem, 4vw, 3.75rem);
      line-height:1.02;
    }

    h3{
      font-size:clamp(1.15rem, 2vw, 1.45rem);
      line-height:1.08;
    }

    .hero-copy{
      max-width:660px;
      display:flex;
      flex-direction:column;
      gap:24px;
    }

    .hero-copy h1 .warm{
      background:linear-gradient(90deg, #fff 0%, #f4df9c 45%, #c9a44d 100%);
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
    }

    .hero-copy p{
      font-size:1.12rem;
      line-height:1.76;
      color:var(--muted);
      max-width:620px;
    }

    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
      margin-top:6px;
    }

    .micro-points{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:14px;
      margin-top:8px;
      max-width:760px;
    }

    .micro{
      padding:16px 18px;
      border-radius:18px;
      background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.025));
      border:1px solid rgba(255,255,255,.06);
      box-shadow:var(--shadow-md);
    }

    .micro strong{
      display:block;
      color:var(--ink);
      font-size:1rem;
      letter-spacing:-.03em;
      margin-bottom:6px;
    }

    .micro span{
      display:block;
      color:var(--muted);
      font-size:.93rem;
      line-height:1.5;
    }

    .showcase{
      position:relative;
      min-height:680px;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .showcase-orb{
      position:absolute;
      inset:10% 10% auto auto;
      width:66%;
      aspect-ratio:1;
      border-radius:50%;
      background:
        radial-gradient(circle at 30% 30%, rgba(255,255,255,.18), transparent 0 16%),
        radial-gradient(circle at 50% 50%, rgba(90,114,255,.18), transparent 0 40%),
        radial-gradient(circle at 68% 42%, rgba(201,164,77,.17), transparent 0 26%);
      filter:blur(12px);
      opacity:.9;
    }

    .hero-device{
      position:relative;
      width:min(100%, 620px);
      border-radius:32px;
      padding:18px;
      background:
        linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)),
        linear-gradient(180deg, rgba(12,16,24,.96), rgba(8,11,17,.96));
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        inset 0 -1px 0 rgba(255,255,255,.03),
        0 35px 120px rgba(0,0,0,.46);
      transform:perspective(1800px) rotateY(-10deg) rotateX(7deg);
      transform-style:preserve-3d;
    }

    .hero-device::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:32px;
      padding:1px;
      background:linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.02), rgba(201,164,77,.20));
      -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
      -webkit-mask-composite:xor;
              mask-composite:exclude;
      pointer-events:none;
    }

    .device-top{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      padding:8px 10px 18px;
    }

    .device-dots{
      display:flex;
      gap:8px;
    }

    .device-dots span{
      width:10px; height:10px; border-radius:50%;
      background:rgba(255,255,255,.18);
    }

    .device-dots span:nth-child(1){background:#ff8f8f}
    .device-dots span:nth-child(2){background:#f4d37f}
    .device-dots span:nth-child(3){background:#7be0b7}

    .device-top .tag{
      padding:10px 14px;
      border-radius:999px;
      background:rgba(255,255,255,.05);
      color:rgba(255,255,255,.75);
      font-size:.8rem;
      font-weight:700;
      letter-spacing:.08em;
      text-transform:uppercase;
      border:1px solid rgba(255,255,255,.06);
    }

    .device-grid{
      display:grid;
      grid-template-columns:1.18fr .82fr;
      gap:16px;
    }

    .panel{
      border-radius:24px;
      background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
      border:1px solid rgba(255,255,255,.06);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
    }

    .invoice-panel{
      padding:24px;
      display:grid;
      gap:18px;
      min-height:460px;
    }

    .invoice-head{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:14px;
    }

    .invoice-head h3{font-size:1.15rem}
    .invoice-head p{color:var(--muted); font-size:.92rem; line-height:1.55}

    .status-pill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:10px 14px;
      border-radius:999px;
      background:rgba(67,197,158,.10);
      color:#a9f2d9;
      border:1px solid rgba(67,197,158,.22);
      font-size:.84rem;
      font-weight:700;
      white-space:nowrap;
    }

    .status-pill::before{
      content:"";
      width:8px;height:8px;border-radius:50%;
      background:var(--emerald);
      box-shadow:0 0 0 5px rgba(67,197,158,.12);
    }

    .invoice-rows{
      display:grid;
      gap:12px;
    }

    .row{
      display:grid;
      grid-template-columns:1.4fr .5fr .5fr;
      gap:10px;
      padding:12px 14px;
      border-radius:16px;
      background:rgba(255,255,255,.035);
    }

    .row span:nth-child(1){color:var(--ink); font-weight:600}
    .row span:nth-child(2),
    .row span:nth-child(3){text-align:right; color:rgba(255,255,255,.82)}
    .row.muted-row{
      background:transparent;
      padding:0;
      color:var(--muted);
      font-size:.8rem;
      text-transform:uppercase;
      letter-spacing:.08em;
    }

    .invoice-foot{
      margin-top:auto;
      display:grid;
      gap:12px;
      padding-top:8px;
      border-top:1px solid rgba(255,255,255,.07);
    }

    .kv{
      display:flex; align-items:center; justify-content:space-between; gap:14px;
      color:var(--muted);
      font-size:.95rem;
    }

    .kv strong{color:var(--ink); font-size:1.08rem}

    .sidebar{
      display:grid;
      gap:16px;
    }

    .metric-card, .actions-card{
      padding:20px;
      min-height:210px;
    }

    .actions-card{min-height:234px}

    .metric-card .mini-label, .actions-card .mini-label, .stat-float .mini-label{
      color:var(--muted);
      font-size:.77rem;
      letter-spacing:.12em;
      text-transform:uppercase;
      margin-bottom:12px;
      display:block;
    }

    .tracking-list{
      display:grid;
      gap:14px;
      margin-top:16px;
    }

    .tracking-item{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      padding:12px 14px;
      border-radius:16px;
      background:rgba(255,255,255,.04);
    }

    .tracking-item strong{display:block; color:var(--ink); font-size:.95rem}
    .tracking-item span{display:block; color:var(--muted); font-size:.82rem}
    .tracking-item i{
      display:inline-flex;
      width:38px; height:38px;
      align-items:center; justify-content:center;
      border-radius:12px;
      font-style:normal;
      font-weight:800;
      color:#0c1120;
      background:linear-gradient(135deg, var(--copper-2), var(--copper));
      box-shadow:0 12px 24px rgba(201,164,77,.26);
      flex:none;
    }

    .chart{
      margin-top:6px;
      height:130px;
      display:flex;
      align-items:flex-end;
      gap:10px;
      padding-top:20px;
    }

    .bar{
      flex:1;
      border-radius:14px 14px 8px 8px;
      background:linear-gradient(180deg, rgba(90,114,255,.95), rgba(90,114,255,.35));
      position:relative;
      min-height:26px;
    }

    .bar::after{
      content:"";
      position:absolute;
      left:0; right:0; bottom:0;
      height:36%;
      border-radius:inherit;
      background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0));
    }

    .bar.alt{background:linear-gradient(180deg, rgba(215,164,107,.95), rgba(215,164,107,.34))}
    .bar.green{background:linear-gradient(180deg, rgba(67,197,158,.95), rgba(67,197,158,.34))}

    .stat-float{
      position:absolute;
      padding:18px 18px 16px;
      border-radius:22px;
      background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
      border:1px solid rgba(255,255,255,.08);
      box-shadow:var(--shadow-lg);
      backdrop-filter:blur(12px);
    }

    .float-left{
      left:-26px;
      bottom:72px;
      width:240px;
    }

    .float-right{
      right:-20px;
      top:80px;
      width:220px;
    }

    .stat-float strong{
      display:block;
      color:var(--ink);
      font-size:1.48rem;
      letter-spacing:-.05em;
      margin-bottom:6px;
    }

    .stat-float p{
      color:var(--muted);
      font-size:.9rem;
      line-height:1.55;
    }

    .logo-strip-zone{
      padding:26px 0;
      background:
        linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)),
        linear-gradient(180deg, #0b1018 0%, #0d121b 100%);
    }

    .logo-strip{
      display:grid;
      grid-template-columns:repeat(4, minmax(0,1fr));
      gap:16px;
      align-items:stretch;
    }

    .trust-tile{
      padding:22px 22px;
      border-radius:22px;
      background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
      border:1px solid rgba(255,255,255,.05);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
    }

    .trust-tile strong{
      display:block;
      color:var(--ink);
      margin-bottom:8px;
      font-size:1rem;
      letter-spacing:-.03em;
    }

    .trust-tile span{
      color:var(--muted);
      line-height:1.6;
      font-size:.94rem;
    }

    .problem-zone{
      padding:118px 0;
      background:
        linear-gradient(180deg, #10161f 0%, #0c1017 100%);
    }

    .problem-zone::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(circle at 10% 20%, rgba(201,164,77,.12), transparent 0 22%),
        radial-gradient(circle at 84% 76%, rgba(90,114,255,.11), transparent 0 22%);
      pointer-events:none;
    }

    .section-head{
      display:flex;
      flex-direction:column;
      gap:18px;
      max-width:760px;
    }

    .section-head p{
      color:var(--muted);
      font-size:1.04rem;
      line-height:1.78;
    }

    .split-grid{
      margin-top:36px;
      display:grid;
      grid-template-columns:minmax(0,1fr) minmax(0,1fr);
      gap:24px;
      align-items:stretch;
    }

    .side-shell{
      position:relative;
      padding:34px;
      border-radius:32px;
      box-shadow:var(--shadow-lg);
      overflow:hidden;
    }

    .side-shell.problem{
      background:
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
        linear-gradient(180deg, #171c25 0%, #11161e 100%);
    }

    .side-shell.solution{
      background:
        linear-gradient(180deg, rgba(201,164,77,.12), rgba(90,114,255,.04)),
        linear-gradient(180deg, #141925 0%, #0f141d 100%);
    }

    .side-shell::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      padding:1px;
      background:linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,0), rgba(201,164,77,.20));
      -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
      -webkit-mask-composite:xor;
              mask-composite:exclude;
      pointer-events:none;
    }

    .shell-kicker{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:10px 14px;
      border-radius:999px;
      background:rgba(255,255,255,.05);
      color:#eef1f8;
      font-size:.82rem;
      font-weight:700;
      letter-spacing:.12em;
      text-transform:uppercase;
      margin-bottom:18px;
    }

    .shell-kicker::before{
      content:"";
      width:7px; height:7px; border-radius:50%;
      background:var(--copper);
      box-shadow:0 0 0 6px rgba(215,164,107,.09);
    }

    .solution .shell-kicker::before{background:var(--blue-2); box-shadow:0 0 0 6px rgba(90,114,255,.10)}

    .shell-list{
      display:grid;
      gap:14px;
      margin-top:26px;
    }

    .shell-item{
      display:grid;
      grid-template-columns:auto 1fr;
      gap:16px;
      align-items:start;
      padding:18px 18px;
      border-radius:20px;
      background:rgba(255,255,255,.04);
    }

    .shell-item b{
      display:inline-flex;
      width:42px; height:42px;
      border-radius:14px;
      align-items:center; justify-content:center;
      font-size:1rem;
      background:linear-gradient(135deg, rgba(215,164,107,.26), rgba(215,164,107,.08));
      color:var(--copper-2);
    }

    .solution .shell-item b{
      background:linear-gradient(135deg, rgba(90,114,255,.24), rgba(90,114,255,.08));
      color:#cad6ff;
    }

    .shell-item strong{
      display:block;
      color:var(--ink);
      margin-bottom:6px;
      font-size:1.02rem;
      letter-spacing:-.03em;
    }

    .shell-item span{
      color:var(--muted);
      font-size:.95rem;
      line-height:1.6;
    }

    .features-zone{
      padding:122px 0;
      background:
        radial-gradient(circle at 84% 22%, rgba(90,114,255,.14), transparent 0 26%),
        linear-gradient(180deg, #0a0e16 0%, #0f1521 100%);
    }

    .features-zone::before{
      content:"";
      position:absolute;
      top:64px;
      right:-6%;
      width:42vw;
      height:42vw;
      max-width:600px;
      max-height:600px;
      border-radius:50%;
      background:radial-gradient(circle, rgba(90,114,255,.12), transparent 62%);
      filter:blur(10px);
      opacity:.8;
    }

    .bento{
      margin-top:42px;
      display:grid;
      grid-template-columns:1.05fr .95fr .9fr;
      gap:18px;
      grid-auto-rows:minmax(180px, auto);
    }

    .bento-card{
      position:relative;
      padding:28px;
      border-radius:28px;
      overflow:hidden;
      background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.022));
      box-shadow:var(--shadow-lg);
    }

    .bento-card::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      padding:1px;
      background:linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.02), rgba(255,255,255,.06));
      -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
      -webkit-mask-composite:xor;
              mask-composite:exclude;
      pointer-events:none;
    }

    .bento-card.hero-bento{
      grid-column:span 2;
      grid-row:span 2;
      background:
        radial-gradient(circle at 86% 18%, rgba(201,164,77,.13), transparent 0 22%),
        linear-gradient(180deg, rgba(90,114,255,.08), rgba(255,255,255,.02)),
        linear-gradient(180deg, #131926 0%, #0f131d 100%);
    }

    .bento-card.warm{
      background:
        linear-gradient(180deg, rgba(201,164,77,.12), rgba(255,255,255,.022)),
        linear-gradient(180deg, #17151a 0%, #111217 100%);
    }

    .bento-card.deep{
      background:
        linear-gradient(180deg, rgba(90,114,255,.12), rgba(255,255,255,.02)),
        linear-gradient(180deg, #121827 0%, #0f131d 100%);
    }

    .bento-card h3{margin-bottom:12px}
    .bento-card p{color:var(--muted); line-height:1.72}

    .bento-label{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding:8px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.05);
      color:rgba(255,255,255,.78);
      font-size:.78rem;
      font-weight:700;
      letter-spacing:.1em;
      text-transform:uppercase;
      margin-bottom:18px;
    }

    .bento-label::before{
      content:"";
      width:7px;height:7px;border-radius:50%;
      background:var(--blue-2);
    }

    .bento-preview{
      margin-top:26px;
      display:grid;
      grid-template-columns:1fr .92fr;
      gap:16px;
      align-items:stretch;
    }

    .preview-sheet{
      padding:20px;
      border-radius:22px;
      background:rgba(255,255,255,.045);
      display:grid;
      gap:12px;
      min-height:280px;
    }

    .preview-sheet .topline{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      padding-bottom:10px;
      border-bottom:1px solid rgba(255,255,255,.08);
    }

    .preview-sheet .topline strong{color:var(--ink)}
    .preview-sheet .topline span{color:var(--muted); font-size:.9rem}

    .preview-line{
      display:flex; justify-content:space-between; gap:12px;
      padding:10px 0;
      border-bottom:1px dashed rgba(255,255,255,.08);
      color:rgba(255,255,255,.84);
      font-size:.93rem;
    }

    .mini-stack{
      display:grid;
      gap:16px;
    }

    .mini-card{
      padding:20px;
      border-radius:22px;
      background:rgba(255,255,255,.045);
      min-height:132px;
      display:grid;
      align-content:start;
      gap:12px;
    }

    .mini-card strong{
      color:var(--ink);
      font-size:1.04rem;
      letter-spacing:-.03em;
    }

    .mini-card p{font-size:.93rem}

    .signal-list{
      margin-top:18px;
      display:grid;
      gap:14px;
    }

    .signal{
      display:flex;
      align-items:center;
      gap:12px;
      color:var(--muted);
      font-size:.94rem;
    }

    .signal i{
      font-style:normal;
      display:inline-flex;
      width:28px;height:28px;
      align-items:center; justify-content:center;
      border-radius:10px;
      background:rgba(255,255,255,.07);
      color:var(--ink);
      flex:none;
      font-weight:700;
    }

    .audience-zone{
      padding:120px 0;
      background:
        linear-gradient(180deg, #131922 0%, #0d1218 100%);
    }

    .audience-zone::before{
      content:"";
      position:absolute;
      inset:auto 0 0 0;
      height:180px;
      background:linear-gradient(180deg, transparent, rgba(0,0,0,.20));
      pointer-events:none;
    }

    .audience-wrap{
      margin-top:40px;
      display:grid;
      grid-template-columns:.44fr .56fr;
      gap:24px;
    }

    .tab-rail{
      padding:18px;
      border-radius:28px;
      background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.024));
      box-shadow:var(--shadow-lg);
    }

    .tab-buttons{
      display:grid;
      gap:12px;
    }

    .tab-btn{
      appearance:none;
      text-align:left;
      width:100%;
      padding:20px 22px;
      border-radius:22px;
      border:1px solid transparent;
      background:transparent;
      color:inherit;
      cursor:pointer;
      transition:background .2s ease, transform .2s ease, border-color .2s ease;
    }

    .tab-btn:hover{background:rgba(255,255,255,.04)}
    .tab-btn.active{
      background:linear-gradient(180deg, rgba(90,114,255,.12), rgba(255,255,255,.04));
      border-color:rgba(90,114,255,.28);
      transform:translateX(4px);
    }

    .tab-btn strong{
      display:block;
      color:var(--ink);
      font-size:1.04rem;
      letter-spacing:-.03em;
      margin-bottom:6px;
    }

    .tab-btn span{
      display:block;
      color:var(--muted);
      line-height:1.58;
      font-size:.93rem;
    }

    .tab-panel{
      position:relative;
      border-radius:32px;
      padding:34px;
      background:
        radial-gradient(circle at 84% 18%, rgba(201,164,77,.15), transparent 0 24%),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.022)),
        linear-gradient(180deg, #141a26 0%, #10151d 100%);
      box-shadow:var(--shadow-xl);
      overflow:hidden;
    }

    .tab-panel::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      padding:1px;
      background:linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.02), rgba(201,164,77,.18));
      -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
      -webkit-mask-composite:xor;
              mask-composite:exclude;
      pointer-events:none;
    }

    .tab-content{
      display:grid;
      grid-template-columns:1fr .9fr;
      gap:26px;
      align-items:start;
    }

    .tab-copy{
      display:grid;
      gap:18px;
      align-content:start;
    }

    .tab-copy h3{
      font-size:clamp(1.5rem, 2.5vw, 2rem);
    }

    .tab-copy p{
      color:var(--muted);
      line-height:1.75;
      font-size:1rem;
    }

    .bullet-list{
      display:grid;
      gap:12px;
      margin-top:6px;
    }

    .bullet{
      display:grid;
      grid-template-columns:auto 1fr;
      gap:12px;
      align-items:start;
      color:var(--text);
      font-size:.95rem;
      line-height:1.6;
    }

    .bullet b{
      display:inline-flex;
      width:28px; height:28px;
      align-items:center; justify-content:center;
      border-radius:10px;
      background:linear-gradient(135deg, rgba(201,164,77,.26), rgba(90,114,255,.18));
      color:#fff;
      font-size:.78rem;
      margin-top:2px;
    }

    .use-panel{
      padding:22px;
      border-radius:24px;
      background:rgba(255,255,255,.04);
      display:grid;
      gap:18px;
    }

    .use-grid{
      display:grid;
      gap:12px;
    }

    .use-row{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      padding:14px 16px;
      border-radius:18px;
      background:rgba(255,255,255,.035);
      font-size:.94rem;
      color:rgba(255,255,255,.84);
    }

    .use-row strong{color:var(--ink)}
    .use-row span{
      color:var(--muted);
      font-size:.85rem;
    }

    .waitlist-zone{
      padding:124px 0;
      background:
        radial-gradient(circle at 22% 24%, rgba(90,114,255,.16), transparent 0 26%),
        radial-gradient(circle at 82% 74%, rgba(201,164,77,.16), transparent 0 24%),
        linear-gradient(180deg, #0c1017 0%, #11161e 100%);
    }

    .wait-wrap{
      position:relative;
      border-radius:38px;
      padding:40px;
      background:
        linear-gradient(135deg, rgba(17,22,32,.82), rgba(16,20,30,.86)),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
      box-shadow:var(--shadow-xl);
      overflow:hidden;
    }

    .wait-wrap::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(circle at 16% 20%, rgba(90,114,255,.18), transparent 0 24%),
        radial-gradient(circle at 86% 22%, rgba(201,164,77,.20), transparent 0 24%);
      pointer-events:none;
    }

    .wait-wrap::after{
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      padding:1px;
      background:linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.03), rgba(201,164,77,.18));
      -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
      -webkit-mask-composite:xor;
              mask-composite:exclude;
      pointer-events:none;
    }

    .wait-grid{
      position:relative;
      z-index:2;
      display:grid;
      grid-template-columns:1fr .92fr;
      gap:28px;
      align-items:start;
    }

    .wait-copy{
      display:grid;
      gap:18px;
      max-width:620px;
    }

    .wait-copy p{
      color:var(--muted);
      line-height:1.78;
    }

    .metric-inline{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:12px;
      margin-top:10px;
    }

    .metric-inline .item{
      padding:18px;
      border-radius:20px;
      background:rgba(255,255,255,.045);
    }

    .metric-inline strong{
      display:block;
      color:var(--ink);
      font-size:1.15rem;
      letter-spacing:-.04em;
      margin-bottom:6px;
    }

    .metric-inline span{
      color:var(--muted);
      font-size:.9rem;
      line-height:1.5;
    }

    .wait-card{
      padding:26px;
      border-radius:28px;
      background:rgba(8,11,18,.52);
      border:1px solid rgba(255,255,255,.08);
      backdrop-filter:blur(16px);
      box-shadow:0 26px 60px rgba(0,0,0,.34);
    }

    .form-head{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:16px;
      margin-bottom:20px;
    }

    .form-head strong{
      display:block;
      color:var(--ink);
      font-size:1.18rem;
      letter-spacing:-.04em;
      margin-bottom:6px;
    }

    .form-head span{
      display:block;
      color:var(--muted);
      font-size:.93rem;
      line-height:1.55;
    }

    .wait-form{
      display:grid;
      gap:16px;
    }

    .field label{
      display:block;
      color:rgba(255,255,255,.74);
      font-size:.82rem;
      font-weight:700;
      letter-spacing:.1em;
      text-transform:uppercase;
      margin-bottom:8px;
    }

    .field input{
      width:100%;
      height:58px;
      padding:0 18px;
      border-radius:18px;
      border:1px solid rgba(255,255,255,.09);
      background:rgba(255,255,255,.05);
      color:var(--ink);
      outline:none;
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }

    .field input:focus{
      border-color:rgba(90,114,255,.45);
      box-shadow:0 0 0 4px rgba(90,114,255,.12);
      background:rgba(255,255,255,.07);
    }

    .chips{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }

    .chip{
      border:none;
      height:48px;
      padding:0 16px;
      border-radius:999px;
      background:rgba(255,255,255,.05);
      color:rgba(255,255,255,.82);
      border:1px solid rgba(255,255,255,.08);
      cursor:pointer;
      font-weight:700;
      transition:background .2s ease, border-color .2s ease, transform .2s ease, color .2s ease;
    }

    .chip:hover{transform:translateY(-1px); background:rgba(255,255,255,.08)}
    .chip.active{
      color:#fff;
      background:linear-gradient(135deg, rgba(90,114,255,.24), rgba(215,164,107,.20));
      border-color:rgba(215,164,107,.38);
      box-shadow:0 14px 26px rgba(0,0,0,.20);
    }

    .checkline{
      display:flex;
      align-items:flex-start;
      gap:12px;
      color:var(--muted);
      font-size:.92rem;
      line-height:1.58;
    }

    .checkline input{
      margin-top:4px;
      accent-color:var(--blue);
    }

    .status-box{
      margin-top:4px;
      min-height:24px;
      color:#9edebf;
      font-size:.93rem;
      font-weight:600;
    }

    .faq-zone{
      padding:120px 0;
      background:
        linear-gradient(180deg, #0b1017 0%, #0b0f15 100%);
    }

    .faq-grid{
      display:grid;
      grid-template-columns:.44fr .56fr;
      gap:28px;
      margin-top:40px;
      align-items:start;
    }

    .faq-side{
      display:grid;
      gap:20px;
      align-content:start;
    }

    .faq-note{
      padding:24px;
      border-radius:26px;
      background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
      border:1px solid rgba(255,255,255,.06);
    }

    .faq-note strong{
      display:block;
      color:var(--ink);
      margin-bottom:8px;
      font-size:1.05rem;
      letter-spacing:-.03em;
    }

    .faq-note p{
      color:var(--muted);
      line-height:1.68;
      font-size:.95rem;
    }

    .accordion{
      display:grid;
      gap:14px;
    }

    .acc-item{
      border-radius:24px;
      background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
      border:1px solid rgba(255,255,255,.06);
      overflow:hidden;
    }

    .acc-btn{
      width:100%;
      padding:22px 24px;
      border:none;
      background:none;
      color:inherit;
      cursor:pointer;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:18px;
      text-align:left;
    }

    .acc-btn strong{
      color:var(--ink);
      font-size:1.03rem;
      letter-spacing:-.03em;
    }

    .acc-btn span{
      width:34px;height:34px;
      flex:none;
      display:inline-flex;
      align-items:center; justify-content:center;
      border-radius:12px;
      background:rgba(255,255,255,.05);
      color:var(--ink);
      font-size:1.15rem;
      transition:transform .25s ease, background .25s ease;
    }

    .acc-body{
      display:grid;
      grid-template-rows:0fr;
      transition:grid-template-rows .28s ease;
    }

    .acc-body > div{
      overflow:hidden;
    }

    .acc-body p{
      padding:0 24px 22px;
      color:var(--muted);
      line-height:1.74;
      font-size:.97rem;
    }

    .acc-item.open .acc-body{grid-template-rows:1fr}
    .acc-item.open .acc-btn span{
      transform:rotate(45deg);
      background:rgba(90,114,255,.18);
    }

    .cta-zone{
      padding:0 0 26px;
      background:
        radial-gradient(circle at 14% 20%, rgba(90,114,255,.12), transparent 0 24%),
        radial-gradient(circle at 82% 80%, rgba(201,164,77,.13), transparent 0 24%),
        linear-gradient(180deg, #0b0f15 0%, #070b12 100%);
    }

    .cta-shell{
      position:relative;
      margin-top:4px;
      padding:44px;
      border-radius:36px;
      overflow:hidden;
      background:
        radial-gradient(circle at 20% 20%, rgba(90,114,255,.15), transparent 0 24%),
        radial-gradient(circle at 82% 80%, rgba(201,164,77,.15), transparent 0 24%),
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)),
        linear-gradient(180deg, #111723 0%, #0b1018 100%);
      box-shadow:var(--shadow-xl);
    }

    .cta-shell::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      padding:1px;
      background:linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.02), rgba(201,164,77,.18));
      -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
      -webkit-mask-composite:xor;
              mask-composite:exclude;
      pointer-events:none;
    }

    .cta-grid{
      display:grid;
      grid-template-columns:1fr auto;
      gap:24px;
      align-items:center;
      position:relative;
      z-index:2;
    }

    .cta-copy{
      max-width:760px;
      display:grid;
      gap:16px;
    }

    .cta-copy p{
      color:var(--muted);
      line-height:1.75;
      max-width:620px;
    }

    .site-footer{
      padding:30px 0 16px;
    }

    .footer-inner{
      display:grid;
      grid-template-columns:1fr auto auto;
      gap:18px;
      align-items:center;
      padding:14px 0 0;
    }

    .footer-nav{
      display:flex;
      flex-wrap:wrap;
      gap:14px 18px;
      color:rgba(255,255,255,.66);
      font-size:.94rem;
    }

    .footer-note{
      color:rgba(255,255,255,.45);
      font-size:.86rem;
      text-align:right;
    }

    .reveal{
      opacity:0;
      transform:translateY(18px);
    }

    @media (max-width:1180px){
      .hero-grid,
      .wait-grid,
      .faq-grid,
      .audience-wrap,
      .split-grid,
      .cta-grid{
        grid-template-columns:1fr;
      }

      .hero-grid{gap:30px; min-height:auto; padding-top:20px}
      .showcase{min-height:unset; padding-top:14px}
      .hero-device{transform:none}
      .float-left{left:6px; bottom:20px}
      .float-right{right:8px; top:26px}
      .bento{grid-template-columns:1fr 1fr}
      .bento-card.hero-bento{grid-column:span 2}
      .tab-content{grid-template-columns:1fr}
      .cta-grid{align-items:start}
      .footer-inner{grid-template-columns:1fr; align-items:start}
      .footer-note{text-align:left}
    }

    @media (max-width:980px){
      .site-nav{
        position:fixed;
        left:16px;
        right:16px;
        top:calc(var(--header-h) - 2px);
        display:grid;
        gap:6px;
        padding:12px;
        border-radius:24px;
        background:rgba(10,14,21,.96);
        border:1px solid rgba(255,255,255,.08);
        transform:translateY(-12px);
        opacity:0;
        pointer-events:none;
        transition:transform .22s ease, opacity .22s ease;
      }

      .site-nav.open{
        transform:translateY(0);
        opacity:1;
        pointer-events:auto;
      }

      .site-nav a{
        border-radius:16px;
        padding:14px 16px;
      }

      .header-inner{
        grid-template-columns:auto auto auto;
      }

      .header-actions .btn-ghost{display:none}
      .menu-toggle{display:inline-flex; align-items:center; justify-content:center}
      .micro-points,
      .logo-strip,
      .metric-inline{
        grid-template-columns:1fr;
      }
      .bento{grid-template-columns:1fr}
      .bento-card.hero-bento{grid-column:span 1}
      .device-grid{grid-template-columns:1fr}
      .float-left,.float-right{
        position:relative;
        left:auto; right:auto; top:auto; bottom:auto;
        width:100%;
        margin-top:16px;
      }
    }

    @media (max-width:720px){
      :root{--header-h:76px}
      .hero-zone{padding-top:22px}
      h1{font-size:clamp(2.7rem, 12vw, 4.1rem)}
      h2{font-size:clamp(2rem, 9vw, 3rem)}
      .hero-copy p,
      .section-head p{font-size:1rem}
      .hero-actions{display:grid; grid-template-columns:1fr}
      .btn{width:100%}
      .side-shell,
      .tab-panel,
      .wait-wrap,
      .cta-shell{padding:24px}
      .bento-card{padding:22px}
      .faq-note,
      .wait-card{padding:22px}
      .panel{border-radius:20px}
      .hero-device{padding:14px; border-radius:26px}
      .site-header{height:var(--header-h)}
      .brand-sub{display:none}
      .header-actions .btn-primary{display:none}
      .form-head{flex-direction:column}
      .cta-grid{gap:18px}
      .cta-shell .btn{width:auto}
    }

    @media (max-width:560px){
      .container{width:min(calc(100% - 20px), var(--container))}
      .hero-copy{gap:18px}
      .hero-zone{padding-bottom:58px}
      .problem-zone,
      .features-zone,
      .audience-zone,
      .waitlist-zone,
      .faq-zone{padding:82px 0}
      .logo-strip-zone{padding:16px 0}
      .row{grid-template-columns:1.2fr .5fr .6fr}
      .site-nav{
        left:10px; right:10px;
      }
      .metric-inline{grid-template-columns:1fr}
      .cta-shell .btn{width:100%}
    }
  

    /* v5 refinements */
    body{
      background:
        radial-gradient(circle at 12% 9%, rgba(90,114,255,.16), transparent 0 26%),
        radial-gradient(circle at 82% 12%, rgba(201,164,77,.13), transparent 0 22%),
        linear-gradient(180deg, #050810 0%, #080d14 100%);
    }

    .container{
      width:min(calc(100% - 56px), var(--container));
    }

    .site-header{
      background:linear-gradient(180deg, rgba(5,8,14,.82), rgba(5,8,14,.42));
    }

    .site-header.scrolled{
      background:linear-gradient(180deg, rgba(6,10,16,.94), rgba(8,11,17,.78));
    }

    .header-inner{
      min-width:0;
      padding:0 4px;
    }

    .site-nav{
      gap:2px;
      padding:0;
      background:transparent;
      box-shadow:none;
      border-radius:0;
    }

    .site-nav a{
      position:relative;
      padding:10px 14px;
      color:rgba(255,255,255,.72);
    }

    .site-nav a::after{
      content:"";
      position:absolute;
      left:14px;
      right:14px;
      bottom:2px;
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(201,164,77,.9), transparent);
      transform:scaleX(0);
      transform-origin:center;
      transition:transform .24s ease;
      opacity:.9;
    }

    .site-nav a:hover::after{transform:scaleX(1)}

    .hero-grid > *,
    .split-grid > *,
    .bento > *,
    .bento-preview > *,
    .audience-wrap > *,
    .tab-content > *,
    .wait-grid > *,
    .faq-grid > *,
    .cta-grid > *,
    .device-grid > *,
    .logo-strip > *{
      min-width:0;
    }

    .hero-copy,
    .showcase,
    .tab-panel,
    .wait-card,
    .wait-copy,
    .section-head,
    .cta-copy,
    .footer-inner,
    .hero-device,
    .invoice-panel,
    .sidebar,
    .metric-card,
    .actions-card,
    .preview-sheet,
    .use-panel{
      min-width:0;
    }

    .zone-sep-top::before,
    .zone-sep-bottom::after{
      background:linear-gradient(90deg, transparent, rgba(255,255,255,.08) 18%, rgba(201,164,77,.22) 50%, rgba(255,255,255,.08) 82%, transparent);
    }

    .hero-zone{
      background:
        radial-gradient(circle at 18% 10%, rgba(90,114,255,.15), transparent 0 24%),
        radial-gradient(circle at 82% 18%, rgba(201,164,77,.12), transparent 0 20%),
        linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
        linear-gradient(180deg, #060a11 0%, #0a0f18 56%, #0b111b 100%);
    }

    .logo-strip-zone{
      background:
        linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)),
        linear-gradient(180deg, #0e1520 0%, #111925 100%);
    }

    .problem-zone{
      background:
        radial-gradient(circle at 14% 24%, rgba(201,164,77,.12), transparent 0 22%),
        radial-gradient(circle at 88% 78%, rgba(90,114,255,.10), transparent 0 20%),
        linear-gradient(180deg, #151217 0%, #10131a 56%, #0d1118 100%);
    }

    .problem-zone::after{
      content:"";
      position:absolute;
      right:-10%;
      bottom:-14%;
      width:42vw;
      height:42vw;
      max-width:520px;
      max-height:520px;
      border-radius:50%;
      background:radial-gradient(circle, rgba(201,164,77,.10), transparent 62%);
      filter:blur(34px);
      pointer-events:none;
    }

    .features-zone{
      background:
        radial-gradient(circle at 86% 20%, rgba(90,114,255,.14), transparent 0 24%),
        radial-gradient(circle at 16% 78%, rgba(201,164,77,.10), transparent 0 22%),
        linear-gradient(180deg, #0b1018 0%, #111828 54%, #0f1624 100%);
    }

    .audience-zone{
      background:
        radial-gradient(circle at 76% 16%, rgba(201,164,77,.11), transparent 0 24%),
        linear-gradient(180deg, #121926 0%, #0f1621 50%, #0b1018 100%);
    }

    .waitlist-zone{
      background:
        radial-gradient(circle at 22% 24%, rgba(90,114,255,.18), transparent 0 26%),
        radial-gradient(circle at 82% 74%, rgba(201,164,77,.18), transparent 0 24%),
        linear-gradient(180deg, #0c1118 0%, #111722 100%);
    }

    .faq-zone{
      background:
        radial-gradient(circle at 12% 16%, rgba(201,164,77,.08), transparent 0 20%),
        linear-gradient(180deg, #0d1117 0%, #0a0e14 100%);
    }

    .cta-zone{
      background:
        radial-gradient(circle at 14% 20%, rgba(90,114,255,.14), transparent 0 24%),
        radial-gradient(circle at 82% 80%, rgba(201,164,77,.12), transparent 0 24%),
        linear-gradient(180deg, #0a0e14 0%, #05080f 100%);
    }

    .trust-tile,
    .faq-note,
    .acc-item,
    .wait-card,
    .tab-rail{
      background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.022));
    }

    .btn-primary{
      background:linear-gradient(135deg, #4d62ff 0%, #6f81ff 54%, #9eb2ff 100%);
    }

    .btn-ghost{
      background:rgba(255,255,255,.035);
    }

    @media (max-width:980px){
      .container{
        width:min(calc(100% - 34px), var(--container));
      }

      .site-nav{
        left:16px;
        right:16px;
        top:calc(var(--header-h) - 6px);
        gap:8px;
        padding:12px;
        border-radius:22px;
        background:rgba(10,15,22,.96);
        border:1px solid rgba(255,255,255,.08);
        box-shadow:0 26px 60px rgba(0,0,0,.42);
      }

      .site-nav a{
        padding:14px 16px;
        background:rgba(255,255,255,.03);
        border-radius:16px;
      }

      .site-nav a::after{display:none}

      .header-inner{
        grid-template-columns:auto 1fr auto;
        gap:12px;
      }

      .brand{min-width:0}

      .hero-copy,
      .showcase{
        width:100%;
        max-width:none;
      }

      .hero-grid{
        gap:26px;
      }

      .showcase{
        min-height:0;
        padding-top:0;
      }

      .hero-device{
        width:100%;
        max-width:none;
      }

      .micro-points,
      .logo-strip,
      .metric-inline,
      .bento,
      .bento-preview,
      .device-grid,
      .tab-content,
      .wait-grid,
      .faq-grid,
      .split-grid,
      .cta-grid,
      .audience-wrap{
        grid-template-columns:1fr;
      }

      .bento-card.hero-bento{grid-column:span 1}
    }

    @media (max-width:720px){
      .container{width:min(calc(100% - 28px), var(--container));}

      h1{
        font-size:clamp(2.45rem, 11vw, 3.75rem);
        line-height:1.01;
      }

      h2{font-size:clamp(1.9rem, 8vw, 2.8rem)}

      .hero-zone{
        padding:18px 0 56px;
      }

      .hero-copy{
        gap:20px;
        max-width:none;
      }

      .hero-copy p,
      .section-head p,
      .tab-copy p,
      .wait-copy p,
      .faq-note p,
      .cta-copy p{
        max-width:none;
        font-size:1rem;
      }

      .hero-actions{
        display:grid;
        grid-template-columns:1fr;
      }

      .micro-points{max-width:none}

      .showcase-orb{
        width:88%;
        inset:4% auto auto 12%;
      }

      .hero-device{
        padding:12px;
        border-radius:24px;
      }

      .hero-device::before{border-radius:24px}

      .device-top{
        padding:4px 4px 12px;
      }

      .invoice-panel,
      .metric-card,
      .actions-card,
      .tab-panel,
      .wait-wrap,
      .cta-shell,
      .side-shell,
      .bento-card,
      .faq-note,
      .wait-card{
        padding:22px;
      }

      .invoice-panel,
      .metric-card,
      .actions-card{min-height:unset}

      .invoice-head{flex-direction:column; align-items:flex-start}

      .row{
        grid-template-columns:minmax(0,1fr) auto auto;
      }

      .row span:nth-child(1){min-width:0}

      .float-left,
      .float-right{
        position:relative;
        left:auto;
        right:auto;
        top:auto;
        bottom:auto;
        width:100%;
        margin-top:14px;
      }

      .chips{
        display:grid;
        grid-template-columns:repeat(3, minmax(0,1fr));
      }

      .chip{
        width:100%;
        padding:0 10px;
      }

      .cta-shell .btn{width:100%}
    }

    @media (max-width:560px){
      .container{width:min(calc(100% - 24px), var(--container));}

      .header-inner{padding:0}

      .brand-title{font-size:1rem}

      h1{
        font-size:clamp(2.2rem, 11vw, 3.1rem);
      }

      .eyebrow{
        min-height:38px;
        padding:0 14px;
        font-size:.78rem;
        letter-spacing:.1em;
      }

      .micro,
      .trust-tile,
      .metric-inline .item,
      .faq-note,
      .wait-card,
      .tab-panel,
      .side-shell,
      .bento-card,
      .cta-shell,
      .wait-wrap{
        border-radius:20px;
      }

      .hero-device,
      .hero-device::before,
      .panel,
      .tab-rail{
        border-radius:20px;
      }

      .site-nav{
        left:12px;
        right:12px;
      }

      .device-top .tag,
      .bento-label,
      .shell-kicker{
        font-size:.72rem;
      }

      .row{
        gap:8px;
        padding:12px;
        font-size:.9rem;
      }

      .kv{font-size:.92rem}
    }


    /* Sign and Pay logo + mobile QA pass */
    .brand-mark-img{
      object-fit:contain;
      border-radius:0;
      filter:drop-shadow(0 10px 22px rgba(0,0,0,.28));
    }

    .brand-title{
      display:block;
      white-space:nowrap;
      line-height:1;
    }

    .brand-sign{color:#fff;}
    .brand-and{color:#5f86ff;}
    .brand-pay{color:#20cda6;}

    .preview-line span:first-child,
    .row span:first-child,
    .tracking-item div,
    .use-row strong,
    .use-row span,
    .tab-btn strong,
    .tab-btn span{
      min-width:0;
    }

    @media (max-width:980px){
      html, body{max-width:100%; overflow-x:hidden;}
      .brand{max-width:min(56vw, 280px);}
      .brand-mark{width:44px;height:44px;}
      .brand-copy{min-width:0;}
      .hero-zone{padding-top:12px;}
      .hero-grid{align-items:start;}
      .showcase{overflow:visible;}
      .tab-btn.active{transform:none;}
      .tab-rail{padding:14px;}
      .cta-grid{grid-template-columns:1fr;}
    }

    @media (max-width:720px){
      .brand{gap:10px; max-width:calc(100vw - 92px);}
      .brand-title{font-size:.98rem; letter-spacing:-.045em;}
      .brand-sub{display:block; font-size:.62rem; letter-spacing:.11em;}
      .hero-copy{text-align:left;}
      .hero-copy h1{max-width:11ch;}
      .hero-copy p{line-height:1.68;}
      .hero-actions .btn{min-height:54px;}
      .micro-points{gap:12px;}
      .micro{padding:15px 16px;}
      .device-top{align-items:flex-start;}
      .device-top .tag{max-width:64%; white-space:normal; text-align:right; line-height:1.35;}
      .invoice-panel{gap:14px;}
      .invoice-rows{gap:8px;}
      .status-pill{white-space:normal; line-height:1.35; padding:9px 12px;}
      .row{grid-template-columns:minmax(0, 1fr) 40px 58px; align-items:start;}
      .row span{overflow-wrap:anywhere;}
      .row span:nth-child(2),
      .row span:nth-child(3){text-align:right;}
      .chart{height:104px;}
      .tracking-item{align-items:flex-start;}
      .tracking-item i{width:34px;height:34px;border-radius:11px;font-size:.88rem;}
      .stat-float{padding:16px;}
      .split-grid,
      .bento,
      .audience-wrap,
      .wait-grid,
      .faq-grid{gap:18px;}
      .shell-item{grid-template-columns:1fr; gap:12px;}
      .shell-item b{width:38px;height:38px;}
      .preview-sheet{min-height:auto;}
      .preview-line{display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:start; gap:14px;}
      .preview-line span:first-child{overflow-wrap:anywhere;}
      .tab-buttons{gap:10px;}
      .tab-btn{padding:17px 18px;}
      .use-row{align-items:flex-start; flex-direction:column; gap:4px;}
      .form-head .shell-kicker{align-self:flex-start;}
      .footer-inner{gap:20px;}
    }

    @media (max-width:560px){
      .brand-mark{width:40px;height:40px;}
      .brand-title{font-size:.94rem;}
      .brand-sub{font-size:.58rem;}
      .header-inner{gap:8px;}
      .menu-toggle{width:42px;height:42px;border-radius:13px;}
      .hero-copy h1{max-width:12ch;}
      .hero-copy p{font-size:.98rem;}
      .eyebrow{white-space:normal; height:auto; min-height:38px; padding-top:9px; padding-bottom:9px; line-height:1.25;}
      .invoice-panel,
      .metric-card,
      .actions-card,
      .tab-panel,
      .wait-wrap,
      .cta-shell,
      .side-shell,
      .bento-card,
      .faq-note,
      .wait-card{padding:18px;}
      .device-top .tag{font-size:.68rem;}
      .row{grid-template-columns:minmax(0, 1fr) 34px 52px; gap:7px; font-size:.86rem;}
      .kv{display:grid; grid-template-columns:minmax(0, 1fr) auto; align-items:start;}
      .chips{grid-template-columns:1fr;}
      .chip{height:46px;}
      .acc-btn{padding:20px 18px;}
      .acc-body p{padding:0 18px 20px;}
      .footer-nav{gap:12px 16px;}
    }

    @media (max-width:390px){
      .container{width:min(calc(100% - 18px), var(--container));}
      .brand{gap:8px;}
      .brand-title{font-size:.88rem;}
      .brand-sub{display:none;}
      .brand-mark{width:38px;height:38px;}
      h1{font-size:2.12rem;}
      h2{font-size:1.78rem;}
      .hero-actions{gap:10px;}
      .btn{height:52px; padding:0 18px;}
      .device-dots span{width:8px;height:8px;}
      .device-top .tag{max-width:68%;}
      .row{grid-template-columns:minmax(0, 1fr) 30px 48px;}
      .tracking-item{padding:11px 12px;}
    }


    /* mobile layout stabilization pass */
    .zone{
      overflow:hidden;
      overflow:clip;
      isolation:isolate;
    }

    .zone::before,
    .zone::after,
    .showcase-orb{
      pointer-events:none;
    }

    .hero-zone::before,
    .problem-zone::before,
    .problem-zone::after,
    .features-zone::before,
    .audience-zone::before{
      z-index:0;
    }

    .hero-grid,
    .showcase,
    .hero-device,
    .device-grid,
    .invoice-panel,
    .sidebar,
    .metric-card,
    .actions-card,
    .split-grid,
    .side-shell,
    .bento,
    .bento-card,
    .bento-preview,
    .preview-sheet,
    .mini-stack,
    .audience-wrap,
    .tab-rail,
    .tab-panel,
    .tab-content,
    .wait-wrap,
    .wait-grid,
    .wait-card,
    .faq-grid,
    .cta-shell,
    .cta-grid{
      min-width:0;
    }

    .row span,
    .preview-line span,
    .use-row span,
    .tracking-item span,
    .shell-item span,
    .micro span,
    .trust-tile span,
    .acc-btn strong{
      overflow-wrap:anywhere;
    }

    @media (max-width:980px){
      body{
        background:
          radial-gradient(circle at 18% 4%, rgba(90,114,255,.14), transparent 0 22%),
          linear-gradient(180deg, #050810 0%, #080d14 100%);
      }

      .hero-grid,
      .split-grid,
      .bento,
      .bento-preview,
      .audience-wrap,
      .tab-content,
      .wait-grid,
      .faq-grid,
      .cta-grid,
      .device-grid,
      .logo-strip{
        display:grid;
        grid-template-columns:minmax(0,1fr) !important;
        width:100%;
      }

      .showcase{
        display:grid;
        grid-template-columns:minmax(0,1fr);
        justify-items:stretch;
        align-items:start;
        width:100%;
        max-width:100%;
        min-height:0;
        gap:16px;
        overflow:visible;
      }

      .hero-device{
        width:100% !important;
        max-width:100% !important;
        margin:0;
        transform:none !important;
        transform-style:flat;
      }

      .stat-float{
        position:relative !important;
        inset:auto !important;
        width:100% !important;
        max-width:100%;
        margin:0;
        transform:none !important;
        z-index:2;
      }

      .float-left,
      .float-right{
        margin-top:0 !important;
      }

      .showcase-orb{
        width:72%;
        max-width:320px;
        inset:8% auto auto 18%;
        opacity:.42;
        filter:blur(22px);
        z-index:0;
      }

      .hero-device,
      .stat-float{
        z-index:1;
      }

      .problem-zone::before,
      .problem-zone::after,
      .features-zone::before,
      .audience-zone::before{
        opacity:.45;
      }
    }

    @media (max-width:720px){
      .container{
        width:min(calc(100% - 28px), var(--container)) !important;
      }

      .hero-zone{
        padding:14px 0 46px !important;
      }

      .hero-grid{
        gap:22px !important;
        padding-top:8px !important;
      }

      .hero-copy h1{
        max-width:12ch !important;
      }

      .hero-copy p,
      .section-head p,
      .bento-card p,
      .tab-copy p,
      .wait-copy p,
      .faq-note p,
      .cta-copy p{
        line-height:1.62;
      }

      .micro-points,
      .logo-strip,
      .shell-list,
      .mini-stack,
      .bullet-list,
      .accordion{
        gap:12px;
      }

      .showcase{
        gap:12px;
      }

      .showcase-orb{
        display:none;
      }

      .hero-device{
        padding:10px !important;
        border-radius:22px !important;
        box-shadow:
          inset 0 1px 0 rgba(255,255,255,.10),
          0 18px 52px rgba(0,0,0,.36) !important;
      }

      .hero-device::before{
        border-radius:22px !important;
      }

      .device-top{
        display:grid;
        grid-template-columns:auto minmax(0,1fr);
        align-items:center !important;
        gap:12px;
        padding:4px 4px 10px !important;
      }

      .device-top .tag{
        justify-self:end;
        max-width:100% !important;
        white-space:normal;
        text-align:right;
      }

      .panel,
      .invoice-panel,
      .metric-card,
      .actions-card{
        border-radius:18px !important;
      }

      .invoice-panel,
      .metric-card,
      .actions-card{
        padding:16px !important;
      }

      .invoice-head{
        display:grid !important;
        grid-template-columns:minmax(0,1fr);
        gap:12px;
      }

      .invoice-head p{
        line-height:1.48;
      }

      .status-pill{
        width:max-content;
        max-width:100%;
      }

      .row{
        display:grid;
        grid-template-columns:minmax(0,1fr) auto !important;
        gap:8px 12px !important;
        padding:11px 12px !important;
      }

      .row span:nth-child(2){
        display:none;
      }

      .row span:nth-child(3){
        text-align:right !important;
      }

      .row.muted-row{
        display:none;
      }

      .invoice-foot{
        gap:10px;
      }

      .kv{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) auto;
        align-items:start;
      }

      .tracking-item{
        display:grid;
        grid-template-columns:minmax(0,1fr) auto;
        align-items:start;
      }

      .problem-zone,
      .features-zone,
      .audience-zone,
      .waitlist-zone,
      .faq-zone{
        padding:76px 0 !important;
      }

      .section-head{
        gap:14px;
      }

      .split-grid,
      .bento,
      .audience-wrap,
      .wait-grid,
      .faq-grid{
        margin-top:28px;
      }

      .side-shell,
      .bento-card,
      .tab-panel,
      .wait-wrap,
      .wait-card,
      .faq-note,
      .cta-shell{
        padding:18px !important;
        border-radius:22px !important;
      }

      .tab-rail{
        padding:10px !important;
        border-radius:22px !important;
      }

      .tab-btn{
        padding:15px 16px !important;
      }

      .tab-panel{
        overflow:hidden;
      }

      .use-panel{
        padding:16px;
        border-radius:18px;
      }

      .wait-wrap::before{
        opacity:.55;
      }

      .form-head{
        display:grid !important;
        grid-template-columns:minmax(0,1fr);
      }

      .chips{
        grid-template-columns:1fr !important;
      }

      .acc-btn{
        align-items:flex-start;
      }

      .footer-inner,
      .footer-nav{
        min-width:0;
      }
    }

    @media (max-width:560px){
      .container{
        width:min(calc(100% - 22px), var(--container)) !important;
      }

      .site-header{
        --header-h:72px;
      }

      .brand{
        max-width:calc(100vw - 86px) !important;
      }

      .brand-title{
        font-size:.92rem !important;
      }

      .brand-sub{
        font-size:.56rem !important;
      }

      .hero-copy h1{
        font-size:clamp(2.08rem, 10.8vw, 2.85rem) !important;
        line-height:1.02;
      }

      h2{
        font-size:clamp(1.72rem, 8vw, 2.35rem) !important;
        line-height:1.05;
      }

      h3{
        font-size:1.12rem;
      }

      .hero-copy p,
      .section-head p,
      .bento-card p,
      .tab-copy p,
      .wait-copy p,
      .faq-note p,
      .cta-copy p{
        font-size:.96rem !important;
      }

      .btn{
        min-height:52px;
        height:auto;
        padding:14px 18px;
      }

      .device-dots{
        gap:6px;
      }

      .device-dots span{
        width:8px;
        height:8px;
      }

      .device-top .tag{
        font-size:.64rem !important;
        line-height:1.25;
      }

      .invoice-panel,
      .metric-card,
      .actions-card{
        padding:14px !important;
      }

      .chart{
        height:92px !important;
        gap:7px;
      }

      .shell-item{
        padding:15px !important;
      }

      .preview-sheet,
      .mini-card{
        padding:16px !important;
      }

      .metric-inline .item,
      .micro,
      .trust-tile{
        padding:15px !important;
      }
    }

    @media (max-width:390px){
      .container{
        width:min(calc(100% - 18px), var(--container)) !important;
      }

      .hero-device{
        padding:8px !important;
      }

      .invoice-panel,
      .metric-card,
      .actions-card{
        padding:12px !important;
      }

      .row{
        grid-template-columns:minmax(0,1fr) auto !important;
        font-size:.84rem !important;
      }

      .status-pill{
        font-size:.76rem !important;
      }

      .tracking-item i{
        width:30px !important;
        height:30px !important;
      }
    }


    /* v6 overlap cleanup */
    .audience-wrap{
      align-items:start;
    }

    .tab-rail,
    .tab-panel{
      align-self:start;
    }

    .audience-zone::before{
      display:none;
    }

    .use-row{
      display:grid;
      grid-template-columns:minmax(0,1fr);
      justify-content:initial;
      align-items:start;
      gap:5px;
    }

    .use-row strong,
    .use-row span{
      display:block;
      min-width:0;
      max-width:100%;
      white-space:normal;
      overflow-wrap:normal;
      word-break:normal;
    }

    .form-head .shell-kicker::before{
      display:none;
    }

    .form-head .shell-kicker{
      max-width:100%;
      white-space:normal;
      overflow-wrap:normal;
      word-break:normal;
      line-height:1.35;
    }

    .footer-inner{
      grid-template-columns:1fr auto;
    }

    .footer-nav{
      justify-self:end;
    }

    .footer-note{
      display:none !important;
    }

    @media (max-width:1180px){
      .audience-zone,
      .waitlist-zone{
        padding-top:96px;
        padding-bottom:96px;
      }
    }

    @media (max-width:720px){
      .audience-zone,
      .waitlist-zone{
        padding-top:76px !important;
        padding-bottom:76px !important;
      }

      .use-row{
        padding:14px 15px;
      }

      .form-head .shell-kicker{
        width:100%;
        justify-content:center;
        text-align:center;
      }

      .footer-inner{
        grid-template-columns:1fr;
      }

      .footer-nav{
        justify-self:start;
      }
    }


    /* v7 mobile header and menu polish */
    @media (max-width:980px){
      .site-header{
        overflow:visible;
      }

      .header-inner{
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        gap:12px !important;
        width:100%;
        min-width:0;
      }

      .brand{
        flex:0 1 auto;
        max-width:min(68vw, 320px) !important;
      }

      .header-actions{
        flex:0 0 auto;
        margin-left:auto !important;
        display:flex;
        align-items:center;
        justify-content:flex-end;
      }

      .menu-toggle{
        position:relative;
        z-index:130;
        display:inline-flex !important;
        align-items:center;
        justify-content:center;
        flex:0 0 46px;
        width:46px;
        height:46px;
        border-radius:16px;
        background:linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
        border:1px solid rgba(255,255,255,.12);
        box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 14px 30px rgba(0,0,0,.22);
      }

      .menu-toggle svg{
        transition:transform .2s ease;
      }

      .menu-toggle[aria-expanded="true"]{
        background:linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.055));
        border-color:rgba(255,255,255,.18);
      }

      .menu-toggle[aria-expanded="true"] svg{
        transform:rotate(90deg);
      }

      .site-nav{
        position:fixed !important;
        top:calc(var(--header-h) + 10px) !important;
        left:auto !important;
        right:max(16px, calc((100vw - var(--container)) / 2 + 16px)) !important;
        width:min(292px, calc(100vw - 32px)) !important;
        display:flex !important;
        flex-direction:column;
        gap:8px !important;
        padding:10px !important;
        border-radius:24px !important;
        background:linear-gradient(180deg, rgba(15,20,30,.985), rgba(8,12,20,.985)) !important;
        border:1px solid rgba(255,255,255,.11) !important;
        box-shadow:0 28px 70px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.06) !important;
        backdrop-filter:blur(18px);
        -webkit-backdrop-filter:blur(18px);
        transform:translateY(-8px) scale(.96) !important;
        transform-origin:top right;
        opacity:0 !important;
        visibility:hidden !important;
        pointer-events:none !important;
        transition:opacity .18s ease, transform .18s ease, visibility 0s linear .18s !important;
        z-index:120;
      }

      .site-nav.open{
        transform:translateY(0) scale(1) !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        transition-delay:0s !important;
      }

      .site-nav a{
        display:flex !important;
        align-items:center;
        min-height:50px;
        padding:0 16px !important;
        border-radius:16px !important;
        background:rgba(255,255,255,.045) !important;
        border:1px solid rgba(255,255,255,.055);
        color:rgba(255,255,255,.9) !important;
        font-size:.96rem;
        font-weight:800;
        letter-spacing:-.02em;
      }

      .site-nav a:hover{
        background:rgba(255,255,255,.075) !important;
        color:#fff !important;
      }

      .site-nav a::after{
        display:none !important;
      }
    }

    @media (max-width:560px){
      .header-inner{
        gap:10px !important;
      }

      .brand{
        max-width:calc(100vw - 98px) !important;
      }

      .menu-toggle{
        flex-basis:44px;
        width:44px !important;
        height:44px !important;
        border-radius:15px !important;
      }

      .site-nav{
        top:calc(var(--header-h) + 8px) !important;
        right:11px !important;
        width:min(280px, calc(100vw - 22px)) !important;
        border-radius:22px !important;
      }
    }

    @media (max-width:390px){
      .brand{
        max-width:calc(100vw - 86px) !important;
      }

      .site-nav a{
        min-height:48px;
      }
    }


    /* v4 business/content pass: defensive layout fixes */
    .field select{
      width:100%;
      height:58px;
      padding:0 18px;
      border-radius:18px;
      border:1px solid rgba(255,255,255,.09);
      background:rgba(255,255,255,.05);
      color:var(--ink);
      outline:none;
      appearance:none;
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }
    .field select:focus{
      border-color:rgba(90,114,255,.45);
      box-shadow:0 0 0 4px rgba(90,114,255,.12);
      background:rgba(255,255,255,.07);
    }
    .field select option{background:#0b1018;color:#f7f8fb;}
    .side-shell,
    .bento-card,
    .tab-panel,
    .wait-card,
    .faq-note,
    .cta-shell,
    .trust-tile{min-width:0;}
    .shell-item > div,
    .tracking-item > div,
    .use-row,
    .mini-card,
    .preview-line,
    .micro,
    .trust-tile{overflow-wrap:anywhere;}
    .use-row{grid-template-columns:minmax(0,.95fr) minmax(0,1fr);align-items:start;}
    .form-head{align-items:flex-start;}
    .form-head .shell-kicker{white-space:nowrap;}
    @media (max-width: 760px){
      .header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;}
      .header-actions{margin-left:auto;}
      .menu-toggle{margin-left:auto;}
      .site-nav.open{right:16px;left:auto;transform-origin:top right;}
      .use-row{grid-template-columns:1fr;gap:4px;}
      .form-head{display:grid;grid-template-columns:1fr;}
      .form-head .shell-kicker{width:max-content;max-width:100%;white-space:normal;}
      .field input,.field select{height:54px;border-radius:16px;}
    }
    @media (max-width: 430px){
      .site-nav.open{right:12px;width:min(260px, calc(100vw - 24px));}
      .shell-item{grid-template-columns:auto minmax(0,1fr);}
      .chips{display:grid;grid-template-columns:1fr;}
      .chip{width:100%;}
    }


    /* v5 header/menu corrections */
    html{
      scroll-padding-top:calc(var(--header-h) + 18px);
    }

    .site-header{
      position:fixed !important;
      top:0 !important;
      left:0 !important;
      right:0 !important;
      width:100% !important;
      z-index:300 !important;
    }

    main{
      padding-top:var(--header-h);
    }

    .menu-toggle{
      position:relative;
      overflow:hidden;
    }

    .menu-toggle svg{
      display:none !important;
    }

    .menu-line{
      position:absolute;
      left:50%;
      width:20px;
      height:2px;
      border-radius:999px;
      background:currentColor;
      transform:translateX(-50%);
      transition:transform .22s ease, opacity .16s ease, top .22s ease;
      transform-origin:center;
    }

    .menu-line:nth-child(1){top:15px;}
    .menu-line:nth-child(2){top:22px;}
    .menu-line:nth-child(3){top:29px;}

    .menu-toggle[aria-expanded="true"] .menu-line:nth-child(1){
      top:22px;
      transform:translateX(-50%) rotate(45deg);
    }

    .menu-toggle[aria-expanded="true"] .menu-line:nth-child(2){
      opacity:0;
      transform:translateX(-50%) scaleX(.4);
    }

    .menu-toggle[aria-expanded="true"] .menu-line:nth-child(3){
      top:22px;
      transform:translateX(-50%) rotate(-45deg);
    }

    .menu-toggle[aria-expanded="true"] svg{
      transform:none !important;
    }

    @media (max-width:980px){
      .site-header{
        background:linear-gradient(180deg, rgba(7,11,18,.96), rgba(7,11,18,.9)) !important;
        border-bottom:1px solid rgba(255,255,255,.07) !important;
        backdrop-filter:blur(18px);
        -webkit-backdrop-filter:blur(18px);
      }

      .site-nav{
        position:fixed !important;
        top:var(--header-h) !important;
        left:0 !important;
        right:0 !important;
        width:100vw !important;
        max-width:none !important;
        display:flex !important;
        flex-direction:column !important;
        gap:0 !important;
        padding:8px max(18px, calc((100vw - var(--container)) / 2 + 18px)) 16px !important;
        border-radius:0 0 26px 26px !important;
        background:linear-gradient(180deg, rgba(11,16,24,.985), rgba(8,12,20,.965)) !important;
        border:0 !important;
        border-bottom:1px solid rgba(255,255,255,.09) !important;
        box-shadow:0 28px 70px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.04) !important;
        backdrop-filter:blur(18px);
        -webkit-backdrop-filter:blur(18px);
        transform:translateY(-10px) !important;
        transform-origin:top center !important;
        opacity:0 !important;
        visibility:hidden !important;
        pointer-events:none !important;
        transition:opacity .18s ease, transform .18s ease, visibility 0s linear .18s !important;
        z-index:260 !important;
      }

      .site-nav.open{
        transform:translateY(0) !important;
        opacity:1 !important;
        visibility:visible !important;
        pointer-events:auto !important;
        transition-delay:0s !important;
      }

      .site-nav a{
        width:100% !important;
        min-height:54px !important;
        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;
        padding:0 !important;
        border-radius:0 !important;
        background:transparent !important;
        border:0 !important;
        box-shadow:none !important;
        color:rgba(255,255,255,.86) !important;
        font-size:1rem !important;
        font-weight:800 !important;
        letter-spacing:-.02em !important;
      }

      .site-nav a:hover,
      .site-nav a:focus-visible{
        background:transparent !important;
        color:#fff !important;
      }

      .site-nav a + a{
        border-top:1px solid rgba(255,255,255,.06) !important;
      }

      .site-nav a::after{
        display:none !important;
      }
    }

    @media (max-width:560px){
      .site-nav{
        top:var(--header-h) !important;
        left:0 !important;
        right:0 !important;
        width:100vw !important;
        padding:8px 18px 16px !important;
        border-radius:0 0 24px 24px !important;
      }

      .menu-line:nth-child(1){top:14px;}
      .menu-line:nth-child(2){top:21px;}
      .menu-line:nth-child(3){top:28px;}
      .menu-toggle[aria-expanded="true"] .menu-line:nth-child(1),
      .menu-toggle[aria-expanded="true"] .menu-line:nth-child(3){top:21px;}
    }

/* WordPress integration */
.admin-bar .site-header{top:32px}
.signpay-hp{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.page-zone{padding-top:calc(var(--header-h) + 90px);min-height:70vh}
.page-shell{max-width:920px}
.page-content-card{border:1px solid var(--line);border-radius:var(--radius-xl);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));box-shadow:var(--shadow-lg);padding:clamp(28px,5vw,64px)}
.page-content-card h1{margin:0 0 22px;color:var(--ink);font-size:clamp(40px,6vw,72px);line-height:.96;letter-spacing:-.06em}
.page-content-card h2{margin-top:36px;color:var(--ink);font-size:clamp(26px,3vw,36px);letter-spacing:-.04em}
.page-content-card h3{margin-top:28px;color:var(--ink);font-size:22px;letter-spacing:-.02em}
.page-content-card p,.page-content-card li{font-size:16px;line-height:1.75;color:var(--text)}
.page-content-card a{color:var(--gold-2)}
.entry-content ul{padding-left:1.25rem}
.footer-legal{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:18px;color:var(--muted)}
.footer-legal a{color:var(--muted);font-size:13px;text-decoration:none}
.footer-legal a:hover{color:var(--ink)}
.wait-form.is-loading{opacity:.72;pointer-events:none}
.form-status{min-height:22px}
@media (max-width:782px){.admin-bar .site-header{top:46px}}
@media (max-width:600px){.admin-bar .site-header{top:0}.page-content-card{padding:24px}.page-zone{padding-top:calc(var(--header-h) + 48px)}}