/* Homepage redesign ("Evidence in motion"). Scoped to body.home so the topbar,
   the security pages and the legal pages are untouched. Spec:
   docs/website/2026-11-01-redesign-dev-prompt.md */

body.home {
  background: var(--brand-ink-900);
}

/* The section surfaces now carry the page colour; the old JS-positioned
   atmosphere is only used by the matrix view. */
body.home:not(.matrix-mode) #pageFlow { display: none; }

/* Content is visible by default; it only animates in when motion is allowed. */
body.home main .reveal { opacity: 1; transform: none; }
html.js-motion body.home main .reveal:not(.in-view) { opacity: 0; transform: translateY(16px); }
html.js-motion body.home main .reveal { transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out); transition-delay: var(--reveal-delay, 0ms); }

body.home .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Anchor targets clear the fixed topbar (WCAG 2.4.11). */
body.home main [id] { scroll-margin-top: calc(var(--nav-h, 5.5rem) + 1rem); }

/* ── Shared layout and type ───────────────────────────── */
body.home main .home-container {
  width: 100%;
  max-width: calc(var(--brand-container) + 2 * var(--brand-gutter));
  margin: 0 auto;
  padding: 0 var(--brand-gutter);
}
body.home main .home-section { position: relative; padding: var(--brand-section-y) 0; }
body.home main .home-section--ink { background: var(--brand-ink-900); color: var(--brand-ink-200); }
body.home main .home-section--paper { background: var(--brand-paper); color: var(--brand-ink-body); }
body.home main .home-section--paper-2 { background: var(--brand-paper-2); color: var(--brand-ink-body); }

body.home main .home-eyebrow {
  margin: 0 0 var(--space-4);
  font: 700 var(--fs-eyebrow)/1.6 var(--marketing-body);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--brand-teal-text);
}
body.home main .home-section--ink .home-eyebrow,
body.home main .home-hero .home-eyebrow { color: var(--brand-cyan-300); }

body.home main .home-h2 {
  margin: 0 0 var(--space-4);
  font-family: var(--marketing-display);
  font-size: var(--fs-h2);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.035em;
  color: var(--brand-ink-text);
}
body.home main .home-section--ink .home-h2 { color: var(--brand-ink-50); }

body.home main .home-lead {
  margin: 0;
  max-width: 34rem;
  font: 400 var(--fs-lead)/1.6 var(--marketing-body);
  color: var(--brand-ink-body);
}
body.home main .home-section--ink .home-lead,
body.home main .home-hero .home-lead { color: var(--brand-ink-200); }

/* Signature transition: a thin cyan scan line on every ink/paper edge. */
body.home main .home-scanline {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--brand-cyan-400) 30%, var(--brand-cyan-300) 50%, var(--brand-cyan-400) 70%, transparent);
  box-shadow: 0 0 24px 2px rgba(34,211,238,.35);
  pointer-events: none;
  z-index: 2;
}
body.home main .home-scanline--top { top: 0; }
body.home main .home-scanline--bottom { bottom: 0; }

