/* Sicon, variant A: Swiss editorial. */
@font-face {
  font-family: "Inter Tight";
  src: url("/assets/fonts/InterTight-normal.woff2?v=83d548cd73") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --paper: #ffffff;
  --ink: #000000;
  --muted: #6b6b6b;
  --signal: #e4322b;
  --rule: currentColor;
  --gutter: 20px;
  --font: "Inter Tight", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --fs-small: 14px;
  --fs-body: 16px;
  --fs-big: clamp(26px, 3.3vw, 54px);
  --fs-big-s: clamp(21px, 2.1vw, 32px);
  --fs-mega: clamp(44px, 7.2vw, 124px);
  --fs-hero: clamp(54px, 10.4vw, 184px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  font: 400 var(--fs-body)/1.42 var(--font);
  letter-spacing: -0.006em;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "ss01", "cv11";
}
body.t-signal { --paper: var(--signal); --muted: #3d0c09; }
body.t-ink { --paper: #000000; --ink: #ffffff; --muted: #a3a3a3; }
body.t-ink .mark { --mark-cut: #000; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, ul, ol, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
h1, h2, h3 { font-weight: inherit; font-size: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
::selection { background: var(--ink); color: var(--paper); }

.wrap { padding-inline: var(--gutter); }
.label { font-size: var(--fs-body); padding-bottom: 8px; border-bottom: 1px solid var(--rule); }
.muted { color: var(--muted); }
.big { font-size: var(--fs-big); line-height: 1.07; letter-spacing: -0.028em; font-weight: 350; max-width: 26em; }
.big-s, .big-s p { font-size: var(--fs-big-s); line-height: 1.16; letter-spacing: -0.018em; font-weight: 350; }
.big a, .big-s a, .prose a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.12em; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bw { filter: grayscale(1) contrast(1.08); }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: var(--paper); padding: 8px 12px; z-index: 30; }
.skip:focus { left: 8px; }

/* ---------- header */
.hd {
  position: sticky; top: 0; z-index: 20;
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter);
  align-items: start; padding: 14px var(--gutter);
  background: var(--paper);
}
.hd-brand { grid-column: 1 / 4; display: inline-flex; align-items: center; gap: 8px; font-size: 18px; letter-spacing: -0.02em; }
.mark { width: 22px; height: 22px; fill: currentColor; flex: none; }
.hd-line { grid-column: 4 / 7; font-size: var(--fs-small); line-height: 1.3; color: var(--muted); }
.hd-nav { grid-column: 7 / 11; }
.hd-nav a, .ft-nav a { transition: opacity .2s; }
.hd-nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 0.2em; }
.hd-cta { grid-column: 11 / 13; justify-self: end; }
.hd-nav a:hover, .hd-cta:hover, .ft a:hover { opacity: .55; }
.hd-menu { display: none; background: none; border: 0; padding: 0 0 0 12px; min-width: 44px; min-height: 44px; margin: -12px 0; cursor: pointer; justify-self: end; text-align: right; }
.menu {
  position: fixed; inset: 52px 0 0; z-index: 19; background: var(--paper);
  padding: 24px var(--gutter); display: flex; flex-direction: column; justify-content: space-between;
  overflow-y: auto; overscroll-behavior: contain;
}
.menu[hidden] { display: none; }
.menu nav { display: flex; flex-direction: column; }
.menu nav a { font-size: 44px; line-height: 1.08; letter-spacing: -0.03em; font-weight: 300; border-bottom: 1px solid; padding: 6px 0; }

/* ---------- opening block used by inner pages */
.intro {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter);
  padding-top: 10vh; padding-bottom: 8vh;
}
.intro-label { grid-column: 1 / 7; font-size: var(--fs-body); }
.intro-label sup { font-size: 10px; margin-left: 3px; }
.intro-text { grid-column: 7 / 11; max-width: 30em; }

/* ---------- home hero */
.hero {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter);
  padding-top: 6vh; padding-bottom: 7vh;
}
.hero-title {
  grid-column: 1 / -1;
  font-size: var(--fs-hero); line-height: 0.9; letter-spacing: -0.052em; font-weight: 300;
  margin-left: -0.05em;
}
.hero-title span { display: block; }
.hero-title span:nth-child(2) { padding-left: 16.66%; }
.hero-title span:nth-child(3) { padding-left: 50%; }
.hero-side { grid-column: 1 / 5; margin-top: 4vh; max-width: 26em; }

.scan {
  grid-column: 1 / -1; margin-top: 4vh;
  display: grid; grid-template-columns: 1fr auto auto; column-gap: 32px; row-gap: 12px; align-items: center;
}
.scan-box { grid-column: 1 / -1; grid-row: 1; width: 100%; aspect-ratio: 21 / 8; background: #000; position: relative; }
.scan-top { grid-column: 1; grid-row: 2; }
.scan-right { grid-column: 2; grid-row: 2; display: flex; align-items: center; gap: 8px; }
.dot { width: 9px; height: 9px; border-radius: 50%; background: var(--signal); flex: none; }
.scan-link { grid-column: 3; grid-row: 2; display: flex; justify-content: space-between; gap: 40px; border-top: 1px solid; padding-top: 6px; min-width: 220px; }

/* ---------- mega rows */
.rows { position: relative; padding-bottom: 7vh; }
.rows-list li { border-bottom: 1px solid var(--rule); }
.rows-list a {
  display: block; text-align: center;
  font-size: var(--fs-mega); line-height: 1.12; letter-spacing: -0.035em; font-weight: 300;
  padding: 0.02em 0 0.04em; transition: opacity .25s;
}
.rows-list:hover a { opacity: .3; }
.rows-list:hover a:hover, .rows-list a:focus-visible { opacity: 1; }
.peek {
  position: fixed; left: 0; top: 0; width: 300px; height: 200px; object-fit: cover;
  pointer-events: none; z-index: 5; opacity: 0; transition: opacity .2s, transform .28s cubic-bezier(.2,.8,.2,1);
  filter: grayscale(1) contrast(1.08);
}
.peek.on { opacity: 1; }

/* ---------- statement */
.statement { padding-bottom: 8vh; }
.statement > .big { max-width: none; text-indent: 16.66%; }
.statement-grid {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); margin-top: 4vh;
}
.statement-fig { grid-column: 3 / 7; }
.statement-fig img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.statement-fig figcaption { margin-top: 8px; padding-left: 20%; }
.statement-side { grid-column: 7 / 11; }
.statement-side > p { max-width: 26em; margin-bottom: 28px; }
.linkrows { max-width: 340px; }
.linkrows li { border-top: 1px solid; }
.linkrows a { display: flex; justify-content: space-between; padding: 8px 0 20px; }

/* ---------- steps (a real sequence) */
.steps { padding-bottom: 8vh; }
.steps-list { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: var(--gutter); margin-top: 20px; }
.steps-list li { display: grid; grid-template-rows: auto auto 1fr; }
.step-n { font-size: var(--fs-mega); line-height: 1; letter-spacing: -0.04em; font-weight: 300; }
.steps-list h3 { font-size: var(--fs-big-s); letter-spacing: -0.018em; margin: 10px 0 8px; }
.steps-list p { max-width: 24em; color: var(--muted); }

/* ---------- extras / briefings */
.extras { padding-bottom: 8vh; }
.extras-head {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: var(--fs-mega); line-height: 1; letter-spacing: -0.035em; font-weight: 300;
  padding-bottom: 14px; border-bottom: 1px solid;
}
.extras-group { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); border-bottom: 1px solid; }
.extras-group h3 { grid-column: 1 / 7; padding: 8px 0; }
.extras-list { grid-column: 7 / 13; }
.extras-list > li, .extras-list > details { border-top: 1px solid; }
.extras-list > :first-child { border-top: 0; }
.extras-list a { display: block; padding: 8px 0; }
.extras-list a:hover { opacity: .55; }
.eng li { display: flex; justify-content: space-between; padding: 8px 0; }
details summary { list-style: none; cursor: pointer; padding: 8px 28px 8px 0; position: relative; }
details summary::-webkit-details-marker { display: none; }
details summary::after { content: "+"; position: absolute; right: 0; top: 7px; }
details[open] summary::after { content: "–"; }
details p { padding: 0 0 14px; max-width: 34em; color: var(--muted); }

/* ---------- tables (services, industries, insights) */
.table { position: relative; padding-bottom: 7vh; }
.table-list { border-top: 1px solid; }
.table-list li { border-bottom: 1px solid; }
.table-list a, .table-list li:not(:has(a)) {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding: 10px 0;
}
.table-list.plain li { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding: 10px 0; }
.t-name { grid-column: 1 / 7; font-size: var(--fs-big-s); line-height: 1.12; letter-spacing: -0.018em; }
.t-pillar { grid-column: 7 / 9; color: var(--muted); padding-top: 4px; }
.t-sum { grid-column: 9 / 13; padding-top: 4px; }
.table-list.plain .t-sum { grid-column: 7 / 12; }
.table-list:hover a { opacity: .3; }
.table-list:hover a:hover, .table-list a:focus-visible { opacity: 1; }
.table-list a { transition: opacity .25s; }
.table .label { margin-bottom: 0; border-bottom: 0; }

.pillars {
  display: grid; grid-template-columns: repeat(3, 1fr); column-gap: var(--gutter); padding-bottom: 7vh;
}
.pillars div { border-top: 1px solid; padding-top: 10px; }
.pillars h3 { font-size: var(--fs-big-s); letter-spacing: -0.018em; margin-bottom: 10px; }
.pillars p { max-width: 24em; color: var(--muted); }

/* ---------- service page */
.svc-head {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter);
  padding-top: 8vh; padding-bottom: 4vh;
}
.crumb { grid-column: 1 / -1; margin-bottom: 3vh; color: var(--muted); }
.crumb a { color: var(--ink); }
.svc-title {
  grid-column: 1 / 11;
  font-size: var(--fs-mega); line-height: 0.98; letter-spacing: -0.04em; font-weight: 300;
}
.svc-sum { grid-column: 7 / 11; margin-top: 3vh; font-size: var(--fs-big-s); line-height: 1.16; letter-spacing: -0.018em; }
.svc-fig img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; }
.svc-body {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter);
  padding-top: 7vh; padding-bottom: 7vh;
}
.svc-intro { grid-column: 1 / 8; }
.svc-intro p + p { margin-top: 0.8em; }
.svc-signs { grid-column: 9 / 13; }
.svc-signs li { border-bottom: 1px solid; padding: 8px 0 12px; }

.deliv { padding-bottom: 7vh; }
.deliv-list { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: var(--gutter); }
.deliv-list li { border-bottom: 1px solid; padding: 12px 0 28px; }
.deliv-list h3 { font-size: var(--fs-big-s); letter-spacing: -0.018em; line-height: 1.12; margin-bottom: 8px; }
.deliv-list p { max-width: 26em; color: var(--muted); }

.outcome { padding-bottom: 8vh; }
.outcome .label { margin-bottom: 20px; }

.cta { padding-top: 4vh; padding-bottom: 9vh; }
.cta .big { max-width: 18em; }
.cta-link {
  display: inline-flex; gap: 60px; margin-top: 28px; padding-top: 8px; border-top: 1px solid; min-width: 280px;
  justify-content: space-between;
}
.cta-link:hover { opacity: .55; }

