:root {
  --ink: #0c2233;
  --ink-soft: #415461;
  --blue: #2447d8;
  --blue-dark: #1735b6;
  --paper: #f4f7f5;
  --white: #ffffff;
  --mist: #e4ebea;
  --line: #cad6d4;
  --mint: #b9f7c9;
  --mint-dark: #55a86b;
  --mint-ink: #3b8050;
  --orange: #f35b32;
  --danger: #c43131;
  /*
   * Display and body were previously the same stack, so the type carried no
   * pairing, and Avenir Next is macOS-only — Windows fell all the way to
   * Segoe UI for everything. Display now keeps a geometric face on both
   * platforms (Avenir Next / Futura on macOS, Century Gothic on Windows);
   * body uses the native UI face, which is a different voice everywhere.
   */
  --font-display: "Avenir Next", Futura, "Century Gothic", "Segoe UI", system-ui, sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SFMono-Regular", Menlo, Consolas, monospace;
  --shell: min(1180px, calc(100vw - 48px));
  --section-space: clamp(88px, 10vw, 152px);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

body.dialog-open,
body.menu-open {
  overflow: hidden;
}

button,
select,
input,
textarea {
  font: inherit;
}

button,
a,
summary,
select {
  -webkit-tap-highlight-color: transparent;
}

button,
summary,
select {
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

svg {
  display: block;
}

::selection {
  background: var(--mint);
  color: var(--ink);
}

:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}

.shell {
  width: var(--shell);
  margin-inline: auto;
}

.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;
}

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 12px;
  left: 12px;
  padding: 12px 18px;
  background: var(--ink);
  color: var(--white);
  transform: translateY(-150%);
  transition: transform 180ms ease-out;
}

.skip-link:focus {
  transform: translateY(0);
}

.site-header {
  position: fixed;
  z-index: 50;
  inset: 0 0 auto;
  border-bottom: 1px solid transparent;
  transition: background-color 220ms ease, border-color 220ms ease;
}

.site-header.is-scrolled,
.site-header.menu-open {
  border-color: rgba(12, 34, 51, 0.12);
  background: rgba(244, 247, 245, 0.94);
  backdrop-filter: blur(18px);
}

.nav-shell {
  min-height: 82px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 40px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: max-content;
  font-family: var(--font-display);
  font-size: 23px;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
}

.brand > span:last-child {
  color: #2563eb;
  text-transform: capitalize;
}

.brand-mark {
  flex: 0 0 auto;
  width: 31px;
  height: 31px;
  border-radius: 7px;
  background-color: #2563eb;
  background-image: url("/favicon.svg?v=4513043f86b5");
  background-position: center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.brand-mark path {
  display: none;
}

.desktop-nav {
  display: flex;
  justify-content: center;
  gap: clamp(18px, 2.3vw, 34px);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 500;
}

/* min-height meets the 24px WCAG 2.2 target minimum; these ran at 19px. */
.desktop-nav a,
.footer-links a,
.footer-links button {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  transition: color 180ms ease-out;
}

.desktop-nav a::after,
.footer-links a::after,
.footer-links button::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -3px;
  left: 0;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 220ms var(--ease);
}

.desktop-nav a:hover,
.desktop-nav a[aria-current="location"],
.footer-links a:hover,
.footer-links button:hover {
  color: var(--blue);
}

.desktop-nav a:hover::after,
.desktop-nav a[aria-current="location"]::after,
.footer-links a:hover::after,
.footer-links button:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

.button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 1px solid var(--ink);
  border-radius: 4px;
  padding: 0 22px;
  background: var(--ink);
  color: var(--white);
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  transition: background-color 200ms ease-out, color 200ms ease-out, border-color 200ms ease-out,
    box-shadow 200ms ease-out, transform 200ms ease-out;
}

.button svg,
.text-link svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 200ms var(--ease);
}

.button:hover {
  box-shadow: 4px 4px 0 var(--mint);
  transform: translate(-2px, -2px);
}

.button:hover svg {
  transform: translateX(3px);
}

.button--small {
  min-height: 44px;
  padding-inline: 17px;
  font-size: 13px;
}

.button--primary {
  border-color: var(--blue);
  background: var(--blue);
}

.button--primary:hover {
  border-color: var(--blue-dark);
  background: var(--blue-dark);
}

.button--secondary {
  border-color: var(--ink);
  background: transparent;
  color: var(--ink);
}

.button--secondary:hover {
  background: var(--ink);
  color: var(--white);
}

.button--mint {
  border-color: var(--mint);
  background: var(--mint);
  color: var(--ink);
}

.button--mint:hover {
  box-shadow: 4px 4px 0 var(--blue);
}

.button--large {
  min-height: 58px;
  padding-inline: 28px;
  font-size: 15px;
}

.button--wide {
  width: 100%;
  margin-top: 4px;
}

.menu-toggle {
  display: none;
  width: 48px;
  height: 48px;
  border: 0;
  background: transparent;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 6px;
}

.menu-toggle span:not(.sr-only) {
  display: block;
  width: 23px;
  height: 1.5px;
  background: var(--ink);
  transition: transform 200ms ease-out;
}

.menu-toggle[aria-expanded="true"] span:nth-last-child(2) {
  transform: translateY(3.75px) rotate(45deg);
}

.menu-toggle[aria-expanded="true"] span:last-child {
  transform: translateY(-3.75px) rotate(-45deg);
}

.mobile-menu {
  width: var(--shell);
  margin-inline: auto;
  padding: 12px 0 28px;
}

.mobile-menu a {
  display: flex;
  min-height: 54px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 500;
}

.mobile-menu .button {
  width: 100%;
  margin-top: 20px;
}

.hero {
  min-height: min(720px, 100svh);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(520px, 1.04fr);
  align-items: center;
  gap: clamp(36px, 4.2vw, 60px);
  padding-top: 96px;
  padding-bottom: 36px;
}

.eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.3;
  text-transform: uppercase;
}

.eyebrow > span {
  display: block;
  width: 26px;
  height: 1px;
  background: currentColor;
}

.hero h1,
.section-heading h2,
.product-types h2,
.governance-section h2,
.trust-preview h2,
.questions h2,
.closing h2,
.brief-dialog h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.055em;
  line-height: 0.95;
}

.hero h1 {
  max-width: 680px;
  font-size: clamp(54px, 4.4vw, 62px);
}

.hero h1 em {
  position: relative;
  color: var(--blue);
  font-family: var(--font-display);
  font-style: normal;
  font-weight: 400;
}

.hero h1 em::after {
  content: "";
  position: absolute;
  right: 3px;
  bottom: 2px;
  left: 4px;
  height: 4px;
  background: var(--orange);
  transform: rotate(-1.5deg);
}

.hero-lede {
  max-width: 610px;
  margin: 20px 0 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.55;
}

/*
 * A deliberate plain-language on-ramp under the lede. The lede is written for a
 * reader who already knows the category; this line is for the one who does not,
 * so it is set quieter than the lede rather than competing with it.
 */
.hero-plain {
  max-width: 610px;
  margin: 12px 0 0;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.6;
}

.hero-actions {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-top: 24px;
}

.text-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 0;
  border-bottom: 1px solid var(--ink);
  padding: 0;
  background: none;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  transition: color 180ms ease-out, border-color 180ms ease-out;
}

.text-link:hover {
  border-color: var(--blue);
  color: var(--blue);
}

.text-link:hover svg {
  transform: translateY(3px);
}

.hero-note {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
  color: var(--ink-soft);
  font-size: 13px;
}

.hero-note svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: var(--mint-dark);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.release-map {
  position: relative;
  border: 1px solid var(--ink);
  background: var(--white);
  box-shadow: 10px 10px 0 var(--mist);
}

.release-map::before,
.release-map::after {
  content: "";
  position: absolute;
  z-index: -1;
  border: 1px solid var(--ink);
  background: var(--paper);
}

.release-map::before {
  inset: 9px -9px -9px 9px;
}

.release-map::after {
  width: 32px;
  height: 32px;
  top: -16px;
  right: 48px;
  background: var(--mint);
}

.map-topline,
.map-footer {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 18px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.map-topline {
  border-bottom: 1px solid var(--line);
}

.map-footer {
  border-top: 1px solid var(--line);
  color: var(--ink-soft);
}

.live-indicator {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--mint-ink);
}

.live-indicator i,
.status-pill i,
.gate i {
  width: 7px;
  height: 7px;
  display: inline-block;
  border-radius: 50%;
  background: var(--mint-ink);
}

.map-canvas {
  position: relative;
  height: 510px;
  overflow: hidden;
  background-color: #fbfcfb;
}