/* Secondary button on ink */
body.home main .home-btn-ghost-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 48px;
  padding: 1rem 1.85rem;
  border-radius: var(--r-pill);
  border: 1px solid rgba(240,249,255,.35);
  background: transparent;
  color: var(--brand-ink-50);
  font: 600 .95rem/1.6 var(--marketing-body);
  text-decoration: none;
  transition: background var(--dur-1), border-color var(--dur-1), transform var(--dur-1);
}
body.home main .home-btn-ghost-dark:hover { background: rgba(255,255,255,.06); border-color: rgba(240,249,255,.6); color: #fff; transform: translateY(-2px); }
body.home main .home-btn-ghost-dark:focus-visible,
body.home main .home-hero .hero-cta:focus-visible,
body.home main .home-section--ink a:focus-visible,
body.home main .home-section--ink button:focus-visible { outline: 3px solid #b3e5ff; outline-offset: 4px; }
body.home main .hero-cta { min-height: 48px; }

/* ── Product scene components (ui-*) ───────────────────── */
body.home main .ui-frame,
body.home main .ui-card {
  background: var(--brand-ui-frame);
  color: var(--brand-ink-200);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-frame);
  font: 400 var(--fs-ui)/1.45 var(--marketing-body);
  font-variant-numeric: tabular-nums;
}
body.home main .ui-card { border-radius: var(--r-sm); padding: 14px; }
body.home main .ui-frame__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 36px;
  padding: 0 12px;
  border-bottom: 1px solid var(--brand-line-dark);
}
body.home main .ui-dots { display: inline-flex; gap: 5px; }
body.home main .ui-dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.18); }
body.home main .ui-frame__title { flex: 1; font-weight: 600; color: var(--brand-ink-50); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.home main .ui-frame__body { padding: 6px 14px 12px; }
body.home main .ui-row {
  display: grid;
  grid-template-columns: minmax(7.5rem, 1fr) 2fr auto;
  align-items: center;
  gap: 12px;
  min-height: 40px;
  border-bottom: 1px solid var(--brand-line-dark);
}
body.home main .ui-row:last-child { border-bottom: 0; }
body.home main .ui-row__label { color: var(--brand-ink-50); white-space: nowrap; }
body.home main .ui-row__meta { min-width: 4.2rem; text-align: right; font-size: 11px; color: var(--brand-ink-300); }
body.home main .ui-bar { display: flex; height: 6px; border-radius: var(--r-pill); overflow: hidden; background: rgba(255,255,255,.06); }
body.home main .ui-bar i { display: block; height: 100%; width: var(--w); transition: width var(--dur-4) var(--ease-out); }
body.home main .ui-bar .p { background: var(--ui-pass); }
body.home main .ui-bar .w { background: var(--ui-warn); }
body.home main .ui-bar .f { background: var(--ui-fail); }
body.home main .ui-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 9px;
  border-radius: var(--r-pill);
  font: 700 11px/1 var(--marketing-body);
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
body.home main .ui-chip--pass { background: rgba(52,211,153,.14); color: var(--ui-pass); }
body.home main .ui-chip--warn { background: rgba(251,191,36,.14); color: var(--ui-warn); }
body.home main .ui-chip--fail { background: rgba(251,113,133,.14); color: #fda4af; }
body.home main .ui-chip--info { background: rgba(103,232,249,.14); color: var(--ui-info); }
body.home main .ui-chip--neutral { background: rgba(255,255,255,.07); color: var(--brand-ink-200); }
body.home main .ui-label {
  font: 500 11px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .02em;
  color: var(--brand-ink-300);
}
body.home main .ui-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; color: var(--brand-ink-300); font-size: 11px; }
body.home main .ui-card__title { margin: 0 0 4px; font-weight: 600; font-size: .875rem; line-height: 1.35; color: var(--brand-ink-50); }
body.home main .ui-card__sub { margin: 0; font-size: 11px; color: var(--brand-ink-300); }
body.home main .ui-owner { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: 11px; color: var(--brand-ink-200); }
body.home main .ui-avatar {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(103,232,249,.16);
  color: var(--brand-cyan-300);
  font: 700 10px/1 var(--marketing-body);
}

/* ── C1 Hero ──────────────────────────────────────────── */
body.home main .home-hero {
  position: relative;
  overflow: clip;
  min-height: min(100svh, 920px);
  padding: calc(var(--nav-h, 5.5rem) + 3rem) 0 4.5rem;
  background: var(--brand-ink-950);
  color: var(--brand-ink-200);
}
body.home main .home-hero__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(60% 55% at 72% 46%, rgba(34,211,238,.14), transparent 70%),
    radial-gradient(40% 40% at 10% 0%, rgba(8,145,178,.12), transparent 70%);
}
/* Faint dot grid, faded out towards the edges */
body.home main .home-hero__bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 1px 1px, rgba(148,197,216,.9) 1px, transparent 1.5px) 0 0 / 24px 24px;
  opacity: .08;
  -webkit-mask-image: radial-gradient(70% 75% at 62% 45%, #000 30%, transparent 100%);
  mask-image: radial-gradient(70% 75% at 62% 45%, #000 30%, transparent 100%);
}
body.home main .home-hero__grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(1rem, 2vw, 2rem);
  row-gap: var(--space-12);
  align-items: center;
}
body.home main .home-hero__copy { grid-column: 1 / span 5; }
body.home main .home-hero__scene { grid-column: 6 / span 7; margin: 0 -40px 0 0; }
body.home main .home-hero h1 {
  margin: 0 0 var(--space-6);
  max-width: 11em;
  font-family: var(--marketing-display);
  font-size: var(--fs-display);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.045em;
  color: var(--brand-ink-50);
  text-wrap: balance;
}
body.home main .home-hero__ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); margin: var(--space-8) 0 var(--space-6); }
body.home main .home-hero__facts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-6);
  margin: 0;
  padding: 0;
  list-style: none;
  font: 500 var(--fs-small)/1.5 var(--marketing-body);
  color: var(--brand-ink-300);
}
body.home main .home-hero__facts li { display: inline-flex; align-items: center; gap: var(--space-2); }
body.home main .home-hero__facts svg { width: 16px; height: 16px; flex: none; color: var(--brand-cyan-400); }

/* Scene: layered product composition */
body.home main .scene-stage { position: relative; aspect-ratio: 1.2; }
body.home main .scene-overview { position: absolute; top: 8%; right: 0; width: 86%; }
body.home main .scene-finding { position: absolute; left: 0; top: 58%; width: 47%; }
body.home main .scene-task { position: absolute; right: 6%; top: 66%; width: 44%; }
body.home main .scene-proof { position: absolute; left: 8%; bottom: 0; box-shadow: 0 12px 32px -12px rgba(0,0,0,.6), 0 0 0 1px rgba(52,211,153,.28); background: #0d3a3a; height: 30px; padding: 0 12px; }
body.home main .scene-orben {
  position: absolute;
  top: 0;
  left: 4%;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px 5px 5px;
  border-radius: var(--r-pill);
  background: rgba(11,42,59,.92);
  box-shadow: 0 12px 32px -12px rgba(0,0,0,.6), 0 0 0 1px rgba(103,232,249,.28);
  font: 500 12px/1.3 var(--marketing-body);
  color: var(--brand-ink-50);
  white-space: nowrap;
}
body.home main .scene-orben img { width: 24px; height: 24px; border-radius: 50%; }
body.home main .scene-link { position: absolute; left: 44%; top: 70%; width: 14%; height: 12%; overflow: visible; pointer-events: none; }
body.home main .scene-link path { fill: none; stroke: var(--brand-cyan-400); stroke-width: 1.5; stroke-dasharray: 4 4; }
body.home main .home-hero__scene .ui-label { position: absolute; right: 0; top: 0; }
body.home main .scene-figure { position: relative; padding-top: 1.5rem; }
body.home main .scene-row-security .is-after { display: none; }

/* Step states. Static default is step 3: everything visible. */
body.home main .scene-figure[data-step="1"] .scene-task,
body.home main .scene-figure[data-step="1"] .scene-link,
body.home main .scene-figure[data-step="1"] .scene-proof,
body.home main .scene-figure[data-step="2"] .scene-proof { opacity: 0; transform: translateY(12px); }
body.home main .scene-figure[data-step="1"] .scene-finding { box-shadow: var(--shadow-frame), 0 0 0 1px rgba(251,113,133,.55); }
body.home main .scene-figure[data-step="2"] .scene-task { box-shadow: var(--shadow-frame), 0 0 0 1px rgba(103,232,249,.55); }
body.home main .scene-figure[data-step="3"] .scene-row-security .f { --w: 0% !important; }
body.home main .scene-figure[data-step="3"] .scene-row-security .p { --w: 82% !important; }
body.home main .scene-figure[data-step="3"] .scene-row-security .is-before { display: none; }
body.home main .scene-figure[data-step="3"] .scene-row-security .is-after { display: inline; }
body.home main .scene-figure[data-step="3"] .scene-finding { opacity: .72; }
html.js-motion body.home main .scene-finding,
html.js-motion body.home main .scene-task,
html.js-motion body.home main .scene-link,
html.js-motion body.home main .scene-proof { transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out), box-shadow var(--dur-3); }

