:root{
      --bg:#07131d;
      --bg-elevated:#0d1b2a;
      --panel:#112131;
      --panel-soft:#18293c;
      --text:#edf5f7;
      --muted:#92a3b5;
      --stroke:rgba(255,255,255,.09);
      --accent:#b7ff56;
      --accent2:#4de3ff;
      --accent3:#ff9d4d;
      --glow-purple:rgba(183,255,86,.3);
      --glow-cyan:rgba(77,227,255,.26);
      --glow-pink:rgba(255,157,77,.16);
      --radius:18px;
      --shadow:0 18px 40px rgba(0,0,0,.45);
    }
    *{box-sizing:border-box}
    html{overflow-x:hidden; scroll-padding-top:96px}
    html,body{max-width:100vw}
    @keyframes gradientMove{
      0%{background-position:0% 50%}
      50%{background-position:100% 50%}
      100%{background-position:0% 50%}
    }
    @keyframes fadeInUp{
      from{opacity:0;transform:translateY(30px)}
      to{opacity:1;transform:translateY(0)}
    }
    @keyframes float{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(-12px)}
    }
    body{
      margin:0;
      font-family:'Manrope',system-ui,-apple-system,sans-serif;
      background: var(--bg);
      color:var(--text);
      line-height:1.6;
      text-rendering:optimizeLegibility;
      scroll-behavior:smooth;
      min-height:100vh;
      position: relative;
      overflow-x: hidden;
    }
    body::before{
      content:"";
      position:fixed;
      top:0;left:0;right:0;bottom:0;
      background:
        radial-gradient(ellipse 80% 50% at 20% 20%, rgba(183,255,86,.14), transparent),
        radial-gradient(ellipse 60% 40% at 80% 30%, rgba(77,227,255,.12), transparent),
        radial-gradient(ellipse 70% 50% at 50% 90%, rgba(255,157,77,.07), transparent);
      background-size: 200% 200%;
      animation: gradientMove 15s ease infinite;
      pointer-events:none;
      z-index:-1;
    }
    .page-wrapper{
      animation: fadeInUp 0.8s ease-out;
    }
    a{color:inherit; text-decoration:none}
    img{max-width:100%; display:block}
    .container{width:min(1180px, 100% - 40px); margin:0 auto}
    header{
      position:sticky; top:0; z-index:30;
      padding:14px 0 8px;
      -webkit-backdrop-filter: blur(18px) saturate(150%);
      backdrop-filter: blur(18px) saturate(150%);
      background: linear-gradient(180deg, rgba(7,10,16,.84) 0%, rgba(7,10,16,.46) 64%, rgba(7,10,16,0) 100%);
      overflow-x:hidden;
    }
    .nav{
      position:relative;
      display:grid;
      grid-template-columns:auto 1fr auto;
      align-items:center;
      padding:10px 12px;
      margin:0;
      gap:18px;
      background: linear-gradient(155deg, rgba(18,24,36,.96), rgba(11,15,23,.92));
      border:1px solid rgba(255,255,255,.08);
      border-radius:24px;
      box-shadow: 0 18px 40px rgba(0,0,0,.28);
      overflow:visible;
      isolation:isolate;
    }
    .nav::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:24px;
      border:1px solid rgba(255,255,255,.05);
      pointer-events:none;
    }
    .nav::after{
      content:"";
      position:absolute;
      inset:1px;
      border-radius:23px;
      background:
        radial-gradient(circle at 18% 22%, rgba(183,255,86,.12), transparent 28%),
        radial-gradient(circle at 82% 24%, rgba(77,227,255,.12), transparent 28%);
      opacity:.9;
      pointer-events:none;
      z-index:-1;
    }
    .brand{
      display:inline-flex;
      align-items:center;
      gap:12px;
      min-width:0;
      font-weight:700;
      letter-spacing:.2px;
    }
    .brandLogo{
      width:38px; height:38px; border-radius:12px;
      object-fit:cover;
      box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 8px 20px rgba(0,0,0,.3), 0 0 18px rgba(77,227,255,.16);
      flex:none;
    }
    .brandLockup{
      display:grid;
      gap:2px;
      min-width:0;
    }
    .brandName{
      font-family:'Space Grotesk',system-ui,sans-serif;
      font-size:15px;
      font-weight:700;
      letter-spacing:-.02em;
      color:var(--text);
      line-height:1.05;
    }
    .brand small{
      display:block;
      color:rgba(233,238,246,.58);
      font-weight:600;
      font-size:11px;
      line-height:1.2;
      text-transform:uppercase;
      letter-spacing:.11em;
      white-space:nowrap;
    }
    .links{
      display:flex;
      justify-self:center;
      justify-content:center;
      gap:6px;
      align-items:center;
      padding:6px;
      border-radius:999px;
      background: rgba(255,255,255,.035);
      border:1px solid rgba(255,255,255,.06);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
      font-weight:600;
      color:rgba(233,238,246,.7);
      font-size:12.5px;
      letter-spacing:.15px;
    }
    .links a{
      padding:8px 12px;
      border-radius:999px;
      transition: color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
    }
    .links a:hover{
      color:var(--text);
      background: rgba(255,255,255,.06);
      transform: translateY(-1px);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
    }
    .navCta{
      position:relative;
      padding:10px 16px;
      border-radius:999px;
      font-size:13px;
      font-weight:700;
      letter-spacing:.1px;
      text-transform:none;
      background: linear-gradient(135deg, rgba(183,255,86,.98), rgba(77,227,255,.98));
      border:1px solid rgba(255,255,255,.18);
      color:#000;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:7px;
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      box-shadow: 0 14px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.18);
      overflow:hidden;
      white-space:nowrap;
    }
    .navCta::before{
      content:"";
      position:absolute;
      inset:1px;
      border-radius:999px;
      background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,0));
      opacity:.55;
      pointer-events:none;
    }
    .navCta:hover{
      transform: translateY(-1px);
      box-shadow: 0 18px 30px rgba(0,0,0,.32), 0 0 24px rgba(183,255,86,.14);
    }
    .btn{
      display:inline-flex; align-items:center; justify-content:center;
      padding:14px 20px; border-radius:12px;
      border:1px solid var(--stroke);
      background:var(--panel);
      color:var(--text); font-weight:700; font-size:14px; letter-spacing:.2px;
      transition: all .25s ease;
      cursor:pointer; gap:8px;
      box-shadow: 0 6px 18px rgba(15,23,42,.12);
      font-family:inherit;
    }
    .ctaRow .btn,
    .contactAction span,
    .fitOption,
    .faq-question span{
      overflow-wrap:anywhere;
    }
    .btn:hover{
      transform: translateY(-2px);
      border-color: var(--accent);
      box-shadow: 0 0 20px var(--glow-purple);
    }
    .btn.primary{
      background: linear-gradient(135deg, var(--accent), var(--accent2));
      border:none;
      box-shadow: 0 0 24px var(--glow-purple), 0 6px 18px rgba(15,23,42,.14);
      color:#fff;
      text-shadow: 0 1px 2px rgba(0,0,0,.45);
    }
    .btn.primary.darkText{
      color:#0b0d12;
      text-shadow:none;
      font-weight:600;
    }
    .btn.primary:hover{
      transform: translateY(-2px);
      box-shadow: 0 0 36px var(--glow-purple), 0 0 50px var(--glow-cyan), 0 10px 24px rgba(15,23,42,.18);
    }
    main{padding:22px 0 60px; overflow-x:hidden}
    section{padding:36px 0}
    .hero{padding-top:36px}
    .heroGrid{
      display:grid; grid-template-columns: 1.05fr .95fr; gap:32px; align-items:center;
    }
    .pill{
      display:inline-flex; align-items:center; gap:8px;
      padding:8px 14px; border-radius:999px;
      border:1px solid var(--accent);
      background:rgba(10,132,255,.12);
      color:var(--accent); font-weight:700; font-size:13px;
      box-shadow: 0 0 20px var(--glow-purple);
    }
    h1{
      margin:14px 0 20px; font-size:58px; line-height:1.05; letter-spacing:-1.5px;
      font-weight:700;
      background: linear-gradient(135deg, var(--text) 0%, var(--accent) 60%, var(--accent2) 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      background-size: 200% 200%;
      animation: gradientMove 8s ease infinite;
    }
    .lead{color:var(--muted); font-size:18px; max-width:56ch; margin:0 0 20px; line-height:1.6}
    .ctaRow{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
    .statRow{
      display:flex; gap:12px; margin-top:24px;
      background: rgba(255,255,255,.03);
      padding:8px;
      border-radius:16px;
      border:1px solid var(--stroke);
      max-width:56ch;
    }
    .stat{
      flex:1;
      padding:14px 20px; border-radius:10px;
      background:var(--panel);
      transition: all .2s ease;
      display:flex; flex-direction:column;
      text-align:center;
    }
    .stat:hover{
      background: rgba(255,255,255,.06);
    }
    .stat strong{
      display:block; font-size:22px; letter-spacing:-.2px; font-weight:700;
      background: linear-gradient(135deg, var(--accent2), var(--accent));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      margin-bottom:4px;
    }
    .stat span{color:var(--muted); font-size:12px; line-height:1.3}
    .heroVisual{display:flex; justify-content:center; align-items:center}
    .heroShot{
      position:relative;
      z-index:1;
      padding:4px; border-radius:22px;
      background: linear-gradient(135deg, var(--accent), var(--accent2), var(--accent3));
      box-shadow: 0 0 40px var(--glow-purple), 0 0 80px var(--glow-cyan);
      max-width:520px; margin:0 auto;
      cursor: pointer;
      animation: float 4s ease-in-out infinite;
    }
    .heroShot:hover{
      animation-play-state: paused;
      transform: translateY(-8px) scale(1.02);
      box-shadow: 0 0 60px var(--glow-purple), 0 0 120px var(--glow-cyan), 0 30px 60px rgba(15,23,42,.18);
      transition: transform .4s cubic-bezier(.25,.1,.25,1), box-shadow .4s ease;
    }
    .heroShot img{
      border-radius:18px;
      border:none;
      width:100%; height:auto; object-fit:contain;
      background:var(--panel); padding:12px;
      transition: transform .4s cubic-bezier(.25,.1,.25,1);
    }
    .heroShot:hover img{
      transform: scale(1.03);
    }
    .sectionHeader{
      display:flex; justify-content:space-between; align-items:flex-end; gap:12px; flex-wrap:wrap;
      margin-bottom:16px;
    }
    .sectionHeader h2{
      margin:0; font-size:28px; letter-spacing:-.2px;
      background: linear-gradient(135deg, var(--text), var(--accent2));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .sectionHeader p{margin:0; color:var(--muted)}
    .gridCards{
      display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr));
      gap:14px;
    }
    .card{
      border-radius:16px; border:1px solid var(--stroke);
      background:var(--panel); padding:20px;
      box-shadow: var(--shadow);
      transition: all .25s ease;
    }
    .card:hover{
      border-color: var(--accent2);
      box-shadow: 0 0 30px var(--glow-cyan);
      transform: translateY(-4px);
    }
    .card h3{margin:0 0 10px; font-size:17px; color:var(--text)}
    .card p{margin:0; color:var(--muted); font-size:14px; line-height:1.6}
    .stackItem{display:flex; gap:10px; align-items:flex-start}
    .stackDot{
      width:10px; height:10px; border-radius:999px;
      background:linear-gradient(135deg, var(--accent), var(--accent2));
      margin-top:7px; flex-shrink:0;
      box-shadow: 0 0 8px var(--glow-purple);
    }
    .flowGrid{
      display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr));
      gap:14px;
    }
    .flowTag{
      display:inline-flex; align-items:center; gap:6px;
      padding:6px 12px; border-radius:999px;
      background:linear-gradient(135deg, rgba(10,132,255,.16), rgba(90,200,250,.16));
      color:var(--accent2);
      font-weight:700; font-size:12px; border:1px solid var(--accent2);
      margin-bottom:12px;
      box-shadow: 0 0 10px var(--glow-cyan);
    }
    .flowList{
      list-style:none; padding:0; margin:12px 0 0;
      display:grid; gap:8px; color:var(--muted); font-size:14px;
    }
    .gallery{
      display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr));
      gap:12px;
    }
    .gallery figure{
      margin:0; border-radius:16px; overflow:hidden;
      border:1px solid var(--stroke);
      background:var(--panel); position:relative;
      transition: all .3s ease;
    }
    .gallery figure:hover{
      transform:translateY(-6px);
      box-shadow: 0 0 40px var(--glow-purple);
      border-color: var(--accent);
    }
    .gallery img{
      width:100%; height:300px;
      object-fit:contain;
      background:var(--panel-soft);
      padding:12px;
    }
    .gallery figcaption{
      position:absolute; inset:0;
      background:linear-gradient(180deg, transparent 40%, rgba(8,12,18,.85));
      padding:16px; color:#fff; display:flex; align-items:flex-end; justify-content:center;
      text-align:center;
      font-weight:700; letter-spacing:.2px; font-size:14px;
      opacity:0; transition: opacity .3s ease;
    }
    .gallery figure:hover figcaption{opacity:1}
    .cta{
      padding:28px; border-radius:20px; border:1px solid var(--accent);
      background: linear-gradient(135deg, var(--panel) 0%, var(--bg-elevated) 100%);
      color:var(--text); box-shadow: 0 0 50px var(--glow-purple); overflow:hidden; overflow-x:clip; position:relative;
    }
    .contactGrid{
      display:grid; grid-template-columns: repeat(2, minmax(0,1fr));
      gap:24px; align-items:start; position:relative; z-index:1;
    }
    .contactCopy{display:grid; gap:12px; max-width:760px}
    .formCard{
      background:var(--panel);
      border:1px solid var(--stroke);
      border-radius:16px;
      padding:20px;
      box-shadow: var(--shadow);
    }
    .formRow{
      display:grid; gap:12px; margin-bottom:12px;
    }
    .formRow.inline{grid-template-columns: repeat(2, minmax(0,1fr))}
    .formField{display:grid; gap:6px; position:relative}
    .formField label{
      font-weight:700; font-size:12px; color:var(--muted); letter-spacing:.2px;
      transition:all .2s ease;
    }
    .formField:focus-within label{color:var(--accent)}
    .field{
      width:100%;
      border:1px solid var(--stroke);
      border-radius:12px;
      padding:12px 14px;
      font-family:inherit; font-size:14px; color:var(--text);
      background:var(--bg-elevated);
      transition: all .3s cubic-bezier(.25,.1,.25,1);
      position: relative;
    }
    .field::placeholder{color:var(--muted); transition: opacity .2s ease}
    .field:focus::placeholder{opacity:0.5}
    .field:hover{
      border-color: rgba(10,132,255,.35);
      background: var(--panel-soft);
    }
    .field:focus{
      outline:none;
      border-color: var(--accent);
      box-shadow: 0 0 20px var(--glow-purple), 0 0 40px rgba(10,132,255,.15);
      background: var(--bg-elevated);
      transform: translateY(-1px);
    }
    .formActions{
      display:flex; gap:10px; flex-wrap:wrap; align-items:center;
    }
    .helper{font-size:12px; color:var(--muted)}
    .cta h3{
      margin:0 0 10px; font-size:24px;
      background: linear-gradient(135deg, var(--text), var(--accent));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .cta p{margin:0 0 14px; color:var(--muted)}
    .cta::before{
      content:""; position:absolute; top:-50%; right:-20%; width:400px; height:400px;
      background: radial-gradient(circle, var(--glow-purple) 0%, transparent 70%);
      opacity:.3; pointer-events:none;
    }
    .cta::after{
      content:""; position:absolute; bottom:-30%; left:-10%; width:300px; height:300px;
      background: radial-gradient(circle, var(--glow-cyan) 0%, transparent 70%);
      opacity:.2; pointer-events:none;
    }
    .contactNote{margin-top:10px}
    footer{
      position:relative;
      padding:50px 0 36px;
      border-top:1px solid var(--stroke);
      background: linear-gradient(180deg, rgba(14,18,28,.98), rgba(9,12,18,.98));
      overflow:hidden;
      overflow-x:clip;
    }
    footer::before{
      content:"";
      position:absolute;
      top:-120px;
      right:-120px;
      width:280px;
      height:280px;
      background: radial-gradient(circle, rgba(90,200,250,.2), transparent 70%);
      filter: blur(10px);
      opacity:.8;
      pointer-events:none;
      z-index:0;
    }
    footer::after{
      content:"";
      position:absolute;
      bottom:-140px;
      left:-120px;
      width:320px;
      height:320px;
      background: radial-gradient(circle, rgba(10,132,255,.18), transparent 70%);
      filter: blur(8px);
      opacity:.7;
      pointer-events:none;
      z-index:0;
    }
    .footerPanel{
      position:relative;
      padding:28px 30px 20px;
      background: linear-gradient(160deg, rgba(18,24,36,.96), rgba(10,14,22,.98));
      border:1px solid rgba(255,255,255,.08);
      border-radius:28px;
      box-shadow: 0 26px 60px rgba(0,0,0,.28);
      overflow:hidden;
      z-index:1;
    }
    .footerPanel::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:28px;
      border:1px solid rgba(255,255,255,.06);
      pointer-events:none;
    }
    .footerContent{
      display:grid;
      grid-template-columns: minmax(0,1fr) auto;
      align-items:end;
      gap:28px;
      margin-bottom:18px;
    }
    .footerBrand{
      display:grid;
      gap:14px;
    }
    .footerMark{
      display:inline-flex;
      align-items:center;
      gap:12px;
    }
    .footerLogo{
      width:42px;
      height:42px;
      object-fit:contain;
      filter: drop-shadow(0 10px 18px rgba(0,0,0,.22));
    }
    .footerWordmark{
      font-size:20px;
      font-weight:800;
      letter-spacing:-.03em;
      background: linear-gradient(135deg, var(--text), var(--accent2));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .footerBrand p{
      color:var(--muted);
      font-size:14px;
      line-height:1.6;
      margin:0;
      max-width:440px;
    }
    .footerBadges{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
    }
    .footerBadge{
      display:inline-flex;
      align-items:center;
      padding:8px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.1);
      color:rgba(233,238,246,.82);
      font-size:11px;
      font-weight:700;
      letter-spacing:.3px;
    }
    .footerCols{
      display:flex;
      justify-content:flex-end;
      align-items:center;
    }
    .footerCol{
      display:flex;
      flex-wrap:wrap;
      justify-content:flex-end;
      gap:10px 12px;
    }
    .footerCol a{
      display:inline-flex;
      align-items:center;
      color:rgba(233,238,246,.78);
      font-size:13px;
      padding:10px 14px;
      border-radius:999px;
      background:rgba(255,255,255,.03);
      border:1px solid rgba(255,255,255,.08);
      transition:color .2s ease, transform .2s ease, border-color .2s ease, background .2s ease;
    }
    .footerCol a:hover{
      color:var(--text);
      background:rgba(183,255,86,.08);
      border-color:rgba(183,255,86,.36);
      transform: translateY(-1px);
    }
    .footerBottom{
      display:grid;
      grid-template-columns:auto minmax(0,1fr);
      align-items:start;
      gap:12px 24px;
      padding-top:16px;
      border-top:1px solid var(--stroke);
      color:var(--muted);
      font-size:12px;
    }
    .footerLegal{
      letter-spacing:.2px;
      line-height:1.6;
    }
    .footerBottom .footerLegal:last-child{
      justify-self:end;
      max-width:520px;
      text-align:right;
      color:rgba(143,153,170,.86);
    }
    @media (max-width:900px){
      .footerContent{
        grid-template-columns:1fr;
        gap:24px;
      }
      .footerCols{
        justify-content:flex-start;
      }
      .footerCol{
        justify-content:flex-start;
      }
      .footerBottom{
        grid-template-columns:1fr;
        gap:8px;
      }
      .footerBottom .footerLegal:last-child{
        justify-self:start;
        text-align:left;
        max-width:none;
      }
    }
    @media (max-width:768px){
      footer{padding:40px 0 32px}
      .footerPanel{
        padding:32px 24px;
        border-radius:24px;
        background: linear-gradient(160deg, rgba(20,28,42,.97), rgba(12,16,24,.98));
      }
      .footerContent{
        gap:28px;
        margin-bottom:24px;
      }
      .footerBrand{
        text-align:center;
        justify-items:center;
        padding-bottom:24px;
        border-bottom:1px solid rgba(255,255,255,.06);
      }
      .footerMark{
        gap:10px;
      }
      .footerLogo{
        width:38px;
        height:38px;
      }
      .footerWordmark{
        font-size:24px;
        letter-spacing:-.5px;
      }
      .footerBrand p{
        max-width:320px;
        font-size:15px;
        line-height:1.7;
        color:rgba(233,238,246,.7);
      }
      .footerBadges{
        justify-content:center;
        gap:10px;
      }
      .footerBadge{
        font-size:11px;
        padding:8px 14px;
        background:rgba(0,245,212,.08);
        border-color:rgba(0,245,212,.4);
      }
      .footerCol{
        justify-content:center;
      }
      .footerCol a{
        font-size:14px;
        padding:10px 14px;
        color:rgba(233,238,246,.85);
      }
      .footerCol a:hover{transform:none}
      .footerBottom{
        text-align:center;
        padding-top:20px;
        gap:8px;
      }
      .footerLegal{
        font-size:12px;
        line-height:1.6;
        color:rgba(143,153,170,.8);
      }
      .footerBottom .footerLegal:last-child{
        justify-self:center;
        text-align:center;
        max-width:420px;
      }
    }
    @media (max-width:480px){
      .footerPanel{padding:28px 20px}
      .footerBrand p{font-size:14px}
      .footerBadges{
        flex-direction:column;
        align-items:center;
        gap:8px;
      }
      .footerBadge{
        width:auto;
        min-width:160px;
        justify-content:center;
      }
      .footerCol{
        gap:10px;
      }
      .footerCol a{
        width:100%;
        justify-content:center;
      }
    }
    .menuToggle{
      display:none;
      width:42px; height:42px;
      background: rgba(255,255,255,.04);
      border:1px solid rgba(255,255,255,.1);
      border-radius:999px;
      cursor:pointer;
      padding:0;
      flex-direction:column; gap:5px; justify-content:center;
      align-items:center;
      box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
    }
    .menuToggle span{
      display:block; width:18px; height:2px; background:rgba(233,238,246,.92);
      border-radius:2px; transition: transform .2s ease, opacity .2s ease;
    }
    .menuToggle.open span:nth-child(1){transform: rotate(45deg) translate(5px, 5px)}
    .menuToggle.open span:nth-child(2){opacity:0}
    .menuToggle.open span:nth-child(3){transform: rotate(-45deg) translate(5px, -5px)}
    @media (max-width: 1024px){
      header{overflow:visible}
      h1{font-size:36px}
      .heroGrid{grid-template-columns:1fr; gap:26px}
      .nav{
        grid-template-columns:minmax(0, 1fr) auto;
        gap:12px;
        padding:10px;
      }
      .menuToggle{display:flex}
      .navCta{display:none}
      .links{
        display:none;
        position:absolute; top:calc(100% + 12px); left:0; right:0;
        z-index:50;
        background: linear-gradient(165deg, rgba(23,31,46,.98) 0%, rgba(12,17,27,.98) 100%);
        -webkit-backdrop-filter:blur(24px) saturate(180%);
        backdrop-filter:blur(24px) saturate(180%);
        flex-direction:column; padding:14px; gap:8px;
        border:1px solid rgba(255,255,255,.08);
        border-radius:22px;
        box-shadow:
          0 24px 50px rgba(0,0,0,.42),
          0 0 40px rgba(77,227,255,.08),
          inset 0 1px 0 rgba(255,255,255,.08);
      }
      .links.open{
        display:flex;
        animation: menuSlideIn .25s ease-out;
      }
      @keyframes menuSlideIn{
        from{opacity:0; transform:translateY(-10px)}
        to{opacity:1; transform:translateY(0)}
      }
      .links a{
        padding:14px 16px;
        font-size:15px;
        font-weight:600;
        color:rgba(233,238,246,.85);
        background: rgba(255,255,255,.035);
        border:1px solid rgba(255,255,255,.06);
        border-radius:16px;
        transition: all .2s ease;
      }
      .links a:hover, .links a:active{
        background: linear-gradient(135deg, rgba(183,255,86,.14) 0%, rgba(77,227,255,.1) 100%);
        border-color:rgba(183,255,86,.22);
        color:#fff;
        transform:translateX(4px);
        box-shadow: 0 8px 24px rgba(0,0,0,.18);
      }
      .mobileNavCta{
        display:flex;
        justify-content:center;
        background: linear-gradient(135deg, rgba(183,255,86,.98), rgba(77,227,255,.98));
        border-color:rgba(255,255,255,.16);
        color:#081018;
        font-weight:700;
        box-shadow: 0 12px 24px rgba(0,0,0,.2);
      }
    }
    @media (max-width: 720px){
      .container{width:min(100%, 100% - 28px)}
      h1{font-size:30px}
      header{padding-top: max(10px, env(safe-area-inset-top, 0px))}
      .nav{
        margin:0;
        padding:9px 10px;
        border-radius:20px;
      }
      .brand{
        gap:10px;
      }
      .brandLogo{
        width:34px;
        height:34px;
        border-radius:11px;
      }
      .brandName{
        font-size:14px;
      }
      .brand small{
        font-size:10px;
        letter-spacing:.09em;
      }
      .statRow{flex-wrap:wrap}
      .stat{padding:12px 28px}
      .gallery img{height:240px}
      .contactGrid{grid-template-columns:1fr}
      .formRow.inline{grid-template-columns:1fr}
      .heroVisual{margin-top:6px}
      .signalRail{margin-top:16px}
    }
    @media (max-width: 480px){
      .nav{padding:8px}
      .brand small{display:none}
      .links a{padding:12px 14px}
    }
    /* FAQ Accordion */
    .faq-toggle{
      display:flex; align-items:center; gap:10px;
      margin-top:12px;
      background:var(--panel); border:1px solid var(--stroke);
      padding:14px 20px; border-radius:12px;
      font-family:inherit; font-size:14px; font-weight:700;
      color:var(--text); cursor:pointer;
      transition: all .25s ease;
    }
    .faq-toggle:hover{
      border-color:var(--accent);
      box-shadow: 0 0 20px var(--glow-purple);
    }
    .faq-toggle-icon{
      transition: transform .3s ease;
    }
    .faq-toggle.open .faq-toggle-icon{transform:rotate(180deg)}
    .faq-list{
      display:grid; gap:12px;
      max-height:0; overflow:hidden;
      opacity:0;
      transition: max-height .4s ease, opacity .3s ease, margin .3s ease;
      margin-top:0;
    }
    .faq-list.open{
      max-height:2000px;
      opacity:1;
      margin-top:16px;
    }
    .faqListNarrow{
      max-width:760px;
      margin-left:auto;
      margin-right:auto;
    }
    .faq-item{
      background:var(--panel);
      border:1px solid var(--stroke);
      border-radius:14px;
      overflow:hidden;
      transition: all .25s ease;
    }
    .faq-item:hover{border-color:var(--accent2)}
    .faq-question{
      display:flex; justify-content:space-between; align-items:center;
      padding:18px 20px;
      background:none; border:none; width:100%;
      font-family:inherit; font-size:15px; font-weight:700;
      color:var(--text); text-align:left;
      cursor:pointer; gap:16px;
    }
    .faq-question:hover{color:var(--accent)}
    .faq-icon{
      width:24px; height:24px; flex-shrink:0;
      display:flex; align-items:center; justify-content:center;
      border-radius:8px;
      background:linear-gradient(135deg, var(--accent), var(--accent2));
      color:#fff; font-size:18px; font-weight:400;
      transition: transform .25s ease;
    }
    .faq-item.open .faq-icon{transform:rotate(45deg)}
    .faq-answer{
      max-height:0; overflow:hidden;
      transition: max-height .3s ease, padding .3s ease;
    }
    .faq-item.open .faq-answer{max-height:300px}
    .faq-answer-inner{
      padding:0 20px 18px;
      color:var(--muted); font-size:14px; line-height:1.7;
    }
    /* Product Showcase - Apple Style */
    .productSection{
      text-align: center;
      padding: 60px 0;
    }
    .productSection h2{
      font-size: 42px;
      font-weight: 700;
      letter-spacing: -1px;
      margin: 0 0 8px;
      background: linear-gradient(135deg, var(--text) 30%, var(--accent2));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .productSection .subtitle{
      color: var(--muted);
      font-size: 18px;
      font-weight: 500;
      margin: 0 0 50px;
    }
    .productDisplay{
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      max-width: 900px;
      margin: 0 auto;
    }
    .productTile{
      position: relative;
      background: linear-gradient(165deg, rgba(24,32,46,1) 0%, rgba(17,23,34,1) 100%);
      border-radius: 24px;
      padding: 48px 24px 24px;
      transition: transform .4s cubic-bezier(.25,.1,.25,1), box-shadow .4s ease;
    }
    .productTile:hover{
      transform: translateY(-8px) scale(1.02);
      box-shadow: 0 30px 60px rgba(0,0,0,.5), 0 0 40px var(--glow-purple);
    }
    .productTile img{
      width: 100%;
      height: 140px;
      object-fit: contain;
      margin-bottom: 20px;
      filter: drop-shadow(0 10px 18px rgba(15,23,42,.18));
      transition: transform .4s cubic-bezier(.25,.1,.25,1);
    }
    .productTile:hover img{
      transform: scale(1.08);
    }
    .productTile h3{
      margin: 0 0 4px;
      font-size: 18px;
      font-weight: 700;
      color: var(--text);
    }
    .productTile p{
      margin: 0;
      font-size: 13px;
      color: var(--muted);
    }
    .productTile .badge{
      position: absolute;
      top: 16px;
      right: 16px;
      padding: 4px 10px;
      border-radius: 20px;
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .5px;
      background: linear-gradient(135deg, rgba(0,245,212,.95), rgba(56,242,255,.95));
      color: #0b0d12;
      border: 1px solid rgba(0,0,0,.25);
      z-index: 10;
    }
    @media (max-width: 768px){
      .productSection h2{font-size: 32px}
      .productSection .subtitle{font-size: 16px; margin-bottom: 36px}
      .productDisplay{
        grid-template-columns: 1fr;
        max-width: 320px;
        gap: 16px;
      }
      .productTile{padding: 24px 20px 20px}
      .productTile img{height: 120px}
    }

    /* Scroll animations */
    .fade-in{
      opacity:0;
      transform:translateY(30px);
      transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    }
    .fade-in.visible{
      opacity:1;
      transform:translateY(0);
    }
    .fade-in-delay-1{transition-delay:0.1s}
    .fade-in-delay-2{transition-delay:0.2s}
    .fade-in-delay-3{transition-delay:0.3s}
    @media (prefers-reduced-motion: reduce){
      .fade-in{opacity:1; transform:none; transition:none}
    }

    /* Custom Cursor */
    .cursor{
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--accent), var(--accent2));
      position: fixed;
      pointer-events: none;
      z-index: 9999;
      opacity: 0;
      transform: translate(-50%, -50%);
      transition: width .2s, height .2s, opacity .3s;
      mix-blend-mode: screen;
    }
    .cursor.visible{opacity: 0.6}
    .cursor.clicking{
      width: 15px;
      height: 15px;
      opacity: 0.8;
    }
    .cursor.hovering{
      width: 40px;
      height: 40px;
      opacity: 0.4;
    }
    @media (max-width: 768px), (hover: none){
      .cursor{display: none}
    }

    /* Revenue Calculator */
    .calculatorSection{
      padding: 80px 0;
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .calculatorSection::before{
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 600px;
      height: 600px;
      background: radial-gradient(circle, var(--glow-purple) 0%, transparent 70%);
      opacity: 0.15;
      pointer-events: none;
    }
    .calculatorSection h2{
      font-size: 40px;
      margin: 0 0 8px;
      background: linear-gradient(135deg, var(--text), var(--accent2));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .calculatorSection .subtitle{
      color: var(--muted);
      font-size: 16px;
      margin: 0 0 40px;
    }
    .calculator{
      max-width: 500px;
      margin: 0 auto;
      background: linear-gradient(145deg, rgba(20,25,35,.95), rgba(15,18,28,.98));
      border: 1px solid rgba(138,92,246,.3);
      border-radius: 24px;
      padding: 32px;
      text-align: left;
      box-shadow: 0 0 60px rgba(138,92,246,.15), 0 0 100px rgba(6,182,212,.1), 0 25px 50px rgba(0,0,0,.4);
      position: relative;
      overflow: hidden;
    }
    .calculator::before{
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--accent), var(--accent2), transparent);
    }
    .calcField{
      margin-bottom: 20px;
    }
    .calcField label{
      display: block;
      font-size: 13px;
      font-weight: 700;
      color: var(--muted);
      margin-bottom: 8px;
    }
    .calcField input[type="range"]{
      width: 100%;
      height: 8px;
      border-radius: 4px;
      background: linear-gradient(90deg, rgba(138,92,246,.2), rgba(6,182,212,.2));
      appearance: none;
      outline: none;
      cursor: pointer;
    }
    .calcField input[type="range"]::-webkit-slider-thumb{
      appearance: none;
      width: 24px;
      height: 24px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--accent), var(--accent2));
      cursor: pointer;
      box-shadow: 0 0 20px var(--glow-purple), 0 0 40px rgba(6,182,212,.3);
      border: 2px solid rgba(255,255,255,.2);
      transition: transform .15s ease, box-shadow .15s ease;
    }
    .calcField input[type="range"]::-webkit-slider-thumb:hover{
      transform: scale(1.15);
      box-shadow: 0 0 30px var(--glow-purple), 0 0 50px rgba(6,182,212,.4);
    }
    .calcValue{
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 6px;
    }
    .calcValue span{
      font-size: 24px;
      font-weight: 700;
      color: var(--text);
    }
    .calcValue small{
      font-size: 12px;
      color: var(--muted);
    }
    .calcResult{
      background: linear-gradient(135deg, rgba(138,92,246,.12), rgba(6,182,212,.08));
      border: 1px solid rgba(138,92,246,.4);
      border-radius: 16px;
      padding: 28px;
      text-align: center;
      margin-top: 28px;
      position: relative;
      box-shadow: 0 0 40px rgba(138,92,246,.1) inset;
    }
    .calcResult p{
      margin: 0 0 8px;
      font-size: 14px;
      color: var(--muted);
      text-transform: uppercase;
      letter-spacing: 1px;
    }
    .calcResult strong{
      font-size: 52px;
      font-weight: 800;
      background: linear-gradient(135deg, #00f5d4, var(--accent), var(--accent2));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      display: block;
      text-shadow: 0 0 60px rgba(0,245,212,.3);
      animation: glow 2s ease-in-out infinite alternate;
    }
    @keyframes glow{
      from{filter: drop-shadow(0 0 20px rgba(138,92,246,.4));}
      to{filter: drop-shadow(0 0 30px rgba(0,245,212,.5));}
    }
    .calcResult small{
      display: block;
      margin-top: 12px;
      font-size: 12px;
      color: var(--muted);
    }
    .calcAssumptions{
      margin-top: 16px;
      padding: 12px;
      background: rgba(255,255,255,.03);
      border-radius: 8px;
      border: 1px solid rgba(255,255,255,.08);
    }
    .calcAssumptions p{
      margin: 0;
      font-size: 12px;
      color: var(--muted);
    }

    /* ===== ENHANCED MOBILE OPTIMIZATION ===== */

    /* Small phones (480px and below) */
    @media (max-width: 480px) {
      /* Base typography adjustments */
      h1 { font-size: 26px; letter-spacing: -0.5px; line-height: 1.15; }
      .lead { font-size: 15px; line-height: 1.6; }
      .sectionHeader h2 { font-size: 22px; }
      .sectionHeader p { font-size: 13px; }

      /* Hero pill optimization */
      .pill {
        font-size: 10px;
        padding: 6px 10px;
        text-align: center;
        line-height: 1.4;
      }

      /* CTA buttons on mobile */
      .btn.primary {
        width: auto;
        justify-content: center;
        padding: 12px 18px;
        font-size: 14px;
      }
      .btn {
        padding: 10px 16px;
        font-size: 13px;
      }
      .navCta {
        padding: 5px 10px;
        font-size: 11px;
      }

      /* Contact section mobile */
      #contact .cta {
        padding: 24px 16px;
      }
      #contact h3 {
        font-size: 24px !important;
      }
      #contact .btn.primary {
        padding: 14px 24px;
        font-size: 15px;
      }
      #contact .btn {
        padding: 10px 14px;
        font-size: 12px;
      }

      /* Trust badges mobile - stack vertically */
      #contact [style*="display:flex"][style*="gap:16px"] {
        flex-direction: column;
        gap: 8px !important;
      }

      /* Container breathing room */
      .container { width: calc(100% - 24px); }
      main { padding: 16px 0 40px; }
      section { padding: 28px 0; }

      /* Hero improvements */
      .hero { padding-top: 20px; }
      .ctaRow {
        flex-direction: column;
        align-items: stretch;
      }
      .ctaRow .btn {
        width: 100%;
      }
      .pill { font-size: 11px; padding: 6px 10px; }
      .statRow {
        flex-direction: column;
        gap: 8px;
        padding: 6px;
        max-width: 100%;
      }
      .stat {
        padding: 12px 16px;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        text-align: left;
      }
      .stat strong {
        font-size: 18px;
        margin-bottom: 0;
        margin-right: 12px;
      }
      .stat span { font-size: 11px; text-align: right; }
      .heroShot { max-width: 280px; }
      .heroShot img { padding: 8px; }
      .heroNote {
        font-size: 12px;
        text-align: center;
      }

      /* Cards grid */
      .gridCards, .flowGrid { gap: 10px; }
      .card { padding: 16px; border-radius: 14px; }
      .card h3 { font-size: 15px; }
      .card p { font-size: 13px; }

      /* Flow tags */
      .flowTag { font-size: 11px; padding: 5px 10px; }
      .flowList { font-size: 13px; gap: 6px; }

      /* Calculator mobile */
      .calculatorSection { padding: 50px 0; }
      .calculatorSection h2 { font-size: 28px; }
      .calculatorSection .subtitle { font-size: 14px; margin-bottom: 28px; }
      .calculator {
        padding: 20px 16px;
        border-radius: 18px;
        margin: 0 4px;
      }
      .calcField label { font-size: 12px; }
      .calcValue span { font-size: 20px; }
      .calcValue small { font-size: 11px; }
      .calcResult { padding: 20px 16px; border-radius: 12px; }
      .calcResult strong { font-size: 38px; }
      .calcResult p { font-size: 12px; }
      .calcResult small { font-size: 11px; }
      .calcAssumptions { padding: 10px; }
      .calcAssumptions p { font-size: 11px; }

      /* Product section mobile */
      .productSection { padding: 40px 0; }
      .productSection h2 { font-size: 26px; }
      .productSection .subtitle { font-size: 14px; margin-bottom: 28px; }
      .productDisplay { max-width: 100%; gap: 12px; }
      .productTile {
        padding: 20px 16px 16px;
        border-radius: 18px;
      }
      .productTile img { height: 100px; margin-bottom: 14px; }
      .productTile h3 { font-size: 16px; }
      .productTile p { font-size: 12px; }
      .productTile .badge {
        font-size: 10px;
        padding: 3px 8px;
        top: 12px;
        right: 12px;
      }

      /* Gallery mobile */
      .gallery { gap: 10px; }
      .gallery img { height: 200px; padding: 8px; }

      /* FAQ mobile */
      .faq-toggle {
        padding: 12px 16px;
        font-size: 13px;
        width: 100%;
        justify-content: center;
      }
      .faq-question {
        padding: 14px 16px;
        font-size: 14px;
        gap: 12px;
      }
      .faq-icon { width: 22px; height: 22px; font-size: 16px; }
      .faq-answer-inner { padding: 0 16px 14px; font-size: 13px; }

      /* Contact/CTA mobile */
      .cta { padding: 20px 16px; border-radius: 16px; }
      .cta h3 { font-size: 24px; }
      .cta p { font-size: 14px; }

      /* Response time badge mobile */
      .cta [style*="inline-flex"][style*="gap:8px"] {
        padding: 6px 12px !important;
      }
      .cta [style*="inline-flex"] span:last-child {
        font-size: 12px !important;
      }
      .contactCopy { gap: 10px; }
      .contactNote { font-size: 11px; line-height: 1.5; }
      .fitSummary { font-size: 16px; }
      .fitGuidance { font-size: 12px; }
      .fitHighlights li { font-size: 13px; padding-left: 16px; }

      /* Form mobile */
      .formCard { padding: 16px; border-radius: 14px; }
      .formRow { gap: 10px; margin-bottom: 10px; }
      .formField label { font-size: 11px; }
      .field {
        padding: 14px 12px;
        font-size: 16px; /* Prevents iOS zoom */
        border-radius: 10px;
      }
      textarea.field { min-height: 100px; }
      .formActions {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
      }
      .formActions .btn { width: 100%; justify-content: center; }
      .helper { text-align: center; font-size: 11px; }
    }

    /* Extra small phones (360px and below) */
    @media (max-width: 360px) {
      h1 { font-size: 22px; }
      .lead { font-size: 14px; }
      .container { width: calc(100% - 20px); }
      .nav { padding: 4px 8px; gap: 8px; }
      .links { left: 4%; right: 4%; }
      .brand { font-size: 12px; gap: 8px; }
      .brandLogo { width: 28px; height: 28px; }
      .navCta {
        padding: 4px 8px;
        font-size: 10px;
      }
      .heroShot { max-width: 240px; }
      .calculator { padding: 16px 12px; }
      .calcResult strong { font-size: 32px; }
      .btn.primary {
        padding: 10px 16px;
        font-size: 13px;
      }
      .btn {
        padding: 8px 12px;
        font-size: 12px;
      }
    }

    /* Touch device improvements */
    @media (hover: none) and (pointer: coarse) {
      /* Show gallery captions always on touch */
      .gallery figcaption {
        opacity: 1;
        background: linear-gradient(180deg, transparent 30%, rgba(8,12,18,.9));
      }

      /* Larger touch targets (44px minimum) */
      .btn {
        min-height: 48px;
        padding: 14px 20px;
      }
      .navCta {
        min-height: 40px;
        padding: 10px 16px;
      }
      .links a {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .faq-question { min-height: 48px; }
      .faq-toggle { min-height: 48px; }
      .menuToggle {
        width: 44px;
        height: 44px;
      }

      /* Disable hover transforms on touch */
      .card:hover,
      .productTile:hover,
      .gallery figure:hover,
      .stat:hover {
        transform: none;
      }

      /* Keep subtle glow on active state instead */
      .card:active { border-color: var(--accent2); }
      .productTile:active {
        box-shadow: 0 0 30px var(--glow-purple);
      }
    }

    /* Improve tap highlight on iOS */
    a, button, .card, .productTile, .stat {
      -webkit-tap-highlight-color: rgba(0, 245, 212, 0.1);
    }

    /* Safe area padding for notched phones */
    @supports (padding: max(0px)) {
      .container {
        padding-left: max(12px, env(safe-area-inset-left));
        padding-right: max(12px, env(safe-area-inset-right));
      }
      footer {
        padding-bottom: max(36px, env(safe-area-inset-bottom));
      }
    }

    /* Landscape phone optimization */
    @media (max-height: 500px) and (orientation: landscape) {
      .hero { padding-top: 12px; }
      .heroGrid { gap: 16px; }
      h1 { font-size: 28px; margin: 10px 0 14px; }
      .lead { font-size: 14px; margin-bottom: 12px; }
      .statRow { margin-top: 12px; }
      section { padding: 24px 0; }
      .calculatorSection { padding: 40px 0; }
      .productSection { padding: 40px 0; }
    }

    /* Handles Grid - What We Handle Section */
    .handles-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      max-width: 900px;
      margin: 0 auto;
    }
    .handles-grid .card {
      text-align: center;
      padding: 20px 16px;
    }
    .handles-grid .card h3 {
      font-size: 15px;
      margin: 0;
    }

    @media (max-width: 768px) {
      .handles-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
      }
      .handles-grid .card {
        padding: 16px 12px;
      }
      .handles-grid .card h3 {
        font-size: 14px;
      }
    }

    @media (max-width: 400px) {
      .handles-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
      }
      .handles-grid .card {
        padding: 14px 10px;
      }
      .handles-grid .card h3 {
        font-size: 13px;
        line-height: 1.3;
      }
    }

    /* Better text readability on mobile */
    @media (max-width: 720px) {
      body {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
      }

      /* Prevent text from being too wide on tablets */
      .lead { max-width: 100%; }
      .contactCopy p { max-width: 100%; }

      /* Better line heights for mobile reading */
      .card p,
      .faq-answer-inner,
      .contactNote {
        line-height: 1.65;
      }
    }

    h1,
    h2,
    h3,
    .brand,
    .btn,
    .pill,
    .flowTag,
    .sectionHeader h2,
    .productSection h2,
    .calculatorSection h2,
    .cta h3,
    .footerBrand h3{
      font-family:'Space Grotesk',system-ui,sans-serif;
    }
    .nav{overflow:visible}
    .navCta{
      background: linear-gradient(135deg, rgba(183,255,86,.98), rgba(77,227,255,.98));
      border-color: rgba(255,255,255,.18);
      color:#081018;
    }
    .navCta:hover{
      border-color: rgba(255,255,255,.26);
    }
    .links a.active{
      color:var(--text);
      background:linear-gradient(135deg, rgba(183,255,86,.16), rgba(77,227,255,.12));
      box-shadow: inset 0 0 0 1px rgba(183,255,86,.18), 0 0 18px rgba(183,255,86,.06);
    }
    .mobileNavCta{display:none}
    .scrollMeter{
      position:absolute;
      left:0;
      right:0;
      bottom:0;
      height:2px;
      background:rgba(255,255,255,.05);
      overflow:hidden;
    }
    .scrollMeterFill{
      display:block;
      width:100%;
      height:100%;
      transform:scaleX(0);
      transform-origin:left center;
      background:linear-gradient(90deg, var(--accent), var(--accent2), var(--accent3));
      box-shadow:0 0 16px rgba(183,255,86,.35);
    }
    .sectionCenter{
      display:block;
      text-align:center;
    }
    .sectionCenter-left{
      display:block;
      text-align:left;
    }
    .sectionCenter p,
    .sectionCenter-left p{
      margin-top:8px;
      color:var(--muted);
    }
    .heroCopy{
      display:grid;
      align-content:center;
      min-width:0;
    }
    .heroNote{
      margin:14px 0 0;
      font-size:13px;
      color:var(--muted);
    }
    .statRow{max-width:none}
    .heroStage{
      width:min(100%, 420px);
      display:grid;
    }
    .heroStage .heroShot{
      margin:0 auto;
      width:min(100%, 380px);
    }
    .heroGrid > *,
    .fitGrid > *,
    .contactGrid > *,
    .footerContent > *{
      min-width:0;
    }
    .signalRail{
      display:grid;
      grid-template-columns:repeat(3, minmax(0,1fr));
      gap:12px;
      margin-top:22px;
    }
    .signalItem{
      display:grid;
      gap:6px;
      padding:18px 18px 16px;
      border-radius:18px;
      border:1px solid var(--stroke);
      background:linear-gradient(160deg, rgba(17,33,49,.92), rgba(12,24,38,.82));
      box-shadow:var(--shadow);
    }
    .signalItem strong{
      font-size:15px;
      letter-spacing:-.2px;
    }
    .signalItem span{
      color:var(--muted);
      font-size:13px;
      line-height:1.55;
    }
    .ctaRow{
      width:100%;
    }
    .ctaRow .btn,
    .contactPanel .btn,
    .contactAction,
    .fitOption{
      min-width:0;
    }
    .fitSection{
      padding-top:20px;
    }
    .fitGrid{
      display:grid;
      grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
      gap:24px;
      align-items:start;
    }
    .fitOptions{
      display:grid;
      grid-template-columns:repeat(2, minmax(0,1fr));
      gap:12px;
    }
    .fitOption{
      width:100%;
      min-height:66px;
      padding:18px 18px;
      border-radius:18px;
      border:1px solid var(--stroke);
      background:linear-gradient(165deg, rgba(18,30,44,.94), rgba(11,21,32,.92));
      color:var(--text);
      text-align:left;
      font:inherit;
      font-weight:700;
      letter-spacing:-.1px;
      cursor:pointer;
      transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease, background .25s ease;
    }
    .fitOption:hover{
      transform:translateY(-2px);
      border-color:rgba(77,227,255,.45);
      box-shadow:0 12px 28px rgba(0,0,0,.28);
    }
    .fitOption.active{
      border-color:rgba(183,255,86,.65);
      background:linear-gradient(160deg, rgba(183,255,86,.12), rgba(77,227,255,.08));
      box-shadow:0 0 0 1px rgba(183,255,86,.12), 0 18px 36px rgba(0,0,0,.25);
    }
    .fitCard{
      display:grid;
      gap:16px;
      padding:24px;
      border-radius:24px;
      border:1px solid rgba(183,255,86,.2);
      background:linear-gradient(160deg, rgba(14,26,39,.96), rgba(9,18,28,.94));
      box-shadow:0 22px 48px rgba(0,0,0,.34), 0 0 36px rgba(183,255,86,.08);
      position:sticky;
      top:92px;
    }
    .fitCardTop{
      display:flex;
      justify-content:space-between;
      align-items:flex-end;
      gap:16px;
    }
    .fitLabel{
      font-size:12px;
      text-transform:uppercase;
      letter-spacing:.9px;
      color:var(--muted);
      font-weight:700;
    }
    .fitCardTop strong{
      font-size:44px;
      line-height:1;
      letter-spacing:-1.8px;
      color:var(--text);
    }
    .fitMeter{
      height:12px;
      border-radius:999px;
      background:rgba(255,255,255,.08);
      overflow:hidden;
    }
    .fitMeter span{
      display:block;
      width:0;
      height:100%;
      border-radius:inherit;
      background:linear-gradient(90deg, var(--accent), var(--accent2), var(--accent3));
      box-shadow:0 0 18px rgba(183,255,86,.24);
      transition:width .3s ease;
    }
    .fitSummary{
      margin:0;
      font-size:18px;
      line-height:1.45;
    }
    .fitGuidance{
      margin:-6px 0 0;
      color:var(--muted);
      font-size:13px;
    }
    .fitHighlights{
      margin:0;
      padding:0;
      list-style:none;
      display:grid;
      gap:10px;
    }
    .fitHighlights li{
      position:relative;
      padding-left:18px;
      color:var(--muted);
      font-size:14px;
      line-height:1.6;
    }
    .fitHighlights li::before{
      content:"";
      position:absolute;
      left:0;
      top:10px;
      width:8px;
      height:8px;
      border-radius:999px;
      background:linear-gradient(135deg, var(--accent), var(--accent2));
      box-shadow:0 0 12px rgba(183,255,86,.28);
    }
    .calculator{
      border-color:rgba(183,255,86,.24);
      box-shadow:0 0 60px rgba(183,255,86,.08), 0 0 100px rgba(77,227,255,.08), 0 25px 50px rgba(0,0,0,.4);
    }
    .calcField input[type="range"]{
      background:linear-gradient(90deg, rgba(183,255,86,.18), rgba(77,227,255,.2));
    }
    .calcResult{
      background:linear-gradient(135deg, rgba(183,255,86,.12), rgba(77,227,255,.08));
      border-color:rgba(183,255,86,.28);
      box-shadow:0 0 40px rgba(183,255,86,.08) inset;
    }
    @keyframes glow{
      from{filter:drop-shadow(0 0 18px rgba(183,255,86,.28));}
      to{filter:drop-shadow(0 0 28px rgba(77,227,255,.38));}
    }
    .productFootnote{
      margin:22px auto 0;
      max-width:620px;
      color:var(--muted);
      font-size:14px;
    }
    .contactCopy h3{
      margin:0;
      font-size:34px;
      line-height:1.08;
      letter-spacing:-1px;
      background:linear-gradient(135deg, var(--text), var(--accent2));
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
      background-clip:text;
    }
    .contactChecklist{
      display:grid;
      gap:10px;
    }
    .contactStep{
      display:grid;
      grid-template-columns:auto 1fr;
      gap:12px;
      align-items:flex-start;
      padding:14px 16px;
      border-radius:16px;
      border:1px solid rgba(255,255,255,.06);
      background:rgba(255,255,255,.03);
    }
    .contactStep strong{
      width:30px;
      height:30px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border-radius:999px;
      background:linear-gradient(135deg, var(--accent), var(--accent2));
      color:#081018;
      font-size:14px;
    }
    .contactStep span{
      color:var(--text);
      font-size:14px;
      line-height:1.55;
    }
    .contactPanel{
      display:grid;
      gap:12px;
      align-content:start;
    }
    .contactPanelEyebrow{
      font-size:12px;
      text-transform:uppercase;
      letter-spacing:1px;
      color:var(--muted);
      font-weight:700;
    }
    .contactAction{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:16px;
      padding:14px 16px;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.08);
      background:rgba(255,255,255,.03);
      transition:border-color .2s ease, transform .2s ease, background .2s ease;
    }
    .contactAction:hover{
      transform:translateY(-1px);
      border-color:rgba(77,227,255,.42);
      background:rgba(77,227,255,.06);
    }
    .contactAction strong{
      font-size:14px;
      color:var(--muted);
      text-transform:uppercase;
      letter-spacing:.7px;
    }
    .contactAction span{
      font-size:15px;
      color:var(--text);
      font-weight:700;
    }
    .contactPromises{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:4px;
    }
    .contactPromises span{
      display:inline-flex;
      align-items:center;
      padding:8px 12px;
      border-radius:999px;
      background:rgba(183,255,86,.08);
      border:1px solid rgba(183,255,86,.24);
      color:var(--text);
      font-size:12px;
      font-weight:700;
    }
    @media (max-width:540px){
      .container{
        width:calc(100% - 24px);
      }
      h1{
        font-size:24px;
        line-height:1.1;
        letter-spacing:-.6px;
        max-width:100%;
        overflow-wrap:anywhere;
      }
      .lead{
        max-width:100%;
        font-size:15px;
        overflow-wrap:anywhere;
      }
      .heroNote{
        font-size:12px;
        line-height:1.5;
      }
      .pill{
        width:100%;
        justify-content:center;
        text-align:center;
        line-height:1.4;
      }
      .ctaRow{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:10px;
      }
      .ctaRow .btn{
        width:100%;
        min-height:50px;
      }
      .statRow{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:8px;
        padding:6px;
      }
      .stat{
        width:100%;
      }
      .signalRail{
        grid-template-columns:1fr !important;
      }
      .fitGrid{
        grid-template-columns:1fr !important;
      }
      .fitOptions{
        grid-template-columns:1fr !important;
      }
      .fitCard{
        position:static;
        top:auto;
      }
      .fitCardTop{
        align-items:center;
      }
      .handles-grid{
        grid-template-columns:1fr;
      }
      .heroStage{
        gap:12px;
      }
      .heroShot{
        max-width:100%;
      }
    }
    @media (prefers-reduced-motion: reduce){
      .scrollMeterFill{
        transition:none;
      }
      .fitMeter span{
        transition:none;
      }
    }
    @media (max-width:1024px){
      .mobileNavCta{
        display:flex;
        width:100%;
        justify-content:center;
        background:linear-gradient(135deg, rgba(183,255,86,.95), rgba(77,227,255,.95));
        color:#081018;
        border-color:transparent;
      }
      .signalRail{
        grid-template-columns:1fr;
      }
      .fitGrid{
        grid-template-columns:1fr;
      }
      .fitCard{
        position:static;
        top:auto;
      }
    }
    @media (max-width:900px){
      .contactGrid{
        grid-template-columns:1fr;
      }
    }
    @media (max-width:720px){
      .fitOptions{
        grid-template-columns:1fr;
      }
      .contactCopy h3{
        font-size:28px;
      }
    }
    @media (max-width:480px){
      .signalItem{
        padding:16px;
      }
      .fitOption{
        min-height:60px;
        padding:16px;
        font-size:14px;
      }
      .fitCard{
        padding:20px;
      }
      .fitCardTop strong{
        font-size:36px;
      }
      .contactAction{
        flex-direction:column;
        align-items:flex-start;
      }
      .contactPromises{
        display:grid;
      }
    }