.map-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.trace {
  fill: none;
  stroke: var(--line);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.js .release-map.is-visible .trace {
  stroke: var(--blue);
  stroke-dasharray: 12 10;
  animation: trace-flow 9s linear infinite;
}

.js .release-map.is-visible .trace--b,
.js .release-map.is-visible .trace--e {
  animation-delay: -3s;
}

.js .release-map.is-visible .trace--c {
  animation-delay: -5s;
}

@keyframes trace-flow {
  to {
    stroke-dashoffset: -176;
  }
}

.map-input,
.map-output {
  position: absolute;
  z-index: 2;
  background: var(--white);
}

.map-input {
  left: 3.6%;
  width: 132px;
  border-left: 3px solid var(--blue);
  padding: 10px 12px;
  box-shadow: 0 0 0 1px var(--line);
}

.map-input--one {
  top: 15%;
}

.map-input--two {
  top: 43%;
}

.map-input--three {
  top: 71%;
}

.map-input span,
.map-output small,
.map-core span,
.map-core small,
.gate {
  display: block;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
}

.map-input span {
  margin-bottom: 4px;
  color: var(--blue);
}

.map-input strong,
.map-output strong {
  display: block;
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
}

.map-core {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 49.5%;
  width: 190px;
  height: 190px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ink);
  border-radius: 50%;
  background: var(--ink);
  color: var(--white);
  text-align: center;
  transform: translate(-50%, -50%);
}

.map-core::before {
  content: "";
  position: absolute;
  inset: 11px;
  border: 1px solid rgba(185, 247, 201, 0.45);
  border-radius: inherit;
}

.core-orbit {
  position: absolute;
  border: 1px solid var(--blue);
  border-radius: 50%;
}

.core-orbit--one {
  inset: -15px;
  border-style: dashed;
}

.core-orbit--two {
  inset: -29px;
  border-color: var(--line);
}

.map-core span {
  position: relative;
  color: var(--mint);
}

.map-core strong {
  position: relative;
  margin: 10px 0 8px;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.02;
}

.map-core small {
  position: relative;
  color: #a9b5bc;
}

.map-output {
  right: 2.7%;
  width: 154px;
  display: grid;
  grid-template-columns: 38px 1fr;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--ink);
  padding: 10px;
}

.map-output--one {
  top: 20%;
}

.map-output--two {
  top: 63%;
}

.output-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  background: var(--blue);
  color: var(--white);
}

.output-icon--mint {
  background: var(--mint);
  color: var(--ink);
}

.output-icon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.map-output small {
  margin-bottom: 4px;
  color: var(--ink-soft);
}

.gate {
  position: absolute;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  padding: 6px 8px;
  background: var(--white);
  color: var(--ink-soft);
}

.gate--one {
  top: 7%;
  left: 41%;
}

.gate--two {
  right: 7%;
  bottom: 5%;
}

.gate--two i {
  background: var(--orange);
}

.map-progress {
  width: 90px;
  height: 2px;
  overflow: hidden;
  background: var(--line);
}

.map-progress i {
  display: block;
  width: 70%;
  height: 100%;
  background: var(--blue);
}

.proof-band {
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  background: var(--white);
}

.proof-grid {
  min-height: 128px;
  display: grid;
  grid-template-columns: 1.25fr repeat(3, 1fr);
  align-items: stretch;
}

.proof-grid > * {
  margin: 0;
  padding: 27px 20px;
  border-right: 1px solid var(--line);
}

.proof-grid > *:first-child {
  padding-left: 0;
}

.proof-grid > *:last-child {
  border-right: 0;
  padding-right: 0;
}

.proof-grid > p {
  display: flex;
  align-items: center;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.5;
}

.proof-grid > p a {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.proof-grid > p a:hover {
  color: var(--blue);
  text-decoration-thickness: 2px;
}

.proof-grid div {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.proof-grid span,
.micro-label {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.07em;
  line-height: 1.4;
}

/* --blue on the dark panel is 2.3:1. Mint clears AA on the same ground. */
.start-conditions .micro-label {
  color: var(--mint);
}

.proof-grid strong {
  margin-top: 7px;
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
}

.section {
  padding-block: var(--section-space);
}

.section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.7fr);
  align-items: end;
  gap: clamp(50px, 9vw, 130px);
  margin-bottom: 72px;
}

.section-heading--compact {
  margin-bottom: 64px;
}

.section-heading h2,
.product-types h2,
.governance-section h2,
.trust-preview h2,
.questions h2,
.closing h2 {
  font-size: clamp(48px, 5.7vw, 78px);
}

.section-heading > p,
.standards-copy > p,
.closing-card > p:not(.eyebrow) {
  margin: 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.7;
}

.system-grid {
  display: grid;
  grid-template-columns: 0.82fr 1.18fr;
  border: 1px solid var(--ink);
  background: var(--white);
}

.system-tabs {
  border-right: 1px solid var(--ink);
}

.system-tab {
  position: relative;
  width: 100%;
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border: 0;
  border-bottom: 1px solid var(--line);
  padding: 0 28px;
  background: var(--white);
  color: var(--ink-soft);
  text-align: left;
  transition: background-color 200ms ease-out, color 200ms ease-out, padding 200ms ease-out;
}

.system-tab:last-child {
  border-bottom: 0;
}

.system-tab span {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 500;
}

.system-tab svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  transition: transform 200ms var(--ease);
}

.system-tab:hover,
.system-tab.is-active {
  padding-left: 36px;
  background: var(--paper);
  color: var(--ink);
}

.system-tab.is-active::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--blue);
}

.system-tab.is-active svg {
  color: var(--blue);
  transform: translateX(4px);
}

.capability-panel {
  min-height: 367px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  grid-template-rows: auto auto auto 1fr;
  column-gap: 44px;
  align-items: start;
  padding: 36px 42px 40px;
}

.capability-meta {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 35px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 100px;
  padding: 6px 10px;
  color: var(--ink-soft);
  background: var(--paper);
}

.capability-icon {
  grid-column: 2;
  grid-row: 2 / 5;
  width: 180px;
  height: 180px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  align-self: center;
  border: 1px solid var(--ink);
  padding: 24px;
  background: var(--paper);
}

.capability-icon span {
  display: block;
  border: 1px solid var(--line);
  background: var(--white);
  transition: background-color 250ms ease-out, border-color 250ms ease-out, transform 250ms var(--ease);
}

.capability-icon[data-variant="reuse"] span:nth-child(1),
.capability-icon[data-variant="reuse"] span:nth-child(5),
.capability-icon[data-variant="reuse"] span:nth-child(9),
.capability-icon[data-variant="quality"] span:nth-child(2),
.capability-icon[data-variant="quality"] span:nth-child(5),
.capability-icon[data-variant="quality"] span:nth-child(8),
.capability-icon[data-variant="speed"] span:nth-child(4),
.capability-icon[data-variant="speed"] span:nth-child(5),
.capability-icon[data-variant="speed"] span:nth-child(6),
.capability-icon[data-variant="ready"] span:nth-child(1),
.capability-icon[data-variant="ready"] span:nth-child(3),
.capability-icon[data-variant="ready"] span:nth-child(5),
.capability-icon[data-variant="ready"] span:nth-child(7),
.capability-icon[data-variant="ready"] span:nth-child(9) {
  border-color: var(--blue);
  background: var(--blue);
  transform: translateY(-3px);
}

.capability-icon[data-variant="ready"] span:nth-child(5) {
  border-color: var(--mint-dark);
  background: var(--mint);
}

.capability-panel h3 {
  margin: 0 0 14px;
  font-family: var(--font-display);
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 500;
  letter-spacing: -0.035em;
  line-height: 1.08;
}

.capability-panel > p {
  max-width: 560px;
  margin: 0 0 22px;
  color: var(--ink-soft);
  font-size: 15px;
}

.capability-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.capability-list li {
  position: relative;
  padding-top: 13px;
  border-top: 1px solid var(--line);
  font-size: 11px;
  line-height: 1.45;
}

.capability-list li::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 7px 2px 0;
  background: var(--mint-dark);
}

.engagement-section {
  padding-top: 0;
}

.engagement-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}

.engagement-card {
  position: relative;
  min-height: 520px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  padding: 32px;
  background: var(--white);
}

.engagement-card--featured::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  background: var(--blue);
}

.engagement-card__top {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.engagement-card__top b {
  border-radius: 100px;
  padding: 6px 9px;
  background: var(--mint);
  color: var(--ink);
  font-weight: 500;
}

.engagement-card h3 {
  margin: 27px 0 14px;
  font-family: var(--font-display);
  font-size: clamp(30px, 3.2vw, 44px);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1.04;
}

.engagement-card > p {
  max-width: 520px;
  margin: 0 0 28px;
  color: var(--ink-soft);
  font-size: 14px;
}

.engagement-card dl {
  margin: auto 0 0;
  border-top: 1px solid var(--line);
}

.engagement-card dl div {
  display: grid;
  grid-template-columns: 125px 1fr;
  gap: 20px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line);
}