/* One-time load sweep across the scene */
body.home main .scene-sweep { display: none; }
html.js-motion body.home main .scene-sweep {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 2px;
  background: linear-gradient(180deg, transparent, var(--brand-cyan-300), transparent);
  box-shadow: 0 0 18px 3px rgba(34,211,238,.45);
  opacity: 0;
  pointer-events: none;
  animation: home-sweep 1200ms var(--ease-in-out) 300ms 1 both;
}
@keyframes home-sweep {
  0% { transform: translateX(0); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateX(var(--sweep-x, 640px)); opacity: 0; }
}
html.js-motion body.home main .scene-layer { animation: home-layer-in var(--dur-3) var(--ease-out) backwards; animation-delay: var(--d, 0ms); }
@keyframes home-layer-in { from { opacity: 0; transform: translateY(12px); } }

/* Scene controls: tabs + pause. Only shown when motion is allowed. */
body.home main .scene-controls { display: none; }
html.js-motion body.home main .scene-controls {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-top: var(--space-6);
}
body.home main .scene-tabs { display: flex; flex: 1; gap: var(--space-2); }
body.home main .scene-tab {
  position: relative;
  flex: 1;
  min-height: 44px;
  padding: 0 0 10px;
  border: 0;
  background: none;
  text-align: left;
  font: 600 .875rem/1.4 var(--marketing-body);
  color: var(--brand-ink-300);
  cursor: pointer;
}
body.home main .scene-tab span { color: var(--brand-cyan-300); margin-right: 6px; font-variant-numeric: tabular-nums; }
body.home main .scene-tab::before,
body.home main .scene-tab::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  border-radius: 2px;
  background: var(--brand-line-dark);
}
body.home main .scene-tab::after { right: auto; width: 0; background: var(--brand-cyan-400); }
body.home main .scene-tab[aria-selected="true"] { color: var(--brand-ink-50); }
body.home main .scene-tab[aria-selected="true"]::after { width: var(--progress, 100%); }
body.home main .scene-tab:focus-visible { outline: 3px solid #b3e5ff; outline-offset: 4px; border-radius: 4px; }
body.home main .scene-pause {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: 50%;
  border: 1px solid var(--brand-line-dark);
  background: rgba(255,255,255,.04);
  color: var(--brand-ink-50);
  cursor: pointer;
}
body.home main .scene-pause:hover { background: rgba(255,255,255,.09); }
body.home main .scene-pause svg { width: 16px; height: 16px; }
body.home main .scene-pause .icon-play { display: none; }
body.home main .scene-pause[aria-pressed="true"] .icon-play { display: block; }
body.home main .scene-pause[aria-pressed="true"] .icon-pause { display: none; }

/* ── C2 Proof strip ───────────────────────────────────── */
body.home main .home-proof {
  position: relative;
  padding: var(--space-12) 0 var(--space-16);
  background: var(--brand-ink-950);
  color: var(--brand-ink-200);
}
body.home main .home-proof__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-8);
  margin: 0;
  padding: var(--space-8) 0 0;
  list-style: none;
  border-top: 1px solid var(--brand-line-dark);
}
body.home main .home-proof__item svg { width: 20px; height: 20px; color: var(--brand-cyan-300); margin-bottom: var(--space-3); }
body.home main .home-proof__item strong { display: block; margin-bottom: var(--space-1); font: 600 1rem/1.4 var(--marketing-display); color: var(--brand-ink-50); }
body.home main .home-proof__item p { margin: 0; font: 400 var(--fs-small)/1.55 var(--marketing-body); color: var(--brand-ink-300); }
body.home main .home-proof__item a { color: var(--brand-cyan-300); font-weight: 600; text-decoration: none; }
body.home main .home-proof__item a:hover { text-decoration: underline; }