/* ---------- about (signal page) */
.about-lead { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding-bottom: 7vh; }
.about-place { grid-column: 7 / 13; font-size: var(--fs-big); letter-spacing: -0.028em; font-weight: 350; margin-bottom: 3vh; }
.about-lead .big { grid-column: 1 / -1; max-width: none; text-indent: 16.66%; }
.about-fig { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding-bottom: 8vh; }
.about-fig img { grid-column: 4 / 8; aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.about-fig figcaption { grid-column: 8 / 11; align-self: end; max-width: 22em; }

/* ---------- articles */
.post-head { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding-top: 8vh; padding-bottom: 4vh; }
.post-title { grid-column: 1 / 11; font-size: var(--fs-mega); line-height: 0.98; letter-spacing: -0.04em; font-weight: 300; }
.post-dek { grid-column: 7 / 11; margin-top: 3vh; font-size: var(--fs-big-s); line-height: 1.16; letter-spacing: -0.018em; }
.post-meta { grid-column: 7 / 11; margin-top: 16px; color: var(--muted); }
.prose { max-width: calc(640px + 2 * var(--gutter)); margin-inline: auto; padding-top: 6vh; padding-bottom: 8vh; font-size: 18px; line-height: 1.55; }
.prose p, .prose ul { margin-bottom: 1.1em; }
.prose h2 { font-size: var(--fs-big-s); letter-spacing: -0.018em; line-height: 1.15; margin: 1.8em 0 0.6em; }
.prose ul { list-style: none; }
.prose li { border-top: 1px solid; padding: 10px 0; }
.prose li:last-child { border-bottom: 1px solid; }

/* ---------- plan builder (ink page) */
.plan { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding-bottom: 6vh; }
.plan > * { grid-column: 1 / -1; }
.q { border: 0; margin: 0 0 5vh; padding: 0; min-width: 0; }
.q legend {
  font-size: var(--fs-big); line-height: 1.07; letter-spacing: -0.028em; font-weight: 350;
  padding: 0 0 14px; width: 100%; border-bottom: 1px solid;
}
.q-n { display: inline-block; min-width: 1.2em; color: var(--muted); }
.q-hint { color: var(--muted); margin-top: 10px; }
.opts { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: var(--gutter); margin-top: 6px; }
.opts.row { grid-template-columns: repeat(5, auto); justify-content: start; column-gap: 12px; row-gap: 12px; margin-top: 18px; }
.opt { position: relative; cursor: pointer; }
.opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.opts:not(.row) .opt span {
  display: flex; gap: 14px; align-items: baseline; padding: 12px 0; border-bottom: 1px solid #333;
  font-size: var(--fs-big-s); line-height: 1.16; letter-spacing: -0.018em;
}
.opts:not(.row) .opt span::before {
  content: ""; width: 14px; height: 14px; border: 1px solid currentColor; flex: none; transform: translateY(1px);
}
.opts:not(.row) .opt input:checked + span::before { background: var(--signal); border-color: var(--signal); }
.opts.row .opt span { display: inline-block; border: 1px solid; border-radius: 999px; padding: 10px 18px; }
.opt input:checked + span { color: var(--paper); background: var(--ink); }
.opts:not(.row) .opt input:checked + span { color: var(--ink); background: none; }
.opt input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 3px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field > span { color: var(--muted); }
.field input, .field select, .field textarea {
  background: transparent; border: 0; border-bottom: 1px solid; border-radius: 0; padding: 10px 0;
  font-size: var(--fs-big-s); letter-spacing: -0.018em; color: var(--ink); width: 100%;
}
.field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 14px) 55%, calc(100% - 8px) 55%; background-size: 6px 6px; background-repeat: no-repeat; max-width: 560px; margin-top: 18px; }
.field select option { color: #000; }
.fields { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: var(--gutter); row-gap: 28px; margin-top: 24px; }
.fields .wide { grid-column: 1 / -1; }
.hp { position: absolute; left: -9999px; }
.submit { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.submit button {
  background: var(--ink); color: var(--paper); border: 0; border-radius: 999px; cursor: pointer;
  font-size: var(--fs-big-s); letter-spacing: -0.018em; padding: 16px 34px;
}
.submit button:hover { background: var(--signal); color: #000; }
.submit button[disabled] { opacity: .5; cursor: progress; }
.status { max-width: 40em; }
.status a { text-decoration: underline; }

.plan-out { margin: 0 0 5vh; border: 1px solid; padding: 28px; }
.po-empty { color: var(--muted); font-size: var(--fs-big-s); letter-spacing: -0.018em; }
.po-title { font-size: var(--fs-big); letter-spacing: -0.028em; line-height: 1.05; font-weight: 350; margin-bottom: 10px; }
.po-note { color: var(--muted); max-width: 40em; margin-bottom: 18px; }
.po-phases { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--gutter); counter-reset: ph; }
.po-phase { border-top: 1px solid; padding-top: 10px; counter-increment: ph; }
.po-phase h3 { color: var(--muted); margin-bottom: 8px; }
.po-phase h3::before { content: counter(ph) ". "; }
.po-item { margin-bottom: 12px; }
.po-item a, .po-item strong { font-size: 19px; letter-spacing: -0.012em; font-weight: 450; display: block; }
.po-item a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
.po-item p { color: var(--muted); font-size: var(--fs-small); margin-top: 2px; }

.contact-direct { padding-bottom: 8vh; }
.contact-direct .label { margin-bottom: 20px; }

.nf { padding-top: 11vh; padding-bottom: 11vh; display: grid; gap: 3vh; }
.nf .big-s { max-width: 30em; }

/* ---------- footer */
.ft { padding: 6vh var(--gutter) 18px; border-top: 1px solid; margin-inline: var(--gutter); padding-inline: 0; }
.ft-cols { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding-bottom: 5vh; }
.ft-id { grid-column: 1 / 7; }
.ft-brand { display: inline-flex; align-items: center; gap: 8px; font-size: 18px; letter-spacing: -0.02em; margin-bottom: 14px; }
.ft-id p { color: var(--muted); line-height: 1.5; }
.ft-id p a { color: var(--ink); }
.ft-svc { grid-column: 7 / 13; }
.ft-svc ul { columns: 2; column-gap: var(--gutter); }
.ft-svc li { break-inside: avoid; padding: 2px 0; }
.ft-legal { display: flex; gap: 24px; align-items: baseline; font-size: var(--fs-small); color: var(--muted); }
.ft-legal small { font-size: inherit; margin-right: auto; }

/* ---------- small screens */
@media (max-width: 900px) {
  :root { --gutter: 16px; }
  .hd { grid-template-columns: 1fr auto; padding-block: 14px; }
  .hd-brand { grid-column: 1; }
  .hd-line, .hd-nav, .hd-cta { display: none; }
  .hd-menu { display: block; grid-column: 2; }
  .intro, .hero, .svc-head, .svc-body, .post-head, .statement-grid, .about-lead, .about-fig,
  .extras-group, .ft-top, .ft-cols, .plan { grid-template-columns: 1fr; }
  .intro > *, .hero > *, .svc-head > *, .svc-body > *, .post-head > *, .statement-grid > *,
  .about-lead > *, .about-fig > *, .extras-group > *, .ft-top > *, .ft-cols > * { grid-column: 1 / -1 !important; }
  .intro { padding-top: 7vh; padding-bottom: 5vh; row-gap: 20px; }
  .hero-title span:nth-child(n) { padding-left: 0; }
  .hero-title { font-size: clamp(40px, 12.5vw, 96px); }
  .scan { grid-template-columns: 1fr; row-gap: 8px; margin-top: 3vh; }
  .scan > * { grid-column: 1 !important; grid-row: auto !important; }
  .scan-box { aspect-ratio: 4 / 5; }
  .rows-list a { font-size: clamp(34px, 11vw, 64px); }
  .statement > .big, .about-lead .big { text-indent: 0; }
  .statement-side { margin-top: 28px; }
  .steps-list, .deliv-list, .pillars { grid-template-columns: 1fr; row-gap: 28px; }
  .extras-head { font-size: clamp(40px, 12vw, 72px); }
  .extras-group h3 { padding-bottom: 0; color: var(--muted); }
  .table-list a, .table-list.plain li, .table-list li:not(:has(a)) { grid-template-columns: 1fr; row-gap: 6px; }
  .t-name, .t-pillar, .t-sum, .table-list.plain .t-sum { grid-column: 1 !important; padding-top: 0; }
  .svc-sum, .post-dek { margin-top: 20px; }
  .svc-fig img { aspect-ratio: 4 / 3; }
  .svc-signs { margin-top: 40px; }
  .about-fig figcaption { margin-top: 10px; }
  .opts { grid-template-columns: 1fr; }
  .opts.row { grid-template-columns: repeat(2, auto); }
  .fields { grid-template-columns: 1fr; }
  .plan-out { padding: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ---------- threat animations (shared/threats.js draws into .threat) */
.threat { position: relative; background: #000; }
.threat canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.tfig {
  display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter);
  padding-bottom: 7vh;
}
.tfig-box { grid-column: 1 / 9; aspect-ratio: 3 / 2; }
.tfig-cap {
  grid-column: 9 / 13; align-self: end; display: flex; align-items: center; gap: 8px;
  border-top: 1px solid; padding-top: 6px;
}
.prose .pfig { margin: 2.2em 0 2.4em; }
.pfig-box { aspect-ratio: 3 / 2; }
.pfig figcaption { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: var(--fs-body); }
@media (max-width: 900px) {
  .tfig { grid-template-columns: 1fr; row-gap: 10px; padding-bottom: 5vh; }
  .tfig-box, .tfig-cap { grid-column: 1; }
}

/* Long-exposure art set: keep the colour, let the light breathe. */
.art-lx .bw, .art-lx .peek { filter: none; }
@media (prefers-reduced-motion: no-preference) {
  .art-lx .svc-fig img, .art-lx .statement-fig img, .art-lx .about-fig img { animation: lx-drift 26s ease-in-out infinite alternate; }
}
.art-lx .svc-fig, .art-lx .statement-fig, .art-lx .about-fig { overflow: hidden; }
@keyframes lx-drift { from { transform: scale(1) translateX(0); } to { transform: scale(1.07) translateX(-1.5%); } }

/* Hardware teaser band */
.hwt { background: #000; color: #fff; margin-bottom: 8vh; }
.hwt-inner { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); align-items: center; padding: 7vh var(--gutter); }
.hwt-img { grid-column: 1 / 8; }
.hwt-img img { width: 100%; }
.hwt-text { grid-column: 8 / 12; }
.hwt-kicker { color: #cdb27c; margin-bottom: 14px; }
.hwt-text h2 { font-size: var(--fs-big); line-height: 1.02; letter-spacing: -0.03em; font-weight: 300; margin-bottom: 18px; }
.hwt-text p { color: #b5b5b5; max-width: 28em; }
.hwt-cta { display: inline-flex; margin-top: 26px; padding-top: 8px; border-top: 1px solid; min-width: 260px; }
.hwt-inner:hover .hwt-cta { color: #cdb27c; }
@media (max-width: 900px) { .hwt-inner { grid-template-columns: 1fr; } .hwt-img, .hwt-text { grid-column: 1; } .hwt-text { margin-top: 24px; } }

/* Threat animations playing over their long-exposure image */
.threat-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(0.48) saturate(1.05); }
.svc-live { width: 100%; aspect-ratio: 16 / 9; }
.svc-fig.live figcaption { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
@media (max-width: 900px) { .svc-live { aspect-ratio: 4 / 5; } }

/* Hover preview: a live animation box instead of a still */
.peek-live { width: 360px; height: 240px; background: #000; filter: none; }
.peek-live .threat { position: absolute; inset: 0; opacity: 0; transition: opacity .15s; }
.peek-live .threat.on { opacity: 1; }
.threat { cursor: crosshair; }

/* Hardware cards strip */
.hwstrip { background: #050506; padding: 7vh var(--gutter) 6vh; }
.hwnote { color: #6f7077; font-size: 12px; margin-top: 18px; max-width: 70em; }

/* Signs list flip colour (shared/flap.css) */
.svc-signs { --flap-hot: #e4322b; --flap-split: rgba(0, 0, 0, .13); --flap-weight: 450; }

/* Services page: radar band under the intro */
.svc-radar { padding-bottom: 7vh; margin-top: -4vh; }
.svc-radar .scan { margin-top: 0; }
@media (max-width: 900px) { .svc-radar { margin-top: 0; } }
.statement-side { grid-column: 7 / 12; }

/* Home: the radar window opens to full bleed as you scroll, and the line resolves into focus */
.grow-pin { position: relative; height: calc(280vh - var(--hd-h, 52px)); }
.grow-stick { position: sticky; top: var(--hd-h, 52px); height: calc(100vh - var(--hd-h, 52px)); overflow: hidden; }
.grow-frame { position: absolute; inset: 0; clip-path: inset(2vh 30% 40vh 30%); will-change: clip-path; background: #000; }
.grow-frame .grow-live { position: absolute; inset: 0; width: 100%; height: 100%; }
.grow-words {
  position: absolute; left: 0; right: 0; top: auto; bottom: 56px; transform: none; transform-origin: 50% 100%; z-index: 2; pointer-events: none;
  text-align: center; color: #fff; font-size: calc(var(--fs-mega) * 0.5); line-height: 0.95; letter-spacing: -0.03em; font-weight: 300;
  padding-inline: var(--gutter);
}

.grow-cap { position: absolute; left: var(--gutter); bottom: 22px; margin: 0; display: flex; align-items: center; gap: 8px; color: #fff; z-index: 2; opacity: 0; transition: opacity .4s; }
.grow-cap.on { opacity: 1; }
@media (max-width: 900px) {
  /* phones get the same opener: a portrait window that opens to fill the screen */
  .grow-pin { height: calc(230vh - var(--hd-h, 52px)); }
  .grow-stick { height: calc(100vh - var(--hd-h, 52px)); height: calc(100svh - var(--hd-h, 52px)); }
  .grow-frame { clip-path: inset(12px 14% 38% 14%); }
  .grow-words { bottom: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .grow-pin { height: calc(100vh - var(--hd-h, 52px)); }
  .grow-frame { clip-path: none; }
  .grow-words span { opacity: 1; }
  .grow-cap { opacity: 1; }
}

/* ---------- engagement steps: scroll-linked signal (shared/steps.js + steps.css) */
.engseq { --eng-accent-rgb: 228, 50, 43; --eng-line-rgb: 0, 0, 0; --eng-line-a: .22; --eng-ink-c: var(--ink); --eng-muted-c: #cdcdcd; --eng-paper: var(--paper); --eng-mark-top: 28px; }
.t-signal .engseq { --eng-accent-rgb: 0, 0, 0; --eng-line-a: .35; --eng-muted-c: rgba(0, 0, 0, .3); }
.eng-top { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; border-bottom: 1px solid var(--rule); padding-bottom: 8px; }
.eng-top .label { border-bottom: 0; padding-bottom: 0; }
.eng-count { color: var(--muted); font-size: var(--fs-small); }
.engseq .steps-list li { grid-template-rows: auto auto auto 1fr; }
.engseq .eng-mark { margin: 16px 0 2px; }
.eng-pinned.steps { padding-bottom: 0; }
@media (max-width: 900px) { .eng-flow .steps-list { row-gap: 34px; } .eng-flow .eng-mark { margin: 0; } }

@media (max-width: 900px) {
  .ft-cols { grid-template-columns: 1fr; row-gap: 24px; }
  .ft-id, .ft-svc { grid-column: 1; }
  .ft-legal { flex-wrap: wrap; gap: 14px; }
}
/* Headline letters light up as the radar sweep crosses them */
.grow-words .w { display: inline-block; opacity: 0; will-change: opacity, transform, filter; }
.grow-words .ch { display: inline-block; color: rgba(255,255,255,.78); }
.grow-words .ch.on { color: rgb(255,255,255); text-shadow: 0 0 calc(18px * var(--lit, 0)) rgba(255,255,255, calc(.9 * var(--lit, 0))); transform: translateY(calc(-2px * var(--lit, 0))); }
@media (prefers-reduced-motion: reduce) { .grow-words .w { opacity: 1; } .grow-words .ch { color: #fff; } }

/* "See the bigger picture": space-age face, letters filled with a drifting white galaxy */
@font-face { font-family: "Michroma"; src: url("/assets/fonts/Michroma.woff2?v=b12098180d") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
.grow-words { font-family: "Michroma", var(--font); font-weight: 400; letter-spacing: 0.02em; text-transform: none; filter: drop-shadow(0 0 14px rgba(200, 212, 255, .28)); }
.grow-words .ch {
  color: transparent;
  background-image: url("/assets/img/galaxy-text.webp?v=34574ee4a3");
  background-size: var(--gw, 1400px) auto;
  background-position: var(--bx, 0px) 40%;
  -webkit-background-clip: text; background-clip: text;
  animation: galaxy-drift 40s linear infinite;
}
.grow-words .ch.on { color: transparent; text-shadow: none; filter: drop-shadow(0 0 calc(10px * var(--lit, 0)) rgba(255, 255, 255, calc(.95 * var(--lit, 0)))) brightness(calc(1 + .35 * var(--lit, 0))); transform: translateY(calc(-2px * var(--lit, 0))); }
.grow-pin.off .grow-words .ch { animation-play-state: paused; }
@keyframes galaxy-drift { from { background-position: var(--bx, 0px) 40%; } to { background-position: calc(var(--bx, 0px) - 600px) 40%; } }
@media (prefers-reduced-motion: reduce) { .grow-words .ch { animation: none; color: transparent; } }
.grow-words .ch { padding: 0.12em 0 0.24em; margin: -0.12em 0 -0.24em; }

/* Letters fade with --base as you scroll on; a sweep brings each back for a moment (--lit) */
.grow-words .ch { opacity: max(var(--base, 1), var(--lit, 0)); transition: opacity .12s linear; }

/* Industries: rows open to a real incident */
.inc-list { --inc-accent-rgb: 228, 50, 43; }
.table-list.plain.inc-list li.inc { display: block; padding: 0; }
.inc-list .inc-btn { grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding: 10px 0; transition: opacity .25s; }
.inc-list .inc-btn .t-name { grid-column: 1 / 7; }
.inc-list .inc-btn .t-sum { grid-column: 7 / 12; }
.inc-list .inc-inner { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); }
.inc-list .inc-inner > * { grid-column: 7 / 12; }
.inc-list .inc-title { font-size: var(--fs-big-s); line-height: 1.12; letter-spacing: -0.018em; font-weight: 400; }
.inc-list .inc-text { color: var(--muted); }
.inc-list .inc-tag { display: none; }
@media (max-width: 900px) {
  .inc-list .inc-btn { grid-template-columns: 1fr; row-gap: 6px; padding-right: 34px; }
  .inc-list .inc-btn .t-name, .inc-list .inc-btn .t-sum { grid-column: 1; }
  .inc-list .inc-inner { grid-template-columns: 1fr; }
  .inc-list .inc-inner > * { grid-column: 1; }
}
.table-list .inc-list-src, .table-list a.inc-src { display: inline-flex; grid-template-columns: none; padding: 0; justify-self: start; }
.table-list:hover a.inc-src { opacity: .7; }
.table-list:hover a.inc-src:hover { opacity: 1; }

/* Briefings: every row (insight links, questions, engagements) reacts the same way */
.extras .xrow {
  position: relative; display: flex; align-items: baseline; gap: 16px; padding: 9px 28px 9px 0;
  cursor: pointer; list-style: none; transition: padding-left .35s cubic-bezier(.2,.8,.2,1), color .25s;
}
.extras .xrow::-webkit-details-marker { display: none; }
.extras details.xrow-d summary::after { content: none; }
.extras .xrow::before {
  content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%;
  background: var(--signal); transform: scale(0); transition: transform .3s cubic-bezier(.2,.8,.2,1);
}
.extras .xrow::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, rgba(228,50,43,.15), var(--signal)); transform: scaleX(0); transform-origin: left;
  transition: transform .45s cubic-bezier(.2,.8,.2,1);
}
.extras .xrow:hover, .extras .xrow:focus-visible, .extras details[open] > .xrow { padding-left: 16px; }
.extras .xrow:hover::before, .extras .xrow:focus-visible::before, .extras details[open] > .xrow::before { transform: scale(1); }
.extras .xrow:hover::after, .extras .xrow:focus-visible::after, .extras details[open] > .xrow::after { transform: scaleX(1); }
.extras .xrow:focus-visible { outline: none; }
.extras .xrow-t { flex: 1; }
.extras .xrow-m { color: var(--muted); white-space: nowrap; }
.extras .xrow-i { position: absolute; right: 0; top: 50%; width: 11px; height: 11px; margin-top: -5.5px; transition: transform .35s cubic-bezier(.2,.8,.2,1), color .25s; }
.extras .xrow-plus::before, .extras .xrow-plus::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1.4px solid currentColor; }
.extras .xrow-plus::after { transform: rotate(90deg); }
.extras .xrow-go::before { content: ""; position: absolute; inset: 1px; border-top: 1.4px solid currentColor; border-right: 1.4px solid currentColor; transform: rotate(45deg) translate(-2px, 2px); }
.extras .xrow:hover .xrow-i, .extras details[open] > .xrow .xrow-i { color: var(--signal); }
.extras .xrow:hover .xrow-go { transform: translateX(4px); }
.extras details[open] > .xrow .xrow-plus { transform: rotate(45deg); }
.extras .extras-list a.xrow:hover { opacity: 1; }
.extras details.xrow-d > p { padding: 0 28px 14px 16px; max-width: 40em; color: var(--muted); }
.extras details.xrow-d[open] > p { animation: xrow-rise .45s cubic-bezier(.2,.8,.2,1) both; }
@keyframes xrow-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .extras .xrow, .extras .xrow::before, .extras .xrow::after, .extras .xrow-i { transition: none; } .extras details.xrow-d[open] > p { animation: none; } }

/* Services page: one list grouped by the three jobs */
.svc-groups .svc-group + .svc-group { margin-top: 6vh; }
.svc-group-h { font-size: var(--fs-body); color: var(--muted); padding-bottom: 10px; }
.svc-list .t-name { grid-column: 1 / 7; }
.svc-list .t-sum { grid-column: 7 / 12; color: var(--muted); }
.svc-list a:hover .t-sum { color: var(--ink); }
/* Services: the extras are a fourth group, Briefings-style rows that open to one line */
.svc-groups .svc-more { padding-bottom: 0; margin-top: 6vh; }
.svc-more .extras-list > details { border-top: 1px solid; }
.svc-more .extras-list > details:first-child { border-top: 0; }
.svc-more .extras-list { border-top: 1px solid; border-bottom: 1px solid; }
.svc-more .xrow { padding-top: 12px; padding-bottom: 12px; }
@media (max-width: 900px) { .svc-list .t-name, .svc-list .t-sum { grid-column: 1; } }

/* Radar line: Oxanium Light (angular, technical), 25% smaller than before */
@font-face { font-family: "Oxanium"; src: url("/assets/fonts/Oxanium.woff2?v=7be09f6519") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
.grow-words { font-family: "Oxanium", "Michroma", var(--font); font-weight: 300; font-size: calc(var(--fs-mega) * 0.375); letter-spacing: 0.03em; }
@media (max-width: 900px) { .grow-words { font-size: clamp(16px, 5vw, 28px); } }

/* Hero staircase spans the full measure: first line flush left, last line flush right
   (ending on the right gutter), middle line centred between them. Glyph side-bearings are
   trimmed so the letters, not their boxes, touch the gutters. */
.hero-title { margin-left: 0; margin-right: 0; }
.hero-title span { padding-left: 0 !important; }
.hero-title span:nth-child(1) { text-align: left; margin-left: -0.06em; }
.hero-title span:nth-child(2) { text-align: center; }
.hero-title span:nth-child(3) { text-align: right; margin-right: -0.025em; }
@media (max-width: 900px) {
  .hero-title { font-size: clamp(34px, 11vw, 96px) !important; }
  .hero-title span { white-space: nowrap; }
  .hero-title span:nth-child(2) { text-align: left; padding-left: 7% !important; }
}
.engseq { --eng-cta-w: calc((100% - 3 * var(--gutter)) / 4); --eng-cta-fs: var(--fs-big-s); }
.t-signal .engseq .eng-cta-fill { background: #000; }

/* Decode on scroll (shared/decode.js): a signal caret leads, letters land in ink, ghosts wait */
.decode-on .dvis { position: relative; display: inline-block; }
.decode-on .dword { display: inline-block; white-space: nowrap; }
.dch { position: relative; display: inline-block; }
.dch.ghost, .dch.hot { color: transparent; clip-path: inset(-.4em 0 -.4em 0); }
.dch-g { position: absolute; left: 0; right: 0; top: 0; text-align: center; letter-spacing: 0; pointer-events: none; }
.dch.ghost .dch-g { color: var(--ink); opacity: .14; }
.dch.hot .dch-g { color: var(--signal); }
.dch.land { animation: dch-land .38s cubic-bezier(.3,.7,.3,1) both; }
@keyframes dch-land { from { color: var(--signal); } }
.dcaret {
  position: absolute; left: 0; top: .17em; width: max(2px, .026em); height: .78em; margin-left: -.05em;
  background: var(--signal); opacity: 0; transition: opacity .25s; pointer-events: none;
  box-shadow: 0 0 12px rgba(228, 50, 43, .45);
}
.dcaret.on { opacity: 1; }

/* About: numbered beliefs, three live places, a short line for specialists */
.about-lead { padding-bottom: 9vh; }
.beliefs, .locs { padding-bottom: 9vh; }
.bel {
  position: relative; display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter);
  align-items: baseline; padding: 20px 0 26px; border-bottom: 1px solid var(--rule);
}
.bel::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, rgba(228,50,43,.15), var(--signal)); transform: scaleX(0); transform-origin: left;
  transition: transform .45s cubic-bezier(.2,.8,.2,1);
}
.bel:hover::after { transform: scaleX(1); }
.bel-n { grid-column: 1 / 3; color: var(--muted); font-variant-numeric: tabular-nums; transition: color .3s; }
.bel:hover .bel-n { color: var(--signal); }
.bel-t { grid-column: 3 / 8; font-size: var(--fs-big); line-height: 1.05; letter-spacing: -0.028em; font-weight: 350; }
.bel-p { grid-column: 8 / 13; color: var(--muted); max-width: 30em; }

.loc-wrap { position: relative; padding-top: 28px; }
.loc-track { position: absolute; left: 0; right: 0; top: 31px; height: 2px; overflow: hidden; }
.loc-track::before { content: ""; position: absolute; left: 0; right: 0; top: .5px; height: 1px; background: currentColor; opacity: .2; }
.loc-track::after {
  content: ""; position: absolute; left: 0; top: 0; width: 22%; height: 2px;
  background: linear-gradient(90deg, rgba(228,50,43,0), var(--signal)); transform: translateX(-100%);
  animation: loc-run 5.2s cubic-bezier(.45,.05,.55,.95) infinite;
}
.loc-list { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); column-gap: var(--gutter); }
.loc-dot { display: block; position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--signal); margin-bottom: 22px; }
.loc-dot::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1px solid var(--signal);
  animation: loc-ping 2.6s cubic-bezier(.2,.7,.2,1) infinite;
}
.loc:nth-child(2) .loc-dot::after { animation-delay: .87s; }
.loc:nth-child(3) .loc-dot::after { animation-delay: 1.73s; }
.loc-c { display: block; font-size: var(--fs-big); line-height: 1.05; letter-spacing: -0.028em; font-weight: 350; }
.loc-s { display: block; color: var(--muted); margin-top: 8px; }
@keyframes loc-ping { from { transform: scale(1); opacity: .9; } to { transform: scale(4.5); opacity: 0; } }
@keyframes loc-run { to { transform: translateX(460%); } }

.join { padding-bottom: 6vh; }
.join-text { margin-top: 20px; font-size: var(--fs-big-s); line-height: 1.16; letter-spacing: -0.018em; font-weight: 350; max-width: 30em; }
.join-text a { text-decoration: underline; text-underline-offset: .12em; text-decoration-thickness: 1px; }
.join-text a:hover { color: var(--signal); }

@media (max-width: 900px) {
  .bel { grid-template-columns: 1fr; row-gap: 8px; padding: 16px 0 22px; }
  .bel-n, .bel-t, .bel-p { grid-column: 1; }
  .loc-track { display: none; }
  .loc-wrap { padding-top: 20px; }
  .loc-list { grid-template-columns: 1fr; row-gap: 30px; }
  .loc { display: grid; grid-template-columns: 22px 1fr; align-items: baseline; }
  .loc-dot { grid-row: 1 / 3; margin: 0; align-self: center; }
  .loc-c, .loc-s { grid-column: 2; }
  .loc-s { margin-top: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .loc-dot::after, .loc-track::after { animation: none; opacity: 0; }
  .bel::after, .bel-n { transition: none; }
}

/* One hover language for every list: siblings dim to .3 across the whole section */
.inc-list:hover .inc-btn { opacity: .3; }
.inc-list .inc-btn:hover, .inc-list .inc-btn:focus-visible, .inc-list .inc.open .inc-btn { opacity: 1; }
.svc-groups:has(.svc-list a:hover) .svc-list a:not(:hover) { opacity: .3; }
.scan-link, .crumb a, .ins-kicker a { transition: opacity .25s; }
.scan-link:hover, .crumb a:hover, .ins-kicker a:hover { opacity: .55; }
/* breathing room between the black stages and the label that follows */
.grow-pin { margin-bottom: 6vh; }

/* Briefings on phones: tabs instead of three stacked groups */
.extras-tabs { display: none; }
@media (max-width: 900px) {
  .extras.tabbed .extras-tabs { display: flex; position: relative; gap: 24px; border-bottom: 1px solid; }
  .extras-tab { padding: 14px 0 12px; border: 0; background: none; color: var(--muted); font: inherit; font-size: 17px; cursor: pointer; transition: color .25s; }
  .extras-tab[aria-selected="true"] { color: var(--ink); }
  .extras-tab sup { margin-left: 3px; font-size: 11px; }
  .extras-tab:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }
  .extras-tab-line { position: absolute; left: 0; bottom: -1px; width: 0; height: 2px; background: var(--signal); transition: transform .4s cubic-bezier(.2, .8, .2, 1), width .4s cubic-bezier(.2, .8, .2, 1); }
  .extras-tab-line::after { content: ""; position: absolute; right: -3px; top: -2px; width: 6px; height: 6px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 8px rgba(228, 50, 43, .7); }
  .extras.tabbed .extras-group { border-bottom: 0; }
  .extras.tabbed .extras-group h3 { display: none; }
  .extras.tabbed .extras-list > :first-child { border-top: 0; }
  .extras.tabbed .extras-group.in { animation: xrow-rise .45s cubic-bezier(.2, .8, .2, 1) both; }
  /* insight rows: the topic sits under the title, so long titles get the full width */
  .extras.tabbed a.xrow { flex-wrap: wrap; row-gap: 4px; padding-top: 14px; padding-bottom: 14px; }
  .extras.tabbed a.xrow .xrow-t { flex-basis: 100%; padding-right: 8px; }
  .extras.tabbed a.xrow .xrow-m { font-size: 14px; }
  .extras.tabbed summary.xrow { padding-top: 14px; padding-bottom: 14px; }
}
@media (prefers-reduced-motion: reduce) { .extras-tab-line { transition: none; } .extras.tabbed .extras-group.in { animation: none; } }
.extras-group[hidden] { display: none; }

/* NVIDIA hardware trio (DGX Spark in 3D, DGX Station, HGX Rubin). Scoped to .spark. */
.spark { --gold: #cdb27c; --muted: #9b9ca3; --hdr: var(--hdr-h, 0px); background: #000; color: #f2f2f2; position: relative; }
.spark-track { height: 420vh; height: 420svh; position: relative; }
.spark-pin { position: sticky; top: var(--hdr); height: calc(100vh - var(--hdr)); height: calc(100svh - var(--hdr));
  display: grid; grid-template-rows: auto 1fr auto; padding: 26px 24px 18px; box-sizing: border-box; overflow: hidden; }
.spark-head { text-align: center; }
.spark-kicker { color: var(--gold); font-size: 14px; letter-spacing: 0.02em; margin: 0 0 8px; }
.spark-title { display: grid; font-weight: 300; font-size: clamp(34px, 4.2vw, 64px); line-height: 0.95; letter-spacing: -0.04em; margin: 0; }
.spark-title span { grid-area: 1 / 1; transition: opacity .35s ease; }
.spark-title .t2, .spark.trio-wide[data-phase="2"] .spark-title .t1 { opacity: 0; }
.spark.trio-wide[data-phase="2"] .spark-title .t2 { opacity: 1; }
.spark-stage { position: relative; min-height: 0; width: min(100%, 1440px); margin: 22px auto 0; }
.spark-turn { position: absolute; inset: 0; width: 100%; height: 100%; cursor: grab; touch-action: pan-y; outline: none; transition: opacity .35s ease; }
.spark.grabbing .spark-turn { cursor: grabbing; }
.spark-turn:focus { outline: none; }
.spark.kbd .spark-turn:focus { outline: 2px solid var(--gold); outline-offset: -2px; border-radius: 4px; }
.spark-poster { position: absolute; display: block; pointer-events: none; transition: opacity .35s ease; }
.spark.ready .spark-poster { opacity: 0; }
.spark:not(.ready) .spark-turn { opacity: 0; }
.spark-parts { position: absolute; inset: 0; pointer-events: none; }
.spark-hint { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; margin: 0;
  color: #d7d7db; font-size: 12.5px; background: rgba(20, 20, 23, .72); border: 1px solid #2c2d33; border-radius: 999px; padding: 6px 12px 6px 10px;
  pointer-events: none; transition: opacity .4s; }
.spark-hint svg { width: 22px; height: 11px; color: var(--gold); }
.spark-hint.gone, .spark-hint.away { opacity: 0 !important; visibility: hidden; transition: opacity .2s, visibility 0s .2s; }

/* Station and Rubin: layered renders beside the Spark */
.trio-prod, .more-prod { position: absolute; perspective: 900px; will-change: transform, opacity; }
.trio-prod { opacity: 0; }
.trio-tilt { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform .1s linear; }
.trio-art { position: absolute; inset: 0; }
.trio-asm, .trio-part { position: absolute; display: block; height: auto; user-select: none; }
.trio-part { opacity: 0; }
.trio-sheen { position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen;
  background: radial-gradient(34% 30% at var(--sx, 50%) var(--sy, 35%), rgba(255, 244, 222, .04), rgba(255, 244, 222, 0) 70%); }

/* captions under the three products */
.trio-caps { list-style: none; margin: 0; padding: 0; }
.trio-caps li { position: absolute; text-align: center; opacity: 0; pointer-events: none; }
.trio-caps b { display: block; font-weight: 400; font-size: 17px; letter-spacing: -0.01em; }
.trio-caps small { display: block; color: var(--gold); font-size: 13px; margin-top: 3px; }

/* numbered markers on the Spark's parts, with the list in the foot */
.spark-marker { position: absolute; width: 20px; height: 20px; margin: -10px 0 0 -10px; border-radius: 50%; display: grid; place-items: center;
  background: var(--gold); color: #000; font-size: 11px; font-weight: 600; opacity: 0; z-index: 41; box-shadow: 0 0 0 3px rgba(0, 0, 0, .55); }
.spark-foot { display: flex; flex-direction: column; align-items: center; gap: 12px; padding-top: 8px; }
.spark-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 240px)); gap: 6px 26px; justify-content: center;
  counter-reset: sp; opacity: 0; transition: opacity .35s ease; }
.spark-list.shown { opacity: 1; }
.spark-list li { position: relative; padding-left: 26px; counter-increment: sp; font-size: 13.5px; line-height: 1.3; }
.spark-list li::before { content: counter(sp); position: absolute; left: 0; top: 1px; width: 18px; height: 18px; border-radius: 50%; background: var(--gold); color: #000;
  font-size: 10.5px; font-weight: 600; display: grid; place-items: center; }
.spark-list b { display: block; color: var(--gold); font-weight: 500; }
.spark-list small { display: block; color: #c7c7cb; font-size: 12px; }
.spark-modes { display: inline-flex; border: 1px solid #3a3b42; border-radius: 999px; padding: 3px; }
.spark-modes button { background: none; border: 0; color: #cfcfd4; font: inherit; font-size: 13px; padding: 8px 18px; border-radius: 999px; cursor: pointer; }
.spark-modes button:hover { color: #fff; }
.spark-modes button[aria-pressed="true"] { background: #f2f2f2; color: #000; }
.spark-modes button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* narrow screens: the Spark alone in the pin, Station and Rubin below */
.spark-more { display: none; }
@media (max-width: 859px) {
  .spark-track { height: 340vh; height: 340svh; }
  .spark-pin { padding: 18px 16px 12px; }
  .spark-stage { margin-top: 12px; }
  .spark-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; }
  .spark-list li { font-size: 12.5px; } .spark-list small { font-size: 11.5px; }
  .spark-more { display: grid; gap: 44px; padding: 8px 16px 64px; }
  .more-stage { position: relative; }
  .more-cap { margin: 10px 0 0; text-align: center; }
  .more-cap b { display: block; font-weight: 400; font-size: 18px; }
  .more-cap small { display: block; color: var(--gold); font-size: 13px; margin-top: 3px; }
  .trio-prod { display: none; }
}
/* reduced motion: no pin; the trio stands opened up */
.spark.still .spark-track { height: auto; }
.spark.still .spark-pin { position: relative; top: 0; height: calc(100vh - var(--hdr)); height: calc(100svh - var(--hdr)); }
@media (prefers-reduced-motion: reduce) {
  .spark-hint, .spark-list, .spark-poster, .spark-turn, .spark-title span { transition: none; }
  .spark-track { height: auto; }
  .spark-pin { position: relative; top: 0; }
}
/* reduced motion shows the opened model only; the turn/inside switch has nothing to switch */
@media (prefers-reduced-motion: reduce) { .spark-modes { display: none; } }

/* Split-flap "Signs you need this" rows (shared/flap.js), in each page's own type and palette.
   Each site sets --flap-hot (mid-flip glyphs), --flap-split (the hairline) and --flap-weight. */
[data-flap], [data-flap-anim] { position: relative; }
[data-flap] { outline: none; cursor: default; }
[data-flap]:focus-visible { outline: 1px solid var(--flap-hot, currentColor); outline-offset: 2px; }

/* Rows: the real sign stays for screen readers (and shows as plain text without JavaScript). */
.flap-on .flap-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* The heading borrows the rows' type so every line matches; flipped, it is a link to contact. */
.flap-link { display: block; color: inherit; text-decoration: none; outline: none; }
.flap-link:focus-visible { outline: 1px solid var(--flap-hot, currentColor); outline-offset: 2px; }
[data-flap="head"].on { cursor: pointer; border-bottom-color: var(--flap-hot, currentColor); }
[data-flap="head"] { transition: border-color .25s; }
.flap-on [data-flap="head"] .flap-grid { font-family: var(--flap-ff); font-size: var(--flap-fs); text-transform: none; letter-spacing: normal; }
.flap-grid { display: grid; grid-template-columns: repeat(var(--cols), var(--cw)); column-gap: 0; }
.fc { position: relative; display: block; width: var(--cw); height: var(--ch); perspective: 180px; font-weight: var(--flap-weight, inherit); line-height: var(--ch); text-align: center; color: #0b0b0c; }
.fc > i { position: absolute; left: 0; right: 0; height: 50%; overflow-x: visible; overflow-y: clip; backface-visibility: hidden; font-style: normal; }
.fc-u, .fc-fu { top: 0; transform-origin: 50% 100%; }
.fc-l, .fc-fl { bottom: 0; transform-origin: 50% 0; }
.fc-fu { transform: rotateX(-90deg); z-index: 2; background: #fff; opacity: 0; }
.fc-fl { transform: rotateX(90deg); z-index: 2; background: #fff; opacity: 0; }
.fc b { display: block; height: var(--ch); font-weight: inherit; }
.fc-l b, .fc-fl b { margin-top: calc(var(--ch) / -2); }
.fc::after { content: ""; position: absolute; left: 1px; right: 1px; top: calc(50% - .5px); height: 1px; background: var(--flap-split, rgba(0, 0, 0, .14)); z-index: 3; opacity: 0; transition: opacity .2s; }
/* the hinge line shows only while a cell is flipping, never at rest */
.fc.hot::after { opacity: 1; }
.fc.blank::after { opacity: 0; }
.fc.hot { color: var(--flap-hot, currentColor); }

/* Page-story dots */
.flap-fx { position: absolute; left: 0; pointer-events: none; z-index: 4; }
/* every cell, row and heading alike, in the monospace face the cell width was measured in */
.flap-on .fc { font-family: var(--flap-ff); font-size: var(--flap-fs); letter-spacing: 0; }

/* Engagement steps (shared/steps.js). Each site sets the colours:
   --eng-accent-rgb (signal, wake, pings, mid-flip glyphs), --eng-line-rgb / --eng-line-a (track),
   --eng-ink-c / --eng-muted-c (numerals), --eng-paper (marker fill before arrival). */
.eng-body { position: relative; }
.eng-canvas { display: none; }
.eng-on .eng-canvas { display: block; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; }
.eng-mark { display: block; width: 10px; height: 10px; border-radius: 50%; border: 1px solid rgba(var(--eng-line-rgb, 0, 0, 0), .45); background: var(--eng-paper, #fff); position: relative; z-index: 3; transition: background-color .35s, border-color .35s; }
.eng-on .eng-step.on .eng-mark, .eng-static .eng-mark { background: rgb(var(--eng-accent-rgb)); border-color: rgb(var(--eng-accent-rgb)); }
.eng-count { font-variant-numeric: tabular-nums; white-space: nowrap; }
.eng-count b { font-weight: inherit; }
.eng-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.eng-vis { display: block; }
.eng-title .eng-vis { display: inline; }

/* Before arrival (JS running, motion allowed): numerals muted, titles blank, lines tucked below
   their masks. Everything keeps its space, so nothing shifts. */
.eng-on:not(.eng-static) .eng-n { color: var(--eng-muted-c); transition: color .45s; }
.eng-on:not(.eng-static) .eng-step.on .eng-n { color: var(--eng-ink-c); }
.ech { display: inline-block; position: relative; perspective: 240px; transform-origin: 50% 55%; }
.ech.off { color: transparent; }
.ech-f { position: absolute; left: 50%; top: 0; color: rgb(var(--eng-accent-rgb)); transform-origin: 50% 55%; pointer-events: none; }
.eng-line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.eng-line > span { display: block; transform: translateY(110%); transition: transform .24s ease-in; }
.eng-step.on .eng-line > span, .eng-static .eng-line > span { transform: none; transition: transform .6s cubic-bezier(.2, .7, .2, 1) var(--d, 0ms); }

/* Desktop: pinned under the sticky header while the signal runs 1 to 4. */
.eng-pinned .eng-pin { height: 330vh; }
.eng-pinned .eng-stick { position: sticky; top: var(--hd-h, 52px); height: calc(100vh - var(--hd-h, 52px)); display: flex; flex-direction: column; justify-content: center; }

/* Phones: the track runs down the left through the markers. */
.eng-flow .eng-step { position: relative; padding-left: 34px; }
.eng-flow .eng-mark { position: absolute; left: 0; top: var(--eng-mark-top, 20px); margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .eng-mark, .eng-line > span, .eng-n { transition: none !important; }
}

/* The line's destination: a Build your plan button it draws, floods and labels (steps.js) */
.eng-cta {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 18px;
  width: min(100%, var(--eng-cta-w, 420px)); margin: 5vh 0 0 auto; height: 64px; padding: 0 26px 0 30px; border-radius: 999px;
  color: #fff; text-decoration: none; overflow: hidden; isolation: isolate; outline: none;
}
.eng-cta-fill { position: absolute; inset: 0; border-radius: inherit; background: rgb(var(--eng-accent-rgb)); z-index: -2;
  clip-path: inset(0 calc((1 - var(--fill, 0)) * 100%) 0 0 round 999px); }
.eng-cta::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: #000; z-index: -1;
  transform: scaleX(0); transform-origin: left; transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
.eng-cta-label { position: relative; font-size: var(--eng-cta-fs, 22px); letter-spacing: -0.01em; white-space: nowrap; }
.eng-cta-vis { display: inline-block; min-width: 1ch; font-variant-numeric: tabular-nums; }
.eng-cta-arrow { position: relative; width: 26px; height: 12px; flex: none; opacity: 0; transition: opacity .3s, transform .45s cubic-bezier(.2, .8, .2, 1); }
.eng-cta-arrow::before { content: ""; position: absolute; left: 0; right: 2px; top: 50%; border-top: 1.6px solid currentColor; }
.eng-cta-arrow::after { content: ""; position: absolute; right: 1px; top: 50%; width: 8px; height: 8px; border-top: 1.6px solid currentColor; border-right: 1.6px solid currentColor; transform: translateY(-50%) rotate(45deg); }
.eng-cta.on .eng-cta-arrow { opacity: 1; }
.eng-cta.on:hover::before, .eng-cta.on:focus-visible::before { transform: scaleX(1); }
.eng-cta.on:hover .eng-cta-arrow, .eng-cta.on:focus-visible .eng-cta-arrow { transform: translateX(6px); }
.eng-cta::after { content: ""; position: absolute; left: 14px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: rgb(var(--eng-accent-rgb)); opacity: 0; }
.eng-cta.on:hover::after { opacity: 1; animation: eng-cta-ping 1.1s ease-out infinite; }
@keyframes eng-cta-ping { 0% { box-shadow: 0 0 0 0 rgba(var(--eng-accent-rgb), .8); } 100% { box-shadow: 0 0 0 14px rgba(var(--eng-accent-rgb), 0); } }
.eng-cta:focus-visible { outline: 2px solid rgb(var(--eng-accent-rgb)); outline-offset: 4px; }
/* Without the script (or before it runs) the button is simply there */
.engseq:not(.eng-on) .eng-cta, .eng-static .eng-cta { --fill: 1; }
.engseq:not(.eng-on) .eng-cta .eng-cta-arrow, .eng-static .eng-cta-arrow { opacity: 1; }
.eng-flow .eng-cta { width: 100%; margin-top: 28px; }
@media (prefers-reduced-motion: reduce) { .eng-cta::before, .eng-cta-arrow { transition: none; } .eng-cta.on:hover::after { animation: none; } }

/* Plan builder (contact page), shared by both sites. Per-site tokens on .cb-a / .cb-b. */
.cb-a {
  --cb-ink: #fff; --cb-muted: #9b9ba1; --cb-line: #2a2a2e; --cb-acc: #e4322b; --cb-acc-rgb: 228, 50, 43;
  --cb-tile-bg: #060606; --cb-tile-ink: #fff; --cb-tile-line: #26262a;
  --cb-panel-bg: #050505; --cb-panel-ink: #fff; --cb-panel-muted: #9b9ba1; --cb-panel-line: #2a2a2e;
  --cb-q-size: clamp(26px, 2.5vw, 40px); --cb-q-weight: 300; --cb-q-case: none; --cb-q-track: -0.03em;
}
.cb-b {
  --cb-ink: #000; --cb-muted: #6f6f6f; --cb-line: #d6d6d6; --cb-acc: #1d3fff; --cb-acc-rgb: 29, 63, 255;
  --cb-tile-bg: #000; --cb-tile-ink: #fff; --cb-tile-line: #000;
  --cb-panel-bg: #000; --cb-panel-ink: #fff; --cb-panel-muted: #a7a8b0; --cb-panel-line: #2c2c31;
  --cb-q-size: clamp(22px, 2vw, 32px); --cb-q-weight: 800; --cb-q-case: uppercase; --cb-q-track: -0.02em;
}
.cb-intro { padding-bottom: 4vh; }

.cb { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 420px); gap: 56px; align-items: start; padding-bottom: 9vh; color: var(--cb-ink); }
.cb-main { position: relative; padding-left: 52px; min-width: 0; }
.cb-rail { position: absolute; left: 0; top: 0; width: 32px; height: 100%; pointer-events: none; }

/* questions */
.cb-q { border: 0; margin: 0 0 52px; padding: 0; min-width: 0; }
.cb-q:last-of-type { margin-bottom: 0; }
.cb-legend {
  display: flex; gap: 14px; align-items: baseline; width: 100%; padding: 0 0 12px; border-bottom: 1px solid var(--cb-line);
  font-size: var(--cb-q-size); font-weight: var(--cb-q-weight); text-transform: var(--cb-q-case); letter-spacing: var(--cb-q-track); line-height: 1.05;
}
.cb-n { font-size: 13px; font-weight: 500; letter-spacing: 0.02em; color: var(--cb-muted); font-variant-numeric: tabular-nums; flex: none; transform: translateY(-0.2em); }
.cb-q.done .cb-n { color: var(--cb-acc); }
.cb-hint { color: var(--cb-muted); font-size: 14px; margin: 10px 0 0; }
.cb input[type="checkbox"], .cb input[type="radio"] { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }

/* 1: concern tiles that play their threat animation */
.cb-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.cb-tile { position: relative; display: block; height: 148px; background: var(--cb-tile-bg); color: var(--cb-tile-ink); border: 1px solid var(--cb-tile-line); overflow: hidden; cursor: pointer; transition: border-color .25s; }
.cb-tile-anim { position: absolute; inset: 0; opacity: .32; transition: opacity .35s; }
.cb-tile-anim .threat { position: absolute; inset: 0; }
.cb-tile-anim canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cb-tile::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.45) 42%, rgba(0,0,0,0) 72%); }
.cb-tile-body { position: relative; z-index: 2; display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; pointer-events: none; }
.cb-tile-label { font-size: 18px; line-height: 1.22; letter-spacing: -0.012em; max-width: 22em; }
.cb-b .cb-tile-label { font-weight: 600; }
.cb-check { width: 20px; height: 20px; flex: none; margin-top: 1px; fill: none; }
.cb-check rect { stroke: rgba(255,255,255,.55); stroke-width: 1.2; transition: stroke .25s; }
.cb-check path { stroke: var(--cb-acc); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 16; stroke-dashoffset: 16; transition: stroke-dashoffset .35s cubic-bezier(.3,.7,.2,1); }
.cb-tile:hover .cb-tile-anim, .cb-tile:focus-within .cb-tile-anim { opacity: .75; }
.cb-tile:hover { border-color: #55555c; }
.cb-tile:has(input:checked) { border-color: var(--cb-acc); box-shadow: inset 0 0 0 1px var(--cb-acc); }
.cb-tile:has(input:checked) .cb-tile-anim { opacity: .9; }
.cb-tile:has(input:checked) .cb-check rect { stroke: var(--cb-acc); }
.cb-tile:has(input:checked) .cb-check path { stroke-dashoffset: 0; }
.cb-tile:has(input:focus-visible) { outline: 2px solid var(--cb-acc); outline-offset: 2px; }

/* 2 and 4: segmented choice with the signal dot sliding under it */
.cb-seg { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin-top: 8px; border-bottom: 1px solid var(--cb-line); }
.cb-seg-opt { position: relative; cursor: pointer; text-align: center; padding: 16px 6px 18px; font-size: 18px; color: var(--cb-muted); transition: color .2s; white-space: nowrap; }
.cb-b .cb-seg-opt { font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.01em; }
.cb-seg-opt:hover { color: var(--cb-ink); }
.cb-seg-opt:has(input:checked) { color: var(--cb-ink); }
.cb-seg-opt:has(input:focus-visible) span { outline: 2px solid var(--cb-acc); outline-offset: 4px; }
.cb-seg-opt + .cb-seg-opt::before { content: ""; position: absolute; left: 0; top: 30%; bottom: 30%; border-left: 1px solid var(--cb-line); }
.cb-seg-dot { position: absolute; left: 0; bottom: -5px; width: 9px; height: 9px; border-radius: 50%; background: var(--cb-acc); box-shadow: 0 0 12px rgba(var(--cb-acc-rgb), .9); opacity: 0; transform: translateX(var(--x, 0px)); transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .3s; }
.cb-seg.has .cb-seg-dot { opacity: 1; }
.cb-seg-fill { position: absolute; left: 0; bottom: -1px; height: 1px; background: var(--cb-acc); width: var(--w, 0px); transition: width .5s cubic-bezier(.2,.8,.2,1); }

/* 3: industry rows */
.cb-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; margin-top: 6px; }
.cb-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--cb-line); cursor: pointer; color: var(--cb-muted); font-size: 17px; transition: color .2s; }
.cb-b .cb-row { font-weight: 500; }
.cb-row:hover { color: var(--cb-ink); }
.cb-row-dot { position: relative; width: 9px; height: 9px; border-radius: 50%; border: 1px solid currentColor; flex: none; }
.cb-row:has(input:checked) { color: var(--cb-ink); }
.cb-row:has(input:checked) .cb-row-dot { background: var(--cb-acc); border-color: var(--cb-acc); box-shadow: 0 0 10px rgba(var(--cb-acc-rgb), .8); }
.cb-row:has(input:checked) .cb-row-dot::after { content: ""; position: absolute; inset: -1px; border-radius: 50%; border: 1px solid var(--cb-acc); animation: cb-ping .9s ease-out 1; }
.cb-row:has(input:focus-visible) .cb-row-label { outline: 2px solid var(--cb-acc); outline-offset: 3px; }
@keyframes cb-ping { from { transform: scale(1); opacity: .9; } to { transform: scale(4); opacity: 0; } }

/* 5: contact fields */
.cb-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 24px; margin-top: 18px; }
.cb-field { display: flex; flex-direction: column; gap: 6px; }
.cb-field > span { font-size: 13px; color: var(--cb-muted); }
.cb-field input, .cb-field textarea { background: transparent; border: 0; border-bottom: 1px solid var(--cb-line); border-radius: 0; padding: 8px 0 10px; font: inherit; font-size: 18px; color: var(--cb-ink); width: 100%; outline: none; transition: border-color .2s; }
.cb-field textarea { resize: vertical; min-height: 80px; }
.cb-field input:focus, .cb-field textarea:focus { border-bottom-color: var(--cb-acc); }
.cb-wide { grid-column: 1 / -1; }
.cb-submit { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 28px; }
.cb-send { border: 0; border-radius: 999px; cursor: pointer; font: inherit; font-size: 18px; padding: 15px 30px; transition: background .2s, color .2s, transform .2s; }
.cb-a .cb-send { background: #fff; color: #000; }
.cb-b .cb-send { background: #000; color: #fff; font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.02em; padding: 16px 30px; }
.cb-send:hover { background: var(--cb-acc); color: #fff; }
.cb-send:focus-visible { outline: 2px solid var(--cb-acc); outline-offset: 3px; }
.cb-send[disabled] { opacity: .55; cursor: progress; }
.cb-alt { color: var(--cb-muted); font-size: 14px; margin: 0; }
.cb-alt a { color: var(--cb-ink); text-decoration: underline; text-underline-offset: 0.15em; }
.cb-status { flex-basis: 100%; margin: 0; font-size: 15px; min-height: 1.2em; }
.cb-status a { color: var(--cb-acc); text-decoration: underline; }

/* the live plan panel */
.cb-panel { position: sticky; top: var(--cb-top, 80px); background: var(--cb-panel-bg); color: var(--cb-panel-ink); border: 1px solid var(--cb-panel-line); max-height: calc(100vh - var(--cb-top, 80px) - 20px); overflow: auto; overscroll-behavior: contain; }
.cb-panel-in { padding: 24px 24px 26px; }
.cb-sheet-bar { display: none; }
.cb-ptitle { margin: 0 0 6px; font-size: 28px; line-height: 1.05; font-weight: 300; letter-spacing: -0.025em; }
.cb-b .cb-ptitle { font-weight: 850; text-transform: uppercase; font-size: 26px; letter-spacing: -0.02em; }
.cb-pnote { margin: 0 0 18px; color: var(--cb-panel-muted); font-size: 14px; line-height: 1.4; }
.cb-pnote b { color: var(--cb-panel-ink); font-weight: 500; }
.cb-empty { position: relative; aspect-ratio: 4 / 3; border: 1px solid var(--cb-panel-line); }
.cb-empty .threat { position: absolute; inset: 0; }
.cb-empty canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cb-panel.has-plan .cb-empty { display: none; }
.cf-ch { display: inline-block; white-space: pre; transform-origin: 50% 50%; }
.cf-ch.flip { color: var(--cb-acc); }

.cb-plan { position: relative; padding-left: 26px; }
.cb-plan::before { content: ""; position: absolute; left: 4px; top: 8px; bottom: 10px; width: 1px; background: var(--cb-panel-line); }
.cb-plan:empty::before { display: none; }
.cb-plan-fill { position: absolute; left: 4px; top: 8px; width: 1px; height: var(--h, 0px); background: linear-gradient(to bottom, rgba(var(--cb-acc-rgb), .15), rgba(var(--cb-acc-rgb), 1)); transition: height .6s cubic-bezier(.2,.8,.2,1); }
.cb-plan-dot { position: absolute; left: 0; top: 4px; width: 9px; height: 9px; border-radius: 50%; background: var(--cb-acc); box-shadow: 0 0 12px rgba(var(--cb-acc-rgb), .9); transform: translateY(var(--y, 0px)); transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.cb-ph { position: relative; display: grid; grid-template-rows: 1fr; opacity: 1; transition: grid-template-rows .45s cubic-bezier(.2,.8,.2,1), opacity .35s, margin .45s; margin-bottom: 16px; }
.cb-ph.enter, .cb-ph.leave { grid-template-rows: 0fr; opacity: 0; margin-bottom: 0; }
.cb-ph-in { overflow: hidden; min-height: 0; }
.cb-ph::before { content: ""; position: absolute; left: -26px; top: 4px; width: 9px; height: 9px; border-radius: 50%; border: 1px solid var(--cb-panel-muted); background: var(--cb-panel-bg); box-sizing: border-box; z-index: 1; }
.cb-ph.lit::before { border-color: var(--cb-acc); }
.cb-ph.ping::after { content: ""; position: absolute; left: -26px; top: 4px; width: 9px; height: 9px; border-radius: 50%; border: 1px solid var(--cb-acc); animation: cb-ping .9s ease-out 1; }
.cb-ph-t { font-size: 12.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cb-panel-muted); margin: 0 0 8px; line-height: 17px; }
.cb-ph-t .k { color: var(--cb-acc); margin-right: 8px; font-variant-numeric: tabular-nums; }
.cb-item { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 12px; align-items: start; margin-top: 10px; }
.cb-item-thumb { position: relative; width: 78px; height: 52px; background: #000; border: 1px solid var(--cb-panel-line); }
.cb-item-thumb .threat { position: absolute; inset: 0; }
.cb-item-thumb canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cb-item-thumb.plain::after { content: ""; position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px; border-radius: 50%; background: var(--cb-panel-muted); }
.cb-item-name { display: block; font-size: 16px; line-height: 1.2; color: var(--cb-panel-ink); letter-spacing: -0.01em; }
.cb-b .cb-item-name { font-weight: 600; }
a.cb-item-name { text-decoration: underline; text-decoration-color: rgba(255,255,255,.35); text-underline-offset: 0.15em; }
a.cb-item-name:hover { text-decoration-color: var(--cb-acc); }
.cb-item-text { display: block; font-size: 13px; line-height: 1.35; color: var(--cb-panel-muted); margin-top: 3px; }
.cb-ok { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--cb-panel-line); color: var(--cb-panel-ink); font-size: 14px; display: none; }
.cb-panel.sent .cb-ok { display: block; }

.cb-packet { position: fixed; inset: 0; width: 100vw; height: 100vh; pointer-events: none; z-index: 60; }

/* phones: one column; the plan becomes a bottom sheet */
@media (max-width: 900px) {
  .cb { grid-template-columns: 1fr; gap: 0; padding-bottom: 90px; }
  .cb-main { padding-left: 30px; }
  .cb-rail { width: 22px; }
  .cb-q { margin-bottom: 40px; }
  .cb-tiles, .cb-rows, .cb-fields { grid-template-columns: 1fr; }
  .cb-tile { height: 118px; }
  .cb-tile-label { font-size: 17px; }
  .cb-seg-opt { font-size: 14px; padding: 14px 2px 16px; }
  .cb-b .cb-seg-opt { font-size: 12px; }
  .cb-panel {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 50; max-height: 78vh; max-height: 78dvh; border-radius: 14px 14px 0 0; border-bottom: 0;
    transform: translateY(calc(100% - 58px)); transition: transform .35s cubic-bezier(.2,.8,.2,1); overflow: hidden; display: flex; flex-direction: column;
  }
  .cb-panel.open { transform: none; }
  .cb-panel.away:not(.open) { transform: translateY(100%); }
  /* typing: the plan bar steps aside so it never covers the field */
  body:has(.cb-fields input:focus, .cb-fields textarea:focus) .cb-panel:not(.open) { transform: translateY(100%); }
  .cb-sheet-bar { display: flex; flex: none; width: 100%; height: 58px; align-items: center; justify-content: space-between; gap: 12px; padding: 0 18px; background: transparent; border: 0; border-bottom: 1px solid var(--cb-panel-line); color: var(--cb-panel-ink); font: inherit; font-size: 15px; cursor: pointer; text-align: left; }
  .cb-sheet-count::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--cb-acc); margin-right: 10px; vertical-align: 1px; box-shadow: 0 0 10px rgba(var(--cb-acc-rgb), .9); }
  .cb-sheet-act { color: var(--cb-panel-muted); }
  .cb-panel-in { overflow: auto; padding: 16px 18px 26px; }
  .cb-empty { aspect-ratio: 16 / 9; }
}
@media (prefers-reduced-motion: reduce) {
  .cb *, .cb *::before, .cb *::after { transition: none !important; animation: none !important; }
}

/* small phones: the size options must fit five across */
@media (max-width: 400px) {
  .cb-seg-opt { font-size: 12px; letter-spacing: -0.03em; padding-left: 0; padding-right: 0; white-space: nowrap; }
  .cb-b .cb-seg-opt { font-size: 10.5px; }
}

/* ---- sent: the form clears away (staggered lift, blur, fade); a lock-on confirmation replaces it */
.cb.cb-leaving .cb-q, .cb.cb-leaving .cb-panel, .cb.cb-leaving .cb-rail {
  opacity: 0; transform: translateY(-16px); filter: blur(5px); pointer-events: none;
  transition: opacity .42s ease, transform .5s cubic-bezier(.5, 0, .75, 0), filter .42s ease;
  transition-delay: calc(var(--i, 0) * 45ms);
}
.cbd { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter, 20px); align-items: center; padding-top: 3vh; padding-bottom: 12vh; min-height: 72vh; }
.cbd:focus { outline: none; }
.cbd-art { grid-column: 1 / 6; }
.cbd-lock { display: block; width: 100%; max-width: 460px; aspect-ratio: 1; }
.cbd-body { grid-column: 7 / 13; }
.cbd-kicker { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; font-size: 14px; letter-spacing: .02em; color: rgb(var(--cb-acc-rgb)); opacity: 0; transition: opacity .5s ease .25s; }
.cbd.go .cbd-kicker { opacity: 1; }
.cbd-kicker i { width: 8px; height: 8px; border-radius: 50%; background: rgb(var(--cb-acc-rgb)); box-shadow: 0 0 10px rgba(var(--cb-acc-rgb), .9); animation: cbd-blink 1.6s ease-in-out infinite; }
@keyframes cbd-blink { 50% { opacity: .35; } }
.cbd-h { margin: 0 0 26px; font-size: clamp(34px, 4.6vw, 76px); line-height: 1.02; letter-spacing: -0.03em; font-weight: 350; }
.cbd-vis { position: relative; display: inline-block; }
.cbd-w { display: inline-block; white-space: nowrap; }
.cbd-ch { position: relative; display: inline-block; }
.cbd-ch.ghost, .cbd-ch.hot { color: transparent; clip-path: inset(-.4em 0 -.4em 0); }
.cbd-g { position: absolute; left: 0; right: 0; top: 0; text-align: center; letter-spacing: 0; pointer-events: none; }
.cbd-ch.ghost .cbd-g { color: var(--cbd-ink); opacity: .16; }
.cbd-ch.hot .cbd-g { color: rgb(var(--cb-acc-rgb)); }
.cbd-ch.land { animation: cbd-land .4s cubic-bezier(.3, .7, .3, 1) both; }
@keyframes cbd-land { from { color: rgb(var(--cb-acc-rgb)); } }
.cbd-caret { position: absolute; left: 0; top: .14em; width: max(2px, .03em); height: .82em; margin-left: -.04em; background: rgb(var(--cb-acc-rgb)); box-shadow: 0 0 12px rgba(var(--cb-acc-rgb), .5); opacity: 0; transition: opacity .25s; pointer-events: none; }
.cbd-caret.on { opacity: 1; }
.cbd-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cbd-sub { margin: 0; max-width: 30em; font-size: clamp(18px, 1.6vw, 24px); line-height: 1.3; letter-spacing: -0.01em; }
.cbd-sub b { font-weight: 500; }
.cbd-rise { opacity: 0; transform: translateY(14px); transition: opacity .5s ease, transform .65s cubic-bezier(.2, .8, .2, 1); transition-delay: var(--d, 0ms); }
.cbd.go .cbd-rise { opacity: 1; transform: none; }
.cbd-sent { margin-top: 36px; }
.cbd-label { margin: 0; padding-bottom: 8px; font-size: 14px; opacity: .6; border-bottom: 1px solid rgba(127, 127, 127, .45); }
.cbd-list { list-style: none; margin: 0; padding: 0; }
.cbd-list li { position: relative; display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; padding: 12px 0 13px; border-bottom: 1px solid rgba(127, 127, 127, .3); }
.cbd-list li::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, rgba(var(--cb-acc-rgb), .1), rgb(var(--cb-acc-rgb))); transform: scaleX(0); transform-origin: left; opacity: 0; }
.cbd.go .cbd-list li::after { animation: cbd-wipe 1.2s cubic-bezier(.2, .8, .2, 1) var(--d, 0ms) both; }
@keyframes cbd-wipe { 0% { transform: scaleX(0); opacity: 1; } 55% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1); opacity: 0; } }
.cbd-list .n { font-variant-numeric: tabular-nums; opacity: .5; }
.cbd-list .t { display: block; font-size: 17px; line-height: 1.25; }
.cbd-list .i { display: block; margin-top: 3px; font-size: 14px; line-height: 1.35; opacity: .6; }
.cbd-next { display: flex; flex-wrap: wrap; align-items: baseline; gap: 14px 28px; margin: 34px 0 0; }
.cbd-next a, .cbd-again { padding: 0 0 2px; border: 0; border-bottom: 1px solid currentColor; background: none; color: inherit; font: inherit; font-size: 16px; cursor: pointer; transition: color .25s, opacity .25s; }
.cbd-next a:hover, .cbd-again:hover { color: rgb(var(--cb-acc-rgb)); }
.cbd-again { border-bottom-color: transparent; opacity: .6; }
.cbd-again:hover { opacity: 1; }
@media (max-width: 900px) {
  .cbd { grid-template-columns: 1fr; row-gap: 20px; padding-top: 1vh; min-height: 0; }
  .cbd-art, .cbd-body { grid-column: 1; }
  .cbd-lock { max-width: 300px; margin: 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .cb.cb-leaving .cb-q, .cb.cb-leaving .cb-panel, .cb.cb-leaving .cb-rail { transition: none; }
  .cbd-rise, .cbd-kicker { transition: none; }
  .cbd-kicker i { animation: none; }
  .cbd.go .cbd-list li::after { animation: none; }
}

/* Sector rows that open to a real incident (shared; each site sets --inc-accent-rgb) */
.inc-list .inc { position: relative; }
.inc-btn { all: unset; box-sizing: border-box; display: grid; width: 100%; cursor: pointer; position: relative; }
.inc-btn:focus-visible { outline: 2px solid rgb(var(--inc-accent-rgb)); outline-offset: 4px; }
.inc-plus { position: absolute; right: 0; top: 50%; width: 14px; height: 14px; transform: translateY(-50%); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.inc-plus::before, .inc-plus::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1.5px solid currentColor; }
.inc-plus::after { transform: rotate(90deg); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.inc.open .inc-plus { transform: translateY(-50%) rotate(45deg); color: rgb(var(--inc-accent-rgb)); }
.inc-tag { position: absolute; right: 28px; top: 50%; transform: translateY(-50%); font-size: 12px; color: rgb(var(--inc-accent-rgb)); opacity: 0; transition: opacity .25s; white-space: nowrap; }
.inc-btn:hover .inc-tag, .inc.open .inc-tag { opacity: 1; }
.inc-panel { overflow: hidden; }
.inc-inner { position: relative; padding: 18px 0 22px; }
.inc-fx { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 30px; pointer-events: none; }
.inc-when { font-variant-numeric: tabular-nums; letter-spacing: 0.06em; text-transform: uppercase; font-size: 12px; color: rgb(var(--inc-accent-rgb)); margin: 0 0 8px; min-height: 1.2em; opacity: 0; transition: opacity .2s; }
.inc.shown .inc-when { opacity: 1; }
.inc-title { margin: 0 0 8px; }
.inc-text { margin: 0 0 12px; max-width: 46em; }
.inc-w { display: inline-block; white-space: pre; opacity: 0; transform: translateY(0.7em); transition: opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1); transition-delay: var(--d, 0ms); }
.inc.shown .inc-w { opacity: 1; transform: none; }
.inc-src { display: inline-flex; gap: 4px; font-size: 12.5px; opacity: 0; transform: translateY(4px); transition: opacity .4s ease .55s, transform .4s ease .55s, color .2s; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.inc.shown .inc-src { opacity: .7; transform: none; }
.inc-src:hover { opacity: 1 !important; color: rgb(var(--inc-accent-rgb)); }
@media (prefers-reduced-motion: reduce) {
  .inc-w, .inc-src, .inc-when, .inc-plus, .inc-plus::after { transition: none !important; }
}

/* Insights (index + articles), shared by both sites; .ins-a / .ins-b carry each site's look. */
.ins-a { --ins-acc: 228, 50, 43; --ins-acc-dark: 228, 50, 43; }
.ins-b { --ins-acc: 29, 63, 255; --ins-acc-dark: 111, 134, 255; }

/* ---- split-flap text: each character keeps its width; the random glyph shows over it */
.ins-fw { display: inline-block; white-space: nowrap; }
.ins-c { position: relative; display: inline-block; }
.ins-armed .ins-c.f { clip-path: inset(-0.35em 0 -0.35em 0); }
.ins-armed .ins-c.f { color: transparent; }
.ins-armed .ins-c.f::after { content: attr(data-g); position: absolute; left: 50%; top: 0; transform: translateX(-50%); color: rgb(var(--ins-acc)); }

/* ---- the headline rises in line by line */
.ins-rw { display: inline-block; }
.ins-armed [data-rise]:not(.split) { visibility: hidden; }
.ins-armed [data-rise] .ins-rw { opacity: 0; transform: translateY(.42em); }
.ins-armed [data-rise].in .ins-rw { opacity: 1; transform: none; transition: opacity .7s ease var(--d, 0ms), transform .9s cubic-bezier(.2, .8, .2, 1) var(--d, 0ms); }

/* ---- A: index list */
.ins-a.ins-index { padding-bottom: 8vh; }
.ins-a .ins-list { border-top: 1px solid; }
.ins-a .ins-item { border-bottom: 1px solid; }
.ins-a .ins-link { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding: 18px 0 20px; align-items: start; transition: opacity .25s; }
.ins-a .ins-list:hover .ins-link { opacity: .3; }
.ins-a .ins-list .ins-link:hover, .ins-a .ins-link:focus-visible { opacity: 1; }
.ins-a .ins-link:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.ins-a .ins-thumb { grid-column: 1 / 4; }
.ins-thumb-anim { width: 100%; aspect-ratio: 16 / 10; }
.ins-a .ins-text { grid-column: 4 / 10; display: flex; flex-direction: column; gap: 12px; }
.ins-a .ins-title { font-size: clamp(26px, 2.7vw, 44px); line-height: 1.02; letter-spacing: -0.03em; font-weight: 300; }
.ins-a .ins-dek { color: var(--muted); max-width: 32em; }
.ins-a .ins-meta { grid-column: 10 / 13; display: flex; flex-direction: column; gap: 3px; color: var(--muted); font-size: var(--fs-small); padding-top: 9px; }
.ins-a .ins-tag { color: var(--ink); }

/* ---- B: cards */
.ins-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); }
.ins-card { background: #000; color: #fff; --ins-acc: 111, 134, 255; }
.ins-card-link { display: flex; flex-direction: column; height: 100%; padding: 18px 18px 20px; box-sizing: border-box; }
.ins-card-link:focus-visible { outline: 2px solid #9fb0ff; outline-offset: 2px; }
.ins-card-box { width: 100%; aspect-ratio: 16 / 11; }
.ins-card-body { display: flex; flex-direction: column; flex: 1; }
.ins-chip { align-self: flex-start; margin: 18px 0 12px; background: rgba(29, 63, 255, .28); color: #b3c0ff; font-size: 12px; font-weight: 600; padding: 3px 8px; }
.ins-card-title { font-weight: 850; text-transform: uppercase; font-size: clamp(22px, 1.8vw, 30px); line-height: .95; letter-spacing: -0.02em; transition: color .2s; }
.ins-card-link:hover .ins-card-title { color: #b3c0ff; }
.ins-card-meta { display: flex; gap: 16px; margin-top: auto; padding-top: 22px; font-size: 13px; color: #9a9ca3; }

/* ---- article header */
.ins-byline { display: flex; gap: 18px; color: var(--muted); font-size: var(--fs-small); margin: 14px 0 0; }
.ins-a .ins-head { display: grid; grid-template-columns: repeat(12, 1fr); column-gap: var(--gutter); padding-top: 8vh; padding-bottom: 5vh; }
.ins-a .ins-kicker { grid-column: 1 / -1; color: var(--muted); margin: 0 0 3vh; }
.ins-a .ins-kicker a { color: var(--ink); }
.ins-a .ins-h1 { grid-column: 1 / 12; font-size: var(--fs-mega); line-height: .98; letter-spacing: -0.04em; font-weight: 300; margin: 0; }
.ins-a .ins-head-foot { grid-column: 7 / 12; margin-top: 4vh; }
.ins-a .ins-dek-big { font-size: var(--fs-big-s); line-height: 1.16; letter-spacing: -0.018em; font-weight: 350; margin: 0; }
.ins-b .ins-head { padding-top: 9vh; padding-bottom: 6vh; }
.ins-b .ins-h1 { font-weight: 850; text-transform: uppercase; font-size: clamp(44px, 7vw, 124px); line-height: .86; letter-spacing: -0.035em; max-width: 14ch; margin: 0; }
.ins-b .ins-head .hero-sub { margin-top: 28px; }

/* ---- the live band that replaces the photo */
.ins-band { background: #000; color: #fff; }
.ins-band-anim { width: 100%; height: clamp(360px, 58vh, 640px); }
.ins-band-cap { display: flex; align-items: center; gap: 8px; margin: 0; padding-top: 12px; padding-bottom: 16px; font-size: 15px; }
.ins-b .ins-band-cap i { width: 9px; height: 9px; border-radius: 50%; background: #e4322b; flex: none; }

/* ---- prose */
.ins-prose { max-width: calc(680px + 2 * var(--gutter)); margin-inline: auto; padding-top: 7vh; padding-bottom: 7vh; font-size: 18px; line-height: 1.6; }
.ins-prose > p { margin: 0 0 1.1em; }
.ins-prose a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
.ins-prose a:hover { color: rgb(var(--ins-acc)); }
.ins-b .ins-prose { font-size: 19px; line-height: 1.58; }
.ins-h2 { margin: 0 0 .6em; }
.ins-a .ins-h2 { font-size: var(--fs-big-s); line-height: 1.15; letter-spacing: -0.018em; font-weight: 400; }
.ins-b .ins-h2 { font-weight: 800; text-transform: uppercase; font-size: 28px; line-height: 1; letter-spacing: -0.02em; }
.ins-prose ul { list-style: none; padding: 0; margin: 0 0 1.4em; }
.ins-a .ins-prose li { border-top: 1px solid; padding: 12px 0; }
.ins-a .ins-prose li:last-child { border-bottom: 1px solid; }
.ins-a .ins-prose li strong { display: block; font-weight: 500; }
.ins-b .ins-prose li { position: relative; padding: 12px 0 12px 30px; border-bottom: 1px solid var(--line); }
.ins-b .ins-prose li:first-child { border-top: 1px solid var(--line); }
.ins-b .ins-prose li::before { content: ""; position: absolute; left: 2px; top: 21px; width: 12px; height: 7px; border-left: 2px solid var(--accent); border-bottom: 2px solid var(--accent); transform: rotate(-45deg); }
.ins-b .ins-prose li strong { font-weight: 700; }

/* ---- numbered section markers: the signal runs the hairline and pings */
.ins-mark { display: flex; align-items: center; gap: 14px; margin: 2.8em 0 .8em; }
.ins-n { font-size: 13px; letter-spacing: .06em; color: rgb(var(--ins-acc)); font-variant-numeric: tabular-nums; }
.ins-line { position: relative; flex: 1; height: 1px; background: rgba(0, 0, 0, .16); }
.ins-line::before { content: ""; position: absolute; left: 0; right: 0; top: -.5px; height: 2px; background: linear-gradient(90deg, rgba(var(--ins-acc), .06), rgba(var(--ins-acc), .9)); transform-origin: left; }
.ins-line i { position: absolute; top: 50%; left: 100%; width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px; border-radius: 50%; background: rgb(var(--ins-acc)); box-shadow: 0 0 10px rgba(var(--ins-acc), .7); }
.ins-line i::after { content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 1px solid rgb(var(--ins-acc)); opacity: 0; }
.ins-armed .ins-mark .ins-line::before { transform: scaleX(0); transition: transform .95s cubic-bezier(.2, .8, .2, 1); }
.ins-armed .ins-mark .ins-line i { left: 0; opacity: 0; transition: left .95s cubic-bezier(.2, .8, .2, 1), opacity .2s; }
.ins-armed .ins-mark.in .ins-line::before { transform: scaleX(1); }
.ins-armed .ins-mark.in .ins-line i { left: 100%; opacity: 1; }
.ins-armed .ins-mark.in .ins-line i::after { animation: ins-ping .9s ease-out .95s 2; }
@keyframes ins-ping { from { transform: scale(.6); opacity: .9; } to { transform: scale(4); opacity: 0; } }

/* ---- pull quote (flaps in on scroll-in) */
.ins-pull { margin: 2.4em 0; padding: 0; }
.ins-pull p { margin: 0; }
.ins-a .ins-pull { border-top: 1px solid; border-bottom: 1px solid; padding: .8em 0 .9em; }
.ins-a .ins-pull p { font-size: clamp(26px, 3vw, 42px); line-height: 1.08; letter-spacing: -0.03em; font-weight: 300; }
.ins-b .ins-pull { border-left: 4px solid var(--accent); padding: .15em 0 .15em 22px; }
.ins-b .ins-pull p { font-weight: 850; text-transform: uppercase; font-size: clamp(24px, 2.6vw, 38px); line-height: .98; letter-spacing: -0.02em; }

/* ---- inline figures */
.ins-fig { margin: 2.4em 0 2.6em; }
.ins-stage { position: relative; overflow: hidden; background: #000; color: #fff; }
.ins-fig figcaption { margin-top: 10px; font-size: 15px; line-height: 1.45; color: var(--muted); }
.ins-fig-anim { width: 100%; aspect-ratio: 16 / 9; }

/* lookalike sender (flawless phishing) */
.ins-mail { padding: 22px 26px 24px; font-size: 15px; line-height: 1.5; }
.ins-mail-row { display: grid; grid-template-columns: 72px 1fr; gap: 12px; padding: 9px 0; margin: 0; border-bottom: 1px solid #242428; }
.ins-k { color: #86878e; }
.ins-v { color: #f2f2f2; }
.ins-addr { color: #b9bac0; }
.ins-bad { position: relative; display: inline-block; color: #e4322b; }
.ins-bad::after { content: ""; position: absolute; left: -1px; right: -1px; bottom: -2px; border-bottom: 1.5px solid #e4322b; transition: transform .45s cubic-bezier(.2, .8, .2, 1); transform-origin: left; }
.ins-flag { margin-left: 12px; font-size: 12px; color: #e4322b; white-space: nowrap; transition: opacity .4s .2s; }
.ins-mail-body { margin: 14px 0 0; color: #c7c8ce; }
.ins-armed .ins-look:not(.caught) .ins-bad:not(.flip) { color: inherit; }
.ins-armed .ins-look:not(.caught) .ins-bad::after { transform: scaleX(0); }
.ins-armed .ins-look:not(.caught) .ins-flag { opacity: 0; }

/* the private stack (running your own AI) */
.ins-stackfig .ins-stage { padding: 28px 80px 28px 24px; }
.ins-perim { position: relative; border: 1px solid rgba(255, 255, 255, .34); padding: 38px 20px 16px 56px; }
.ins-perim::after { content: ""; position: absolute; inset: -1px; border: 1px solid #e4322b; opacity: 0; pointer-events: none; }
.ins-perim-label { position: absolute; top: 12px; left: 56px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #86878e; }
.ins-stack { list-style: none; margin: 0; padding: 0; }
.ins-stack li { display: grid; grid-template-columns: 140px 1fr; gap: 14px; padding: 12px 10px; border-top: 1px solid #26262a; align-items: baseline; }
.ins-stack li:last-child { border-bottom: 1px solid #26262a; }
.ins-stack b { font-weight: 500; color: #f2f2f2; }
.ins-stack span { color: #9a9ba2; font-size: 14px; line-height: 1.35; }
.ins-track { position: absolute; left: 28px; top: 38px; bottom: 16px; width: 1px; background: rgba(255, 255, 255, .18); }
.ins-signal { position: absolute; left: 50%; top: 0; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: rgb(var(--ins-acc-dark)); box-shadow: 0 0 12px rgba(var(--ins-acc-dark), .9); }
.ins-probe { position: absolute; right: 24px; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: #e4322b; opacity: 0; }
.ins-stackfig.in.run .ins-signal { animation: ins-sig 6s cubic-bezier(.45, 0, .55, 1) infinite; }
.ins-stackfig.in.run .ins-probe { animation: ins-probe 6s linear infinite; }
.ins-stackfig.in.run .ins-perim::after { animation: ins-hit 6s linear infinite; }
@keyframes ins-sig { 0% { top: 0%; } 40% { top: 100%; } 50% { top: 100%; } 90% { top: 0%; } 100% { top: 0%; } }
@keyframes ins-probe { 0%, 56% { transform: translateX(0); opacity: 0; } 60% { opacity: 1; } 71% { transform: translateX(-52px); opacity: 1; } 82% { transform: translateX(-22px); opacity: 0; } 100% { opacity: 0; } }
@keyframes ins-hit { 0%, 70% { opacity: 0; } 72% { opacity: 1; } 86%, 100% { opacity: 0; } }
@keyframes ins-l1 {
  0%, 2.0%, 11.0%, 82.0%, 91.0%, 100% { background-color: transparent; }
  5.0%, 85.0% { background-color: rgba(var(--ins-acc-dark), .16); }
}
.ins-stackfig.in.run .ins-stack li:nth-child(1) { animation: ins-l1 6s linear infinite; }
@keyframes ins-l2 {
  0%, 12.0%, 21.0%, 72.0%, 81.0%, 100% { background-color: transparent; }
  15.0%, 75.0% { background-color: rgba(var(--ins-acc-dark), .16); }
}
.ins-stackfig.in.run .ins-stack li:nth-child(2) { animation: ins-l2 6s linear infinite; }
@keyframes ins-l3 {
  0%, 22.0%, 31.0%, 62.0%, 71.0%, 100% { background-color: transparent; }
  25.0%, 65.0% { background-color: rgba(var(--ins-acc-dark), .16); }
}
.ins-stackfig.in.run .ins-stack li:nth-child(3) { animation: ins-l3 6s linear infinite; }
@keyframes ins-l4 {
  0%, 32.0%, 41.0%, 52.0%, 61.0%, 100% { background-color: transparent; }
  35.0%, 55.0% { background-color: rgba(var(--ins-acc-dark), .16); }
}
.ins-stackfig.in.run .ins-stack li:nth-child(4) { animation: ins-l4 6s linear infinite; }

/* ---- related service on B articles: the live animation instead of the photo */
.ins-related .svc-row-img { background: #000; }
.ins-related .svc-row-img img { visibility: hidden; }
.ins-related .row-anim { opacity: 1; }

/* ---- small screens */
@media (max-width: 960px) {
  .ins-cards { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .ins-a .ins-link { grid-template-columns: 1fr; row-gap: 12px; }
  .ins-a .ins-thumb, .ins-a .ins-text, .ins-a .ins-meta { grid-column: 1; }
  .ins-a .ins-meta { flex-direction: row; flex-wrap: wrap; gap: 4px 14px; padding-top: 0; }
  .ins-a .ins-head { grid-template-columns: 1fr; }
  .ins-a .ins-h1, .ins-a .ins-head-foot, .ins-a .ins-kicker { grid-column: 1; }
  .ins-band-anim { height: auto; aspect-ratio: 4 / 5; }
  .ins-prose { font-size: 17px; }
  .ins-mail { padding: 16px; font-size: 14px; }
  .ins-mail-row { grid-template-columns: 58px 1fr; }
  .ins-addr { display: block; white-space: nowrap; }
  .ins-flag { display: block; margin: 4px 0 0; }
  .ins-stackfig .ins-stage { padding: 18px 44px 18px 14px; }
  .ins-perim { padding: 34px 12px 12px 40px; }
  .ins-perim-label { left: 40px; }
  .ins-track { left: 20px; top: 34px; bottom: 12px; }
  .ins-stack li { grid-template-columns: 1fr; gap: 2px; }
  .ins-probe { right: 12px; }
  @keyframes ins-probe { 0%, 56% { transform: translateX(0); opacity: 0; } 60% { opacity: 1; } 71% { transform: translateX(-28px); opacity: 1; } 82% { transform: translateX(-10px); opacity: 0; } 100% { opacity: 0; } }
}
@media (prefers-reduced-motion: reduce) {
  .ins-stackfig .ins-signal, .ins-stackfig .ins-probe, .ins-stackfig .ins-perim::after, .ins-stack li { animation: none !important; }
}

/* the end-of-line ping may reach past the gutter on phones: never let it widen the page */
[data-ins] { overflow-x: clip; }