.engagement-card dt {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.engagement-card dd {
  margin: 0;
  color: var(--ink-soft);
  font-size: 12px;
  line-height: 1.45;
}

.card-action {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 24px -32px -32px;
  border: 0;
  border-top: 1px solid var(--ink);
  padding: 0 32px;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  text-align: left;
  transition: background-color 180ms ease-out, color 180ms ease-out;
}

.card-action:hover {
  background: var(--ink);
  color: var(--white);
}

.card-action svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  transition: transform 200ms var(--ease);
}

.card-action:hover svg {
  transform: translateX(4px);
}

.start-conditions {
  display: grid;
  grid-template-columns: 0.72fr 1.28fr;
  gap: clamp(40px, 7vw, 90px);
  margin-top: 42px;
  border: 1px solid var(--ink);
  padding: clamp(28px, 4vw, 46px);
  background: var(--ink);
  color: var(--white);
}

.start-conditions__intro h3 {
  margin: 12px 0 16px;
  font-family: var(--font-display);
  font-size: clamp(31px, 3.4vw, 46px);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1.04;
}

.start-conditions__intro > p:last-child {
  max-width: 470px;
  margin: 0;
  color: #c7d1d6;
  font-size: 13px;
}

.start-conditions ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin: 0;
  padding: 0;
  border-top: 1px solid #4c5d69;
  border-left: 1px solid #4c5d69;
  list-style: none;
}

/* Ordinals removed: these are four parallel conditions, not a sequence. */
.start-conditions li {
  min-height: 138px;
  display: grid;
  align-content: start;
  grid-template-columns: minmax(0, 1fr);
  gap: 5px;
  border-right: 1px solid #4c5d69;
  border-bottom: 1px solid #4c5d69;
  padding: 19px;
}

.start-conditions li strong {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 500;
}

.start-conditions li small {
  color: #aebcc3;
  font-size: 11px;
  line-height: 1.5;
}

.surface-section {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--white);
}

.evidence-section {
  border-bottom: 1px solid var(--line);
}

.evidence-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}

.evidence-card {
  min-height: 405px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  padding: 28px;
  background: var(--white);
}

.evidence-code {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.evidence-card > svg {
  width: 62px;
  height: 62px;
  margin: 45px 0 30px;
  fill: none;
  stroke: var(--blue);
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.evidence-card h3 {
  margin: 0 0 12px;
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.15;
}

.evidence-card p {
  margin: 0 0 30px;
  color: var(--ink-soft);
  font-size: 13px;
}

.evidence-card a {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: auto;
  border-top: 1px solid var(--line);
  padding-top: 14px;
  color: var(--blue);
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  transition: color 180ms ease-out;
}

.evidence-card a:hover {
  color: var(--ink);
}

.evidence-card a svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
}

.evidence-note {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 24px;
  padding: 24px 28px;
  border: 1px solid var(--ink);
  border-top: 0;
  background: var(--mint);
}

.evidence-note span {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.evidence-note p {
  margin: 0;
  font-size: 12px;
}

.readiness-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
  align-items: center;
  gap: clamp(60px, 10vw, 150px);
}

.readiness-scorecard {
  border: 1px solid var(--ink);
  background: var(--paper);
  box-shadow: 9px 9px 0 var(--mist);
}

.scorecard-head {
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  border-bottom: 1px solid var(--ink);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.scorecard-head strong {
  font-family: var(--font-display);
  font-size: 30px;
  letter-spacing: -0.04em;
}

.score-track {
  height: 5px;
  background: var(--mist);
}

.score-track span {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--mint-dark);
}

.readiness-scorecard ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.readiness-scorecard li {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--line);
  padding: 0 24px;
  background: var(--white);
  font-size: 13px;
}

.readiness-scorecard li span {
  display: flex;
  align-items: center;
  gap: 10px;
}

.readiness-scorecard li i {
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--mint);
}

.readiness-scorecard li i::before {
  content: "";
  width: 5px;
  height: 2px;
  border-left: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  transform: rotate(-45deg) translateY(-1px);
}

.readiness-scorecard > p {
  margin: 0;
  padding: 18px 24px;
  color: var(--ink-soft);
  font-size: 11px;
}

.standards-copy h3 {
  margin: 13px 0 20px;
  font-family: var(--font-display);
  font-size: clamp(32px, 4vw, 50px);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.standards-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 27px 0 20px;
}

.standards-tags span {
  border: 1px solid var(--ink);
  border-radius: 100px;
  padding: 7px 12px;
  font-family: var(--font-mono);
  font-size: 10px;
}

.standards-copy small {
  display: block;
  max-width: 530px;
  color: #64747e;
  font-size: 10px;
  line-height: 1.55;
}

.release-contract {
  margin-top: clamp(72px, 9vw, 118px);
}

.release-contract__intro {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(320px, 1.2fr);
  gap: 26px 70px;
  margin-bottom: 34px;
}

.release-contract__intro .micro-label {
  grid-column: 1 / -1;
  margin: 0;
}

.release-contract__intro h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(36px, 4.7vw, 62px);
  font-weight: 500;
  letter-spacing: -0.05em;
  line-height: 1;
}

.release-contract__intro > p:last-child {
  max-width: 620px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 16px;
}

.contract-table {
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}

.contract-row {
  display: grid;
  grid-template-columns: 0.65fr 1fr 1.15fr 0.72fr;
}

.contract-row > * {
  min-height: 68px;
  display: flex;
  align-items: center;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  padding: 13px 16px;
  background: var(--white);
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 400;
}

.contract-row > strong {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
}

.contract-row--head > * {
  min-height: 46px;
  background: var(--ink);
  color: var(--mint);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.delivery-track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.delivery-track::before {
  content: "";
  position: absolute;
  top: 25px;
  right: 12.5%;
  left: 12.5%;
  height: 1px;
  background: var(--line);
}

.delivery-track li {
  position: relative;
  min-height: 320px;
  padding: 0 28px 24px;
  border-right: 1px solid var(--line);
}

.delivery-track li:first-child {
  padding-left: 0;
}

.delivery-track li:last-child {
  border-right: 0;
  padding-right: 0;
}

.step-marker {
  position: relative;
  z-index: 1;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  margin-bottom: 36px;
  border: 1px solid var(--ink);
  border-radius: 50%;
  background: var(--paper);
  font-family: var(--font-mono);
  font-size: 10px;
}

.step-marker i {
  position: absolute;
  inset: 5px;
  border: 1px solid var(--line);
  border-radius: 50%;
}

.delivery-track li:last-child .step-marker {
  border-color: var(--blue);
  background: var(--blue);
  color: var(--white);
}

.delivery-track h3 {
  min-height: 58px;
  margin: 12px 0 15px;
  font-family: var(--font-display);
  font-size: 23px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

.delivery-track li > p:not(.micro-label) {
  margin: 0 0 24px;
  color: var(--ink-soft);
  font-size: 14px;
}

.delivery-track small {
  display: block;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: 10px;
}

.governance-section {
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  background: var(--white);
}

.governance-grid {
  display: grid;
  grid-template-columns: 0.86fr 1.14fr;
  gap: clamp(70px, 11vw, 150px);
}

.governance-section h2,
.trust-preview h2 {
  font-size: clamp(48px, 5.7vw, 78px);
}

.governance-grid > div:first-child > p:not(.eyebrow) {
  max-width: 530px;
  margin: 28px 0 0;
  color: var(--ink-soft);
  font-size: 16px;
}

.governance-list {
  border-top: 1px solid var(--ink);
}

/* Ordinals removed: four parallel governance principles, not steps. */
.governance-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  padding: 24px 0;
  border-bottom: 1px solid var(--ink);
}

.governance-list h3 {
  margin: 0 0 6px;
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.governance-list p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
}

.product-types {
  padding-block: clamp(80px, 9vw, 126px);
  background: var(--ink);
  color: var(--white);
}

.product-types-grid {
  display: grid;
  grid-template-columns: 1fr 0.8fr;
  align-items: end;
  gap: 70px 100px;
}

.eyebrow--light {
  color: var(--mint);
}

.type-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid #4c5d69;
}

.type-list :where(span, a) {
  position: relative;
  min-height: 56px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #4c5d69;
  padding: 0 0 0 19px;
  color: #dbe3e6;
  font-size: 13px;
}

.type-list :where(span, a):nth-child(odd) {
  border-right: 1px solid #4c5d69;
}

.type-list :where(span, a)::before {
  content: "";
  position: absolute;
  left: 0;
  width: 6px;
  height: 6px;
  background: var(--mint);
}

.type-list a {
  transition: color 180ms ease, padding-left 180ms ease;
}

.type-list a:hover {
  padding-left: 24px;
  color: var(--mint);
}

.product-types .button {
  grid-column: 1 / -1;
  width: max-content;
}

.fit-boundary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid #4c5d69;
  border-left: 1px solid #4c5d69;
}

.fit-boundary article {
  min-height: 190px;
  border-right: 1px solid #4c5d69;
  border-bottom: 1px solid #4c5d69;
  padding: 26px;
}