/* ── C3 The governance loop ───────────────────────────── */
body.home main .home-loop__head { max-width: 46rem; margin-bottom: var(--space-12); }
body.home main .home-loop__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}
body.home main .loop-chapter__num {
  margin: 0 0 var(--space-2);
  font: 700 var(--fs-eyebrow)/1.6 var(--marketing-body);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--brand-ink-muted);
}
body.home main .loop-chapter__num span { color: var(--brand-teal-text); margin-right: .35em; font-variant-numeric: tabular-nums; }
body.home main .loop-chapter h3 {
  margin: 0 0 var(--space-3);
  font: 800 var(--fs-h3)/1.25 var(--marketing-display);
  letter-spacing: -.015em;
  color: var(--brand-ink-text);
}
body.home main .loop-chapter p:not(.loop-chapter__num) { margin: 0; max-width: 34rem; font: 400 var(--fs-body)/1.65 var(--marketing-body); color: var(--brand-ink-body); }
body.home main .loop-scene { position: relative; margin: 0 0 var(--space-8); padding-top: 1.5rem; }
body.home main .loop-scene > .ui-label { position: absolute; top: 0; right: 0; color: var(--brand-ink-muted); }
body.home main .loop-scene .ui-frame { box-shadow: 0 40px 100px -40px rgba(8,38,54,.55), 0 0 0 1px rgba(8,38,54,.1), inset 0 1px 0 rgba(255,255,255,.06); }
body.home main .loop-scene .ui-card { margin-top: var(--space-4); box-shadow: 0 30px 80px -36px rgba(8,38,54,.6), 0 0 0 1px rgba(8,38,54,.1); }
body.home main .ui-finding {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--brand-line-dark);
}
body.home main .ui-finding:last-child { border-bottom: 0; }
body.home main .ui-finding .ui-chip { margin-top: 1px; min-width: 4.5rem; justify-content: center; }
body.home main .ui-finding strong { display: block; color: var(--brand-ink-50); font-weight: 600; font-size: .875rem; }
body.home main .ui-finding small { display: block; margin-top: 2px; color: var(--brand-ink-300); font-size: 11px; }
body.home main .loop-orben .ui-card__meta img { width: 20px; height: 20px; border-radius: 50%; }
body.home main .loop-cites { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
body.home main .loop-cites .ui-chip { text-transform: none; letter-spacing: 0; font-weight: 600; }
body.home main .loop-task { padding-top: 14px; padding-bottom: 16px; }
body.home main .ui-timeline { margin: 0; list-style: none; }
body.home main .ui-timeline li {
  display: grid;
  grid-template-columns: 3.5rem auto 1fr;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  border-bottom: 1px solid var(--brand-line-dark);
  color: var(--brand-ink-50);
}
body.home main .ui-timeline li:last-child { border-bottom: 0; }
body.home main .ui-timeline__date { color: var(--brand-ink-300); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; }
body.home main .loop-mail__rows { display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; color: var(--brand-ink-200); }
body.home main .loop-mail__rows .is-better { color: var(--ui-pass); font-weight: 600; }
body.home main .home-loop__foot { margin: var(--space-8) 0 0; padding-top: var(--space-6); border-top: 1px solid var(--brand-line-light); color: var(--brand-ink-body); }
body.home main .home-loop__foot a { color: #08657b; font-weight: 600; text-decoration: none; }
body.home main .home-loop__foot a:hover { text-decoration: underline; }
body.home main .home-loop__foot a:focus-visible { outline: 3px solid #08657b; outline-offset: 3px; }

/* Desktop with JS: chapters on the left, one sticky scene on the right that
   follows the chapter in view. Without JS the chapters and scenes simply
   alternate, so nothing is ever hidden. */
@media (min-width: 1024px) {
  html.js-loop body.home main .home-loop__grid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-flow: dense;
    column-gap: clamp(1rem, 2vw, 2rem);
    row-gap: 0;
  }
  html.js-loop body.home main .loop-chapter {
    grid-column: 1 / span 5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 52vh;
    padding: var(--space-8) 0;
  }
  /* Inactive chapters are dimmed by colour, not opacity, so text keeps 4.5:1. */
  html.js-loop body.home main .loop-chapter :is(h3, p) { transition: color var(--dur-3) var(--ease-out); }
  html.js-loop body.home main .loop-chapter:not(.is-active) :is(h3, p, .loop-chapter__num span) { color: var(--brand-ink-muted); }
  html.js-loop body.home main .loop-chapter:first-of-type { min-height: 40vh; }
  html.js-loop body.home main .loop-scene {
    grid-column: 7 / span 6;
    grid-row: 1 / span 4;
    align-self: start;
    position: sticky;
    /* Roughly centred in the viewport, next to the chapter being read */
    top: max(calc(var(--nav-h, 5.5rem) + 2rem), calc(50vh - 13rem));
    margin: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out), visibility 0s linear var(--dur-3);
  }
  html.js-loop body.home main .loop-scene.is-active {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out), visibility 0s;
  }
}
@media (prefers-reduced-motion: reduce) {
  html.js-loop body.home main .loop-chapter,
  html.js-loop body.home main .loop-scene { transition: none; transform: none; }
}

/* ── C5 Orben ─────────────────────────────────────────── */
body.home main .home-orben { overflow: clip; background: var(--brand-ink-950); }
body.home main .home-orben__aura {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(38% 46% at 20% 30%, rgba(34,211,238,.10), transparent 70%),
    radial-gradient(40% 50% at 78% 60%, rgba(8,145,178,.12), transparent 72%);
}
body.home main .home-orben__grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(1rem, 2vw, 2rem);
  row-gap: var(--space-12);
  align-items: start;
}
body.home main .home-orben__copy { grid-column: 1 / span 5; }
body.home main .home-orben__console { grid-column: 6 / span 7; }
body.home main .home-orben__id { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
body.home main .home-orben__avatar { position: relative; display: inline-grid; place-items: center; width: 120px; height: 120px; flex: none; }
body.home main .home-orben__avatar img {
  position: relative;
  z-index: 1;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(103,232,249,.35), 0 0 48px 6px rgba(34,211,238,.22);
}
body.home main .home-orben__avatar svg { position: absolute; inset: 0; width: 100%; height: 100%; }
body.home main .home-orben__avatar circle { fill: none; stroke: var(--brand-line-dark); stroke-width: 1; }
body.home main .home-orben__avatar circle:first-child { stroke: rgba(103,232,249,.32); }
html.js-motion body.home main .home-orben__avatar svg { animation: home-orbit 40s linear infinite; }
@keyframes home-orbit { to { transform: rotate(360deg); } }
body.home main .home-orben__avatar circle:nth-child(2) { stroke-dasharray: 2 6; }
body.home main .home-orben__label {
  font: 700 var(--fs-eyebrow)/1.6 var(--marketing-body);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--brand-cyan-300);
}
body.home main .home-orben .home-h2 { text-wrap: balance; }
body.home main .home-orben__principles { display: grid; gap: var(--space-4); margin: var(--space-8) 0 0; padding: 0; list-style: none; }
body.home main .home-orben__principles li { display: flex; gap: var(--space-3); color: var(--brand-ink-300); font: 400 var(--fs-small)/1.55 var(--marketing-body); }
body.home main .home-orben__principles svg { width: 20px; height: 20px; flex: none; margin-top: 1px; color: var(--brand-cyan-300); }
body.home main .home-orben__principles strong { display: block; margin-bottom: 2px; color: var(--brand-ink-50); font: 600 1rem/1.4 var(--marketing-display); }
body.home main .home-orben__foot { display: grid; gap: var(--space-2); margin: var(--space-8) 0 0; font-size: var(--fs-small); color: var(--brand-ink-300); }
body.home main .home-orben__foot a { color: var(--brand-cyan-300); font-weight: 600; text-decoration: none; }
body.home main .home-orben__foot a:hover { text-decoration: underline; }

