:root{
    --dead:#D9DCDC;
    --dead-2:#C8CDCE;
    --dead-ink:#6E7A80;
    --dead-ink-2:#8D989D;
    --dead-line:#B6BDBF;

    /* Noviant brand asset & color guide */
    --navy:#04253F;          /* Deep Navy   */
    --blue-teal:#0A4D64;     /* Blue Teal   */
    --teal-core:#03A0AE;     /* Teal        */
    --soft-aqua:#89C3BD;     /* Soft Aqua   */
    --gold-light:#F5CC74;    /* Light Gold  */
    --navy-deep:#021827;
    --navy-lift:#0A3B5C;
    --teal:#32C2C4;
    --gold:#EFAA36;
    --gold-deep:#D19A2F;
    --mist:#A6C2D2;
    --white:#FFFFFF;

    --cond:"Big Shoulders Display",Impact,"Arial Narrow",sans-serif;
    --sans:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  }
  *{box-sizing:border-box}
  body{
    margin:0;background:var(--navy-deep);color:var(--white);
    font-family:var(--sans);font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  }
  h1,h2,h3{margin:0;font-family:var(--cond);font-weight:900;text-transform:uppercase;line-height:.84;letter-spacing:.005em;text-wrap:balance}
  p{margin:0}
  a{color:inherit}
  .wrap{width:100%;max-width:1320px;margin-inline:auto;padding-inline:26px}
  .lbl{font-family:var(--sans);font-size:10.5px;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
  a:focus-visible,button:focus-visible,input:focus-visible,[role="slider"]:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
  ::selection{background:var(--gold);color:var(--navy)}

  .flag{background:var(--gold);color:var(--navy);text-align:center;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;padding:8px 14px;position:relative;z-index:30}

  /* ---------- nav ---------- */
  .nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:25;background:rgba(2,24,39,.88);backdrop-filter:blur(10px);border-bottom:1px solid rgba(166,194,210,.18)}
  .nav-in{display:flex;align-items:center;gap:28px;height:60px}
  .brand{display:flex;align-items:center;gap:9px;text-decoration:none}
  .brand b{font-family:var(--cond);font-size:26px;font-weight:800;letter-spacing:.01em;text-transform:lowercase}
  .nav-links{display:flex;gap:24px;margin-left:auto;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
  .nav-links a{text-decoration:none}
  .nav-links a:hover{color:var(--gold)}
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 20px;border:2px solid var(--gold);
    background:var(--gold);color:var(--navy);font-family:var(--sans);font-size:12px;font-weight:800;letter-spacing:.14em;
    text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .16s ease,color .16s ease;
  }
  .btn:hover{background:transparent;color:var(--gold)}
  .btn-ghost{background:transparent;color:var(--white);border-color:rgba(255,255,255,.4)}
  .btn-ghost:hover{background:var(--white);color:var(--navy);border-color:var(--white)}
  .btn-dark{background:var(--navy);border-color:var(--navy);color:var(--white)}
  .btn-dark:hover{background:transparent;color:var(--navy)}
  .btn-lg{padding:16px 30px;font-size:13px}

  /* ---------- the diptych stage ---------- */
  .stage{position:relative;overflow:hidden}
  .split{display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
  .pane{position:relative;padding:58px 34px 62px;overflow:hidden}
  .pane-live{border-left:3px solid var(--gold)}
  .pane-in{position:relative;z-index:2;max-width:610px}
  .pane-dead .pane-in{margin-left:auto;padding-right:26px}
  .pane-live .pane-in{margin-right:auto;padding-left:26px}
  .pane-mark{
    position:absolute;z-index:3;bottom:16px;font-size:10.5px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;
  }
  .pane-dead .pane-mark{left:34px;color:var(--dead-ink-2)}
  .pane-live .pane-mark{right:34px;color:var(--gold)}

  /* left: the dead world */
  .dead-bg{position:absolute;inset:0;background:var(--dead)}
  .dead-bg::before{
    content:"";position:absolute;inset:0;opacity:.5;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23s)' opacity='.5'/%3E%3C/svg%3E");
  }
  .dead-bg::after{
    content:"";position:absolute;inset:0;
    background:repeating-linear-gradient(180deg,rgba(110,122,128,.09) 0 1px,transparent 1px 4px),
               radial-gradient(70% 60% at 30% 50%,rgba(255,255,255,.5),rgba(200,205,206,0) 70%);
  }

  /* right: the Noviant world */
  .live-bg{position:absolute;inset:0;background:radial-gradient(100% 80% at 76% 44%,#0C4364 0%,#062C47 42%,#021827 78%)}
  .live-bg::before{
    content:"";position:absolute;left:76%;top:50%;width:1700px;height:1700px;transform:translate(-50%,-50%);
    background:conic-gradient(from 0deg,
      rgba(50,194,196,0) 0 14deg, rgba(50,194,196,.13) 14.6deg 15.6deg, rgba(50,194,196,0) 16deg 60deg,
      rgba(239,170,54,.12) 60.6deg 61.6deg, rgba(50,194,196,0) 62deg 104deg,
      rgba(50,194,196,.12) 104.6deg 105.6deg, rgba(50,194,196,0) 106deg 150deg,
      rgba(239,170,54,.11) 150.6deg 151.6deg, rgba(50,194,196,0) 152deg 196deg,
      rgba(50,194,196,.13) 196.6deg 197.6deg, rgba(50,194,196,0) 198deg 240deg,
      rgba(239,170,54,.12) 240.6deg 241.6deg, rgba(50,194,196,0) 242deg 286deg,
      rgba(50,194,196,.11) 286.6deg 287.6deg, rgba(50,194,196,0) 288deg 330deg,
      rgba(239,170,54,.12) 330.6deg 331.6deg, rgba(50,194,196,0) 332deg 360deg);
    -webkit-mask-image:radial-gradient(closest-side,#000 8%,rgba(0,0,0,.5) 40%,transparent 74%);
    mask-image:radial-gradient(closest-side,#000 8%,rgba(0,0,0,.5) 40%,transparent 74%);
    animation:spin 200s linear infinite;
  }
  @keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}

  .verdict{font-size:clamp(44px,6.4vw,104px);line-height:.8}
  .verdict-dead{color:var(--dead-ink);text-shadow:0 1px 0 rgba(255,255,255,.55)}
  .verdict-live{color:var(--white)}
  .verdict-live em{font-style:normal;color:var(--gold)}
  .kick-dead{color:var(--dead-ink-2);margin-bottom:18px;display:block}
  .kick-live{color:var(--gold);margin-bottom:18px;display:block}
  .say-dead{color:var(--dead-ink);font-size:17.5px;max-width:34ch;margin-top:22px}
  .say-live{color:var(--mist);font-size:17.5px;max-width:34ch;margin-top:22px}

  /* ---------- the chat session inside each world ---------- */
  .chat{
    border:1px solid var(--dead-line);background:rgba(255,255,255,.62);border-radius:14px;overflow:hidden;
    box-shadow:0 20px 44px -34px rgba(20,32,38,.7);
  }
  .chat-live{
    border-color:rgba(166,194,210,.3);background:rgba(4,37,63,.58);backdrop-filter:blur(6px);
    box-shadow:0 24px 54px -32px rgba(0,0,0,.85);
  }
  .chat-hd{
    display:flex;align-items:center;gap:9px;padding:11px 15px;border-bottom:1px solid var(--dead-line);
    background:rgba(255,255,255,.5);
  }
  .chat-live .chat-hd{border-color:rgba(166,194,210,.22);background:rgba(2,24,39,.42)}
  .chat-hd .app{font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--dead-ink)}
  .chat-live .chat-hd .app{color:var(--white)}
  .chat-hd .meta{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dead-ink-2)}
  .chat-live .chat-hd .meta{color:var(--mist)}
  .spark{width:16px;height:16px;flex:none}

  .chat-body{padding:15px;display:flex;flex-direction:column;gap:13px}
  .msg-user{
    align-self:flex-end;max-width:84%;min-height:42px;background:rgba(110,122,128,.14);color:var(--dead-ink);
    border:1px solid var(--dead-line);border-radius:14px 14px 4px 14px;padding:10px 14px;font-size:14.5px;font-weight:500;
    display:flex;align-items:center;
  }
  .caret-q{background:var(--dead-ink-2)}
  .chat-live .caret-q{background:var(--white)}
  .chat-live .msg-user{background:rgba(255,255,255,.12);border-color:rgba(166,194,210,.28);color:var(--white)}
  .msg-ai{display:flex;gap:11px}
  .ai-avatar{
    width:24px;height:24px;border-radius:7px;flex:none;display:grid;place-items:center;
    background:rgba(110,122,128,.16);border:1px solid var(--dead-line);
  }
  .chat-live .ai-avatar{background:rgba(50,194,196,.14);border-color:rgba(50,194,196,.4)}
  .ai-content{flex:1;min-width:0}
  .ai-line{font-size:14.5px;color:var(--dead-ink);line-height:1.55;min-height:1.55em}
  .chat-live .ai-line{color:var(--mist)}
  .caret{display:none;width:7px;height:15px;background:var(--dead-ink-2);vertical-align:-3px;margin-left:2px}
  .chat-live .caret{background:var(--teal)}
  .caret.on{display:inline-block;animation:blink 1s steps(2) infinite}
  @keyframes blink{50%{opacity:0}}

  .dots{display:inline-flex;gap:5px;align-items:center;height:20px}
  .dots i{width:6px;height:6px;border-radius:50%;background:var(--dead-ink-2);animation:bob 1.1s ease-in-out infinite}
  .chat-live .dots i{background:var(--teal)}
  .dots i:nth-child(2){animation-delay:.15s}
  .dots i:nth-child(3){animation-delay:.3s}
  @keyframes bob{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}
  .dots[hidden]{display:none}

  .rows2{margin-top:11px;display:flex;flex-direction:column}
  .r{
    display:grid;grid-template-columns:20px 1fr auto;gap:11px;align-items:baseline;padding-block:8px;
    border-bottom:1px solid rgba(110,122,128,.16);font-size:14.5px;opacity:0;transform:translateY(7px);
  }
  .chat-live .r{border-color:rgba(166,194,210,.16)}
  .r.in{opacity:1;transform:none;transition:opacity .4s ease,transform .4s ease}
  .r-n{font-size:10.5px;font-weight:800;letter-spacing:.08em;color:var(--dead-ink-2)}
  .r-name{font-weight:600;color:var(--dead-ink)}
  .r-src{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--dead-ink-2)}
  .chat-live .r-n{color:var(--mist)}
  .chat-live .r-name{color:var(--white)}
  .chat-live .r-src{color:var(--mist)}
  .r.mine{background:linear-gradient(90deg,rgba(239,170,54,.28),transparent 82%);box-shadow:inset 3px 0 0 var(--gold);padding-inline:10px;margin-inline:-10px}
  .r.mine .r-name{color:var(--white)}
  .r.mine .r-src,.r.mine .r-n{color:var(--gold)}

  .verdict-line{
    margin-top:13px;font-size:13.5px;font-weight:700;opacity:0;transition:opacity .5s ease;
  }
  .verdict-line.in{opacity:1}
  .verdict-line.miss{color:#8A5E0B}
  .verdict-line.hit{color:var(--gold)}

  .replay{
    display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(166,194,210,.4);background:transparent;
    color:var(--mist);font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
    padding:9px 16px;border-radius:999px;cursor:pointer;transition:border-color .16s ease,color .16s ease;
  }
  .replay:hover{border-color:var(--gold);color:var(--gold)}

  .stage-bar{
    display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;
    padding:16px 26px;background:var(--navy-deep);border-top:1px solid rgba(166,194,210,.18);
    color:var(--mist);font-size:13px;
  }

  /* ---------- the comparison rows ---------- */
  .rows{background:var(--navy-deep)}
  .row-hd{text-align:center;padding-block:76px 40px}
  .row-hd h2{font-size:clamp(40px,6.6vw,96px);color:var(--white)}
  .row-hd p{color:var(--mist);max-width:54ch;margin:18px auto 0}
  .row{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(166,194,210,.18)}
  .cell{padding:30px 34px 32px}
  .cell-dead{background:var(--dead);border-right:4px solid var(--gold);position:relative;overflow:hidden}
  .cell-dead::after{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.42;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='150' height='150' filter='url(%23g)' opacity='.45'/%3E%3C/svg%3E");
  }
  .cell-live{background:var(--navy);position:relative}
  .cell-inner{position:relative;z-index:2}
  .cell h3{font-size:clamp(25px,3vw,38px);margin:12px 0 12px}
  .cell-dead h3{color:var(--dead-ink)}
  .cell-live h3{color:var(--white)}
  .cell-dead .cell-p{color:var(--dead-ink);font-size:16px;max-width:46ch}
  .cell-live .cell-p{color:var(--mist);font-size:16px;max-width:46ch}
  .cell-dead .lbl{color:var(--dead-ink-2)}
  .cell-live .lbl{color:var(--teal)}
  .tag{
    display:inline-block;margin-top:18px;padding:7px 13px;border:1px solid var(--gold);color:var(--gold);
    font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  }

  /* ---------- suite ---------- */
  .suite{background:var(--navy);padding-block:88px;position:relative;overflow:hidden}
  .suite::before{
    content:"";position:absolute;inset:0;
    background-image:linear-gradient(rgba(166,194,210,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(166,194,210,.05) 1px,transparent 1px);
    background-size:70px 70px;
    -webkit-mask-image:radial-gradient(80% 70% at 50% 30%,#000,transparent 80%);
    mask-image:radial-gradient(80% 70% at 50% 30%,#000,transparent 80%);
  }
  .suite-in{position:relative;z-index:2}
  .suite h2{font-size:clamp(38px,6vw,88px);text-align:center;color:var(--white)}
  .suite-sub{text-align:center;color:var(--mist);max-width:56ch;margin:18px auto 0}
  .six{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(268px,100%),1fr));gap:1px;background:rgba(166,194,210,.18);border:1px solid rgba(166,194,210,.18);margin-top:52px}
  .prod{background:var(--navy);padding:28px 26px;transition:background .2s ease}
  .prod:hover{background:var(--navy-lift)}
  .prod h3{font-size:30px;color:var(--white);margin-bottom:10px}
  .prod .lbl{color:var(--gold);display:block;margin-bottom:12px}
  .prod .cell-p{color:var(--mist);font-size:15px}
  .prod-core{background:#052E4A}

  /* ---------- placeholders ---------- */
  .ph{
    border:2px dashed var(--teal);background:rgba(50,194,196,.07);padding:28px;text-align:center;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:240px;
  }
  .ph .t{font-size:10.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--teal)}
  .ph .w{font-family:var(--cond);font-size:26px;font-weight:800;text-transform:uppercase;color:var(--white);max-width:26ch;line-height:.9}
  .ph .s{font-size:12.5px;color:var(--mist);max-width:44ch}
  .ph.slim{min-height:140px}

  /* ---------- fields ---------- */
  .fields{background:var(--navy-deep);padding-block:88px}
  .fields h2{font-size:clamp(34px,5vw,72px);line-height:.92;color:var(--white);max-width:20ch}
  .fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(276px,100%),1fr));gap:18px;margin-top:44px}
  .field{border:1px solid rgba(166,194,210,.2);padding:28px;background:rgba(4,37,63,.5)}
  .field h3{font-size:28px;color:var(--white);margin:10px 0 10px}
  .field .cell-p{color:var(--mist);font-size:15.5px}
  .field .lbl{color:var(--teal)}

  /* ---------- proof ---------- */
  .proof{background:var(--navy-deep);padding-block:0 84px}
  .logos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr));gap:1px;background:rgba(166,194,210,.18);border:1px solid rgba(166,194,210,.18);margin-top:26px}
  .logo-slot{background:var(--navy-deep);height:92px;display:grid;place-items:center;font-size:10px;font-weight:800;letter-spacing:.16em;color:#5D7E92}

  /* ---------- cta ---------- */
  .cta{background:var(--gold);color:var(--navy);padding-block:64px;text-align:center;position:relative;overflow:hidden}
  .cta h2{font-size:clamp(34px,4.8vw,70px);color:var(--navy);line-height:.96;max-width:20ch;margin-inline:auto}
  .cta p{color:#6B4F13;max-width:52ch;margin:22px auto 0;font-size:17.5px}
  .cta form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:32px}
  .cta input{
    font-family:var(--sans);font-size:16px;padding:16px 20px;border:2px solid var(--navy);background:#fff;color:var(--navy);min-width:300px;
  }
  .cta .fine{margin-top:18px;font-size:10.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#6B4F13}

  footer{background:var(--navy-deep);color:#5D7E92;padding-block:38px;font-size:13px;border-top:1px solid rgba(166,194,210,.18)}
  .foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
  .foot a{text-decoration:none;margin-right:20px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:11px}
  .foot a:hover{color:var(--gold)}


  /* ---------- hero: answer space (carried over from The Answer) ---------- */
  .ah{position:relative;isolation:isolate;overflow:hidden;background:#02131F}
  .ah::before{
    content:"";position:absolute;inset:0;z-index:0;
    background:radial-gradient(120% 80% at 50% 36%,#0A3E5C 0%,#052940 40%,#02131F 76%);
  }
  .ah-rays{
    position:absolute;left:50%;top:190px;width:2200px;height:2200px;transform:translate(-50%,-50%);z-index:1;pointer-events:none;
    background:conic-gradient(from 0deg,
      rgba(50,194,196,0) 0 3deg, rgba(50,194,196,.16) 3.6deg 4.4deg, rgba(50,194,196,0) 5deg 22deg,
      rgba(239,170,54,.13) 22.6deg 23.4deg, rgba(50,194,196,0) 24deg 45deg,
      rgba(50,194,196,.11) 45.6deg 46.6deg, rgba(50,194,196,0) 47deg 67deg,
      rgba(239,170,54,.10) 67.6deg 68.6deg, rgba(50,194,196,0) 69deg 90deg,
      rgba(50,194,196,.15) 90.6deg 91.6deg, rgba(50,194,196,0) 92deg 112deg,
      rgba(239,170,54,.12) 112.6deg 113.6deg, rgba(50,194,196,0) 114deg 135deg,
      rgba(50,194,196,.10) 135.6deg 136.6deg, rgba(50,194,196,0) 137deg 158deg,
      rgba(239,170,54,.11) 158.6deg 159.6deg, rgba(50,194,196,0) 160deg 180deg,
      rgba(50,194,196,.16) 180.6deg 181.6deg, rgba(50,194,196,0) 182deg 202deg,
      rgba(239,170,54,.10) 202.6deg 203.6deg, rgba(50,194,196,0) 204deg 225deg,
      rgba(50,194,196,.12) 225.6deg 226.6deg, rgba(50,194,196,0) 227deg 248deg,
      rgba(239,170,54,.13) 248.6deg 249.6deg, rgba(50,194,196,0) 250deg 270deg,
      rgba(50,194,196,.15) 270.6deg 271.6deg, rgba(50,194,196,0) 272deg 292deg,
      rgba(239,170,54,.11) 292.6deg 293.6deg, rgba(50,194,196,0) 294deg 315deg,
      rgba(50,194,196,.10) 315.6deg 316.6deg, rgba(50,194,196,0) 317deg 338deg,
      rgba(239,170,54,.12) 338.6deg 339.6deg, rgba(50,194,196,0) 340deg 360deg);
    -webkit-mask-image:radial-gradient(closest-side,#000 6%,rgba(0,0,0,.55) 34%,transparent 72%);
    mask-image:radial-gradient(closest-side,#000 6%,rgba(0,0,0,.55) 34%,transparent 72%);
    animation:spin 180s linear infinite;
  }
  #field{position:absolute;inset:0;z-index:2;width:100%;height:100%;display:block;pointer-events:none}
  .ah::after{
    content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
    background:radial-gradient(40% 36% at 50% 30%,rgba(239,170,54,.2),transparent 62%),
               radial-gradient(90% 70% at 50% 46%,rgba(2,19,31,.45),rgba(2,19,31,.85) 80%);
  }
  .ah-content{position:relative;z-index:4;text-align:center;padding-block:70px 88px}
  .ah-star{display:block;width:72px;margin:0 auto 26px;filter:drop-shadow(0 0 28px rgba(239,170,54,.55)) drop-shadow(0 0 64px rgba(50,194,196,.4))}
  .ah-kick{color:var(--gold);display:block;margin-bottom:20px}
  .ah h1{font-size:clamp(54px,9.6vw,148px);line-height:.82;color:var(--white)}
  .ah h1 em{font-style:normal;color:var(--gold)}
  .ah-sub{margin:26px auto 0;max-width:54ch;font-size:19px;color:var(--mist)}
  .ah-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:34px}

  .r-name{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  /* ---------- scenario tabs under the diptych ---------- */
  .scen{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
  .scen-tab{
    position:relative;overflow:hidden;border:1px solid rgba(166,194,210,.3);background:transparent;color:var(--mist);
    font-family:var(--sans);font-size:12.5px;font-weight:600;padding:9px 15px;border-radius:999px;cursor:pointer;
    transition:border-color .16s ease,color .16s ease;
  }
  .scen-tab span{font-size:9.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#6F8FA2;margin-right:7px}
  .scen-tab:hover{border-color:var(--gold);color:var(--white)}
  .scen-tab[aria-pressed="true"]{border-color:var(--gold);color:var(--white)}
  .scen-tab[aria-pressed="true"] span{color:var(--gold)}
  .scen-tab::after{
    content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--gold);
  }
  .scen-tab.run::after{animation:fill var(--cycle,18s) linear forwards}
  @keyframes fill{to{width:100%}}


  .ah h1{font-size:clamp(42px,6.4vw,96px);line-height:.92}
  .pillars{
    display:grid;grid-template-columns:repeat(3,1fr);gap:1px;max-width:1040px;margin:44px auto 0;text-align:left;
    background:rgba(166,194,210,.2);border:1px solid rgba(166,194,210,.2);border-radius:14px;overflow:hidden;
  }
  .pillar{background:rgba(4,37,63,.62);backdrop-filter:blur(6px);padding:24px 24px 22px;display:flex;flex-direction:column;gap:9px}
  .pillar-verb{font-family:var(--cond);font-size:30px;font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:.9;color:var(--white)}
  .pillar-line{font-size:15px;line-height:1.6;color:var(--mist)}
  .pillar-prod{margin-top:auto;padding-top:6px;font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}

  .stage-intro{background:var(--navy-deep);text-align:center;padding:64px 26px 38px;border-top:1px solid rgba(166,194,210,.14)}
  .stage-intro .lbl{color:var(--gold)}
  .stage-intro h2{font-size:clamp(34px,5vw,68px);line-height:.94;color:var(--white);margin-top:14px}


  /* ---------- illustrative dashboard ---------- */
  .db-figure{margin:40px 0 0;position:relative}
  .db-figure::before{
    content:"";position:absolute;left:50%;top:40%;width:80%;height:70%;transform:translate(-50%,-50%);
    background:radial-gradient(ellipse,rgba(239,170,54,.28),rgba(4,37,63,0) 70%);filter:blur(30px);pointer-events:none;
  }
  .db-frame{position:relative;overflow:hidden;max-width:1204px;margin-inline:auto}
  .db{
    width:1200px;transform-origin:top left;background:#F4F7F8;color:#0B1B28;border-radius:14px;overflow:hidden;
    font-family:var(--sans);font-size:13px;line-height:1.45;letter-spacing:0;text-transform:none;
    box-shadow:0 40px 90px -40px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.08);
  }
  .db-chrome{display:flex;align-items:center;gap:7px;height:36px;padding:0 14px;background:#E6ECEE;border-bottom:1px solid #D6DFE2}
  .db-chrome i{width:10px;height:10px;border-radius:50%;background:#C9D3D7}
  .db-url{margin-left:14px;background:#fff;border:1px solid #D6DFE2;border-radius:6px;padding:3px 12px;font-size:11.5px;color:#5B7280}
  .db-app{display:grid;grid-template-columns:196px 1fr;min-height:640px}

  .db-side{background:#04253F;color:#A6C2D2;padding:18px 14px;display:flex;flex-direction:column;gap:2px}
  .db-logo{display:flex;align-items:center;gap:8px;margin-bottom:18px}
  .db-logo b{font-family:var(--sans);font-size:17px;font-weight:800;color:#fff;letter-spacing:-.02em;text-transform:none}
  .db-sec{font-size:9.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#5F8093;margin:12px 8px 4px}
  .db-nav{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;border-radius:7px;font-size:13px;font-weight:500;color:#C3D6E1}
  .db-nav.on{background:rgba(239,170,54,.16);color:#fff;box-shadow:inset 3px 0 0 #EFAA36}
  .db-badge{font-size:10px;font-weight:800;background:#32C2C4;color:#04253F;border-radius:999px;padding:1px 7px}
  .db-org{margin-top:auto;display:flex;align-items:center;gap:9px;padding:10px 8px;border-top:1px solid rgba(166,194,210,.18)}
  .db-org b{display:block;color:#fff;font-size:12.5px;font-weight:700}
  .db-org small{display:block;font-size:10.5px;color:#7F9DB0}
  .db-avatar{width:28px;height:28px;border-radius:7px;background:#EFAA36;color:#04253F;display:grid;place-items:center;font-size:11px;font-weight:800}

  .db-main{padding:20px 22px 22px;display:flex;flex-direction:column;gap:16px}
  .db-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
  .db-crumb{font-size:11.5px;color:#7F95A3}
  .db-title{font-size:21px;font-weight:800;letter-spacing:-.02em;color:#0B1B28;margin-top:2px}
  .db-filters{display:flex;gap:6px}
  .db-chip{font-size:11.5px;font-weight:600;border:1px solid #D6DFE2;background:#fff;border-radius:7px;padding:5px 10px;color:#4B6272}
  .db-chip.on{border-color:#0B1B28;color:#0B1B28}

  .db-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .db-kpi{background:#fff;border:1px solid #E1E8EB;border-radius:10px;padding:13px 15px}
  .db-k{font-size:11px;font-weight:700;color:#7F95A3}
  .db-v{font-size:27px;font-weight:800;letter-spacing:-.03em;color:#0B1B28;font-variant-numeric:tabular-nums;margin-top:2px}
  .db-v small{font-size:14px;font-weight:600;color:#7F95A3}
  .db-d{font-size:11px;font-weight:700;margin-top:2px}
  .db-d.up{color:#067647}
  .db-d.flat{color:#4B6272}

  .db-grid{display:grid;grid-template-columns:1.72fr 1fr;gap:12px}
  .db-card{background:#fff;border:1px solid #E1E8EB;border-radius:10px;padding:14px 16px;position:relative}
  .db-card-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
  .db-card-t{font-size:13px;font-weight:800;color:#0B1B28}
  .db-chart-card .db-card-hd{flex-direction:column;align-items:flex-start;gap:7px}
  .db-legend{display:flex;gap:14px;flex-wrap:wrap}
  .db-legend span{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#4B6272}
  .db-legend i{width:14px;height:3px;border-radius:2px;display:inline-block}
  .db-legend .you{color:#0B1B28;font-weight:800}
  #dbChart{display:block;overflow:visible}

  .db-tip{
    position:absolute;pointer-events:none;background:#0B1B28;color:#fff;border-radius:8px;padding:9px 11px;min-width:170px;
    font-size:11.5px;box-shadow:0 14px 30px -14px rgba(0,0,0,.6);z-index:5;
  }
  .db-tip b{display:block;font-size:11px;color:#A6C2D2;margin-bottom:5px;font-weight:700}
  .db-tip div{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;padding-block:2px}
  .db-tip i{width:8px;height:8px;border-radius:50%}
  .db-tip em{font-style:normal;font-variant-numeric:tabular-nums;font-weight:700}

  .db-qs{list-style:none;margin:0;padding:0}
  .db-qs li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #EEF2F4}
  .db-q{font-size:12px;color:#0B1B28;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .db-st{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;border-radius:999px;padding:3px 9px;white-space:nowrap}
  .db-st i{width:6px;height:6px;border-radius:50%}
  .db-st.crit{background:#FEF3F2;color:#B42318}
  .db-st.crit i{background:transparent;border:1.5px solid #B42318}
  .db-st.mid{background:#F0F4F6;color:#4B6272}
  .db-st.good{background:#ECFDF3;color:#067647}
  .db-st.good i{background:#067647}
  .db-foot{margin-top:10px;font-size:11.5px;color:#4B6272}
  .db-foot b{color:#03A0AE}

  .db-bars{display:flex;flex-direction:column;gap:9px;margin-top:4px}
  .db-bar{display:grid;grid-template-columns:128px 1fr 44px;gap:10px;align-items:center;font-size:12px;cursor:default}
  .db-bar span:first-child{color:#4B6272}
  .db-track{height:12px;background:#F0F4F6;border-radius:0 4px 4px 0;position:relative}
  .db-fill{position:absolute;left:0;top:0;bottom:0;background:#BA7A0C;border-radius:0 4px 4px 0}
  .db-bar:hover .db-fill{background:#9C650A}
  .db-bar em{font-style:normal;font-weight:800;text-align:right;font-variant-numeric:tabular-nums;color:#0B1B28}

  .db-live{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;color:#03A0AE}
  .db-live i{width:6px;height:6px;border-radius:50%;background:#03A0AE}
  .db-feed{list-style:none;margin:0;padding:0}
  .db-feed li{display:grid;grid-template-columns:40px 1fr;gap:8px;padding:7px 0;border-bottom:1px solid #EEF2F4;font-size:12px;color:#4B6272}
  .db-feed time{color:#7F95A3;font-variant-numeric:tabular-nums}
  .db-feed b{color:#0B1B28}


  @property --db-ang{syntax:'<angle>';inherits:false;initial-value:0deg}
  .db-frame{
    padding:2px;border-radius:17px;
    background:conic-gradient(from var(--db-ang),#EFAA36 0%,#FFD98F 8%,rgba(239,170,54,.2) 22%,#32C2C4 38%,rgba(50,194,196,.2) 52%,#EFAA36 66%,#FFD98F 72%,rgba(239,170,54,.2) 86%,#EFAA36 100%);
    box-shadow:0 0 0 1px rgba(239,170,54,.18),0 34px 90px -34px rgba(239,170,54,.55),0 0 70px -18px rgba(50,194,196,.45);
    animation:db-spin 14s linear infinite;
  }
  @keyframes db-spin{to{--db-ang:360deg}}
  .db{border-radius:15px}

  .db-ping{transform-box:fill-box;transform-origin:center;animation:db-ping 2.2s ease-out infinite}
  @keyframes db-ping{0%{transform:scale(1);opacity:.9}100%{transform:scale(3.4);opacity:0}}
  .db-new{animation:db-in .5s ease both;background:linear-gradient(90deg,rgba(3,160,174,.09),transparent 70%)}
  @keyframes db-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  .db-bump{animation:db-bump .5s ease}
  @keyframes db-bump{40%{transform:scale(1.25)}}
  .db-flash{animation:db-flash 1.1s ease}
  @keyframes db-flash{0%{color:#067647}100%{color:#0B1B28}}
  @media (prefers-reduced-motion:reduce){.db-frame{animation:none}}


  /* ---------- dashboard views ---------- */
  .db-app{height:792px;min-height:0}
  .db-main{display:block;padding:20px 22px 22px;overflow:hidden;min-width:0}
  .db-view{display:none;flex-direction:column;gap:16px;height:100%}
  .db-view.on{display:flex;animation:db-view .3s ease both}
  @keyframes db-view{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  .db-fill-grid{flex:1;min-height:0}
  .db-col{display:flex;flex-direction:column;min-height:0}

  button.db-nav{border:0;background:transparent;width:100%;text-align:left;cursor:pointer;font-family:inherit}
  button.db-nav:hover{background:rgba(255,255,255,.06);color:#fff}
  .db-run{width:7px;height:7px;border-radius:50%;background:#32C2C4;box-shadow:0 0 0 0 rgba(50,194,196,.6);animation:db-runp 1.8s ease-in-out infinite}
  @keyframes db-runp{50%{box-shadow:0 0 0 5px rgba(50,194,196,0)}}
  .db-link{border:0;background:none;padding:0;font:inherit;font-weight:800;color:#03A0AE;cursor:pointer}
  .db-link:hover{text-decoration:underline}
  button.db-chip{cursor:pointer;font-family:inherit}
  button.db-chip:hover{border-color:#0B1B28;color:#0B1B28}
  .db-d.down{color:#B42318}

  /* pulse */
  .db-events{display:flex;flex-direction:column;overflow:hidden}
  .db-ev{display:grid;grid-template-columns:44px 92px 1fr 78px 70px;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid #EEF2F4;font-size:12px}
  .db-ev time{color:#7F95A3;font-variant-numeric:tabular-nums}
  .db-ev-t{color:#4B6272;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .db-ev-t b{color:#0B1B28}
  .db-ev[hidden]{display:none}
  .db-tag{font-size:10px;font-weight:800;letter-spacing:.04em;border-radius:5px;padding:3px 7px;justify-self:start}
  .db-tag.win{background:#ECFDF3;color:#067647}
  .db-tag.loss{background:#FEF3F2;color:#B42318}
  .db-tag.comp{background:#F0F4F6;color:#4B6272}
  .db-tag.opp{background:#E4F4F6;color:#04606B}
  .db-imp{font-size:11.5px;font-weight:700;color:#4B6272;font-variant-numeric:tabular-nums}
  .db-imp.up{color:#067647}.db-imp.down{color:#B42318}
  .db-act{border:1px solid #D6DFE2;background:#fff;border-radius:6px;font:inherit;font-size:11px;font-weight:700;color:#0B1B28;padding:4px 0;cursor:pointer}
  .db-act:hover{border-color:#03A0AE;color:#03A0AE}
  .db-act.done{background:#ECFDF3;border-color:#ABEFC6;color:#067647;cursor:default}
  .db-movers{list-style:none;margin:0;padding:0}
  .db-movers li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #EEF2F4;font-size:12.5px;color:#4B6272}
  .db-movers span{display:flex;align-items:center;gap:8px}
  .db-movers i{width:9px;height:9px;border-radius:50%}
  .db-movers b{color:#0B1B28}
  .db-movers em{font-style:normal;font-weight:800;font-size:11.5px}
  .db-movers em.up{color:#067647}.db-movers em.down{color:#B42318}
  .db-note{margin-top:auto;background:#F4F7F8;border-radius:8px;padding:12px 13px;font-size:12px;color:#4B6272}
  .db-note .db-k{margin-bottom:4px}
  .db-note b{color:#0B1B28}

  /* agents */
  .db-agents{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
  .db-agent{background:#fff;border:1px solid #E1E8EB;border-radius:10px;padding:13px 14px;display:flex;flex-direction:column;gap:8px}
  .db-agent-hd{display:flex;justify-content:space-between;align-items:center;gap:8px}
  .db-agent-hd b{font-size:13px;color:#0B1B28}
  .db-agent p{font-size:12px;color:#4B6272;min-height:34px}
  .db-state{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;border-radius:999px;padding:2px 8px}
  .db-state.run{background:#E4F4F6;color:#04606B}
  .db-state.run i{width:6px;height:6px;border-radius:50%;background:#03A0AE;animation:db-runp 1.6s ease-in-out infinite}
  .db-state.queue{background:#F0F4F6;color:#4B6272}
  .db-state.idle{background:#F4F7F8;color:#7F95A3}
  .db-prog{height:6px;background:#EEF2F4;border-radius:4px;overflow:hidden;position:relative}
  .db-prog span{display:block;height:100%;background:#03A0AE;border-radius:4px;transition:width .9s ease}
  .db-prog.cont span{width:34%;position:absolute;animation:db-slide 1.8s ease-in-out infinite}
  @keyframes db-slide{0%{left:-34%}100%{left:100%}}
  .db-pct{font-size:10.5px;color:#7F95A3;font-weight:700;font-variant-numeric:tabular-nums}
  .db-queue{display:flex;flex-direction:column}
  .db-qi{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #EEF2F4}
  .db-qi b{display:block;font-size:12.5px;color:#0B1B28}
  .db-qi small{display:block;font-size:11px;color:#7F95A3;margin-top:2px}
  .db-approve{border:0;background:#0B1B28;color:#fff;border-radius:7px;font:inherit;font-size:11.5px;font-weight:800;padding:7px 12px;cursor:pointer;white-space:nowrap}
  .db-approve:hover{background:#03A0AE}
  .db-approve.done{background:#ECFDF3;color:#067647;cursor:default}

  /* studio */
  .db-assets{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-content:start}
  .db-asset{background:#fff;border:1px solid #E1E8EB;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:6px;transition:border-color .2s ease,transform .2s ease}
  .db-asset:hover{border-color:#03A0AE;transform:translateY(-2px)}
  .db-asset[hidden]{display:none}
  .db-thumb{height:96px;border-radius:7px;background:#F4F7F8;border:1px solid #EEF2F4;padding:10px;display:flex;flex-direction:column;gap:7px;margin-bottom:4px}
  .db-thumb i{height:12px;width:46%;border-radius:3px;background:#04253F}
  .db-thumb b{height:6px;border-radius:3px;background:#D6DFE2}
  .db-thumb b.s{width:62%}
  .db-type{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#03A0AE}
  .db-asset-t{font-size:13px;font-weight:800;color:#0B1B28}
  .db-asset-g{font-size:11.5px;color:#7F95A3}
  .db-asset-g em{font-style:normal;color:#4B6272}
  .db-asset .db-st{align-self:flex-start;margin-top:2px}

  /* authority */
  .db-key{display:flex;align-items:center;gap:6px;font-size:10.5px;color:#7F95A3;font-weight:700}
  .db-key i{width:9px;height:9px;border-radius:50%}
  .db-key i.y,.db-gap i.y{background:#0B1B28}
  .db-key i.n,.db-gap i.n{background:#fff;border:1.5px solid #B6C3C9}
  .db-key i.n{margin-left:8px}
  .db-gaps{display:flex;flex-direction:column}
  .db-gap{display:grid;grid-template-columns:1fr 70px 60px 50px 96px;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid #EEF2F4;font-size:12px;color:#0B1B28}
  .db-gap i{width:10px;height:10px;border-radius:50%;justify-self:center}
  .db-gap .db-st{justify-self:start}
  .db-gap-hd{font-size:10.5px;font-weight:800;color:#7F95A3;padding-top:2px}
  .db-gap-hd span:not(:first-child){text-align:center}
  .db-gap-hd span:last-child{text-align:left}
  .db-auth{margin-top:6px}
  .db-auth .db-bar{grid-template-columns:150px 1fr 30px}

  /* intelligence */
  .db-intent{margin-top:8px;gap:13px}
  .db-intent .db-bar{grid-template-columns:150px 1fr 40px}
  .db-lines{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
  .db-line{border:1px solid #D6DFE2;background:#fff;border-radius:999px;font:inherit;font-size:12px;font-weight:600;color:#4B6272;padding:6px 11px;cursor:pointer}
  .db-line em{font-style:normal;font-weight:800;color:#0B1B28;margin-left:4px;font-variant-numeric:tabular-nums}
  .db-line:hover{border-color:#03A0AE}
  .db-line.on{background:#0B1B28;border-color:#0B1B28;color:#fff}
  .db-line.on em{color:#EFAA36}
  .db-detail{margin-top:auto;background:#F4F7F8;border-radius:8px;padding:12px 13px;font-size:12.5px;color:#4B6272}
  .db-detail b{color:#0B1B28}
  .db-detail .db-k{margin-bottom:4px}


  /* ---------- product tabs that drive the dashboard ---------- */
  .ptabs{
    display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:8px;row-gap:9px;
    max-width:1204px;margin:0 auto 12px;position:relative;z-index:2;
  }
  .pg{
    grid-row:1;font-size:10.5px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);
    border-bottom:1px solid rgba(239,170,54,.32);padding-bottom:7px;
  }
  .ptab{
    position:relative;overflow:hidden;text-align:left;cursor:pointer;font-family:var(--sans);
    background:rgba(4,37,63,.62);border:1px solid rgba(166,194,210,.2);border-radius:12px;padding:14px 14px 16px;
    color:var(--mist);transition:border-color .2s ease,background .2s ease,transform .2s ease;
  }
  .ptab:hover{border-color:rgba(239,170,54,.55);transform:translateY(-1px)}
  .ptab b{display:block;font-family:var(--cond);font-size:23px;font-weight:800;line-height:1;letter-spacing:.01em;text-transform:uppercase;color:#fff}
  .ptab span{display:block;margin-top:7px;font-size:12.5px;line-height:1.42}
  .ptab.on{background:#0A3453;border-color:var(--gold);box-shadow:0 14px 34px -20px rgba(239,170,54,.7)}
  .ptab.on b{color:var(--gold)}
  .ptab.on span{color:#fff}
  .ptab::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--gold)}
  .ptab.run::after{animation:fill var(--pcycle,8s) linear forwards}
  .suite-sub{margin-bottom:34px}
  @media (max-width:980px){
    .ptabs{grid-template-columns:repeat(6,minmax(172px,1fr));overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory}
    .ptab{scroll-snap-align:start}
  }


  /* ---------- a clear break before the product section ---------- */
  .suite{
    border-top:1px solid rgba(239,170,54,.45);
    background:radial-gradient(80% 55% at 50% 0%,#0C3A5A 0%,#052841 38%,#02182A 72%,#021420 100%);
    padding-top:70px;
  }
  .suite::after{
    content:"";position:absolute;left:50%;top:-1px;width:min(760px,80%);height:1px;transform:translateX(-50%);
    background:linear-gradient(90deg,transparent,#EFAA36,transparent);box-shadow:0 0 18px 1px rgba(239,170,54,.55);
  }

  .db-cap{margin-top:14px;text-align:center;font-size:12px;color:var(--mist);opacity:.8}


  /* ---------- proof: logos and photo testimonials ---------- */
  .proof{padding-block:84px 92px}
  .proof-hd{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
  .proof-hd h2{font-size:clamp(34px,5vw,68px);line-height:.94;color:#fff;max-width:24ch}
  .logo-row{
    display:grid;grid-template-columns:repeat(6,1fr);gap:1px;margin-top:42px;border-radius:14px;overflow:hidden;
    background:rgba(166,194,210,.16);border:1px solid rgba(166,194,210,.16);
  }
  .lg{background:var(--navy-deep);display:grid;place-items:center;padding:24px 16px;color:#7F9DB0;transition:color .25s ease,background .25s ease}
  .lg:hover{color:#fff;background:#04203A}
  .lg svg{width:100%;max-width:190px;height:auto;display:block}

  .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}
  .qcard{
    position:relative;margin:0;border-radius:18px;overflow:hidden;isolation:isolate;aspect-ratio:4/5;min-height:470px;
    border:1px solid rgba(166,194,210,.22);box-shadow:0 30px 70px -40px rgba(0,0,0,.9);
  }
  .qcard img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;z-index:-2;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
  .qcard:hover img{transform:scale(1.06)}
  .qshade{
    position:absolute;inset:0;z-index:-1;
    background:linear-gradient(180deg,rgba(2,24,39,.05) 0%,rgba(2,24,39,.25) 30%,rgba(2,24,39,.86) 60%,#021827 100%);
  }
  .qcard::after{
    content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;
    box-shadow:inset 0 0 0 1px rgba(239,170,54,0);transition:box-shadow .3s ease;
  }
  .qcard:hover::after{box-shadow:inset 0 0 0 1.5px rgba(239,170,54,.7)}
  .qsample{
    position:absolute;top:16px;left:16px;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
    color:#fff;background:rgba(2,24,39,.55);border:1px solid rgba(255,255,255,.28);padding:5px 10px;border-radius:999px;backdrop-filter:blur(6px);
  }
  .qbody{position:absolute;left:0;right:0;bottom:0;padding:28px 26px 26px}
  .qstat{
    display:inline-flex;align-items:baseline;gap:8px;padding:6px 12px;border-radius:999px;
    background:rgba(239,170,54,.14);border:1px solid rgba(239,170,54,.5);color:#FFD98F;font-size:12px;font-weight:700;
  }
  .qstat b{font-family:var(--cond);font-size:21px;font-weight:900;color:var(--gold);letter-spacing:.01em;line-height:1}
  .qcard blockquote{margin:16px 0 18px;font-size:18px;line-height:1.48;font-weight:500;color:#fff;text-wrap:pretty}
  .qcard figcaption b{display:block;font-size:14.5px;color:#fff}
  .qcard figcaption span{display:block;font-size:12.5px;color:var(--mist);margin-top:2px}
  .proof-note{margin-top:18px;text-align:center;font-size:12px;color:#6F8FA2}

  @media (max-width:1000px){
    .logo-row{grid-template-columns:repeat(3,1fr)}
    .quotes{grid-template-columns:1fr}
    .qcard{aspect-ratio:auto;min-height:440px}
  }


  /* ---------- the moment band ---------- */
  .moment{position:relative;overflow:hidden;isolation:isolate;min-height:680px;display:flex;align-items:center;background:#02131F}
  .moment-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:38% 42%;z-index:-2;filter:brightness(1.45) contrast(1.06);transform:scale(1.06);transition:transform 2.4s cubic-bezier(.2,.7,.2,1)}
  .moment.seen .moment-img{transform:scale(1)}
  .moment-shade{
    position:absolute;inset:0;z-index:-1;
    background:linear-gradient(90deg,rgba(2,19,31,0) 36%,rgba(2,19,31,.5) 62%,rgba(2,19,31,.86) 100%),
               linear-gradient(180deg,rgba(2,19,31,.25) 0%,rgba(2,19,31,0) 22%,rgba(2,19,31,0) 74%,#021827 100%);
  }
  .moment-in{display:flex;justify-content:flex-end;align-self:center;padding-block:96px 92px}
  .moment-copy{max-width:540px}
  .moment-copy .lbl{color:var(--gold)}
  .moment h2{font-size:clamp(34px,4.4vw,62px);line-height:1.08;color:#fff;margin-top:16px}
  .moment h2 em{font-style:normal;color:var(--gold);margin-right:.07em}
  .moment-sub{margin-top:20px;font-size:18.5px;line-height:1.6;color:var(--mist);max-width:44ch}

  /* ---------- industry cards, now with the moment of asking ---------- */
  .fgrid{gap:20px}
  .field{padding:0;overflow:hidden;border-radius:16px;display:flex;flex-direction:column;background:#04203A;transition:border-color .25s ease,transform .25s ease}
  .field:hover{border-color:rgba(239,170,54,.6);transform:translateY(-3px)}
  .field-img{position:relative;aspect-ratio:4/3;overflow:hidden}
  .field-img img{width:100%;height:100%;max-width:none;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .field:hover .field-img img{transform:scale(1.05)}
  .field-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,24,39,0) 45%,rgba(2,24,39,.72) 100%)}
  .field-ask{
    position:absolute;left:14px;right:14px;bottom:14px;z-index:2;display:flex;align-items:center;gap:9px;
    background:rgba(4,37,63,.72);backdrop-filter:blur(8px);border:1px solid rgba(166,194,210,.3);
    border-radius:12px 12px 12px 4px;padding:10px 13px;font-size:14px;font-weight:500;color:#fff;line-height:1.35;
  }
  .field-ask svg{width:14px;height:14px;flex:none}
  .field-body{padding:22px 24px 26px}
  .field-body h3{font-size:28px;color:var(--white);margin:10px 0 10px}
  @media (max-width:900px){
    .moment{min-height:560px}
    .moment-in{justify-content:flex-start}
    .moment-shade{background:linear-gradient(180deg,rgba(2,19,31,.2) 0%,rgba(2,19,31,.55) 45%,#021827 100%)}
  }


  /* ---------- #3 reassurance beside the button ---------- */
  .ah-assure{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 22px;margin-top:16px;font-size:13.5px;color:var(--mist)}
  .ah-assure span{display:inline-flex;align-items:center;gap:7px}
  .ah-assure svg{width:14px;height:14px}

  /* ---------- #1 product peek at the foot of the hero ---------- */
  .ah-content{padding-bottom:0}
  .peek{position:relative;z-index:5;display:block;max-width:1100px;margin:56px auto 0;text-decoration:none;color:inherit}
  .peek-frame{
    position:relative;height:clamp(190px,25vw,320px);overflow:hidden;background:#F4F7F8;
    border:1px solid rgba(239,170,54,.55);border-bottom:0;border-radius:16px 16px 0 0;
    box-shadow:0 -18px 70px -30px rgba(239,170,54,.5),0 0 0 1px rgba(255,255,255,.04);
    transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s ease;
  }
  .peek:hover .peek-frame{transform:translateY(-6px);border-color:var(--gold)}
  .peek-inner{position:relative;width:100%;pointer-events:none;text-align:left}
  .peek-inner .db{transform-origin:top left;box-shadow:none;border-radius:0}
  .peek-frame::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(2,24,39,0) 62%,rgba(2,24,39,.55) 86%,#021827 100%);
  }
  .peek-cta{
    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;display:inline-flex;align-items:center;gap:9px;
    padding:13px 24px;border-radius:999px;background:var(--gold);border:1px solid var(--gold);color:var(--navy);
    box-shadow:0 14px 34px -12px rgba(2,19,31,.9);
    font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;backdrop-filter:blur(8px);white-space:nowrap;
  }
  .peek-cta svg{width:14px;height:14px;color:var(--navy)}
  .peek:hover .peek-cta{background:#FFC960}

  /* ---------- #2 the patchwork problem ---------- */
  .tangle{background:var(--navy-deep);padding-block:96px 90px;border-top:1px solid rgba(166,194,210,.14);overflow:hidden}
  .tg-hd{text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
  .tg-hd .lbl{color:var(--gold)}
  .tg-hd h2{font-size:clamp(38px,5.8vw,84px);line-height:.92;color:#fff;max-width:17ch}
  .tg-sub{max-width:60ch;color:var(--mist);font-size:18px;margin-top:6px}
  .tg-stage{position:relative;max-width:1100px;margin:54px auto 0}
  .tg-svg{display:block;width:100%;height:auto;overflow:visible}
  .tg-knot path{fill:none;stroke:rgba(166,194,210,.34);stroke-width:2;stroke-linecap:round;stroke-dasharray:7 9;animation:tg-flow 6s linear infinite}
  .tg-knot path:nth-child(2){stroke:rgba(50,194,196,.32);animation-duration:7.5s}
  .tg-knot path:nth-child(4){stroke:rgba(50,194,196,.26);animation-duration:9s}
  .tg-knot path:nth-child(5){animation-direction:reverse}
  @keyframes tg-flow{to{stroke-dashoffset:-160}}
  .tg-line{fill:none;stroke-width:4;stroke-linecap:round}
  .tg-chip{
    position:absolute;display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;
    background:rgba(4,37,63,.9);border:1px solid rgba(166,194,210,.3);color:#C9DBE5;font-size:12.5px;font-weight:600;white-space:nowrap;
    box-shadow:0 10px 24px -16px rgba(0,0,0,.9);animation:tg-bob 5s ease-in-out infinite;
  }
  .tg-chip:nth-of-type(2){animation-delay:-1.2s}.tg-chip:nth-of-type(3){animation-delay:-2.4s}
  .tg-chip:nth-of-type(4){animation-delay:-3.1s}.tg-chip:nth-of-type(5){animation-delay:-4s}
  .tg-chip i{display:inline-grid;width:15px;height:15px;color:#7F9DB0}
  .tg-chip i svg{width:15px;height:15px}
  @keyframes tg-bob{50%{transform:translateY(-5px)}}
  .tg-answer{
    position:absolute;right:0;top:50%;transform:translate(0,-50%);min-width:210px;padding:12px 14px;border-radius:12px;
    z-index:2;background:#04233B;border:1px solid rgba(239,170,54,.6);box-shadow:0 18px 40px -22px rgba(239,170,54,.6);
    transition:opacity .6s ease .9s,transform .6s ease .9s;
  }
  .tg-answer::before{
    content:"";position:absolute;left:-6px;top:50%;width:11px;height:11px;border-radius:50%;transform:translateY(-50%);
    background:var(--gold);box-shadow:0 0 0 4px rgba(239,170,54,.18);
  }
  .tg-answer-hd{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#fff;margin-bottom:8px}
  .tg-answer-hd svg{width:12px;height:12px}
  .tg-answer-row{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:#fff;background:linear-gradient(90deg,rgba(239,170,54,.28),transparent);box-shadow:inset 3px 0 0 var(--gold);padding:7px 9px;border-radius:4px}
  .tg-answer-row b{font-size:10.5px;color:var(--gold)}
  .tg-answer-row em{margin-left:auto;font-style:normal;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
  .tg-cap{position:absolute;bottom:-34px;font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
  .tg-cap-l{left:0;color:#6F8FA2}
  .tg-cap-r{right:0;color:var(--gold)}
  .tangle:not(.on) .tg-answer{opacity:0;transform:translate(12px,-50%)}

  .tg-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:84px;border-radius:14px;overflow:hidden;background:rgba(166,194,210,.16);border:1px solid rgba(166,194,210,.16)}
  .tg-item{background:#03213A;padding:26px 26px 28px}
  .tg-k{font-family:var(--cond);font-size:28px;font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:.9;color:#fff}
  .tg-p{margin-top:10px;font-size:15.5px;line-height:1.6;color:var(--mist)}
  .tg-bridge{margin-top:30px;text-align:center;font-size:19px;font-weight:600;color:#fff}

  .tg-mid{display:none}
  @media (max-width:900px){
    .tg-stage{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:40px}
    .tg-svg{display:none}
    .tg-cap{position:static;display:block;flex:0 0 100%;text-align:center}
    .tg-cap-l{order:1;margin-bottom:6px}
    .tg-chip{position:static;order:2;flex:none;animation:none}
    .tg-mid{display:block;order:3;flex:0 0 100%}
    .tg-mid svg{display:block;width:100%;max-width:300px;height:auto;margin:4px auto 0}
    .tg-cap-r{order:6;margin:14px 0 0}
    .tg-answer{order:5;position:relative;top:auto;right:auto;transform:none;margin:0 auto}
    .tangle:not(.on) .tg-answer{transform:translateY(10px)}
    .tg-answer::before{left:50%;top:-6px;transform:translateX(-50%)}
    .tg-trio{grid-template-columns:1fr;margin-top:56px}
  }
  @media (prefers-reduced-motion:reduce){.tg-knot path,.tg-chip{animation:none}}


  /* ---------- pages ---------- */
  .page{display:none}
  .page.on{display:block;animation:pg-in .32s ease both}
  @keyframes pg-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .nav-links a.on{color:var(--gold)}

  .subhero{
    position:relative;overflow:hidden;
    background:radial-gradient(90% 70% at 50% 0%,#0B3A5C 0%,#052841 40%,#02182A 74%,#021420 100%);
    border-bottom:1px solid rgba(166,194,210,.14);
  }
  .subhero-in{padding-block:84px 78px;max-width:1000px;text-align:center}
  .subhero-kick{color:var(--gold);display:block;margin-bottom:18px}
  .subhero h1{font-size:clamp(38px,5.4vw,74px);line-height:.94;color:#fff;max-width:22ch;margin-inline:auto}
  .subhero h1 em{font-style:normal;color:var(--gold)}
  .subhero-sub{margin:24px auto 0;max-width:60ch;font-size:18.5px;color:var(--mist)}
  .subhero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:32px}

  .psec{padding-block:84px;background:var(--navy-deep)}
  .psec + .psec{padding-top:0}
  .psec h2{font-size:clamp(32px,4.6vw,62px);line-height:.94;color:#fff;max-width:20ch}
  .psec-sub{margin-top:16px;max-width:62ch;color:var(--mist);font-size:17px}

  .qgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(288px,100%),1fr));gap:12px;margin-top:38px}
  .qq{
    display:flex;align-items:center;justify-content:space-between;gap:14px;
    background:rgba(4,37,63,.62);border:1px solid rgba(166,194,210,.2);border-radius:12px;padding:18px 18px;
  }
  .qq-t{font-size:15.5px;color:#fff;line-height:1.4}
  .qq .db-st{flex:none}

  .proof-split{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:34px;align-items:center}
  .proof-note-col h2{font-size:clamp(26px,3.2vw,40px)}

  .team{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:16px;margin-top:36px}
  .tm{background:rgba(4,37,63,.6);border:1px solid rgba(166,194,210,.2);border-radius:14px;padding:16px;text-align:center}
  .tm-face{
    aspect-ratio:1/1;border:1.5px dashed rgba(166,194,210,.4);border-radius:12px;display:grid;place-items:center;
    font-size:10.5px;font-weight:800;letter-spacing:.18em;color:#6F8FA2;margin-bottom:12px;
  }
  .tm b{display:block;color:#fff;font-size:15px}
  .tm span{display:block;color:var(--mist);font-size:13px;margin-top:2px}

  @media (max-width:820px){
    .proof-split{grid-template-columns:1fr}
  }


  /* ---------- vertical page components ---------- */
  .psec-kick{display:block;color:var(--gold);margin-bottom:14px}
  .psec-note{margin-top:18px;color:var(--mist);font-size:15px;max-width:66ch}
  .strip{margin-top:22px;font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#6F8FA2}

  .scards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(286px,100%),1fr));gap:14px;margin-top:38px}
  .scard{background:rgba(4,37,63,.62);border:1px solid rgba(166,194,210,.2);border-radius:14px;padding:24px 24px 26px;transition:border-color .2s ease,transform .2s ease}
  .scard:hover{border-color:rgba(239,170,54,.55);transform:translateY(-2px)}
  .scard .lbl{color:var(--teal)}
  .scard h3{font-size:25px;color:#fff;margin:10px 0 10px;line-height:1}
  .scard p{color:var(--mist);font-size:15px;line-height:1.6}

  .prompts{display:flex;flex-direction:column;gap:12px;margin-top:32px;max-width:72ch}
  .prompt{
    background:rgba(4,37,63,.7);border:1px solid rgba(166,194,210,.28);border-radius:16px 16px 16px 4px;
    padding:15px 18px;font-size:16px;color:#fff;line-height:1.5;
  }
  .prompt-hostile{margin-top:18px;border-color:rgba(255,122,92,.55);background:rgba(255,122,92,.09);max-width:72ch}

  .schips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
  .schip{
    border:1px solid rgba(50,194,196,.4);background:rgba(50,194,196,.08);border-radius:999px;
    padding:8px 14px;font-size:13px;font-weight:600;color:#BFE7EE;
  }

  .guards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(310px,100%),1fr));gap:1px;margin-top:36px;
    background:rgba(166,194,210,.16);border:1px solid rgba(166,194,210,.16);border-radius:14px;overflow:hidden}
  .guard{background:#03213A;padding:22px 22px 24px;display:flex;gap:12px;align-items:flex-start}
  .guard svg{width:17px;height:17px;flex:none;margin-top:2px}
  .guard b{display:block;color:#fff;font-size:15.5px;line-height:1.3}
  .guard p{margin-top:6px;color:var(--mist);font-size:14px;line-height:1.55}

  .agrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(228px,100%),1fr));gap:14px;margin-top:36px}
  .acard{background:rgba(4,37,63,.62);border:1px solid rgba(166,194,210,.2);border-radius:14px;padding:20px 20px 22px}
  .aname{font-family:var(--cond);font-size:27px;font-weight:800;text-transform:uppercase;letter-spacing:.02em;color:var(--gold);line-height:1}
  .acard p{margin-top:9px;color:var(--mist);font-size:14.5px;line-height:1.55}

  .steps3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(272px,100%),1fr));gap:16px;margin-top:38px}
  .step3{border-top:2px solid rgba(239,170,54,.6);padding-top:18px}
  /* the number sits on the same line as the word, not above it */
  .snum{font-family:var(--cond);font-size:16px;font-weight:800;color:var(--gold);flex:none}
  .step3 h3{display:flex;align-items:baseline;gap:11px;font-size:26px;color:#fff;margin:0 0 10px;line-height:1}
  .step3 p{color:var(--mist);font-size:15px;line-height:1.6}


  .bigline{margin-top:26px;font-size:clamp(19px,2.3vw,26px);font-weight:700;color:var(--gold);max-width:26ch;line-height:1.25}
  .rcard{background:rgba(4,37,63,.62);border:1px solid rgba(166,194,210,.2);border-radius:14px;padding:20px 20px 22px;transition:border-color .2s ease,transform .2s ease}
  .rcard:hover{border-color:rgba(239,170,54,.5);transform:translateY(-2px)}
  .rcard .lbl{color:var(--teal)}
  .rcard .aname{margin-top:8px}
  .rget{margin-top:12px;padding-top:11px;border-top:1px solid rgba(166,194,210,.18);color:#C9DBE5;font-size:13.5px;line-height:1.5}
  .rget b{color:var(--gold)}
  .numbered{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(272px,100%),1fr));gap:18px;margin-top:38px}
  .nitem{border-top:2px solid rgba(239,170,54,.55);padding-top:18px}
  .nnum{font-family:var(--cond);font-size:17px;font-weight:800;color:var(--gold)}
  .nitem h3{font-size:24px;color:#fff;margin:8px 0 10px;line-height:1}
  .nitem p{color:var(--mist);font-size:15px;line-height:1.6}


  /* ---------- menu dropdown ---------- */
  .nav-drop{position:relative;display:flex;align-items:center}
  .nav-top{
    display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;padding:0;
    font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);
  }
  .nav-top svg{width:11px;height:11px;transition:transform .18s ease}
  .nav-top:hover,.nav-drop.open .nav-top,.nav-drop.active .nav-top{color:var(--gold)}
  .nav-drop.open .nav-top svg{transform:rotate(180deg)}
  .nav-menu{
    position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(-6px);min-width:188px;
    background:#04203A;border:1px solid rgba(166,194,210,.28);border-radius:12px;padding:7px;
    box-shadow:0 26px 50px -26px rgba(0,0,0,.9);opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility .18s;
  }
  .nav-drop.open .nav-menu,.nav-drop:focus-within .nav-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
  .nav-menu a{display:block;padding:10px 12px;border-radius:8px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:none;color:var(--mist)}
  .nav-menu a:hover{background:rgba(239,170,54,.14);color:#fff}
  .nav-menu a.on{color:var(--gold)}

  @media (max-width:900px){
    .nav-links{display:none}
    .pillars{grid-template-columns:1fr}
    .row{grid-template-columns:1fr}
    .cell-dead{border-right:0;border-bottom:4px solid var(--gold)}
    /* stack the two worlds instead of placing them side by side */
    .split{grid-template-columns:1fr}
    .pane{padding:44px 24px 52px}
    .pane-live{border-left:0;border-top:3px solid var(--gold)}
    .pane-dead .pane-in,.pane-live .pane-in{margin:0;padding:0;max-width:none}
    .pane-mark{position:static;display:block;margin-bottom:14px}
    .pane-dead .pane-mark,.pane-live .pane-mark{left:auto;right:auto}
  }
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

  /* ---------- industry heroes: text left, photograph right ---------- */
  .subhero.sh-split .subhero-in{
    position:relative;z-index:2;max-width:1320px;text-align:left;padding-block:96px 88px;
  }
  .subhero.sh-split .subhero-kick{margin-bottom:16px}
  .subhero.sh-split h1{margin-inline:0;max-width:15ch}
  .subhero.sh-split .subhero-sub{margin-inline:0;max-width:44ch}
  .subhero.sh-split .subhero-cta{justify-content:flex-start}
  .subhero.sh-split .strip{text-align:left}
  .sh-img{
    position:absolute;top:0;right:0;bottom:0;width:62%;height:100%;max-width:none;object-fit:cover;object-position:50% 42%;z-index:0;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.28) 20%,rgba(0,0,0,.82) 48%,#000 74%);
    mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.28) 20%,rgba(0,0,0,.82) 48%,#000 74%);
  }
  .sh-veil{
    position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(90deg,#02182A 10%,rgba(2,24,42,.74) 32%,rgba(2,24,42,0) 64%),
               linear-gradient(180deg,rgba(2,20,32,.4) 0,rgba(2,20,32,0) 26%,rgba(2,20,32,.3) 74%,rgba(2,20,32,.78) 100%);
  }

  /* ---------- a section that carries a photograph beside its copy ---------- */
  .psec.psec-img{padding-block:84px}
  .pimg-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:48px;align-items:center}
  .pimg{margin:0;position:relative;border-radius:16px;overflow:hidden;border:1px solid rgba(166,194,210,.2)}
  .pimg img{display:block;width:100%;height:auto;max-width:none;aspect-ratio:4/3;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .pimg:hover img{transform:scale(1.04)}
  .pimg::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(2,24,39,0) 58%,rgba(2,24,39,.52) 100%);
  }
  .pimg-copy .psec-sub{max-width:52ch}

  @media (max-width:1000px){
    .sh-img{width:100%;-webkit-mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.5) 55%,transparent 88%);
            mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.5) 55%,transparent 88%)}
    .sh-veil{background:linear-gradient(180deg,rgba(2,20,32,.55) 0,rgba(2,22,36,.86) 42%,#02182A 72%)}
    .subhero.sh-split .subhero-in{padding-block:200px 72px}
    .subhero.sh-split h1,.subhero.sh-split .subhero-sub{max-width:24ch}
    .pimg-grid{grid-template-columns:1fr;gap:28px}
    .pimg{order:-1}
  }

  /* ---------- the prompt battery, shown as a chat session ---------- */
  .cwin{
    margin-top:32px;max-width:780px;border:1px solid rgba(166,194,210,.3);border-radius:16px;overflow:hidden;
    background:rgba(4,37,63,.58);backdrop-filter:blur(6px);box-shadow:0 26px 56px -34px rgba(0,0,0,.9);
  }
  .cwin-hd{
    display:flex;align-items:center;gap:9px;padding:11px 15px;
    border-bottom:1px solid rgba(166,194,210,.22);background:rgba(2,24,39,.42);
  }
  .cwin-hd svg{width:16px;height:16px;flex:none}
  .cwin-hd .app{font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#fff}
  .cwin-hd .meta{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
  .cwin-body{padding:16px;display:flex;flex-direction:column;gap:12px}
  .cq{
    align-self:flex-end;max-width:88%;margin:0;padding:12px 16px;
    background:rgba(255,255,255,.12);border:1px solid rgba(166,194,210,.28);border-radius:16px 16px 4px 16px;
    font-size:15.5px;line-height:1.5;color:#fff;
    opacity:0;transform:translateY(9px);transition:opacity .45s ease,transform .45s ease;
  }
  .cwin.seen .cq{opacity:1;transform:none}
  .cq-hostile{background:rgba(255,122,92,.12);border-color:rgba(255,122,92,.55)}
  .ca{display:flex;gap:11px;align-items:flex-start;opacity:0;transition:opacity .5s ease}
  .cwin.seen .ca{opacity:1}
  .ca-av{
    width:24px;height:24px;border-radius:7px;flex:none;display:grid;place-items:center;
    background:rgba(50,194,196,.14);border:1px solid rgba(50,194,196,.4);
  }
  .ca-line{font-size:15px;line-height:1.55;color:var(--mist);margin:0}
  .ca-line[hidden]{display:none}
  .cdots{display:inline-flex;gap:5px;align-items:center;height:22px}
  .cdots[hidden]{display:none}
  .cdots i{width:6px;height:6px;border-radius:50%;background:var(--teal);animation:bob 1.1s ease-in-out infinite}
  .cdots i:nth-child(2){animation-delay:.15s}
  .cdots i:nth-child(3){animation-delay:.3s}
  @media (max-width:640px){.cq{max-width:100%}}

  /* ---------- sector and segment cards carry a photograph ---------- */
  .scards{grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:18px}
  .scard-img{position:relative;margin:-24px -24px 18px;overflow:hidden;border-radius:14px 14px 0 0;background:#04203A}
  .scard-img img{
    display:block;width:100%;height:auto;max-width:none;aspect-ratio:16/10;object-fit:cover;
    transition:transform 1.1s cubic-bezier(.2,.7,.2,1);
  }
  .scard:hover .scard-img img{transform:scale(1.05)}
  .scard-img::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(2,24,39,0) 42%,rgba(4,37,63,.72) 100%);
  }

  /* ---------- leadership ---------- */
  .leads{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(272px,100%),1fr));gap:18px;margin-top:40px;max-width:1080px}
  .lead{
    background:rgba(4,37,63,.62);border:1px solid rgba(166,194,210,.2);border-radius:16px;overflow:hidden;
    transition:border-color .22s ease,transform .22s ease;
  }
  .lead:hover{border-color:rgba(239,170,54,.55);transform:translateY(-3px)}
  .lead-face{
    position:relative;aspect-ratio:1/1;display:grid;place-items:center;overflow:hidden;
    background:radial-gradient(90% 80% at 50% 28%,#0B3A5C 0%,#052841 46%,#02182A 82%);
  }
  .lead-face::before{
    content:"";position:absolute;left:50%;top:44%;width:180%;aspect-ratio:1;transform:translate(-50%,-50%);
    background:conic-gradient(from 0deg,
      rgba(50,194,196,0) 0 42deg, rgba(50,194,196,.16) 43deg 44deg, rgba(50,194,196,0) 45deg 128deg,
      rgba(239,170,54,.15) 129deg 130deg, rgba(50,194,196,0) 131deg 216deg,
      rgba(50,194,196,.13) 217deg 218deg, rgba(50,194,196,0) 219deg 302deg,
      rgba(239,170,54,.13) 303deg 304deg, rgba(50,194,196,0) 305deg 360deg);
    -webkit-mask-image:radial-gradient(closest-side,#000 10%,rgba(0,0,0,.45) 44%,transparent 76%);
    mask-image:radial-gradient(closest-side,#000 10%,rgba(0,0,0,.45) 44%,transparent 76%);
  }
  .lead-face img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 38%}
  .lead-mono{
    position:relative;font-family:var(--cond);font-size:clamp(58px,7.4vw,92px);font-weight:900;line-height:1;
    letter-spacing:.02em;color:var(--gold);text-transform:uppercase;
  }
  .lead-tag{
    position:absolute;top:14px;left:14px;z-index:2;font-size:9.5px;font-weight:800;letter-spacing:.18em;
    text-transform:uppercase;color:var(--teal);border:1px dashed rgba(50,194,196,.6);background:rgba(2,24,39,.55);
    padding:5px 10px;border-radius:999px;
  }
  .lead-body{padding:22px 22px 26px}
  .lead-name{font-family:var(--cond);font-size:30px;font-weight:900;text-transform:uppercase;line-height:.92;color:#fff;margin:0}
  .lead-role{margin:9px 0 0;font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
  @media (max-width:640px){.lead-face{aspect-ratio:1/1}}

  /* ================= v4: three loud moments, everything else quiet ================= */

  h1,h2,h3{text-transform:none;letter-spacing:0}
  .aname,.lead-name,.pillar-verb{text-transform:none}

  .psec h2,.fields h2,.row-hd h2,.suite h2,.proof-hd h2,.tg-hd h2,.stage-intro h2{
    font-size:clamp(30px,3.2vw,46px);line-height:1.02;text-align:left;max-width:24ch;margin-inline:0;
  }
  .row-hd,.stage-intro{text-align:left}
  .tg-hd,.proof-hd{align-items:flex-start;text-align:left}
  .row-hd p,.suite-sub,.tg-sub,.proof-hd p{margin-inline:0;text-align:left}
  .row-hd{padding-block:64px 34px}
  .suite-sub{max-width:62ch}

  .scard h3,.prod h3,.field h3,.field-body h3,.step3 h3,.nitem h3,.guard h3,.qq h3{
    font-family:var(--sans);font-weight:700;font-size:19.5px;line-height:1.32;letter-spacing:-.012em;
    margin:12px 0 8px;
  }
  .aname{font-size:23px;letter-spacing:0}
  .lead-name{font-size:26px}
  /* sized so the longest of the three sits on one line like its neighbours */
  .pillar-verb{font-size:24px;letter-spacing:0;text-wrap:balance}
  /* three columns persist down to 900px, so the heading has to come down with them */
  @media (max-width:1100px){.pillar-verb{font-size:clamp(18px,2.1vw,23px)}}
  @media (max-width:900px){.pillar-verb{font-size:26px}}

  .subhero-in{text-align:left;max-width:1320px}
  .subhero h1{font-size:clamp(33px,4.3vw,58px);line-height:1.02;margin-inline:0;max-width:20ch}
  .subhero-sub{margin-inline:0;max-width:52ch}
  .subhero-cta{justify-content:flex-start}
  .subhero .strip{text-align:left}

  /* the three that still shout */
  .ah h1{text-transform:uppercase;letter-spacing:.005em;line-height:.92}
  .moment h2{text-transform:uppercase;letter-spacing:.005em;font-size:clamp(34px,4.4vw,62px);line-height:1.08;max-width:none}
  .cta h2{text-transform:uppercase;letter-spacing:.005em}
  .verdict{letter-spacing:.005em}

  /* ---------- team hero: the founders as three frames ---------- */
  .sh-team{position:relative;overflow:hidden}
  .sh-two{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:54px;align-items:center}
  .sh-two-copy h1{max-width:14ch}
  .sh-faces{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;align-items:end}
  .sh-face{
    position:relative;aspect-ratio:3/4;border-radius:14px;overflow:hidden;display:grid;place-items:center;
    border:1px solid rgba(166,194,210,.22);
    background:radial-gradient(92% 82% at 50% 26%,#0B3A5C 0%,#052841 48%,#02182A 84%);
    box-shadow:0 26px 60px -34px rgba(0,0,0,.9);
  }
  .sh-face::before{
    content:"";position:absolute;left:50%;top:42%;width:190%;aspect-ratio:1;transform:translate(-50%,-50%);
    background:conic-gradient(from 0deg,
      rgba(50,194,196,0) 0 46deg, rgba(50,194,196,.17) 47deg 48deg, rgba(50,194,196,0) 49deg 132deg,
      rgba(239,170,54,.16) 133deg 134deg, rgba(50,194,196,0) 135deg 220deg,
      rgba(50,194,196,.14) 221deg 222deg, rgba(50,194,196,0) 223deg 306deg,
      rgba(239,170,54,.14) 307deg 308deg, rgba(50,194,196,0) 309deg 360deg);
    -webkit-mask-image:radial-gradient(closest-side,#000 10%,rgba(0,0,0,.45) 44%,transparent 76%);
    mask-image:radial-gradient(closest-side,#000 10%,rgba(0,0,0,.45) 44%,transparent 76%);
  }
  .sh-face span{
    position:relative;font-family:var(--cond);font-size:clamp(34px,3.6vw,52px);font-weight:900;line-height:1;
    letter-spacing:.02em;color:var(--gold);
  }
  .sh-face:nth-child(1){transform:translateY(22px)}
  .sh-face:nth-child(3){transform:translateY(-22px)}
  @media (max-width:1000px){
    .sh-two{grid-template-columns:1fr;gap:34px}
    .sh-faces{max-width:440px}
    .sh-face:nth-child(1),.sh-face:nth-child(3){transform:none}
  }

  .pimg-copy .numbered{grid-template-columns:1fr;gap:20px;margin-top:24px}
  .pimg-copy .nitem p{max-width:46ch}

  /* ---------- products hero: the visibility chart, drawn live ---------- */
  .sh-chart{position:relative;overflow:hidden}
  .hchart{
    margin:0;padding:20px 20px 14px;border-radius:16px;background:#041F33;
    border:1px solid rgba(166,194,210,.22);box-shadow:0 34px 76px -44px rgba(0,0,0,.95);
  }
  .hchart-hd{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:4px}
  .hchart-t{font-size:13.5px;font-weight:800;color:#fff}
  .hchart-d{font-size:12px;font-weight:800;color:var(--gold);white-space:nowrap}
  #heroChart{display:block;width:100%;height:auto;overflow:visible}
  .hchart-note{margin:6px 0 0;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#6F8FA2}
  .hc-line{fill:none;stroke-linejoin:round;stroke-linecap:round}
  .hc-draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.5s cubic-bezier(.3,.7,.3,1)}
  .hchart.on .hc-draw{stroke-dashoffset:0}
  .hc-end{opacity:0;transition:opacity .4s ease .9s}
  .hchart.on .hc-end{opacity:1}

  /* ---------- the diptych holds one size while it plays ---------- */
  .dots-slot{height:20px;flex:none}
  .chat-body{justify-content:flex-start}

  /* ---------- network hero: the citation graph, drawn live ---------- */
  .ngraph{
    margin:0;padding:20px 20px 14px;border-radius:16px;background:#041F33;
    border:1px solid rgba(166,194,210,.22);box-shadow:0 34px 76px -44px rgba(0,0,0,.95);
  }
  .ngraph-hd{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:6px}
  .ngraph-t{font-size:13.5px;font-weight:800;color:#fff}
  .ngraph-d{font-size:12px;font-weight:600;color:var(--mist)}
  #netGraph{display:block;width:100%;height:auto;overflow:visible}
  .ngraph-note{margin:6px 0 0;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#6F8FA2}
  .ng-edge{fill:none;stroke-linecap:round;transition:stroke-dashoffset 1.3s cubic-bezier(.3,.7,.3,1),opacity .6s ease}
  .ng-node{opacity:0;transition:opacity .5s ease}
  .ngraph.on .ng-node{opacity:1}
  .ng-pulse{transform-box:fill-box;transform-origin:center;animation:ng-pulse 3s ease-out infinite}
  @keyframes ng-pulse{0%{transform:scale(1);opacity:.75}70%,100%{transform:scale(2.9);opacity:0}}
  @media (prefers-reduced-motion:reduce){.ng-pulse{animation:none;opacity:0}}

  /* the citation graph carries labels, so it gets the wider half */
  .sh-net .sh-two{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr)}
  .ng-lab{font-family:var(--sans);font-size:13.5px;font-weight:600;fill:#A6C2D2}
  .ng-lab-you{fill:#EFAA36;font-weight:700}
  .ng-hd{font-family:var(--sans);font-size:11.5px;font-weight:800;letter-spacing:.14em;fill:#6F8FA2}
  .ng-rule{stroke:rgba(166,194,210,.18);stroke-width:1}
  .ng-tick{stroke:#32C2C4;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
  .ng-glow{filter:blur(6px);opacity:.5}
  @media (max-width:1000px){.sh-net .sh-two{grid-template-columns:1fr}}

  /* ---------- network: the diagram resolves as you scroll ---------- */
  .netscroll{position:relative;height:205vh;background:#02131F}
  .ns-stage{position:sticky;top:0;height:100vh;overflow:hidden}
  /* an <svg> is a replaced element: with top and bottom set but height:auto it
     sizes to the viewBox ratio and overflows, so the height is stated outright */
  #netGraph.ns-svg{
    position:absolute;top:60px;left:0;width:100%;height:calc(100% - 60px);
    display:block;overflow:visible;
    opacity:var(--ns-op,.38);filter:blur(var(--ns-blur,2.6px));
    transform:translateY(var(--ns-y,-4%)) scale(var(--ns-scale,1.18));transform-origin:50% 45%;
  }
  .ns-copy{position:absolute;left:0;right:0;z-index:2}
  .ns-hero{top:42%;transform:translateY(-50%);opacity:var(--ns-hero,1)}
  /* each sentence holds its own line; no max-width, so the breaks fall where the
     <br> puts them rather than wherever the measure happens to run out */
  .ns-hero h1{font-size:clamp(34px,4.6vw,62px);line-height:1.04;max-width:none;text-wrap:nowrap}
  .ns-hero h1 em{font-style:normal;color:var(--gold)}
  .ns-hero .subhero-sub{margin-inline:0;max-width:48ch}
  .ns-hero .subhero-cta{justify-content:flex-start}
  .ns-hero .strip{text-align:left}
  @media (max-width:760px){.ns-hero h1{text-wrap:balance;font-size:clamp(30px,7.4vw,44px)}}

  .ng-tier{opacity:0;transition:opacity .55s ease}
  .ns-stage.t1 .ng-t1,.ns-stage.t2 .ng-t2,.ns-stage.t3 .ng-t3{opacity:1}

  @media (max-width:1000px),(prefers-reduced-motion:reduce){
    .netscroll{height:auto}
    /* copy first, then the finished diagram; no sticky, no scroll driving */
    .ns-stage{position:static;height:auto;padding-block:64px 56px;display:flex;flex-direction:column;gap:34px}
    #netGraph.ns-svg{position:static;order:2;width:100%;height:auto;aspect-ratio:1200/690;opacity:1!important;filter:none!important;transform:none!important}
    .ns-copy{position:static;opacity:1!important}
    .ns-hero{order:1;transform:none}
    .ng-tier{opacity:1}
    /* the drawing shrinks with the viewport, so its type has to grow to compensate */
    .ng-lab{font-size:25px}
    .ng-hd{font-size:20px;letter-spacing:.1em}
    .ng-kick{font-size:22px}
    .ng-title{font-size:58px}
  }

  .ng-kick{font-family:var(--sans);font-size:15px;font-weight:800;letter-spacing:.2em;fill:var(--gold)}
  .ng-title{font-family:var(--cond);font-size:42px;font-weight:900;letter-spacing:.005em;fill:#fff}

  /* ---------- home page heading adjustments ---------- */
  /* these two heads sit directly above symmetrical blocks, so they centre over them */
  .stage-intro,.row-hd{text-align:center}
  .stage-intro h2,.row-hd h2{text-align:center;margin-inline:auto}
  .row-hd p{margin-inline:auto;text-align:center}

  /* both of these fit one line at this size; the 24ch cap was breaking them early */
  .fields h2,.proof-hd h2{max-width:none}

  /* ---------- customers strip on the home page ---------- */
  .cust-strip{position:relative;z-index:5;margin:92px auto 0;padding-bottom:40px;max-width:1100px;text-align:center}
  @media (max-width:760px){.cust-strip{margin-top:60px;padding-bottom:26px}}
  .cust-kick{color:var(--gold);display:block;margin-bottom:16px}
  .cust-row{
    display:grid;grid-template-columns:repeat(6,1fr);gap:1px;border-radius:14px;overflow:hidden;
    background:rgba(166,194,210,.16);border:1px solid rgba(166,194,210,.16);
  }
  .cust-row .lg{background:rgba(2,19,31,.72);padding:20px 14px}
  .cust-note{margin-top:12px;font-size:11.5px;color:#6F8FA2}
  @media (max-width:900px){.cust-row{grid-template-columns:repeat(3,1fr)}}

  /* these sit outside .ah-content, so like .peek they need lifting above the
     hero vignette (z-index 3) or the overlay paints straight over them */
  .ah-cta,.ah-assure,.cust-strip{position:relative;z-index:5}

  /* ---------- citation network refinements ---------- */
  /* six guardrails read as 3 x 2 rather than 4 + 2 orphans, on every page */
  .guards{grid-template-columns:repeat(3,1fr)}
  @media (max-width:980px){.guards{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:620px){.guards{grid-template-columns:1fr}}

  /* these headings hold one line; the 24ch cap was breaking them early */
  #net-brokered h2,#net-early h2{max-width:none}

  /* the closing thought centres, header included, but still does not wrap */
  #net-early{text-align:center}
  #net-early h2,#net-early .psec-sub,#net-early .bigline{margin-inline:auto;text-align:center}
  #net-early .bigline{max-width:none}

  /* products: the heading sits over a symmetrical card grid, so it centres and holds one line */
  #prod-detail h2{max-width:none;text-align:center;margin-inline:auto}

  /* the compliance headline holds one line */
  #hc-guardrails h2{max-width:none}

  /* the prompt batteries centre on the chat windows they sit above */
  #hc-battery,#he-battery{text-align:center}
  #hc-battery h2,#he-battery h2{max-width:none;text-align:center;margin-inline:auto}
  #hc-battery .psec-sub,#he-battery .psec-sub,#he-battery .psec-note{margin-inline:auto;text-align:center;max-width:none}
  #hc-battery .cwin,#he-battery .cwin{margin-inline:auto}
  #hc-battery .schips{justify-content:center}
  /* messages stay right and left inside the window, as a chat does */
  #hc-battery .cwin-hd,#hc-battery .cwin-body,
  #he-battery .cwin-hd,#he-battery .cwin-body{text-align:left}

  /* no paragraph should end on a single stranded word */
  .psec-sub,.subhero-sub,.cell-p,.moment-sub,.tg-sub,.ah-sub,.pillar-line,
  .field-body p,.scard p,.guard p,.nitem p,.step3 p,.acard p,.cta p{text-wrap:pretty}
  /* three sentences, stacked, escalating */
  .stack3{margin:34px auto 26px;text-align:center}
  .stack3 p{margin:0;font-family:var(--sans);font-size:clamp(16px,1.5vw,18.5px);
    line-height:1.5;color:var(--mist);text-wrap:nowrap}
  .stack3 p + p{margin-top:5px}
  .stack3 .s3-lede{font-weight:700;color:#fff}
  @media (max-width:820px){.stack3 p{text-wrap:pretty;white-space:normal}}
  /* founder portraits in the team hero: atmosphere, not a second roster.
     they overlap and dissolve into the navy so the cards below stay the reveal. */
  .sh-faces{gap:0;max-width:520px;width:100%;justify-self:end;
    -webkit-mask-image:radial-gradient(118% 104% at 50% 40%,#000 44%,rgba(0,0,0,.55) 74%,transparent 100%);
    mask-image:radial-gradient(118% 104% at 50% 40%,#000 44%,rgba(0,0,0,.55) 74%,transparent 100%);
  }
  .sh-face{border-color:rgba(166,194,210,.12);box-shadow:0 30px 70px -40px rgba(0,0,0,.95)}
  .sh-face img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
  .sh-face::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(to top,rgba(2,19,31,.66) 0%,rgba(2,19,31,.10) 52%,rgba(2,19,31,0) 80%);
  }
  .sh-face:nth-child(1){transform:translateY(30px) scale(.90);z-index:1}
  .sh-face:nth-child(2){transform:translateY(0) scale(1);z-index:3}
  .sh-face:nth-child(3){transform:translateY(-30px) scale(.90);z-index:2}
  .sh-face:nth-child(1),.sh-face:nth-child(3){opacity:.86}
  @media (max-width:1000px){
    .sh-faces{justify-self:start;max-width:420px}
    .sh-face:nth-child(1){transform:translateY(16px) scale(.92)}
    .sh-face:nth-child(3){transform:translateY(-16px) scale(.92)}
  }
  /* team hero: the map fills the hero, the copy sits in the Pacific */
  .sh-team .sh-two{grid-template-columns:1fr}
  .sh-team .sh-two-copy{max-width:560px;position:relative;z-index:2}
  .sh-team .subhero-in{padding-block:104px 96px}
  .sh-map{position:absolute;inset:0;margin:0;z-index:1;pointer-events:none}
  .sh-map svg{position:absolute;inset:0;width:100%;height:100%;display:block;
    -webkit-mask-image:linear-gradient(to right,transparent 2%,rgba(0,0,0,.22) 20%,#000 44%);
    mask-image:linear-gradient(to right,transparent 2%,rgba(0,0,0,.22) 20%,#000 44%);
  }
  .sh-land{fill:rgba(166,194,210,.05);stroke:rgba(166,194,210,.30);stroke-width:1;
    stroke-linejoin:round;vector-effect:non-scaling-stroke}
  .sh-pin text{font-family:var(--sans);font-size:2.9px;font-weight:800;letter-spacing:.14em;
    text-transform:uppercase;fill:#D6E6EF}
  .sh-pin line{stroke:rgba(239,170,54,.5);stroke-width:1;vector-effect:non-scaling-stroke}
  .sh-dot{fill:var(--gold)}
  .sh-halo{fill:none;stroke:rgba(239,170,54,.45);stroke-width:1.2;vector-effect:non-scaling-stroke}
  .sh-places{display:none}
  @media (max-width:1200px){
    /* the copy takes the width, so the map keeps its dots and gives up its labels */
    .sh-pin text,.sh-pin line{display:none}
    .sh-team .subhero-in{padding-block:84px 78px}
    .sh-team .sh-two-copy{max-width:none}
    .sh-map svg{
      -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.30) 0%,rgba(0,0,0,.42) 46%,#000 100%);
      mask-image:linear-gradient(to bottom,rgba(0,0,0,.30) 0%,rgba(0,0,0,.42) 46%,#000 100%);
    }
    .sh-places{display:block;margin:26px 0 0;font-family:var(--sans);font-size:11px;font-weight:800;
      letter-spacing:.17em;text-transform:uppercase;color:#D6E6EF}
    .sh-places span{color:var(--gold);margin:0 4px}
  }
  /* on a phone the map crops in tight and the pins land under the copy */
  @media (max-width:760px){.sh-pin{opacity:.5}}
  /* the supplied brand artwork, reversed for the dark surface */
  .brand-star{width:26px;height:auto;display:block}
  .brand-word{width:104px;height:auto;display:block;margin-top:1px}
  .brand{gap:8px}
  img.ah-star{width:74px;height:auto;display:block;margin:0 auto 26px;
    filter:drop-shadow(0 6px 18px rgba(0,0,0,.45))}
  .foot-lockup{width:132px;height:auto;display:block}
  .db-logo img{width:20px;height:auto;display:block}
  .db-logo .db-word{width:82px}
  @media (max-width:520px){.brand-word{width:88px}.brand-star{width:22px}}
  /* the process, on the home page, centred like its neighbours */
  #home-how{text-align:center}
  #home-how h2{max-width:none;text-align:center;margin-inline:auto}
  #home-how .step3{text-align:left}
  /* the before/after rows now live on the products page */
  #changes .row-hd{padding-block:12px 34px}
  #changes{padding-bottom:84px}
  @media (max-width:760px){#changes{padding-bottom:56px}}

  /* ---------- the five shifts, as one switch ---------- */
  .flipswitch{
    display:inline-flex;margin-top:26px;border:1px solid rgba(166,194,210,.34);border-radius:999px;
    padding:4px;background:rgba(2,24,39,.6);gap:4px;
  }
  .fs-btn{
    appearance:none;border:0;cursor:pointer;border-radius:999px;padding:10px 24px;background:transparent;
    font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
    color:var(--mist);transition:background .26s ease,color .26s ease;
  }
  .fs-btn:hover{color:#fff}
  .fs-btn.on{background:var(--gold);color:var(--navy)}
  .fs-btn:focus-visible{outline:2px solid var(--teal);outline-offset:3px}

  .flipgrid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
    margin:44px auto 0;max-width:1240px;perspective:1600px;
  }
  .flipcard{
    position:relative;transform-style:preserve-3d;
    transition:transform .64s cubic-bezier(.2,.72,.2,1);
  }
  .flipgrid.showafter .flipcard{transform:rotateY(180deg)}
  /* each card turns a beat after the one before it, so the row reads as a wave */
  .flipcard:nth-child(2){transition-delay:.05s}
  .flipcard:nth-child(3){transition-delay:.10s}
  .flipcard:nth-child(4){transition-delay:.15s}
  .flipcard:nth-child(5){transition-delay:.20s}
  .flipcard:nth-child(6){transition-delay:.25s}

  .flipface{
    position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
    border-radius:16px;padding:22px 24px 24px;display:flex;flex-direction:column;align-items:flex-start;
  }
  .ff-before{
    background:var(--dead);border:1px solid var(--dead-line);overflow:hidden;
  }
  .ff-before::after{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.42;border-radius:16px;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='150' height='150' filter='url(%23g)' opacity='.45'/%3E%3C/svg%3E");
  }
  .ff-after{
    transform:rotateY(180deg);
    background:var(--navy);border:1px solid rgba(239,170,54,.42);
  }
  /* label left, product mark hard right, both on the top line */
  .ff-top{
    position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;
    gap:14px;width:100%;min-height:30px;
  }
  .ff-before .lbl{color:var(--dead-ink-2)}
  .ff-after .lbl{color:var(--teal)}
  .ff-after .tag{margin:0;padding:6px 11px;font-size:9.5px;letter-spacing:.14em;white-space:nowrap}
  /* the heavy line sits at the foot of the card, and breaks evenly when it must break */
  .flipface h3{
    position:relative;z-index:2;margin:18px 0 0;margin-top:auto;
    font-family:var(--cond);font-weight:800;text-transform:none;letter-spacing:0;
    font-size:clamp(23px,2.05vw,31px);line-height:1.06;text-wrap:balance;
  }
  .ff-before h3{color:var(--dead-ink)}
  .ff-after h3{color:var(--white)}

  @media (max-width:1000px){.flipgrid{grid-template-columns:repeat(2,1fr)}}
  @media (max-width:620px){
    .flipgrid{grid-template-columns:1fr;gap:14px}
    .flipcard{transition-delay:0s !important}
  }
  @media (prefers-reduced-motion:reduce){
    .flipcard{transition:none}
  }
  /* leadership bios: a line on the card, the whole thing a click away */
  .lead-bio{margin:14px 0 0;font-size:14px;line-height:1.6;color:var(--mist)}
  .lead-more{
    appearance:none;background:none;border:0;padding:0;margin-top:14px;cursor:pointer;
    font-family:var(--sans);font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
    color:var(--gold);border-bottom:1px solid rgba(239,170,54,.45);transition:color .2s ease,border-color .2s ease;
  }
  .lead-more:hover{color:#fff;border-color:#fff}
  .lead-more:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
  .lead-full{margin-top:16px;border-top:1px solid rgba(166,194,210,.2);padding-top:14px}
  .lead-full p{margin:0 0 12px;font-size:13.5px;line-height:1.62;color:var(--mist);text-wrap:pretty}
  .lead-full p:last-child{margin-bottom:0}
  /* every card stands the same height when closed; only an opened one grows */
  .leads{align-items:start}
  .lead{display:flex;flex-direction:column}
  .lead-body{flex:1;display:flex;flex-direction:column;align-items:flex-start}
  .lead-more{margin-top:auto;padding-top:16px}
  /* the team page opens straight on the leadership, so it supplies its own top clearance */
  [data-page="team"] > .psec:first-of-type{padding-top:122px}
  @media (max-width:760px){[data-page="team"] > .psec:first-of-type{padding-top:96px}}
  /* ---------- mobile menu ---------- */
  .burger{
    display:none;appearance:none;background:none;border:0;cursor:pointer;margin-left:6px;
    width:44px;height:44px;padding:11px 10px;flex:none;      /* 44px tap target */
  }
  .burger span{display:block;height:2px;background:var(--mist);border-radius:2px;transition:background .2s ease}
  .burger span + span{margin-top:5px}
  .burger:hover span{background:#fff}
  .burger:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:8px}

  .msheet{position:fixed;inset:0;z-index:60}
  .msheet-scrim{position:absolute;inset:0;background:rgba(2,19,31,.72);backdrop-filter:blur(3px);
    opacity:0;transition:opacity .24s ease}
  .msheet-panel{
    position:absolute;top:0;right:0;bottom:0;width:min(86vw,360px);
    background:#041F33;border-left:1px solid rgba(166,194,210,.2);
    padding:calc(env(safe-area-inset-top,0px) + 16px) 22px calc(env(safe-area-inset-bottom,0px) + 24px);
    display:flex;flex-direction:column;overflow-y:auto;
    transform:translateX(100%);transition:transform .28s cubic-bezier(.2,.7,.2,1);
  }
  .msheet.on .msheet-scrim{opacity:1}
  .msheet.on .msheet-panel{transform:translateX(0)}
  .msheet-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .msheet-x{appearance:none;background:none;border:0;cursor:pointer;color:var(--mist);
    width:44px;height:44px;display:grid;place-items:center;margin-right:-10px}
  .msheet-x svg{width:20px;height:20px}
  .msheet-x:hover{color:#fff}
  .msheet-x:focus-visible,.msheet-links a:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:8px}
  .msheet-links{display:flex;flex-direction:column}
  .msheet-links a{
    display:block;padding:14px 0;text-decoration:none;color:#fff;
    font-family:var(--sans);font-size:17px;font-weight:600;letter-spacing:.01em;
    border-bottom:1px solid rgba(166,194,210,.14);
  }
  .msheet-links a.msub{padding-left:16px;font-size:15px;font-weight:500;color:var(--mist)}
  .msheet-links a.on{color:var(--gold)}
  .msheet-cta{margin-top:22px;width:100%}
  @media (prefers-reduced-motion:reduce){
    .msheet-panel,.msheet-scrim{transition:none}
  }
  @media (max-width:900px){
    .burger{display:block}
    .nav-in{gap:10px}
    .nav-cta{margin-left:auto;padding:11px 15px;font-size:11px}
  }
  @media (max-width:360px){.nav-cta{display:none}}
  /* footer links: real destinations, and thumb-sized on a phone */
  .foot-nav{display:flex;flex-wrap:wrap}
  .foot-nav a{display:inline-block}
  @media (max-width:900px){
    .foot{flex-direction:column;align-items:flex-start;gap:14px}
    .foot-nav{flex-direction:column;width:100%;margin:4px 0}
    .foot-nav a{
      display:flex;align-items:center;min-height:44px;margin-right:0;width:100%;
      border-bottom:1px solid rgba(166,194,210,.14);font-size:12px;
    }
    .foot-nav a:first-child{border-top:1px solid rgba(166,194,210,.14)}
  }
  /* on a phone every hero is one narrow column, so they all centre like the home page */
  @media (max-width:760px){
    .subhero-in,
    .subhero.sh-split .subhero-in{text-align:center}
    .subhero h1,
    .subhero.sh-split h1{margin-inline:auto;text-align:center}
    /* the 24ch cap is for the two-column hero; in one column it just starves the line */
    .subhero-sub,
    .subhero.sh-split .subhero-sub{margin-inline:auto;text-align:center;max-width:52ch}
    .subhero-cta,
    .subhero.sh-split .subhero-cta{justify-content:center}
    .subhero .strip,
    .subhero.sh-split .strip{text-align:center}
    .subhero .subhero-kick{display:block;text-align:center}
    /* the citation network hero is built differently but lands in the same column */
    .ns-hero{text-align:center}
    .ns-hero h1,.ns-hero .subhero-sub{margin-inline:auto;text-align:center}
    .ns-hero .subhero-cta{justify-content:center}
    .ns-hero .strip{text-align:center}
  }
  /* ---------- gated product panels ---------- */
  .db-main{position:relative}
  .db-main.gated > .db-view{filter:blur(9px) saturate(.84);pointer-events:none;user-select:none}
  .db-gate{position:absolute;inset:0;z-index:4;display:grid;place-items:center;padding:18px;
    background:rgba(236,241,244,.62)}
  /* [hidden] loses to the display:grid above, so the scrim stayed painted over
     the dashboard on every tab. Visibility and Pulse are not gated. */
  .db-gate[hidden]{display:none}
  .db-gate-in{width:100%;max-width:640px}
  .gate-card{background:#04253F;border:1px solid rgba(239,170,54,.38);border-radius:14px;
    padding:20px 22px;box-shadow:0 26px 60px -30px rgba(2,19,31,.8)}
  .gate-card .lbl{color:var(--gold)}
  .gate-card h4{margin:9px 0 0;font-family:var(--cond);font-size:26px;font-weight:800;color:#fff;line-height:1}
  .gate-card p{margin:9px 0 0;font-size:13.5px;line-height:1.6;color:var(--mist)}
  .gate-cta{margin-top:16px;appearance:none;cursor:pointer;border:2px solid var(--gold);background:var(--gold);
    color:var(--navy);font-family:var(--sans);font-size:11px;font-weight:800;letter-spacing:.14em;
    text-transform:uppercase;padding:11px 18px}
  .gate-cta:hover{background:transparent;color:var(--gold)}
  .gate-cta:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
  .gate-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .gate-two .gate-card{padding:18px 18px 20px}
  .gate-two h4{font-size:22px}
  .gate-two p{font-size:12.5px}
  .gate-get{margin-top:12px;padding-top:11px;border-top:1px solid rgba(166,194,210,.22);
    font-size:12px;line-height:1.5;color:#CFE2EC}
  .gate-get b{color:var(--teal);font-size:9.5px;font-weight:800;letter-spacing:.16em;
    text-transform:uppercase;display:block;margin-bottom:4px}
  @media (max-width:760px){
    .gate-two{grid-template-columns:1fr}
    .gate-two .gate-card:last-child{display:none}
    .db-gate{padding:12px}
    .gate-card h4{font-size:22px}
  }
  /* the gate takes the domain where the visitor already is */
  .gate-form{display:flex;gap:8px;margin-top:15px;flex-wrap:wrap}
  .gate-form label{position:absolute;left:-9999px}
  .gate-form input{
    flex:1 1 200px;min-width:0;appearance:none;border:2px solid rgba(166,194,210,.42);background:#02182A;
    color:#fff;font-family:var(--sans);font-size:14px;padding:11px 13px;border-radius:0;
  }
  .gate-form input::placeholder{color:#6F8FA2}
  .gate-form input:focus{outline:none;border-color:var(--teal)}
  .gate-form.miss input{border-color:#D0566F}
  .gate-form .gate-cta{margin-top:0;flex:0 0 auto}
  .gate-fine{margin-top:9px;font-size:9.5px;font-weight:800;letter-spacing:.16em;
    text-transform:uppercase;color:#7F9DB0}
  @media (max-width:620px){.gate-form input,.gate-form .gate-cta{flex:1 1 100%}}

  /* the team page opens on its first section, so its h1 wears the section style */
  #team-leadership h1{font-family:var(--cond);font-size:clamp(32px,4.6vw,62px);line-height:.94;
    color:#fff;max-width:none;margin:0;text-transform:none;letter-spacing:0}

  /* the three step headings are phrases; a 24ch cap broke them mid-phrase
     ("Be Found. Build / Trust.") with 700px of room going spare */
  #home-how h2,#hc-how h2,#he-how h2,#he-segments h2{max-width:none;text-wrap:balance}

  /* ---------- team: vision, purpose and where this came from ---------- */
  /* stacked, with the label in its own column, matching the origin section below */
  .vp{display:grid;gap:1px;background:rgba(166,194,210,.2);
    border:1px solid rgba(166,194,210,.2);border-radius:16px;overflow:hidden}
  .vp-item{background:rgba(4,37,63,.62);padding:26px 30px 28px;
    display:grid;grid-template-columns:minmax(0,140px) minmax(0,1fr);gap:28px;align-items:baseline}
  .vp-item .lbl{color:var(--gold)}
  /* sentences, not headlines: the condensed display face at weight 800 is
     unreadable past a few words, so these run in the body face */
  .vp-line{margin:0;font-family:var(--sans);font-weight:400;letter-spacing:0;
    font-size:clamp(16.5px,1.3vw,19px);line-height:1.62;color:#E8F0F5;text-wrap:pretty}
  @media (max-width:760px){
    .vp-item{grid-template-columns:1fr;gap:12px;padding:22px 22px 24px}
  }

  /* the origin runs as prose, so it keeps a reading measure rather than the full width */
  .origin{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:44px;align-items:start}
  .origin h2{max-width:none;margin:0}
  .origin-body p{margin:0 0 18px;font-size:16.5px;line-height:1.72;color:var(--mist);
    max-width:64ch;text-wrap:pretty}
  .origin-body p:last-child{margin-bottom:0}
  @media (max-width:900px){.origin{grid-template-columns:1fr;gap:22px}}

  /* footer: contact and social */
  .foot-contact{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
  .foot-contact a{
    display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:#7F9DB0;
    font-size:12.5px;font-weight:600;letter-spacing:.02em;text-transform:none;
  }
  .foot-contact a:hover{color:var(--gold)}
  .foot-social svg{width:16px;height:16px;fill:currentColor;flex:none}
  @media (max-width:900px){
    .foot-contact{flex-direction:column;align-items:flex-start;gap:0;width:100%;margin:4px 0}
    .foot-contact a{min-height:44px;width:100%;border-bottom:1px solid rgba(166,194,210,.14)}
    .foot-contact a:first-child{border-top:1px solid rgba(166,194,210,.14)}
  }

  /* this note sits alone under three full-width cards; a 66ch measure left it
     four lines deep with most of the row unused. 112ch sets it in two. */
  #he-segments .psec-note{max-width:112ch}
  @media (max-width:1000px){#he-segments .psec-note{max-width:none}}

  /* short one-sentence subheads under a wide heading: the shared 62ch measure
     broke each of these across two lines with half the row empty. They are
     well under the full width, so let them sit on one line. */
  #platform .suite-sub,
  #net-brokered .psec-sub,
  #net-rules .psec-sub{max-width:none}