.fit-boundary span {
  color: var(--mint);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.fit-boundary article:last-child span {
  color: #ff9d83;
}

.fit-boundary h3 {
  margin: 34px 0 8px;
  font-family: var(--font-display);
  font-size: 23px;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.fit-boundary p {
  max-width: 500px;
  margin: 0;
  color: #aebcc3;
  font-size: 12px;
}

.trust-preview {
  padding-bottom: 0;
}

.trust-preview__head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 50px;
  margin-bottom: 58px;
}

.trust-preview__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}

.trust-preview__grid article {
  min-height: 250px;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  padding: 25px;
  background: var(--white);
}

.trust-preview__grid span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.05em;
}

.trust-preview__grid h3 {
  margin: 44px 0 12px;
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1.15;
}

.trust-preview__grid p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 12px;
}

.questions {
  display: grid;
  grid-template-columns: 0.7fr 1.3fr;
  gap: clamp(60px, 10vw, 150px);
}

.questions-title {
  position: sticky;
  top: 130px;
  align-self: start;
}

.faq-list {
  border-top: 1px solid var(--ink);
}

.faq-list details {
  border-bottom: 1px solid var(--ink);
}

.faq-list summary {
  min-height: 94px;
  display: grid;
  grid-template-columns: 1fr 32px;
  align-items: center;
  gap: 24px;
  padding: 18px 0;
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.3;
  list-style: none;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary span {
  position: relative;
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 50%;
  transition: background-color 180ms ease-out, transform 220ms var(--ease);
}

.faq-list summary span::before,
.faq-list summary span::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 11px;
  height: 1px;
  background: var(--ink);
  transform: translate(-50%, -50%);
}

.faq-list summary span::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.faq-list details[open] summary span {
  background: var(--mint);
  transform: rotate(45deg);
}

.faq-list details p {
  max-width: 670px;
  margin: -5px 52px 0 0;
  padding: 0 0 30px;
  color: var(--ink-soft);
  font-size: 15px;
}

.closing {
  padding-bottom: var(--section-space);
}

.closing-card {
  position: relative;
  overflow: hidden;
  padding: clamp(55px, 8vw, 98px);
  background: var(--blue);
  color: var(--white);
}

.closing-card::before,
.closing-card::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
}

.closing-card::before {
  width: 430px;
  height: 430px;
  right: -105px;
  bottom: -230px;
}

.closing-card::after {
  width: 240px;
  height: 240px;
  right: -9px;
  bottom: -136px;
}

.closing-card > * {
  position: relative;
  z-index: 1;
}

.closing-card > p:not(.eyebrow) {
  max-width: 560px;
  margin-top: 28px;
  color: #dce3ff;
}

.closing-card .button {
  margin-top: 32px;
}

/*
 * A second contact path on the closing card, for a reader who wants to talk now
 * rather than fill in the brief. White on --blue is 7.1:1, so it carries the
 * same weight as the copy around it rather than reading as fineprint.
 */
.closing-whatsapp {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 18px;
  color: var(--white);
  font-size: 14px;
  text-decoration: none;
}

/*
 * The underline lives on the inner span, not the anchor: the anchor is a flex
 * container, so an underline on it would be drawn per flex item and break
 * across the icon and the number.
 */
.closing-whatsapp > span {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.closing-whatsapp svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.closing-whatsapp + .closing-note {
  margin-top: 10px;
}

.closing-note {
  display: block;
  margin-top: 14px;
  color: #dce3ff;
  font-size: 11px;
}

.site-footer {
  border-top: 1px solid var(--ink);
  padding-block: 45px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr auto;
  align-items: start;
  gap: 50px;
}

.brand--footer {
  margin-bottom: 14px;
}

.footer-grid > div:first-child > p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 12px;
}

/* Hidden until contactEmail is configured, so it missed earlier target-size
 * passes. min-height meets the 24px WCAG 2.2 minimum. */
/*
 * Block-level flex, not inline-flex: there are two of these now (email and
 * WhatsApp) and as inline boxes they sat on one line with no separator, reading
 * as a single run of text. width:max-content keeps the underline and the hit
 * area tight to the label.
 */
.footer-contact {
  display: flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  min-height: 24px;
  margin-top: 9px;
  color: var(--blue);
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.footer-social {
  /* The span exists only to give the script one insertion point. Removing it
     from the box tree lets the links it holds stack exactly like the contact
     and WhatsApp links they sit beside. */
  display: contents;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 24px;
  padding-top: 5px;
}

.footer-links a,
.footer-links button {
  border: 0;
  padding: 0;
  background: none;
  font-size: 12px;
}

.footer-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
}

.trust-page {
  background: var(--paper);
}

.trust-hero {
  padding-top: 170px;
  padding-bottom: 82px;
}

.trust-hero h1 {
  max-width: 900px;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(62px, 8vw, 112px);
  font-weight: 600;
  letter-spacing: -0.06em;
  line-height: 0.91;
}

.trust-hero > p:not(.eyebrow) {
  max-width: 720px;
  margin: 32px 0 0;
  color: var(--ink-soft);
  font-size: 18px;
}

.trust-status-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 60px;
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}

.trust-status-grid div {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  padding: 18px;
  background: var(--white);
}

.trust-status-grid span,
.trust-toc > span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.trust-status-grid strong {
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 500;
}

.trust-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: clamp(60px, 9vw, 130px);
  padding-bottom: var(--section-space);
}

.trust-toc {
  position: sticky;
  top: 120px;
  align-self: start;
  display: grid;
  border-top: 1px solid var(--ink);
}

.trust-toc > span {
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}

.trust-toc a {
  min-height: 46px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: 12px;
  transition: color 180ms ease-out, padding 180ms var(--ease);
}

.trust-toc a:hover {
  padding-left: 6px;
  color: var(--blue);
}

.trust-content {
  border-top: 1px solid var(--ink);
}

.trust-section {
  scroll-margin-top: 105px;
  padding: 64px 0;
  border-bottom: 1px solid var(--ink);
}

.trust-section h2 {
  max-width: 760px;
  margin: 14px 0 24px;
  font-family: var(--font-display);
  font-size: clamp(38px, 5vw, 62px);
  font-weight: 500;
  letter-spacing: -0.05em;
  line-height: 1;
}

.trust-section > p:not(.micro-label):not(.trust-fineprint) {
  max-width: 790px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.75;
}

/*
 * Body paragraphs in a trust section are margin-zero so a section that is a
 * single paragraph sits tight under its heading. Once a section runs to several
 * paragraphs — as the privacy notice now does — they need separating, so the
 * space goes on the gap between siblings rather than on every paragraph.
 */
.trust-section > p:not(.micro-label):not(.trust-fineprint) + p,
.trust-section > .trust-table + p:not(.micro-label):not(.trust-fineprint) {
  margin-top: 18px;
}

.trust-section h3 {
  max-width: 760px;
  margin: 34px 0 12px;
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.trust-table {
  width: 100%;
  max-width: 790px;
  margin: 18px 0 0;
  border-collapse: collapse;
  font-size: 14px;
  text-align: left;
}

.trust-table th,
.trust-table td {
  border-bottom: 1px solid var(--line);
  padding: 10px 14px 10px 0;
  vertical-align: top;
}

.trust-table th {
  font-family: var(--font-display);
  font-weight: 600;
}

.trust-table td {
  color: var(--ink-soft);
  line-height: 1.6;
}

.trust-table code {
  font-size: 13px;
}

/*
 * The live consent state, written by script.js. It reports a fact about the
 * visitor's own browser, so it is set at full contrast, not as fineprint.
 */
.trust-consent {
  font-weight: 600;
}

.trust-section > .button[data-consent-manage] {
  margin: 18px 0;
}

.trust-callout {
  display: grid;
  grid-template-columns: 210px 1fr;
  gap: 25px;
  margin-top: 30px;
  border-left: 4px solid var(--orange);
  padding: 20px;
  background: var(--white);
}

.trust-callout strong {
  font-family: var(--font-display);
  font-size: 14px;
}

.trust-callout span {
  color: var(--ink-soft);
  font-size: 12px;
}

.trust-checklist {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
  margin: 34px 0 25px;
  padding: 0;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  list-style: none;
}

.trust-checklist li {
  position: relative;
  min-height: 66px;
  display: flex;
  align-items: center;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 14px 18px 14px 42px;
  background: var(--white);
  font-size: 12px;
}

.trust-checklist li::before {
  content: "";
  position: absolute;
  left: 18px;
  width: 8px;
  height: 8px;
  background: var(--mint-dark);
}

.trust-fineprint {
  margin: 0;
  color: #64747e;
  font-size: 10px;
}

.trust-download {
  width: max-content;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: 30px;
  border: 1px solid var(--ink);
  border-radius: 4px;
  padding: 0 18px;
  background: var(--white);
  color: var(--blue);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
  transition: background-color 180ms ease-out, color 180ms ease-out, transform 180ms ease-out;
}

.trust-download:hover {
  background: var(--ink);
  color: var(--white);
  transform: translateY(-2px);
}

.trust-download svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
}