/* Console: restyles the existing Orben demo (ids and state classes unchanged) */
body.home main .home-orben__console.orben-demo { margin: 0; padding: 0; border: 0; background: none; border-radius: 0; }
body.home main .home-orben__console .ui-frame { box-shadow: var(--shadow-frame), 0 0 80px -20px rgba(34,211,238,.18); }
body.home main .home-orben__console .ui-frame__bar .ui-label { margin-left: auto; white-space: nowrap; }
body.home main .home-orben__console .ui-frame__body { padding: 18px; }
body.home main .home-orben__console .orben-demo-head { max-width: none; }
body.home main .home-orben__console .orben-ask {
  min-height: 44px;
  padding: .6rem 1.1rem;
  border-color: rgba(103,232,249,.45);
  background: rgba(8,145,178,.16);
  font: 700 1rem/1.3 var(--marketing-display);
}
body.home main .home-orben__console .orben-replay { min-height: 44px; padding: .45rem 1rem; color: var(--brand-ink-200); }
body.home main .home-orben__console .orben-demo-note { color: var(--brand-ink-300); font-size: .8125rem; }
body.home main .home-orben__console .orben-finding {
  grid-template-columns: 4.5rem auto minmax(0, 1fr);
  padding: .75rem .9rem;
  border-radius: var(--r-sm);
  background: rgba(255,255,255,.03);
  border: 1px solid var(--brand-line-dark);
}
body.home main .home-orben__console .orben-finding .ui-chip { min-width: 4.5rem; justify-content: center; }
body.home main .home-orben__console .orben-finding-body strong { font-size: .875rem; font-weight: 600; color: var(--brand-ink-50); }
body.home main .home-orben__console .orben-finding-body span { font-size: 11px; color: var(--brand-ink-300); }
body.home main .home-orben__console .orben-rank-label { color: var(--brand-cyan-300); }
body.home main .home-orben__console .orben-answer {
  min-height: 0;
  border-radius: var(--r-sm);
  background: rgba(8,145,178,.10);
  border-color: rgba(103,232,249,.26);
}
body.home main .home-orben__console .orben-answer-label { display: flex; align-items: center; gap: 8px; margin-bottom: .6rem; color: var(--brand-cyan-300); }
body.home main .home-orben__console .orben-answer-label img { width: 20px; height: 20px; border-radius: 50%; }
body.home main .home-orben__console .orben-answer-text { font-size: .9375rem; line-height: 1.6; }
body.home main .home-orben__console .orben-cites li { background: rgba(4,22,32,.6); color: var(--brand-ink-300); font-size: .75rem; border-left: 2px solid var(--brand-line-dark); border-radius: 4px; }
body.home main .home-orben__console .orben-cites li.is-used { color: var(--brand-ink-50); border-left-color: var(--brand-cyan-400); }
body.home main .home-orben__console .orben-answer-limit { color: var(--brand-ink-300); }

/* The answer appears word by word once Orben has ranked the findings. */
html.js-motion body.home main .home-orben__console.is-answered .ow { animation: home-word-in 260ms var(--ease-out) backwards; animation-delay: calc(var(--i) * 60ms); }
@keyframes home-word-in { from { opacity: 0; } }
html.js-motion body.home main .home-orben__console.is-answered .orben-cites li { animation: home-layer-in var(--dur-3) var(--ease-out) backwards; animation-delay: calc(var(--words, 30) * 60ms + var(--n, 0) * 120ms); }

@media (max-width: 1023px) {
  body.home main .home-orben__copy,
  body.home main .home-orben__console { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  body.home main .home-orben__avatar { width: 96px; height: 96px; }
  body.home main .home-orben__avatar img { width: 60px; height: 60px; }
  /* Keep the illustrative label visible: it wraps under the title on phones */
  body.home main .home-orben__console .ui-frame__bar { height: auto; flex-wrap: wrap; row-gap: 2px; padding: 8px 12px; }
  body.home main .home-orben__console .ui-frame__bar .ui-label { flex-basis: 100%; margin-left: 0; white-space: normal; }
  body.home main .home-orben__console .orben-finding { grid-template-columns: auto minmax(0, 1fr); }
  body.home main .home-orben__console .orben-finding .ui-chip { grid-column: 2; grid-row: 1; justify-self: start; min-width: 0; }
  body.home main .home-orben__console .orben-finding .orben-rank { grid-row: 1 / span 2; }
  body.home main .home-orben__console .orben-finding-body { grid-column: 2; }
}

/* ── Shared: light cards on paper ─────────────────────── */
body.home main .cover-tile,
body.home main .role-card,
body.home main .home-news .release-card {
  position: relative;
  padding: var(--space-6);
  border-radius: var(--r-lg);
  background: var(--brand-white);
  border: 1px solid var(--brand-line-light);
  box-shadow: var(--shadow-card-light);
  transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), border-color var(--dur-2);
}
body.home main .cover-tile h3,
body.home main .role-card h3,
body.home main .home-news .release-card h3 {
  margin: 0 0 var(--space-2);
  font: 700 1.0625rem/1.35 var(--marketing-display);
  letter-spacing: -.01em;
  color: var(--brand-ink-text);
}
body.home main .cover-tile p,
body.home main .role-card p,
body.home main .home-news .release-card p { margin: 0; font: 400 .9375rem/1.6 var(--marketing-body); color: var(--brand-ink-body); }

/* ── C4 Coverage ─────────────────────────────────────── */
body.home main .home-cover__head { max-width: 46rem; margin-bottom: var(--space-12); }
body.home main .cover-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
  margin: 0;
  padding: 0;
  list-style: none;
}
body.home main .cover-tile svg { width: 24px; height: 24px; margin-bottom: var(--space-4); color: var(--brand-cyan-600); }
body.home main .cover-tile:hover { transform: translateY(-2px); border-color: rgba(8,145,178,.45); }

