/**
 * Raven product landing — monochromatic variant.
 * Linked from: index.html (site root)
 * Load after: assets/css/colors_and_type.css, assets/css/theme-monochrome.css
 */
*{box-sizing:border-box;margin:0;padding:0}
  html{--announce-snack-h:0px}
  html:has(.announce-snack):not(.announce-snack-off){
    --announce-snack-h:calc(36px + env(safe-area-inset-top, 0px));
  }
  html.announce-snack-off .announce-snack{display:none}
  html,body{background:#000;color:var(--gs-fg-1);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}

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

  /* Graylark breadcrumb in nav — parent-brand lockup */
  .raven-breadcrumb{
    display:inline-flex;align-items:center;gap:12px;
    text-decoration:none;
    transition:opacity 160ms ease;
  }
  .raven-breadcrumb:hover{opacity:0.82}
  .raven-breadcrumb-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.12em;
    color:rgba(255,255,255,0.55);
    transition:color 160ms ease;
  }
  .raven-breadcrumb:hover .raven-breadcrumb-k{color:#fff}
  .raven-breadcrumb-sep{
    color:rgba(255,255,255,0.22);font:400 12px/1 var(--font-mono);
  }
  /* ---- Page frame ------------------------------------------------------- */
  .page{
    max-width:1440px;margin:0 auto;
    position:relative;z-index:1;
    display:flow-root;
  }

  /* v2: full-viewport opener; video runs to top so sticky nav sits on the footage */
  .hero-opening{
    position:fixed;inset:0;z-index:0;
    pointer-events:none;overflow:hidden;
    background:#000;
    /* Framing controls for opener videos (tuned for portrait desktop clip). */
    --hero-eye-pos-y: 38%;
  }
  .hero-opening__video{
    position:absolute;inset:0;width:100%;height:100%;
    object-fit:cover;
    object-position:center 28%;
    background:#000;
  }
  .hero-opening__video--eye{
    z-index:0;
    object-position:center var(--hero-eye-pos-y);
  }
  /* Same treatment as .hero-bg so scroll “returns” to the default page look */
  .hero-opening__curtain{
    position:absolute;inset:0;
    opacity:var(--hero-opening-curtain, 0);
    will-change:opacity;
    background:
      radial-gradient(ellipse 60% 50% at 50% 10%, rgba(255,255,255,var(--halo-opacity,0.12)) 0%, rgba(0,0,0,0) 60%),
      radial-gradient(ellipse 80% 50% at 50% 95%, rgba(0,0,0,0.9) 50%, rgba(0,0,0,0) 100%),
      #000;
  }
  @media (max-width:700px){
    /* Mobile: no opener video — just the static hero on black */
    .hero-opening{
      display:none !important;
    }
  }
  /* Legibility over full-bleed opening video */
  .hero-inner > .eyebrow,
  .hero-inner > h1.hero-h1,
  .hero-inner > .hero-sub{
    text-shadow:0 2px 32px rgba(0,0,0,0.65);
  }
  @media (prefers-reduced-motion:reduce){
    .hero-opening__video{display:none}
  }

  /* ---- Nav (floating bar — inset from top + sides, not edge-to-edge) ---- */
  .nav{
    --nav-float-gap:calc(16px + env(safe-area-inset-top, 0px));
    position:sticky;
    top:calc(var(--nav-float-gap) + var(--announce-snack-h, 0px));
    z-index:50;
    isolation:isolate;
    display:flex;align-items:center;justify-content:space-between;
    margin:var(--nav-float-gap) max(20px, env(safe-area-inset-right, 0px)) 0 max(20px, env(safe-area-inset-left, 0px));
    padding:18px 40px;
    border-radius:14px;
    /* Opaque enough that display type and bright photography scrolling under
       the bar don't read through it and fight the nav links; the blur still
       carries the floating-glass look. */
    background:rgba(0,0,0,0.62);
    backdrop-filter:blur(26px) saturate(1.06);
    -webkit-backdrop-filter:blur(26px) saturate(1.06);
    border:1px solid rgba(255,255,255,0.08);
    box-shadow:0 18px 50px rgba(0,0,0,0.35);
    border-bottom-color:transparent;
    transition:border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
  }
  .nav-left{display:flex;align-items:center;gap:44px}
  .raven-mark{height:20px;width:auto;display:block}
  .raven-nav-lockup{height:26px;width:auto;display:block}
  .graylark-nav-lockup{
    height:22px;width:auto;display:block;
    mix-blend-mode:screen;
  }
  .nav-links{display:flex;gap:20px;font:500 13px/1 var(--font-sans);color:rgba(255,255,255,0.68);align-items:center}
  .nav-links > a,
  .nav-trigger{
    color:rgba(255,255,255,0.68);
    transition:color 120ms;
    background:transparent;border:none;padding:0;cursor:pointer;
    font:inherit;letter-spacing:inherit;
    display:inline-flex;align-items:center;gap:6px;
  }
  .nav-links > a:hover,
  .nav-trigger:hover{color:#fff}
  .nav-links > a.is-current{color:#fff}

  /* Scroll-spy active state */
  .nav-links > a.active,
  .nav-item.active > .nav-trigger{
    color:#fff;
  }
  .nav-links > a.active::after,
  .nav-item.active > .nav-trigger::after{
    content:"";display:inline-block;
    width:4px;height:4px;border-radius:50%;
    background:var(--gs-jade);
    box-shadow:0 0 6px rgba(24,81,255,0.8);
    margin-left:8px;
  }

  /* Dropdown */
  .nav-item{position:relative}
  .nav-chev{
    opacity:0.55;transform:translateY(0);transition:transform 160ms ease, opacity 120ms;
  }
  .nav-trigger:hover .nav-chev,
  .nav-item.open .nav-chev{opacity:1}
  .nav-item.open .nav-chev{transform:rotate(180deg)}

  .nav-menu{
    position:absolute;top:calc(100% + 14px);left:-18px;
    z-index:80;
    min-width:380px;
    padding:10px;
    border-radius:12px;
    /* Nearly solid so hero / page content does not show through and fight the type. */
    background:rgba(10,11,13,0.995);
    backdrop-filter:blur(10px) saturate(1.02);
    -webkit-backdrop-filter:blur(10px) saturate(1.02);
    border:1px solid rgba(255,255,255,0.1);
    box-shadow:
      0 24px 60px rgba(0,0,0,0.65),
      0 1px 0 rgba(255,255,255,0.05) inset;
    opacity:0;visibility:hidden;transform:translateY(-4px);
    transition:opacity 140ms ease, transform 140ms ease, visibility 140ms linear;
    pointer-events:none;
  }
  .nav-item.open .nav-menu,
  .nav-item:hover .nav-menu{
    opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;
  }
  /* bridge the gap between trigger and menu so hover doesn't drop */
  .nav-item::after{
    content:"";position:absolute;top:100%;left:0;right:0;height:14px;
  }

  .nav-menu-row{
    display:grid;grid-template-columns:36px 1fr;gap:12px;
    padding:12px 12px;border-radius:8px;
    color:rgba(255,255,255,0.92);
    transition:background 120ms, color 120ms;
    align-items:flex-start;
  }
  .nav-menu-row + .nav-menu-row{
    border-top:1px solid rgba(255,255,255,0.04);
  }
  .nav-menu-row:hover{
    background:rgba(24,81,255,0.06);
    color:#fff;
  }
  .nav-menu-glyph{
    width:36px;height:36px;border-radius:8px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,0.03);
    border:1px solid rgba(255,255,255,0.06);
    color:var(--gs-jade);
    transition:background 120ms, border-color 120ms;
  }
  .nav-menu-row:hover .nav-menu-glyph{
    background:rgba(24,81,255,0.1);
    border-color:rgba(24,81,255,0.28);
  }
  .nav-menu-k{
    display:flex;align-items:baseline;gap:10px;margin-bottom:3px;
  }
  .nav-menu-k b{
    font:500 14px/1 var(--font-sans);letter-spacing:-0.01em;color:#fff;font-weight:500;
  }
  .nav-menu-k span{
    font:500 9px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.48);
  }
  .nav-menu-d{
    font:400 12px/1.45 var(--font-sans);color:rgba(255,255,255,0.68);
    letter-spacing:-0.005em;
  }
  .nav-menu-row:hover .nav-menu-d{color:rgba(255,255,255,0.88)}

  .nav.scrolled{
    border-color:rgba(255,255,255,0.12);
    background:rgba(0,0,0,0.5);
    box-shadow:0 22px 55px rgba(0,0,0,0.45);
  }
  .nav-right{display:flex;align-items:center;gap:16px}

  /* Mobile hamburger — hidden by default, shown at ≤1080px */
  .nav-burger{
    display:none;
    width:44px;height:44px;padding:0;
    background:transparent;border:1px solid rgba(255,255,255,0.12);
    border-radius:6px;cursor:pointer;
    align-items:center;justify-content:center;
    color:rgba(255,255,255,0.85);
    transition:background 120ms, border-color 120ms;
  }
  .nav-burger:hover{background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.2)}
  .nav-burger svg{display:block}
  .nav-burger .burger-close{display:none}
  .nav-burger[aria-expanded="true"] .burger-open{display:none}
  .nav-burger[aria-expanded="true"] .burger-close{display:block}
  .nav-burger:focus-visible{
    outline:1px solid rgba(255,255,255,0.6);outline-offset:3px;
  }

  /* The open menu must not lock scroll with overflow:hidden on <html>: that
     removes the scroll container .nav is stuck to, so the bar and this drawer
     drop back to their static position at the top of the document and end up
     far above the viewport whenever the menu is opened mid-page. The drawer
     stays pinned to the sticky bar instead and contains its own overscroll so
     flicking it never chains into the page behind. */

  /* Mobile drawer: hangs from the floating bar; header stays the bar itself. */
  .nav-mobile-panel{
    display:none;
    position:absolute;top:100%;left:0;right:0;
    z-index:75;
    background:#050506;
    border:1px solid rgba(255,255,255,0.1);
    border-top:none;
    border-radius:0 0 14px 14px;
    padding:4px 24px calc(20px + env(safe-area-inset-bottom, 0px));
    flex-direction:column;
    max-height:calc(100dvh - var(--nav-float-gap) - var(--announce-snack-h, 0px) - 88px);
    overflow-x:hidden;overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .nav-mobile-panel.open{display:flex}
  .nav-mobile-list{display:flex;flex-direction:column;min-width:0}
  .nav-mobile-link,
  .nav-mobile-acc-btn{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    min-height:68px;width:100%;padding:0;
    font:500 24px/1.1 var(--font-sans);letter-spacing:-0.03em;color:#fff;
    background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,0.08);
    text-align:left;cursor:pointer;border-radius:0;
  }
  .nav-mobile-link.is-current,.nav-mobile-acc-btn.is-current{color:#fff}
  .nav-mobile-link:focus-visible,
  .nav-mobile-acc-btn:focus-visible,
  .nav-mobile-sub:focus-visible,
  .nav-mobile-ctas .btn:focus-visible{
    outline:1px solid rgba(255,255,255,0.6);outline-offset:3px;
  }
  .nav-mobile-acc{min-width:0}
  .nav-mobile-acc-chev{
    flex:0 0 auto;opacity:0.45;
    transition:transform 160ms ease, opacity 120ms ease;
  }
  .nav-mobile-acc-btn[aria-expanded="true"] .nav-mobile-acc-chev{
    opacity:1;transform:rotate(180deg);
  }
  .nav-mobile-acc-panel{
    display:grid;grid-template-rows:0fr;
    transition:grid-template-rows 180ms ease;
  }
  .nav-mobile-acc-btn[aria-expanded="true"] + .nav-mobile-acc-panel{
    grid-template-rows:1fr;
  }
  .nav-mobile-acc-inner{overflow:hidden;min-height:0}
  .nav-mobile-sub{
    display:flex;align-items:center;gap:10px;
    min-height:52px;padding:0 0 0 2px;
    font:500 16px/1.2 var(--font-sans);letter-spacing:-0.015em;
    color:rgba(255,255,255,0.72);
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .nav-mobile-sub.is-current{color:#fff}
  .nav-mobile-beta{
    display:inline-block;vertical-align:middle;margin-left:2px;
    font:500 9px/1 var(--font-mono);letter-spacing:0.16em;text-transform:uppercase;
    color:rgba(255,255,255,0.6);border:1px solid rgba(255,255,255,0.2);
    padding:4px 6px;border-radius:3px;
  }
  .nav-mobile-ctas{
    display:flex;flex-direction:column;gap:10px;
    margin-top:20px;padding-top:4px;flex-shrink:0;
  }
  .nav-mobile-ctas .btn{justify-content:center;padding:14px 18px;font-size:14px;width:100%}
  .nav:has(.nav-mobile-panel.open){
    border-bottom-left-radius:0;border-bottom-right-radius:0;
    border-bottom-color:rgba(255,255,255,0.1);
    background:#050506;
  }
  @media (min-width: 1081px){
    .nav-mobile-panel{display:none !important}
  }
  @media (prefers-reduced-motion: reduce){
    .nav-mobile-acc-chev,.nav-mobile-acc-panel{transition:none}
  }
  .btn{
    font:500 13px/1 var(--font-sans);
    padding:12px 20px;border-radius:3px;
    transition:background 120ms, border-color 120ms, color 120ms;
    display:inline-flex;align-items:center;gap:10px;
    cursor:pointer;border:none;
    letter-spacing:-0.005em;
  }
  .btn-ghost{background:transparent;color:rgba(255,255,255,0.75)}
  .btn-ghost:hover{color:#fff}
  .btn-primary{background:#fff;color:#0A0B0D;box-shadow:none}
  .btn-primary:hover{background:#fff;color:#000}
  .btn-outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,0.28)}
  .btn-outline:hover{border-color:rgba(255,255,255,0.6);background:rgba(255,255,255,0.03)}

  /* Dossier-variant: uppercase mono caps, hairline, tick-arrow */
  body[data-btn-style="dossier"] .btn{
    font:500 11px/1 var(--font-mono);
    text-transform:uppercase;
    letter-spacing:0.22em;
    padding:14px 22px;
    border-radius:2px;
  }
  body[data-btn-style="dossier"] .btn-primary{
    background:#fff;color:#0A0B0D;
  }
  body[data-btn-style="dossier"] .btn-outline,
  body[data-btn-style="dossier"] .btn-ghost{
    border:1px solid rgba(255,255,255,0.28);
    background:transparent;color:#fff;
  }
  body[data-btn-style="dossier"] .btn-ghost{border-color:transparent;color:rgba(255,255,255,0.55)}
  body[data-btn-style="dossier"] .btn-ghost:hover{color:#fff}

  /* ---- Hero ------------------------------------------------------------- */
  .hero{
    position:relative;
    padding:88px 44px 60px;
    text-align:center;
  }
  /* Atmosphere tied to ~first screen(s): full-section inset:0 stretches the halos when the hero
     includes a tall scroll-scrub track, so the gradient no longer matches Raven - Monochromatic.html. */
  .hero-bg{
    position:absolute;left:0;right:0;top:0;
    height:min(140vh, 1680px);
    height:min(140dvh, 1680px);
    pointer-events:none;
    z-index:0;
    background:
      radial-gradient(ellipse 60% 50% at 50% 10%, rgba(255,255,255,var(--halo-opacity,0.12)) 0%, rgba(0,0,0,0) 60%),
      radial-gradient(ellipse 80% 50% at 50% 95%, rgba(0,0,0,0.9) 50%, rgba(0,0,0,0) 100%);
  }
  .hero-inner{
    position:relative;z-index:2;
    padding:64px 0 0;
    max-width:1240px;margin:0 auto;
  }
  .eyebrow{
    display:inline-flex;align-items:center;gap:12px;margin-bottom:28px;
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:var(--gs-iris-soft);
    padding:8px 14px;border-radius:999px;
    background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.2);
  }
  .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--gs-iris);box-shadow:0 0 14px var(--gs-iris-wash)}
  h1.hero-h1{
    font:300 clamp(48px, 6vw, 92px)/1.00 var(--font-sans);
    letter-spacing:-0.04em;color:#fff;
    max-width:18ch;margin:0 auto;text-wrap:balance;
  }
  h1.hero-h1 em{font-style:normal;color:var(--gs-iris)}
  .hero-sub{
    margin:32px auto 0;max-width:62ch;
    font:300 22px/1.30 var(--font-serif);color:rgba(255,255,255,0.78);text-wrap:pretty;
    letter-spacing:0;
  }
  /* The homepage sub is long enough that `pretty` still strands "—without
     metadata." on a line of its own; balance evens the three lines instead. */
  .home-hero .hero-sub{text-wrap:balance}
  .hero-ctas{margin-top:40px;display:flex;gap:14px;flex-wrap:wrap;justify-content:center}

  .announce-snack{
    position:sticky;
    top:0;
    z-index:60;
    isolation:isolate;
    display:grid;
    grid-template-columns:1fr auto;
    align-items:center;
    min-height:calc(36px + env(safe-area-inset-top, 0px));
    padding:0 8px 0 16px;
    padding-top:env(safe-area-inset-top, 0px);
    background:rgba(0,0,0,0.72);
    backdrop-filter:blur(22px) saturate(1.08);
    -webkit-backdrop-filter:blur(22px) saturate(1.08);
    border-bottom:1px solid rgba(255,255,255,0.12);
    box-shadow:0 10px 28px rgba(0,0,0,0.32);
  }
  .announce-snack__link{
    grid-column:1 / -1;
    grid-row:1;
    justify-self:center;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-width:0;
    max-width:100%;
    padding:0 36px;
    font:500 13px/1.3 var(--font-sans);
    color:rgba(255,255,255,0.88);
    text-decoration:none;
  }
  .announce-snack__kicker{
    flex:none;
    font:500 10px/1 var(--font-mono);
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--gs-iris-soft);
    padding:4px 7px;
    border:1px solid rgba(177,169,255,0.28);
    border-radius:4px;
  }
  .announce-snack__text{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .announce-snack__narrow{display:none}
  .announce-snack__cta{
    flex:none;
    color:rgba(255,255,255,0.72);
    border-bottom:1px solid rgba(255,255,255,0.28);
    padding-bottom:1px;
    white-space:nowrap;
    transition:color 160ms ease, border-color 160ms ease;
  }
  .announce-snack__link:hover .announce-snack__cta,
  .announce-snack__link:focus-visible .announce-snack__cta{
    color:#fff;
    border-bottom-color:#1851FF;
  }
  .announce-snack__link:focus-visible{
    outline:1px solid rgba(255,255,255,0.55);
    outline-offset:4px;
  }
  .announce-snack__close{
    grid-column:2;
    grid-row:1;
    z-index:1;
    width:32px;height:32px;padding:0;
    display:inline-flex;align-items:center;justify-content:center;
    background:transparent;border:0;border-radius:6px;
    color:rgba(255,255,255,0.72);cursor:pointer;
    transition:color 140ms ease, background 140ms ease;
  }
  .announce-snack__close:hover,
  .announce-snack__close:focus-visible{
    color:#fff;
    background:rgba(255,255,255,0.06);
  }
  .announce-snack__close:focus-visible{
    outline:1px solid rgba(255,255,255,0.55);
    outline-offset:2px;
  }
  @media (max-width:700px){
    .announce-snack{padding-left:12px;padding-right:6px}
    .announce-snack__kicker,
    .announce-snack__cta,
    .announce-snack__wide{display:none}
    .announce-snack__narrow{display:inline}
    .announce-snack__link{font-size:12px}
  }

  .hero-scroll-hint{
    position:fixed;
    left:0;right:0;
    bottom:max(20px, calc(env(safe-area-inset-bottom, 0px) + 12px));
    width:max-content;max-width:min(36ch, calc(100vw - 32px));
    margin:0 auto;
    z-index:45;
    display:flex;flex-direction:column;align-items:center;gap:12px;
    text-align:center;text-decoration:none;color:inherit;
    cursor:pointer;
    transition:opacity 0.2s ease, transform 0.2s ease;
  }
  .hero-scroll-hint--hidden{
    opacity:0 !important;
    visibility:hidden;
    pointer-events:none;
    transition:opacity 0.35s ease, visibility 0.35s ease, transform 0.2s ease;
  }
  .hero-scroll-hint:hover{opacity:0.92;transform:translateY(2px)}
  .hero-scroll-hint.hero-scroll-hint--hidden:hover{transform:none}
  .hero-scroll-hint:focus-visible{
    outline:2px solid rgba(255,255,255,0.45);
    outline-offset:6px;border-radius:10px;
  }
  .hero-scroll-hint__label{
    font:500 11px/1.35 var(--font-mono);
    letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.58);
    text-shadow:0 2px 28px rgba(0,0,0,0.7);
  }
  .hero-scroll-hint__arrow{
    color:rgba(255,255,255,0.5);
    display:flex;align-items:center;justify-content:center;
    animation:heroScrollHintBounce 2.4s ease-in-out infinite;
  }
  @keyframes heroScrollHintBounce{
    0%,100%{transform:translateY(0);opacity:0.55}
    50%{transform:translateY(7px);opacity:1}
  }
  @media (prefers-reduced-motion:reduce){
    .hero-scroll-hint__arrow{animation:none;opacity:0.75}
  }

  @keyframes hero-headline-fade{
    from{opacity:0;transform:translateY(0.7rem)}
    to{opacity:1;transform:translateY(0)}
  }
  @keyframes hero-scroll-hint-fade{
    from{opacity:0}
    to{opacity:1}
  }
  .hero-inner > .eyebrow,
  .hero-inner > h1.hero-h1,
  .hero-inner > .hero-sub,
  .hero-inner > .hero-ctas{
    opacity:0;
    animation:hero-headline-fade 0.95s cubic-bezier(0.2,0.75,0.2,1) forwards;
  }
  .hero-inner > .eyebrow{animation-delay:0.12s}
  .hero-inner > h1.hero-h1{animation-delay:0.2s}
  .hero-inner > .hero-sub{animation-delay:0.36s}
  .hero-inner > .hero-ctas{animation-delay:0.5s}
  .hero-inner > .hero-scroll-hint{
    opacity:0;
    animation:hero-scroll-hint-fade 0.9s cubic-bezier(0.2,0.75,0.2,1) forwards;
    animation-delay:0.74s;
  }
  @media (prefers-reduced-motion:reduce){
    .hero-inner > .eyebrow,
    .hero-inner > h1.hero-h1,
    .hero-inner > .hero-sub,
    .hero-inner > .hero-ctas{
      opacity:1;transform:none;animation:none;
    }
    .hero-inner > .hero-scroll-hint{
      opacity:1;animation:none;
    }
  }
  @media (max-width:700px){
    .hero-scroll-hint,
    .hero-inner > .hero-scroll-hint{
      display:none !important;
      visibility:hidden !important;
      pointer-events:none !important;
      animation:none !important;
    }
  }

  .hero-meta{
    position:relative;z-index:1;
    margin:80px auto 0;
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    max-width:960px;
    align-items:stretch;
  }
  .hero-meta .kpi{
    position:relative;
    padding:6px 28px;
    display:flex;flex-direction:column;align-items:center;text-align:center;
    gap:10px;
  }
  .hero-meta .kpi + .kpi::before{
    content:"";position:absolute;left:0;top:14%;bottom:14%;
    width:1px;
    background:linear-gradient(180deg, transparent, rgba(255,255,255,0.14) 30%, rgba(255,255,255,0.14) 70%, transparent);
  }
  .hero-meta .kpi-eyebrow{
    font:500 10px/1 var(--font-mono);letter-spacing:0.26em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
    display:inline-flex;align-items:center;gap:8px;
  }
  .hero-meta .kpi-eyebrow::before{
    content:"";width:5px;height:5px;border-radius:50%;
    background:var(--gs-jade);box-shadow:0 0 8px rgba(24,81,255,0.75);
    animation:pulse 2s ease-in-out infinite;
  }
  .hero-meta b{
    display:flex;align-items:baseline;justify-content:center;gap:10px;
    color:#fff;font-weight:500;
    letter-spacing:-0.03em;
    font-variant-numeric:tabular-nums;
    min-height:1.04em;
    margin:0;
    line-height:1;
    white-space:nowrap;
  }
  .hero-meta .kpi-n{
    font:300 clamp(44px, 5.6vw, 68px)/1.00 var(--font-sans);
    letter-spacing:-0.04em;
    background:linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,0.78) 100%);
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;
    text-shadow:0 0 40px rgba(24,81,255,0.06);
  }
  .hero-meta .kpi-u{
    font:500 clamp(14px, 1.4vw, 18px)/1 var(--font-sans);
    letter-spacing:0.01em;
    color:rgba(255,255,255,0.55);
    text-transform:lowercase;
  }
  .hero-meta .kpi-cap{
    font:400 13px/1.4 var(--font-sans);
    color:rgba(255,255,255,0.55);
    letter-spacing:-0.005em;
    max-width:180px;
  }
  .hero-meta .kpi-cap em{
    font-style:normal;color:rgba(255,255,255,0.85);
  }
  @media (max-width: 780px){
    .hero-meta{grid-template-columns:1fr;max-width:320px;gap:28px}
    .hero-meta .kpi + .kpi::before{
      left:20%;right:20%;top:0;bottom:auto;width:auto;height:1px;
      background:linear-gradient(90deg, transparent, rgba(255,255,255,0.14), transparent);
    }
  }

  /* Hero: scroll-scrubbed map video (same pattern as dist2) */
  .hero-scrub-stage-stack{
    display:flex;flex-direction:column;align-items:center;width:100%;
    gap:clamp(0px, calc(26px * (1 - var(--hero-scrub-expand, 0) * 1.05)), clamp(14px, 2.4vw, 26px));
  }
  .hero-scrub-stage-copy__title,
  .hero-scrub-stage-copy__sub{
    display:none;
    margin:0;
    text-align:center;
  }
  .hero-scrub-track{
    margin:148px auto 0;
    scroll-margin-top:calc(120px + env(safe-area-inset-top, 0px));
  }
  .hero-scrub-track.is-scrub-enabled{
    --hero-scrub-expand:0;
    /* 100dvh tracks the *visible* viewport on mobile (toolbar-safe); 100vh fallback */
    height:calc(var(--hero-scrub-vh, 2.4) * 100vh);
    height:calc(var(--hero-scrub-vh, 2.4) * 100dvh);
    width:100vw;
    max-width:none;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
  .hero-scrub-sticky{
    position:relative;
    top:auto;
  }
  .hero-scrub-track.is-scrub-enabled .hero-scrub-sticky{
    position:sticky;
    top:0;
  }
  /* Desktop: vertically center the frame in the viewport while scrubbing */
  @media (min-width: 701px){
    .hero-scrub-track.is-scrub-enabled .hero-scrub-sticky{
      min-height:100vh;
      min-height:100dvh;
      display:flex;
      flex-direction:column;
      justify-content:center;
      align-items:stretch;
      box-sizing:border-box;
      /* Used by .hero-shot min-height so the expanded frame fits the padded sticky viewport */
      --hero-scrub-sticky-pad-y:calc(
        max(24px, env(safe-area-inset-top, 0px)) +
        min(3.5vh, 44px) * var(--hero-scrub-expand, 0) +
        max(32px, env(safe-area-inset-bottom, 0px))
      );
      padding:
        calc(max(24px, env(safe-area-inset-top)) + min(3.5vh, 44px) * var(--hero-scrub-expand, 0))
        calc(max(20px, env(safe-area-inset-right)) + 72px * (1 - var(--hero-scrub-expand, 0)))
        max(32px, env(safe-area-inset-bottom))
        calc(max(20px, env(safe-area-inset-left)) + 72px * (1 - var(--hero-scrub-expand, 0)));
    }
    /* Above/below copy — hero headline scale, fades as frame expands */
    .hero-scrub-track.is-scrub-enabled .hero-scrub-stage-copy__title,
    .hero-scrub-track.is-scrub-enabled .hero-scrub-stage-copy__sub{
      display:block;
      width:100%;
      max-width:min(1240px, 100%);
      padding:0 max(16px, env(safe-area-inset-left, 0px)) 0 max(16px, env(safe-area-inset-right, 0px));
      box-sizing:border-box;
      opacity:clamp(0, calc(1 - 1.1 * var(--hero-scrub-expand, 0)), 1);
      overflow:hidden;
      transition:opacity 0.14s linear, max-height 0.22s ease;
      pointer-events:none;
    }
    /* Copy scales from small → hero size in the first ~⅓ of expand, then holds while fading */
    .hero-scrub-track.is-scrub-enabled .hero-scrub-stage-copy__title{
      font-weight:300;
      font-size:calc(
        clamp(48px, 6vw, 92px) *
        (0.34 + 0.66 * min(1, var(--hero-scrub-expand, 0) * 2.75))
      );
      line-height:1.00;
      font-family:var(--font-sans);
      letter-spacing:-0.04em;
      text-transform:uppercase;
      color:#fff;
      text-wrap:balance;
      text-shadow:0 2px 40px rgba(0,0,0,0.75);
      /* Collapse layout when faded so the frame can use the full sticky viewport */
      max-height:clamp(0px, calc((1 - var(--hero-scrub-expand, 0) * 1.08) * 18rem), 18rem);
    }
    .hero-scrub-track.is-scrub-enabled .hero-scrub-stage-copy__sub{
      font-weight:300;
      font-size:calc(
        clamp(17px, 2.1vw, 22px) *
        (0.58 + 0.42 * min(1, var(--hero-scrub-expand, 0) * 2.75))
      );
      line-height:1.35;
      font-family:var(--font-serif);
      letter-spacing:0;
      color:rgba(255,255,255,0.78);
      max-width:62ch;
      text-wrap:pretty;
      text-shadow:0 2px 32px rgba(0,0,0,0.7);
      max-height:clamp(0px, calc((1 - var(--hero-scrub-expand, 0) * 1.08) * 10rem), 10rem);
    }
    /* Inset stage → full-bleed viewport-height frame as scrub progresses */
    .hero-scrub-track.is-scrub-enabled .hero-scrub-sticky .hero-shot{
      position:relative;
      width:100%;
      max-width:calc(688px * (1 - var(--hero-scrub-expand, 0)) + 100% * var(--hero-scrub-expand, 0));
      /* Use full sticky column height (safe areas + expand nudge only) — no progress UI reserve */
      min-height:calc(
        220px +
        max(
          0px,
          100dvh - 220px - var(--hero-scrub-sticky-pad-y, 56px)
        ) * var(--hero-scrub-expand, 0)
      );
      margin-left:auto;
      margin-right:auto;
      border-radius:calc(22px * (1 - var(--hero-scrub-expand, 0)));
      transform:perspective(2400px) rotateX(calc(2.6deg * (1 - var(--hero-scrub-expand, 0)))) scale(calc(0.91 + 0.09 * var(--hero-scrub-expand, 0)));
      transform-origin:center center;
      box-shadow:
        0 calc(28px + 32px * (1 - var(--hero-scrub-expand, 0))) calc(56px + 64px * (1 - var(--hero-scrub-expand, 0))) rgba(0,0,0,0.72),
        0 calc(14px + 16px * (1 - var(--hero-scrub-expand, 0))) calc(28px + 22px * (1 - var(--hero-scrub-expand, 0))) rgba(0,0,0,0.48),
        0 0 0 1px rgba(255,255,255,0.15);
    }
    .hero-scrub-track.is-scrub-enabled.is-scrub-ready .hero-scrub-sticky .hero-scrub-video{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:var(--hero-scrub-video-fit, cover);
      object-position:center;
    }
    .hero-scrub-track.is-scrub-enabled.is-scrub-ready .hero-scrub-sticky .hero-scrub-fallback{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:var(--hero-scrub-video-fit, cover);
      object-position:center;
    }
  }
  @media (prefers-reduced-motion: reduce){
    .hero-scrub-track.is-scrub-enabled{
      height:auto !important;
      --hero-scrub-expand:1;
    }
    .hero-scrub-track .hero-scrub-sticky{
      position:relative !important;
      top:auto !important;
      min-height:0 !important;
      display:block !important;
      padding:0 !important;
    }
    .hero-scrub-video{display:none !important}
    .hero-scrub-fallback{display:block !important;width:100%}
    .hero-scrub-stage-copy__title,
    .hero-scrub-stage-copy__sub{display:none !important}
  }
  .hero-shot{
    position:relative;
    margin:0 auto;max-width:1240px;
    border-radius:20px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.12);
    box-shadow:
      0 60px 120px rgba(0,0,0,0.7),
      0 30px 50px rgba(0,0,0,0.5),
      0 0 0 1px rgba(255,255,255,0.15);
    background:#000;
    transform:perspective(2400px) rotateX(2deg);
    transform-origin:center top;
  }
  .hero-scrub-track:not(.is-scrub-enabled) .hero-shot{
    margin-top:0;
  }
  .hero-scrub-video{
    width:100%;
    height:auto;
    display:none;
    vertical-align:top;
    pointer-events:none;
    object-fit:contain;
    background:#000;
  }
  .hero-scrub-track.is-scrub-ready .hero-scrub-video{display:block}
  .hero-scrub-track.is-scrub-ready .hero-scrub-fallback{display:none}
  .hero-shot .hero-scrub-fallback{
    width:100%;
    display:block;
    vertical-align:top;
  }

  /* ---- Band / section --------------------------------------------------- */
  .section{padding:120px 44px;position:relative}
  .section-eyebrow{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:var(--gs-iris-soft);margin-bottom:20px;
    display:flex;align-items:center;gap:10px;
  }
  .section-eyebrow .bar{width:40px;height:1px;background:rgba(255,255,255,0.2)}
  .section-h{
    font:300 clamp(36px, 4.4vw, 60px)/1.00 var(--font-sans);
    letter-spacing:-0.04em;color:#fff;max-width:22ch;text-wrap:balance;
  }
  .section-sub{
    margin-top:20px;max-width:62ch;
    font:300 20px/1.30 var(--font-serif);color:rgba(255,255,255,0.74);text-wrap:pretty;
    letter-spacing:0;
  }

  /* ---- Product demonstration (16:9 video) ------------------------------- */
  .demo-video{
    margin:48px auto 0;
    max-width:1240px;
  }
  .demo-video-frame{
    position:relative;
    border-radius:20px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:#000;
    box-shadow:
      0 40px 100px rgba(0,0,0,0.55),
      0 0 0 1px rgba(255,255,255,0.06);
  }
  .demo-video-el{
    display:block;width:100%;height:auto;
    aspect-ratio:16/9;
    object-fit:cover;
    background:#000;
    border-radius:inherit;
  }
  /* Big custom play button overlay */
  .demo-video-play{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    z-index:3;display:flex;align-items:center;justify-content:center;
    width:110px;height:110px;border-radius:50%;cursor:pointer;
    border:1px solid rgba(255,255,255,0.35);
    background:rgba(10,10,10,0.45);
    -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
    box-shadow:0 12px 40px rgba(0,0,0,0.5);
    transition:transform .22s ease,background .22s ease,border-color .22s ease,opacity .25s ease;
  }
  .demo-video-play svg{
    width:46px;height:46px;margin-left:5px;
    fill:rgba(255,255,255,0.92);
  }
  .demo-video-play:hover{
    transform:translate(-50%,-50%) scale(1.06);
    background:rgba(20,20,20,0.6);
    border-color:rgba(255,255,255,0.6);
  }
  .demo-video-play:focus-visible{
    outline:2px solid rgba(255,255,255,0.7);outline-offset:3px;
  }
  .demo-video-play.is-hidden{
    opacity:0;pointer-events:none;
  }
  /* Corner ticks — same dossier framing language as .vit-stage */
  .demo-video-tick{
    position:absolute;width:14px;height:14px;pointer-events:none;z-index:2;
    border-color:rgba(255,255,255,0.32);border-style:solid;border-width:0;
  }
  .demo-video-tick.tl{top:12px;left:12px;border-top-width:1px;border-left-width:1px}
  .demo-video-tick.tr{top:12px;right:12px;border-top-width:1px;border-right-width:1px}
  .demo-video-tick.bl{bottom:12px;left:12px;border-bottom-width:1px;border-left-width:1px}
  .demo-video-tick.br{bottom:12px;right:12px;border-bottom-width:1px;border-right-width:1px}
  .demo-video-cap{
    display:flex;align-items:center;gap:10px;
    margin-top:18px;
    font:500 11px/1.4 var(--font-mono);letter-spacing:0.14em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
  }
  .demo-video-cap-dot{
    width:6px;height:6px;border-radius:50%;flex:0 0 auto;
    background:rgba(255,255,255,0.4);
  }

  /* ---- Modes stack (case-study vocabulary) ------------------------------ */
  .modes{
    margin-top:56px;display:flex;flex-direction:column;gap:12px;
  }
  .mode{
    position:relative;
    background:var(--gs-chrome);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:14px;
    display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:stretch;
    padding:0;
    overflow:hidden;
    transition:border-color 160ms, transform 160ms;
  }
  .mode:hover{border-color:rgba(255,255,255,0.18);transform:translateY(-1px)}
  .mode-num{
    display:flex;align-items:center;justify-content:center;
    width:96px;
    border-right:1px solid rgba(255,255,255,0.06);
    font:500 11px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.38);
    writing-mode:vertical-rl;transform:rotate(180deg);
    padding:22px 0;
  }
  .mode-body{padding:26px 0;display:flex;flex-direction:column;gap:10px;min-width:0}
  .mode-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.38);
  }
  .mode-title{font:500 24px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.015em;text-wrap:balance}
  .mode-desc{font:300 17px/1.30 var(--font-serif);color:rgba(255,255,255,0.68);max-width:62ch;text-wrap:pretty;letter-spacing:0}
  .mode-foot{
    display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;
    padding:22px 26px 22px 0;gap:14px;
    border-left:1px solid rgba(255,255,255,0.06);
    padding-left:26px;
    min-width:180px;
  }
  .mode-status{
    padding:6px 10px;border-radius:4px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
  }
  .mode-status.highest{background:var(--gs-iris-bg);color:var(--gs-iris-fg);border:1px solid var(--gs-iris)}
  .mode-status.live{background:rgba(24,81,255,0.14);color:var(--gs-jade);border:1px solid rgba(24,81,255,0.4)}
  .mode-status.new{background:rgba(255,255,255,0.14);color:var(--gs-amber);border:1px solid rgba(255,255,255,0.4)}
  .mode-engine{
    font:400 11px/1.4 var(--font-mono);letter-spacing:0.14em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);text-align:right;
  }
  .mode-engine b{display:block;color:#fff;font-weight:500;margin-bottom:4px;letter-spacing:0.14em}

  /* ---- Case management section ----------------------------------------- */
  .case-hero{
    margin-top:56px;position:relative;border-radius:20px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);background:#000;
    box-shadow:0 40px 100px rgba(0,0,0,0.55), 0 0 0 1px rgba(24,81,255,0.08);
  }
  .case-hero img{display:block;width:100%;height:auto}
  .case-hero-scrim{
    position:absolute;inset:auto 0 0 0;height:60%;pointer-events:none;
    background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.88) 100%);
  }
  .case-hero-meta{
    position:absolute;left:28px;bottom:26px;right:28px;
    display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;
  }
  .case-hero-title{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:var(--gs-jade);margin-bottom:10px;display:flex;align-items:center;gap:8px;
  }
  .case-hero-title::before{
    content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
    background:var(--gs-jade);box-shadow:0 0 10px rgba(24,81,255,0.7);
  }
  .case-hero-name{font:500 22px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.01em}
  .case-hero-kpis{display:flex;gap:28px;flex-wrap:wrap}
  .case-hero-kpi{font:400 12px/1.35 var(--font-mono);color:rgba(255,255,255,0.55);letter-spacing:0.08em;white-space:nowrap}
  .case-hero-kpi b{display:block;font:500 18px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.01em;margin-bottom:4px;font-family:var(--font-sans)}

  .case-strip{
    margin-top:20px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;
  }
  .case-card{
    position:relative;border-radius:14px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);background:var(--gs-chrome);
    display:flex;flex-direction:column;
  }
  .case-card-shot{
    position:relative;aspect-ratio:5/4;overflow:hidden;background:#1a1c22;
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .case-card-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
  .case-card-body{padding:20px 22px;display:flex;flex-direction:column;gap:8px}
  .case-card-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
  }
  .case-card-h{font:500 17px/1.3 var(--font-sans);color:#fff;letter-spacing:-0.01em}
  .case-card-p{font:400 14px/1.5 var(--font-sans);color:rgba(255,255,255,0.6)}

  /* ---- Identify Car section -------------------------------------------- */
  .carid{
    margin-top:56px;display:grid;grid-template-columns:1fr 1fr;gap:24px;
  }
  .carid-card{
    border-radius:16px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    background:var(--gs-chrome);
    display:flex;flex-direction:column;
  }
  .carid-shot{
    position:relative;aspect-ratio:1000/560;background:#000;
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .carid-shot img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
  .carid-badge{
    position:absolute;top:14px;left:14px;
    display:flex;align-items:center;gap:8px;
    padding:6px 10px;border-radius:4px;
    background:rgba(8,8,10,0.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(24,81,255,0.35);
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:var(--gs-jade);
  }
  .carid-badge::before{
    content:"";width:7px;height:7px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.7);
  }
  .carid-caption{
    padding:22px 24px;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;
  }
  .carid-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);margin-bottom:6px;
  }
  .carid-v{font:500 16px/1.25 var(--font-sans);color:#fff;letter-spacing:-0.01em}
  .carid-match{
    display:flex;flex-direction:column;align-items:flex-end;gap:4px;
  }
  .carid-match b{
    font:500 26px/1 var(--font-sans);color:var(--gs-jade);letter-spacing:-0.02em;
  }
  .carid-match span{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
  }
  .carid-divider{width:1px;align-self:stretch;background:rgba(255,255,255,0.08)}

  /* ---- Geoestimation section ------------------------------------------- */
  .geoest{
    margin-top:56px;display:grid;grid-template-columns:minmax(280px,400px) 1fr;gap:0;
    border-radius:16px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:var(--gs-chrome);
    box-shadow:0 40px 90px rgba(0,0,0,0.5);
  }
  .geoest-input{
    position:relative;background:#000;min-height:560px;
    border-right:1px solid rgba(255,255,255,0.08);
  }
  .geoest-input img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
  .geoest-input-caption{
    position:absolute;left:18px;right:18px;bottom:18px;
    padding:14px 16px;border-radius:8px;
    background:rgba(8,8,10,0.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,0.08);
  }
  .geoest-input-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);margin-bottom:6px;
  }
  .geoest-input-v{font:500 14px/1.35 var(--font-sans);color:#fff;letter-spacing:-0.005em}
  .geoest-badge{
    position:absolute;top:16px;left:16px;
    display:flex;align-items:center;gap:8px;
    padding:7px 12px;border-radius:5px;
    background:rgba(8,8,10,0.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.2);
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.85);
  }
  .geoest-badge.live{border-color:rgba(24,81,255,0.4);color:var(--gs-jade)}
  .geoest-badge.live::before{
    content:"";width:7px;height:7px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.7);
  }
  .geoest-arrow{
    position:absolute;top:50%;right:-20px;z-index:2;
    width:40px;height:40px;border-radius:50%;
    background:var(--gs-ink);border:1px solid rgba(255,255,255,0.12);
    display:flex;align-items:center;justify-content:center;
    transform:translateY(-50%);
    color:var(--gs-jade);font:500 18px/1 var(--font-mono);
  }
  .geoest-result{
    position:relative;background:#000;display:flex;flex-direction:column;
  }
  .geoest-result-shot{position:relative;flex:1;min-height:320px}
  .geoest-result-shot img{
    position:absolute;inset:0;width:100%;height:100%;
    object-fit:cover;object-position:left center;display:block;
  }
  .geoest-result-meta{
    display:grid;grid-template-columns:auto 1fr auto auto;gap:22px;align-items:center;
    padding:22px 26px;border-top:1px solid rgba(255,255,255,0.08);
  }
  .geoest-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);margin-bottom:6px;
  }
  .geoest-v{font:500 17px/1.25 var(--font-sans);color:#fff;letter-spacing:-0.01em}
  .geoest-coord{font:500 12px/1.3 var(--font-mono);color:rgba(255,255,255,0.55);letter-spacing:0.04em}
  .geoest-result-divider{width:1px;align-self:stretch;background:rgba(255,255,255,0.08)}
  .geoest-match b{
    display:block;font:500 30px/1 var(--font-sans);color:var(--gs-jade);letter-spacing:-0.02em;
  }
  .geoest-match span{
    display:block;margin-top:6px;font:500 10px/1 var(--font-mono);letter-spacing:0.2em;
    text-transform:uppercase;color:rgba(255,255,255,0.4);
  }

  /* ---- Vertical model section (input → analyze → output) -------------- */
  .vmodel{margin-top:56px;display:flex;flex-direction:column;align-items:center}

  /* Top triptych: input + horizontal connector + ascii */
  .vmodel-triptych{
    width:100%;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:stretch;
    gap:0;
    max-width:1100px;
  }

  .vmodel-input{
    border-radius:14px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:var(--gs-chrome);
    box-shadow:0 20px 50px rgba(0,0,0,0.4);
    display:flex;flex-direction:column;
  }
  .vmodel-input-head{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:12px 16px 10px;
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .vmodel-input-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.5);
  }
  .vmodel-input-badge{
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
    padding:4px 8px;border-radius:4px;
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(255,255,255,0.08);
    white-space:nowrap;
  }
  .vmodel-input-photo{
    position:relative;width:100%;background:#000;flex:1;
    display:flex;align-items:center;justify-content:center;
    min-height:0;
  }
  .vmodel-input-photo img{width:100%;height:100%;object-fit:cover;display:block}
  .vmodel-input-caption{
    padding:12px 16px;
    font:400 12px/1.4 var(--font-sans);color:rgba(255,255,255,0.6);text-wrap:pretty;
    border-top:1px solid rgba(255,255,255,0.06);
  }

  /* Horizontal analyze connector */
  .vmodel-analyze{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    padding:0 32px;
    min-width:260px;position:relative;
  }
  .vmodel-analyze-line{
    position:relative;
    width:100%;height:1px;
    background:linear-gradient(to right,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0.25) 20%,
      rgba(24,81,255,0.7) 50%,
      rgba(255,255,255,0.25) 80%,
      rgba(255,255,255,0) 100%);
  }
  .vmodel-analyze-line::after{
    content:"";
    position:absolute;right:4px;top:50%;transform:translateY(-50%);
    width:0;height:0;
    border-left:7px solid rgba(255,255,255,0.55);
    border-top:5px solid transparent;border-bottom:5px solid transparent;
  }
  .vmodel-analyze-text{
    margin-top:14px;text-align:center;
  }
  .vmodel-analyze-label{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.85);
    display:flex;align-items:center;justify-content:center;gap:8px;
  }
  .vmodel-analyze-label::before{
    content:"";width:6px;height:6px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.6);
    animation:vmodelPulse 1.6s ease-in-out infinite;
  }
  @keyframes vmodelPulse{
    0%,100%{opacity:0.5;transform:scale(0.9)}
    50%{opacity:1;transform:scale(1.15)}
  }
  .vmodel-analyze-sub{
    margin-top:8px;
    font:400 12px/1.45 var(--font-sans);color:rgba(255,255,255,0.5);letter-spacing:-0.005em;
    max-width:240px;text-wrap:pretty;
  }

  /* ASCII analysis panel */
  .vmodel-ascii{
    border-radius:14px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:#1a1c22;
    box-shadow:0 20px 50px rgba(0,0,0,0.4);
    display:flex;flex-direction:column;position:relative;
  }
  .vmodel-ascii-head{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:12px 16px 10px;
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .vmodel-ascii-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.55);
  }
  .vmodel-ascii-badge{
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
    padding:4px 8px;border-radius:4px;
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.08);
    white-space:nowrap;
  }
  .vmodel-ascii-canvas{
    flex:1;
    background:#000;
    overflow:hidden;
    position:relative;
    display:flex;align-items:stretch;justify-content:stretch;
    min-height:0;
  }
  .vmodel-ascii-canvas canvas{
    display:block;width:100%;height:100%;
    image-rendering:pixelated;
    image-rendering:crisp-edges;
    filter:contrast(1.08) saturate(0);
  }
  .vmodel-ascii-caption{
    padding:10px 16px;
    font:400 11px/1.4 var(--font-mono);color:rgba(255,255,255,0.5);
    border-top:1px solid rgba(255,255,255,0.06);
    letter-spacing:0.04em;
  }

  /* Subtle scan line on pixelated view */
  .vmodel-ascii-canvas::after{
    content:"";position:absolute;left:0;right:0;height:30px;
    background:linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0) 100%);
    animation:vmodelScan 3.2s linear infinite;
    pointer-events:none;z-index:2;
  }
  @keyframes vmodelScan{
    0%{top:-30px}
    100%{top:100%}
  }

  /* Vertical connector to output */
  .vmodel-down{
    display:flex;flex-direction:column;align-items:center;
    padding:36px 0 28px;position:relative;
  }
  .vmodel-down-line{
    width:1px;height:56px;
    background:linear-gradient(to bottom,
      rgba(24,81,255,0) 0%,
      rgba(24,81,255,0.6) 50%,
      rgba(24,81,255,0) 100%);
  }
  .vmodel-down-label{
    margin-top:8px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.3em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
    white-space:nowrap;
  }

  .vmodel-output{
    width:100%;
    border-radius:16px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:var(--gs-chrome);
    box-shadow:0 40px 90px rgba(0,0,0,0.55);
  }
  .vmodel-output-shot{
    position:relative;background:#000;
  }
  .vmodel-output-shot img{width:100%;height:auto;display:block}
  .vmodel-output-shot .pill{
    position:absolute;top:18px;left:18px;z-index:2;
    display:flex;align-items:center;gap:8px;
    padding:7px 12px;border-radius:3px;
    background:rgba(8,8,10,0.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.18);
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.85);
    white-space:nowrap;
  }
  .vmodel-output-shot .pill::before{
    content:"";width:6px;height:6px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 6px rgba(24,81,255,0.55);
  }
  .vmodel-output-meta{
    display:grid;grid-template-columns:auto auto 1fr auto auto;gap:28px;align-items:center;
    padding:22px 26px;border-top:1px solid rgba(255,255,255,0.08);
  }
  .vmodel-output-meta .k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);margin-bottom:6px;
  }
  .vmodel-output-meta .v{font:500 17px/1.25 var(--font-sans);color:#fff;letter-spacing:-0.01em}
  .vmodel-output-meta .coord{font:500 12px/1.3 var(--font-mono);color:rgba(255,255,255,0.55);letter-spacing:0.04em}
  .vmodel-output-meta .div{width:1px;align-self:stretch;background:rgba(255,255,255,0.08)}
  .vmodel-output-meta .match b{
    display:block;font:500 30px/1 var(--font-sans);color:var(--gs-jade);letter-spacing:-0.02em;
  }
  .vmodel-output-meta .match span{
    display:block;margin-top:6px;font:500 10px/1 var(--font-mono);letter-spacing:0.2em;
    text-transform:uppercase;color:rgba(255,255,255,0.4);
  }

  /* Alert variant of the result pill — used for authenticity verdicts.
     Mirrors the in-product warning banner color. */
  .vmodel-output-shot .pill.pill--alert{
    background:rgba(28,12,12,0.82);
    border-color:rgba(216,31,31,0.42);
    color:rgba(255,224,224,0.95);
  }
  .vmodel-output-shot .pill.pill--alert::before{
    background:var(--gs-red);
    box-shadow:0 0 8px rgba(216,31,31,0.6);
  }

  /* Beta / caveat row beneath the output meta. */
  .vmodel-foot-note{
    display:flex;align-items:center;gap:10px;
    padding:14px 26px;
    border-top:1px solid rgba(255,255,255,0.06);
    font:500 11px/1.4 var(--font-mono);letter-spacing:0.14em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
    background:rgba(216,154,31,0.04);
  }
  .vmodel-foot-note-dot{
    width:6px;height:6px;border-radius:50%;
    background:var(--gs-amber);
    box-shadow:0 0 6px rgba(216,154,31,0.6);
    flex:0 0 auto;
  }

  /* ---- Deepfake detection workspace (live HTML, replaces screenshot) ---- */
  .dfwork{
    width:100%;
    border-radius:16px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:var(--gs-chrome);
    box-shadow:0 40px 90px rgba(0,0,0,0.55);
  }
  .dfwork-head{
    display:flex;align-items:center;gap:14px;
    padding:14px 20px;border-bottom:1px solid rgba(255,255,255,0.08);
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
  }
  .dfwork-beta{
    padding:5px 9px;border-radius:3px;
    border:1px solid rgba(255,255,255,0.16);
    color:rgba(255,255,255,0.7);
  }
  .dfwork-head-meta{color:rgba(255,255,255,0.45)}
  .dfwork-head-act{
    margin-left:auto;
    padding:6px 11px;border-radius:3px;
    border:1px solid rgba(255,255,255,0.16);
    color:rgba(255,255,255,0.62);
  }
  .dfwork-body{
    display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);
    gap:0;align-items:stretch;
  }
  .dfwork-image{
    display:flex;flex-direction:column;
    padding:20px;border-right:1px solid rgba(255,255,255,0.08);
    background:rgba(0,0,0,0.25);
  }
  .dfwork-image-frame{
    flex:1 1 auto;border-radius:10px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);background:#000;
    display:flex;align-items:center;justify-content:center;
    min-height:0;
  }
  .dfwork-image-frame img{
    width:100%;height:100%;max-height:520px;object-fit:contain;display:block;
  }
  .dfwork-image-foot{
    margin-top:14px;display:flex;flex-direction:column;gap:4px;
  }
  .dfwork-image-foot .k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
  }
  .dfwork-image-foot .f{
    font:500 13px/1.3 var(--font-mono);color:rgba(255,255,255,0.7);letter-spacing:0.02em;
  }
  .dfwork-panel{padding:22px 24px;display:flex;flex-direction:column;gap:22px}
  .dfwork-verdict{
    display:flex;gap:12px;align-items:flex-start;
    padding:14px 16px;border-radius:10px;
    background:rgba(40,14,14,0.55);
    border:1px solid rgba(216,31,31,0.4);
  }
  .dfwork-verdict-ico{
    flex:0 0 auto;width:24px;height:24px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:rgba(216,31,31,0.18);border:1px solid rgba(216,31,31,0.5);
    color:var(--gs-red);font:700 14px/1 var(--font-sans);
  }
  .dfwork-verdict-h{
    font:600 17px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.01em;margin-bottom:4px;
  }
  .dfwork-verdict-s{
    font:500 13px/1.45 var(--font-sans);color:rgba(255,255,255,0.62);
  }
  .dfwork-verdict-s b{color:rgba(255,255,255,0.92);font-weight:600}
  .dfwork-group{display:flex;flex-direction:column;gap:9px}
  .dfwork-group-head{
    display:flex;justify-content:space-between;align-items:baseline;gap:12px;
    padding-bottom:8px;margin-bottom:2px;border-bottom:1px solid rgba(255,255,255,0.08);
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    color:rgba(255,255,255,0.38);
  }
  .dfwork-row{
    display:grid;grid-template-columns:140px 1fr 42px;gap:14px;align-items:center;
  }
  .dfwork-row-name{
    font:500 13px/1.3 var(--font-sans);color:rgba(255,255,255,0.72);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .dfwork-bar{
    height:6px;border-radius:99px;background:rgba(255,255,255,0.08);overflow:hidden;
  }
  .dfwork-bar i{
    display:block;height:100%;border-radius:99px;
    background:rgba(255,255,255,0.4);
  }
  .dfwork-row-val{
    text-align:right;
    font:500 12px/1 var(--font-mono);color:rgba(255,255,255,0.5);letter-spacing:0.02em;
  }
  .dfwork-row.is-top .dfwork-row-name{color:#fff;font-weight:600}
  .dfwork-row.is-top .dfwork-bar i{
    background:var(--gs-red);box-shadow:0 0 10px rgba(216,31,31,0.45);
  }
  .dfwork-row.is-top .dfwork-row-val{color:var(--gs-red);font-weight:600}
  .dfwork .vmodel-foot-note{border-radius:0}

  @media (max-width: 900px){
    .dfwork-body{grid-template-columns:1fr}
    .dfwork-image{border-right:0;border-bottom:1px solid rgba(255,255,255,0.08)}
    .dfwork-image-frame img{max-height:60vh}
    .dfwork-panel{padding:20px 18px;gap:20px}
    .dfwork-row{grid-template-columns:110px 1fr 38px;gap:10px}
    .dfwork-head{flex-wrap:wrap;gap:10px}
    .vmodel-triptych{grid-template-columns:1fr;gap:16px}
    .vmodel-input-photo{height:320px;min-height:320px}
    .vmodel-ascii-canvas{height:320px;min-height:320px}
    .vmodel-analyze{padding:16px 0}
    .vmodel-analyze-line{width:1px;height:60px;background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(24,81,255,0.7) 50%,rgba(255,255,255,0) 100%)}
    .vmodel-analyze-line::after{display:none}
    .vmodel-output-meta{grid-template-columns:1fr 1fr;gap:20px}
    .vmodel-output-meta .div{display:none}
    .vmodel-foot-note{padding:12px 18px;letter-spacing:0.1em}
  }
  /* ---- LGM centerpiece -------------------------------------------------- */
  .lgm{
    margin-top:56px;
    position:relative;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:14px;
    background:
      radial-gradient(ellipse at 50% 50%, rgba(24,81,255,0.06) 0%, rgba(24,81,255,0) 60%),
      #1a1c22;
    overflow:hidden;
    padding:48px 40px;
    box-shadow:0 30px 80px rgba(0,0,0,0.5);
  }
  .lgm::before{
    /* subtle grid */
    content:"";position:absolute;inset:0;pointer-events:none;
    background-image:
      linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
    background-size:40px 40px;
    mask-image:radial-gradient(ellipse at center, #000 20%, transparent 80%);
  }

  .lgm-flow{
    position:relative;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    gap:0;
    align-items:center;
    min-height:340px;
  }

  /* LEFT — live inputs (stacked scan videos) */
  .lgm-inputs{
    display:flex;flex-direction:column;gap:12px;
    height:320px;justify-content:center;padding-right:20px;
  }
  .lgm-input-card{
    position:relative;
    border-radius:10px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    background:#1a1c22;
    box-shadow:0 10px 30px rgba(0,0,0,0.35);
    aspect-ratio:16/9;
  }
  .lgm-input-solo{
    aspect-ratio:auto;height:100%;
    box-shadow:0 20px 50px rgba(0,0,0,0.45);
    border-color:rgba(24,81,255,0.2);
  }
  .lgm-input-card video{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
  }
  .lgm-input-card::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(135deg, rgba(10,11,13,0) 40%, rgba(10,11,13,0.55) 100%);
    pointer-events:none;
  }
  .lgm-input-label{
    position:absolute;top:10px;left:10px;z-index:2;
    display:inline-flex;align-items:center;gap:7px;
    padding:5px 9px;border-radius:4px;
    background:rgba(0,0,0,0.55);
    backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
    border:1px solid rgba(255,255,255,0.1);
    font:500 9px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:#fff;
  }
  .lgm-input-label .dot-mini{
    width:6px;height:6px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 6px rgba(24,81,255,0.8);
  }
  .lgm-input-label.iris .dot-mini{background:#FFFFFF;box-shadow:0 0 6px rgba(255,255,255,0.8)}
  .lgm-input-coord{
    position:absolute;bottom:10px;right:10px;z-index:2;
    font:500 10px/1 var(--font-mono);letter-spacing:0.04em;
    color:rgba(255,255,255,0.85);
    padding:4px 8px;border-radius:3px;
    background:rgba(0,0,0,0.5);
    backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
    border:1px solid rgba(255,255,255,0.08);
  }

  /* CENTER — LGM core */
  .lgm-core{
    position:relative;
    width:260px;height:260px;
    display:flex;align-items:center;justify-content:center;
    flex-direction:column;
    z-index:3;
  }
  .lgm-core-rings{
    position:absolute;inset:0;
    display:flex;align-items:center;justify-content:center;
  }
  .lgm-ring{
    position:absolute;border-radius:50%;
    border:1px solid rgba(24,81,255,0.18);
  }
  .lgm-ring.r1{width:100%;height:100%;border-color:rgba(24,81,255,0.08)}
  .lgm-ring.r2{width:75%;height:75%;border-color:rgba(24,81,255,0.14)}
  .lgm-ring.r3{width:50%;height:50%;border-color:rgba(24,81,255,0.28)}

  .lgm-core-node{
    position:relative;z-index:2;
    width:120px;height:120px;border-radius:50%;
    background:
      radial-gradient(circle at 35% 35%, rgba(24,81,255,0.35) 0%, rgba(24,81,255,0.12) 40%, rgba(24,81,255,0.02) 70%),
      #1a1c22;
    border:1px solid rgba(24,81,255,0.5);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    box-shadow:
      0 0 40px rgba(24,81,255,0.25),
      inset 0 0 30px rgba(24,81,255,0.08);
  }
  .lgm-core-label{
    font:500 11px/1 var(--font-mono);letter-spacing:0.28em;text-transform:uppercase;
    color:var(--gs-jade);
  }
  .lgm-core-name{
    font:600 22px/1 var(--font-sans);letter-spacing:-0.02em;color:#fff;
  }
  .lgm-core-sub{
    margin-top:16px;
    font:500 10px/1.3 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    color:rgba(255,255,255,0.5);text-align:center;
    max-width:220px;
  }

  /* Dots forming the lattice inside core */
  .lgm-lattice{
    position:absolute;inset:0;
    display:grid;grid-template-columns:repeat(11,1fr);grid-template-rows:repeat(11,1fr);
    padding:20px;
    pointer-events:none;
    opacity:0.45;
  }
  .lgm-lattice span{
    width:2px;height:2px;border-radius:50%;background:rgba(24,81,255,0.6);
    align-self:center;justify-self:center;
  }

  /* Flow arrows on left + right */
  .lgm-arrow-in, .lgm-arrow-out{
    position:absolute;top:50%;transform:translateY(-50%);
    height:1px;
    background:linear-gradient(to right,
      rgba(24,81,255,0) 0%,
      rgba(24,81,255,0.9) 50%,
      rgba(24,81,255,0) 100%);
    z-index:1;
  }
  .lgm-arrow-in{right:calc(50% + 130px);width:90px}
  .lgm-arrow-out{left:calc(50% + 130px);width:90px}

  /* RIGHT — coordinate output */
  .lgm-output{
    position:relative;
    display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
    padding-left:20px;
    height:320px;gap:14px;
  }
  .lgm-coord-card{
    border:1px solid rgba(24,81,255,0.35);
    border-radius:10px;
    background:rgba(24,81,255,0.06);
    padding:16px 20px;
    box-shadow:0 0 30px rgba(24,81,255,0.15);
    min-width:280px;
  }
  .lgm-coord-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(24,81,255,0.8);margin-bottom:10px;
    display:flex;align-items:center;gap:8px;
  }
  .lgm-coord-k::before{
    content:"";width:6px;height:6px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.8);
  }
  .lgm-coord-v{
    font:500 22px/1.1 var(--font-mono);letter-spacing:0.02em;color:#fff;
  }
  .lgm-coord-meta{
    margin-top:10px;
    font:500 11px/1.4 var(--font-mono);letter-spacing:0.04em;
    color:rgba(255,255,255,0.55);
    display:flex;align-items:center;gap:8px;
  }
  .lgm-coord-meta b{color:var(--gs-jade);font-weight:500}
  .lgm-coord-dot{
    width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,0.3);
  }

  .lgm-output-note{
    font:500 10px/1.4 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
    max-width:280px;
  }

  /* Bottom axis labels */
  .lgm-axis{
    position:relative;
    display:grid;grid-template-columns:1fr auto 1fr;
    margin-top:32px;
    padding-top:20px;
    border-top:1px solid rgba(255,255,255,0.06);
    gap:0;
    align-items:start;
  }
  .lgm-axis-col{
    padding:0 16px;
  }
  .lgm-axis-col:first-child{text-align:left;padding-left:0}
  .lgm-axis-col:nth-child(2){text-align:center;min-width:260px}
  .lgm-axis-col:last-child{text-align:right;padding-right:0;padding-left:20px}
  .lgm-axis-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);margin-bottom:6px;
  }
  .lgm-axis-v{
    font:500 13px/1.3 var(--font-sans);color:rgba(255,255,255,0.8);letter-spacing:-0.005em;
  }

  @media (max-width: 900px){
    .lgm{padding:32px 20px}
    .lgm-flow{grid-template-columns:1fr;min-height:0;gap:32px}
    .lgm-inputs{height:auto;padding-right:0;flex-direction:row}
    .lgm-arrow-in,.lgm-arrow-out{display:none}
    .lgm-output{height:auto;padding-left:0}
    .lgm-axis{grid-template-columns:1fr}
    .lgm-axis-col{padding:12px 0;text-align:left !important;border-top:1px solid rgba(255,255,255,0.06)}
    .lgm-axis-col:first-child{border-top:none}
  }

  /* ---- Perception (how the model sees) ---------------------------------- */
  .lgm-stats{
    margin-top:56px;display:grid;grid-template-columns:repeat(4,1fr);
    border:1px solid rgba(255,255,255,0.08);border-radius:4px;overflow:hidden;
    background:rgba(255,255,255,0.015);
  }
  .lgm-stat{padding:24px 28px;border-right:1px solid rgba(255,255,255,0.08)}
  .lgm-stat:last-child{border-right:none}
  .lgm-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);margin-bottom:14px;
  }
  .lgm-v{
    font:400 28px/1.00 var(--font-sans);letter-spacing:-0.04em;color:#fff;
  }
  .lgm-v span{
    display:block;margin-top:6px;
    font:400 13px/1.4 var(--font-sans);color:rgba(255,255,255,0.55);letter-spacing:0;
  }
  .perception{
    margin-top:24px;display:grid;grid-template-columns:1fr 1fr;gap:20px;
  }
  .perc-card{
    position:relative;border-radius:18px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    background:#000;
    aspect-ratio:688/720;
  }
  .perc-card video{display:block;width:100%;height:100%;object-fit:cover}
  .perc-scrim{
    position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,0.85) 100%);
  }
  .perc-label{
    position:absolute;top:14px;left:14px;
    display:flex;align-items:center;gap:8px;
    padding:7px 10px;border-radius:5px;
    background:rgba(10,10,10,0.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.08);
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,0.78);
  }
  .perc-label .dot-mini{width:6px;height:6px;border-radius:50%;background:var(--gs-jade);box-shadow:0 0 8px var(--gs-jade);animation:pulse 1.6s ease-in-out infinite}
  .perc-label.iris .dot-mini{background:var(--gs-iris);box-shadow:0 0 8px var(--gs-iris)}
  .perc-caption{
    position:absolute;bottom:18px;left:18px;right:18px;
    display:flex;justify-content:space-between;align-items:flex-end;gap:12px;
  }
  .perc-title{font:500 18px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.01em}
  .perc-title span{display:block;font:400 13px/1.4 var(--font-sans);color:rgba(255,255,255,0.6);margin-top:4px;letter-spacing:0}
  .perc-count{
    font:500 10px/1.3 var(--font-mono);letter-spacing:0.16em;text-transform:uppercase;
    color:var(--gs-jade);text-align:right;
  }
  .perc-count b{display:block;font:600 22px/1 var(--font-sans);color:#fff;letter-spacing:-0.01em;margin-bottom:4px}
  .perc-coords{
    position:absolute;bottom:16px;right:18px;
    font:500 11px/1 var(--font-mono);letter-spacing:0.08em;
    color:rgba(255,255,255,0.7);
    background:rgba(10,10,10,0.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
    padding:6px 10px;border-radius:3px;
    border:1px solid rgba(255,255,255,0.08);
  }

  /* ---- How it works ----------------------------------------------------- */
  .how{margin-top:56px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;align-items:start}
  .step{position:relative}
  .step-num{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;
    color:var(--gs-iris-soft);margin-bottom:16px;
  }
  .step-h{font:600 24px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.01em;margin-bottom:12px}
  .step-p{font:300 17px/1.30 var(--font-serif);color:rgba(255,255,255,0.70);margin-bottom:24px;max-width:34ch;letter-spacing:0}
  .step-shot{
    border-radius:14px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    background:var(--gs-chrome);
    box-shadow:var(--shadow-panel);
    aspect-ratio:4/3;
  }
  .step-shot img{width:100%;height:100%;object-fit:cover;object-position:center}

  /* ---- Proof panel ------------------------------------------------------ */
  .proof{
    margin-top:56px;display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center;
  }
  .proof-shot{
    position:relative;border-radius:18px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    box-shadow:var(--shadow-panel);
  }
  .proof-shot img{width:100%;display:block}
  .proof-badge{
    position:absolute;top:18px;left:18px;
    padding:8px 12px;border-radius:6px;
    background:rgba(24,81,255,0.18);
    border:1px solid var(--gs-jade);
    color:var(--gs-jade);
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
  }
  .proof-body{font:300 18px/1.30 var(--font-serif);color:rgba(255,255,255,0.76);max-width:44ch;text-wrap:pretty;letter-spacing:0}
  .proof-body b{color:#fff;font-weight:600}
  .proof-meta{
    margin-top:28px;padding-top:20px;border-top:1px solid rgba(255,255,255,0.08);
    display:grid;grid-template-columns:auto 1fr;gap:14px 20px;
    font:400 13px/1.5 var(--font-sans);
  }
  .proof-meta .k{color:rgba(255,255,255,0.42);font-family:var(--font-mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;padding-top:3px}
  .proof-meta .v{color:#fff}
  .proof-meta .v.coord{font-family:var(--font-mono);font-size:13px;letter-spacing:0.04em;color:var(--gs-jade)}

  /* ---- Full app preview ------------------------------------------------- */
  .appshot-wrap{
    margin-top:56px;position:relative;
    border-radius:20px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    box-shadow:0 40px 100px rgba(0,0,0,0.6), 0 20px 40px rgba(0,0,0,0.4);
  }
  .appshot-wrap img{width:100%;display:block}
  .appshot-caption{
    position:absolute;bottom:0;left:0;right:0;
    padding:24px 28px;
    background:linear-gradient(180deg, transparent, rgba(0,0,0,0.85));
    display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:20px;
    pointer-events:none;
  }
  .appshot-title{font:500 18px/1.3 var(--font-sans);color:#fff;letter-spacing:-0.005em}
  .appshot-title span{color:rgba(255,255,255,0.55);font-weight:400}
  .appshot-tags{display:flex;gap:10px;flex-wrap:wrap}
  .appshot-tag{
    padding:6px 10px;border-radius:4px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    background:rgba(10,10,10,0.7);border:1px solid rgba(255,255,255,0.12);color:rgba(255,255,255,0.82);
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  }

  /* ---- Case studies ----------------------------------------------------- */
  .cases{margin-top:48px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .case{
    position:relative;overflow:hidden;
    border-radius:14px;
    border:1px solid rgba(255,255,255,0.08);
    background:var(--gs-chrome);
    min-height:340px;
    display:flex;flex-direction:column;
    transition:border-color 160ms, transform 160ms;
  }
  .case:hover{border-color:rgba(255,255,255,0.18);transform:translateY(-2px)}
  .case-img{
    position:relative;height:160px;overflow:hidden;
    background:#0a0a0a;
  }
  .case-img img{width:100%;height:100%;object-fit:cover;filter:saturate(0.85) brightness(0.75)}
  .case-status{
    position:absolute;top:12px;left:12px;
    padding:6px 10px;border-radius:4px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  }
  .case-status.closed{background:rgba(24,81,255,0.18);color:var(--gs-jade);border:1px solid rgba(24,81,255,0.4)}
  .case-status.located{background:rgba(255,255,255,0.18);color:var(--gs-iris-soft);border:1px solid rgba(255,255,255,0.4)}
  .case-status.recovered{background:rgba(255,255,255,0.18);color:var(--gs-amber);border:1px solid rgba(255,255,255,0.4)}
  .case-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
  .case-k{font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,0.38)}
  .case-h{font:500 19px/1.25 var(--font-sans);color:#fff;letter-spacing:-0.01em;text-wrap:balance}
  .case-p{font:400 13px/1.55 var(--font-sans);color:rgba(255,255,255,0.55);text-wrap:pretty}
  .case-foot{
    margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,0.06);
    display:flex;justify-content:space-between;
    font:400 11px/1 var(--font-mono);letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.5);
  }
  .case-foot .time{color:var(--gs-jade);font-weight:500}

  /* "View all case studies" — link under the homepage cases grid */
  .cases-more{margin-top:28px;display:flex;justify-content:flex-end}
  .cases-more-link{
    display:inline-flex;align-items:center;gap:10px;
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.7);
    padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,0.18);
    transition:color 160ms ease, border-color 160ms ease;
  }
  .cases-more-link:hover{color:#fff;border-color:var(--gs-jade)}

  /* ---- Who uses Raven --------------------------------------------------- */
  .who-grid{margin-top:48px;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:0;border-top:1px solid rgba(255,255,255,0.08)}
  .who{
    padding:32px 24px;border-right:1px solid rgba(255,255,255,0.08);
    border-bottom:1px solid rgba(255,255,255,0.08);
    display:flex;flex-direction:column;gap:10px;min-height:200px;
  }
  .who:last-child{border-right:none}
  .who-k{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
  }
  .who-h{font:500 22px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.01em;margin-top:4px}
  .who-p{font:400 14px/1.55 var(--font-sans);color:rgba(255,255,255,0.55);margin-top:6px}

  /* ---- Lineage strip (GeoSpy → Raven rebrand) --------------------------- */
  .lineage{
    margin:0;padding:112px 40px 120px;
    position:relative;
    background:transparent;
    overflow:hidden;
  }
  .lineage::before{
    content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);
    width:1px;height:48px;
    background:linear-gradient(to bottom, transparent, rgba(255,255,255,0.2));
  }
  .lineage-inner{
    position:relative;z-index:2;
    max-width:1100px;margin:0 auto;
    display:flex;flex-direction:column;align-items:center;gap:32px;
  }

  .er-eyebrow{
    display:flex;align-items:center;gap:12px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.28em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
  }
  .er-eyebrow-tick{
    width:6px;height:6px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 10px rgba(24,81,255,0.6);
  }
  .er-eyebrow-slash{color:rgba(255,255,255,0.2)}

  /* The panel */
  .er{
    width:100%;
    border-radius:16px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:var(--gs-chrome);
    box-shadow:0 40px 90px rgba(0,0,0,0.5);
  }
  .er-body{
    display:grid;grid-template-columns:1fr auto 1fr;
    align-items:stretch;
  }
  .er-col{
    padding:56px 48px;
    display:flex;flex-direction:column;gap:24px;
    min-height:220px;
    justify-content:center;align-items:center;
  }
  .er-col-past{}
  .er-col-now{
    background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent 70%);
  }
  .er-col-label{
    display:flex;align-items:center;gap:10px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.28em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
  }
  .er-col-label-now{color:#fff}
  .er-col-dot{
    width:7px;height:7px;border-radius:50%;background:#fff;
    box-shadow:0 0 10px rgba(255,255,255,0.5);
  }

  /* Marks */
  .er-mark-past{
    height:56px;width:auto;display:block;
    opacity:0.45;filter:grayscale(1) brightness(1.4);
  }
  .er-mark-now{
    display:flex;align-items:center;gap:16px;
  }
  .er-bird{
    height:56px;width:auto;display:block;flex-shrink:0;
  }
  .er-raven{
    font:400 48px/1 var(--font-sans);letter-spacing:-0.04em;color:#fff;
  }

  /* Connector */
  .er-connector{
    position:relative;
    display:flex;align-items:center;justify-content:center;
    padding:0 8px;min-width:96px;
  }
  .er-connector-line{
    position:absolute;left:50%;top:20%;bottom:20%;
    width:1px;background:linear-gradient(to bottom,
      transparent, rgba(255,255,255,0.12) 30%, rgba(255,255,255,0.12) 70%, transparent);
    transform:translateX(-50%);
  }
  .er-connector-node{
    position:relative;z-index:2;
    width:44px;height:44px;border-radius:50%;
    background:#0A0B0D;
    border:1px solid rgba(255,255,255,0.14);
    display:flex;align-items:center;justify-content:center;
    color:#fff;font:300 20px/1 var(--font-sans);
  }

  /* Footer */
  .er-foot{
    padding:18px 32px;
    border-top:1px solid rgba(255,255,255,0.08);
    background:rgba(0,0,0,0.35);
    font:300 14px/1.5 var(--font-serif);color:rgba(255,255,255,0.68);
    letter-spacing:0;text-wrap:pretty;text-align:center;
  }
  .er-foot-link{
    display:inline-block;margin-left:10px;white-space:nowrap;
    font:500 11px/1 var(--font-mono);letter-spacing:0.16em;text-transform:uppercase;
    color:rgba(255,255,255,0.6);
    border-bottom:1px solid rgba(255,255,255,0.25);
    padding-bottom:2px;
    transition:color 160ms ease, border-color 160ms ease;
  }
  .er-foot-link:hover{color:#fff;border-color:rgba(255,255,255,0.7)}

  @media (max-width: 860px){
    .lineage{padding:72px 20px 88px}
    .er-body{grid-template-columns:1fr}
    .er-col{padding:36px 28px;min-height:0;align-items:center}
    .er-col-now{
      background:linear-gradient(180deg, rgba(255,255,255,0.03), transparent 80%);
      border-top:1px dashed rgba(255,255,255,0.1);
    }
    .er-connector{
      padding:0;min-height:60px;
      border-top:1px dashed rgba(255,255,255,0.08);
    }
    .er-connector-line{
      left:20%;right:20%;top:50%;bottom:auto;
      width:auto;height:1px;transform:translateY(-50%);
      background:linear-gradient(to right,
        transparent, rgba(255,255,255,0.12) 30%, rgba(255,255,255,0.12) 70%, transparent);
    }
    .er-connector-node{transform:rotate(90deg)}
    .er-raven{font-size:40px}
    .er-mark-past,.er-bird{height:44px}
  }

  /* ---- Security strip --------------------------------------------------- */
  .sec{
    margin-top:0;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;
    padding:72px 44px;
    border-top:1px solid rgba(255,255,255,0.08);border-bottom:1px solid rgba(255,255,255,0.08);
    background:var(--gs-chrome);
  }
  .sec-list{display:grid;grid-template-columns:1fr 1fr;gap:24px 32px}
  .sec-item{display:flex;gap:12px;align-items:flex-start}
  .sec-item svg{flex-shrink:0;margin-top:2px;color:var(--gs-jade)}
  .sec-item b{display:block;color:#fff;font:500 14px/1.3 var(--font-sans)}
  .sec-item p{font:400 13px/1.5 var(--font-sans);color:rgba(255,255,255,0.55);margin-top:4px}

  /* ---- Why Raven -------------------------------------------------------- */
  .why{
    display:grid;grid-template-columns:1fr 1fr;gap:0;
    border:1px solid rgba(255,255,255,0.08);border-radius:4px;overflow:hidden;
    background:var(--gs-chrome);
  }
  .why-col{padding:40px 36px}
  .why-col + .why-col{border-left:1px solid rgba(255,255,255,0.08)}
  .why-col.traditional{background:rgba(255,255,255,0.015)}
  .why-col.raven{background:rgba(42,218,164,0.03)}
  .why-k{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    display:flex;align-items:center;gap:10px;margin-bottom:22px;
  }
  .why-col.traditional .why-k{color:rgba(255,255,255,0.45)}
  .why-col.raven .why-k{color:var(--gs-jade)}
  .why-k .tag{
    padding:4px 8px;border:1px solid currentColor;border-radius:2px;
    letter-spacing:0.16em;font-size:10px;opacity:0.7;
  }
  .why-h{
    font:600 22px/1.2 var(--font-sans);letter-spacing:-0.01em;
    margin-bottom:28px;text-wrap:balance;
  }
  .why-col.traditional .why-h{color:rgba(255,255,255,0.55)}
  .why-col.raven .why-h{color:#fff}
  .why-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
  .why-list li{
    display:flex;gap:12px;align-items:flex-start;
    font:400 15px/1.45 var(--font-sans);
  }
  .why-list li svg{flex-shrink:0;margin-top:3px}
  .why-col.traditional li{color:rgba(255,255,255,0.5)}
  .why-col.traditional li svg{color:rgba(255,255,255,0.3)}
  .why-col.raven li{color:rgba(255,255,255,0.88)}
  .why-col.raven li svg{color:var(--gs-jade)}
  @media (max-width: 860px){
    .why{grid-template-columns:1fr}
    .why-col{padding:32px 24px}
    .why-col + .why-col{border-left:none;border-top:1px solid rgba(255,255,255,0.08)}
  }

  /* Three supporting points read as a stacked list rather than a ragged 2x2. */
  .sec-list.is-trio{grid-template-columns:1fr;gap:22px}

  /* ---- Powered by GeoSpy ------------------------------------------------ */
  .poweredby{position:relative}
  .pb-inner{
    display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:center;
  }
  .pb-lockup{display:flex;justify-content:center}
  .pb-badge{
    width:100%;max-width:420px;
    background:linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.01) 100%);
    border:1px solid rgba(255,255,255,0.28);
    border-radius:4px;padding:28px 30px;
    position:relative;overflow:hidden;
  }
  .pb-badge::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,255,255,0.14) 0%, rgba(0,0,0,0) 60%);
    pointer-events:none;
  }
  .pb-badge-top{
    display:flex;align-items:center;justify-content:space-between;
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:var(--gs-iris-soft);position:relative;
  }
  .pb-dot{width:7px;height:7px;border-radius:50%;background:var(--gs-iris);box-shadow:0 0 12px var(--gs-iris-wash)}
  .pb-geo{
    margin-top:18px;font:600 46px/1 var(--font-sans);letter-spacing:-0.035em;
    color:#fff;position:relative;
  }
  .pb-sub{
    margin-top:8px;font:400 13px/1.4 var(--font-mono);letter-spacing:0.04em;
    color:rgba(255,255,255,0.5);position:relative;
  }
  .pb-div{
    margin:22px -30px 20px;border-top:1px solid rgba(255,255,255,0.08);
  }
  .pb-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;position:relative;
  }
  .pb-grid > div{display:flex;flex-direction:column;gap:4px}
  .pb-grid span{font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.42)}
  .pb-grid b{font:500 16px/1 var(--font-sans);color:#fff;letter-spacing:-0.01em}

  /* ---- CTA -------------------------------------------------------------- */
  .cta-section{
    padding:120px 44px;text-align:center;position:relative;overflow:hidden;
  }
  .cta-bg{
    position:absolute;inset:0;
    background:radial-gradient(ellipse 70% 70% at 50% 50%, rgba(255,255,255,0.18) 0%, rgba(0,0,0,0) 60%);
  }
  .cta-inner{position:relative;z-index:2;max-width:780px;margin:0 auto}
  .cta-h{font:300 clamp(42px, 5vw, 72px)/1.00 var(--font-sans);letter-spacing:-0.04em;color:#fff;text-wrap:balance}
  .cta-p{margin-top:20px;font:300 20px/1.30 var(--font-serif);color:rgba(255,255,255,0.70);text-wrap:pretty;letter-spacing:0}
  .cta-row{margin-top:40px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
  .cta-note{
    margin-top:24px;
    font:400 14px/1.5 var(--font-sans);color:rgba(255,255,255,0.5);text-wrap:pretty;
  }
  .cta-note a{
    color:rgba(255,255,255,0.85);
    border-bottom:1px solid rgba(255,255,255,0.25);
    transition:color 160ms ease, border-color 160ms ease;
  }
  .cta-note a:hover{color:#fff;border-color:rgba(255,255,255,0.7)}

  /* ---- Footer ----------------------------------------------------------- */
  footer{
    padding:56px 44px 32px;border-top:1px solid rgba(255,255,255,0.08);
    color:rgba(255,255,255,0.5);font:400 13px/1 var(--font-sans);
  }
  .footer-top,.footer-bottom{max-width:1240px;margin:0 auto}
  .footer-top{
    display:flex;justify-content:space-between;align-items:flex-start;gap:48px;
    padding-bottom:40px;
  }
  .footer-brand{display:inline-flex;align-items:center;opacity:0.9;transition:opacity 160ms ease;flex-shrink:0}
  .footer-brand:hover{opacity:1}
  .footer-brand img{height:16px;width:auto}
  .footer-cols{display:grid;grid-template-columns:repeat(3,minmax(140px,180px));gap:32px 48px}
  .footer-col{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
  .footer-k{
    margin-bottom:6px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.32);
  }
  .footer-col a,.footer-legal a{color:inherit;text-decoration:none;transition:color 160ms ease}
  .footer-col a:hover,.footer-legal a:hover{color:#fff}
  .footer-col a[aria-current="page"]{color:rgba(255,255,255,0.85)}
  .footer-ext{margin-left:5px;font-size:11px;color:rgba(255,255,255,0.3)}
  .footer-bottom{
    display:flex;justify-content:space-between;align-items:center;gap:24px;
    padding-top:24px;border-top:1px solid rgba(255,255,255,0.08);
    font-size:12px;color:rgba(255,255,255,0.36);
  }
  .footer-legal{display:flex;gap:24px}
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

  /* Responsive */
  @media (max-width: 1100px){
    .how,.cases{grid-template-columns:1fr 1fr}
    .case-strip{grid-template-columns:1fr 1fr}
    .carid{grid-template-columns:1fr}
    .geoest{grid-template-columns:1fr}
    .geoest-input{min-height:420px;border-right:none;border-bottom:1px solid rgba(255,255,255,0.08)}
    .geoest-arrow{display:none}
    .proof,.sec,.perception{grid-template-columns:1fr}
    .lgm-stats{grid-template-columns:1fr 1fr}
    .lgm-stat:nth-child(2n){border-right:none}
    .lgm-stat:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,0.08)}
    .who-grid{grid-template-columns:1fr 1fr}
    .who:nth-child(2){border-right:none}
    .hero-inner{gap:48px}
    .hero-scrub-track{margin:96px auto 0}
  }
  @media (max-width: 1080px){
    .nav-links{display:none}
    .nav-right .btn{display:none}
    .nav-burger{display:inline-flex}
    .nav{
      --nav-float-gap:calc(12px + env(safe-area-inset-top, 0px));
      margin:var(--nav-float-gap) max(14px, env(safe-area-inset-right, 0px)) 0 max(14px, env(safe-area-inset-left, 0px));
      padding:14px 16px;
      border-radius:12px;
    }
  }
  @media (max-width: 700px){
    .how,.cases{grid-template-columns:1fr}
    .mode{grid-template-columns:1fr;gap:0}
    .mode-num{writing-mode:horizontal-tb;transform:none;width:auto;border-right:none;border-bottom:1px solid rgba(255,255,255,0.06);padding:14px 22px;justify-content:flex-start}
    .mode-body{padding:20px 22px}
    .mode-foot{border-left:none;border-top:1px solid rgba(255,255,255,0.06);padding:16px 22px;flex-direction:row;align-items:center;min-width:0}
    .who-grid{grid-template-columns:1fr}
    .who{border-right:none}
    .section{padding:80px 24px}
    .hero{padding:44px 24px 0}
    .hero-inner{padding:0}
    footer{padding:48px 24px 28px}
    .footer-top{flex-direction:column;gap:36px;padding-bottom:32px}
    .footer-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px;width:100%}
    .footer-bottom{flex-direction:column;align-items:flex-start;gap:14px}
    .eyebrow{
      font-size:10px;letter-spacing:0.14em;
      padding:7px 12px;max-width:100%;
      white-space:normal;text-align:left;line-height:1.3;
    }
    /* Hero map: static image only (Raven Monochromatic mobile — no scrub / video / telemetry) */
    .hero-scrub-track,
    .hero-scrub-track.is-scrub-enabled{
      height:auto !important;
    }
    .hero-scrub-track .hero-scrub-sticky{
      position:relative !important;
      top:auto !important;
      min-height:0 !important;
      display:block !important;
      padding:0 !important;
      width:auto !important;
    }
    .hero-scrub-video{display:none !important;}
    .hero-scrub-fallback{display:block !important;width:100%}
    /* Less aggressive perspective tilt on small screens */
    .hero-scrub-track{margin:40px auto 0}
    .hero-shot{transform:none;border-radius:14px}
    /* Product demonstration video — tighter frame on small screens */
    .demo-video{margin-top:28px}
    .demo-video-frame{border-radius:14px}
    .demo-video-play{width:74px;height:74px}
    .demo-video-play svg{width:32px;height:32px;margin-left:3px}
    .demo-video-tick{width:10px;height:10px}
    .demo-video-tick.tl,.demo-video-tick.tr{top:9px}
    .demo-video-tick.bl,.demo-video-tick.br{bottom:9px}
    .demo-video-tick.tl,.demo-video-tick.bl{left:9px}
    .demo-video-tick.tr,.demo-video-tick.br{right:9px}
    .demo-video-cap{font-size:10px;letter-spacing:0.1em;margin-top:14px}
    /* Case hero: un-absolute the meta so it stacks below the (short) map image */
    .case-hero{border-radius:16px}
    .case-hero-scrim{display:none}
    .case-hero-meta{
      position:static;left:auto;right:auto;bottom:auto;
      padding:20px 20px 22px;gap:16px;
      flex-direction:column;align-items:flex-start;
      background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 40%, #000 100%);
      margin-top:-80px;position:relative;z-index:2;
    }
    .case-hero-name{font-size:20px}
    .case-hero-kpis{gap:20px 22px}
    .case-hero-kpi{font-size:11px}
    .case-hero-kpi b{font-size:16px}
  }

  /* Pulse animation on hero pin hint */
  @keyframes pulse {
    0%,100% { opacity: 0.7; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.06); }
  }
  .pulse-dot{animation:pulse 2.6s ease-in-out infinite}

  /* ---- Platform / "Every pixel is a signal" ---------------------------- */
  .platform{position:relative;padding-top:40px;padding-bottom:60px}
  .platform-sub2{margin-top:12px}
  .platform-tag{
    margin:22px 0 0;
    display:inline-flex;align-items:center;gap:10px;
    padding:9px 14px 9px 12px;border-radius:6px;
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.1);
    font:500 13px/1 var(--font-sans);
    letter-spacing:-0.005em;color:rgba(255,255,255,0.88);
  }
  .platform-tag-dot{
    width:7px;height:7px;border-radius:50%;
    background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.7);
  }
  .platform-wall{
    margin-top:56px;position:relative;width:100%;
    border-radius:18px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    background:#1a1c22;
    box-shadow:0 40px 90px rgba(0,0,0,0.5), inset 0 0 120px rgba(24,81,255,0.04);
  }
  .platform-wall-canvas{
    display:block;width:100%;height:320px;
    image-rendering:pixelated;
    image-rendering:crisp-edges;
  }
  .platform-wall-overlay{
    position:absolute;inset:0;pointer-events:none;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    background:radial-gradient(ellipse at center, rgba(5,7,10,0) 0%, rgba(5,7,10,0.35) 55%, rgba(5,7,10,0.82) 100%);
  }
  .platform-wall-overlay-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.3em;text-transform:uppercase;
    color:rgba(24,81,255,0.85);
    display:flex;align-items:center;gap:10px;margin-bottom:18px;
  }
  .platform-wall-overlay-k::before,
  .platform-wall-overlay-k::after{
    content:"";width:28px;height:1px;background:rgba(24,81,255,0.35);
  }
  .platform-wall-overlay-h{
    font:300 44px/1.00 var(--font-sans);letter-spacing:-0.04em;color:#fff;
    text-align:center;text-wrap:balance;margin:0;
  }
  .platform-wall-overlay-h em{
    font-style:normal;color:var(--gs-jade);
    background:linear-gradient(180deg, rgba(24,81,255,0.18) 0%, rgba(24,81,255,0) 100%);
    padding:0 0.1em;
  }
  .platform-wall-overlay-sub{
    margin-top:14px;max-width:540px;text-align:center;
    font:300 17px/1.30 var(--font-serif);color:rgba(255,255,255,0.78);text-wrap:pretty;
    letter-spacing:0;
  }
  .platform-wall-corners{
    position:absolute;inset:14px;pointer-events:none;
    border:1px solid rgba(24,81,255,0.18);
    border-radius:10px;
  }
  .platform-wall-corners::before,
  .platform-wall-corners::after{
    content:"";position:absolute;width:14px;height:14px;
    border:1.5px solid var(--gs-jade);
  }
  .platform-wall-corners::before{top:-2px;left:-2px;border-right:none;border-bottom:none}
  .platform-wall-corners::after{bottom:-2px;right:-2px;border-left:none;border-top:none}

  .platform-stats{
    margin-top:28px;display:grid;grid-template-columns:repeat(4,1fr);
    border:1px solid rgba(255,255,255,0.08);border-radius:4px;overflow:hidden;
    background:rgba(255,255,255,0.015);
  }
  .platform-stat{padding:22px 26px;border-right:1px solid rgba(255,255,255,0.08)}
  .platform-stat:last-child{border-right:none}
  .platform-stat-n{
    font:400 28px/1.00 var(--font-sans);color:#fff;letter-spacing:-0.04em;
    display:flex;align-items:baseline;gap:4px;
  }
  .platform-stat-n sup{font-size:0.55em;color:var(--gs-jade);font-weight:500;letter-spacing:0;top:-0.9em}
  .platform-stat-k{
    margin-top:8px;font:500 10px/1.2 var(--font-mono);letter-spacing:0.22em;
    text-transform:uppercase;color:rgba(255,255,255,0.45);
  }

  @media (max-width: 820px){
    .platform-wall-overlay-h{font-size:30px}
    .platform-stats{grid-template-columns:repeat(2,1fr)}
    .platform-stat{border-right:1px solid rgba(255,255,255,0.08);border-bottom:1px solid rgba(255,255,255,0.08)}
    .platform-stat:nth-child(2n){border-right:none}
    .platform-stat:nth-last-child(-n+2){border-bottom:none}
  }

  /* ---- ViT (Vision Transformer) visualization ------------------------- */
  .vit{
    margin-top:48px;
    border-radius:14px;
    background:#1a1c22;
    border:1px solid rgba(255,255,255,0.07);
    overflow:hidden;
    position:relative;
  }
  .vit-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 20px;
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .vit-head-l{display:flex;align-items:center;gap:10px}
  .vit-live-dot{
    width:8px;height:8px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 10px rgba(24,81,255,0.8);
    animation:pulse 1.6s ease-in-out infinite;
  }
  .vit-head-k,.vit-head-model{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.7);
  }
  .vit-head-model{color:var(--gs-jade)}

  /* monochromatic override: model label → neutral */
  .vit .vit-head-model{color:rgba(255,255,255,0.55)}

  .vit-stage{
    position:relative;
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:0;
    min-height:540px;
    background:
      radial-gradient(circle at 50% 50%, rgba(24,81,255,0.04), transparent 60%),
      #1a1c22;
  }
  /* connectors between the three columns */
  .vit-stage::before,
  .vit-stage::after{
    content:"";position:absolute;top:50%;
    width:40px;height:1px;
    background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.38), rgba(255,255,255,0));
    pointer-events:none;z-index:2;
  }
  .vit-stage::before{ left:calc(35% - 20px); }
  .vit-stage::after { left:calc(67% - 20px); }

  .vit-input{
    position:relative;padding:22px 18px 22px 22px;
    display:flex;flex-direction:column;
  }
  .vit-input-label,
  .vit-block-label,
  .vit-output-label{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.5);margin-bottom:14px;
  }
  .vit-input-frame{
    position:relative;flex:1;
    border-radius:8px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.08);
    box-shadow:0 20px 60px rgba(0,0,0,0.5);
  }
  .vit-photo{
    position:absolute;inset:0;width:100%;height:100%;
    object-fit:cover;
    filter:saturate(0.85) brightness(0.78);
  }
  .vit-patches{
    position:absolute;inset:0;
    display:grid;
    grid-template-columns:repeat(8, 1fr);
    grid-template-rows:repeat(11, 1fr);
    gap:0;
    pointer-events:none;
  }
  .vit-patches::before{
    content:"";position:absolute;inset:0;
    background:
      linear-gradient(to right, rgba(255,255,255,0.09) 1px, transparent 1px) 0 0 / 12.5% 100%,
      linear-gradient(to bottom, rgba(255,255,255,0.09) 1px, transparent 1px) 0 0 / 100% 9.09%;
    pointer-events:none;
  }
  .vit-patch-cell{
    position:relative;border:1px solid transparent;
  }
  .vit-patch-cell.attn{
    border-color:rgba(24,81,255,0.85);
    box-shadow:0 0 0 1px rgba(24,81,255,0.3), inset 0 0 14px rgba(24,81,255,0.25);
    background:rgba(24,81,255,0.08);
  }
  .vit-patch-cell.attn-mid{
    border-color:rgba(24,81,255,0.4);
    background:rgba(24,81,255,0.03);
  }
  .vit-patch-cell.dim{background:rgba(5,6,7,0.55)}

  .vit-attn-svg{
    position:absolute;inset:0;width:100%;height:100%;
    pointer-events:none;z-index:3;
  }
  .vit-attn-path{
    stroke-dasharray:300;stroke-dashoffset:300;
    animation:vitDraw 1.4s ease-out forwards;
  }
  @keyframes vitDraw{to{stroke-dashoffset:0}}

  .vit-patch-tag{
    position:absolute;transform:translate(-50%,-50%);
    padding:5px 9px;border-radius:3px;
    background:rgba(10,11,13,0.96);
    border:1px solid rgba(24,81,255,0.6);
    color:var(--gs-jade);
    font:500 10px/1 var(--font-mono);letter-spacing:0.06em;
    display:flex;align-items:center;gap:7px;white-space:nowrap;
    z-index:4;
    box-shadow:0 4px 14px rgba(0,0,0,0.6), 0 0 12px rgba(24,81,255,0.22);
    opacity:1;
  }
  .vit-patch-tag b{font-weight:600;color:#fff;font-size:11px}
  .vit-patch-tag span{color:rgba(255,255,255,0.7);font-size:9px;letter-spacing:0.1em;text-transform:uppercase}
  .vit-patch-tag.dim{border-color:rgba(255,255,255,0.22);color:rgba(255,255,255,0.75)}
  .vit-patch-tag.dim b{color:rgba(255,255,255,0.9)}
  .vit-patch-tag:nth-of-type(1){animation-delay:0.8s}
  .vit-patch-tag:nth-of-type(2){animation-delay:1.1s}
  .vit-patch-tag:nth-of-type(3){animation-delay:1.4s}
  .vit-patch-tag:nth-of-type(4){animation-delay:1.7s}
  .vit-patch-tag:nth-of-type(5){animation-delay:2.0s}
  .vit-patch-tag:nth-of-type(6){animation-delay:2.3s}
  @keyframes vitFadeIn{to{opacity:1}}

  .vit-block{
    position:relative;padding:22px 16px;
    display:flex;flex-direction:column;align-items:center;
    border-left:1px solid rgba(255,255,255,0.05);
    border-right:1px solid rgba(255,255,255,0.05);
  }
  .vit-block-box{
    width:100%;max-width:200px;
    padding:14px 12px;border-radius:8px;
    background:linear-gradient(180deg, rgba(24,81,255,0.05), rgba(24,81,255,0.01));
    border:1px solid rgba(24,81,255,0.25);
    display:flex;flex-direction:column;gap:10px;
    position:relative;overflow:hidden;
  }
  .vit-block-box::before{
    content:"";position:absolute;left:0;right:0;height:1px;
    background:linear-gradient(90deg, transparent, rgba(24,81,255,0.55), transparent);
    animation:vitScan 2.6s ease-in-out infinite;
  }
  @keyframes vitScan{
    0%,100%{top:12%;opacity:0.7}
    50%{top:85%;opacity:1}
  }
  .vit-layer{display:flex;flex-direction:column;gap:6px}
  .vit-layer-k{
    font:500 9px/1 var(--font-mono);letter-spacing:0.16em;text-transform:uppercase;
    color:rgba(255,255,255,0.55);
  }
  .vit-heads{display:grid;grid-template-columns:repeat(6,1fr);gap:3px}
  .vit-head-cell{
    height:14px;border-radius:2px;background:rgba(255,255,255,0.08);
  }
  .vit-head-cell.on{
    background:var(--gs-jade);
    box-shadow:0 0 6px rgba(24,81,255,0.6);
    animation:vitHeadPulse 2s ease-in-out infinite;
  }
  .vit-head-cell.on:nth-child(3){animation-delay:0.3s}
  .vit-head-cell.on:nth-child(5){animation-delay:0.6s}
  .vit-head-cell.on:nth-child(7){animation-delay:0.9s}
  .vit-head-cell.on:nth-child(9){animation-delay:1.2s}
  .vit-head-cell.on:nth-child(11){animation-delay:1.5s}
  @keyframes vitHeadPulse{
    0%,100%{opacity:0.55;box-shadow:0 0 4px rgba(24,81,255,0.4)}
    50%{opacity:1;box-shadow:0 0 10px rgba(24,81,255,0.8)}
  }
  .vit-layer-divider{height:1px;background:rgba(255,255,255,0.06);position:relative}
  .vit-layer-divider::before{
    content:"";position:absolute;left:50%;top:-3px;
    width:7px;height:7px;border-radius:50%;
    background:var(--gs-jade);box-shadow:0 0 6px rgba(24,81,255,0.6);
    transform:translateX(-50%);
  }
  .vit-bars{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;height:16px;align-items:end}
  .vit-bars span{background:rgba(24,81,255,0.55);border-radius:1px}
  .vit-bars span:nth-child(1){height:40%}
  .vit-bars span:nth-child(2){height:85%}
  .vit-bars span:nth-child(3){height:55%}
  .vit-bars span:nth-child(4){height:92%}
  .vit-bars span:nth-child(5){height:48%}
  .vit-bars span:nth-child(6){height:72%}
  .vit-bars span:nth-child(7){height:95%}
  .vit-bars span:nth-child(8){height:62%}
  .vit-stack{display:flex;flex-direction:column;gap:2px}
  .vit-stack span{height:3px;background:rgba(24,81,255,0.25);border-radius:1px}
  .vit-stack span:nth-child(odd){background:rgba(24,81,255,0.5)}

  .vit-block-arrow{
    margin-top:14px;width:1px;flex:1;min-height:40px;
    background:linear-gradient(180deg,var(--gs-jade),transparent);
    position:relative;
  }
  .vit-block-arrow::after{
    content:"";position:absolute;left:-4px;bottom:-2px;
    width:8px;height:8px;transform:rotate(45deg);
    border-right:1px solid var(--gs-jade);
    border-bottom:1px solid var(--gs-jade);
  }

  
  /* ---- Token panel (middle column — "the patch as numbers") ---- */
  .vit-token{
    position:relative;
    padding:40px 28px;
    display:flex;flex-direction:column;justify-content:center;align-items:center;gap:22px;
    border-left:1px dashed rgba(255,255,255,0.08);
    border-right:1px dashed rgba(255,255,255,0.08);
  }
  .vit-token-label{
    font:500 10px/1 var(--font-mono);letter-spacing:0.24em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
  }
  .vit-token-thumb{
    position:relative;
    width:132px;height:132px;
    border:1px solid rgba(255,255,255,0.22);
    box-shadow:
      0 0 0 1px rgba(0,0,0,0.5),
      0 20px 40px rgba(0,0,0,0.55),
      inset 0 0 0 1px rgba(255,255,255,0.06);
    overflow:hidden;
    /* crop centered on the foliage tree-canopy area of the driveway image */
    background-image:url('../img/raven-geoest-driveway.jpg');
    background-repeat:no-repeat;
    background-size:500px auto;
    background-position:-244px -75px;
    filter:contrast(1.05) saturate(0.9);
  }
  .vit-token-thumb img{ display:none; }
  .vit-token-thumb-id{
    position:absolute;top:8px;left:8px;
    font:500 9px/1 var(--font-mono);letter-spacing:0.22em;
    color:rgba(255,255,255,0.85);
    padding:4px 7px;background:rgba(0,0,0,0.75);
    border:1px solid rgba(255,255,255,0.14);
  }
  .vit-token-feature{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.65);
    display:flex;align-items:center;gap:10px;
  }
  .vit-token-feature b{
    color:#fff;font-weight:500;font-variant-numeric:tabular-nums;
  }

  .vit-token-arrow{
    width:1px;height:18px;background:rgba(255,255,255,0.3);
    position:relative;
  }
  .vit-token-arrow::after{
    content:"";position:absolute;bottom:-1px;left:-3px;
    border-left:4px solid transparent;border-right:4px solid transparent;
    border-top:6px solid rgba(255,255,255,0.45);
  }

  /* the 8×8 heatmap = a slice of the 768-dim embedding rendered as a value grid */
  .vit-token-vec{
    width:100%;max-width:260px;
  }
  .vit-token-vec-head{
    display:flex;justify-content:space-between;align-items:baseline;
    font:500 9px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.42);
    margin-bottom:10px;
  }
  .vit-token-vec-head b{color:rgba(255,255,255,0.75);font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:0.18em;}
  .vit-heatmap{
    display:grid;grid-template-columns:repeat(8, 1fr);
    gap:2px;
    aspect-ratio:8 / 4;
  }
  .vit-heatmap .cell{
    background:rgba(255,255,255,0.06);
    position:relative;
  }
  .vit-heatmap .cell::after{
    content:"";position:absolute;inset:0;
    background:#fff;opacity:var(--v,0);
  }
  .vit-token-vec-foot{
    margin-top:10px;
    font:500 9px/1 var(--font-mono);letter-spacing:0.18em;
    color:rgba(255,255,255,0.42);
    display:flex;justify-content:space-between;
    font-variant-numeric:tabular-nums;
  }

  /* nearest-neighbor panel */
  .vit-token-nn{
    width:100%;max-width:260px;
    padding-top:16px;border-top:1px solid rgba(255,255,255,0.08);
  }
  .vit-token-nn-k{
    font:500 9px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.42);margin-bottom:10px;
  }
  .vit-nn-list{
    list-style:none;margin:0;padding:0;
    display:flex;flex-direction:column;gap:7px;
  }
  .vit-nn-item{
    display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:10px;
    font:400 12px/1 var(--font-sans);
    color:rgba(255,255,255,0.82);
  }
  .vit-nn-item .d{
    font:500 10px/1 var(--font-mono);letter-spacing:0.12em;
    color:rgba(255,255,255,0.55);font-variant-numeric:tabular-nums;
  }
  .vit-nn-item.top .d{color:var(--gs-jade);}

  @media (max-width: 980px){
    .vit-stage{ grid-template-columns:1fr; min-height:0; }
    .vit-input-frame{ aspect-ratio: 4 / 3; flex:0 0 auto; }
    .vit-output{ padding:22px; }
    .vit-token{ border-left:0;border-right:0;border-top:1px dashed rgba(255,255,255,0.08);border-bottom:1px dashed rgba(255,255,255,0.08); }
    .vit-stage::before, .vit-stage::after{ display:none; }
  }

  .vit-output{
    position:relative;padding:22px 22px 22px 18px;
    display:flex;flex-direction:column;
  }
  .vit-output-card{
    flex:1;padding:16px 16px 18px;border-radius:8px;
    background:rgba(24,81,255,0.04);
    border:1px solid rgba(24,81,255,0.35);
    box-shadow:0 12px 40px rgba(0,0,0,0.4), inset 0 0 20px rgba(24,81,255,0.05);
    display:flex;flex-direction:column;gap:14px;
  }
  .vit-out-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);margin-bottom:6px;
  }
  .vit-out-coord{padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,0.08)}
  .vit-out-v{
    font:500 20px/1.25 var(--font-mono);letter-spacing:0.02em;
    color:var(--gs-jade);
  }
  .vit-out-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .vit-out-v2{font:500 15px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.005em}
  .vit-out-conf{margin-top:4px}
  .vit-out-conf-bar{
    height:4px;background:rgba(255,255,255,0.06);border-radius:2px;overflow:hidden;
  }
  .vit-out-conf-fill{
    width:0;height:100%;background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.6);
    animation:vitFill 1.4s 1.2s ease-out forwards;
  }
  @keyframes vitFill{to{width:94%}}
  .vit-out-conf-meta{
    display:flex;align-items:baseline;justify-content:space-between;margin-top:8px;
  }
  .vit-out-conf-meta span{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
  }
  .vit-out-conf-meta b{
    font:500 24px/1 var(--font-sans);color:var(--gs-jade);letter-spacing:-0.02em;
  }

  /* Ranked neighborhoods list — same vocabulary as the main output fields */
  .vit-out-divider{
    margin-top:16px;height:1px;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,0.08), transparent);
  }
  .vit-out-hoods{margin-top:14px}
  .vit-out-hoods-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);margin-bottom:12px;
  }
  .vit-hoods-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
  .vit-hood{
    display:grid;grid-template-columns:1fr auto;
    align-items:baseline;gap:12px;
    padding-bottom:9px;
    border-bottom:1px solid rgba(255,255,255,0.04);
  }
  .vit-hood:last-child{border-bottom:none;padding-bottom:0}
  .vit-hood-name{
    font:500 15px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.005em;
  }
  .vit-hood-pct{
    font:500 15px/1.2 var(--font-sans);letter-spacing:-0.01em;
    color:rgba(255,255,255,0.55);
  }
  .vit-hood.top .vit-hood-pct{color:var(--gs-jade)}
  /* fade-in on reveal, staggered — matches main card cadence */
  .vit-hood{opacity:0;animation:vitHoodIn 0.6s ease-out forwards;animation-delay:1.6s}
  .vit-hood:nth-child(2){animation-delay:1.75s}
  .vit-hood:nth-child(3){animation-delay:1.9s}
  .vit-hood:nth-child(4){animation-delay:2.05s}
  @keyframes vitHoodIn{to{opacity:1}}
  .vit-output-tag{
    margin-top:14px;
    display:flex;align-items:center;gap:8px;
    padding:8px 12px;border-radius:3px;
    background:rgba(255,255,255,0.02);
    border:1px solid rgba(255,255,255,0.08);
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    color:rgba(255,255,255,0.55);
  }
  .vit-otag-dot{
    width:6px;height:6px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 6px rgba(24,81,255,0.6);
  }

  .vit-tick{position:absolute;width:12px;height:12px;z-index:5;pointer-events:none}
  .vit-tick.tl{top:10px;left:10px;border-top:1px solid rgba(24,81,255,0.45);border-left:1px solid rgba(24,81,255,0.45)}
  .vit-tick.tr{top:10px;right:10px;border-top:1px solid rgba(24,81,255,0.45);border-right:1px solid rgba(24,81,255,0.45)}
  .vit-tick.bl{bottom:10px;left:10px;border-bottom:1px solid rgba(24,81,255,0.45);border-left:1px solid rgba(24,81,255,0.45)}
  .vit-tick.br{bottom:10px;right:10px;border-bottom:1px solid rgba(24,81,255,0.45);border-right:1px solid rgba(24,81,255,0.45)}

  .vit-foot{
    display:flex;align-items:center;justify-content:space-between;gap:24px;
    padding:18px 22px;
    border-top:1px solid rgba(255,255,255,0.06);
    background:rgba(255,255,255,0.015);
  }
  .vit-foot-k{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.55);
  }
  .vit-foot-v{
    font:500 18px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.01em;
  }
  .vit-foot-v em{font-style:normal;color:var(--gs-jade)}

  @media (max-width: 740px){
    .vit-stage{grid-template-columns:1fr;min-height:0}
    .vit-stage::after{display:none}
    .vit-block{border:none;border-top:1px solid rgba(255,255,255,0.05);border-bottom:1px solid rgba(255,255,255,0.05)}
  }

  /* ---- VIT monochromatic override -------------------------------------- */
  /* Blue is earned. Only the hero confidence %, the footer "Intelligence"
     word, and the single live dot get blue. Everything else → white/neutral. */

  /* Header bar — kill live-dot blue saturation, keep mono */
  .vit .vit-live-dot{
    background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.55);
  }
  .vit .vit-head-cell.on{
    background:rgba(255,255,255,0.65);
    box-shadow:0 0 6px rgba(255,255,255,0.25);
  }
  @keyframes vitHeadPulseMono{
    0%,100%{opacity:0.45;box-shadow:0 0 4px rgba(255,255,255,0.2)}
    50%{opacity:0.9;box-shadow:0 0 10px rgba(255,255,255,0.4)}
  }
  .vit .vit-head-cell.on{animation-name:vitHeadPulseMono}

  /* Input image: bounding boxes + attention beams — all white */
  .vit .vit-patch-cell.attn{
    border-color:rgba(255,255,255,0.85);
    box-shadow:0 0 0 1px rgba(255,255,255,0.2), inset 0 0 14px rgba(255,255,255,0.1);
    background:rgba(255,255,255,0.04);
  }
  .vit .vit-patch-cell.attn-mid{
    border-color:rgba(255,255,255,0.35);
    background:rgba(255,255,255,0.015);
  }
  .vit .vit-patch-tag{
    border-color:rgba(255,255,255,0.35);
    color:rgba(255,255,255,0.9);
    box-shadow:0 4px 14px rgba(0,0,0,0.6);
  }
  .vit .vit-patch-tag b{color:#fff}
  .vit .vit-patch-tag span{color:rgba(255,255,255,0.6)}

  /* Output card — strip blue wash, tighten border to hairline */
  .vit .vit-output-card{
    background:rgba(255,255,255,0.015);
    border-color:rgba(255,255,255,0.08);
    box-shadow:0 12px 40px rgba(0,0,0,0.4);
  }
  /* Coordinate numbers → white mono */
  .vit .vit-out-coord .vit-out-v{color:#fff}
  /* Region/radius values are already white, leave them */

  /* Confidence: keep BLUE on the big 94% and the fill bar — this is the hero metric */
  .vit .vit-out-conf-meta b{color:var(--gs-jade)}
  .vit .vit-out-conf-fill{
    background:var(--gs-jade);
    box-shadow:0 0 8px rgba(24,81,255,0.55);
  }

  /* Neighborhood list → all white/neutral, including the top rank */
  .vit .vit-hood.top .vit-hood-pct{color:#fff}
  .vit .vit-hood-pct{color:rgba(255,255,255,0.55)}

  /* Output tag (NO METADATA · NO LANDMARKS · NO TEXT) */
  .vit .vit-otag-dot{
    background:rgba(255,255,255,0.7);
    box-shadow:0 0 6px rgba(255,255,255,0.3);
  }

  /* Corner brackets → white hairlines */
  .vit .vit-tick.tl{border-top-color:rgba(255,255,255,0.28);border-left-color:rgba(255,255,255,0.28)}
  .vit .vit-tick.tr{border-top-color:rgba(255,255,255,0.28);border-right-color:rgba(255,255,255,0.28)}
  .vit .vit-tick.bl{border-bottom-color:rgba(255,255,255,0.28);border-left-color:rgba(255,255,255,0.28)}
  .vit .vit-tick.br{border-bottom-color:rgba(255,255,255,0.28);border-right-color:rgba(255,255,255,0.28)}

  /* Footer — "Fragments in. Intelligence out." — keep neutral */
  .vit .vit-foot-v em{color:#fff;font-style:normal;font-weight:500}

  /* Middle connector block (attention beams / bars / stack / arrow) → white */
  .vit .vit-layer-divider::before{
    background:rgba(255,255,255,0.6);
    box-shadow:0 0 6px rgba(255,255,255,0.3);
  }
  .vit .vit-bars span{background:rgba(255,255,255,0.45)}
  .vit .vit-stack span{background:rgba(255,255,255,0.2)}
  .vit .vit-stack span:nth-child(odd){background:rgba(255,255,255,0.4)}
  .vit .vit-block-arrow{
    background:linear-gradient(180deg,rgba(255,255,255,0.45),transparent);
  }
  .vit .vit-block-arrow::after{
    border-right-color:rgba(255,255,255,0.45);
    border-bottom-color:rgba(255,255,255,0.45);
  }
  /* Attention SVG paths already use a gradient; override via gradient stops
     isn't practical, so dim the whole SVG to neutral */
  .vit .vit-attn-svg{filter:grayscale(1) brightness(1.4) opacity(0.7)}

  /* Platform + ViT demo — mobile (matches §01 / “Every pixel carries a clue.”) */
  @media (max-width: 700px){
    .section.platform{
      padding-top:16px;
      padding-bottom:48px;
    }
    .section.platform .section-eyebrow{
      flex-wrap:wrap;
      align-items:flex-start;
      justify-content:flex-start;
      gap:10px 14px;
      margin-bottom:18px;
      padding-bottom:12px;
    }
    .section.platform .section-eyebrow .sect-label{
      white-space:normal;
      overflow:visible;
      text-overflow:clip;
      line-height:1.4;
    }
    .section.platform .section-h{
      font-size:clamp(28px, 8.2vw, 40px);
      line-height:1.06;
      max-width:none;
    }
    .section.platform .section-sub{
      font-size:17px;
      line-height:1.38;
      margin-top:14px;
    }
    .section.platform .platform-sub2{
      margin-top:10px;
      font-size:16px;
      line-height:1.38;
    }
    .section.platform .vit{
      margin-top:26px;
      border-radius:12px;
    }
    .section.platform .vit-head{
      flex-direction:column;
      align-items:flex-start;
      gap:8px;
      padding:12px 14px;
    }
    .section.platform .vit-head-l,
    .section.platform .vit-head-r{
      width:100%;
      min-width:0;
    }
    .section.platform .vit-head-k,
    .section.platform .vit-head-model{
      font-size:10px;
      letter-spacing:0.12em;
      line-height:1.35;
      white-space:normal;
      word-break:break-word;
    }
    .section.platform .vit-stage{min-height:0}
    .section.platform .vit-input{
      padding:12px 12px 14px;
    }
    .section.platform .vit-input-frame{
      height:auto;
      min-height:0;
      flex:0 0 auto;
      width:100%;
      aspect-ratio:3/4;
      max-height:min(420px, 70vh);
    }
    .section.platform .vit-output{
      padding:14px 12px 18px;
    }
    .section.platform .vit-output-card{
      padding:12px 12px 14px;
      gap:11px;
    }
    .section.platform .vit-out-v{
      font-size:16px;
    }
    .section.platform .vit-out-v2{
      font-size:14px;
    }
    .section.platform .vit-out-conf-meta b{
      font-size:19px;
    }
    .section.platform .vit-hood-name,
    .section.platform .vit-hood-pct{
      font-size:14px;
    }
    .section.platform .vit-output-tag{
      white-space:normal;
      font-size:9px;
      letter-spacing:0.1em;
      line-height:1.45;
      align-items:flex-start;
    }
    .section.platform .vit-patch-tag{
      padding:4px 6px;
      gap:4px;
      max-width:min(150px, 48vw);
      white-space:normal;
      flex-wrap:wrap;
      align-items:flex-start;
    }
    .section.platform .vit-patch-tag b{font-size:10px}
    .section.platform .vit-patch-tag span{
      font-size:8px;
      letter-spacing:0.05em;
      line-height:1.25;
    }
    .section.platform .vit-foot{
      flex-direction:column;
      align-items:flex-start;
      justify-content:flex-start;
      gap:6px;
      padding:14px 16px;
    }
    .section.platform .vit-foot-k{
      font-size:9px;
      letter-spacing:0.16em;
    }
    .section.platform .vit-foot-v{
      font-size:15px;
      line-height:1.35;
    }
  }

  /* ---- Case file triptych (Sources → Raven → Leads) -------------------- */
  .vcase{margin-top:56px;display:flex;flex-direction:column;align-items:center}
  .vcase-triptych{
    width:100%;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:stretch;
    gap:0;
    max-width:1200px;
  }

  .vcase-panel{
    border-radius:14px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.1);
    background:var(--gs-chrome);
    box-shadow:0 20px 50px rgba(0,0,0,0.4);
    display:flex;flex-direction:column;min-height:420px;
  }
  .vcase-panel-head{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:12px 16px;
    border-bottom:1px solid rgba(255,255,255,0.06);
  }
  .vcase-panel-k{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.55);
  }
  .vcase-panel-badge{
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    color:rgba(255,255,255,0.4);
    padding:4px 8px;border-radius:4px;
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.08);
    white-space:nowrap;
  }
  .vcase-panel-body{
    flex:1;padding:10px;display:flex;flex-direction:column;gap:8px;
    background:#1a1c22;
  }
  .vcase-panel-foot{
    padding:10px 16px;
    font:400 11px/1.4 var(--font-mono);color:rgba(255,255,255,0.45);
    border-top:1px solid rgba(255,255,255,0.06);
    letter-spacing:0.04em;
  }

  /* Source chip */
  .src-chip{
    display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;
    padding:10px 12px;border-radius:8px;
    background:rgba(255,255,255,0.03);
    border:1px solid rgba(255,255,255,0.06);
    transition:border-color 0.3s, background 0.3s;
  }
  .src-chip.pulse{
    border-color:rgba(24,81,255,0.4);
    background:rgba(24,81,255,0.06);
  }
  .src-chip-icon{
    width:28px;height:28px;border-radius:6px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.1);
    display:flex;align-items:center;justify-content:center;
    font:500 9px/1 var(--font-mono);letter-spacing:0.05em;
    color:rgba(255,255,255,0.7);
  }
  .src-chip-icon.geo{color:var(--gs-jade);background:rgba(24,81,255,0.08);border-color:rgba(24,81,255,0.3)}
  .src-chip-icon.car{color:#1851FF;background:rgba(142,188,255,0.08);border-color:rgba(142,188,255,0.28)}
  .src-chip-icon.op{color:#FFFFFF;background:rgba(255,199,142,0.08);border-color:rgba(255,199,142,0.28)}
  .src-chip-icon.tip{color:rgba(255,255,255,0.7)}
  .src-chip-mid{display:flex;flex-direction:column;gap:3px;min-width:0}
  .src-chip-title{
    font:500 13px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.005em;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .src-chip-meta{
    font:500 10px/1 var(--font-mono);letter-spacing:0.08em;color:rgba(255,255,255,0.45);
  }
  .src-chip-conf{
    font:500 11px/1 var(--font-mono);letter-spacing:0.04em;
    color:var(--gs-jade);
    padding:5px 8px;border-radius:4px;background:rgba(24,81,255,0.08);
    white-space:nowrap;
  }
  .src-chip-conf.warn{color:#FFFFFF;background:rgba(255,199,142,0.08)}
  .src-chip-conf.neutral{color:rgba(255,255,255,0.5);background:rgba(255,255,255,0.04)}

  /* Lead row */
  .lead-row{
    display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;
    padding:12px 14px;border-radius:8px;
    background:rgba(255,255,255,0.03);
    border:1px solid rgba(255,255,255,0.06);
    position:relative;
  }
  .lead-row.top{
    background:rgba(24,81,255,0.06);
    border-color:rgba(24,81,255,0.35);
    box-shadow:0 0 0 1px rgba(24,81,255,0.15), inset 0 0 30px rgba(24,81,255,0.04);
  }
  .lead-row-rank{
    width:34px;height:34px;border-radius:8px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.1);
    display:flex;align-items:center;justify-content:center;
    font:500 14px/1 var(--font-sans);color:#fff;
  }
  .lead-row.top .lead-row-rank{
    background:rgba(24,81,255,0.18);
    border-color:rgba(24,81,255,0.5);
    color:var(--gs-jade);
  }
  .lead-row-mid{display:flex;flex-direction:column;gap:4px;min-width:0}
  .lead-row-h{
    font:500 14px/1.2 var(--font-sans);color:#fff;letter-spacing:-0.005em;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .lead-row-p{
    font:500 11px/1.3 var(--font-mono);letter-spacing:0.04em;
    color:rgba(255,255,255,0.5);
  }
  .lead-row-conf{
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    padding:6px 8px;border-radius:4px;
    color:rgba(255,255,255,0.5);
    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.08);
    white-space:nowrap;
  }
  .lead-row.top .lead-row-conf{
    color:var(--gs-jade);
    background:rgba(24,81,255,0.1);
    border-color:rgba(24,81,255,0.35);
  }

  /* Reuse vmodel-analyze middle connector styling via wrapper class */
  .vcase-analyze{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    padding:0 32px;min-width:240px;position:relative;
  }

  @media (max-width: 900px){
    .vcase-triptych{grid-template-columns:1fr;gap:16px}
    .vcase-analyze{padding:16px 0}
    .vcase-panel{min-height:0}
  }

  /* ---- Experimental · Signal graph ------------------------------------- */
  .sgraph{
    margin-top:40px;
    border-radius:14px;
    background:
      radial-gradient(circle at 30% 65%, rgba(24,81,255,0.06), transparent 55%),
      radial-gradient(circle at 70% 35%, rgba(255,255,255,0.045), transparent 55%),
      #1a1c22;
    border:1px solid rgba(255,255,255,0.07);
    overflow:hidden;
    position:relative;
  }
  .sgraph-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 20px;
    border-bottom:1px solid rgba(255,255,255,0.06);
    background:rgba(255,255,255,0.015);
  }
  .sgraph-head-l{display:flex;align-items:center;gap:10px}
  .sgraph-live-dot{
    width:8px;height:8px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 10px rgba(24,81,255,0.8);
    animation:pulse 1.6s ease-in-out infinite;
  }
  .sgraph-head-k{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.7);
  }
  .sgraph-head-r{display:flex;align-items:center;gap:10px}
  .sgraph-legend-chip{
    display:inline-flex;align-items:center;gap:7px;
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;text-transform:uppercase;
    padding:5px 9px;border-radius:3px;
    color:rgba(255,255,255,0.6);
    border:1px solid rgba(255,255,255,0.1);
  }
  .sgraph-legend-chip span{
    width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,0.4);
  }
  .sgraph-legend-chip.jade{color:var(--gs-jade);border-color:rgba(24,81,255,0.35)}
  .sgraph-legend-chip.jade span{background:var(--gs-jade);box-shadow:0 0 6px rgba(24,81,255,0.8)}
  .sgraph-legend-chip.amber{color:var(--gs-amber);border-color:rgba(255,255,255,0.35)}
  .sgraph-legend-chip.amber span{background:var(--gs-amber);box-shadow:0 0 6px rgba(255,255,255,0.7)}
  .sgraph-legend-chip.dim span{background:rgba(255,255,255,0.3)}

  .sgraph-stage{
    position:relative;
    aspect-ratio: 1100 / 560;
    width:100%;
    overflow:hidden;
  }
  .sgraph-svg{
    position:absolute;inset:0;width:100%;height:100%;
  }

  /* sweep */
  .sg-sweep{
    transform:translateX(-40px);
    animation:sgSweep 6.5s linear infinite;
  }
  @keyframes sgSweep{
    0%{transform:translateX(-40px)}
    100%{transform:translateX(1140px)}
  }

  /* cluster entrance */
  .sg-cluster .sg-ring{
    transform-origin:center;transform-box:fill-box;
    animation:sgRing 4s ease-in-out infinite;
  }
  @keyframes sgRing{
    0%,100%{opacity:0.55}
    50%{opacity:1}
  }
  .sg-cluster-1{animation:sgFadeIn 1s 0.2s both}
  .sg-cluster-2{animation:sgFadeIn 1s 0.5s both}
  .sg-outlier{animation:sgFadeIn 1s 0.8s both}
  @keyframes sgFadeIn{from{opacity:0}to{opacity:1}}

  .sg-link{
    stroke-dasharray:160;stroke-dashoffset:160;
    animation:sgDraw 1.4s 0.6s ease-out forwards;
  }
  @keyframes sgDraw{to{stroke-dashoffset:0}}

  .sg-dist{opacity:0;animation:sgFadeIn 0.6s 1.8s forwards}

  /* labels */
  .sg-label-k{
    font:500 10.5px/1 var(--font-mono);letter-spacing:0.22em;
    fill:var(--gs-jade);
    filter:drop-shadow(0 0 4px rgba(24,81,255,0.35));
  }
  .sg-label-k.amber{fill:var(--gs-amber);filter:drop-shadow(0 0 4px rgba(255,255,255,0.3))}
  .sg-label-k.dim{fill:rgba(255,255,255,0.5)}
  .sg-dist-t{
    font:500 11px/1 var(--font-mono);letter-spacing:0.08em;
    fill:var(--gs-jade);
  }
  .sg-dist-t.amber{fill:var(--gs-amber)}

  /* ---- Nodes (DOM badges over SVG) ---- */
  .sg-node{
    position:absolute;transform:translate(-50%,-50%);
    display:flex;align-items:center;justify-content:center;
    z-index:3;
  }
  .sg-node-icon{
    width:46px;height:46px;border-radius:9px;
    display:flex;align-items:center;justify-content:center;
    font:500 10px/1 var(--font-mono);letter-spacing:0.1em;
    border:1px solid rgba(255,255,255,0.16);
    background:rgba(10,11,13,0.92);
    color:rgba(255,255,255,0.9);
    backdrop-filter:blur(4px);
    position:relative;
    transition:transform 0.25s ease, box-shadow 0.25s ease;
  }
  .sg-node-icon.geo{color:var(--gs-jade);border-color:rgba(24,81,255,0.45);box-shadow:0 0 0 3px rgba(24,81,255,0.08), 0 0 24px rgba(24,81,255,0.25)}
  .sg-node-icon.car{color:#1851FF;border-color:rgba(142,188,255,0.5);box-shadow:0 0 0 3px rgba(142,188,255,0.08), 0 0 24px rgba(142,188,255,0.2)}
  .sg-node-icon.op{color:#FFFFFF;border-color:rgba(255,199,142,0.5);box-shadow:0 0 0 3px rgba(255,199,142,0.08), 0 0 24px rgba(255,199,142,0.18)}
  .sg-node-icon.tip{color:#FFFFFF;border-color:rgba(210,163,255,0.5);box-shadow:0 0 0 3px rgba(210,163,255,0.08), 0 0 24px rgba(210,163,255,0.18)}

  .sg-node.dim .sg-node-icon{
    opacity:0.45;filter:saturate(0.4);
    box-shadow:0 0 0 2px rgba(255,255,255,0.04);
  }

  .sg-node-tip{
    position:absolute;left:54px;top:50%;transform:translateY(-50%);
    white-space:nowrap;
    padding:7px 10px;border-radius:4px;
    background:rgba(10,11,13,0.96);
    border:1px solid rgba(255,255,255,0.1);
    opacity:0;pointer-events:none;
    transition:opacity 0.2s ease;
    font:400 12px/1.3 var(--font-sans);
    z-index:4;
  }
  .sg-node-tip b{display:block;color:#fff;font-weight:500;margin-bottom:2px}
  .sg-node-tip span{color:rgba(255,255,255,0.5);font-family:var(--font-mono);font-size:10px;letter-spacing:0.06em}
  .sg-node:hover .sg-node-tip{opacity:1}
  .sg-node:hover .sg-node-icon{transform:scale(1.08)}

  /* ---- Readout panel ---- */
  .sg-readout{
    position:absolute;right:18px;bottom:18px;
    width:280px;
    padding:12px 14px;border-radius:8px;
    background:rgba(10,11,13,0.88);
    border:1px solid rgba(255,255,255,0.1);
    backdrop-filter:blur(8px);
    z-index:5;
  }
  .sg-readout-h{
    display:flex;align-items:center;justify-content:space-between;
    padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,0.08);
    margin-bottom:8px;
  }
  .sg-readout-k{font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,0.55)}
  .sg-readout-v{font:500 11px/1 var(--font-mono);color:rgba(255,255,255,0.85)}
  .sg-readout-row{
    display:grid;grid-template-columns:1.3fr 0.8fr 0.6fr;
    gap:8px;align-items:center;
    padding:6px 0;
    font:500 11px/1 var(--font-mono);letter-spacing:0.04em;
    color:rgba(255,255,255,0.75);
    border-bottom:1px solid rgba(255,255,255,0.04);
  }
  .sg-readout-row:last-child{border-bottom:none}
  .sg-readout-row.top{color:var(--gs-jade)}
  .sg-readout-row.faded{color:rgba(255,255,255,0.35)}
  .sg-readout-pair{font-family:var(--font-mono);letter-spacing:0.06em}
  .sg-readout-pair sub{font-size:0.7em;vertical-align:baseline;color:rgba(255,255,255,0.45)}
  .sg-readout-dist{text-align:right;color:rgba(255,255,255,0.6)}
  .sg-readout-row.top .sg-readout-dist{color:#fff}
  .sg-readout-score{text-align:right}
  .sg-readout-row.top .sg-readout-score{color:var(--gs-jade);font-weight:500}

  /* corner ticks */
  .sg-tick{position:absolute;width:14px;height:14px;z-index:2;pointer-events:none}
  .sg-tick.tl{top:8px;left:8px;border-top:1px solid rgba(24,81,255,0.5);border-left:1px solid rgba(24,81,255,0.5)}
  .sg-tick.tr{top:8px;right:8px;border-top:1px solid rgba(24,81,255,0.5);border-right:1px solid rgba(24,81,255,0.5)}
  .sg-tick.bl{bottom:8px;left:8px;border-bottom:1px solid rgba(24,81,255,0.5);border-left:1px solid rgba(24,81,255,0.5)}
  .sg-tick.br{bottom:8px;right:8px;border-bottom:1px solid rgba(24,81,255,0.5);border-right:1px solid rgba(24,81,255,0.5)}

  /* foot */
  .sgraph-foot{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 20px;
    border-top:1px solid rgba(255,255,255,0.06);
    background:rgba(255,255,255,0.015);
  }
  .sgraph-foot-eq{display:flex;align-items:baseline;gap:10px}
  .sg-eq-k{font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,255,255,0.45)}
  .sg-eq-v{font:500 13px/1 var(--font-mono);letter-spacing:0.04em;color:rgba(255,255,255,0.88)}
  .sg-eq-op{color:rgba(255,255,255,0.3);padding:0 4px}
  .sgraph-foot-r{display:flex;gap:10px}
  .sg-foot-chip{
    font:500 11px/1 var(--font-mono);letter-spacing:0.14em;text-transform:uppercase;
    padding:6px 10px;border-radius:3px;
    color:rgba(255,255,255,0.7);border:1px solid rgba(255,255,255,0.12);
  }
  .sg-foot-chip b{font-weight:600;margin-right:5px}
  .sg-foot-chip.jade{color:var(--gs-jade);border-color:rgba(24,81,255,0.4);background:rgba(24,81,255,0.06)}
  .sg-foot-chip.dim{color:rgba(255,255,255,0.5)}

  @media (max-width: 900px){
    .sg-readout{display:none}
  }

/* ============================================================
     DOSSIER DESIGN — ported from Graylark Colorado One-Pager
     ============================================================ */

  /* ── § NN · LABEL section headers w/ hairline divider + ghost counter ── */
  .section-eyebrow{
    display:flex !important;
    align-items:flex-end;justify-content:space-between;
    padding-bottom:14px;margin-bottom:32px;
    border-bottom:1px solid rgba(255,255,255,0.14);
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.78);
    gap:20px;
  }
  .section-eyebrow .bar{display:none !important}
  .section-eyebrow .sect-label{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
  .section-eyebrow .sect-label .sym{color:rgba(255,255,255,0.55);font-weight:400}
  .section-eyebrow .sect-label .num{color:rgb(24,81,255);margin-right:4px;font-weight:500}
  .section-eyebrow .sect-label .sep{color:rgba(255,255,255,0.45);margin:0 2px;font-weight:400}
  .section-eyebrow .sect-count{display:none !important}

  /* ── capabilities index (compressed platform section) ── */
  .cap-index{
    margin-top:56px;
    display:grid;grid-template-columns:repeat(3,1fr);
    gap:1px;background:rgba(255,255,255,0.08);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:8px;overflow:hidden;
  }
  .cap-index-cell{
    display:flex;flex-direction:column;gap:14px;
    padding:36px 32px 32px;
    background:var(--gs-noir);
    text-decoration:none;color:inherit;
    transition:background 180ms ease;
    position:relative;min-height:260px;
  }
  .cap-index-cell:hover{background:#0d0f14}
  .cap-index-n{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;
    color:rgb(24,81,255);
  }
  .cap-index-k{
    font:500 11px/1 var(--font-mono);letter-spacing:0.22em;
    color:rgba(255,255,255,0.78);text-transform:uppercase;
    margin-top:-10px;
  }
  .cap-index-h{
    margin-top:6px;
    font:300 26px/1.15 var(--font-sans);letter-spacing:-0.018em;
    color:#fff;text-wrap:balance;
  }
  .cap-index-sub{
    margin-top:4px;
    font:300 15px/1.55 var(--font-serif);
    color:rgba(255,255,255,0.68);text-wrap:pretty;
    flex:1;
  }
  .cap-index-go{
    margin-top:10px;
    font:500 11px/1 var(--font-mono);letter-spacing:0.18em;
    color:rgba(255,255,255,0.85);text-transform:uppercase;
    padding-top:16px;border-top:1px solid rgba(255,255,255,0.08);
  }
  @media (max-width: 900px){
    .cap-index{grid-template-columns:1fr}
    .cap-index-cell{min-height:0}
  }

  /* ── blue-dash bullet list ── */
  ul.dash-list{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-direction:column;gap:10px}
  ul.dash-list li{position:relative;padding-left:22px;color:rgba(255,255,255,0.68);
    font:400 15px/1.5 var(--font-sans)}
  ul.dash-list li::before{content:"";position:absolute;left:0;top:11px;
    width:12px;height:1px;background:rgb(24,81,255)}
  ul.dash-list li b, ul.dash-list li strong{color:#fff;font-weight:500}

  /* ── pull-quote card ── */
  .pull-quote{
    display:grid;grid-template-columns:auto 1fr;gap:28px;
    padding:32px 36px;align-items:start;
    border:1px solid rgba(255,255,255,0.14);
    background:rgba(255,255,255,0.02);
    margin:28px 0;
  }
  .pull-quote .pq-label{
    font:500 10px/1 var(--font-mono);letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.6);
    padding:7px 12px;border:1px solid rgba(255,255,255,0.15);
    white-space:nowrap;align-self:start;
  }
  .pull-quote blockquote{
    margin:0;font:300 24px/1.3 var(--font-serif);color:#fff;
    letter-spacing:-0.01em;text-wrap:balance;
  }
  .pull-quote blockquote em{font-style:italic;color:rgb(24,81,255)}
  .pull-quote .pq-attr{
    margin-top:18px;font:500 10px/1.3 var(--font-mono);
    letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.5);
  }
  .pull-quote .pq-attr b{color:rgba(255,255,255,0.85);font-weight:500}

  /* ── dashed frame utility (around imagery / data cards) ── */
  .dossier-frame{
    position:relative;
  }
  .dossier-frame::before{
    content:"";position:absolute;inset:8px;pointer-events:none;
    border:1px dashed rgba(255,255,255,0.18);
  }
  .dossier-frame::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background-image:
      linear-gradient(to right, rgba(255,255,255,0.035) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size:18px 18px;z-index:0;
  }
  .dossier-frame > *{position:relative;z-index:1}

  /* ── redaction stripe decoration ── */
  .redaction-stripes{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}
  .redaction-stripes .stripe{position:absolute;left:-2%;right:-2%;background:rgb(24,81,255);opacity:0.92}
  .redaction-stripes .stripe.s1{top:28%;height:10px}
  .redaction-stripes .stripe.s2{top:48%;height:6px}
  .redaction-stripes .stripe.s3{top:68%;height:12px}

  /* ── HERO — dossier treatment ── */
  .hero .eyebrow{
    display:inline-flex !important;align-items:center;gap:14px !important;
    padding:0 !important;background:transparent !important;border:none !important;
    border-radius:0 !important;margin-bottom:32px !important;
    color:rgba(255,255,255,0.62) !important;
    font:500 11px/1 var(--font-mono) !important;letter-spacing:0.22em !important;
    text-transform:uppercase !important;
  }
  .hero .eyebrow .tick{display:inline-block;width:24px;height:1px;background:rgba(255,255,255,0.4)}
  .hero .eyebrow .slash{color:rgba(255,255,255,0.3);margin:0 2px;font-weight:400}

  .hero-h1 em{
    font-style:italic !important;
    color:rgb(24,81,255) !important;
    font-family:var(--font-serif) !important;
    font-weight:300 !important;
  }

  /* intel card */
  .intel-card{
    position:relative;aspect-ratio:4/5;max-height:560px;
    overflow:hidden;background:#0a0a0a;
    border:1px solid rgba(255,255,255,0.14);
  }
  .intel-card .intel-meta{
    position:absolute;left:14px;right:14px;top:12px;z-index:3;
    display:flex;justify-content:space-between;
    font:500 10px/1 var(--font-mono);letter-spacing:0.18em;
    color:#fff;text-transform:uppercase;
  }
  .intel-card .intel-meta .live{display:inline-flex;align-items:center;gap:7px}
  .intel-card .intel-meta .live::before{
    content:"";width:5px;height:5px;background:rgb(24,81,255);
    border-radius:50%;box-shadow:0 0 8px rgba(24,81,255,0.8);
  }
  .intel-card .intel-meta .rhs{color:rgba(255,255,255,0.65)}
  .intel-card .intel-readout{
    position:absolute;left:14px;right:14px;bottom:14px;z-index:3;
    display:grid;grid-template-columns:1fr auto;gap:5px 20px;
    font:500 10.5px/1.3 var(--font-mono);color:#fff;letter-spacing:0.04em;
  }
  .intel-card .intel-readout .k{color:rgba(255,255,255,0.55);text-transform:uppercase;
    letter-spacing:0.18em;font-size:9.5px}
  .intel-card .intel-readout .v{text-align:right}

  /* hero CTAs: thinner, more doc-like */
  .hero .btn{letter-spacing:0.04em}

  /* ── NAV — dossier metadata row ── */
  .nav.dossier-nav{
    padding-bottom:14px;
    border-bottom:1px solid rgba(255,255,255,0.12);
  }
  .nav-doc-meta{
    display:flex;gap:24px;align-items:center;
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.58);
  }
  .nav-doc-meta .slash{color:rgba(255,255,255,0.25);font-weight:400}
  .nav-doc-meta .hl{color:#fff;font-weight:500}

  /* mobile */
  @media (max-width:720px){
    .section-eyebrow{flex-wrap:wrap}
    .section-eyebrow .sect-count{font-size:22px}
    .pull-quote{grid-template-columns:1fr;gap:18px;padding:24px}
    .intel-card{max-height:440px}
  }

  /* ==== MONOCHROMATIC DISCIPLINE ===================================== */
  /* Blue reserved for LIVE / ACTIVE status indicators only.
     Everything below re-paints decorative uses back to neutral. */

  /* Hero eyebrow & section eyebrows — neutral */
  .eyebrow{color:rgba(255,255,255,0.55)}
  .eyebrow .dot{background:rgba(255,255,255,0.8); box-shadow:none}
  .section-eyebrow{color:rgba(255,255,255,0.78)}
  .section-eyebrow .sect-label .num{color:rgba(255,255,255,0.95)}

  /* KPI tick & glow — neutral */
  .hero-meta .kpi-eyebrow::before{background:rgba(255,255,255,0.8)}
  .hero-meta .kpi-n{text-shadow:none}

  /* Case hero chrome — neutral type */
  .case-hero{box-shadow:0 40px 100px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.06)}
  .case-hero-title{color:#fff}
  .case-hero-title::before{background:rgba(255,255,255,0.5)}

  /* CarID big number — neutral */
  .carid-match b{color:#fff}

  /* Geoest chrome — neutral (keep .geoest-badge.live blue) */
  .geoest-arrow{color:rgba(255,255,255,0.6); border-color:rgba(255,255,255,0.14)}
  .geoest-match b{color:#fff}

  /* vmodel analyze/output chrome — neutral */
  .vmodel-analyze-line{
    background:linear-gradient(to right,
      rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 50%,
      rgba(255,255,255,0) 100%) !important;
  }
  .vmodel-down-line{
    background:linear-gradient(to bottom,
      rgba(255,255,255,0) 0%, rgba(255,255,255,0.35) 50%,
      rgba(255,255,255,0) 100%) !important;
  }
  .vmodel-output-shot .pill::before{background:rgba(255,255,255,0.8)}
  .vmodel-output-meta .match b{color:#fff}
  .vmodel-analyze-label::before{background:rgba(255,255,255,0.8)}

  /* LGM lattice — keep mostly neutral, only the coord-pill stays blue as status */
  .lgm{
    background:
      radial-gradient(ellipse at 50% 50%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0) 60%),
      #1a1c22 !important;
  }
  .lgm-input-solo{border-color:rgba(255,255,255,0.14)}
  .lgm-ring{border-color:rgba(255,255,255,0.08) !important}
  .lgm-ring.r1{border-color:rgba(255,255,255,0.04) !important}
  .lgm-ring.r2{border-color:rgba(255,255,255,0.08) !important}
  .lgm-ring.r3{border-color:rgba(255,255,255,0.18) !important}
  .lgm-core-node{
    background:
      radial-gradient(circle at 35% 35%, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.06) 40%, rgba(255,255,255,0.01) 70%),
      #1a1c22 !important;
    box-shadow:
      0 0 40px rgba(255,255,255,0.08),
      inset 0 0 30px rgba(255,255,255,0.04) !important;
  }
  .lgm-core-label{color:rgba(255,255,255,0.75)}
  .lgm-lattice span{background:rgba(255,255,255,0.4) !important}
  .lgm-arrow-in, .lgm-arrow-out{
    background:linear-gradient(to right,
      rgba(255,255,255,0) 0%, rgba(255,255,255,0.55) 50%,
      rgba(255,255,255,0) 100%) !important;
  }

  /* Big percent counters & step numbers — neutral white */
  .perc-count{color:#fff}
  .step-num{color:rgba(255,255,255,0.8)}

  /* Proof / case statuses — keep blue (true status) */
  /* no override */

  /* Lineage er-eyebrow-tick — decorative, neutralize */
  .er-eyebrow-tick{background:rgba(255,255,255,0.8); box-shadow:none}
  .er-col-now{background:transparent}

  /* Nav hover — neutral */
  .nav-links > a.active::after,
  .nav-item.active > .nav-trigger::after{background:#fff}
  .nav-menu-row:hover{background:rgba(255,255,255,0.04)}
  .nav-menu-glyph{color:rgba(255,255,255,0.75)}
  .nav-menu-row:hover .nav-menu-glyph{background:rgba(255,255,255,0.08)}
  /* Percent labels — keep the LIVE iris variant blue, neutralize the default */
  .perc-label .dot-mini{background:rgba(255,255,255,0.8)}
  .perc-label.iris .dot-mini{background:var(--gs-iris)}

  /* ==== END MONOCHROMATIC DISCIPLINE ================================= */

  /* ==== LINEAGE ANIMATION =========================================== */
  /* Keyframe-based. Animation only runs when .is-animated applied. */

  /* Eyebrow rises in */
  @keyframes er-eb-in { from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:none} }
  .lineage .er-eyebrow{opacity:0}
  .lineage.is-animated .er-eyebrow{
    animation: er-eb-in .6s cubic-bezier(.2,.7,.2,1) forwards;
  }

  /* Panel frame rises in */
  @keyframes er-panel-in { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:none} }
  .lineage .er{opacity:0}
  .lineage.is-animated .er{
    animation: er-panel-in .8s cubic-bezier(.2,.7,.2,1) .15s forwards;
  }

  /* GeoSpy mark → gets archived (dimmed + grayscale) once panel is in */
  @keyframes er-past-dim {
    0%  {opacity:1;filter:grayscale(0) brightness(1)}
    100%{opacity:.45;filter:grayscale(1) brightness(1.4)}
  }
  .lineage.is-animated .er-mark-past{
    animation: er-past-dim 1.2s cubic-bezier(.2,.7,.2,1) .95s forwards;
  }

  /* Connector line draws in vertically */
  @keyframes er-line-draw { from{transform:translateX(-50%) scaleY(0)} to{transform:translateX(-50%) scaleY(1)} }
  .lineage .er-connector-line{transform:translateX(-50%) scaleY(0);transform-origin:center}
  .lineage.is-animated .er-connector-line{
    animation: er-line-draw .9s cubic-bezier(.2,.7,.2,1) .4s forwards;
  }

  /* Connector node flash */
  .er-connector-node{position:relative;z-index:2}
  .er-connector-node::after{
    content:"";position:absolute;inset:0;border-radius:50%;
    background:radial-gradient(circle at center, rgba(255,255,255,0.35), transparent 70%);
    opacity:0;pointer-events:none;
  }
  @keyframes er-node-flash {
    0%  {opacity:0;transform:scale(.6)}
    40% {opacity:1;transform:scale(1.15)}
    100%{opacity:0;transform:scale(1.4)}
  }
  .lineage.is-animated .er-connector-node::after{
    animation: er-node-flash 1.4s cubic-bezier(.3,.7,.3,1) .8s 1;
  }

  /* NOW label fades in */
  @keyframes er-now-in { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none} }
  .lineage .er-col-label-now{opacity:0}
  .lineage.is-animated .er-col-label-now{
    animation: er-now-in .5s ease 1.15s forwards;
  }

  /* Bird swoops in from left */
  @keyframes er-bird-in {
    from{opacity:0;transform:translateX(-48px) scale(.92)}
    to  {opacity:1;transform:none}
  }
  .lineage .er-bird{opacity:0;transform:translateX(-48px) scale(.92)}
  .lineage.is-animated .er-bird{
    animation: er-bird-in .9s cubic-bezier(.16,.75,.22,1) 1.25s forwards;
  }

  /* Raven wordmark types/slides in */
  @keyframes er-word-in {
    from{opacity:0;transform:translateX(-10px);letter-spacing:.02em;filter:blur(4px)}
    to  {opacity:1;transform:none;letter-spacing:normal;filter:none}
  }
  .lineage .er-raven{opacity:0}
  .lineage.is-animated .er-raven{
    animation: er-word-in .7s cubic-bezier(.2,.7,.2,1) 1.6s forwards;
  }

  /* Footer fades in last */
  @keyframes er-foot-in { from{opacity:0} to{opacity:1} }
  .lineage .er-foot{opacity:0}
  .lineage.is-animated .er-foot{
    animation: er-foot-in .6s ease 1.95s forwards;
  }

  /* Idle breathe on NOW dot after everything else has played */
  @keyframes er-dot-breathe {
    0%,100%{box-shadow:0 0 10px rgba(255,255,255,0.5)}
    50%   {box-shadow:0 0 16px rgba(255,255,255,0.85)}
  }
  .lineage.is-animated .er-col-dot{
    animation: er-dot-breathe 2.6s ease-in-out 2.4s infinite;
  }

  @media (prefers-reduced-motion: reduce){
    .lineage .er-eyebrow,
    .lineage .er,
    .lineage .er-bird,
    .lineage .er-raven,
    .lineage .er-foot,
    .lineage .er-col-label-now{opacity:1 !important;animation:none !important;transform:none !important;filter:none !important}
    .lineage .er-mark-past{opacity:.45 !important;filter:grayscale(1) brightness(1.4) !important;animation:none !important}
    .lineage .er-connector-line{transform:translateX(-50%) scaleY(1) !important;animation:none !important}
  }
  /* Mobile: show lineage in final state — no staged text / motion (matches Monochromatic reference) */
  @media (max-width: 700px){
    .lineage .er-eyebrow,
    .lineage .er,
    .lineage .er-bird,
    .lineage .er-raven,
    .lineage .er-foot,
    .lineage .er-col-label-now{opacity:1 !important;animation:none !important;transform:none !important;filter:none !important}
    .lineage .er-mark-past{opacity:.45 !important;filter:grayscale(1) brightness(1.4) !important;animation:none !important}
    .lineage .er-connector-line{transform:translateX(-50%) scaleY(1) !important;animation:none !important}
    .lineage .er-connector-node::after{content:none !important;display:none !important}
    .lineage .er-col-dot{animation:none !important}
  }
  /* ==== END LINEAGE ANIMATION ======================================= */

  /* ---- Book a demo modal ------------------------------------------------ */
  .demo-modal{
    position:fixed;inset:0;z-index:200;
    display:flex;align-items:center;justify-content:center;
    padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    pointer-events:none;opacity:0;visibility:hidden;
    transition:opacity 0.22s ease, visibility 0.22s ease;
  }
  .demo-modal.is-open{
    pointer-events:auto;opacity:1;visibility:visible;
  }
  .demo-modal__backdrop{
    position:absolute;inset:0;
    background:rgba(0,0,0,0.58);
    backdrop-filter:blur(18px) saturate(1.06);
    -webkit-backdrop-filter:blur(18px) saturate(1.06);
  }
  .demo-modal__panel{
    position:relative;z-index:1;
    isolation:isolate;
    width:100%;max-width:min(720px, calc(100vw - 32px));max-height:min(88vh, 820px);
    display:flex;flex-direction:column;
    border-radius:14px;
    border:1px solid rgba(255,255,255,0.08);
    background:rgba(0,0,0,0.28);
    backdrop-filter:blur(26px) saturate(1.06);
    -webkit-backdrop-filter:blur(26px) saturate(1.06);
    box-shadow:
      0 18px 50px rgba(0,0,0,0.35),
      0 1px 0 rgba(255,255,255,0.05) inset;
    transform:translateY(12px) scale(0.98);
    transition:transform 0.24s cubic-bezier(.2,.75,.2,1);
  }
  .demo-modal.is-open .demo-modal__panel{
    transform:translateY(0) scale(1);
  }
  .demo-modal__close{
    position:absolute;top:12px;right:12px;z-index:2;
    width:40px;height:40px;display:flex;align-items:center;justify-content:center;
    margin:0;padding:0;border:1px solid rgba(255,255,255,0.08);border-radius:8px;
    background:rgba(255,255,255,0.08);
    backdrop-filter:blur(10px) saturate(1.04);
    -webkit-backdrop-filter:blur(10px) saturate(1.04);
    color:rgba(255,255,255,0.75);
    font:300 22px/1 var(--font-sans);
    cursor:pointer;
    transition:background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
  }
  .demo-modal__close:hover{
    background:rgba(255,255,255,0.12);
    border-color:rgba(255,255,255,0.14);
    color:#fff;
  }
  .demo-modal__head{
    flex-shrink:0;
    padding:28px 28px 18px;
    border-bottom:1px solid rgba(255,255,255,0.08);
  }
  .demo-modal__logo{
    display:block;
    height:28px;
    width:auto;
    margin:0 0 14px;
    object-fit:contain;
    object-position:left center;
  }
  .demo-modal__eyebrow{
    margin:0 0 10px;
    font:500 10px/1 var(--font-mono);
    letter-spacing:0.22em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);
  }
  .demo-modal__title{
    margin:0;
    font:500 24px/1.15 var(--font-sans);
    letter-spacing:-0.03em;color:#fff;
  }
  .demo-modal__lede{
    margin:12px 0 0;
    font:400 14px/1.45 var(--font-serif);
    color:rgba(255,255,255,0.58);
    text-wrap:pretty;
  }
  .demo-modal__scroll{
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    padding:22px 28px 28px;
    flex:1;min-height:0;
  }
  .demo-modal__scroll--soon{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;min-height:0;padding-top:8px;padding-bottom:28px;
  }
  .demo-modal__soon-btn{min-width:140px;justify-content:center}
  /* After submit: centered thank-you (header + form hidden) */
  .demo-modal__panel.is-demo-success .demo-modal__head{display:none}
  .demo-modal__panel.is-demo-success #demoForm{display:none !important}
  .demo-modal__panel.is-demo-success .demo-modal__scroll{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;min-height:min(320px,52vh);padding:32px 28px 36px;
  }
  .demo-modal__panel.is-demo-success .demo-modal__success{padding:0;max-width:340px}
  @media (max-height: 700px){
    .demo-modal__panel{max-height:80vh}
  }
  .demo-modal__form{display:flex;flex-direction:column;gap:18px}
  .demo-modal__fields{display:flex;flex-direction:column;gap:16px}
  .demo-field{display:flex;flex-direction:column;gap:6px;min-width:0}
  .demo-field--full{width:100%}
  @media (min-width: 640px){
    .demo-modal__form{
      display:grid;
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:18px 22px;
      align-items:start;
    }
    .demo-modal__fields{
      display:contents;
    }
    .demo-field--full{
      grid-column:1 / -1;
    }
    .demo-modal__error{
      grid-column:1 / -1;
      margin-top:2px;
    }
    .demo-modal__submit{
      grid-column:1 / -1;
      margin-top:2px;
    }
    .demo-modal__head{
      padding:28px 32px 18px;
    }
    .demo-modal__scroll{
      padding:22px 32px 28px;
    }
    .demo-field__textarea{
      min-height:72px;
    }
  }
  .demo-field__label{
    font:500 11px/1.2 var(--font-mono);
    letter-spacing:0.14em;text-transform:uppercase;
    color:rgba(255,255,255,0.52);
  }
  .demo-field__opt{
    font-weight:400;letter-spacing:0.08em;text-transform:none;
    color:rgba(255,255,255,0.35);
  }
  .demo-field__req{
    margin-left:0.15em;
    font-weight:600;
    letter-spacing:0;
    text-transform:none;
    color:rgba(255,255,255,0.5);
  }
  .demo-field__input{
    width:100%;box-sizing:border-box;
    padding:9px 12px;border-radius:8px;
    border:1px solid rgba(255,255,255,0.1);
    background:rgba(255,255,255,0.06);
    backdrop-filter:blur(12px) saturate(1.04);
    -webkit-backdrop-filter:blur(12px) saturate(1.04);
    color:#fff;
    font:400 15px/1.3 var(--font-sans);
    letter-spacing:-0.01em;
    outline:none;
    transition:border-color 0.15s ease, background 0.15s ease;
  }
  .demo-field__input::placeholder{color:rgba(255,255,255,0.28)}
  .demo-field__input:hover{border-color:rgba(255,255,255,0.2)}
  .demo-field__input:focus{
    border-color:rgba(255,255,255,0.4);
    background:rgba(255,255,255,0.1);
  }
  .demo-field__textarea{
    resize:vertical;
    min-height:80px;
    font-family:var(--font-sans);
  }
  select.demo-field__input.demo-field__select{
    cursor:pointer;
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    padding-right:40px;
    line-height:1.35;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23ffffff' stroke-opacity='0.55' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 12px center;
    background-size:16px 16px;
  }
  select.demo-field__input.demo-field__select:focus,
  select.demo-field__input.demo-field__select:hover{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23ffffff' stroke-opacity='0.85' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
  select.demo-field__input.demo-field__select option{
    background:#14151a;
    color:#fff;
  }
  .demo-modal__error{
    margin:0;
    font:500 13px/1.4 var(--font-sans);
    color:#f0a8a8;
  }
  .demo-modal__submit{
    width:100%;justify-content:center;margin-top:4px;
    padding:10px 18px;border-radius:3px;
    position:relative;
    min-height:40px;
    font-size:12px;
  }
  .demo-modal__submit:disabled{
    opacity:0.65;cursor:not-allowed;
  }
  .demo-modal__submit.is-email-gate:disabled:not(.is-loading){
    opacity:0.42;
  }
  .demo-modal__submit-spinner{
    display:none;
    width:16px;height:16px;border-radius:50%;
    border:2px solid rgba(10,11,13,0.25);
    border-top-color:#0A0B0D;
    animation:demoSpin 0.75s linear infinite;
  }
  .demo-modal__submit.is-loading .demo-modal__submit-label{display:none}
  .demo-modal__submit.is-loading .demo-modal__submit-spinner{display:block}
  @keyframes demoSpin{to{transform:rotate(360deg)}}
  .demo-modal__success{
    text-align:center;padding:8px 0 4px;
  }
  .demo-modal__success .demo-modal__logo{
    margin-inline:auto;
    margin-bottom:22px;
  }
  .demo-modal__success-k{
    margin:0;
    font:500 22px/1.2 var(--font-sans);
    letter-spacing:-0.02em;color:#fff;
  }
  .demo-modal__success-p{
    margin:14px 0 24px;
    font:400 15px/1.45 var(--font-serif);
    color:rgba(255,255,255,0.62);
    text-wrap:pretty;
  }
  .demo-modal__success-btn{width:100%;justify-content:center}
  @media (max-width: 639px){
    .demo-modal__panel{max-width:440px}
  }
  @media (max-width: 480px){
    .demo-modal__head{padding:24px 20px 16px}
    .demo-modal__logo{height:24px;margin-bottom:12px}
    .demo-modal__scroll{padding:18px 20px 24px}
    .demo-modal__title{font-size:21px}
  }

  /* ---- Graylark homepage ------------------------------------------------ */
  /* Hero: copy sits tight above the product; the split-view frame is the proof
     of the headline and must start inside a 1440x900 first viewport. */
  .home-hero{padding:40px 44px 56px}
  .home-hero .hero-inner{padding-top:16px}
  .home-hero .eyebrow{margin-bottom:22px !important}
  .home-hero h1.hero-h1{
    font-size:clamp(42px, 5.1vw, 74px);
    max-width:none;
  }
  .home-hero .hero-sub{
    margin-top:22px;max-width:860px;
    font:400 clamp(17px, 1.4vw, 20px)/1.5 var(--font-sans);
    color:rgba(255,255,255,0.72);letter-spacing:-0.005em;
  }
  .home-hero .hero-ctas{margin-top:28px}
  .home-hero-br{display:none}
  @media (min-width: 900px){ .home-hero-br{display:inline} }

  /* ---- Hero product frame: looping Raven walkthrough, Raven bar beneath ---- */
  .hs-frame{
    margin:38px auto 0;max-width:1240px;
    border-radius:20px;overflow:hidden;
    border:1px solid rgba(255,255,255,0.12);
    background:var(--gs-chrome);
    box-shadow:
      0 40px 90px rgba(0,0,0,0.6),
      0 16px 32px rgba(0,0,0,0.45),
      0 0 0 1px rgba(255,255,255,0.06);
    text-align:left;
  }
  .hs-video{position:relative;aspect-ratio:16/9;background:#000}
  .hs-video-el{display:block;width:100%;height:100%;object-fit:cover}
  /* iOS paints its own centered play glyph over the poster when autoplay is
     refused (Low Power / Low Data Mode); .hs-play below is our version of it,
     so keep the native one out of the frame. */
  .hs-video-el::-webkit-media-controls-start-playback-button,
  .hs-video-el::-webkit-media-controls-overlay-play-button,
  .hs-video-el::-webkit-media-controls{display:none !important;-webkit-appearance:none}
  /* Tap-to-play control, revealed by page.js when the loop cannot start on
     its own (autoplay refused, Low Power Mode, Reduce Motion). */
  .hs-play{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    z-index:3;display:flex;align-items:center;justify-content:center;
    width:84px;height:84px;border-radius:50%;cursor:pointer;padding:0;
    border:1px solid rgba(255,255,255,0.35);
    background:rgba(10,10,10,0.45);
    -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
    box-shadow:0 12px 40px rgba(0,0,0,0.5);
    transition:transform .22s ease,background .22s ease,border-color .22s ease;
  }
  .hs-play[hidden]{display:none}
  .hs-play svg{width:36px;height:36px;margin-left:4px;fill:rgba(255,255,255,0.92)}
  .hs-play:hover{
    transform:translate(-50%,-50%) scale(1.06);
    background:rgba(20,20,20,0.6);border-color:rgba(255,255,255,0.6);
  }
  .hs-play:focus-visible{outline:2px solid rgba(255,255,255,0.7);outline-offset:3px}
  @media (max-width: 760px){
    .hs-play{width:64px;height:64px}
    .hs-play svg{width:28px;height:28px;margin-left:3px}
  }
  .hs-bar{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    padding:12px 18px;margin:0;
    border-top:1px solid rgba(255,255,255,0.08);
    background:rgba(255,255,255,0.02);
  }
  .hs-bar-id{display:flex;align-items:center;gap:12px;min-width:0}
  .hs-bar-id img{height:20px;width:auto;display:block}
  .hs-bar-sep{width:1px;height:16px;background:rgba(255,255,255,0.14)}
  .hs-bar-mode,.hs-bar-outcome{
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.55);white-space:nowrap;
  }
  .hs-bar-outcome{color:rgba(255,255,255,0.8)}
  .hs-k-sep{color:rgba(255,255,255,0.25);margin:0 8px}
  /* Desktop: start at ~72% of the column and widen to the full 1240px as the
     visitor scrolls the first ~420px. --grow is driven by page.js. Default is
     the compact state so the first paint matches the JS state (no jump);
     reduced motion pins it fully grown. */
  @media (min-width: 1100px){
    .hs-frame[data-hero-grow]{
      --grow:0;
      width:calc(72% + 28% * var(--grow));
      will-change:width;
    }
  }
  /* Reduced motion: the silent loop still plays, but the frame skips the
     scroll-driven growth and sits at its full width from the start. */
  @media (prefers-reduced-motion: reduce){
    .hs-frame[data-hero-grow]{--grow:1 !important}
    .hs-play{transition:none}
    .hs-play:hover{transform:translate(-50%,-50%)}
  }
  @media (max-width: 1100px){
    .home-hero{padding-left:20px;padding-right:20px}
    .hs-frame{margin-top:36px;border-radius:16px}
  }
  /* Tablets: both labels no longer fit on one line; keep the identity, drop
     the outcome (the story block below carries it anyway). */
  @media (max-width: 1000px){
    .hs-bar-outcome{display:none}
  }
  /* Phones: the caption bar can't fit on one line, so the frame stands alone. */
  @media (max-width: 760px){
    .hs-bar{display:none}
  }
  @media (max-width: 480px){
    .home-hero{padding-left:14px;padding-right:14px}
    .hs-frame{border-radius:12px}
    .hs-k-sep{margin:0 5px}
  }
  .home-system-mark{display:block;height:22px;width:auto}
  .home-system-cta{margin-top:28px;display:flex;gap:12px;flex-wrap:wrap}
  .company-prose{max-width:40rem}
  .company-prose p{
    font:400 16px/1.65 var(--font-sans);color:rgba(255,255,255,0.72);margin:0 0 1.1rem;
    text-wrap:pretty;
  }
  .company-prose a{color:#fff;border-bottom:1px solid rgba(255,255,255,0.28);text-decoration:none}
  .company-prose a:hover{border-bottom-color:#fff}

  /* ---- Graylark homepage: editorial sections (gl-*) ---------------------
     Serif carries thesis, mission and editorial moments; sans carries product
     and operational copy; mono carries eyebrows and system labels. Every
     section is an asymmetrical 1240px grid with hairline dividers. */
  /* Thesis: the eyebrow's hairline is the fine top rule; beneath it the serif
     display headline holds the left seven columns and the sans copy sits in
     the right four, leaving the eighth column as deliberate negative space. */
  /* Bottom padding is short because the evidence figure, not the copy, now
     closes the section; the figure's own padding holds the tile drift. */
  .gl-thesis{padding:128px 44px 56px}
  .gl-thesis-inner{max-width:1240px;margin:0 auto}
  .gl-thesis-eyebrow{margin-bottom:40px}
  .gl-thesis-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start}
  .gl-thesis-h{
    grid-column:1/span 7;margin:0;
    font:300 clamp(44px, 5.6vw, 84px)/1.02 var(--font-serif);letter-spacing:-0.015em;
    color:#fff;text-wrap:balance;
  }
  .gl-thesis-copy{grid-column:9/span 4;margin:0;padding-top:0.55em}
  .gl-thesis-copy p{
    margin:0;max-width:30em;
    font:400 clamp(16px, 1.25vw, 19px)/1.55 var(--font-sans);color:rgba(255,255,255,0.7);text-wrap:pretty;
  }
  .gl-thesis-copy p+p{margin-top:18px}
  .gl-thesis-copy .gl-thesis-em{color:#fff}

  /* Evidence assembly: the lower field of the thesis carries one low-context
     Raven input photograph cut into background-positioned tiles that page.js
     scrubs from scattered fragments into the resolved frame as the section
     scrolls. Every motion value is a 0→1 custom property whose default is the
     resolved state, so no-JS and reduced-motion render the finished photograph
     with its brackets and label and never see a tile.
       --a appear · --m move home · --s sharpen + tighten seams
       --i photograph in · --f brackets and label · --p/--po pulse sweep
       --k scatter distance per breakpoint */
  .gl-evidence{
    --a:1;--m:1;--s:1;--i:1;--f:1;--p:0;--po:0;--k:1;--cols:4;--rows:4;
    display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;
    margin:8px 0 0;padding:48px 0 12px;overflow:hidden;
  }
  .gl-evidence-stage{grid-column:4/span 8;position:relative;min-width:0}
  .gl-evidence-frame{
    position:relative;aspect-ratio:4/3;background:#000;
    border:1px solid rgba(255,255,255,0.12);
  }
  /* Faint cell rules and one sample point per cell read as fragmented data
     until the image resolves over them. */
  .gl-evidence-frame::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background-image:
      radial-gradient(circle, rgba(255,255,255,0.4) 1px, transparent 1.6px),
      linear-gradient(rgba(255,255,255,0.07) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.07) 1px, transparent 1px);
    background-size:calc(100% / var(--cols)) calc(100% / var(--rows));
    opacity:calc(0.9 * (1 - var(--s)));
  }
  .gl-evidence-img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;
    filter:grayscale(0.1) brightness(0.86) contrast(1.05);
    opacity:var(--i);
  }
  .gl-evidence-tiles{
    position:absolute;inset:0;pointer-events:none;
    filter:grayscale(0.1) brightness(0.86) contrast(1.05);
  }
  .gl-evidence-tile{
    position:absolute;background-repeat:no-repeat;
    outline:1px solid rgba(255,255,255,calc(0.18 * (1 - var(--s))));outline-offset:-1px;
    opacity:calc(var(--o0) + (0.85 - var(--o0)) * var(--a) + 0.15 * var(--s));
    transform:
      translate(calc(var(--dx) * var(--k) * (1 - var(--m))), calc(var(--dy) * var(--k) * (1 - var(--m))))
      scale(calc(0.9 + 0.1 * var(--s)));
    filter:blur(calc(var(--b) * (1 - var(--s))));
  }
  .gl-evidence.is-active .gl-evidence-tile{will-change:transform,opacity,filter}
  .gl-evidence.is-active .gl-evidence-pulse{will-change:transform,opacity}
  .gl-evidence.is-resolved .gl-evidence-tile{visibility:hidden;will-change:auto}
  /* One hairline sweeps the field once as the fragments become active. */
  .gl-evidence-pulse{
    position:absolute;top:-3%;bottom:-3%;left:0;width:100%;pointer-events:none;
    opacity:var(--po);transform:translateX(calc(var(--p) * 100%));
  }
  .gl-evidence-pulse::before{
    content:"";position:absolute;top:0;bottom:0;left:0;width:1px;
    background:linear-gradient(to bottom, transparent, rgba(255,255,255,0.6) 28%, rgba(255,255,255,0.6) 72%, transparent);
  }
  .gl-evidence-pulse::after{
    content:"";position:absolute;top:0;bottom:0;right:100%;width:28px;
    background:linear-gradient(to left, rgba(255,255,255,0.05), transparent);
  }
  .gl-evidence-corner{
    position:absolute;width:14px;height:14px;pointer-events:none;
    border:0 solid rgba(255,255,255,0.55);opacity:var(--f);
  }
  .gl-evidence-corner.tl{top:-7px;left:-7px;border-top-width:1px;border-left-width:1px}
  .gl-evidence-corner.tr{top:-7px;right:-7px;border-top-width:1px;border-right-width:1px}
  .gl-evidence-corner.bl{bottom:-7px;left:-7px;border-bottom-width:1px;border-left-width:1px}
  .gl-evidence-corner.br{bottom:-7px;right:-7px;border-bottom-width:1px;border-right-width:1px}
  .gl-evidence-cap{
    grid-column:4/span 8;display:flex;justify-content:flex-end;align-items:center;gap:10px;
    margin:16px 0 0;
    font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;
    color:rgba(255,255,255,0.45);opacity:var(--f);
  }
  .gl-evidence-cap .sep{color:rgba(255,255,255,0.25)}
  @media (prefers-reduced-motion: reduce){
    .gl-evidence{--a:1;--m:1;--s:1;--i:1;--f:1;--po:0}
    .gl-evidence-tiles,.gl-evidence-pulse{display:none}
  }

  /* System 01: product claim left, field case right, film as the shared
     image. One section, not a product intro stacked on a second opener. */
  .gl-system{padding:120px 44px 112px;border-top:1px solid rgba(255,255,255,0.08)}
  /* Single column at every width: section head, film, case story, CTA. */
  .gl-system-inner{
    max-width:1240px;margin:0 auto;
    display:grid;grid-template-columns:1fr;align-items:start;
  }
  .gl-system-copy{min-width:0;order:1}
  .gl-case-film{order:2}
  .gl-case-note{order:3}
  /* Case story reads as the film's title card: eyebrow across the top, the
     headline in the narrow column, the account and CTA in the wide one, so
     the block uses the film's full width instead of half of it. Keeping the
     film between the two headlines is deliberate — it stops the sans section
     headline and the serif case headline from stacking into one text wall. */
  .gl-system-proof{
    order:4;margin-top:40px;padding-top:40px;
    display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:8px 64px;align-items:start;
    border-top:1px solid rgba(255,255,255,0.1);
  }
  .gl-system-proof .gl-case-k-wrap{grid-column:1/-1;justify-self:start}
  .gl-case-body{min-width:0;padding-top:6px}
  .gl-system-cta{margin-top:28px}
  /* Case film borrows the hero frame so the caption bar sits under the video;
     the inner player frame goes flat so the two read as one object. */
  .gl-case-film.hs-frame .demo-video-frame{border-radius:0;border:0;box-shadow:none}
  .gl-case-film .hs-bar-outcome{text-align:right}
  /* Desktop: the caption bar already carries the outcome, so the stacked
     summary list only renders on phones. */
  .gl-outcome{display:none}
  /* Wordmark + label lockup: the hairline belongs to the lockup, not the label,
     so the mono text centers on the wordmark and the rule runs under both. */
  .gl-system-k{
    display:inline-flex;align-items:center;gap:14px;min-height:26px;
    padding-bottom:14px;margin-bottom:28px;
    border-bottom:1px solid rgba(255,255,255,0.14);
  }
  .gl-system-k .section-eyebrow{margin:0;padding:0;border:0;align-items:center}
  /* Two fixed sentences, so balance is safe here and stops "human review."
     stranding as a two-word last line. */
  .gl-system-p{
    margin:22px 0 0;max-width:34em;
    font:400 clamp(17px, 1.3vw, 19px)/1.5 var(--font-sans);color:rgba(255,255,255,0.72);text-wrap:balance;
  }
  .gl-case-h{
    margin:0;max-width:16ch;
    font:300 clamp(28px, 2.8vw, 40px)/1.08 var(--font-serif);letter-spacing:-0.012em;color:#fff;text-wrap:balance;
  }
  .gl-case-p{
    margin:0;max-width:34em;
    font:400 clamp(16px, 1.25vw, 18px)/1.55 var(--font-sans);color:rgba(255,255,255,0.7);text-wrap:pretty;
  }
  .gl-case-film{grid-column:1/-1;margin:48px 0 0}
  .gl-case-note{
    grid-column:1/-1;
    display:flex;align-items:center;gap:10px;margin:16px 0 0;
    font:400 12px/1.5 var(--font-sans);letter-spacing:0.02em;color:rgba(255,255,255,0.5);
  }
  .gl-outcome{
    grid-column:1/-1;margin:20px 0 0;
    border-top:1px solid rgba(255,255,255,0.12);border-bottom:1px solid rgba(255,255,255,0.12);
  }
  .gl-outcome div{display:flex;flex-direction:column;gap:8px;min-width:0;padding:14px 0 16px;border-bottom:1px solid rgba(255,255,255,0.08)}
  .gl-outcome div:last-child{border-bottom:0}
  .gl-outcome dt{font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.42)}
  .gl-outcome dd{margin:0;font:400 16px/1.4 var(--font-sans);letter-spacing:-0.01em;color:rgba(255,255,255,0.86);text-wrap:pretty}
  .gl-note:hover .gl-note-h{text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,0.35)}
  .gl-notes-all a{
    font:500 12px/1 var(--font-mono);letter-spacing:0.14em;text-transform:uppercase;
    color:rgba(255,255,255,0.72);text-decoration:none;white-space:nowrap;
    border-bottom:1px solid rgba(255,255,255,0.28);padding-bottom:4px;
    transition:color 160ms ease,border-color 160ms ease;
  }
  .gl-notes-all a:hover{color:#fff;border-color:#fff}

  .gl-notes{padding:104px 44px 120px;border-top:1px solid rgba(255,255,255,0.08)}
  .gl-notes-head{max-width:1240px;margin:0 auto}
  .gl-notes-h{
    margin:0;max-width:24ch;
    font:300 clamp(32px, 3.6vw, 52px)/1.08 var(--font-serif);letter-spacing:-0.01em;color:#fff;text-wrap:balance;
  }
  .gl-notes-grid{
    max-width:1240px;margin:56px auto 0;
    display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:start;
  }
  .gl-feature{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit;border-top:1px solid rgba(255,255,255,0.12)}
  .gl-feature-body{padding:26px 0 0;display:flex;flex-direction:column;gap:14px}
  .gl-note-k{font:500 10px/1 var(--font-mono);letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.42)}
  .gl-feature-h{font:300 clamp(30px, 3vw, 42px)/1.1 var(--font-serif);letter-spacing:-0.015em;color:#fff;text-wrap:balance}
  .gl-feature-p{margin:0;max-width:40em;font:400 16px/1.55 var(--font-sans);color:rgba(255,255,255,0.66);text-wrap:pretty}
  .gl-note-meta{font:400 12px/1.4 var(--font-sans);color:rgba(255,255,255,0.45)}
  .gl-feature-go{margin-top:6px;font:500 13px/1 var(--font-sans);color:rgba(255,255,255,0.6);transition:color 160ms ease}
  .gl-feature:hover .gl-feature-go{color:#fff}
  .gl-notes-side{display:flex;flex-direction:column;min-width:0;border-top:1px solid rgba(255,255,255,0.12)}
  .gl-note{
    display:flex;flex-direction:column;gap:10px;padding:24px 0 26px;
    border-bottom:1px solid rgba(255,255,255,0.08);text-decoration:none;color:inherit;
  }
  .gl-note-h{font:500 19px/1.25 var(--font-sans);letter-spacing:-0.02em;color:#fff;text-wrap:balance}
  .gl-note-p{margin:0;font:400 14px/1.5 var(--font-sans);color:rgba(255,255,255,0.6);text-wrap:pretty}
  .gl-notes-all{margin:24px 0 0;display:flex;gap:10px;align-items:center;color:rgba(255,255,255,0.35);font:400 12px/1 var(--font-sans)}

  .gl-cta-eyebrow{justify-content:center;margin-bottom:24px}

  @media (prefers-reduced-motion: reduce){
    .demo-video-play{transition:none}
    .demo-video-play:hover{transform:translate(-50%,-50%)}
  }
  @media (max-width: 1100px){
    .gl-thesis{padding:104px 24px 48px}
    .gl-thesis-eyebrow{margin-bottom:32px}
    .gl-thesis-h{grid-column:1/span 8}
    .gl-thesis-copy{grid-column:1/span 9;padding-top:36px}
    .gl-evidence{--k:0.75;padding-top:40px}
    .gl-evidence-stage,.gl-evidence-cap{grid-column:2/span 10}
    .gl-system,.gl-notes{padding-left:24px;padding-right:24px}
    .gl-system{padding-top:88px;padding-bottom:80px}
    .gl-case-film{margin-top:40px}
    .gl-system-proof{margin-top:32px;padding-top:32px;gap:8px 48px}
    .gl-notes{padding-top:88px}
    .gl-notes-grid{grid-template-columns:1fr;gap:40px}
  }
  @media (max-width: 900px){
    .gl-case-film{margin-top:36px}
    .gl-case-h{max-width:18ch}
    /* Too narrow for two columns: headline over account, as one stack. */
    .gl-system-proof{grid-template-columns:1fr;gap:0}
    .gl-case-body{padding-top:0}
    .gl-case-p{margin-top:18px}
  }
  @media (max-width: 700px){
    .gl-thesis{padding:80px 24px 40px}
    .gl-thesis-eyebrow{margin-bottom:28px}
    .gl-thesis-h,.gl-thesis-copy{grid-column:1/-1}
    .gl-thesis-copy{padding-top:28px}
    /* Nine tiles, short drift, no blur: the section padding doubles as the
       scatter room so nothing can widen the page. */
    .gl-evidence{--k:0.45;--cols:3;--rows:3;display:block;margin:0 -24px;padding:32px 24px 8px}
    .gl-evidence-tile{filter:none}
    .gl-evidence-corner{width:12px;height:12px}
    .gl-evidence-corner.tl{top:-6px;left:-6px}
    .gl-evidence-corner.tr{top:-6px;right:-6px}
    .gl-evidence-corner.bl{bottom:-6px;left:-6px}
    .gl-evidence-corner.br{bottom:-6px;right:-6px}
    .gl-evidence-cap{margin-top:14px}
    .gl-system{padding-top:72px;padding-bottom:64px}
    .gl-notes{padding-top:72px;padding-bottom:88px}
    .gl-case-film{margin-top:32px}
    /* Phones: no caption bar; plain player frame, eyebrow over the case
       headline and the stacked summary after the CTA, as before. */
    .gl-case-film.hs-frame{border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
    .gl-case-film.hs-frame .demo-video-frame{
      border-radius:14px;border:1px solid rgba(255,255,255,0.1);
      box-shadow:0 40px 100px rgba(0,0,0,0.55),0 0 0 1px rgba(255,255,255,0.06);
    }
    .gl-case-film .hs-bar{display:none}
    .gl-system-proof{order:3;display:block;margin-top:0;padding-top:36px;border-top:0}
    /* Summary list is phone-only, so it carries its own order; the note trails
       it here rather than sitting directly under the film. */
    .gl-outcome{display:block;order:5}
    .gl-case-note{order:6}
    .gl-cta{padding-top:88px;padding-bottom:88px}
  }

  /* ---- Lineage note (Raven page footer-adjacent, GeoSpy → Raven) -------- */
  .lineage-note{
    margin:0;padding:56px 40px 72px;
    display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
    text-align:center;
    font:300 15px/1.5 var(--font-serif);color:rgba(255,255,255,0.62);
    border-top:1px solid rgba(255,255,255,0.06);
  }
  .lineage-note-tick{
    width:6px;height:6px;border-radius:50%;background:var(--gs-jade);
    box-shadow:0 0 10px rgba(24,81,255,0.6);flex:0 0 6px;
  }
  .lineage-note a{
    font:500 11px/1 var(--font-mono);letter-spacing:0.16em;text-transform:uppercase;
    color:rgba(255,255,255,0.6);text-decoration:none;
    border-bottom:1px solid rgba(255,255,255,0.25);padding-bottom:2px;
    transition:color 160ms ease, border-color 160ms ease;white-space:nowrap;
  }
  .lineage-note a:hover{color:#fff;border-color:rgba(255,255,255,0.7)}
  @media (max-width: 700px){
    .lineage-note{padding:40px 20px 56px;font-size:14px}
  }