.principle-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 34px;
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}

.principle-grid article {
  min-height: 205px;
  border-right: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  padding: 22px;
  background: var(--white);
}

.principle-grid span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
}

.principle-grid h3 {
  margin: 50px 0 8px;
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 500;
}

.principle-grid p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 12px;
}

.brief-dialog {
  width: min(680px, calc(100vw - 32px));
  max-height: min(820px, calc(100vh - 32px));
  overflow: auto;
  border: 1px solid var(--ink);
  border-radius: 0;
  padding: 0;
  background: var(--paper);
  color: var(--ink);
  box-shadow: 12px 12px 0 rgba(12, 34, 51, 0.22);
}

.brief-dialog::backdrop {
  background: rgba(12, 34, 51, 0.74);
  backdrop-filter: blur(8px);
}

.brief-dialog[open] {
  animation: dialog-in 280ms var(--ease) both;
}

@keyframes dialog-in {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.985);
  }
}

.dialog-frame {
  min-height: 100%;
}

.dialog-topline {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--ink);
  padding-left: 24px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.dialog-close {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 0;
  border-left: 1px solid var(--ink);
  background: transparent;
  transition: background-color 180ms ease-out, color 180ms ease-out;
}

.dialog-close:hover {
  background: var(--ink);
  color: var(--white);
}

.dialog-close svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
}

.brief-form-wrap,
.brief-result {
  padding: clamp(30px, 6vw, 54px);
}

.brief-dialog h2 {
  font-size: clamp(38px, 7vw, 58px);
}

.brief-form-wrap > p:not(.eyebrow),
.brief-result > p:not(.eyebrow) {
  margin: 18px 0 28px;
  color: var(--ink-soft);
  font-size: 14px;
}

#brief-form {
  display: grid;
  gap: 18px;
}

#brief-form label {
  display: grid;
  gap: 7px;
}

#brief-form label > span {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 600;
}

#brief-form label > span::after {
  content: " · required";
  color: #64747e;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

#brief-form select {
  width: 100%;
  min-height: 50px;
  border: 1px solid var(--line);
  border-radius: 2px;
  padding: 0 42px 0 14px;
  background-color: var(--white);
  color: var(--ink);
  font-size: 14px;
  transition: border-color 180ms ease-out, box-shadow 180ms ease-out;
}

#brief-form select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(36, 71, 216, 0.14);
}

.brief-output {
  margin-top: 28px;
  border: 1px solid var(--ink);
  background: var(--white);
}

.brief-row {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 20px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}

.brief-row:last-child {
  border-bottom: 0;
}

.brief-row span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.brief-row strong {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 500;
}

.result-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 28px;
  margin-top: 26px;
}

.brief-privacy-note {
  margin: 20px 0 0;
  color: var(--ink-soft);
  font-size: 11px;
}

.not-found-page {
  min-height: 100svh;
}

.not-found {
  min-height: 100svh;
  display: grid;
  grid-template-columns: 0.72fr 1.28fr;
  align-items: center;
  gap: clamp(50px, 9vw, 130px);
  padding-top: 110px;
  padding-bottom: 60px;
}

.not-found__code {
  color: transparent;
  font-family: var(--font-display);
  font-size: clamp(160px, 24vw, 330px);
  font-weight: 700;
  letter-spacing: -0.1em;
  line-height: 0.72;
  -webkit-text-stroke: 1px var(--line);
  text-indent: -0.08em;
}

.not-found h1 {
  max-width: 680px;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(55px, 7vw, 96px);
  font-weight: 600;
  letter-spacing: -0.06em;
  line-height: 0.92;
}

.not-found > div:last-child > p:not(.eyebrow) {
  max-width: 580px;
  margin: 28px 0 0;
  color: var(--ink-soft);
  font-size: 17px;
}

.js .reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 650ms var(--ease), transform 650ms var(--ease);
}

.js .reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* Service and resource pages */
.service-page {
  background-image:
    linear-gradient(rgba(12, 34, 51, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(12, 34, 51, 0.035) 1px, transparent 1px);
  background-size: 42px 42px;
  background-position: center top;
}

.service-page main,
.service-page .site-footer {
  background: var(--paper);
}

.service-page main {
  overflow: hidden;
}

.desktop-nav a[aria-current="page"] {
  color: var(--blue);
}

.desktop-nav a[aria-current="page"]::after {
  transform: scaleX(1);
  transform-origin: left;
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin-bottom: clamp(42px, 6vw, 78px);
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.breadcrumbs a {
  color: var(--blue);
}

.breadcrumbs a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.service-hero {
  padding-top: clamp(138px, 14vw, 190px);
  padding-bottom: clamp(72px, 9vw, 116px);
}

.service-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  align-items: end;
  gap: clamp(48px, 8vw, 120px);
}

.service-hero h1 {
  max-width: 820px;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(60px, 7.5vw, 108px);
  font-weight: 600;
  letter-spacing: -0.065em;
  line-height: 0.91;
}

.service-detail-page .service-hero h1 {
  font-size: clamp(58px, 7vw, 96px);
}

.service-hero-copy {
  padding-bottom: 4px;
  border-top: 1px solid var(--ink);
}

.service-hero-copy p {
  margin: 20px 0 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.65;
}

.service-hero-copy p:first-child {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: clamp(20px, 2vw, 27px);
  font-weight: 550;
  letter-spacing: -0.03em;
  line-height: 1.25;
}

.service-hero-copy .button {
  margin-top: 30px;
}

.service-facts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(60px, 8vw, 100px);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.service-facts > div {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 22px 28px;
  border-right: 1px solid var(--line);
}

.service-facts > div:first-child {
  padding-left: 0;
}

.service-facts > div:last-child {
  border-right: 0;
}

.service-facts span,
.section-index,
.service-card > span,
.fit-card > span,
.resource-number {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.service-facts strong {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 600;
}

.service-catalog,
.service-principles,
.service-fit,
.service-deliverables,
.service-sequence,
.service-faq {
  padding-block: var(--section-space);
  border-top: 1px solid var(--line);
}

.section-intro {
  display: grid;
  grid-template-columns: 0.32fr minmax(360px, 0.9fr) minmax(260px, 0.58fr);
  gap: clamp(28px, 5vw, 78px);
  align-items: start;
  margin-bottom: clamp(46px, 7vw, 82px);
}

.section-intro > h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(38px, 4.8vw, 68px);
  font-weight: 600;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.section-intro > p:last-child:not(:first-child) {
  margin: 0;
  color: var(--ink-soft);
  font-size: 16px;
}

.service-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--line);
}

.service-card {
  position: relative;
  min-height: 410px;
  display: flex;
  flex-direction: column;
  padding: 34px 32px 30px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--white);
  transition: background-color 200ms ease-out, transform 250ms var(--ease);
}

.service-card::before {
  content: "";
  position: absolute;
  inset: -1px 0 auto;
  height: 4px;
  background: var(--blue);
  transform: scaleX(0.16);
  transform-origin: left;
  transition: transform 300ms var(--ease);
}

.service-card--modernize::before,
.service-card--portal::before {
  background: var(--orange);
}

.service-card--compliance::before,
.service-card--ai::before {
  background: var(--mint-dark);
}

.service-card:hover {
  z-index: 1;
  background: #fbfdfc;
  transform: translateY(-4px);
}

.service-card:hover::before {
  transform: scaleX(1);
}

.service-card h3 {
  margin: 52px 0 18px;
  font-family: var(--font-display);
  font-size: 29px;
  font-weight: 600;
  letter-spacing: -0.045em;
  line-height: 1.04;
}

.service-card p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
}

.service-card ul {
  display: grid;
  gap: 7px;
  margin: 24px 0 30px;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.service-card li::before {
  content: "—";
  margin-right: 8px;
  color: var(--blue);
}

.service-card > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  color: var(--blue);
  font-size: 13px;
  font-weight: 650;
}

.principle-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--line);
}

.principle-strip article {
  min-height: 280px;
  padding: 30px 28px;
  border-right: 1px solid var(--line);
}

.principle-strip article:first-child {
  padding-left: 0;
}

.principle-strip article:last-child {
  border-right: 0;
}

.principle-strip span {
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.09em;
}

.principle-strip h3 {
  margin: 64px 0 16px;
  font-family: var(--font-display);
  font-size: 24px;
  letter-spacing: -0.04em;
  line-height: 1.05;
}

.principle-strip p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
}

.fit-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}

.fit-card {
  min-height: 400px;
  padding: clamp(32px, 5vw, 58px);
  background: var(--white);
}

.fit-card--no {
  background: #edf1f0;
}

.fit-card--no > span {
  color: var(--orange);
}

.fit-card ul {
  display: grid;
  gap: 20px;
  margin: 54px 0 0;
  padding: 0;
  list-style: none;
}