/* ── C6 Roles ────────────────────────────────────────── */
body.home main .home-roles__head { max-width: 46rem; margin-bottom: var(--space-12); }
body.home main .role-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
  margin: 0;
  padding: 0;
  list-style: none;
}
body.home main .role-card { padding: var(--space-8) var(--space-6); }
body.home main .role-card .ui-label { display: block; margin-bottom: var(--space-4); color: var(--brand-teal-text); text-transform: uppercase; letter-spacing: .12em; }

/* ── C7 Built to be audited ──────────────────────────── */
body.home main .home-audit { background: var(--brand-ink-900); }
body.home main .home-audit__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(1rem, 2vw, 2rem);
  row-gap: var(--space-12);
  align-items: start;
}
body.home main .home-audit__head { grid-column: 1 / span 5; }
body.home main .audit-grid {
  grid-column: 7 / span 6;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-8) var(--space-6);
  margin: 0;
  padding: 0;
  list-style: none;
}
body.home main .audit-item { padding-top: var(--space-4); border-top: 1px solid var(--brand-line-dark); }
body.home main .audit-item h3 { margin: 0 0 var(--space-2); font: 600 1.0625rem/1.35 var(--marketing-display); color: var(--brand-ink-50); }
body.home main .audit-item p { margin: 0 0 var(--space-3); font: 400 var(--fs-small)/1.55 var(--marketing-body); color: var(--brand-ink-300); }
body.home main .audit-item a { color: var(--brand-cyan-300); font: 600 var(--fs-small)/1.5 var(--marketing-body); text-decoration: none; }
body.home main .audit-item a:hover { text-decoration: underline; }

