:root{
    --black: #0A0A0A;
    --panel: #1D1F29;
    --panel-2: #282934;
    --steel: #434657;
    --steel-dim: #33343F;
    --signal: #B9C3FF;
    --signal-dim: #0047FF;
    --rev: #7FD4FF;
    --rev-dim: #00A8E8;
    --off: #E2E1F0;
    --off-dim: #C4C5DA;
    --ink: #00228A;
    --display: 'Archivo', sans-serif;
    --body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --mono: 'JetBrains Mono', monospace;
    --wordmark: 'Inter', sans-serif;

    /* neumorphic surface tokens (dark variant) */
    --neu-bg: #1D1F29;
    --neu-radius: 12px;
    --neu-radius-sm: 6px;
    --neu-light: rgba(255,255,255,.05);
    --neu-dark: rgba(0,0,0,.6);
    --neu-raised: 0 12px 40px rgba(0,71,255,.18), 0 2px 8px rgba(0,0,0,.5);
    --neu-raised-sm: 0 8px 24px rgba(0,71,255,.14), 0 2px 6px rgba(0,0,0,.4);
    --neu-pressed: inset 4px 4px 9px var(--neu-dark), inset -3px -3px 7px var(--neu-light);
    --neu-pressed-lg: inset 6px 6px 14px var(--neu-dark), inset -5px -5px 12px var(--neu-light);
    --header-bg: rgba(10,10,10,.86);
    --grid-line-opacity: .5;

    /* glassmorphism tokens */
    --glass-bg: rgba(255,255,255,.15);
    --glass-border: rgba(255,255,255,.14);
    --glass-blur: 20px;
  }
  html{ transition:background-color .4s ease; }
  body{ transition:background-color .4s ease, color .4s ease; }

  .liquid-glass{
    background:var(--glass-bg);
    backdrop-filter:blur(var(--glass-blur));
    -webkit-backdrop-filter:blur(var(--glass-blur));
    border:none;
    box-shadow:inset 0 1px 1px rgba(255,255,255,.1);
    position:relative;
    overflow:hidden;
  }
  .liquid-glass::before{
    content:'';
    position:absolute; inset:0;
    border-radius:inherit;
    padding:1.4px;
    background:linear-gradient(180deg,
      rgba(255,255,255,.45) 0%,
      rgba(255,255,255,.15) 20%,
      rgba(255,255,255,0) 40%,
      rgba(255,255,255,0) 60%,
      rgba(255,255,255,.15) 80%,
      rgba(255,255,255,.45) 100%);
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    pointer-events:none;
  }

  .grain-overlay{
    position:fixed; inset:0; z-index:2;
    pointer-events:none;
    filter:url(#grainFilter);
    opacity:.025;
    mix-blend-mode:multiply;
  }
  .custom-cursor{
    position:fixed; top:0; left:0; z-index:400;
    pointer-events:none;
    opacity:0;
    transition:opacity .3s ease;
  }
  .custom-cursor.active{ opacity:1; }
  .cursor-dot{
    position:fixed; top:0; left:0;
    width:4px; height:4px; margin:-2px 0 0 -2px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 6px rgba(185,195,255,.9), 0 0 14px rgba(185,195,255,.45);
    transition:opacity .2s ease;
  }
  .cursor-ring{
    position:fixed; top:0; left:0;
    width:30px; height:30px; margin:-15px 0 0 -15px;
    border-radius:50%;
    background:transparent;
    border:1px solid rgba(185,195,255,.75);
    box-shadow:0 0 10px rgba(185,195,255,.25), inset 0 0 8px rgba(185,195,255,.12);
    opacity:.9;
    transition:width .25s ease, height .25s ease, margin .25s ease, opacity .25s ease, border-color .25s ease, box-shadow .25s ease;
  }
  .custom-cursor.hover .cursor-ring{
    width:52px; height:52px; margin:-26px 0 0 -26px;
    border-color:rgba(127,212,255,.9);
    box-shadow:0 0 16px rgba(127,212,255,.35), inset 0 0 10px rgba(127,212,255,.15);
    opacity:1;
  }
  .custom-cursor.hover .cursor-dot{ opacity:0; }
  @media (prefers-reduced-motion: reduce){
    .cursor-ring{ transition:none; }
  }
  @media (hover:none), (pointer:coarse){
    .custom-cursor{ display:none; }
  }
  .click-spark{
    position:fixed; top:0; left:0;
    width:5px; height:5px; border-radius:1px;
    pointer-events:none; z-index:150;
    animation:spark-burst .55s cubic-bezier(.25,.8,.4,1) forwards;
  }
  @keyframes spark-burst{
    0%{ transform:translate(-50%,-50%) translate(0,0) rotate(0deg); opacity:1; }
    100%{ transform:translate(-50%,-50%) translate(var(--tx), calc(var(--ty) + 18px)) rotate(200deg); opacity:0; }
  }
  @media (prefers-reduced-motion: reduce){
    .click-spark{ display:none; }
  }
  body.custom-cursor-active, body.custom-cursor-active a, body.custom-cursor-active button,
  body.custom-cursor-active input, body.custom-cursor-active textarea{
    cursor:none;
  }

  *{ margin:0; padding:0; box-sizing:border-box; }
  html.lenis, html.lenis body{ height:auto; }
  .lenis.lenis-smooth{ scroll-behavior:auto; }
  .lenis.lenis-stopped{ overflow:hidden; }
  body{
    background-color:var(--black);
    background-image:
      radial-gradient(ellipse 60% 45% at 12% 8%, rgba(255,111,26,.06), transparent 60%),
      radial-gradient(ellipse 55% 50% at 88% 30%, rgba(0,168,232,.06), transparent 60%),
      radial-gradient(ellipse 60% 50% at 15% 68%, rgba(0,168,232,.05), transparent 60%),
      radial-gradient(ellipse 55% 45% at 90% 95%, rgba(255,111,26,.05), transparent 60%);
    background-attachment:fixed;
    background-repeat:no-repeat;
    color:var(--off);
    font-family:var(--body);
    font-weight:500;
    font-size:16px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
    overflow-x:hidden;
    overflow-x:clip;
    transition:background-color .4s ease, color .4s ease;
  }  ::selection{ background:var(--signal); color:var(--ink); }

  a{ color:inherit; text-decoration:none; }
  button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }

  .wrap{ max-width:1240px; margin:0 auto; padding:0 32px; position:relative; z-index:2; }

  :focus-visible{ outline:2px solid var(--rev); outline-offset:3px; }

  /* ---------- utility text ---------- */
  .eyebrow{
    font-family:var(--mono);
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--signal);
    display:flex; align-items:center;
  }
  .eyebrow-center{ justify-content:center; }

  /* ---------- spotlight-hover utility ---------- */
  .spot-hover{ position:relative; }
  .spot-hover::before{
    content:"";
    position:absolute; inset:0;
    background:radial-gradient(150px circle at var(--mx,50%) var(--my,50%),
      rgba(127,212,255,.2), rgba(0,168,232,.14) 45%, transparent 70%);
    opacity:0;
    transition:opacity .3s ease;
    pointer-events:none;
    z-index:0;
  }
  .spot-hover:hover::before{ opacity:1; }
  .spot-hover > *{ position:relative; z-index:1; }
  @media (prefers-reduced-motion: reduce), (hover:none){
    .spot-hover::before{ display:none; }
  }

  .hero-badge{
    display:inline-flex; align-items:center; gap:10px;
    flex-wrap:wrap; row-gap:6px;
    font-family:var(--mono);
    font-size:13px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
    color:var(--off-dim);
    background:var(--neu-bg);
    border:none;
    border-radius:30px;
    box-shadow:var(--neu-raised-sm);
    padding:10px 18px;
    margin-bottom:24px;
  }
  .hero-badge-main{
    color:var(--signal);
    font-size:15px;
    letter-spacing:.04em;
  }
  .hero-badge-dot{
    width:8px; height:8px; border-radius:50%;
    background:var(--signal); flex-shrink:0;
    box-shadow:0 0 10px 2px rgba(0,168,232,.6);
    animation: pulse 1.8s ease-in-out infinite;
  }

  /* ================= NAV ================= */
  header{
    position:fixed; top:0; left:0; right:0; z-index:100;
    background:var(--header-bg);
    backdrop-filter:blur(10px);
    border-bottom:none;
    box-shadow:0 4px 12px var(--neu-dark);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    height:74px;
  }
  .nav-actions{ display:flex; align-items:center; gap:16px; }
  .logo{
    font-family:var(--wordmark);
    font-size:19px;
    font-weight:600;
    letter-spacing:.09em;
    display:flex; align-items:center; gap:10px;
  }
  .logo-text{ white-space:nowrap; flex-shrink:0; }
  .logo-text .lw-the{
    font-weight:500; color:var(--off-dim); font-size:.5em; letter-spacing:.3em;
    margin-right:6px;
  }
  .logo-text .lw-hyp{ font-weight:700; color:var(--off); font-size:1.1em; letter-spacing:.01em; }
  .logo-text .lw-engine{ font-weight:300; color:var(--off); font-size:.95em; letter-spacing:.16em; margin-left:5px; }
  .logo .dot{
    width:9px; height:9px; border-radius:50%;
    background:var(--signal);
    box-shadow:0 0 12px 2px var(--signal);
    animation: pulse 1.8s ease-in-out infinite;
  }
  .logo-mark-wrap{
    position:relative;
    width:48px; height:48px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    transform-style:preserve-3d;
    perspective:400px;
    transition:transform .3s cubic-bezier(.34,1.56,.64,1);
    will-change:transform;
  }
  .logo-mark-img{
    width:100%; height:100%; object-fit:contain;
    transition:filter .3s ease;
  }
  .logo:hover .logo-mark-wrap{ transform:scale(1.14); }
  .logo-mark-wrap.pulse{ animation:logo-pulse .5s ease-in-out; }
  @keyframes logo-pulse{
    0%, 100%{ transform:scale(1.14); }
    40%{ transform:scale(1.32); }
  }
  .logo-mark-wrap::before, .logo-mark-wrap::after{
    content:"";
    position:absolute;
    inset:-4px;
    border-radius:50%;
    border:2px solid var(--signal);
    opacity:0;
    pointer-events:none;
  }
  .logo-mark-wrap.pulse::before{
    animation:logo-ring-burst .65s ease-out;
  }
  .logo-mark-wrap.pulse::after{
    animation:logo-ring-burst .65s ease-out .1s;
  }
  @keyframes logo-ring-burst{
    0%{ opacity:.85; transform:scale(1); }
    100%{ opacity:0; transform:scale(2.1); }
  }
  @media (prefers-reduced-motion: reduce){
    .logo-mark-wrap.pulse{ animation:none; }
    .logo-mark-wrap.pulse::before, .logo-mark-wrap.pulse::after{ animation:none; }
  }
  .logo-tag{
    font-family:var(--mono);
    font-size:10.5px; font-weight:500; letter-spacing:.06em; text-transform:uppercase;
    color:var(--off-dim);
    border-left:1px solid var(--steel);
    padding-left:14px; margin-left:4px;
    white-space:nowrap;
  }
  .logo-tag strong{ color:var(--signal); font-weight:600; }
  @keyframes pulse{ 0%,100%{ opacity:1; transform:scale(1);} 50%{ opacity:.4; transform:scale(.72);} }

  nav.links{ display:flex; gap:36px; }
  nav.links a{
    font-family:var(--mono); font-size:12.5px; letter-spacing:.08em; text-transform:uppercase;
    color:var(--off-dim); transition:color .2s;
    position:relative;
  }
  nav.links a::after{
    content:"";
    position:absolute; left:0; right:100%; bottom:-6px; height:2px;
    background:var(--signal);
    box-shadow:0 0 8px rgba(0,168,232,.7);
    transition:right .25s ease;
  }
  nav.links a:hover{ color:var(--off); }
  nav.links a:hover::after{ right:0; }

  .menu-toggle{
    display:none;
    width:38px; height:38px;
    align-items:center; justify-content:center;
    background:var(--neu-bg);
    border:none;
    border-radius:10px;
    box-shadow:var(--neu-raised-sm);
    flex-shrink:0;
  }
  .menu-toggle .bars{ position:relative; width:16px; height:11px; }
  .menu-toggle .bars span{
    position:absolute; left:0; right:0; height:1.5px; background:var(--off);
    transition:transform .25s, opacity .2s, top .25s;
  }
  .menu-toggle .bars span:nth-child(1){ top:0; }
  .menu-toggle .bars span:nth-child(2){ top:5px; }
  .menu-toggle .bars span:nth-child(3){ top:10px; }
  .menu-toggle.open .bars span:nth-child(1){ top:5px; transform:rotate(45deg); }
  .menu-toggle.open .bars span:nth-child(2){ opacity:0; }
  .menu-toggle.open .bars span:nth-child(3){ top:5px; transform:rotate(-45deg); }

  .mobile-cta{ display:none; }

  .btn{
    font-family:var(--mono);
    font-size:12.5px; letter-spacing:.08em; text-transform:uppercase;
    padding:14px 28px;
    border:none;
    border-radius:999px;
    background:var(--neu-bg);
    color:var(--signal);
    position:relative;
    box-shadow:var(--neu-raised-sm);
    transition:color .25s, transform .2s ease, box-shadow .2s ease;
    display:inline-flex; align-items:center; gap:8px;
  }
  .btn:hover{
    color:var(--rev);
    transform:translateY(-2px);
    box-shadow:7px 7px 14px var(--neu-dark), -5px -5px 12px var(--neu-light), 0 0 18px rgba(0,168,232,.25);
  }
  .btn:active{
    color:var(--signal);
    transform:translateY(0);
    box-shadow:var(--neu-pressed);
  }
  .btn.ghost{ color:var(--off-dim); }
  .btn.ghost:hover{ color:var(--off); box-shadow:7px 7px 14px var(--neu-dark), -5px -5px 12px var(--neu-light); }
  .btn.solid{
    background:linear-gradient(180deg, #E2E2E2, #FFFFFF);
    color:#0A0A0A; font-weight:700;
    box-shadow:0 4px 14px rgba(0,0,0,.35), inset 0 1px 1px rgba(255,255,255,.6);
    transition:color .25s, transform .2s ease, box-shadow .2s ease, background .25s ease;
  }
  .btn.solid:hover{
    color:#0A0A0A; transform:translateY(-2px);
    background:linear-gradient(180deg, #EDEDED, #FFFFFF);
    box-shadow:0 0 28px 4px rgba(0,71,255,.45), 0 6px 18px rgba(0,0,0,.4), inset 0 1px 1px rgba(255,255,255,.7);
  }
  .btn.solid:active{
    transform:translateY(0);
    box-shadow:0 0 16px 2px rgba(0,71,255,.35), inset 0 2px 4px rgba(0,0,0,.15);
  }

  /* ================= TICKER ================= */
  .ticker-band{
    position:fixed; top:74px; left:0; right:0; z-index:99;
    height:8px;
    overflow:hidden;
    background:var(--neu-bg);
    box-shadow:inset 0 2px 4px var(--neu-dark),
               inset 0 -1px 2px var(--neu-light);
  }
  .ticker-band::before{
    content:"";
    position:absolute; left:0; right:0; top:50%; transform:translateY(-50%);
    height:3px;
    border-radius:999px;
    background:linear-gradient(90deg,
      transparent 0%,
      var(--rev) 35%,
      var(--signal) 50%,
      var(--rev) 65%,
      transparent 100%);
    background-size:200% 100%;
    animation:accent-flow 6s linear infinite;
    opacity:.5;
  }
  @keyframes accent-flow{
    from{ background-position:200% 0; }
    to{ background-position:-200% 0; }
  }
  .progress-track{
    position:absolute; left:0; right:0; top:50%; transform:translateY(-50%);
    height:3px;
    background:transparent;
    z-index:2;
  }
  .progress-fill{
    height:100%; width:0%;
    border-radius:999px;
    background:linear-gradient(90deg, var(--rev), var(--signal));
    box-shadow:0 0 8px rgba(0,168,232,.55);
    transition:width .1s linear;
  }
  @media (prefers-reduced-motion: reduce){
    .ticker-band::before{ animation:none; }
  }

  main{ padding-top:90px; }
  .breadcrumb-nav{ padding-top:100px; position:relative; z-index:2; }

  /* ================= HERO ================= */
  .hero{
    position:relative;
    padding:96px 0 120px;
    min-height:100vh;
    min-height:100dvh;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:linear-gradient(135deg, var(--panel) 0%, var(--neu-bg) 60%);
    transition:background-color .4s ease;
  }  .parallax-layer{
    position:absolute; inset:0;
    will-change:transform;
  }

  /* ================= SCRUB HERO (scroll-scrubbed video intro) ================= */
  .scrub-hero-track{
    position:relative;
    height:720vh;
    min-height:4200px;
    --scrub-fg:#ffffff;
    --scrub-fg-soft:rgba(255,255,255,.78);
    --scrub-fg-faint:rgba(255,255,255,.55);
    --scrub-shade:#0A0A0A;
    --scrub-rule:rgba(255,255,255,.2);
    --scrub-ease:cubic-bezier(.22,.61,.36,1);
    --scrub-pill-bg:#ffffff;
    --scrub-pill-fg:#0a0908;
  }
  .scrub-hero-sticky{
    position:sticky;
    top:0;
    height:100vh;
    height:100dvh;
    overflow:hidden;
    background:var(--scrub-shade);
  }
  .scrub-boot{
    position:absolute; inset:0; z-index:90;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px;
    background:var(--scrub-shade);
    transition:opacity .7s var(--scrub-ease), visibility .7s;
  }
  .scrub-boot.done{ opacity:0; visibility:hidden; }
  .scrub-boot p{ font-size:12.5px; letter-spacing:.05em; color:var(--scrub-fg-faint); font-family:'Inter',sans-serif; }
  .scrub-bar{ width:150px; height:1px; background:var(--scrub-rule); overflow:hidden; }
  .scrub-bar i{ display:block; height:100%; width:100%; background:var(--scrub-fg); transform:scaleX(0); transform-origin:0 50%; }
  .scrub-stage{ position:absolute; inset:0; z-index:0; overflow:hidden; background:var(--scrub-shade); }
  .scrub-stage video{
    position:absolute; top:50%; left:50%; width:100%; height:100%;
    transform:translate(-50%,-50%) scale(1.02); object-fit:cover; object-position:center top; filter:contrast(1.02) brightness(.68); will-change:transform;
  }
  .scrub-veil{
    position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(to bottom, rgba(0,0,0,.38) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 78%, rgba(0,0,0,.42) 100%), rgba(0,0,0,.2);
  }
  .scrub-grain{
    position:absolute; inset:-50%; opacity:.13; mix-blend-mode:multiply; pointer-events:none;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='140' height='140' filter='url(%23n)' opacity='.5'/></svg>");
  }
  .scrub-meter{
    position:absolute; top:0; left:0; z-index:50; height:2px; width:100%;
    transform:scaleX(0); transform-origin:0 50%; background:var(--scrub-fg); opacity:.55;
  }
  .scrub-panels{ position:absolute; inset:0; z-index:20; pointer-events:none; }
  .scrub-panel{
    position:absolute; inset:0; display:flex; flex-direction:column;
    align-items:flex-start; justify-content:center; text-align:left;
    padding:150px clamp(24px, 6vw, 80px) 60px;
    will-change:opacity,transform;
  }
  .js .scrub-panel{ opacity:0; }
  .scrub-panel-inner{
    max-width:420px;
    display:flex; flex-direction:column; align-items:flex-start;
  }
  .scrub-eyebrow{
    display:flex; align-items:center; justify-content:flex-start; flex-wrap:wrap;
    gap:6px 12px; font-family:'Inter',sans-serif; font-size:12.5px; letter-spacing:.045em; color:var(--scrub-fg-soft);
    margin-bottom:clamp(16px,2vw,22px); max-width:min(46ch, 100%); text-align:center;
  }
  .scrub-h1{
    font-family:var(--display); color:var(--scrub-fg); font-weight:700;
    font-size:clamp(27px, 4.6vw, 60px); line-height:1.02; letter-spacing:-.03em; max-width:15ch;
    margin:0;
  }
  .scrub-sub{
    margin-top:clamp(18px,2.2vw,28px); font-family:'Inter',sans-serif; font-size:clamp(15px,1.28vw,19px);
    line-height:1.5; letter-spacing:-.008em; color:var(--scrub-fg-soft); max-width:min(46ch, 100%);
  }
  .scrub-cta{ margin-top:clamp(28px,3.4vw,44px); pointer-events:auto; width:100%; display:flex; justify-content:flex-start; }
  .scrub-pill{
    display:inline-flex; align-items:center; justify-content:center; height:48px;
    padding:0 27px; border-radius:999px; background:var(--scrub-pill-bg); color:var(--scrub-pill-fg);
    font-family:'Inter',sans-serif; font-size:15px; font-weight:500; letter-spacing:-.008em; text-decoration:none;
    white-space:nowrap; border:1px solid rgba(10,9,8,.12);
    box-shadow:0 4px 14px rgba(0,0,0,.35), inset 0 1px 1px rgba(255,255,255,.6);
    transition:background .25s ease, box-shadow .2s ease, color .25s ease;
  }
  /* matches the header CTA - no transform here, the magnetic script owns it */
  .scrub-pill:hover{
    background:linear-gradient(180deg, #EDEDED, #FFFFFF);
    color:var(--scrub-pill-fg);
    box-shadow:0 0 28px 4px rgba(0,71,255,.45), 0 6px 18px rgba(0,0,0,.4), inset 0 1px 1px rgba(255,255,255,.7);
  }
  .scrub-pill:active{
    box-shadow:0 0 16px 2px rgba(0,71,255,.35), inset 0 2px 4px rgba(0,0,0,.15);
  }
  @media (max-width:720px){
    .scrub-h1{ max-width:12ch; font-size:clamp(26px, 8vw, 42px); }
    .scrub-sub{ font-size:14px; max-width:34ch; }
  }
  @media (max-width:420px){
    .scrub-h1{ max-width:11ch; font-size:clamp(24px, 8.5vw, 32px); }
    .scrub-eyebrow{ font-size:11px; letter-spacing:.04em; max-width:28ch; }
    .scrub-cta .scrub-pill{ width:100%; max-width:280px; height:44px; padding:0 20px; font-size:14px; }
  }
  @media (prefers-reduced-motion: reduce){
    .scrub-hero-track{ height:auto; min-height:0; }
    .scrub-hero-sticky{ position:relative; top:0; height:auto; min-height:600px; }
    .scrub-panel{ position:relative; opacity:1 !important; transform:none !important; padding:80px clamp(20px,5vw,60px); }
  }

  /* ================= SERVICES LIST (typographic, no tiles) ================= */
  /* ================= ABOUT ================= */
  .about-section{ padding:160px 0 80px; background:#0A0A0A; position:relative; }
  .about-label{ font-family:var(--mono); font-size:13px; color:var(--off-dim); letter-spacing:.1em; text-transform:uppercase; margin-bottom:24px; }
  .about-heading{
    font-family:var(--display); font-size:clamp(30px,4.6vw,58px); line-height:1.15; color:var(--off); max-width:18ch; margin:0;
  }
  .about-heading em{ font-style:italic; color:var(--off-dim); }

  .section-sub{
    font-family:var(--body); font-size:clamp(14.5px,1.15vw,17px); line-height:1.6;
    color:var(--off-dim); max-width:52ch; margin:22px 0 0;
  }

  /* ================= FEATURED ================= */
  .featured-section{ padding:40px 0 100px; background:#0A0A0A; }
  .featured-media{ position:relative; border-radius:24px; overflow:hidden; aspect-ratio:16/9; }
  .featured-media video{ width:100%; height:100%; object-fit:cover; }
  .featured-overlay{
    position:absolute; inset:0;
    background:linear-gradient(to top, rgba(0,0,0,.6), transparent 55%);
    display:flex; align-items:flex-end; justify-content:space-between; gap:24px;
    padding:32px; flex-wrap:wrap;
  }
  .featured-cta{
    display:inline-flex; align-items:center; border-radius:999px; padding:14px 28px;
    font-family:var(--body); font-size:14px; font-weight:500; color:#fff; text-decoration:none;
    transition:transform .3s ease;
  }
  .featured-cta:hover{ transform:scale(1.05); }

  /* ================= PHILOSOPHY ================= */
  .philosophy-section{ padding:100px 0 140px; background:#0A0A0A; }
  .philosophy-heading{
    font-family:var(--display); font-size:clamp(36px,5.6vw,72px); color:var(--off); margin:0 0 64px;
  }
  .philosophy-heading em{ font-style:italic; color:var(--off-dim); }
  @media (max-width:640px){
    .about-section{ padding:120px 0 60px; }
    .featured-section{ padding:20px 0 70px; }
    .featured-overlay{ flex-direction:column; align-items:stretch; }
    .philosophy-section{ padding:70px 0 90px; }
  }

  .scrub-services{
    list-style:none; margin:clamp(18px,2.2vw,28px) 0 0; padding:0;
    display:flex; flex-direction:column; gap:2px;
  }
  .scrub-services li{ margin:0; }
  .scrub-services a{
    display:block; padding:7px 0;
    font-family:var(--display); font-size:clamp(19px,2vw,26px);
    line-height:1.15; letter-spacing:-.01em;
    color:var(--scrub-fg); text-decoration:none;
    opacity:.72; transition:opacity .25s ease, transform .25s ease, color .25s ease, text-shadow .25s ease;
  }
  .scrub-services a:hover{ opacity:1; transform:translateX(6px); }
  /* each service lights up in its own colour, kept within the cool palette */
  .scrub-services li:nth-child(1) a:hover{ color:#3FE0FF; text-shadow:0 0 18px rgba(63,224,255,.45); }
  .scrub-services li:nth-child(2) a:hover{ color:#8FA4FF; text-shadow:0 0 18px rgba(143,164,255,.45); }
  .scrub-services li:nth-child(3) a:hover{ color:#5CF2E8; text-shadow:0 0 18px rgba(92,242,232,.45); }
  .scrub-services li:nth-child(4) a:hover{ color:#7B8CFF; text-shadow:0 0 18px rgba(123,140,255,.45); }
  .scrub-services li:nth-child(5) a:hover{ color:#B98CFF; text-shadow:0 0 18px rgba(185,140,255,.45); }
  .scrub-services li:nth-child(6) a:hover{ color:#3FFFC8; text-shadow:0 0 18px rgba(63,255,200,.45); }
  .scrub-services li:nth-child(7) a:hover{ color:#00C2FF; text-shadow:0 0 18px rgba(0,194,255,.5); }
  .scrub-anchor{
    position:absolute; left:0; width:1px; height:1px;
    /* tuned so #services lands mid-panel-4, not at the very end of the track;
       the percentage is relative to track height, which differs on mobile */
    top:82%; pointer-events:none;
  }
  @media (max-width:640px){
    .scrub-services a{ font-size:17px; padding:5px 0; }
    .scrub-panel{ padding:110px clamp(20px,5vw,60px) 48px; }
  }
  @media (max-height:760px){
    .scrub-panel{ padding-top:110px; padding-bottom:48px; }
  }
  /* Phones load a dedicated portrait crop of the clip, so it can fill the
     screen instead of sitting in a letterboxed band. */
  @media (max-width:860px){
    .scrub-stage video{ object-fit:cover; object-position:center; }
    /* 720vh is roughly seven screens of scrolling on a phone before any
       content - shorten the run without losing the panel sequence */
    .scrub-hero-track{ height:420vh; min-height:0; }
    .scrub-anchor{ top:72%; }
  }

  .glass-panel{
    background:var(--glass-bg);
    backdrop-filter:blur(var(--glass-blur));
    -webkit-backdrop-filter:blur(var(--glass-blur));
    border:1px solid var(--glass-border);
    border-radius:28px;
    padding:44px 40px;
    box-shadow:0 12px 40px rgba(0,0,0,.35), inset 0 1px 1px rgba(255,255,255,.08);
  }
  .hero-glow-blob{
    position:absolute;
    border-radius:50%;
    filter:blur(90px);
    pointer-events:none;
    z-index:0;
  }
  .hero-glow-blob-1{
    top:-10%; right:-5%;
    width:44%; padding-bottom:44%;
    background:radial-gradient(circle, rgba(62,142,255,.35), transparent 70%);
  }
  .hero-glow-blob-2{
    bottom:-15%; left:-8%;
    width:36%; padding-bottom:36%;
    background:radial-gradient(circle, rgba(255,143,77,.2), transparent 70%);
  }
  @media (max-width:960px){
    .glass-panel{ padding:32px 28px; border-radius:22px; }
  }
  .hero-inner{
    position:relative; z-index:2;
    display:grid; grid-template-columns:minmax(0, 1.15fr); gap:40px; align-items:center;
  }
  .wrap.hero-inner{ max-width:none; margin-left:0; padding-left:56px; padding-right:32px; }
  @media (max-width:960px){
    .wrap.hero-inner{ padding-left:24px; }
  }
  .hero h1, .section-head h2, .faq h2, .cta h2,
  .stage h3, .gauge-center .num,
  .manifesto-head h2, .process h2, .results h2, .deliverables h2, .ai-edge-copy h2{
    font-weight:600;
  }
  .hero h1{
    font-family:var(--display);
    font-size:clamp(48px, 6.4vw, 92px);
    line-height:.98;
    letter-spacing:-.03em;
    margin:20px 0 26px;
  }
  .hero h1 .accent{
    color:var(--signal);
    display:inline-block;
    transition:transform .25s ease, text-shadow .25s ease;
    cursor:default;
  }
  .hero h1 .accent:hover{
    transform:translateY(-2px) scale(1.03);
    text-shadow:0 0 24px rgba(0,168,232,.65);
  }
  .hero p.lede{
    font-size:18px; line-height:1.6; color:var(--off-dim);
    max-width:520px; margin-bottom:36px;
  }
  .hero p.lede .hl{
    color:var(--off); font-weight:600;
  }
  .hero-ctas{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }

  .hero-video-scrim{
    position:absolute; inset:0; z-index:1; pointer-events:none;
    background:linear-gradient(100deg, rgba(10,10,10,.82) 0%, rgba(10,10,10,.62) 34%, rgba(10,10,10,.3) 62%, rgba(10,10,10,.08) 100%);
  }  @media (max-width:960px){
    .hero-slider, .hero-video-scrim, .hero-slider-nav{ display:none; }
  }
  .hero-slider{
    position:absolute; inset:0; z-index:0; overflow:hidden;
  }
  .hero-slide{
    position:absolute; inset:0; width:100%; height:100%;
    background-size:cover; background-position:70% center;
    opacity:0; filter:blur(0px); transform:scale(1.04);
    transition:opacity 1s ease, filter 1s ease, transform 1.1s ease;
    pointer-events:none;
  }
  .hero-slide-1{
    background-image:url('/assets/homepage-hero.jpg');
    background-image:image-set(url('/assets/homepage-hero.webp') type('image/webp'), url('/assets/homepage-hero.jpg') type('image/jpeg'));
  }
  @media (max-width:800px){
    .hero-slide-1{
      background-image:url('/assets/homepage-hero-mobile.jpg');
      background-image:image-set(url('/assets/homepage-hero-mobile.webp') type('image/webp'), url('/assets/homepage-hero-mobile.jpg') type('image/jpeg'));
    }
  }
  .hero-slide.is-active{
    opacity:1; filter:blur(0px); transform:scale(1);
    z-index:1;
  }
  .hero-slide.is-leaving{
    filter:blur(26px); transform:scale(1.08);
    z-index:1;
  }
  .hero-slider-nav{
    position:absolute; right:44px; bottom:44px; z-index:2;
    display:flex; align-items:center; gap:14px;
  }
  .hero-slider-arrow{
    width:38px; height:38px; border-radius:50%;
    background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18);
    color:#fff; font-size:16px; line-height:1; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background .2s ease, border-color .2s ease;
    pointer-events:auto;
  }
  .hero-slider-arrow:hover{ background:rgba(127,212,255,.25); border-color:var(--signal); }
  .hero-slider-count{
    font-family:var(--mono); font-size:12px; color:rgba(255,255,255,.6);
    letter-spacing:.06em;
  }
  @media (prefers-reduced-motion: reduce){
    .hero-slide{ transition:opacity .3s ease; filter:none !important; transform:none !important; }
  }

  /* ---------- scroll reveal ---------- */
  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
  .reveal-in{ opacity:1; transform:translateY(0); }

  @media (prefers-reduced-motion: reduce){
    .logo .dot{ animation:none !important; }
  }

  /* ================= MANIFESTO ================= */
  .manifesto{ padding:128px 0; position:relative; overflow:hidden; }
  .manifesto-head{ max-width:680px; margin-bottom:56px; position:relative; z-index:2; }
  .manifesto-head h2{
    font-family:var(--display); font-size:clamp(32px,4vw,48px); line-height:1.05; margin-top:16px;
  }
  .manifesto-grid{
    display:grid; grid-template-columns:repeat(2,1fr); gap:22px;
    perspective:900px;
    position:relative; z-index:2;
  }
  .manifesto-card{
    background:var(--glass-bg);
    backdrop-filter:blur(var(--glass-blur));
    -webkit-backdrop-filter:blur(var(--glass-blur));
    border:1px solid var(--glass-border);
    border-radius:var(--neu-radius);
    box-shadow:0 10px 32px rgba(0,0,0,.3), inset 0 1px 1px rgba(255,255,255,.08);
    padding:34px 30px;
    position:relative;
    overflow:hidden;
    transition:transform .2s ease-out, box-shadow .25s ease;
    transform-style:preserve-3d;
    will-change:transform;
  }
  .manifesto-card::before{
    content:"";
    position:absolute; top:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg, var(--rev), var(--signal));
    transform:scaleX(0); transform-origin:left;
    transition:transform .3s ease;
  }
  .manifesto-card:hover{
    box-shadow:10px 10px 22px var(--neu-dark), -8px -8px 18px var(--neu-light);
  }
  .manifesto-card:hover::before{ transform:scaleX(1); }
  .manifesto-card .mk{
    font-family:var(--mono); font-size:11px; color:var(--signal); letter-spacing:.1em;
  }
  .manifesto-card h3{
    font-family:var(--body); font-weight:600; font-size:19px; margin:14px 0 10px; line-height:1.3;
  }
  .manifesto-card p{ color:var(--off-dim); font-size:14.5px; line-height:1.6; }

  /* ================= AI EDGE ================= */
  .ai-edge{ padding:128px 0; position:relative; overflow:hidden; }

  .founder{ padding:128px 0; position:relative; overflow:hidden; }
  .founder-inner{
    display:grid; grid-template-columns:.6fr 1.4fr; gap:56px; align-items:start;
  }
  .founder-photo-wrap{
    position:relative;
    aspect-ratio:1;
    max-width:280px;
  }
  .founder-photo-glow{
    position:absolute; inset:-18px;
    border-radius:32px;
    background:conic-gradient(from 140deg, var(--signal), var(--rev), var(--signal));
    filter:blur(28px);
    opacity:.45;
    animation:founder-glow-spin 8s linear infinite;
  }
  @keyframes founder-glow-spin{
    from{ transform:rotate(0deg); }
    to{ transform:rotate(360deg); }
  }
  .founder-frame{
    position:absolute; inset:-10px;
    z-index:2;
    pointer-events:none;
  }
  .founder-frame span{
    position:absolute;
    width:26px; height:26px;
    border-color:var(--signal);
    border-style:solid;
    border-width:0;
    animation:founder-frame-pulse 3.2s ease-in-out infinite;
  }
  .founder-frame span:nth-child(1){ top:0; left:0; border-top-width:2.5px; border-left-width:2.5px; border-radius:8px 0 0 0; }
  .founder-frame span:nth-child(2){ top:0; right:0; border-top-width:2.5px; border-right-width:2.5px; border-radius:0 8px 0 0; animation-delay:.2s; }
  .founder-frame span:nth-child(3){ bottom:0; left:0; border-bottom-width:2.5px; border-left-width:2.5px; border-radius:0 0 0 8px; animation-delay:.4s; }
  .founder-frame span:nth-child(4){ bottom:0; right:0; border-bottom-width:2.5px; border-right-width:2.5px; border-radius:0 0 8px 0; animation-delay:.6s; }
  @keyframes founder-frame-pulse{
    0%, 100%{ opacity:.55; }
    50%{ opacity:1; }
  }
  @media (prefers-reduced-motion: reduce){
    .founder-photo-glow{ animation:none; }
    .founder-frame span{ animation:none; opacity:.8; }
  }
  .founder-photo{
    position:relative; z-index:1;
    width:100%; height:100%;
    object-fit:cover;
    border-radius:24px;
    box-shadow:var(--neu-raised);
    border:1px solid rgba(255,255,255,.08);
  }
  .founder-copy p{
    font-size:16px; line-height:1.7; color:var(--off-dim);
    margin-bottom:18px;
  }
  .founder-copy h2{
    font-family:var(--display); font-size:clamp(30px,3.6vw,44px);
    margin:14px 0 24px;
  }
  .founder-signature{
    font-family:var(--body); font-weight:700; color:var(--off) !important;
    margin-top:8px;
  }
  .founder-signature span{
    display:block; font-weight:500; font-size:14px; color:var(--off-dim); margin-top:4px;
  }
  @media (max-width:860px){
    .founder-inner{ grid-template-columns:1fr; gap:36px; }
    .founder-photo-wrap{ max-width:280px; margin:0; }
  }

  .ai-edge-inner{
    display:grid; grid-template-columns:1.3fr .7fr; gap:56px; align-items:center;
    background:var(--neu-bg);
    border-radius:var(--neu-radius);
    box-shadow:var(--neu-raised);
    padding:56px;
  }
  .ai-edge-copy h2{
    font-family:var(--display); font-size:clamp(30px,3.6vw,46px);
    line-height:1.02; margin:16px 0 24px;
  }
  .ai-edge-lede{ color:var(--off-dim); font-size:15.5px; line-height:1.7; margin-bottom:20px; max-width:560px; }
  .ai-edge-copy .btn{ margin-top:8px; }

  .ai-edge-visual{
    position:relative; aspect-ratio:1; min-height:240px;
    display:flex; align-items:center; justify-content:center;
  }
  .ai-glow{
    position:absolute; top:50%; left:50%; width:220px; height:220px;
    margin:-110px 0 0 -110px; border-radius:50%;
    background:radial-gradient(circle, rgba(127,212,255,.3) 0%, rgba(0,168,232,.15) 55%, transparent 75%);
    filter:blur(22px);
    animation:ai-glow-pulse 3.6s ease-in-out infinite;
    z-index:0;
  }
  @keyframes ai-glow-pulse{
    0%, 100%{ opacity:.7; transform:scale(1); }
    50%{ opacity:1; transform:scale(1.08); }
  }
  .ai-core{
    width:104px; height:104px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-family:var(--display); font-size:32px; color:#fff;
    background:linear-gradient(150deg, #9FE0FF 0%, #7FD4FF 55%, #0B4C66 100%);
    box-shadow:7px 7px 18px var(--neu-dark),
               -6px -6px 16px var(--neu-light),
               0 0 30px rgba(127,212,255,.5),
               inset 0 2px 3px rgba(255,255,255,.4),
               inset 0 -3px 6px rgba(0,0,0,.2);
    position:relative; z-index:3;
  }
  .ai-core::after{
    content:"";
    position:absolute; inset:-10px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(127,212,255,.55), transparent 70%);
    z-index:-1;
    pointer-events:none;
    animation:ai-core-glow-pulse 3.6s ease-in-out infinite;
  }
  @keyframes ai-core-glow-pulse{
    0%, 100%{ transform:scale(1); opacity:.5; }
    50%{ transform:scale(1.3); opacity:.9; }
  }
  .ai-orbit{
    position:absolute; top:50%; left:50%; width:180px; height:180px;
    margin:-90px 0 0 -90px; border-radius:50%;
    border:1px solid var(--steel-dim);
    box-shadow:inset 1px 1px 3px var(--neu-dark), inset -1px -1px 3px var(--neu-light);
    animation:ai-spin 18s linear infinite;
    z-index:1;
  }
  .ai-orbit-2{ width:240px; height:240px; margin:-120px 0 0 -120px; animation-duration:26s; animation-direction:reverse; border-color:transparent; box-shadow:inset 1px 1px 4px var(--neu-dark), inset -1px -1px 4px var(--neu-light); }
  @keyframes ai-spin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
  .ai-node{
    position:absolute; width:14px; height:14px; border-radius:50%;
    background:var(--neu-bg); box-shadow:var(--neu-raised-sm);
    z-index:2;
  }
  .ai-node::after{ content:""; position:absolute; inset:3px; border-radius:50%; }
  .ai-node-1{ top:-7px; left:50%; margin-left:-7px; }
  .ai-node-1::after{ background:var(--signal); box-shadow:0 0 8px var(--signal); }
  .ai-node-2{ top:50%; left:-7px; margin-top:-7px; }
  .ai-node-2::after{ background:var(--rev); box-shadow:0 0 8px var(--rev); }
  .ai-node-3{ bottom:16px; right:16px; }
  .ai-node-3::after{ background:var(--signal); box-shadow:0 0 8px var(--signal); }
  @media (prefers-reduced-motion: reduce){
    .ai-orbit{ animation:none; }
    .ai-core, .ai-glow{ animation:none; }
  }

  /* ================= SERVICES ================= */
  .services{ padding:128px 0; position:relative; overflow:hidden; }

  .section-head{
    display:flex; justify-content:space-between; align-items:flex-end; gap:24px;
    margin-bottom:48px; flex-wrap:wrap;
    position:relative; z-index:2;
  }
  .section-head h2{ font-family:var(--display); font-size:clamp(32px,4vw,48px); margin-top:16px; }
  .section-head .sub{ color:var(--off-dim); max-width:360px; font-size:14.5px; line-height:1.6; }

  .panel-grid{
    display:grid; grid-template-columns:repeat(4,1fr); gap:22px;
    perspective:900px;
    position:relative; z-index:2;
  }
  .related-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:22px;
    perspective:900px;
    position:relative; z-index:2;
  }
  @media (max-width:960px){
    .related-grid{ grid-template-columns:repeat(2,1fr); }
  }
  @media (max-width:560px){
    .related-grid{ grid-template-columns:1fr; }
  }
  .panel{
    background:var(--glass-bg);
    backdrop-filter:blur(var(--glass-blur));
    -webkit-backdrop-filter:blur(var(--glass-blur));
    border:1px solid var(--glass-border);
    border-radius:var(--neu-radius);
    box-shadow:0 10px 32px rgba(0,0,0,.3), inset 0 1px 1px rgba(255,255,255,.08);
    padding:26px 22px;
    min-height:168px;
    display:flex; flex-direction:column; justify-content:space-between;
    position:relative;
    transition:box-shadow .25s ease, transform .15s ease;
    transform-style:preserve-3d;
    will-change:transform;
    text-decoration:none;
    color:inherit;
  }
  .panel:hover{
    box-shadow:10px 10px 20px var(--neu-dark), -8px -8px 18px var(--neu-light), 0 0 22px rgba(0,168,232,.14);
  }
  .panel-clickable{ cursor:pointer; }
  .panel-clickable:focus-visible{ outline:2px solid var(--rev); outline-offset:3px; }
  .panel .panel-icon{
    width:42px; height:42px; border-radius:12px;
    background:var(--neu-bg); box-shadow:var(--neu-raised-sm);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:16px;
    color:var(--steel);
    transition:color .3s ease, box-shadow .3s ease;
  }
  .panel .panel-icon svg{ width:20px; height:20px; }

  .service-hero-icon{
    width:88px; height:88px; border-radius:22px;
    background:var(--neu-bg); box-shadow:var(--neu-raised);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:24px;
    color:var(--signal);
  }
  .service-hero-icon svg{ width:42px; height:42px; }
  .related-icon{ display:flex; align-items:center; justify-content:center; }

  .service-hero-photo{
    position:relative;
    border-radius:var(--neu-radius);
    overflow:hidden;
    min-height:480px;
    display:flex; align-items:flex-end;
    box-shadow:var(--neu-raised);
  }
  .service-hero-photo.is-fullscreen{
    border-radius:0;
    box-shadow:none;
    min-height:calc(100vh - 144px);
    width:100%;
  }
  .service-hero-photo.is-fullscreen .wrap{
    width:100%;
  }
  .service-hero-img{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; object-position:center 20%;
    transform:scale(1.08);
    will-change:transform;
  }
  .service-hero-img.ken-burns{
    animation:hero-ken-burns 22s ease-in-out infinite alternate;
  }
  @keyframes hero-ken-burns{
    0%{ transform:scale(1.08) translate(0, 0); }
    100%{ transform:scale(1.22) translate(-2.5%, -1.5%); }
  }
  @media (prefers-reduced-motion: reduce){
    .service-hero-img.ken-burns{ animation:none; }
  }
  .service-hero-scrim{
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(10,10,10,.2) 0%, rgba(10,10,10,.55) 55%, rgba(10,10,10,.88) 100%);
  }
  .service-hero-content{
    position:relative; z-index:2;
    padding:48px 44px;
    max-width:720px;
  }
  @media (max-width:560px){
    .service-hero-photo{ min-height:420px; }
    .service-hero-content{ padding:32px 24px; }
  }

  /* ---- Per-service icon motion graphics (hover preview, in place of real footage) ---- */
  .panel:hover .icon-seo, .motion-live .icon-seo{ animation:seo-scan 1.6s ease-in-out infinite; }
  @keyframes seo-scan{
    0%, 100%{ transform:rotate(0deg); }
    25%{ transform:rotate(-8deg); }
    75%{ transform:rotate(8deg); }
  }

  .pm-ping{ transform-origin:center; transform-box:fill-box; }
  .panel:hover .pm-ping, .motion-live .pm-ping{ animation:pm-radar-ping 1.4s ease-out infinite; }
  @keyframes pm-radar-ping{
    0%{ opacity:1; transform:scale(0.6); }
    100%{ opacity:0; transform:scale(1.25); }
  }

  .wd-dot{ transform-origin:center; transform-box:fill-box; }
  .panel:hover .wd-dot-1, .motion-live .wd-dot-1{ animation:wd-blink 1.2s ease-in-out infinite; }
  .panel:hover .wd-dot-2, .motion-live .wd-dot-2{ animation:wd-blink 1.2s ease-in-out infinite .3s; }
  @keyframes wd-blink{
    0%, 100%{ opacity:.3; transform:scale(1); }
    50%{ opacity:1; transform:scale(1.4); }
  }
  .wd-cursor{ opacity:0; }
  .panel:hover .wd-cursor, .motion-live .wd-cursor{ animation:wd-cursor-blink 1s step-end infinite; }
  @keyframes wd-cursor-blink{
    0%, 49%{ opacity:1; }
    50%, 100%{ opacity:0; }
  }

  .cr-line{ stroke-dasharray:5; stroke-dashoffset:0; }
  .panel:hover .cr-line, .motion-live .cr-line{ animation:cr-draw 1.1s ease-in-out infinite; }
  @keyframes cr-draw{
    0%{ stroke-dashoffset:5; }
    50%{ stroke-dashoffset:0; }
    100%{ stroke-dashoffset:-5; }
  }

  .mp-lens{ transform-origin:center; transform-box:fill-box; }
  .panel:hover .mp-lens, .motion-live .mp-lens{ animation:mp-shutter 1.3s ease-in-out infinite; }
  @keyframes mp-shutter{
    0%, 80%, 100%{ transform:scale(1); }
    88%{ transform:scale(0.55); }
  }

  .sc-dot{ transform-origin:center; transform-box:fill-box; opacity:.35; }
  .panel:hover .sc-dot-1, .motion-live .sc-dot-1{ animation:sc-type 1.2s ease-in-out infinite; }
  .panel:hover .sc-dot-2, .motion-live .sc-dot-2{ animation:sc-type 1.2s ease-in-out infinite .15s; }
  .panel:hover .sc-dot-3, .motion-live .sc-dot-3{ animation:sc-type 1.2s ease-in-out infinite .3s; }
  @keyframes sc-type{
    0%, 60%, 100%{ opacity:.35; transform:translateY(0); }
    30%{ opacity:1; transform:translateY(-1.5px); }
  }

  .cro-dot{ transform-origin:center; transform-box:fill-box; opacity:0; }
  .panel:hover .cro-dot-1, .motion-live .cro-dot-1{ animation:cro-flow 1.6s ease-in infinite; }
  .panel:hover .cro-dot-2, .motion-live .cro-dot-2{ animation:cro-flow 1.6s ease-in infinite .8s; }
  @keyframes cro-flow{
    0%{ opacity:0; transform:translateY(0); }
    10%{ opacity:1; }
    85%{ opacity:1; }
    100%{ opacity:0; transform:translateY(11px); }
  }

  @media (prefers-reduced-motion: reduce){
    .icon-seo, .pm-ping, .wd-dot, .wd-cursor, .cr-line, .mp-lens, .sc-dot, .cro-dot{
      animation:none !important;
    }
  }
  .panel:hover .panel-icon{ color:var(--signal); box-shadow:var(--neu-raised-sm), 0 0 10px rgba(0,168,232,.2); }
  .panel h3{ font-family:var(--body); font-weight:600; font-size:17px; }
  .panel span.tag{ font-family:var(--mono); font-size:10.5px; color:var(--off-dim); letter-spacing:.06em; text-transform:uppercase; }

  .panel.more{
    align-items:center; justify-content:center; text-align:center;
  }
  .panel.more h3{ color:var(--off-dim); font-weight:500; font-size:14px; }

  /* ================= SERVICE POPUP ================= */
  .service-modal{
    position:fixed; inset:0; z-index:200;
    display:flex; align-items:center; justify-content:center;
    padding:24px;
    opacity:0; pointer-events:none;
    transition:opacity .25s ease;
  }
  .service-modal.is-open{ opacity:1; pointer-events:auto; }
  .service-modal-backdrop{
    position:absolute; inset:0;
    background:rgba(10,10,15,.7);
    backdrop-filter:blur(6px);
  }
  .service-modal-panel{
    position:relative; z-index:1;
    width:100%; max-width:480px;
    background:rgba(29,31,41,.85);
    backdrop-filter:blur(var(--glass-blur));
    border:1px solid var(--glass-border);
    border-radius:12px;
    padding:40px 36px;
    box-shadow:0 20px 60px rgba(0,0,0,.5), inset 0 1px 1px rgba(255,255,255,.08);
    transform:translateY(16px) scale(.98);
    transition:transform .3s ease;
  }
  .service-modal.is-open .service-modal-panel{ transform:translateY(0) scale(1); }
  .service-modal-close{
    position:absolute; top:16px; right:16px;
    width:32px; height:32px; border-radius:8px;
    background:rgba(255,255,255,.06); border:1px solid var(--glass-border);
    color:var(--off); font-size:20px; line-height:1;
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background .2s ease;
  }
  .service-modal-close:hover{ background:rgba(255,255,255,.12); }
  .service-modal-tag{
    font-family:var(--mono); font-size:11px; color:var(--signal);
    letter-spacing:.08em; text-transform:uppercase; margin-bottom:10px;
  }
  .service-modal-title{
    font-family:var(--display); font-size:28px;
    margin:0 0 14px; color:var(--off);
  }
  .service-modal-desc{
    font-size:15px; line-height:1.6; color:var(--off-dim); margin-bottom:20px;
  }
  .service-modal-points{
    list-style:none; padding:0; margin:0 0 28px;
    display:flex; flex-direction:column; gap:10px;
  }
  .service-modal-points li{
    font-size:14px; color:var(--off-dim); padding-left:20px; position:relative;
  }
  .service-modal-points li::before{
    content:''; position:absolute; left:0; top:8px;
    width:6px; height:6px; border-radius:50%; background:var(--signal);
  }
  @media (max-width:560px){
    .service-modal-panel{ padding:32px 24px; }
  }

  /* ================= RESULTS DISCLAIMER ================= */
  .calc-disclaimer{ font-family:var(--mono); font-size:11px; color:var(--off-dim); opacity:.7; max-width:640px; margin:24px 0 32px; line-height:1.6; }

  /* ================= PROCESS ================= */
  .process{ padding:128px 0; position:relative; overflow:hidden; }
  .process-track{
    position:relative;
    display:grid; grid-template-columns:repeat(3,1fr); gap:0;
    margin-top:56px;
    z-index:2;
  }
  .process-track::before{
    content:"";
    position:absolute; top:15px; left:0; right:0; height:1px;
    background:repeating-linear-gradient(90deg, var(--steel) 0 8px, transparent 8px 16px);
  }
  .stage{ padding:0 28px 0 0; position:relative; }
  .stage:first-child{ padding-left:0; }
  .stage .tick{
    width:34px; height:34px; border-radius:50%; background:var(--neu-bg);
    box-shadow:var(--neu-raised-sm);
    border:none; display:flex; align-items:center; justify-content:center;
    margin-bottom:26px; position:relative; z-index:2;
    transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  }
  .stage .tick::before{
    content:""; width:8px; height:8px; border-radius:50%; background:var(--signal);
    transition:background .25s ease;
  }
  .stage:hover .tick{
    transform:scale(1.15);
    background:var(--signal);
    box-shadow:0 0 18px rgba(0,168,232,.7);
  }
  .stage:hover .tick::before{ background:var(--ink); }
  .stage h3{ font-family:var(--display); font-size:24px; margin-bottom:12px; letter-spacing:.01em; }
  .stage p{ color:var(--off-dim); font-size:14.5px; line-height:1.65; max-width:320px; }

  /* ================= RESULTS ================= */
  .results{ padding:128px 0; position:relative; overflow:hidden; }
  .results-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:40px; margin-top:56px; }
  .mini-gauge{ display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; }
  .mini-gauge .ring{
    position:relative; width:118px; height:118px;
    border-radius:50%;
    box-shadow:var(--neu-pressed-lg);
    transition:transform .3s ease;
  }
  .mini-gauge svg{ width:100%; height:100%; transform:rotate(-90deg); }
  .mini-gauge .bg{ fill:none; stroke:var(--steel-dim); stroke-width:8; }
  .mini-gauge .fg{
    fill:none; stroke:var(--rev); stroke-width:8; stroke-linecap:round;
    transition:filter .3s ease;
  }
  .mini-gauge .val{
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-family:var(--display); font-size:17px;
    transition:color .3s ease;
  }
  .mini-gauge .lbl{ font-family:var(--mono); font-size:11px; color:var(--off-dim); letter-spacing:.06em; text-transform:uppercase; max-width:150px; }
  .mini-gauge:hover .ring{ transform:scale(1.08); }
  .mini-gauge:hover .fg{ filter:drop-shadow(0 0 10px rgba(127,212,255,.7)); }
  .mini-gauge:hover .val{ color:var(--rev); }

  /* ================= FAQ ================= */
  .deliverables{ padding:128px 0; position:relative; }
  .deliverables .sub{ color:var(--off-dim); max-width:480px; font-size:14.5px; line-height:1.6; margin-top:14px; margin-bottom:8px; }
  .deliverables-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:22px;
    margin-top:40px;
  }
  .deliverables-grid .manifesto-card{ padding:28px 26px; }

  .faq{ padding:128px 0; position:relative; }
  .faq h2{ font-family:var(--display); font-size:clamp(32px,4vw,48px); margin-top:16px; margin-bottom:48px; }
  .faq-list{ display:flex; flex-direction:column; gap:14px; }
  .faq-item{
    background:var(--neu-bg);
    border-radius:var(--neu-radius-sm);
    box-shadow:var(--neu-raised-sm);
    padding:0 20px;
    transition:box-shadow .2s ease;
  }
  .faq-q{
    width:100%; display:flex; justify-content:space-between; align-items:center; gap:24px;
    padding:22px 0; text-align:left;
    font-family:var(--body); font-weight:500; font-size:17px; color:var(--off);
  }
  .faq-q:hover{ color:var(--signal); }
  .faq-icon{
    font-family:var(--mono); font-size:20px; color:var(--signal); flex-shrink:0;
    transition:transform .25s ease;
  }
  .faq-q[aria-expanded="true"] .faq-icon{ transform:rotate(45deg); }
  .faq-a{
    max-height:0; overflow:hidden;
    transition:max-height .32s ease;
  }
  .faq-a p{
    color:var(--off-dim); font-size:14.5px; line-height:1.7; padding:0 0 22px; max-width:640px;
  }

  /* ================= CTA ================= */
  .cta{
    padding:130px 0; text-align:center; position:relative; overflow:hidden;
    background-image:
      radial-gradient(ellipse 80% 70% at 50% 40%, rgba(20,26,40,1) 0%, rgba(8,10,16,1) 70%);
  }
  .cta-glow{
    position:absolute; top:50%; left:50%; width:900px; height:900px; transform:translate(-50%,-50%);
    background:radial-gradient(circle, rgba(0,168,232,.22) 0%, transparent 60%);
    pointer-events:none;
  }
  .cta h2{
    font-family:var(--display); font-size:clamp(38px,6vw,84px); line-height:.98;
    position:relative; z-index:2;
    color:#F5F3EE;
  }
  .cta h2 span{ color:var(--rev); }
  .cta p{ color:rgba(245,243,238,.72); max-width:480px; margin:22px auto 40px; font-size:16px; line-height:1.6; position:relative; z-index:2; }
  .cta .btn{
    font-size:14px; padding:16px 34px; position:relative; z-index:2;
    background:linear-gradient(145deg, #6BAAFF, #3E8EFF); color:#FFFFFF; font-weight:700;
    box-shadow:6px 6px 16px rgba(0,0,0,.55),
               -4px -4px 12px rgba(127,212,255,.25),
               inset 0 1px 1px rgba(255,255,255,.25);
  }
  .cta .btn::after{
    content:"";
    position:absolute; inset:-6px;
    border-radius:999px;
    background:rgba(127,212,255,.45);
    filter:blur(8px);
    z-index:-1;
    pointer-events:none;
    animation:cta-btn-glow-pulse 3.2s ease-in-out infinite;
  }
  @keyframes cta-btn-glow-pulse{
    0%, 100%{ transform:scale(1); opacity:.5; }
    50%{ transform:scale(1.18); opacity:.9; }
  }
  @media (prefers-reduced-motion: reduce){
    .cta .btn::after{ animation:none; }
  }
  .cta .btn:hover::after{ animation-play-state:paused; }
  .cta .btn:hover{
    background:linear-gradient(145deg, #9FE0FF, #7FD4FF); color:#0A0A0A;
    box-shadow:6px 6px 18px rgba(0,0,0,.55),
               -4px -4px 14px rgba(127,212,255,.3),
               inset 0 1px 1px rgba(255,255,255,.3);
  }

  /* ================= FOOTER ================= */
  footer{ border-top:1px solid var(--steel-dim); padding:56px 0 32px; }
  .foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; margin-bottom:56px; }
  .foot-logo{
    font-family:var(--wordmark); font-size:17px; font-weight:600; letter-spacing:.09em; margin-bottom:14px;
    display:flex; align-items:center; gap:10px;
  }
  .foot-grid p{ color:var(--off-dim); font-size:13.5px; line-height:1.6; max-width:280px; }
  .foot-col h4{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--off-dim); margin-bottom:16px; }
  .foot-col a{
    display:block; width:fit-content; position:relative;
    font-size:14px; color:var(--off); margin-bottom:10px; opacity:.85;
    transition:opacity .2s, transform .2s;
  }
  .foot-col a::after{
    content:"";
    position:absolute; left:0; right:100%; bottom:-2px; height:1px;
    background:var(--signal);
    transition:right .25s ease;
  }
  .foot-col a:hover{ opacity:1; color:var(--signal); transform:translateX(3px); }
  .foot-col a:hover::after{ right:0; }
  .foot-bottom{
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;
    font-family:var(--mono); font-size:11.5px; color:var(--off-dim); letter-spacing:.04em;
    border-top:1px solid var(--steel-dim); padding-top:24px;
  }

  /* ================= FLOATING UI ================= */
  .float-cta{
    position:fixed; right:28px; bottom:28px; z-index:90;
    display:flex; align-items:center; gap:10px;
    background:var(--signal); color:var(--ink);
    font-family:'Inter',sans-serif; font-size:14.5px; font-weight:500; letter-spacing:-.008em;
    padding:14px 20px;
    border-radius:var(--neu-radius-sm);
    box-shadow:0 8px 24px rgba(0,0,0,.4);
    opacity:0; transform:translateY(16px); pointer-events:none;
    transition:opacity .3s ease, transform .3s ease, background .2s;
  }
  .float-cta.visible{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .float-cta:hover{ background:var(--rev); }
  .float-cta .dot{
    width:7px; height:7px; border-radius:50%; background:var(--ink);
    animation: pulse 1.8s ease-in-out infinite;
  }
  .back-to-top{
    position:fixed; right:28px; bottom:88px; z-index:90;
    width:42px; height:42px;
    border:none; border-radius:50%;
    background:var(--neu-bg); color:var(--off);
    box-shadow:var(--neu-raised-sm);
    font-size:16px;
    display:flex; align-items:center; justify-content:center;
    opacity:0; transform:translateY(16px); pointer-events:none;
    transition:opacity .3s ease, transform .3s ease, color .2s;
  }
  .back-to-top.visible{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .back-to-top:hover{ color:var(--signal); }
  .back-to-top:active{ box-shadow:var(--neu-pressed); }

  /* ================= RESPONSIVE ================= */
  @media (max-width:1180px){
    .logo-tag{ display:none; }
  }
  @media (max-width:960px){
    body{ background-attachment:scroll; }
    .menu-toggle{ display:flex; }
    .nav{ height:66px; }
    .service-hero-photo.is-fullscreen{ min-height:calc(100vh - 132px); }
    nav.links{
      display:flex; flex-direction:column; gap:10px;
      position:fixed; top:66px; left:0; right:0;
      background:var(--neu-bg);
      border-radius:0 0 var(--neu-radius) var(--neu-radius);
      box-shadow:var(--neu-raised);
      padding:0 16px;
      max-height:0; overflow:hidden;
      transition:max-height .32s ease, padding .32s ease;
    }
    nav.links.open{ max-height:560px; padding:16px 16px 22px; }
    nav.links a{
      background:var(--neu-bg);
      border-radius:var(--neu-radius-sm);
      box-shadow:var(--neu-raised-sm);
      padding:15px 20px;
      font-size:13px;
      opacity:0; transform:translateY(8px);
      transition:opacity .3s ease, transform .3s ease, box-shadow .15s ease;
    }
    nav.links a:active{ box-shadow:var(--neu-pressed); }
    nav.links.open a{ opacity:1; transform:translateY(0); }
    nav.links.open a:nth-child(1){ transition-delay:.03s; }
    nav.links.open a:nth-child(2){ transition-delay:.07s; }
    nav.links.open a:nth-child(3){ transition-delay:.11s; }
    nav.links.open a:nth-child(4){ transition-delay:.15s; }
    nav.links.open a:nth-child(5){ transition-delay:.19s; }
    nav.links.open a:nth-child(6){ transition-delay:.23s; }
    nav.links.open a:nth-child(7){ transition-delay:.27s; }
    nav.links a.mobile-cta{
      display:flex; justify-content:center;
      background:linear-gradient(145deg, #6BAAFF, #3E8EFF); color:#FFFFFF;
      font-weight:700;
      box-shadow:5px 5px 11px rgba(30,80,180,.45),
                 -4px -4px 10px rgba(150,200,255,.5),
                 inset 0 1px 1px rgba(255,255,255,.25);
      margin-top:4px;
    }
    nav.links a.mobile-cta:active{
      box-shadow:inset 4px 4px 9px rgba(30,80,180,.55),
                 inset -3px -3px 7px rgba(150,200,255,.4);
    }
    .desktop-cta{ display:none; }
    .ticker-band{ top:66px; }
    main{ padding-top:82px; }
    .breadcrumb-nav{ padding-top:88px; }
    .manifesto-grid{ grid-template-columns:1fr; }
    .deliverables-grid{ grid-template-columns:1fr; }
    .ai-edge-inner{ grid-template-columns:1fr; gap:40px; padding:36px 26px; }
    .ai-edge-visual{ order:-1; min-height:200px; max-width:240px; margin:0 auto; }
    .panel-grid{ grid-template-columns:repeat(2,1fr); }
    .process-track{ grid-template-columns:1fr; gap:8px; }
    .process-track::before{ display:none; }
    .stage{ position:relative; padding-left:50px; padding-top:2px; }
    .stage:first-child{ padding-left:50px; }
    .stage::after{
      content:"";
      position:absolute; left:16px; top:34px; bottom:0; width:2px;
      background:repeating-linear-gradient(var(--steel) 0 6px, transparent 6px 12px);
    }
    .stage:last-child::after{ display:none; }
    .stage .tick{ position:absolute; left:0; top:0; margin-bottom:0; }
    .results-grid{ grid-template-columns:repeat(2,1fr); row-gap:40px; }
    .foot-grid{ grid-template-columns:1fr 1fr; }

    .hero{ padding:56px 0 64px; }
    .manifesto, .services, .process, .results, .faq, .deliverables, .ai-edge{ padding:64px 0; }
    .cta{ padding:80px 0; }
    .section-head{ margin-bottom:32px; }
    .manifesto-head{ margin-bottom:36px; }
  }
  @media (max-width:560px){
    .wrap{ padding:0 20px; }
    .logo{ font-size:16px; }
    .logo-mark-wrap{ width:36px; height:36px; }
    .panel-grid{ grid-template-columns:1fr; }
    .results-grid{ grid-template-columns:1fr; }
    .foot-grid{ grid-template-columns:1fr; }
    .process-track{ row-gap:36px; }
    .foot-bottom{ flex-direction:column; align-items:flex-start; }
    .float-cta{ right:16px; bottom:16px; padding:12px 16px; font-size:12.5px; }
    .back-to-top{ right:16px; bottom:70px; width:44px; height:44px; }
    .hero-badge{ font-size:11px; padding:8px 14px; }
    .hero h1{ font-size:clamp(38px, 11vw, 60px); }
    .hero .lede{ font-size:15.5px; }
    .hero-ctas{ gap:12px; }
    .hero-ctas .btn{ flex:1 1 auto; justify-content:center; text-align:center; }
    .panel, .manifesto-card, .faq-item{
      box-shadow:0 8px 24px rgba(0,0,0,.35), inset 0 1px 1px rgba(255,255,255,.08);
    }
  }

  /* ================= AUDIT OVERLAY ================= */
  .audit-overlay{
    position:fixed; inset:0; z-index:300;
    background:rgba(20,18,14,.55);
    backdrop-filter:blur(8px);
    display:flex; align-items:center; justify-content:center;
    padding:24px;
    opacity:0; pointer-events:none;
    transition:opacity .35s ease;
  }
  .audit-overlay.is-open{ opacity:1; pointer-events:auto; }
  .audit-shell{
    position:relative;
    width:100%; max-width:620px;
    max-height:92vh; overflow-y:auto;
    background:var(--neu-bg);
    border-radius:var(--neu-radius);
    box-shadow:12px 12px 40px rgba(0,0,0,.35), -8px -8px 24px rgba(255,255,255,.4);
    padding:48px 48px 36px;
    transform:translateY(24px) scale(.98);
    transition:transform .4s cubic-bezier(.22,1,.36,1);
  }
  .audit-overlay.is-open .audit-shell{ transform:translateY(0) scale(1); }
  .audit-close{
    position:absolute; top:18px; right:20px;
    width:38px; height:38px; border:none; border-radius:50%;
    background:var(--neu-bg); box-shadow:var(--neu-raised-sm);
    color:var(--off-dim); font-size:22px; line-height:1; cursor:pointer;
    transition:transform .2s ease, color .2s ease, box-shadow .15s ease;
  }
  .audit-close:hover{ color:var(--signal); transform:rotate(90deg); }
  .audit-close:active{ box-shadow:var(--neu-pressed); }

  .audit-progress-wrap{ display:flex; align-items:center; gap:14px; margin-bottom:32px; padding-right:44px; }
  .audit-progress-bar{
    flex:1; height:8px; border-radius:999px;
    background:var(--neu-bg);
    box-shadow:inset 2px 2px 4px var(--neu-dark), inset -1px -1px 2px var(--neu-light);
    overflow:hidden;
  }
  .audit-progress-fill{
    height:100%; width:20%; border-radius:999px;
    background:linear-gradient(90deg, var(--rev), var(--signal));
    box-shadow:0 0 8px rgba(0,168,232,.5);
    transition:width .4s cubic-bezier(.22,1,.36,1);
  }
  .audit-step-count{ font-family:var(--mono); font-size:11px; color:var(--off-dim); letter-spacing:.05em; white-space:nowrap; }

  .audit-step{ display:none; animation:audit-fade .4s ease; }
  .audit-step.is-active{ display:block; }
  .audit-done{ text-align:center; padding:12px 0; }
  .audit-done-mark{
    width:64px; height:64px; margin:0 auto 24px;
    display:flex; align-items:center; justify-content:center;
    font-size:30px; color:#fff;
    border-radius:50%;
    background:linear-gradient(145deg, #6BAAFF, #3E8EFF);
    box-shadow:5px 5px 12px var(--neu-dark), -4px -4px 10px var(--neu-light), inset 0 1px 2px rgba(255,255,255,.3);
  }
  .audit-error-mark{ background:linear-gradient(145deg, #6b6459, #4a453d); }
  .audit-done .btn, .audit-error .btn{ margin-top:24px; }
  .audit-nav .audit-submit.is-loading{ opacity:.7; pointer-events:none; }
  @keyframes audit-fade{ from{ opacity:0; transform:translateX(12px); } to{ opacity:1; transform:translateX(0); } }
  .audit-step h2{
    font-family:var(--display); font-weight:600;
    font-size:clamp(26px,4vw,38px); text-transform:uppercase; line-height:1.05;
    margin:12px 0 10px;
  }
  .audit-sub{ color:var(--off-dim); font-size:14.5px; line-height:1.6; margin-bottom:26px; max-width:460px; }

  .audit-field{ display:block; margin-bottom:18px; }
  .audit-field span{ display:block; font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--off-dim); margin-bottom:10px; }
  .audit-field span em{ font-style:normal; opacity:.6; text-transform:none; letter-spacing:0; }
  .audit-field input, .audit-field textarea, .audit-field select{
    width:100%; font-family:var(--body); font-size:15px; color:var(--off);
    background:var(--neu-bg);
    border:none; border-radius:var(--neu-radius-sm);
    box-shadow:inset 3px 3px 7px var(--neu-dark), inset -2px -2px 5px var(--neu-light);
    padding:14px 16px; resize:vertical;
    transition:box-shadow .2s ease;
  }
  .audit-field input:focus, .audit-field textarea:focus, .audit-field select:focus{
    outline:none;
    box-shadow:inset 3px 3px 7px var(--neu-dark), inset -2px -2px 5px var(--neu-light), 0 0 0 2px rgba(0,168,232,.35);
  }
  .audit-field input::placeholder, .audit-field textarea::placeholder{ color:var(--off-dim); opacity:.55; }
  .audit-field input.invalid, .audit-field textarea.invalid, .audit-field select.invalid{
    box-shadow:inset 3px 3px 7px var(--neu-dark), inset -2px -2px 5px var(--neu-light), 0 0 0 2px rgba(0,168,232,.7);
    animation:audit-field-shake .3s ease;
  }
  @keyframes audit-field-shake{
    0%, 100%{ transform:translateX(0); }
    25%{ transform:translateX(-4px); }
    75%{ transform:translateX(4px); }
  }
  @media (prefers-reduced-motion: reduce){
    .audit-field input.invalid, .audit-field textarea.invalid, .audit-field select.invalid{ animation:none; }
  }
  .audit-field.error input, .audit-field.error textarea, .audit-field.error select{
    box-shadow:inset 3px 3px 7px var(--neu-dark), inset -2px -2px 5px var(--neu-light), 0 0 0 2px rgba(0,168,232,.7);
  }

  .audit-currency-picker{
    display:flex; flex-direction:column; gap:8px;
    margin-bottom:20px; max-width:240px;
  }
  .audit-currency-picker span{
    font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase;
    color:var(--off-dim);
  }
  .audit-currency-picker select{
    width:100%; font-family:var(--body); font-size:15px; color:var(--off);
    background:var(--neu-bg);
    border:none; border-radius:var(--neu-radius-sm);
    box-shadow:inset 3px 3px 7px var(--neu-dark), inset -2px -2px 5px var(--neu-light);
    padding:12px 16px;
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B6459' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 14px center; background-size:16px;
    cursor:pointer;
  }
  .audit-currency-picker select:focus{
    outline:none;
    box-shadow:inset 3px 3px 7px var(--neu-dark), inset -2px -2px 5px var(--neu-light), 0 0 0 2px rgba(0,168,232,.35);
  }
  .audit-chips{ display:flex; flex-wrap:wrap; gap:12px; }
  .audit-chip{
    font-family:var(--body); font-size:14px; color:var(--off-dim);
    background:var(--neu-bg); border:none; border-radius:999px;
    box-shadow:var(--neu-raised-sm); padding:12px 20px; cursor:pointer;
    transition:transform .15s ease, color .2s ease, box-shadow .2s ease;
  }
  .audit-chip:hover{ transform:translateY(-2px); color:var(--off); }
  .audit-chip.selected{
    color:#fff;
    background:linear-gradient(145deg, #6BAAFF, #3E8EFF);
    box-shadow:4px 4px 8px rgba(30,80,180,.4), -3px -3px 7px rgba(150,200,255,.5), inset 0 1px 1px rgba(255,255,255,.25);
  }

  .audit-nav{ display:flex; gap:14px; margin-top:36px; align-items:center; }
  .audit-nav .audit-back{ margin-right:auto; }
  .audit-nav .btn{ cursor:pointer; }
  .audit-back[disabled]{ opacity:.35; pointer-events:none; }

  @media (max-width:560px){
    .audit-shell{ padding:40px 24px 28px; border-radius:20px; }
    .audit-nav{ flex-wrap:wrap; }
    .audit-nav .btn{ flex:1 1 auto; justify-content:center; text-align:center; }
    .audit-nav .audit-back{ margin-right:0; order:2; }
  }
  @media (prefers-reduced-motion: reduce){
    .audit-overlay, .audit-shell, .audit-step, .audit-progress-fill{ transition:none; animation:none; }
  }