.fit-card li {
  position: relative;
  padding-left: 28px;
  font-size: 15px;
}

.fit-card li::before {
  content: "+";
  position: absolute;
  left: 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-weight: 700;
}

.fit-card--no li::before {
  content: "×";
  color: var(--orange);
}

.deliverable-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--line);
}

.deliverable-grid article {
  min-height: 300px;
  padding: 30px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.deliverable-grid article > span {
  display: inline-grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid var(--blue);
  border-radius: 50%;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
}

.deliverable-grid h3 {
  margin: 58px 0 16px;
  font-family: var(--font-display);
  font-size: 25px;
  font-weight: 600;
  letter-spacing: -0.04em;
  line-height: 1.05;
}

.deliverable-grid p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
}

.sequence-list {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--ink);
  list-style: none;
}

.sequence-list li {
  display: grid;
  grid-template-columns: 0.32fr 1.48fr;
  gap: 40px;
  padding: 34px 0;
  border-bottom: 1px solid var(--line);
}

.sequence-list > li > span {
  color: var(--blue);
  font-family: var(--font-display);
  font-size: clamp(38px, 5vw, 68px);
  font-weight: 500;
  letter-spacing: -0.06em;
  line-height: 1;
}

.sequence-list h3 {
  margin: 0 0 8px;
  font-family: var(--font-display);
  font-size: 27px;
  font-weight: 600;
  letter-spacing: -0.04em;
}

.sequence-list p {
  max-width: 730px;
  margin: 0;
  color: var(--ink-soft);
}

.service-evidence {
  padding-block: clamp(50px, 7vw, 90px);
}

.evidence-panel {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  align-items: end;
  gap: 80px;
  padding: clamp(44px, 7vw, 84px);
  background: var(--blue);
  color: var(--white);
}

.evidence-panel::after {
  content: "";
  position: absolute;
  top: -170px;
  right: -110px;
  width: 380px;
  height: 380px;
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 50%;
}

.evidence-panel .eyebrow {
  color: var(--white);
}

.evidence-panel .eyebrow span {
  background: var(--mint);
}

.evidence-panel h2 {
  max-width: 680px;
  margin: 24px 0 0;
  font-family: var(--font-display);
  font-size: clamp(40px, 5vw, 70px);
  font-weight: 600;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.evidence-panel p:not(.eyebrow) {
  max-width: 690px;
  color: rgba(255, 255, 255, 0.78);
}

.evidence-panel-actions {
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 22px;
}

.evidence-panel-actions .button {
  background: var(--mint);
  color: var(--ink);
}

.evidence-panel-actions > a:last-child {
  color: var(--white);
  font-size: 13px;
  text-decoration: underline;
  text-underline-offset: 5px;
}

.service-faq .faq-list {
  max-width: 880px;
  margin-left: auto;
}

.service-next {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  align-items: end;
  gap: 80px;
  margin-bottom: var(--section-space);
  padding: clamp(48px, 7vw, 88px);
  background: var(--ink);
  color: var(--white);
}

.service-next h2 {
  margin: 22px 0 18px;
  font-family: var(--font-display);
  font-size: clamp(42px, 5.5vw, 74px);
  font-weight: 600;
  letter-spacing: -0.055em;
  line-height: 0.96;
}

.service-next p:not(.eyebrow) {
  max-width: 640px;
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
}

.service-next-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 22px;
}

.service-next-actions > a:last-child {
  color: var(--mint);
  font-size: 13px;
}

.resources-hero {
  border-bottom: 1px solid var(--line);
}

.resource-layout {
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: clamp(50px, 8vw, 120px);
  padding-block: clamp(70px, 9vw, 120px);
}

.resource-toc {
  position: sticky;
  top: 112px;
  height: max-content;
  display: grid;
  border-top: 1px solid var(--ink);
}

.resource-toc > span {
  padding: 18px 0;
  color: var(--blue);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.09em;
}

.resource-toc a {
  padding: 14px 0;
  border-top: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: 12px;
  transition: color 180ms ease, padding-left 180ms ease;
}

.resource-toc a:hover {
  padding-left: 6px;
  color: var(--blue);
}

.resource-content {
  min-width: 0;
}

.resource-entry {
  scroll-margin-top: 96px;
  display: grid;
  grid-template-columns: 0.24fr 1fr;
  gap: 24px 46px;
  padding: 0 0 clamp(76px, 10vw, 130px);
  margin-bottom: clamp(76px, 10vw, 130px);
  border-bottom: 1px solid var(--ink);
}

.resource-heading h2 {
  max-width: 780px;
  margin: 14px 0 22px;
  font-family: var(--font-display);
  font-size: clamp(38px, 5vw, 66px);
  font-weight: 600;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.resource-heading > p:last-child {
  max-width: 770px;
  color: var(--ink-soft);
  font-size: 17px;
}

.resource-body,
.resource-action {
  grid-column: 2;
}

.resource-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  margin-top: 30px;
  background: var(--line);
  border: 1px solid var(--line);
}

.resource-body article {
  padding: 30px;
  background: var(--white);
}

.resource-body h3 {
  margin: 0 0 26px;
  font-family: var(--font-display);
  font-size: 22px;
  letter-spacing: -0.035em;
}

.resource-body ul {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.resource-body li {
  position: relative;
  padding-left: 18px;
  color: var(--ink-soft);
  font-size: 13px;
}

.resource-body li::before {
  content: "";
  position: absolute;
  top: 0.75em;
  left: 0;
  width: 5px;
  height: 5px;
  background: var(--blue);
  border-radius: 50%;
}

.resource-action {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 34px;
  margin-top: 28px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}

.resource-action p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
}

.resource-action .button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.resource-boundary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 8vw, 120px);
  padding-block: var(--section-space);
  border-top: 1px solid var(--line);
}

.resource-boundary h2 {
  margin: 20px 0 0;
  font-family: var(--font-display);
  font-size: clamp(40px, 5vw, 68px);
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.resource-boundary > div:last-child {
  padding-top: 35px;
  color: var(--ink-soft);
}

.resource-boundary a {
  display: inline-block;
  margin-top: 20px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 650;
}

@media (max-width: 1100px) {
  .hero {
    grid-template-columns: 1fr;
    gap: 70px;
    padding-top: 160px;
  }

  .hero-copy {
    max-width: 820px;
  }

  .release-map {
    width: min(780px, 100%);
    margin-inline: auto;
  }

  .proof-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .proof-grid > p {
    grid-column: 1 / -1;
    min-height: 64px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 12px 0;
  }

  .proof-grid > div:first-of-type {
    padding-left: 0;
  }

  .capability-panel {
    grid-template-columns: 1fr 150px;
    column-gap: 30px;
  }

  .capability-icon {
    width: 150px;
    height: 150px;
    padding: 19px;
  }

  .delivery-track li {
    padding-inline: 20px;
  }

  .start-conditions {
    grid-template-columns: 1fr;
  }

  .service-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.7fr);
    gap: 50px;
  }

  .service-card-grid,
  .deliverable-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .section-intro {
    grid-template-columns: 0.25fr 1fr;
  }

  .section-intro > p:last-child:not(:first-child) {
    grid-column: 2;
  }
}

