*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
  :root{
    --bg:#0D0D0D; --bg2:#141414; --panel:#131313; --panel2:#191919;
    --line:rgba(255,255,255,0.09); --line2:rgba(255,255,255,0.16);
    --bone:#F5F5F5; --white:#FFFFFF; --muted:#8A8A8A; --faint:#6A6A6A; --gold:#B8FF00; --gold-lt:#CBFF4D; --grey:#3A3A3A;
    --wa:#25D366;
    --serif:'Space Grotesk',system-ui,sans-serif;
    --sans:'Space Grotesk',system-ui,sans-serif;
    --mono:'Space Mono',ui-monospace,'SFMono-Regular',monospace;
    --glass-bg:rgba(255,255,255,0.06); --glass-brd:rgba(255,255,255,0.14); --glass-blur:18px;
    color-scheme:dark;
  }
  :root[data-theme="light"]{
    --bg:#F7F7F5; --bg2:#EFEFEC; --panel:#FFFFFF; --panel2:#F3F3F0;
    --line:rgba(13,13,13,0.10); --line2:rgba(13,13,13,0.18);
    --bone:#141414; --white:#0D0D0D; --muted:#5B5B57; --faint:#8B8B85; --grey:#D8D8D2;
    --gold:#5C7A00; --gold-lt:#75990A;
    --glass-bg:rgba(13,13,13,0.045); --glass-brd:rgba(13,13,13,0.10);
    color-scheme:light;
  }
  :root[data-theme="light"] body{background:var(--bg);color:var(--bone)}
  :root[data-theme="light"] .nav-links a{background:rgba(13,13,13,0.05);border-color:rgba(13,13,13,0.12);color:rgba(20,20,20,0.85)}
  :root[data-theme="light"] .nav-links a:hover{color:#121212}
  :root[data-theme="light"] .feature-media{background:linear-gradient(135deg,#1c1c1e,#101012)}
  :root[data-theme="light"] .wa-float,:root[data-theme="light"] .bk-send{color:#fff}
  :root[data-theme="light"] .nav-book,:root[data-theme="light"] .btn-solid{color:#fff}
  :root[data-theme="light"] .svc-tab.on{color:#fff}
  /* light mode: darken pastel tier/accent colors so they read on white panels */
  :root[data-theme="light"] .svc[data-tier=bronze] .svc-name{color:#8A4E14}
  :root[data-theme="light"] .svc[data-tier=silver] .svc-name{color:#5B6570}
  :root[data-theme="light"] .svc[data-tier=gold] .svc-name{color:#9C6E00}
  :root[data-theme="light"] .svc[data-tier=ppf] .svc-name{color:#1D6FB8}
  :root[data-theme="light"] .svc[data-tier=tint] .svc-name{color:#0E8FA3}
  :root[data-theme="light"] .cov-chip.t{color:#0E7A8C}
  :root[data-theme="light"] .qb-promo-msg.err,:root[data-theme="light"] .bk-err{color:#B14A2B}
  :root[data-theme="light"] .faq-group-label{color:#5C7A00!important}
  :root[data-theme="light"] .faq-group-label:hover{color:#75990A!important}
  :root[data-theme="light"] .faq-gchev{color:#5C7A00!important}
  .theme-hint{position:absolute;top:calc(100% + 10px);right:0;white-space:nowrap;font-family:var(--sans);font-size:0.68rem;
    background:var(--bone);color:var(--bg);padding:0.5rem 0.8rem;border-radius:8px;opacity:0;pointer-events:none;
    transform:translateY(-4px);transition:opacity .3s,transform .3s;box-shadow:0 10px 24px rgba(0,0,0,0.25)}
  .theme-hint::after{content:"";position:absolute;bottom:100%;right:14px;border:5px solid transparent;border-bottom-color:var(--bone)}
  .theme-hint.show{opacity:1;transform:translateY(0);pointer-events:auto}
  :root[data-theme="light"] ::selection{background:var(--bone);color:var(--bg)}
  html{scroll-behavior:smooth;transition:background-color .4s ease}
  body{transition:background-color .4s ease,color .4s ease}
  body{background:var(--bg);color:var(--bone);font-family:var(--sans);font-weight:300;line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased}
  ::selection{background:var(--bone);color:var(--bg)}
  .serif{font-family:var(--serif);font-weight:300;letter-spacing:-0.01em;line-height:1.04}
  .eyebrow{font-size:0.66rem;letter-spacing:0.34em;text-transform:uppercase;color:var(--gold);font-weight:500}
  /* Brand-kit alignment: Space Grotesk for all labels, captions & specs */
  .eyebrow,.nav-links a,.nav-book,.btn,.prod-head span,.prod-tab,.svc-tab,.svc-cat,.svc-from,
  .prod-swipe-hint,.svc-swipe-hint,.cov-hint,.cov-view-label,.cov-legend,.foot-col h4,.scroll-cue,
  .cap,.bk-send,.bk-hint,.bk-err,.ci-title,.faq-group-label,.qb-pgroup,.cov-slabels{font-family:var(--mono)}

  /* buttons */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:0.55rem;font-family:var(--sans);font-size:0.72rem;font-weight:600;
    letter-spacing:0.18em;text-transform:uppercase;padding:1.05rem 2.2rem;cursor:pointer;border:1px solid transparent;border-radius:2px;
    text-decoration:none;transition:transform .22s ease,box-shadow .22s ease,background .22s,border-color .22s,color .22s;background:none;position:relative;overflow:hidden}
  .btn-solid{background:linear-gradient(135deg,var(--gold-lt),var(--gold));color:#121212;box-shadow:0 6px 22px rgba(198,255,0,0.22)}
  .btn-solid:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(198,255,0,0.40);color:#121212}
  .btn-ghost{border-color:var(--line2);color:var(--bone)}
  .btn-ghost:hover{border-color:var(--gold);color:var(--gold-lt);transform:translateY(-2px)}
  /* premium CTA band */
  .cta-band{position:relative;padding:6.5rem 0;border-top:1px solid var(--line);background:radial-gradient(ellipse at 50% 130%, rgba(198,255,0,0.12), transparent 62%)}
  .cta-inner{text-align:center;max-width:700px;margin:0 auto}
  .cta-title{font-size:clamp(2.1rem,6vw,3.6rem);line-height:1.04;margin-top:1.2rem;letter-spacing:-0.01em}
  .cta-title em{font-style:italic;color:var(--gold)}
  .cta-sub{color:var(--muted);font-size:1rem;line-height:1.8;margin:1.6rem auto 2.6rem;max-width:50ch}
  .cta-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

  /* before/after comparison slider */
  .ba-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;margin-top:2.4rem}
  .ba-slider{position:relative;aspect-ratio:4/5;border-radius:20px;overflow:hidden;border:1px solid var(--line2);isolation:isolate;background:#0d0d0f}
  .ba-layer{position:absolute;inset:0;background-image:var(--ba-img);background-repeat:no-repeat;background-size:200% 100%}
  .ba-before{background-position:left center}
  .ba-after{background-position:right center;clip-path:inset(0 0 0 var(--ba-pos,50%))}
  .ba-handle{position:absolute;top:0;bottom:0;left:var(--ba-pos,50%);width:2px;background:#fff;transform:translateX(-50%);pointer-events:none;box-shadow:0 0 14px rgba(0,0,0,.45);z-index:2}
  .ba-handle::before{content:"";position:absolute;top:50%;left:50%;width:44px;height:44px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);box-shadow:0 6px 18px rgba(0,0,0,.35)}
  .ba-handle-arrows{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:0.7rem;color:#121212;letter-spacing:0.06em;z-index:1}
  .ba-tag{position:absolute;top:1rem;font-family:var(--mono);font-size:0.62rem;letter-spacing:0.14em;text-transform:uppercase;color:#fff;background:rgba(13,13,13,0.55);padding:0.4rem 0.8rem;border-radius:999px;pointer-events:none;backdrop-filter:blur(6px);z-index:2}
  .ba-tag-before{left:1rem}
  .ba-tag-after{right:1rem}
  .ba-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none;z-index:3}
  .ba-caption{position:absolute;left:1rem;bottom:1rem;color:#fff;font-size:0.82rem;background:rgba(13,13,13,0.5);padding:0.35rem 0.8rem;border-radius:999px;backdrop-filter:blur(6px);z-index:2}
  @media(max-width:820px){.ba-grid{grid-template-columns:1fr}}

  /* nav */
  nav{position:fixed;top:1rem;left:50%;transform:translateX(-50%);z-index:100;display:flex;align-items:center;justify-content:space-between;gap:clamp(0.8rem,2.5vw,2.5rem);
    width:min(1180px,calc(100% - 2.4rem));padding:0.7rem clamp(0.8rem,3vw,1.6rem);border-radius:999px;box-sizing:border-box;overflow:visible;
    background:linear-gradient(var(--glass-bg),var(--glass-bg)),rgba(10,10,10,0.42);
    border:1px solid var(--glass-brd);backdrop-filter:blur(var(--glass-blur)) saturate(140%);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(140%);
    box-shadow:0 10px 34px rgba(0,0,0,0.32);
    transition:background .3s,padding .3s,box-shadow .3s,top .3s,width .3s}
  :root[data-theme="light"] nav{background:linear-gradient(var(--glass-bg),var(--glass-bg)),rgba(255,255,255,0.55)}
  nav.scrolled{top:0.6rem;width:min(1080px,calc(100% - 2.4rem));padding:0.6rem 1.4rem;box-shadow:0 12px 40px rgba(0,0,0,0.34)}
  .logo{font-family:var(--sans);font-weight:700;font-size:1.35rem;letter-spacing:0.14em;text-transform:uppercase;color:#fff;text-decoration:none;flex:0 1 auto;white-space:nowrap}
  nav.scrolled .logo{color:var(--bone)}
  .logo span{color:var(--gold)}
  .nav-links{display:flex;gap:2rem;list-style:none;flex-wrap:nowrap;white-space:nowrap}
  .nav-links a{color:rgba(255,255,255,0.85);font-size:0.72rem;font-weight:500;letter-spacing:0.18em;text-transform:uppercase;text-decoration:none;transition:color .2s}
  nav.scrolled .nav-links a{color:var(--muted)}
  nav.scrolled .nav-links a:hover{color:var(--gold)}
  .nav-links a:hover{color:var(--gold)}
  .nav-book{font-size:0.7rem;letter-spacing:0.18em;text-transform:uppercase;color:#121212;background:linear-gradient(135deg,var(--gold-lt),var(--gold));border:1px solid var(--gold);
    padding:0.65rem 1.45rem;cursor:pointer;font-family:var(--sans);font-weight:600;transition:.2s;border-radius:2px;box-shadow:0 4px 14px rgba(198,255,0,0.22);flex:0 0 auto;white-space:nowrap}
  .nav-book:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(198,255,0,0.4);color:#121212}
  .nav-right{display:flex;align-items:center;gap:0.5rem;flex:0 0 auto}
  .theme-toggle{display:flex;align-items:center;justify-content:center;gap:0.4rem;width:auto;height:38px;padding:0 0.8rem 0 0.7rem;border-radius:999px;
    background:transparent;color:var(--bone);cursor:pointer;transition:border-color .2s,transform .2s;flex:0 0 auto}
  .theme-toggle:hover{border-color:var(--gold);transform:translateY(-1px)}
  .theme-toggle svg{width:16px;height:16px;flex:0 0 auto}
  .theme-toggle .tt-label{font-family:var(--sans);font-size:0.62rem;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.75)}
  .theme-toggle{color:#fff}
  nav.scrolled .theme-toggle,nav.scrolled .theme-toggle .tt-label{color:var(--bone)}
  @media(max-width:520px){ nav{gap:0.4rem} .logo{font-size:1.02rem} .theme-toggle .tt-label{font-size:0.56rem} .theme-toggle{padding:0 0.55rem 0 0.55rem} .nav-book{padding:0.6rem 0.9rem;font-size:0.62rem} }
  @media(max-width:400px){ .logo{font-size:0.85rem;letter-spacing:0.08em} }
  @media(max-width:380px){ .theme-toggle .tt-label{display:none} .theme-toggle{padding:0;width:36px} }
  :root[data-theme="light"] .theme-toggle .i-moon{display:none}
  :root:not([data-theme="light"]) .theme-toggle .i-sun{display:none}
  .nav-toggle{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    width:38px;height:38px;padding:0;background:none;border:1px solid var(--line2);border-radius:50%;cursor:pointer;flex:0 0 auto}
  .nav-toggle span{display:block;width:18px;height:1.6px;background:var(--bone);transition:transform .25s,opacity .2s}
  nav.nav-open .nav-toggle span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
  nav.nav-open .nav-toggle span:nth-child(2){opacity:0}
  nav.nav-open .nav-toggle span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}
  /* collapse the link row into a dropdown before it can crowd the logo / CTA */
  @media(max-width:1100px){
    .nav-toggle{display:flex}
    .nav-links{position:fixed;top:calc(1rem + 62px);left:1.2rem;right:1.2rem;flex-direction:column;gap:0;border-radius:20px;overflow:hidden;
      background:rgba(18,18,18,0.97);backdrop-filter:blur(14px);border-top:1px solid var(--line);
      border-bottom:1px solid var(--line);padding:0.4rem 0;display:none;box-shadow:0 24px 50px rgba(0,0,0,0.5)}
    nav.nav-open .nav-links{display:flex}
    .nav-links li{width:100%}
    .nav-links a{display:block;width:100%;padding:0.95rem clamp(1.3rem,5vw,4rem);font-size:0.74rem;color:var(--bone)}
    .nav-links a:hover{color:var(--gold);background:rgba(255,255,255,0.05)}
  }

  /* hero */
  #hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:7rem clamp(1.3rem,5vw,4rem) 5rem;position:relative;overflow:hidden;background:radial-gradient(120% 100% at 50% 0%,#1a1a1a,#0d0d0d 60%)}
  :root[data-theme="light"] #hero{background:radial-gradient(120% 100% at 50% 0%,#e9e9e5,#dcdcd6 60%)}
  /* full-bleed rounded hero photo */
  .hero-photo{position:absolute;inset:clamp(0.6rem,1.4vw,1.1rem);border-radius:28px;overflow:hidden;z-index:0;
     background-image:var(--hero-img);background-size:cover;background-position:center;background-color:#0d0d0f}
  .hero-overlay{position:absolute;inset:0;background:
     linear-gradient(180deg,rgba(8,8,9,0.72) 0%,rgba(8,8,9,0.42) 38%,rgba(8,8,9,0.85) 100%),
     linear-gradient(90deg,rgba(8,8,9,0.8) 0%,rgba(8,8,9,0.15) 62%)}
  /* CSS car-scene placeholder (shows until --hero-img loads a real photo) */
  .hero-scene{position:absolute;inset:0;overflow:hidden}
  .hs-sky{position:absolute;inset:0;background:linear-gradient(180deg,#2a2d33 0%,#3a3d44 30%,#23262b 60%,#15161a 100%)}
  .hs-road{position:absolute;left:-10%;right:-10%;bottom:0;height:44%;background:
     linear-gradient(180deg,#1a1c20,#0c0d0f);transform:perspective(420px) rotateX(46deg);transform-origin:bottom}
  .hs-road::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:5%;transform:translateX(-50%);
     background:repeating-linear-gradient(180deg,rgba(184,255,0,0.5) 0 8%,transparent 8% 20%)}
  .hs-car{position:absolute;right:8%;bottom:24%;width:46%;height:30%;border-radius:46% 38% 30% 26%/60% 60% 40% 40%;
     background:linear-gradient(135deg,#c8d0d8,#7e858d 55%,#2c2f34);box-shadow:0 24px 50px rgba(0,0,0,0.5),inset 0 6px 16px rgba(255,255,255,0.25)}
  .hs-streak{position:absolute;inset:0;background:
     radial-gradient(60% 40% at 75% 70%,rgba(184,255,0,0.12),transparent 60%),
     repeating-linear-gradient(95deg,rgba(255,255,255,0.04) 0 2px,transparent 2px 14px);opacity:.5}
  .hero-inner{position:relative;z-index:2;max-width:820px}
  .hero-eyebrow{margin-bottom:1.6rem;color:var(--gold-lt)}
  #hero h1{font-family:var(--sans);font-weight:700;font-size:clamp(3rem,9.5vw,7.2rem);line-height:0.96;letter-spacing:-0.035em;color:#fff;text-shadow:0 2px 30px rgba(0,0,0,0.4)}
  #hero h1 em{font-style:normal;color:var(--gold)}
  .hero-sub{margin-top:1.6rem;max-width:540px;color:#fff;font-size:1.08rem;font-weight:400;line-height:1.7;text-shadow:0 1px 3px rgba(0,0,0,0.85),0 2px 22px rgba(0,0,0,0.75)}
  .hl{color:var(--gold-lt);font-weight:500}
  .hero-actions{display:flex;gap:1rem;margin-top:2.6rem;flex-wrap:wrap;align-items:center}
  .kp-chip{font-family:var(--mono);font-size:0.66rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--bone);background:var(--glass-bg);border:1px solid var(--glass-brd);padding:0.6rem 1rem;border-radius:999px;text-decoration:none;transition:border-color .2s,color .2s,transform .2s}
  .kp-chip:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}
  /* wide pill CTA with circular arrow (ChargeX style) */
  .hero-cta{display:inline-flex;align-items:center;gap:1.4rem;padding:0.7rem 0.7rem 0.7rem 2.3rem;position:relative;isolation:isolate;
     background:linear-gradient(135deg,var(--gold-lt),var(--gold));border:1px solid rgba(255,255,255,0.3);border-radius:var(--r-pill,999px);
     text-decoration:none;color:#121212;font-family:var(--mono);font-weight:700;
     font-size:1.02rem;letter-spacing:0.02em;transition:transform .4s var(--spring),box-shadow .4s var(--spring);
     box-shadow:0 12px 34px rgba(184,255,0,0.38)}
  .hero-cta:hover{box-shadow:0 20px 50px rgba(184,255,0,0.55);transform:translateY(-3px) scale(1.015);color:#121212}
  .hero-cta-arrow{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;position:relative;z-index:2;
     background:#121212;color:var(--gold-lt);font-size:1.3rem;font-style:normal;transition:transform .4s var(--spring),background .3s}
  .hero-cta span{position:relative;z-index:2}
  .hero-cta:hover .hero-cta-arrow{transform:translateX(4px)}
  @media(max-width:640px){
    .hero-inner{max-width:100%}
  }
  .scroll-cue{position:absolute;z-index:2;bottom:1.4rem;left:50%;transform:translateX(-50%);font-size:0.6rem;letter-spacing:0.3em;text-transform:uppercase;color:rgba(245,245,245,0.7);display:flex;flex-direction:column;align-items:center;gap:0.5rem}
  .scroll-cue .chevron{width:14px;height:14px;border-right:1.5px solid rgba(245,245,245,0.7);border-bottom:1.5px solid rgba(245,245,245,0.7);transform:rotate(45deg);animation:cueBounce 1.8s ease-in-out infinite}
  @keyframes cueBounce{0%,100%{transform:rotate(45deg) translate(0,0);opacity:0.5}50%{transform:rotate(45deg) translate(3px,3px);opacity:1}}
  @media(prefers-reduced-motion:reduce){.scroll-cue .chevron{animation:none}}
  /* floating glass quick-info card in hero */
  .hero-glasscard{margin-top:2.4rem;display:inline-flex;align-items:center;gap:1.6rem;padding:1.1rem 1.6rem;border-radius:20px;
    background:var(--glass-bg);border:1px solid var(--glass-brd);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
    box-shadow:0 20px 50px rgba(0,0,0,0.35)}
  .hero-glasscard .hg-stat{display:flex;flex-direction:column;gap:0.15rem}
  .hero-glasscard .hg-num{font-family:var(--serif);font-weight:600;font-size:1.3rem;color:#fff;line-height:1}
  .hero-glasscard .hg-label{font-family:var(--mono);font-size:0.6rem;letter-spacing:0.14em;text-transform:uppercase;color:rgba(245,245,245,0.6)}
  .hero-glasscard .hg-div{width:1px;align-self:stretch;background:var(--glass-brd)}
  @media(max-width:640px){.hero-glasscard{gap:1.1rem;padding:0.9rem 1.2rem;flex-wrap:wrap}}

  /* section base */
  section{padding:clamp(4.5rem,10vw,8.5rem) clamp(1.3rem,5vw,4rem)}
  .wrap{max-width:1180px;margin:0 auto}
  .sec-title{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,5vw,3.4rem);letter-spacing:-0.02em;line-height:1.05;margin-top:1rem;margin-bottom:2.2rem}

  /* statement */
  #statement{border-top:1px solid var(--line)}
  #products{border-top:1px solid var(--line)}
  .prod-intro{color:var(--muted);font-size:1rem;line-height:1.8;max-width:62ch;margin:1.4rem 0 3rem}
  .prod-grid{display:block}
  @media(max-width:760px){.prod-col{padding:1.6rem 1.4rem}}
  .prod-col{border:1px solid var(--line);border-top:2px solid var(--gold);background:var(--panel);padding:2rem 1.9rem;transition:.2s;width:100%;box-sizing:border-box}
  .prod-col:hover{border-color:var(--line2);border-top-color:var(--gold-lt)}
  .prod-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:1.3rem}
  .prod-head h3{font-family:var(--serif);font-weight:400;font-size:1.4rem;color:var(--gold-lt)}
  .prod-head span{font-size:0.6rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--faint)}
  .prod-list{list-style:none}
  .prod-list li{position:relative;padding:0.6rem 0 0.6rem 1.4rem;font-size:0.9rem;color:var(--bone);border-bottom:1px solid var(--line);line-height:1.55}
  .prod-list li:last-child{border-bottom:none}
  .prod-list li b{color:var(--gold-lt);font-weight:500}
  .prod-list li::before{content:"";position:absolute;left:0;top:1.05rem;width:6px;height:6px;background:var(--gold);border-radius:50%}
  .prod-tabs{display:flex;gap:0.6rem;max-width:380px}
  .prod-tab{flex:1;padding:0.85rem 0.5rem;background:none;border:1px solid var(--line2);color:var(--muted);font-family:var(--sans);font-size:0.66rem;letter-spacing:0.16em;text-transform:uppercase;cursor:pointer;transition:.18s;border-radius:3px}
  .prod-tab:hover{border-color:var(--gold);color:var(--bone)}
  .prod-tab.on{border-color:var(--gold);color:var(--gold-lt);background:rgba(198,255,0,0.08)}
  .prod-swipe-hint{font-size:0.66rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--faint);margin:0.8rem 0 1.4rem}
  .prod-stage{touch-action:pan-y;cursor:grab;display:grid;grid-template-columns:minmax(0,1fr);width:100%}
  .prod-stage .prod-panel{grid-area:1/1;width:100%}
  .prod-panel{animation:prodFade .32s ease}
  @keyframes prodFade{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
  .statement-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:3rem;align-items:end}
  .statement-grid h2{font-family:var(--serif);font-weight:300;font-size:clamp(1.8rem,4.5vw,3rem);letter-spacing:-0.02em;line-height:1.1}
  .statement-grid p{color:var(--muted);font-size:0.95rem;line-height:1.85}
  @media(max-width:820px){.statement-grid{grid-template-columns:1fr;gap:1.5rem;align-items:start}}

  /* services */
  #services{background:var(--bg2);border-top:1px solid var(--line)}
  .svc-grid{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;margin-top:1.3rem;padding:0.5rem 0.2rem;scrollbar-width:none;-webkit-overflow-scrolling:touch;align-items:stretch}
  .svc-grid::-webkit-scrollbar{display:none}
  .svc{background:linear-gradient(155deg,var(--panel),var(--panel2));padding:2.4rem 2rem;display:flex;flex-direction:column;min-height:215px;transition:transform .3s cubic-bezier(.22,.61,.36,1),border-color .3s,box-shadow .3s;flex:0 0 82%;scroll-snap-align:start;cursor:pointer;border:1px solid var(--line);border-radius:24px;box-shadow:0 1px 0 rgba(255,255,255,0.02) inset}
  .svc:hover{transform:translateY(-6px);border-color:var(--glass-brd);box-shadow:0 24px 50px rgba(0,0,0,0.28)}
  @media(min-width:680px){.svc{flex:0 0 40%}}
  @media(min-width:980px){.svc{flex:0 0 27%}}
  .svc-swipe-hint{font-size:0.66rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--faint);margin:0.9rem 0 0}
  .svc-tabs{display:inline-flex;flex-wrap:wrap;gap:0.35rem;margin-top:0.5rem;padding:0.4rem;border-radius:22px;background:var(--glass-bg);border:1px solid var(--glass-brd);backdrop-filter:blur(14px)}
  .svc-tab{padding:0.65rem 1.15rem;background:none;border:none;color:var(--muted);font-family:var(--sans);font-size:0.62rem;letter-spacing:0.14em;text-transform:uppercase;cursor:pointer;transition:.18s;border-radius:16px}
  .svc-tab:hover{color:var(--bone)}
  .svc-tab.on{color:#121212;background:linear-gradient(135deg,var(--gold-lt),var(--gold));border-radius:16px}
  .svc-cat{font-size:0.6rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--faint);margin-bottom:1.4rem}
  .svc-name{font-family:var(--serif);font-weight:400;font-size:1.5rem;letter-spacing:-0.01em;line-height:1.1;margin-bottom:0.8rem}
  .svc-desc{font-size:0.84rem;color:var(--muted);line-height:1.7}
  .svc-from{font-size:0.7rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold)}
  .svc-offer{list-style:none;margin:1.1rem 0 0;border-top:1px solid var(--line);padding-top:1rem;display:none}
  .svc.open .svc-offer{display:block;animation:svcFade .25s ease}
  @keyframes svcFade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
  .svc-offer li{position:relative;padding:0.42rem 0 0.42rem 1.1rem;font-size:0.82rem;color:var(--bone);line-height:1.5}
  .svc-offer li::before{content:"";position:absolute;left:0;top:0.85rem;width:5px;height:5px;background:var(--gold);border-radius:50%}
  .svc-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:auto;padding-top:1.4rem}
  .svc-more{font-size:0.58rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--muted);white-space:nowrap;transition:.2s}
  .svc-more::after{content:" ↓"}
  .svc.open .svc-more{color:var(--gold-lt)}
  .svc.open .svc-more::after{content:" ↑"}

  /* featured */
  .feature{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;min-height:80vh}
  .feature.flip .feature-media{order:2}
  .feature-media{position:relative;background:linear-gradient(135deg,#161618,#0d0d0f);display:flex;align-items:flex-end;padding:2rem;margin:1.6rem;border-radius:24px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,0.3)}
  .feature.flip .feature-media{border-right:none}
  .feature-media .cap{font-size:0.62rem;letter-spacing:0.24em;text-transform:uppercase;color:#fff;background:var(--glass-bg);border:1px solid var(--glass-brd);backdrop-filter:blur(10px);padding:0.5rem 0.9rem;border-radius:999px;display:inline-block}
  .feature-media .ghost{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--serif);font-style:italic;font-size:clamp(3rem,8vw,6rem);color:rgba(255,255,255,0.04);pointer-events:none}
  .feature-text{display:flex;flex-direction:column;justify-content:center;padding:clamp(2.5rem,6vw,5rem)}
  .feature-text .eyebrow{margin-bottom:1.4rem}
  .feature-text h3{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,5vw,3.4rem);letter-spacing:-0.02em;line-height:1.05;margin-bottom:1.4rem}
  .feature-text p{color:var(--muted);font-size:0.95rem;line-height:1.85;max-width:42ch;margin-bottom:2rem}
  .feature-link{font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(198,255,0,0.4);padding-bottom:0.4rem;width:max-content;transition:.2s}
  .feature-link:hover{border-color:var(--gold)}
  @media(max-width:820px){.feature,.feature.flip{grid-template-columns:1fr}.feature-media{min-height:300px}.feature.flip .feature-media{order:0}}

  /* ════ QUOTE BUILDER ════ */
  #quote{border-top:1px solid var(--line)}
  .quote-intro{color:var(--muted);font-size:0.95rem;line-height:1.85;max-width:620px;margin:1.4rem 0 1.6rem}
  .qb-callout{border:1px solid rgba(198,255,0,0.35);border-left:3px solid var(--gold);background:linear-gradient(135deg,rgba(198,255,0,0.13),rgba(198,255,0,0.02));padding:1.4rem 1.6rem;margin:0 0 3rem;max-width:760px}
  .qb-callout-tags{display:flex;flex-wrap:wrap;gap:0.4rem;margin-bottom:0.85rem}
  .qb-callout-tags span{font-size:0.6rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold-lt);border:1px solid rgba(198,255,0,0.45);border-radius:999px;padding:0.3rem 0.65rem}
  .qb-callout h4{font-family:var(--serif);font-weight:400;font-size:1.18rem;color:var(--gold-lt);margin-bottom:0.45rem;letter-spacing:-0.01em}
  .qb-callout p{font-size:0.86rem;color:var(--muted);line-height:1.7}
  .qb-gate{border:1px solid var(--line2);border-left:2px solid var(--gold);background:rgba(198,255,0,0.06);padding:1.1rem 1.3rem;margin-bottom:1.6rem;display:flex;flex-direction:column;gap:0.3rem}
  .qb-gate strong{font-family:var(--serif);font-weight:400;font-size:1.05rem;color:var(--gold-lt)}
  .qb-gate span{font-size:0.84rem;color:var(--muted);line-height:1.6}
  .qb-gated{opacity:0.4;pointer-events:none;filter:saturate(0.25);transition:opacity .25s}
  .qb-modetabs{display:flex;gap:0.6rem;margin-bottom:2.2rem}
  .qb-modetab{flex:1;padding:0.85rem 0.5rem;background:none;border:1px solid var(--line2);color:var(--muted);font-family:var(--sans);font-size:0.68rem;letter-spacing:0.16em;text-transform:uppercase;cursor:pointer;transition:.18s;border-radius:3px}
  .qb-modetab:hover{border-color:var(--gold);color:var(--bone)}
  .qb-modetab.on{border-color:var(--gold);color:var(--gold-lt);background:rgba(198,255,0,0.08)}
  .qb-pgroup{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin:1.8rem 0 0.9rem}
  .qb-pgroup:first-child{margin-top:0}
  .cov-wrap{margin-top:0.4rem}
  .cov-stage{position:relative;background:radial-gradient(ellipse at 50% 45%, #181818, #0c0c0c);border:1px solid var(--line);border-radius:8px;padding:0.8rem;touch-action:pan-y;user-select:none;display:grid;place-items:center;min-height:200px}
  .cov-svg{width:100%;height:auto;max-height:260px;display:block}
  .cov-base{fill:none;stroke:rgba(255,255,255,.42);stroke-width:2;stroke-linejoin:round}
  .cov-fill{fill:#262626;stroke:rgba(255,255,255,.4);stroke-width:1.8;stroke-linejoin:round}
  .cov-glass{fill:#191919;stroke:rgba(255,255,255,.34);stroke-width:1.3}
  .zone{opacity:0;transition:opacity .25s;pointer-events:none}
  .zone.on{opacity:1}
  .pz.on{fill:rgba(198,255,0,0.55);stroke:var(--gold);stroke-width:1.5}
  .tz.on{fill:rgba(95,185,205,0.5);stroke:#6EC6D6;stroke-width:1.5}
  .cov-ctrls{display:flex;justify-content:space-between;align-items:center;margin-top:0.85rem}
  .cov-rot{display:flex;gap:0.6rem}
  .cov-btn{width:42px;height:42px;border:1px solid var(--line2);background:none;color:var(--bone);border-radius:50%;cursor:pointer;font-size:1.3rem;line-height:1;display:grid;place-items:center;transition:.15s}
  .cov-btn:hover{border-color:var(--gold);color:var(--gold)}
  .cov-view-label{font-size:0.66rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--muted)}
  .cov-legend{display:flex;gap:1.4rem;margin-top:0.8rem;font-size:0.74rem;color:var(--muted)}
  .cov-legend i{display:inline-block;width:13px;height:13px;border-radius:3px;margin-right:0.45rem;vertical-align:-2px}
  .cov-legend .lp{background:rgba(198,255,0,0.6);border:1px solid var(--gold)}
  .cov-legend .lt{background:rgba(95,185,205,0.55);border:1px solid #6EC6D6}
  .cov-hint{font-size:0.78rem;color:var(--faint);margin-top:0.7rem;text-align:center}
  .cov-stage{perspective:1100px}
  .cov-svg{transform:rotateY(var(--rot,0deg));transition:transform .06s linear}
  .cov-slider{-webkit-appearance:none;appearance:none;width:100%;height:4px;background:var(--line2);border-radius:3px;outline:none;margin:1rem 0 0}
  .cov-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid var(--bg);box-shadow:0 2px 8px rgba(0,0,0,.5)}
  .cov-slider::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid var(--bg)}
  .cov-slabels{display:flex;justify-content:space-between;font-size:0.6rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--faint);margin-top:0.45rem}
  .cov-caption{font-size:0.78rem;color:var(--gold-lt);text-align:center;margin-top:0.8rem;letter-spacing:0.03em}
  .cov-modetabs{display:flex;gap:0.6rem;margin-bottom:1.4rem}
  .cov-mtab{flex:1;padding:0.72rem 0.5rem;background:none;border:1px solid var(--line2);color:var(--muted);font-family:var(--sans);font-size:0.64rem;letter-spacing:0.16em;text-transform:uppercase;cursor:pointer;transition:.18s;border-radius:3px}
  .cov-mtab:hover{border-color:var(--gold);color:var(--bone)}
  .cov-mtab.on{border-color:var(--gold);color:var(--gold-lt);background:rgba(198,255,0,0.08)}
  .spin-stage{min-height:210px;perspective:none}
  .spin-img{width:100%;height:auto;max-height:300px;object-fit:contain;display:block;-webkit-user-drag:none;user-select:none}
  .qb-veh-variant{margin-top:1rem}
  .cov-summary{display:flex;flex-wrap:wrap;gap:0.5rem;margin:1.3rem 0 0.2rem;justify-content:center}
  .cov-chip{font-size:0.72rem;padding:0.42rem 0.75rem;border-radius:999px;border:1px solid;display:inline-flex;align-items:center;gap:0.45rem;line-height:1.2}
  .cov-chip i{width:11px;height:11px;border-radius:3px;display:inline-block;flex:none}
  .cov-chip.p{color:var(--gold-lt);border-color:rgba(198,255,0,0.5);background:rgba(198,255,0,0.08)}
  .cov-chip.p i{background:rgba(198,255,0,0.6);border:1px solid var(--gold)}
  .cov-chip.t{color:#9fdce6;border-color:rgba(95,185,205,0.5);background:rgba(95,185,205,0.08)}
  .cov-chip.t i{background:rgba(95,185,205,0.55);border:1px solid #6EC6D6}
  .cov-coverage-head{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin:1.7rem 0 1rem;text-align:center}
  .cov3d-stage{min-height:260px;padding:0;overflow:hidden}
  #cov3d{width:100%;height:auto;display:block;cursor:grab;touch-action:pan-y}
  #cov3d:active{cursor:grabbing}
  .quote-layout{max-width:860px}

  .qb-block{margin-bottom:3rem}
  .qb-head{font-family:var(--serif);font-weight:400;font-size:1.5rem;letter-spacing:-0.01em;display:flex;align-items:baseline;gap:0.8rem;margin-bottom:0.4rem}
  .qb-head .n{font-family:var(--sans);font-size:0.66rem;letter-spacing:0.2em;color:var(--faint);font-weight:500}
  /* collapsible "tap to build" estimate blocks (PPF / Tint) */
  .qb-fold .qb-head{cursor:pointer;justify-content:space-between;align-items:center;margin-bottom:0;padding:0.5rem 0;transition:color .2s}
  .qb-fold .qb-head:hover{color:var(--gold-lt)}
  .qb-fold .qb-head .qb-head-l{display:flex;align-items:baseline;gap:0.8rem;font-family:var(--serif);font-weight:500;font-size:clamp(1.1rem,2.4vw,1.3rem);color:var(--bone);letter-spacing:-0.01em}
  .qb-fold .qb-head .qb-head-l .n{font-family:var(--mono);font-size:0.66rem;letter-spacing:0.2em;color:var(--faint);font-weight:500}
  .qb-tapbuild{font-family:var(--mono);font-size:0.58rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--bg);
    background:var(--gold);padding:0.4rem 0.75rem;border-radius:var(--r-pill,999px);white-space:nowrap;display:inline-flex;align-items:center;gap:0.4rem;transition:opacity .25s}
  .qb-fold:not(.collapsed) .qb-tapbuild{opacity:0;pointer-events:none;width:0;padding:0;overflow:hidden}
  .qb-fold .faq-gchev{font-size:1.3rem;line-height:1;color:var(--gold);transition:transform .3s ease}
  .qb-fold.collapsed .qb-foldbody{display:none}
  .qb-fold .qb-foldbody{padding-top:1rem}
  .qb-fold.qb-chosen .qb-head .n{color:var(--gold)}
  .qb-note-sub{font-size:0.82rem;color:var(--muted);line-height:1.65;margin-bottom:1.2rem;max-width:56ch}
  .qb-tap-guide{font-size:0.82rem;color:var(--gold-lt);background:rgba(198,255,0,0.07);border:1px solid rgba(198,255,0,0.25);border-radius:5px;padding:0.85rem 1.05rem;line-height:1.6;margin-bottom:2.2rem}
  .qb-tap-guide b{color:var(--gold-lt);font-weight:600}
  .qb-divider{margin:0.4rem 0 2.4rem;padding-top:2rem;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:0.4rem}
  .qb-div-title{font-family:var(--sans);font-size:0.62rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold)}
  .qb-div-sub{font-size:0.82rem;color:var(--muted);line-height:1.55;max-width:56ch}

  .form-label{display:block;font-size:0.62rem;font-weight:500;letter-spacing:0.2em;text-transform:uppercase;color:var(--faint);margin-bottom:0.5rem}
  .form-control{width:100%;background:var(--panel);border:1px solid var(--line);color:var(--bone);padding:0.85rem 1rem;font-size:0.9rem;font-family:var(--sans);outline:none;transition:border-color .2s;appearance:none;-webkit-appearance:none}
  .form-control:focus{border-color:var(--bone)}
  /* a11y: visible keyboard-focus ring on every interactive element */
  a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
  .btn:focus-visible,.svc:focus-visible,.nav-book:focus-visible,.faq-group-label:focus-visible,[tabindex]:focus-visible{
    outline:2px solid var(--gold);outline-offset:3px;border-radius:3px}
  .form-control:focus-visible{outline:2px solid var(--gold);outline-offset:0;border-color:var(--gold)}
  .form-control option{background:var(--panel)}
  textarea.form-control{resize:vertical;min-height:100px}

  .qb-veh-grid{display:grid;grid-template-columns:1fr 1fr 0.7fr;gap:0.7rem}
  @media(max-width:560px){.qb-veh-grid{grid-template-columns:1fr}}
  .qb-detected{margin-top:1rem;padding:0.8rem 1.1rem;border:1px solid var(--line2);background:rgba(255,255,255,0.025);font-size:0.86rem;color:var(--bone)}
  .qb-detected .lbl{font-size:0.6rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:0.25rem}

  .qb-opts{display:flex;flex-direction:column;gap:0.5rem}
  .qb-opt{position:relative;border:1px solid var(--line);background:var(--panel);padding:1rem 1.1rem;cursor:pointer;display:flex;gap:0.9rem;align-items:flex-start;transition:border-color .18s,background .18s}
  .qb-opt:hover{border-color:var(--line2)}
  .qb-opt.on{border-color:var(--gold);background:rgba(198,255,0,0.09)}
  .qb-opt.disabled{cursor:default}
  .qb-opt.disabled:hover{border-color:var(--line)}
  .qb-tick{flex:0 0 18px;height:18px;margin-top:2px;border:1px solid var(--line2);display:grid;place-items:center;transition:.16s;border-radius:50%}
  .qb-check .qb-tick{border-radius:3px}
  .qb-opt.on .qb-tick{border-color:var(--gold);background:var(--gold)}
  .qb-radio.qb-opt.on .qb-tick::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--bg)}
  .qb-check.qb-opt.on .qb-tick::after{content:"";width:4px;height:8px;border:solid var(--bg);border-width:0 1.5px 1.5px 0;transform:rotate(42deg) translateY(-1px)}
  .qb-opt.inc .qb-tick{border-color:var(--gold);background:var(--gold)}
  .qb-body{flex:1;min-width:0}
  .qb-row{display:flex;justify-content:space-between;gap:0.8rem;align-items:baseline}
  .qb-name{font-size:0.94rem;font-weight:500;color:var(--bone);letter-spacing:0}
  .qb-price{font-size:0.86rem;font-weight:400;color:var(--bone);white-space:nowrap;font-variant-numeric:tabular-nums}
  .qb-price .pre{color:var(--faint);font-size:0.66rem;margin-right:3px;text-transform:uppercase;letter-spacing:0.08em}
  .qb-price.struck{color:var(--faint);text-decoration:line-through}
  .qb-desc{font-size:0.8rem;color:var(--muted);margin-top:0.4rem;line-height:1.6}
  .qb-dur{font-size:0.66rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--faint);margin-top:0.5rem}
  .qb-badge{display:inline-block;font-size:0.55rem;letter-spacing:0.16em;text-transform:uppercase;padding:0.18rem 0.5rem;margin-left:0.5rem;vertical-align:middle;border:1px solid var(--line2);color:var(--muted)}
  .qb-incnote{margin-top:0.8rem;border-left:1px solid var(--gold);background:rgba(198,255,0,0.06);padding:0.7rem 0.9rem;color:var(--muted);font-size:0.8rem;line-height:1.6}
  .qb-incnote b{color:var(--bone);font-weight:500}
  .qb-more{margin-top:0.7rem;font-size:0.68rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);background:none;border:none;cursor:pointer;padding:0;font-family:var(--sans)}
  .qb-more:hover{color:var(--bone)}
  .qb-includes{margin-top:0.7rem;border-top:1px solid var(--line);padding-top:0.8rem;display:none}
  .qb-includes.show{display:block}
  .qb-includes ul{list-style:none;display:flex;flex-direction:column;gap:0.35rem}
  .qb-includes li{font-size:0.8rem;color:var(--muted);padding-left:1rem;position:relative}
  .qb-includes li::before{content:"";position:absolute;left:0;top:0.55rem;width:4px;height:1px;background:var(--faint)}
  .qb-sub{margin-top:1rem;display:none}
  .qb-sub.show{display:block}
  .qb-sub-label{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--faint);margin-bottom:0.7rem}
  .qb-films{display:flex;flex-direction:column;gap:0.5rem}
  .qb-film{border:1px solid var(--line);background:var(--panel);padding:0.75rem 0.95rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:0.8rem;transition:.16s}
  .qb-film:hover{border-color:var(--line2)}
  .qb-film.on{border-color:var(--gold);background:rgba(198,255,0,0.09)}
  .qb-film-name{font-size:0.84rem;font-weight:500;color:var(--bone)}
  .qb-film-name small{display:block;color:var(--muted);font-size:0.72rem;font-weight:400;margin-top:0.15rem}
  .qb-film-price{font-size:0.82rem;color:var(--bone);white-space:nowrap;font-variant-numeric:tabular-nums}

  .qb-estimate{background:var(--panel);border:1px solid var(--line);padding:2rem;margin-top:1.5rem}
  .qb-meta{margin-top:1.1rem;padding-top:1.1rem;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:0.55rem}
  .qb-meta-row{display:flex;gap:0.7rem;align-items:baseline;font-size:0.8rem;color:var(--muted)}
  .qb-meta-row b{color:var(--bone);font-weight:600;white-space:nowrap}
  .qb-meta-row a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(184,255,0,0.4)}
  .qb-meta-row a:hover{color:var(--gold-lt)}
  .qb-est-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.4rem}
  .qb-est-title{font-family:var(--serif);font-weight:400;font-size:1.4rem}
  .qb-chip{font-size:0.6rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line2);padding:0.25rem 0.6rem}
  .qb-lines{max-height:42vh;overflow:auto;margin-bottom:0.5rem}
  .qb-line{display:flex;justify-content:space-between;gap:0.8rem;padding:0.7rem 0;border-bottom:1px solid var(--line);font-size:0.82rem}
  .qb-line:last-child{border-bottom:none}
  .qb-line-name{color:var(--bone)}
  .qb-line-name small{display:block;color:var(--faint);font-size:0.7rem;margin-top:0.15rem}
  .qb-line-amt{color:var(--bone);white-space:nowrap;font-variant-numeric:tabular-nums}
  .qb-line-amt.zero{color:var(--muted)}
  .qb-empty{color:var(--faint);font-size:0.82rem;padding:1.4rem 0;text-align:center;font-family:var(--serif);font-style:italic}
  .qb-tot{display:flex;justify-content:space-between;align-items:baseline;margin-top:1.4rem;padding-top:1.4rem;border-top:1px solid var(--line2)}
  .qb-tot-label{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--muted)}
  .qb-tot-price{font-family:var(--serif);font-weight:300;font-size:2.6rem;color:var(--gold);letter-spacing:-0.02em;line-height:1}
  .qb-month{display:none;justify-content:space-between;align-items:baseline;margin-top:0.8rem}
  .qb-month .l{font-size:0.64rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted)}
  .qb-month .v{font-family:var(--serif);font-size:1.4rem;color:var(--bone)}
  .qb-disc{font-size:0.7rem;color:var(--faint);margin-top:1.1rem;line-height:1.6}
  .qb-promo{display:flex;gap:0.5rem;margin-top:1.3rem}
  .qb-promo .form-control{flex:1;text-transform:uppercase;letter-spacing:0.08em}
  .qb-promo-btn{border:1px solid var(--line2);background:none;color:var(--bone);font-family:var(--sans);font-size:0.64rem;letter-spacing:0.16em;text-transform:uppercase;padding:0 1.2rem;cursor:pointer;transition:.18s;white-space:nowrap}
  .qb-promo-btn:hover{border-color:var(--gold);color:var(--gold)}
  .qb-promo-msg{font-size:0.74rem;margin-top:0.5rem;min-height:1rem;color:var(--muted)}
  .qb-promo-msg.ok{color:var(--gold)}
  .qb-promo-msg.err{color:#d98e6f}
  .qb-sub-row{display:flex;justify-content:space-between;font-size:0.82rem;color:var(--muted);padding:0.45rem 0}
  .qb-sub-row.disc{color:var(--gold)}
  .qb-book{width:100%;margin-top:1.4rem;justify-content:center}
  .qb-copy{width:100%;margin-top:0.6rem;padding:0.8rem;font-size:0.64rem;letter-spacing:0.18em;text-transform:uppercase;background:none;border:1px solid var(--line);color:var(--muted);cursor:pointer;font-family:var(--sans);transition:.18s}
  .qb-copy:hover{border-color:var(--line2);color:var(--bone)}
  .qb-copy.done{border-color:var(--bone);color:var(--bone)}

  /* why */
  #why{background:var(--bg2);border-top:1px solid var(--line)}
  .why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem;margin-top:3rem}
  .why-card{padding:2.2rem 1.8rem;border:1px solid var(--line);background:var(--panel)}
  .why-num{font-family:var(--serif);font-style:italic;font-size:1.4rem;color:var(--gold);margin-bottom:1rem}
  .why-title{font-size:0.9rem;font-weight:500;color:var(--bone);margin-bottom:0.5rem}
  .why-desc{font-size:0.8rem;color:var(--muted);line-height:1.7}
  @media(max-width:820px){.why-grid{grid-template-columns:1fr 1fr}}

  /* gallery */
  #gallery{border-top:1px solid var(--line)}
  .gal-grid{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:200px;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:3.5rem}
  .gal{background:linear-gradient(135deg,#161618,#0d0d0f);position:relative;display:flex;align-items:flex-end;padding:1.2rem;overflow:hidden;cursor:zoom-in}
  .gal img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
  .gal:hover img{transform:scale(1.06)}
  .gal:first-child{grid-row:1/3}
  .gal .ghost{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--serif);font-style:italic;font-size:3rem;color:rgba(255,255,255,0.04)}
  .gal img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
  .gal::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,0.7));z-index:1;pointer-events:none}
  .gal .tag{position:relative;z-index:2;font-size:0.6rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold)}
  .gal-note{font-size:0.72rem;color:var(--faint);margin-top:1.4rem;letter-spacing:0.04em}
  @media(max-width:820px){.gal-grid{grid-template-columns:1fr 1fr}.gal:first-child{grid-row:auto;grid-column:1/-1}}
  /* lightbox */
  .lightbox{position:fixed;inset:0;z-index:300;background:rgba(8,8,8,0.94);display:none;align-items:center;justify-content:center;padding:4vh 4vw;backdrop-filter:blur(6px)}
  .lightbox.open{display:flex}
  .lightbox img{max-width:min(92vw,1100px);max-height:88vh;object-fit:contain;border-radius:12px;box-shadow:0 40px 90px rgba(0,0,0,0.5)}
  .lightbox .lb-tag{position:absolute;bottom:4vh;left:50%;transform:translateX(-50%);font-size:0.66rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold-lt);font-family:var(--sans)}
  .lightbox .lb-close{position:absolute;top:1.6rem;right:1.6rem;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,0.25);background:rgba(255,255,255,0.06);color:#fff;cursor:pointer;font-size:1.2rem;line-height:1;display:grid;place-items:center}
  .lightbox .lb-close:hover{border-color:var(--gold)}
  .lightbox .lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,0.2);background:rgba(255,255,255,0.06);color:#fff;cursor:pointer;font-size:1.3rem;display:grid;place-items:center}
  .lightbox .lb-prev{left:1.6rem}.lightbox .lb-next{right:1.6rem}
  .lightbox .lb-nav:hover{border-color:var(--gold)}

  /* contact */
  #contact{background:var(--bg2);border-top:1px solid var(--line)}
  .contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
  @media(max-width:820px){.contact-layout{grid-template-columns:1fr;gap:2.5rem}}
  .contact-layout h2{font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,5.5vw,3.6rem);letter-spacing:-0.02em;line-height:1.04}
  .contact-layout h2 em{font-style:italic;color:var(--gold)}
  .contact-info{display:flex;flex-direction:column;gap:1.6rem;margin-top:2.2rem}
  .ci-title{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:0.3rem}
  .ci-val{font-size:0.92rem;color:var(--bone)}
  .contact-form .fg{margin-bottom:1.1rem}

  /* footer */
  footer{background:var(--bg2);border-top:1px solid var(--line);padding:5rem clamp(1.3rem,5vw,4rem) 2.5rem}
  .foot-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:3rem;max-width:1180px;margin:0 auto 3rem;padding-bottom:3rem;border-bottom:1px solid var(--line)}
  .foot-brand .logo{font-size:1.6rem}
  .foot-brand p{color:var(--muted);font-size:0.86rem;line-height:1.8;margin-top:1rem;max-width:36ch}
  .foot-col h4{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--faint);margin-bottom:1.1rem}
  .foot-col a{display:block;color:var(--muted);font-size:0.86rem;text-decoration:none;margin-bottom:0.6rem;transition:color .2s}
  .foot-col a:hover{color:var(--gold)}
  .foot-bottom{max-width:1180px;margin:0 auto;padding-top:0;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
  .foot-bottom span{font-size:0.72rem;color:var(--faint);letter-spacing:0.04em}
  @media(max-width:820px){.foot-top{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}

  /* faq */
  #faq{border-top:1px solid var(--line)}
  .faq-group{margin-top:1.1rem}
  .faq-group:first-of-type{margin-top:2rem}
  .faq-group-label{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;cursor:pointer;
    background:none;border:none;border-top:1px solid var(--line);text-align:left;
    font-family:var(--serif);font-weight:500;font-size:clamp(1.15rem,2.6vw,1.4rem);letter-spacing:-0.01em;color:var(--bone);padding:1.3rem 0;transition:color .2s}
  .faq-group-label:hover{color:var(--gold-lt)}
  .faq-gchev{flex:0 0 auto;font-size:1.3rem;line-height:1;color:var(--gold);transition:transform .3s var(--spring,ease)}
  .faq-group-label{gap:0.7rem}
  .fold-icon{position:relative;width:14px;height:14px;flex:0 0 auto;color:var(--gold)}
  .fold-icon::before,.fold-icon::after{content:"";position:absolute;top:50%;left:50%;background:currentColor;transform:translate(-50%,-50%);transition:opacity .25s ease,transform .25s ease}
  .fold-icon::before{width:14px;height:1.6px}
  .fold-icon::after{width:1.6px;height:14px}
  .faq-group:not(.collapsed) .fold-icon::after,.feature-fold:not(.collapsed) .fold-icon::after,.qb-fold:not(.collapsed) .fold-icon::after{opacity:0;transform:translate(-50%,-50%) rotate(90deg)}
  :root[data-theme="light"] .fold-icon{color:#5C7A00!important}
  .fold-hint{font-family:var(--mono);font-size:0.58rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--faint);transition:opacity .25s;white-space:nowrap}
  .faq-group:not(.collapsed) .fold-hint,.feature-fold:not(.collapsed) .fold-hint{opacity:0;width:0;overflow:hidden}
  .faq-group.collapsed .faq-gchev{transform:rotate(-90deg)}
  .faq-glist{transition:opacity .3s ease}
  .faq-group.collapsed .faq-glist{display:none}
  /* collapsible feature explainers (Ceramic / PPF) */
  .feature-fold .faq-gchev{transition:transform .3s ease}
  .feature-fold.collapsed .faq-gchev{transform:rotate(-90deg)}
  .feature-foldhead{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;cursor:pointer;
    background:none;border:none;border-top:1px solid var(--line);text-align:left;
    padding:1.7rem clamp(1.3rem,5vw,4rem);transition:color .2s}
  .feature-foldhead:hover{color:var(--gold-lt)}
  .feature-foldhead .fh-heading{display:flex;flex-direction:column;gap:0.35rem}
  .feature-foldhead .fh-tag{font-family:var(--serif);font-weight:500;font-size:clamp(1.4rem,3.2vw,1.9rem);letter-spacing:-0.01em;text-transform:none;color:var(--bone);line-height:1.15}
  .feature-foldhead .fh-title{font-family:var(--mono);font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);line-height:1.3}
  .feature-foldhead:active{transform:scale(0.99)}
  .feature-fold.collapsed .feature-foldbody{display:none}
  .faq-item{border-top:1px solid var(--line)}
  .faq-group .faq-item:last-child{border-bottom:1px solid var(--line)}
  .faq-q{width:100%;background:none;border:none;cursor:pointer;text-align:left;display:flex;justify-content:space-between;gap:1.5rem;align-items:flex-start;padding:1.25rem 0;font-family:var(--sans);color:var(--bone);font-size:0.98rem;font-weight:400;line-height:1.45;transition:color .2s}
  .faq-q:hover{color:var(--gold)}
  .faq-icon{flex:0 0 auto;color:var(--gold);font-size:1.2rem;line-height:1;transition:transform .25s;margin-top:0.1rem}
  .faq-item.open .faq-icon{transform:rotate(45deg)}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
  .faq-item.open .faq-a{max-height:700px}
  .faq-a .inner{padding:0 0 1.3rem;color:var(--muted);font-size:0.88rem;line-height:1.8;max-width:70ch}

  /* floating wa */
  .wa-float{position:fixed;right:1.4rem;bottom:1.4rem;z-index:80;background:var(--wa);color:#fff;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;cursor:pointer;border:none;box-shadow:0 8px 24px rgba(0,0,0,0.5);transition:transform .15s}
  .scroll-toggle{position:fixed;right:1.4rem;bottom:5.5rem;z-index:80;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;cursor:pointer;background:var(--panel);border:1px solid var(--line2);color:var(--gold-lt);box-shadow:0 8px 24px rgba(0,0,0,0.45);transition:.18s}
  .scroll-toggle:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}
  .scroll-toggle svg{transition:transform .25s}
  .scroll-toggle svg.down{transform:rotate(180deg)}
  .wa-float:hover{transform:scale(1.06)}
  .wa-float svg{width:28px;height:28px}

  /* modal */
  .modal-overlay{position:fixed;inset:0;z-index:200;background:rgba(5,5,6,0.82);display:none;align-items:center;justify-content:center;padding:1.2rem;backdrop-filter:blur(4px)}
  .modal-overlay.open{display:flex}
  .modal{background:var(--bg2);border:1px solid var(--line2);width:100%;max-width:540px;max-height:92vh;overflow:auto;position:relative}
  .modal-head{padding:1.7rem 1.9rem 1.3rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg2);z-index:2}
  .modal-head h3{font-family:var(--serif);font-weight:400;font-size:1.7rem;letter-spacing:-0.01em}
  .modal-head p{font-size:0.8rem;color:var(--muted);margin-top:0.3rem}
  .modal-close{position:absolute;top:1.1rem;right:1.1rem;width:2.4rem;height:2.4rem;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line2);color:var(--bone);font-size:1.5rem;cursor:pointer;line-height:1;border-radius:50%;z-index:3;transition:.15s}
  .modal-close:hover{border-color:var(--gold);color:var(--gold)}
  .modal-close:hover{color:var(--bone)}
  .modal-body{padding:1.6rem 1.9rem}
  .bk-summary{background:var(--panel);border:1px solid var(--line);padding:1rem 1.1rem;margin-bottom:1.5rem}
  .bk-s-line{display:flex;justify-content:space-between;gap:0.8rem;font-size:0.8rem;padding:0.28rem 0;color:var(--muted)}
  .bk-s-line .a{color:var(--bone);white-space:nowrap;font-variant-numeric:tabular-nums}
  .bk-s-line.zero .a{color:var(--muted)}
  .bk-s-tot{display:flex;justify-content:space-between;margin-top:0.7rem;padding-top:0.7rem;border-top:1px solid var(--line);font-size:0.84rem}
  .bk-s-tot b{color:var(--bone);font-weight:500}
  .bk-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.9rem}
  .bk-grid .full{grid-column:1/-1}
  .bk-send{width:100%;margin-top:1.5rem;padding:1rem;border:none;cursor:pointer;font-family:var(--sans);background:var(--wa);color:#fff;font-size:0.7rem;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:0.5rem;transition:.16s}
  .bk-send:hover{background:#1fbf5b}
  .bk-send svg{width:17px;height:17px}
  .bk-hint{font-size:0.7rem;color:var(--faint);margin-top:0.8rem;line-height:1.55}
  .bk-err{color:#d98e6f;font-size:0.74rem;margin-top:0.6rem;display:none}

  /* ── scroll-reveal ── */
  /* ── Figma-style motion: spring easing, fade + rise + de-blur ── */
  :root{ --spring:cubic-bezier(.16,1,.3,1); --spring-dur:.9s; }
  /* Figma-style: snappy press feedback + magnetic buttons + animated underline */
  .btn,.svc-tab,.nav-book,.theme-toggle{transition:transform .15s cubic-bezier(.34,1.56,.64,1),background .25s,border-color .25s,box-shadow .25s}
  .btn:active,.nav-book:active{transform:scale(0.96)}
  .nav-links a{position:relative}
  .nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1.5px;background:currentColor;transition:right .35s var(--spring)}
  .nav-links a:hover::after{right:0}
  .reveal{opacity:0;transform:translateY(34px);filter:blur(6px);
    transition:opacity var(--spring-dur) var(--spring),transform var(--spring-dur) var(--spring),filter var(--spring-dur) var(--spring);
    transition-delay:var(--d,0ms);will-change:opacity,transform,filter}
  .reveal.in{opacity:1;transform:none;filter:none}
  .sec-title.reveal,h1.reveal{transform:translateY(18px)}
  .stagger > *{opacity:0;transform:translateY(30px);filter:blur(5px);
    transition:opacity .75s var(--spring),transform .75s var(--spring),filter .75s var(--spring)}
  .stagger.in > *{opacity:1;transform:none;filter:none}
  .stagger.in > *:nth-child(1){transition-delay:.04s}
  .stagger.in > *:nth-child(2){transition-delay:.12s}
  .stagger.in > *:nth-child(3){transition-delay:.20s}
  .stagger.in > *:nth-child(4){transition-delay:.28s}
  .stagger.in > *:nth-child(5){transition-delay:.36s}
  .stagger.in > *:nth-child(6){transition-delay:.44s}
  .stagger.in > *:nth-child(n+7){transition-delay:.52s}
  @media(prefers-reduced-motion:reduce){
    .reveal,.stagger>*{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
  }

  /* ════════ ChargeX-feel layer · rounded, airy, image-forward · Glossmith brand ════════ */
  :root{ --r-lg:24px; --r-md:18px; --r-sm:14px; --r-pill:999px; --elev:0 18px 50px rgba(0,0,0,0.45); }

  /* Pill buttons */
  .btn{border-radius:var(--r-pill);padding:1.05rem 2.4rem;letter-spacing:0.12em}
  .btn-solid{box-shadow:0 10px 30px rgba(184,255,0,0.22)}
  .btn-solid:hover{box-shadow:0 16px 44px rgba(184,255,0,0.42)}
  .nav-book{border-radius:var(--r-pill);padding:0.7rem 1.6rem;flex:0 0 auto;white-space:nowrap}

  /* Roomier sections */
  section{padding-top:clamp(4.5rem,9vw,8rem);padding-bottom:clamp(4.5rem,9vw,8rem)}
  .sec-title{letter-spacing:-0.03em}

  /* Cards → large radius, soft elevation, generous padding */
  .prod-col{border-radius:var(--r-lg);border-top-width:1px;padding:2.4rem 2.1rem;box-shadow:var(--elev);transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s,border-color .35s}
  .prod-col:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(0,0,0,0.55)}
  .prod-col::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--gold),transparent);border-radius:var(--r-lg) var(--r-lg) 0 0;opacity:0;transition:opacity .35s}
  .prod-col{position:relative;overflow:hidden}
  .prod-col:hover::after{opacity:1}
  .svc{border-radius:var(--r-md)}
  .cov-col,.why-card{border-radius:var(--r-md);box-shadow:var(--elev)}
  .qb-block,.cov-stage,.cov3d-stage{border-radius:var(--r-lg)!important}
  .faq-item{border-radius:var(--r-md);overflow:hidden}
  .gal-grid{border-radius:var(--r-lg);overflow:hidden}
  .gal{border-radius:0}

  /* Pill tabs (mode/category selectors) */
  .prod-tab,.svc-tab,.qb-modetab,.cov-mtab,.cov-btn{border-radius:var(--r-pill)}

  /* Chips already pill; spec-row pills for product cards */
  .spec-row{display:flex;gap:0.5rem;flex-wrap:wrap;margin:1.2rem 0 1.3rem}
  .spec-pill{font-family:var(--mono);font-size:0.6rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold-lt);
    border:1px solid rgba(184,255,0,0.35);border-radius:var(--r-pill);padding:0.34rem 0.8rem;background:rgba(184,255,0,0.05)}

  /* Inputs / selects rounded to match */
  select,input,textarea{border-radius:var(--r-sm)!important}

  /* Hero: a touch more air + softer grid */
  #hero{padding-top:8rem}
  .hero-actions .btn{padding-top:1.1rem;padding-bottom:1.1rem}


  /* ── ChargeX-style motion touches ── */
  .gal{transition:transform .5s cubic-bezier(.22,.61,.36,1)}
  .gal img{transition:transform .8s cubic-bezier(.22,.61,.36,1)}
  .gal:hover img{transform:scale(1.06)}
  .why-card{transition:transform .35s cubic-bezier(.22,.61,.36,1),border-color .3s,box-shadow .35s}
  .why-card:hover{transform:translateY(-5px)}
  #hero .hero-inner{will-change:transform}
  @media(prefers-reduced-motion:reduce){
    .gal:hover img,.svc:hover,.why-card:hover{transform:none}
    #hero .hero-inner{transform:none!important}
  }

  /* Figma-style spring hovers + press feedback */
  .btn,.nav-book{transition:transform .4s var(--spring),box-shadow .4s var(--spring),background .3s,border-color .3s,color .3s}
  .btn:active,.nav-book:active{transform:translateY(0) scale(.97)}
  .prod-col{transition:transform .5s var(--spring),box-shadow .5s var(--spring),border-color .35s}
  .svc{transition:transform .45s var(--spring),background .3s,border-color .3s,box-shadow .45s var(--spring)}
  .svc:hover{transform:translateY(-5px);border-color:var(--line2);box-shadow:var(--elev)}
  .why-card{transition:transform .45s var(--spring),border-color .3s,box-shadow .45s}
  .gal{transition:transform .55s var(--spring)}
  .gal img{transition:transform .9s var(--spring)}
  .spec-pill{transition:transform .35s var(--spring),background .3s,border-color .3s}
  .prod-col:hover .spec-pill{transform:translateY(-1px)}
  /* orchestrated page-load: nav + hero ease in once */
  @keyframes fadeDown{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
  /* Experience promo — 3D tilt scene */
  #experience-promo{perspective:1300px;perspective-origin:50% 40%}
  .xp-3d{position:absolute;inset:-8%;z-index:0;transform-style:preserve-3d;transition:transform .3s cubic-bezier(.22,.61,.36,1);will-change:transform}
  .xp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%;filter:brightness(0.5) saturate(1.08);transform:translateZ(-60px) scale(1.12);animation:xpFloat 7s ease-in-out infinite}
  .xp-sweep{position:absolute;top:-20%;bottom:-20%;left:0;width:32%;z-index:1;pointer-events:none;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,0.16) 45%,rgba(184,255,0,0.10) 55%,transparent);
    filter:blur(6px);transform:translateX(-140%) skewX(-16deg);animation:xpSweep 6.5s ease-in-out infinite;animation-delay:1.2s}
  .xp-glow{position:absolute;z-index:1;width:46%;height:70%;right:4%;top:15%;pointer-events:none;
    background:radial-gradient(ellipse at 60% 50%,rgba(184,255,0,0.16),transparent 70%);filter:blur(20px);animation:xpGlow 9s ease-in-out infinite}
  .xp-content{position:relative;z-index:3;max-width:1180px;margin:0 auto;transform:translateZ(50px)}
  @keyframes xpFloat{0%,100%{transform:translateZ(-60px) scale(1.12) translateY(0)}50%{transform:translateZ(-60px) scale(1.12) translateY(-14px)}}
  @keyframes xpSweep{0%{transform:translateX(-140%) skewX(-16deg);opacity:0}12%{opacity:1}42%{opacity:0}100%{transform:translateX(360%) skewX(-16deg);opacity:0}}
  @keyframes xpGlow{0%,100%{opacity:0.55;transform:translateY(0)}50%{opacity:1;transform:translateY(-12px)}}
  @media(prefers-reduced-motion:reduce){.xp-img,.xp-sweep,.xp-glow{animation:none}.xp-3d{transition:none}}
  @keyframes heroIn{from{opacity:0;transform:translateY(22px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
  @keyframes navFadeDown{from{opacity:0;transform:translate(-50%,-12px)}to{opacity:1;transform:translateX(-50%)}}
  nav{animation:navFadeDown .7s var(--spring) both}
  #hero .hero-inner > *{animation:heroIn .9s var(--spring) both}
  #hero .hero-inner > *:nth-child(1){animation-delay:.05s}
  #hero .hero-inner > *:nth-child(2){animation-delay:.15s}
  #hero .hero-inner > *:nth-child(3){animation-delay:.25s}
  #hero .hero-inner > *:nth-child(4){animation-delay:.35s}
  #hero .hero-inner > *:nth-child(5){animation-delay:.45s}
  @media(prefers-reduced-motion:reduce){
    nav,#hero .hero-inner > *{animation:none!important}
    .btn:active,.nav-book:active,.prod-col:hover .spec-pill{transform:none}
  }

  /* ChargeX-style glass pill nav */
  .nav-links a{padding:0.5rem 0.95rem;border-radius:var(--r-pill,999px);background:rgba(255,255,255,0.08);
     border:1px solid rgba(255,255,255,0.12);backdrop-filter:blur(8px);color:rgba(245,245,245,0.92);
     font-size:0.66rem;letter-spacing:0.12em;transition:background .3s,color .3s,border-color .3s,transform .35s var(--spring)}
  .nav-links a:hover{background:rgba(184,255,0,0.16);border-color:var(--gold);color:#fff;transform:translateY(-1px)}
  .nav-links{gap:0.5rem;flex-wrap:nowrap}
  /* once scrolled past hero, nav gets the solid bar — keep pills subtle */
  nav.scrolled .nav-links a{background:rgba(255,255,255,0.05)}

  /* ════════ Brand motion FX (native, no libraries) ════════ */
  /* 1. Lime gradient headline via background-clip:text */
  .grad-text{background:linear-gradient(100deg,#fff 0%,#eaffb0 35%,var(--gold) 60%,#8fce00 100%);
     -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
     background-size:200% auto;animation:gradShift 6s ease-in-out infinite}
  @keyframes gradShift{0%,100%{background-position:0% center}50%{background-position:100% center}}

  /* 2. Showroom spotlight sweep over the hero photo */
  .hero-spotlight{position:absolute;inset:0;z-index:1;pointer-events:none;
     background:radial-gradient(60% 50% at 50% 0%,rgba(184,255,0,0.10),transparent 60%),
     linear-gradient(180deg,transparent 40%,rgba(10,10,11,0.5) 100%);
     mix-blend-mode:screen;opacity:.8}
  .hero-spotlight::after{content:"";position:absolute;inset:0;
     background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.06) 48%,transparent 62%);
     transform:translateX(-30%);animation:sweep 7s ease-in-out infinite}
  @keyframes sweep{0%,100%{transform:translateX(-40%)}50%{transform:translateX(40%)}}

  /* 3. Hero car drives across on scroll (driven by --drive 0..1 set in JS) */
  .hs-car{will-change:transform}
  #hero[data-drive] .hs-car{transform:translateX(calc((var(--drive,0) * 150%) - 10%)) translateY(0)}

  /* 4. Stats count-up section */
  #stats{border-top:1px solid var(--line);background:var(--bg)}
  .stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-top:2.5rem}
  .stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-md,18px);padding:2.2rem 1.6rem;text-align:center;transition:transform .45s var(--spring),border-color .3s}
  .stat:hover{transform:translateY(-4px);border-color:var(--line2)}
  .stat-num{font-family:var(--sans);font-weight:800;font-size:clamp(2.4rem,6vw,3.4rem);line-height:1;
     background:linear-gradient(120deg,#fff,var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  [data-theme="light"] .stat-num{background:linear-gradient(120deg,#1a1a1a,var(--gold-dk,#7a8a00));-webkit-background-clip:text;background-clip:text}
  .stat-suf{color:var(--gold)}
  @media print{
    .stat-num{background:none!important;-webkit-text-fill-color:currentColor!important;color:#1a1a1a!important}
  }
  .stat-label{font-family:var(--mono);font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--muted);margin-top:0.9rem}

  /* 5. Trust badges (stagger reuses .stagger) */
  .trust-row{display:flex;flex-wrap:wrap;gap:0.7rem;margin-top:2rem}
  .trust-badge{display:inline-flex;align-items:center;gap:0.5rem;padding:0.6rem 1.1rem;border-radius:var(--r-pill,999px);
     background:rgba(255,255,255,0.04);border:1px solid var(--line2);font-family:var(--mono);font-size:0.66rem;
     letter-spacing:0.12em;text-transform:uppercase;color:var(--bone)}
  .trust-badge b{color:var(--gold);font-weight:600}
  .trust-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold)}

  /* ── Tier colour-coding (Bronze · Silver · Gold · Platinum + service types) ── */
  .svc[data-tier]{position:relative}
  .svc[data-tier]::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;border-radius:18px 18px 0 0;opacity:0.9}
  /* Bronze */
  .svc[data-tier=bronze]::before{background:linear-gradient(90deg,#CD7F32,transparent)}
  .svc[data-tier=bronze] .svc-name{color:#E0A465}
  .svc[data-tier=bronze] .svc-offer li::before{background:#CD7F32}
  /* Silver */
  .svc[data-tier=silver]::before{background:linear-gradient(90deg,#C7CDD4,transparent)}
  .svc[data-tier=silver] .svc-name{color:#D8DDE2}
  .svc[data-tier=silver] .svc-offer li::before{background:#C7CDD4}
  /* Gold */
  .svc[data-tier=gold]::before{background:linear-gradient(90deg,#E8B530,transparent)}
  .svc[data-tier=gold] .svc-name{color:#F0C44A}
  .svc[data-tier=gold] .svc-offer li::before{background:#E8B530}
  /* Platinum — bright white-platinum with a lime kiss */
  .svc[data-tier=platinum]::before{background:linear-gradient(90deg,#E5E4E2,var(--gold))}
  .svc[data-tier=platinum] .svc-name{background:linear-gradient(100deg,#fff,#E5E4E2 60%,var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  .svc[data-tier=platinum] .svc-offer li::before{background:#E5E4E2}
  /* Paint Film / PPF — cool protective blue */
  .svc[data-tier=ppf]::before{background:linear-gradient(90deg,#5AA9E6,transparent)}
  .svc[data-tier=ppf] .svc-name{color:#7FC0F0}
  .svc[data-tier=ppf] .svc-offer li::before{background:#5AA9E6}
  /* Window Tint — cyan glass */
  .svc[data-tier=tint]::before{background:linear-gradient(90deg,#2FE0F2,transparent)}
  .svc[data-tier=tint] .svc-name{color:#4FE6F5}
  .svc[data-tier=tint] .svc-offer li::before{background:#2FE0F2}
  /* Membership — brand lime */
  .svc[data-tier=member]::before{background:linear-gradient(90deg,var(--gold),transparent)}
  .svc[data-tier=member] .svc-name{color:var(--gold-lt)}
  /* ════════ end ChargeX-feel layer ════════ */