/* ── C8 What's new ───────────────────────────────────── */
body.home main .home-news__head { max-width: 46rem; margin-bottom: var(--space-12); }
body.home main .home-news .whats-new-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
  max-width: none;
  margin: 0;
  padding: 0;
}
body.home main .home-news .release-card { display: flex; flex-direction: column; gap: var(--space-2); backdrop-filter: none; }
body.home main .home-news .release-card::before,
body.home main .home-news .release-card::after { content: none; }
body.home main .home-news .release-card.is-featured { grid-column: auto; border-color: rgba(8,145,178,.45); }
body.home main .home-news .release-meta { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-2); }
body.home main .home-news .release-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: var(--r-pill);
  background: rgba(8,145,178,.1);
  border: 0;
  color: #08657b;
  font: 700 11px/1.5 var(--marketing-body);
  letter-spacing: .06em;
  text-transform: uppercase;
}
body.home main .home-news .release-tag svg { width: 14px; height: 14px; }
body.home main .home-news .release-new { padding: 3px 9px; border-radius: var(--r-pill); background: var(--brand-ink-900); color: var(--brand-cyan-300); font: 700 11px/1.5 var(--marketing-body); }
body.home main .home-news .release-date { margin-left: auto; font: 500 .8125rem/1.5 var(--marketing-body); color: var(--brand-ink-muted); }
body.home main .home-news .release-link { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: var(--space-3); color: #08657b; font: 600 var(--fs-small)/1.5 var(--marketing-body); text-decoration: none; }
body.home main .home-news .release-link svg { width: 16px; height: 16px; }
body.home main .home-news .release-link:hover { text-decoration: underline; }

/* ── C10 Cookies & privacy (compact; text unchanged) ─── */
body.home main .home-privacy { padding: var(--space-16) 0; }
body.home main .home-privacy__title { margin: 0 0 var(--space-3); font: 800 var(--fs-h3)/1.25 var(--marketing-display); color: var(--brand-ink-text); }
body.home main .home-privacy__lead { max-width: 60rem; margin: 0 0 var(--space-8); font: 400 var(--fs-small)/1.6 var(--marketing-body); color: var(--brand-ink-body); }
body.home main .home-privacy__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-6);
  margin: 0;
  padding: var(--space-6) 0 0;
  list-style: none;
  border-top: 1px solid var(--brand-line-light);
}
body.home main .home-privacy__list h3 { margin: 0 0 var(--space-2); font: 700 .9375rem/1.4 var(--marketing-display); color: var(--brand-ink-text); }
body.home main .home-privacy__list p { margin: 0; font: 400 .8125rem/1.55 var(--marketing-body); color: var(--brand-ink-body); }
body.home main .home-privacy code { font-size: .78rem; padding: 1px 4px; border-radius: 4px; background: rgba(8,38,54,.06); color: var(--brand-ink-text); }
body.home main .home-privacy__foot { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-6); margin: var(--space-8) 0 0; font-size: .8125rem; color: var(--brand-ink-muted); }
body.home main .home-privacy a,
body.home main .home-cover a,
body.home main .home-roles a { color: #08657b; }
body.home main .home-privacy a:focus-visible,
body.home main .home-news a:focus-visible { outline: 3px solid #08657b; outline-offset: 3px; }

@media (max-width: 1023px) {
  body.home main .cover-grid,
  body.home main .role-grid,
  body.home main .home-news .whats-new-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.home main .home-audit__head,
  body.home main .audit-grid { grid-column: 1 / -1; }
  body.home main .home-privacy__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  body.home main .cover-grid,
  body.home main .role-grid,
  body.home main .home-news .whats-new-grid,
  body.home main .audit-grid,
  body.home main .home-privacy__list { grid-template-columns: 1fr; }
  body.home main .cover-tile { padding: var(--space-4) var(--space-6); }
  body.home main .cover-tile svg { margin-bottom: var(--space-2); }
}
@media (prefers-reduced-motion: reduce) {
  body.home main .cover-tile,
  body.home main .role-card,
  body.home main .home-news .release-card { transition: none; }
  body.home main .cover-tile:hover { transform: none; }
}

/* ── C9 Start your evaluation ─────────────────────────── */
body.home main .home-convert {
  overflow: clip;
  background:
    radial-gradient(50% 60% at 75% 50%, rgba(34,211,238,.12), transparent 70%),
    var(--brand-ink-950);
}
body.home main .home-convert__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(1rem, 2vw, 2rem);
  row-gap: var(--space-12);
  align-items: start;
}
body.home main .home-convert__intro { grid-column: 1 / span 5; }
body.home main .home-convert__panel { grid-column: 7 / span 6; }
body.home main .home-steps { display: grid; gap: var(--space-4); margin: var(--space-8) 0 0; padding: 0; list-style: none; counter-reset: step; }
body.home main .home-steps li {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  counter-increment: step;
  font: 500 1rem/1.5 var(--marketing-body);
  color: var(--brand-ink-50);
}
body.home main .home-steps li::before {
  content: counter(step);
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  flex: none;
  border-radius: 50%;
  border: 1px solid rgba(103,232,249,.4);
  color: var(--brand-cyan-300);
  font: 700 .8125rem/1 var(--marketing-body);
}
body.home main .home-steps[hidden] { display: none; }

body.home main .home-convert__panel {
  position: relative;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  border-radius: var(--r-lg);
  background: var(--brand-white);
  color: var(--brand-ink-body);
  box-shadow: 0 40px 120px -40px rgba(0,0,0,.7), 0 0 0 1px rgba(103,232,249,.25);
}
body.home main .home-convert__panel .signup-paused:not([hidden]) { display: block; margin: 0; text-align: left; }
body.home main .home-convert__panel .signup-paused .form-lead { max-width: none; margin: 0 0 var(--space-6); }
body.home main .home-convert__panel::before { content: none; }
body.home main .home-convert__panel h3 {
  margin: 0 0 var(--space-2);
  font: 700 1.25rem/1.3 var(--marketing-display);
  letter-spacing: -.015em;
  color: var(--brand-ink-text);
}
body.home main .home-convert__panel .form-lead { margin: 0 0 var(--space-6); font-size: var(--fs-small); color: var(--brand-ink-muted); }
body.home main .home-convert__panel .form-group { margin-bottom: var(--space-4); }
body.home main .home-convert__panel .form-group label { display: block; margin-bottom: .35rem; font: 600 .875rem/1.4 var(--marketing-body); color: var(--brand-ink-text); }
body.home main .home-convert__panel .form-group input,
body.home main .home-convert__panel .form-group textarea {
  width: 100%;
  min-height: 44px;
  padding: .7rem .9rem;
  font: 400 1rem/1.5 var(--marketing-body);
  color: var(--brand-ink-text);
  background: var(--brand-paper);
  border: 1px solid #8aa0ad;
  border-radius: 10px;
}
body.home main .home-convert__panel .form-group textarea { min-height: 112px; resize: vertical; }
body.home main .home-convert__panel .form-group input:focus,
body.home main .home-convert__panel .form-group textarea:focus { outline: 3px solid rgba(8,145,178,.35); outline-offset: 1px; border-color: var(--brand-cyan-600); background: #fff; }
body.home main .home-convert__panel .form-group input::placeholder,
body.home main .home-convert__panel .form-group textarea::placeholder { color: #6b7d89; }
body.home main .home-convert__panel .form-checkbox { display: flex; gap: .6rem; margin: var(--space-2) 0 var(--space-4); font-size: var(--fs-small); line-height: 1.5; color: var(--brand-ink-body); }
body.home main .home-convert__panel .form-checkbox a { color: #08657b; text-decoration: underline; }
body.home main .home-convert__panel .form-checkbox strong { color: var(--brand-ink-text); }
body.home main .home-convert__panel .form-submit {
  width: 100%;
  min-height: 48px;
  margin-top: var(--space-2);
  padding: .9rem 1.5rem;
  border: 0;
  border-radius: var(--r-pill);
  color: #fff;
  background: var(--marketing-primary);
  font: 600 .95rem/1.5 var(--marketing-body);
  cursor: pointer;
  box-shadow: 0 12px 38px -8px rgba(8,145,178,.5);
}
body.home main .home-convert__panel .form-submit:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
body.home main .home-convert__panel .form-submit:focus-visible { outline: 3px solid #08657b; outline-offset: 4px; }
body.home main .home-convert__panel .form-trust { margin: var(--space-4) 0 0; font-size: .8125rem; color: var(--brand-ink-muted); text-align: center; }
body.home main .home-convert__panel .form-trust a { color: #08657b; }
body.home main .home-convert__panel .form-status { margin-top: var(--space-4); padding: .75rem 1rem; border-radius: 10px; font-size: var(--fs-small); }
body.home main .home-convert__panel .form-status.success { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
body.home main .home-convert__panel .form-status.error { background: #fff1f2; color: #9f1239; border: 1px solid #fecdd3; }
body.home main .home-convert__panel .eval-done:focus { outline: none; }
body.home main .home-convert__panel .eval-done h3 { margin-bottom: var(--space-2); }
body.home main .home-convert__panel .eval-done p { margin: 0; color: var(--brand-ink-body); }

/* Keep the last section clear of the floating buttons on small screens. */
@media (max-width: 767px) {
  body.home main #homeView > section:last-of-type { padding-bottom: calc(var(--brand-section-y) + 88px); }
}

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 1023px) {
  body.home main .home-hero { min-height: 0; }
  body.home main .home-hero__copy,
  body.home main .home-hero__scene { grid-column: 1 / -1; }
  body.home main .home-hero__scene { margin: 0; }
  body.home main .scene-stage { aspect-ratio: 1.3; }
  body.home main .home-proof__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.home main .home-convert__intro,
  body.home main .home-convert__panel { grid-column: 1 / -1; }
}

@media (max-width: 767px) {
  body.home main .home-hero { padding-top: calc(var(--nav-h, 5.5rem) + 1.5rem); padding-bottom: 3rem; }
  body.home main .home-hero h1 { margin-bottom: var(--space-4); }
  body.home main .home-hero__ctas { flex-direction: column; margin: var(--space-6) 0 var(--space-6); }
  body.home main .home-hero__ctas > a { width: 100%; }
  body.home main .home-hero__facts { flex-direction: column; }
  /* Small screens: the scene is a static stack of cards in step 3. */
  body.home main .scene-figure { padding-top: 1.75rem; }
  body.home main .scene-stage { aspect-ratio: auto; display: flex; flex-direction: column; gap: 12px; }
  body.home main .scene-overview,
  body.home main .scene-finding,
  body.home main .scene-task,
  body.home main .scene-proof { position: static; width: auto; }
  body.home main .scene-proof { align-self: flex-start; }
  body.home main .scene-orben,
  body.home main .scene-link { display: none; }
  body.home main .home-hero__scene .ui-label { top: 0; right: auto; left: 0; }
  body.home main .ui-row { grid-template-columns: max-content minmax(3rem, 1fr) auto; gap: 10px; }
  body.home main .ui-frame__bar .ui-chip { display: none; }
  body.home main .home-proof__list { grid-template-columns: 1fr; gap: var(--space-6); }
}

@media (prefers-reduced-motion: reduce) {
  body.home main .ui-bar i,
  body.home main .home-btn-ghost-dark { transition: none; }
}

/* ── Capability matrix view (#matrix) on the brand surfaces ──
   The matrix keeps its own layout; it gets the paper surface, the type scale
   and the accent colours used everywhere else, with text at 4.5:1 or more. */
body.home.matrix-mode #pageFlow .atmo-base { background: var(--brand-paper); }
body.home.matrix-mode #pageFlow .atmo-glow { display: none; }
body.home #matrixView .section-label {
  font: 700 var(--fs-eyebrow)/1.6 var(--marketing-body);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--brand-teal-text);
}
body.home #matrixView :is(.matrix-intro h2, .matrix-section > h2) {
  font: 800 var(--fs-h2)/1.08 var(--marketing-display);
  letter-spacing: -.035em;
  color: var(--brand-ink-text);
}
body.home #matrixView .matrix-table-wrap thead tr { background: var(--brand-ink-900); }
/* Sticky first header cell on phones: white text needs the ink background (it was #0891b2, 3.4:1). */
body.home #matrixView .matrix-table-wrap thead th:first-child { background: var(--brand-ink-900); }
/* The tables scroll sideways on phones, so they are focusable regions (keyboard scrolling). */
body.home #matrixView .matrix-table-wrap:focus-visible { outline: 3px solid #08657b; outline-offset: 3px; }
/* The footer stays the site footer in matrix mode (the old light-mode overrides
   left its headings and "Cookie settings" below 4.5:1 on the dark footer). */
body.home.matrix-mode footer { background: var(--brand-ink-900); }
body.home.matrix-mode footer .footer-col :is(h2, h4) { color: #83e3f2; }
body.home.matrix-mode footer .footer-col :is(a, button.link-like) { color: #d1e0e8; opacity: 1; }
body.home.matrix-mode footer .footer-col :is(a, button.link-like):hover { color: #fff; }
body.home.matrix-mode footer .footer-copy { color: #b2c7d3; }
body.home #matrixView :is(.matrix-table-wrap, .pillar-grid > *) {
  border: 1px solid var(--brand-line-light);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card-light);
}

/* ── C12 Consent card (non-blocking, first visit only) ──
   Reject all and Accept all must stay identical in size and style: that is a
   legal requirement, not a design choice. */
body.home .cookie-notice {
  position: fixed;
  /* Bottom right. On common laptop heights (768-800px) the hero buttons sit near
     the bottom-left of the first screen, so a card there would cover them. The
     hero scene does not auto-advance while this card is open (see home.js), so
     nothing it covers is moving. */
  right: 24px;
  bottom: 24px;
  z-index: 60;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "title" "text" "actions" "link";
  width: min(400px, calc(100vw - 48px));
  padding: var(--space-6);
  border-radius: var(--r-lg);
  background: var(--brand-white);
  border: 1px solid var(--brand-line-light);
  box-shadow: 0 24px 64px -24px rgba(4,22,32,.45), 0 0 0 1px rgba(8,38,54,.06);
  color: var(--brand-ink-body);
  font: 400 var(--fs-small)/1.55 var(--marketing-body);
}
body.home .cookie-notice[hidden] { display: none; }
body.home .cookie-notice h2 { grid-area: title; margin: 0 2rem var(--space-2) 0; font: 700 1rem/1.4 var(--marketing-display); color: var(--brand-ink-text); }
body.home .cookie-notice p { grid-area: text; margin: 0; }
body.home .cookie-notice a { color: #08657b; font-weight: 600; }
body.home .cookie-notice-actions { grid-area: actions; display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); margin-top: var(--space-4); }
body.home .cookie-notice-btn {
  min-height: 44px;
  padding: .55rem 1rem;
  border-radius: var(--r-pill);
  border: 1px solid #657c8a;
  background: var(--brand-white);
  color: var(--brand-ink-text);
  font: 600 .9rem/1.3 var(--marketing-body);
  cursor: pointer;
}
body.home .cookie-notice-btn:hover { background: var(--brand-paper); }
body.home .cookie-notice-link {
  grid-area: link;
  justify-self: start;
  display: inline-block;
  min-height: 32px;
  margin-top: var(--space-2);
  padding: .25rem 0;
  border: 0;
  background: none;
  color: #08657b;
  font: 600 var(--fs-small)/1.4 var(--marketing-body);
  text-decoration: underline;
  cursor: pointer;
}
body.home .cookie-notice-close {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--brand-ink-muted);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
}
body.home .cookie-notice-close:hover { background: var(--brand-paper); color: var(--brand-ink-text); }
body.home .cookie-notice :is(a, button):focus-visible { outline: 3px solid #08657b; outline-offset: 3px; }
/* The floating sales button would overlap the card until a choice is made. */
body.cookie-notice-open .sales-widget-fab { visibility: hidden; }
html.js-motion body.home .cookie-notice:not([hidden]) { animation: home-layer-in var(--dur-3) var(--ease-out) backwards; }
@media (max-width: 767px) {
  body.home .cookie-notice { left: 12px; right: 12px; bottom: 12px; width: auto; max-height: 45vh; padding: var(--space-4) var(--space-4) var(--space-3); }
  body.home .cookie-notice-actions { margin-top: var(--space-3); }
}