@media (max-width: 860px) {
  :root {
    --shell: min(100% - 36px, 720px);
  }

  .desktop-nav,
  .nav-cta {
    display: none;
  }

  .nav-shell {
    min-height: 74px;
    grid-template-columns: 1fr auto;
  }

  .menu-toggle {
    display: flex;
  }

  .hero {
    min-height: 0;
    padding-top: 130px;
  }

  .section-heading,
  .readiness-layout,
  .questions,
  .release-contract__intro {
    grid-template-columns: 1fr;
  }

  .release-contract__intro .micro-label {
    grid-column: 1;
  }

  .section-heading {
    gap: 30px;
  }

  .section-heading > p {
    max-width: 620px;
  }

  .system-grid {
    grid-template-columns: 1fr;
  }

  .system-tabs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border-right: 0;
    border-bottom: 1px solid var(--ink);
  }

  .system-tab {
    min-height: 72px;
    border-right: 1px solid var(--line);
    padding-inline: 22px;
  }

  .system-tab:nth-child(2n) {
    border-right: 0;
  }

  .system-tab:nth-child(3) {
    border-bottom: 0;
  }

  .system-tab:hover,
  .system-tab.is-active {
    padding-left: 27px;
  }

  .readiness-layout {
    gap: 60px;
  }

  .engagement-grid,
  .governance-grid {
    grid-template-columns: 1fr;
  }

  .evidence-grid {
    grid-template-columns: 1fr;
  }

  .evidence-card {
    min-height: 330px;
  }

  .evidence-card > svg {
    margin-block: 32px 22px;
  }

  .governance-grid {
    gap: 58px;
  }

  .trust-preview__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .standards-copy {
    max-width: 640px;
  }

  .delivery-track {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 54px;
  }

  .delivery-track::before {
    display: none;
  }

  .delivery-track li:nth-child(2) {
    border-right: 0;
  }

  .delivery-track li:nth-child(3) {
    padding-left: 0;
  }

  .delivery-track li {
    min-height: 300px;
  }

  .product-types-grid {
    grid-template-columns: 1fr;
    gap: 45px;
  }

  .product-types .button {
    grid-column: 1;
  }

  .fit-boundary {
    grid-column: 1;
  }

  .questions-title {
    position: static;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }

  .trust-status-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .trust-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .trust-toc {
    position: static;
    grid-template-columns: repeat(3, 1fr);
    border-left: 1px solid var(--line);
  }

  .trust-toc > span {
    grid-column: 1 / -1;
    padding-left: 14px;
  }

  .trust-toc a {
    border-right: 1px solid var(--line);
    padding-inline: 14px;
  }

  .footer-meta {
    grid-column: 1 / -1;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding-top: 24px;
    border-top: 1px solid var(--line);
  }

  .not-found {
    grid-template-columns: 1fr;
    align-content: center;
    gap: 42px;
  }

  .not-found__code {
    font-size: clamp(120px, 36vw, 230px);
  }

  .service-hero-grid,
  .fit-grid,
  .evidence-panel,
  .service-next,
  .resource-boundary {
    grid-template-columns: 1fr;
  }

  .service-hero-grid {
    align-items: start;
  }

  .service-hero-copy {
    max-width: 680px;
  }

  .principle-strip {
    grid-template-columns: repeat(2, 1fr);
  }

  .principle-strip article:nth-child(2) {
    border-right: 0;
  }

  .principle-strip article:nth-child(3) {
    padding-left: 0;
  }

  .section-intro {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .section-intro > p:last-child:not(:first-child) {
    grid-column: 1;
    max-width: 650px;
  }

  .service-next {
    gap: 42px;
  }

  .resource-layout {
    grid-template-columns: 1fr;
    gap: 50px;
  }

  .resource-toc {
    position: static;
    grid-template-columns: 1fr 1fr;
    border-left: 1px solid var(--line);
  }

  .resource-toc > span {
    grid-column: 1 / -1;
    padding-left: 14px;
  }

  .resource-toc a {
    padding-inline: 14px;
    border-right: 1px solid var(--line);
  }
}

@media (max-width: 620px) {
  :root {
    --shell: calc(100% - 28px);
    --section-space: 82px;
  }

  html {
    scroll-padding-top: 74px;
  }

  .hero {
    gap: 54px;
    padding-top: 114px;
    padding-bottom: 62px;
  }

  .hero h1 {
    font-size: clamp(50px, 15vw, 68px);
  }

  .hero-lede {
    font-size: 16px;
  }

  .hero-actions {
    align-items: flex-start;
    flex-direction: column;
    gap: 18px;
  }

  .hero-actions .button {
    width: 100%;
  }

  .hero-note {
    align-items: flex-start;
  }

  .release-map::after {
    width: 24px;
    height: 24px;
    top: -12px;
    right: 28px;
  }

  .map-topline,
  .map-footer {
    padding-inline: 12px;
  }

  .map-canvas {
    height: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 22px 12px;
    background-image: none;
  }

  .map-lines {
    display: none;
  }

  .map-input,
  .map-output,
  .map-core,
  .gate {
    position: relative;
    inset: auto;
    width: auto;
    transform: none;
  }

  .map-input {
    left: auto;
    min-height: 72px;
    padding: 9px;
  }

  .map-input strong {
    font-size: 10px;
  }

  .map-core {
    grid-column: 1 / -1;
    width: 172px;
    height: 172px;
    margin: 34px auto;
  }

  .map-output {
    grid-column: span 3;
    width: 100%;
  }

  .gate {
    grid-column: span 3;
    width: max-content;
    margin: 5px auto;
  }

  .map-footer > span:first-child {
    max-width: 170px;
  }

  .proof-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .proof-grid > div {
    min-height: 104px;
    padding: 20px 15px;
    border-bottom: 1px solid var(--line);
  }

  .proof-grid > div:nth-of-type(2) {
    border-right: 0;
  }

  .proof-grid > div:nth-of-type(3) {
    grid-column: 1 / -1;
    padding-left: 0;
    border-right: 0;
    border-bottom: 0;
  }

  .proof-grid > div:last-child {
    border-bottom: 0;
  }

  .section-heading,
  .section-heading--compact {
    margin-bottom: 45px;
  }

  .section-heading h2,
  .product-types h2,
  .governance-section h2,
  .trust-preview h2,
  .questions h2,
  .closing h2 {
    font-size: clamp(42px, 13vw, 60px);
  }

  .system-tabs {
    grid-template-columns: 1fr;
  }

  .system-tab,
  .system-tab:nth-child(3) {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .system-tab:last-child {
    border-bottom: 0;
  }

  .capability-panel {
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 28px 22px 30px;
  }

  .capability-meta {
    width: 100%;
    margin-bottom: 28px;
  }

  .capability-icon {
    order: 1;
    width: 132px;
    height: 132px;
    align-self: flex-start;
    margin-bottom: 28px;
    padding: 16px;
  }

  .capability-panel h3 {
    order: 2;
  }

  .capability-panel > p {
    order: 3;
  }

  .capability-list {
    order: 4;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .engagement-card {
    min-height: 0;
    padding: 25px 20px;
  }

  .engagement-card dl div {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .start-conditions {
    margin-top: 28px;
    padding: 26px 20px;
  }

  .start-conditions ul {
    grid-template-columns: 1fr;
  }

  .start-conditions li {
    min-height: 112px;
  }

  .card-action {
    margin: 24px -20px -25px;
    padding-inline: 20px;
  }

  .evidence-card {
    min-height: 360px;
    padding: 24px 20px;
  }

  .evidence-note {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 20px;
  }

  .release-contract {
    margin-top: 68px;
  }

  .contract-row--head {
    display: none;
  }

  .contract-row {
    grid-template-columns: 1fr;
    margin-bottom: 14px;
    border-top: 1px solid var(--ink);
  }

  .contract-row > * {
    min-height: 0;
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 12px;
    padding: 13px 15px;
  }

  .contract-row > *::before {
    content: attr(data-label);
    color: var(--blue);
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0.05em;
    text-transform: uppercase;
  }

  .fit-boundary {
    grid-template-columns: 1fr;
  }

  .readiness-scorecard li {
    min-height: 66px;
    align-items: flex-start;
    padding: 15px;
  }

  .readiness-scorecard li b {
    padding-top: 4px;
  }

  .readiness-scorecard li span {
    line-height: 1.4;
  }

  .readiness-scorecard li i {
    flex: 0 0 16px;
  }

  .delivery-track {
    grid-template-columns: 1fr;
    row-gap: 0;
  }

  .delivery-track li,
  .delivery-track li:nth-child(3) {
    min-height: 0;
    margin-bottom: 38px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 0 0 36px;
  }

  .delivery-track li:last-child {
    margin-bottom: 0;
    border-bottom: 0;
  }

  .delivery-track h3 {
    min-height: 0;
  }

  .type-list {
    grid-template-columns: 1fr;
  }

  .type-list :where(span, a):nth-child(odd) {
    border-right: 0;
  }

  .product-types .button {
    width: 100%;
  }

  .trust-preview__head {
    align-items: stretch;
    flex-direction: column;
    margin-bottom: 38px;
  }

  .trust-preview__head .button {
    width: 100%;
  }

  .trust-preview__grid {
    grid-template-columns: 1fr;
  }

  .trust-preview__grid article {
    min-height: 220px;
  }

  .faq-list summary {
    min-height: 84px;
    font-size: 18px;
  }

  .faq-list details p {
    margin-right: 0;
  }

  .closing {
    width: 100%;
  }

  .closing-card {
    padding: 56px 22px;
  }

  .closing-card .button {
    width: 100%;
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  .footer-meta {
    grid-column: 1;
  }

  .trust-hero {
    padding-top: 125px;
    padding-bottom: 62px;
  }

  .trust-hero h1 {
    font-size: clamp(55px, 17vw, 76px);
  }

  .trust-hero > p:not(.eyebrow) {
    font-size: 16px;
  }

  .trust-status-grid {
    grid-template-columns: 1fr;
    margin-top: 40px;
  }

  .trust-toc {
    grid-template-columns: 1fr 1fr;
  }

  .trust-section {
    padding-block: 50px;
  }

  .trust-callout,
  .trust-checklist,
  .principle-grid {
    grid-template-columns: 1fr;
  }

  .trust-download {
    width: 100%;
    justify-content: space-between;
  }

  .trust-callout {
    gap: 8px;
  }

  .brief-dialog {
    width: calc(100vw - 18px);
    max-height: calc(100vh - 18px);
  }

  .brief-form-wrap,
  .brief-result {
    padding: 28px 18px 34px;
  }

  .brief-row {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .result-actions {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .not-found {
    gap: 30px;
    padding-top: 110px;
  }

  .not-found .hero-actions {
    width: 100%;
  }

  .breadcrumbs {
    margin-bottom: 42px;
  }

  .service-hero {
    padding-top: 112px;
    padding-bottom: 70px;
  }

  .service-hero h1,
  .service-detail-page .service-hero h1 {
    font-size: clamp(48px, 14vw, 64px);
  }

  .service-hero-copy p:first-child {
    font-size: 20px;
  }

  .service-hero-copy .button {
    width: 100%;
  }

  .service-facts {
    grid-template-columns: 1fr;
  }

  .service-facts > div,
  .service-facts > div:first-child {
    min-height: 92px;
    padding-inline: 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .service-facts > div:last-child {
    border-bottom: 0;
  }

  .service-card-grid,
  .deliverable-grid,
  .principle-strip,
  .resource-body,
  .resource-action {
    grid-template-columns: 1fr;
  }

  .service-card {
    min-height: 390px;
    padding-inline: 24px;
  }

  .principle-strip article,
  .principle-strip article:first-child,
  .principle-strip article:nth-child(3) {
    min-height: 230px;
    padding-inline: 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .principle-strip h3 {
    margin-top: 42px;
  }

  .fit-card {
    min-height: 0;
    padding: 34px 24px;
  }

  .fit-card ul {
    margin-top: 38px;
  }

  .deliverable-grid article {
    min-height: 270px;
    padding-inline: 24px;
  }

  .sequence-list li {
    grid-template-columns: 60px 1fr;
    gap: 18px;
  }

  .sequence-list > li > span {
    font-size: 36px;
  }

  .sequence-list h3 {
    font-size: 23px;
  }

  .evidence-panel,
  .service-next {
    padding: 42px 24px;
  }

  .evidence-panel-actions,
  .service-next-actions {
    align-items: stretch;
  }

  .evidence-panel-actions .button,
  .service-next-actions .button {
    width: 100%;
  }

  .resource-toc {
    grid-template-columns: 1fr;
  }

  .resource-entry {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .resource-heading,
  .resource-body,
  .resource-action {
    grid-column: 1;
  }

  .resource-heading h2 {
    font-size: clamp(38px, 12vw, 54px);
  }

  .resource-action {
    align-items: stretch;
  }

  .resource-action .button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .js .reveal {
    opacity: 1;
    transform: none;
  }
}

/*
 * Contextual sibling links. The six service pages are the commercial pages but
 * were receiving the least internal link equity (3–7 inbound vs 41–43 for the
 * hubs), so each one now links to its two nearest neighbours in-body.
 */
.service-related {
  padding-bottom: var(--section-space);
}

.service-related h2 {
  margin: 0 0 22px;
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 500;
  letter-spacing: -0.025em;
}

.service-related ul {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.service-related li {
  border-bottom: 1px solid var(--line);
}

.service-related a {
  display: flex;
  min-height: 64px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 12px 0;
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 500;
}

.service-related a span {
  color: var(--ink-soft);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 400;
  text-align: right;
}

.service-related a:hover {
  color: var(--blue);
}

@media (max-width: 640px) {
  .service-related a {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .service-related a span {
    text-align: left;
  }
}

/*
 * Accessibility corrections found by an all-pages sweep.
 * 1. --orange on the light "not a fit" card was 2.9:1. A deeper shade clears
 *    AA; the bright orange stays for fills and rules, where it is decorative.
 * 2. Standalone action links and breadcrumb links ran 16–21px tall, below the
 *    24px WCAG 2.2 target minimum. These are not inline sentence links, so the
 *    2.5.8 inline exception does not apply.
 * 3. .trust-fineprint sat at 4.48:1 — just under AA.
 */
:root {
  --orange-deep: #b03c0c;
}

.fit-card--no > span,
.fit-card--no li::before {
  color: var(--orange-deep);
}

.trust-fineprint {
  color: #5c6b74;
}

.breadcrumbs a,
.service-next-actions a,
.evidence-panel-actions a,
.resource-boundary a,
.resource-action a,
.trust-download a,
a[download] {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
}

/*
 * Deliverable grids on the resource and comparison pages list parallel items,
 * so they carry no ordinal badge. Reclaim the space the badge occupied.
 */
.deliverable-grid--plain article {
  min-height: 0;
  padding: 28px 30px 32px;
}

.deliverable-grid--plain article h3 {
  margin-top: 0;
}

/* Same treatment as .service-related, used where the list is the section body. */
.service-choose {
  padding-bottom: var(--section-space);
}

.service-related-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.service-related-list li {
  border-bottom: 1px solid var(--line);
}

.service-related-list a {
  display: flex;
  min-height: 64px;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  padding: 22px 0;
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 500;
}

.service-related-list a span {
  max-width: 68ch;
  color: var(--ink-soft);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
}

.service-related-list a:hover {
  color: var(--blue);
}

.service-considerations {
  padding-bottom: var(--section-space);
}

.service-failures {
  padding-bottom: var(--section-space);
}

/*
 * Case studies. Deliberately quiet: the credibility has to come from the
 * specifics, not from decoration around them.
 */
.case-study {
  padding-bottom: var(--section-space);
  border-top: 1px solid var(--line);
  padding-top: clamp(48px, 6vw, 82px);
}

.case-study__intro {
  max-width: 74ch;
  margin-bottom: 34px;
}

.case-study__intro h2 {
  margin: 12px 0 18px;
  font-family: var(--font-display);
  font-size: clamp(30px, 4vw, 44px);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.05;
}

.case-study__lead {
  margin: 0;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.6;
}

.case-study .service-facts {
  margin-bottom: 34px;
}

.case-study__boundary {
  max-width: 82ch;
  margin: 26px 0 0;
  padding-left: 16px;
  border-left: 2px solid var(--line);
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.6;
}

/*
 * Links inside running prose. Without this they inherit body colour with no
 * underline, which makes them indistinguishable from surrounding text —
 * a WCAG 1.4.1 failure, and it hides the one link on a case study that lets
 * a reader verify the work for themselves.
 */
.case-study__lead a,
.case-study__boundary a,
.section-heading p a,
.service-hero-copy p a,
.resource-boundary p a {
  color: var(--blue);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

.case-study__lead a:hover,
.case-study__boundary a:hover,
.section-heading p a:hover,
.service-hero-copy p a:hover,
.resource-boundary p a:hover {
  color: var(--blue-dark);
  text-decoration-thickness: 2px;
}

/* ------------------------------------------------------------------------ *
 * Analytics consent banner
 *
 * Created by script.js rather than sitting in the markup, so these rules have
 * no matching element until a measurement ID is configured and the visitor has
 * not yet chosen. It is a non-modal region: desktop keeps it bottom-anchored,
 * while narrow screens place it in the document flow so it cannot cover the
 * primary CTA. The page remains readable and operable — see script.js.
 * ------------------------------------------------------------------------ */
.consent-banner {
  position: fixed;
  z-index: 90;
  right: 16px;
  bottom: max(12px, env(safe-area-inset-bottom));
  left: 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  max-width: 720px;
  margin: 0 auto;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 16px 18px;
  background: var(--white);
  box-shadow: 4px 4px 0 var(--mint);
  animation: consent-rise 220ms ease-out;
}

.consent-banner:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 3px;
}

.consent-banner__copy {
  flex: 1 1 320px;
  min-width: 0;
}

.consent-banner__copy strong {
  display: block;
  margin-bottom: 3px;
  font-family: var(--font-display);
  font-size: 14px;
}

.consent-banner__copy p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.45;
}

.consent-banner__copy a {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.consent-banner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.consent-banner__actions .button {
  min-height: 44px;
  padding-inline: 16px;
  font-size: 13px;
}

@keyframes consent-rise {
  from {
    transform: translateY(12px);
    opacity: 0;
  }
}

@media (max-width: 560px) {
  .consent-banner {
    position: relative;
    z-index: 40;
    right: auto;
    bottom: auto;
    left: auto;
    flex-wrap: nowrap;
    gap: 8px;
    max-width: none;
    margin: 74px 0 0;
    padding: 1px 8px;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .consent-banner + main .hero,
  .consent-banner + main .service-hero,
  .consent-banner + main .trust-hero {
    padding-top: 32px;
  }

  .consent-banner__copy {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 8px;
  }

  .consent-banner__copy strong {
    display: none;
  }

  .consent-banner__copy p {
    flex: 0 0 auto;
    font-size: 12px;
    white-space: nowrap;
  }

  .consent-banner__copy p span {
    display: none;
  }

  .consent-banner__actions {
    flex: 0 0 auto;
    flex-wrap: nowrap;
    width: auto;
    gap: 4px;
  }

  .consent-banner__actions .button {
    flex: 0 0 auto;
    justify-content: center;
    padding-inline: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .consent-banner {
    animation: none;
  }
}