/* Raisecove Advisory shared styles.
   Refined editorial presentation is scoped to body.advisory-refined below.
   Legacy components remain during content migration. Hero provenance: DESIGN.md.
   No reference assets are reproduced. */

/* ---------------------------------------------------------------- tokens */
:root {
  --dark: #0f0f0f;
  --hero: #0a0a0a;
  --stone: #e9e7e2;
  --white: #ffffff;
  --ink: #1c1e22;
  --light-text: #f5f5f5;
  --muted: #b8c2bd;
  --forest: #245b45;
  --forest-hover: #2c6b50;
  --mint: #c8e8d5;
  /* Validation and failure text on the dark contact panel: 7.9:1 on the teal
     contact canvas, higher over the panel's darker overlay. */
  --alert: #ffd2b8;
  --contact: #184244;
  --surface: #0e1215;
  --line-dark: rgb(245 245 245 / 14%);
  --line-light: rgb(28 30 34 / 14%);

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-panel: 16px;

  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --space-xl: 48px;
  --space-split: 64px;
  --space-stage: 80px;
  --space-section: 96px;

  --container: 1400px;
  --editorial: 1152px;
  --console: 896px;
  --intro: 768px;
  --gutter: 24px;
  --header-h: 96px;

  --serif: "Libre Caslon Text", Georgia, "Times New Roman", serif;
  --sans: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --shadow-card: 0 2px 12px -2px rgb(0 0 0 / 40%);
  --shadow-card-hover: 0 4px 20px -4px rgb(0 0 0 / 50%);
}

/* ------------------------------------------------------------------ base */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  background: var(--dark);
  color: var(--light-text);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.5;
}

img,
svg { max-width: 100%; }

svg { display: block; }

h1, h2, h3, h4 {
  font-family: var(--serif);
  margin: 0;
  font-weight: 700;
}

p { margin: 0; }

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

a { color: inherit; }

:where(button, input, textarea, select) { font: inherit; color: inherit; }

:target { scroll-margin-top: 112px; }

section[id],
[id] { scroll-margin-top: 112px; }

:focus-visible {
  outline: 2px solid var(--mint);
  outline-offset: 3px;
  border-radius: 2px;
}

.section-light :focus-visible,
.section-stone :focus-visible { outline-color: var(--forest); }

.skip-link {
  position: absolute;
  left: var(--gutter);
  top: 8px;
  z-index: 60;
  padding: 12px 20px;
  background: var(--mint);
  color: var(--ink);
  font-weight: 600;
  border-radius: var(--radius-sm);
  transform: translateY(-160%);
}

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

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* -------------------------------------------------------------- utilities */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.measure { max-width: 68ch; }

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

.section-dark { background: var(--dark); color: var(--light-text); }

.section-stone { background: var(--stone); color: var(--ink); }

.eyebrow {
  font-size: 14px;
  line-height: 1.4286;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mint);
  margin: 0;
}

.section-stone .eyebrow { color: var(--forest); }

.lead { font-size: 18px; line-height: 1.5556; }

.small { font-size: 14px; line-height: 1.625; }

.section-title { font-size: 30px; line-height: 1.2; }

@media (min-width: 768px) {
  .section-title { font-size: 36px; line-height: 1.1112; }
}

.section-intro {
  max-width: var(--intro);
  margin-inline: auto;
  text-align: center;
}

.section-intro > * + * { margin-top: var(--space-sm); }

.muted { color: var(--muted); }

.section-stone .muted { color: var(--ink); }

/* ------------------------------------------------------------- buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 24px;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 200ms ease, transform 200ms ease, border-color 200ms ease;
}

.btn-primary { background: var(--forest); color: var(--light-text); }

.btn-primary:hover { background: var(--forest-hover); transform: translateY(-2px); }

.btn-secondary {
  background: transparent;
  color: var(--mint);
  border-color: var(--mint);
}

.btn-secondary:hover { background: rgb(200 232 213 / 12%); transform: translateY(-2px); }

.section-stone .btn-secondary { color: var(--forest); border-color: var(--forest); }

.section-stone .btn-secondary:hover { background: rgb(36 91 69 / 10%); }

.btn-mint {
  background: var(--mint);
  color: var(--ink);
  border-color: var(--mint);
  font-weight: 600;
}

.btn-mint:hover { background: #dcf2e5; transform: translateY(-2px); }

.btn-block { width: 100%; }

.cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
}

/* Once the row has to stack, ragged button widths look accidental. */
@media (max-width: 639px) {
  .cta-row { flex-direction: column; align-items: stretch; }
  .cta-row .btn { width: 100%; }
}

.cta-center {
  display: flex;
  justify-content: center;
  margin-top: var(--space-xl);
}

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

.site-header.is-solid,
.site-header.is-open {
  background: rgb(15 15 15 / 95%);
  border-bottom-color: var(--line-dark);
}

@supports (backdrop-filter: blur(24px)) {
  .site-header.is-solid,
  .site-header.is-open { backdrop-filter: blur(24px); }
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  min-height: var(--header-h);
  padding-block: var(--space-sm);
}

.brand {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-width: 0;
  text-decoration: none;
  color: var(--light-text);
}

.brand-mark { width: 34px; height: 34px; flex: none; }

.brand-text {
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.3334;
  font-weight: 400;
  letter-spacing: 0.6px;
  min-width: 0;
}

@media (min-width: 400px) {
  .brand-text { font-size: 24px; white-space: nowrap; }
}

/* ------------------------------------------------------------ navigation */
/* One navigation tree serves both breakpoints. Below 1024px it is an
   accordion inside the menu panel; at 1024px and above the same markup
   becomes a row of dropdowns. Closed links are display:none, so they are
   never focusable, and no navigation is created by script. */
.nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex: none;
  background: transparent;
  border: 1px solid rgb(245 245 245 / 45%);
  border-radius: var(--radius-sm);
  color: var(--light-text);
  cursor: pointer;
}

.nav-toggle-glyph { width: 24px; height: 24px; }

.nav-wrap {
  display: none;
  position: absolute;
  inset: 100% 0 auto;
  /* Fully opaque: the open menu must never let page text show through. */
  background: var(--dark);
  border-top: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);
  max-height: calc(100svh - var(--header-h));
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--space-xs) var(--gutter) var(--space-md);
}

.site-header.is-open .nav-wrap { display: block; }

.nav-list {
  display: flex;
  flex-direction: column;
}

.nav-group + .nav-group { border-top: 1px solid var(--line-dark); }

.nav-group-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xs);
  width: 100%;
  min-height: 48px;
  padding-block: 12px;
  background: transparent;
  border: 0;
  color: var(--light-text);
  font-size: 16px;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
}

.nav-caret { width: 18px; height: 18px; flex: none; color: var(--mint); }

@media (prefers-reduced-motion: no-preference) {
  .nav-caret { transition: transform 200ms ease; }
}

.nav-group.is-open > .nav-group-button .nav-caret { transform: rotate(180deg); }

.nav-menu {
  display: none;
  padding-bottom: var(--space-xs);
}

.nav-group.is-open > .nav-menu { display: block; }

/* Without script the dropdowns still open on keyboard focus and hover. */
html:not(.js) .nav-group:focus-within > .nav-menu { display: block; }

.nav-menu a {
  display: block;
  padding: 10px var(--space-sm);
  border-left: 2px solid var(--line-dark);
  text-decoration: none;
  color: var(--light-text);
}

.nav-menu a:hover { border-left-color: var(--mint); }

.nav-menu-label { display: block; font-size: 15px; line-height: 1.4667; }

/* 14px is the documented floor for meaningful text; this note was below it. */
.nav-menu-note {
  display: block;
  font-size: 14px;
  line-height: 1.4286;
  color: var(--muted);
}

.nav-menu a[aria-current="page"] {
  border-left-color: var(--mint);
  background: rgb(200 232 213 / 10%);
}

.nav-menu a[aria-current="page"] .nav-menu-label { color: var(--mint); font-weight: 600; }

.nav-cta {
  display: inline-flex;
  width: 100%;
  margin-top: var(--space-md);
}

@media (min-width: 1024px) {
  .nav-toggle { display: none; }

  .nav-wrap,
  .site-header.is-open .nav-wrap {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    position: static;
    background: transparent;
    border: 0;
    max-height: none;
    overflow: visible;
    padding: 0;
  }

  .nav-list { flex-direction: row; align-items: center; gap: var(--space-sm); }

  .nav-group { position: relative; }

  .nav-group + .nav-group { border-top: 0; }

  .nav-group-button {
    width: auto;
    min-height: 0;
    gap: 4px;
    padding-block: 6px;
    font-size: 14px;
    line-height: 1.4286;
    border-bottom: 1px solid transparent;
  }

  .nav-group-button:hover,
  .nav-group.is-open > .nav-group-button,
  .nav-group.is-current > .nav-group-button { border-bottom-color: var(--mint); }

  .nav-caret { width: 14px; height: 14px; }

  .nav-menu {
    --nav-menu-gap: 14px;
    position: absolute;
    top: calc(100% + var(--nav-menu-gap));
    left: -12px;
    z-index: 10;
    min-width: 280px;
    padding: var(--space-xs) 0;
    background: var(--surface);
    border: 1px solid var(--line-dark);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-card);
  }

  /* Keep the visual gap inside the submenu's pointer area. Without this
     bridge, crossing it fires pointerleave and closes an unfocused menu.
     Include its top border so the bridge meets the trigger without a seam. */
  .nav-menu::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: -1px;
    right: -1px;
    height: calc(var(--nav-menu-gap) + 1px);
  }

  .nav-menu a { border-left: 0; border-inline-start: 2px solid transparent; }

  .nav-menu a:hover { background: rgb(245 245 245 / 8%); border-inline-start-color: var(--mint); }

  .nav-cta { width: auto; margin-top: 0; }
}

/* Hover is an enhancement on pointer devices only; click and keyboard remain
   the primary way to open a dropdown. */
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  html:not(.js) .nav-group:hover > .nav-menu { display: block; }
}

/* The tightest desktop row: six group buttons, the CTA and the wordmark share
   976px of container. The wordmark keeps its full measure and the group gaps
   give up 4px each, rather than letting the brand shrink below its own text. */
@media (min-width: 1024px) and (max-width: 1279px) {
  .brand-text { font-size: 20px; }
  .brand { flex: none; }
  .header-inner { gap: var(--space-sm); }
  .nav-list { gap: 12px; }
}

@media (min-width: 1440px) {
  .nav-list { gap: var(--space-lg); }
}

/* ------------------------------------------------------------------ hero */
.hero {
  background: var(--hero);
  min-height: 100svh;
  padding-block: calc(var(--header-h) + 64px) 96px;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.hero-media,
.hero-media::after,
.hero-poster,
.hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.hero-poster,
.hero-video { object-fit: cover; object-position: 54% center; }

.hero-video { opacity: 0; }
.hero-video.is-playing { opacity: 1; }

/* Even the brightest frame stays below the contrast ceiling for the copy. */
.hero-media::after {
  content: "";
  background: linear-gradient(180deg, rgb(7 19 16 / 78%), rgb(7 19 16 / 60%) 30%, rgb(7 19 16 / 60%) 70%, rgb(7 19 16 / 80%));
}

.hero-inner { position: relative; z-index: 1; text-align: center; }
.hero-copy { max-width: 900px; margin-inline: auto; }
.hero-copy > * + * { margin-top: var(--space-md); }
.hero .eyebrow { color: var(--light-text); }

.hero-title {
  font-size: clamp(36px, 5.6vw, 80px);
  line-height: 1.12;
  font-weight: 400;
}

.hero-title span { display: block; }

.hero-title .accent { color: var(--mint); }

/* Below 360px the 36px mobile size splits "Growth decisions" and strands a
   single word on its own line. */
@media (max-width: 359px) {
  .hero-title { font-size: 30px; line-height: 1.2667; }
}

.hero-lead { max-width: 62ch; margin-inline: auto; font-size: 18px; line-height: 1.625; color: var(--light-text); }

.hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  justify-content: center;
}

.hero .cta-row { justify-content: center; }
.hero .btn-secondary { background: rgb(7 19 16 / 40%); }
.hero .btn-secondary:hover { background: rgb(7 19 16 / 70%); }

.badge-outline {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: 8px 14px;
  border: 1px solid var(--line-dark);
  border-radius: var(--radius-sm);
  font-size: 14px;
  line-height: 1.4286;
  color: var(--light-text);
}

.badge-outline svg { width: 16px; height: 16px; flex: none; color: var(--mint); }

.draft-note {
  font-size: 14px;
  line-height: 1.625;
  color: var(--light-text);
  max-width: 65ch;
  margin-inline: auto;
}

@media (max-width: 639px) {
  .hero { padding-block: calc(var(--header-h) + 40px) 96px; }
  .hero-copy > * + * { margin-top: 20px; }
  .hero .cta-row { max-width: 360px; margin-inline: auto; }
  .hero-badges { gap: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-video { display: none; }
}

/* --------------------------------------------------------------- console */
.console {
  background: var(--surface);
  border: 1px solid var(--line-dark);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  overflow: hidden;
}

.console-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xs);
  padding: var(--space-sm) var(--space-md);
  border-bottom: 1px solid var(--line-dark);
}

.console-title {
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.5556;
  font-weight: 700;
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--line-dark);
  border-radius: var(--radius-sm);
  font-size: 14px;
  line-height: 1.4286;
  color: var(--muted);
}

.chip-mint { border-color: var(--mint); color: var(--mint); }

.console-body { display: grid; grid-template-columns: 1fr; }

.console-rail {
  display: flex;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  border-bottom: 1px solid var(--line-dark);
  color: var(--muted);
}

.console-rail svg { width: 20px; height: 20px; }

.console-rows { padding: var(--space-sm) var(--space-md); }

.console-row { padding-block: var(--space-sm); }

.console-row + .console-row { border-top: 1px solid var(--line-dark); }

.console-row-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-bottom: var(--space-xs);
}

.console-row p { font-size: 14px; line-height: 1.625; }

.console-row .source { color: var(--muted); }

.console-summary {
  display: grid;
  gap: var(--space-sm);
  margin: 0 var(--space-md) var(--space-md);
  padding: var(--space-sm);
  border: 1px solid var(--line-dark);
  border-radius: var(--radius-md);
}

.console-summary h3 {
  grid-column: 1 / -1;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.4286;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 500;
}

.summary-cell .value {
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.5556;
  color: var(--mint);
}

.summary-cell .label { font-size: 14px; line-height: 1.625; color: var(--muted); }

.console-foot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  padding: var(--space-sm) var(--space-md);
  border-top: 1px solid var(--line-dark);
}

@media (min-width: 640px) {
  .console-summary { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 768px) {
  .console-body { grid-template-columns: 56px 1fr; }
  .console-rail {
    flex-direction: column;
    border-bottom: 0;
    border-right: 1px solid var(--line-dark);
    padding: var(--space-md) 0;
    align-items: center;
  }
  .console-main { min-width: 0; }
  .console-summary { margin-inline: var(--space-md); }
}

/* -------------------------------------------------------------- overview */
.overview-split {
  display: grid;
  gap: var(--space-split);
  margin-bottom: var(--space-split);
}

.overview-copy > * + * { margin-top: var(--space-md); }

.overview-title { font-size: 30px; line-height: 1.2; }

.overview-title .highlight {
  display: inline-block;
  font-family: var(--sans);
  font-size: 24px;
  font-weight: 700;
  background: var(--ink);
  color: var(--light-text);
  padding: 4px 12px;
  margin-bottom: var(--space-xs);
}

.risk-map {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  box-shadow: 0 1px 2px rgb(28 30 34 / 6%);
  overflow: hidden;
}

.risk-map-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-xs);
  padding: var(--space-md);
  border-bottom: 1px solid var(--line-light);
}

.risk-map-head .title { font-family: var(--serif); font-size: 18px; font-weight: 700; }

.risk-columns { display: grid; }

.risk-column { padding: var(--space-md); }

.risk-column + .risk-column { border-top: 1px solid var(--line-light); }

.risk-column-head {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  color: var(--forest);
  font-size: 14px;
  letter-spacing: 0.08em;
}

.risk-column-head svg { width: 18px; height: 18px; }

.risk-column h4 {
  font-size: 16px;
  line-height: 1.5;
  margin-block: var(--space-xs) var(--space-sm);
}

.risk-column li {
  font-size: 14px;
  line-height: 1.625;
  padding: 8px 12px;
  border: 1px solid var(--line-light);
  border-radius: var(--radius-sm);
}

.risk-column li + li { margin-top: var(--space-xs); }

.risk-column.is-primary li { border-color: rgb(36 91 69 / 45%); color: var(--forest); }

.risk-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border-top: 1px solid var(--line-light);
  font-size: 14px;
}

.risk-legend span { display: inline-flex; align-items: center; gap: var(--space-xs); }

.risk-legend .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--forest);
}

.risk-legend .dot.hollow { background: transparent; border: 2px solid var(--ink); }

.overview-cards { display: grid; gap: var(--space-md); }

.overview-card {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.overview-card-head {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
}

.overview-card-head .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--line-light);
  border-radius: var(--radius-sm);
  color: var(--forest);
}

.overview-card-head .icon svg { width: 18px; height: 18px; }

.overview-card-head .num {
  font-family: var(--serif);
  font-size: 18px;
  color: rgb(28 30 34 / 62%);
}

.overview-card h3 { font-size: 24px; line-height: 1.3334; margin-bottom: var(--space-xs); }

/* ---------------------------------------------------------- capabilities */
/* Step 6: the short "what we do" answer, one card per Services page. */
.capabilities { margin-top: var(--space-split); }

.capabilities-head { max-width: var(--intro); }

.capabilities-title { font-size: 24px; line-height: 1.3334; margin-bottom: var(--space-sm); }

.capability-grid {
  display: grid;
  gap: var(--space-md);
  margin-top: var(--space-md);
}

.capability-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-xs);
  padding: var(--space-md);
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  color: var(--ink);
  text-decoration: none;
}

.capability-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin-bottom: var(--space-xs);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-sm);
  color: var(--forest);
}

.capability-icon svg { width: 18px; height: 18px; }

.capability-card h3 { font-size: 18px; line-height: 1.5556; }

.capability-more {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  margin-top: auto;
  padding-top: var(--space-sm);
  color: var(--forest);
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.capability-more svg { width: 16px; height: 16px; }

/* Linked cards may lift; the static overview cards above deliberately do not. */
@media (prefers-reduced-motion: no-preference) {
  .capability-card { transition: transform 300ms ease, box-shadow 300ms ease, border-color 300ms ease; }
}

.capability-card:hover {
  border-color: var(--forest);
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-hover);
}

@media (min-width: 768px) {
  .risk-columns { grid-template-columns: repeat(3, 1fr); }
  .risk-column + .risk-column { border-top: 0; border-left: 1px solid var(--line-light); }
  .overview-cards { grid-template-columns: repeat(3, 1fr); }
  .overview-title { font-size: 36px; line-height: 1.1112; }
  .overview-title .highlight { font-size: 30px; }
  .capabilities-title { font-size: 30px; line-height: 1.2; }
  .capability-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  /* Both columns start on the same line. Optical centering left the copy
     floating below the top of the risk map and opened a gap beneath it. */
  .overview-split { grid-template-columns: 1fr 1fr; align-items: start; }
  .capability-grid { grid-template-columns: repeat(4, 1fr); }
}

/* -------------------------------------------------------------- diagrams */
.diagram {
  width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
}

.diagram-dark {
  background: var(--surface);
  border: 1px solid var(--line-dark);
  padding: var(--space-sm);
  box-shadow: var(--shadow-card);
}

.diagram-light {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-sm);
}

.dg-stroke { fill: none; stroke: var(--mint); stroke-width: 1.5; }
.dg-stroke-soft { fill: none; stroke: var(--line-dark); stroke-width: 1; }
.dg-fill { fill: rgb(200 232 213 / 14%); stroke: var(--mint); stroke-width: 1; }
.dg-panel { fill: rgb(245 245 245 / 4%); stroke: var(--line-dark); stroke-width: 1; }
.dg-node { fill: var(--mint); }
.dg-label { fill: var(--light-text); font-family: var(--sans); font-size: 14px; }
.dg-label-sm { fill: var(--muted); font-family: var(--sans); font-size: 14px; }

.diagram-light .dg-stroke { stroke: var(--forest); }
.diagram-light .dg-stroke-soft { stroke: var(--line-light); }
.diagram-light .dg-fill { fill: rgb(36 91 69 / 10%); stroke: var(--forest); }
.diagram-light .dg-panel { fill: rgb(28 30 34 / 3%); stroke: var(--line-light); }
.diagram-light .dg-node { fill: var(--forest); }
.diagram-light .dg-label { fill: var(--ink); }
.diagram-light .dg-label-sm { fill: rgb(28 30 34 / 70%); }

.diagram-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-top: var(--space-sm);
}

.chip-ink { border-color: rgb(28 30 34 / 25%); color: var(--ink); }

.section-stone .chip { color: var(--ink); border-color: var(--line-light); }

.section-stone .chip-mint { color: var(--forest); border-color: var(--forest); }

.diagram-caption {
  margin-top: var(--space-xs);
  font-size: 14px;
  line-height: 1.625;
  color: var(--muted);
}

.section-stone .diagram-caption { color: var(--ink); }

/* -------------------------------------------------------- systems rows */
.systems { padding-block: var(--space-xl) var(--space-section); }

.systems-mark { display: block; width: 72px; height: 72px; margin: 0 auto var(--space-md); }

.chip-index {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-xs);
  max-width: var(--editorial);
  margin: var(--space-xl) auto 0;
}

.chip-index li {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}

.chip-index .sep { color: var(--muted); }

.mechanism-list { max-width: var(--editorial); margin-inline: auto; }

.mechanism-row {
  display: grid;
  grid-template-areas: "head" "visual" "body";
  gap: var(--space-md);
  padding-block: var(--space-split);
  border-top: 1px solid var(--line-dark);
}

.mechanism-row:first-child { border-top: 0; }

.mechanism-head { grid-area: head; }

.mechanism-visual { grid-area: visual; min-width: 0; }

.mechanism-body { grid-area: body; }

.mechanism-body > * + * { margin-top: var(--space-sm); }

.mechanism-head h3 {
  font-size: 24px;
  line-height: 1.3334;
  margin-top: var(--space-xs);
}

.role-badge {
  display: inline-block;
  padding: 8px 12px;
  border: 1px solid var(--mint);
  border-radius: var(--radius-sm);
  font-size: 14px;
  line-height: 1.4286;
  color: var(--mint);
}

.section-stone .role-badge { border-color: var(--forest); color: var(--forest); }

.systems-console {
  max-width: var(--editorial);
  margin: var(--space-stage) auto 0;
}

@media (min-width: 1024px) {
  /* Spacer rows keep the heading and body centered against a taller diagram. */
  .mechanism-row {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr auto auto 1fr;
    grid-template-areas:
      "visual ."
      "visual head"
      "visual body"
      "visual .";
    column-gap: var(--space-split);
    row-gap: var(--space-md);
    padding-block: var(--space-section);
  }
  .mechanism-row.is-reverse {
    grid-template-areas:
      ". visual"
      "head visual"
      "body visual"
      ". visual";
  }
  .mechanism-visual { align-self: center; }
  .mechanism-head h3 { font-size: 30px; line-height: 1.2; }
}

/* -------------------------------------------------------------- process */
.process-list { max-width: var(--editorial); margin-inline: auto; }

.process-intro { margin-bottom: var(--space-split); }

.process-row {
  display: grid;
  grid-template-areas: "head" "visual" "body";
  gap: var(--space-md);
  padding-block: var(--space-split);
}

/* The intro margin already provides the separation; the first row's own top
   padding on top of it left a visibly empty strip. */
.process-row:first-child { padding-top: 0; }

.process-head { grid-area: head; }

.process-visual { grid-area: visual; min-width: 0; }

.process-body { grid-area: body; }

.process-body > * + * { margin-top: var(--space-sm); }

.stage-number {
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.5556;
  color: var(--forest);
  letter-spacing: 0.08em;
}

.process-head h3 { font-size: 24px; line-height: 1.3334; margin-top: var(--space-xs); }

.process-panel {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
  box-shadow: 0 1px 2px rgb(28 30 34 / 6%);
}

.process-panel > .small:first-child { display: block; margin-bottom: var(--space-sm); }

.process-checklist li {
  display: flex;
  gap: var(--space-xs);
  font-size: 14px;
  line-height: 1.625;
}

.process-checklist li + li { margin-top: var(--space-xs); }

.process-checklist svg { width: 16px; height: 16px; flex: none; margin-top: 4px; color: var(--forest); }

.process-console {
  max-width: var(--console);
  margin: var(--space-stage) auto 0;
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.process-console-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-xs);
  padding: var(--space-md);
  border-bottom: 1px solid var(--line-light);
}

.process-console-grid { display: grid; }

.process-console-cell { padding: var(--space-md); }

.process-console-cell + .process-console-cell { border-top: 1px solid var(--line-light); }

.process-console-cell .label {
  font-size: 14px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgb(28 30 34 / 65%);
}

.process-console-cell .value {
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.5556;
  margin-top: 4px;
}

.process-console-foot {
  padding: var(--space-sm) var(--space-md);
  border-top: 1px solid var(--line-light);
  font-size: 14px;
  line-height: 1.625;
}

@media (min-width: 640px) {
  .process-console-grid { grid-template-columns: repeat(3, 1fr); }
  .process-console-cell + .process-console-cell { border-top: 0; border-left: 1px solid var(--line-light); }
}

@media (min-width: 1024px) {
  .process-row {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr auto auto 1fr;
    grid-template-areas:
      "visual ."
      "visual head"
      "visual body"
      "visual .";
    column-gap: var(--space-stage);
    row-gap: var(--space-md);
    padding-block: var(--space-stage);
  }
  .process-row.is-reverse {
    grid-template-areas:
      ". visual"
      "head visual"
      "body visual"
      ". visual";
  }
  .process-visual { align-self: center; }
  .process-head h3 { font-size: 30px; line-height: 1.2; }
}

/* -------------------------------------------------------------- sectors */
.sector-grid {
  display: grid;
  gap: var(--space-sm);
  margin-top: var(--space-xl);
}

.sector-card {
  background: var(--surface);
  border: 1px solid var(--line-dark);
  border-radius: var(--radius-lg);
  padding: var(--space-md);
  box-shadow: var(--shadow-card);
}

.sector-card .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--mint);
  border-radius: var(--radius-sm);
  color: var(--mint);
  margin-bottom: var(--space-sm);
}

.sector-card .icon svg { width: 20px; height: 20px; }

.sector-card h3 { font-size: 18px; line-height: 1.5556; }

.sector-card ul { margin-top: var(--space-sm); }

.sector-card li {
  display: flex;
  gap: var(--space-xs);
  font-size: 14px;
  line-height: 1.625;
  color: var(--muted);
}

.sector-card li + li { margin-top: 6px; }

.sector-card li::before { content: ""; width: 6px; height: 6px; margin-top: 8px; flex: none; background: var(--mint); border-radius: 50%; }

@media (min-width: 768px) { .sector-grid { grid-template-columns: repeat(2, 1fr); } }

@media (min-width: 1024px) { .sector-grid { grid-template-columns: repeat(4, 1fr); } }

/* ------------------------------------------------------------- evidence */
/* Spacing below the head now comes from the split gap. */
.evidence-head { margin-bottom: 0; }

.badge-light {
  display: inline-block;
  padding: 6px 12px;
  border-radius: var(--radius-sm);
  background: var(--mint);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
}

.evidence-title { font-size: 24px; line-height: 1.25; margin-top: var(--space-sm); }

.evidence-head .lead { margin-top: var(--space-sm); }

/* Step 6 replaced ten empty dashed slots with the rule that governs the band.
   The empty boxes read as unfinished layout and said nothing true. */
.evidence-split { display: grid; gap: var(--space-xl); }

.evidence-rule {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.evidence-rule h3 { font-size: 18px; line-height: 1.5556; margin-bottom: var(--space-sm); }

.evidence-rule ul { display: grid; gap: var(--space-sm); }

.evidence-rule li { display: flex; align-items: flex-start; gap: var(--space-xs); }

.evidence-rule li svg {
  width: 18px;
  height: 18px;
  flex: none;
  margin-top: 3px;
  color: var(--forest);
}

.evidence-rule .small {
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid var(--line-light);
}

.evidence-rule a { color: var(--forest); text-underline-offset: 3px; }

@media (min-width: 768px) {
  .evidence-title { font-size: 30px; line-height: 1.2; }
}

@media (min-width: 1024px) {
  .evidence-split {
    grid-template-columns: 1fr 1fr;
    align-items: start;
    gap: var(--space-split);
  }
}

/* ---------------------------------------------------------- engagements */
.engagement-grid {
  display: grid;
  gap: var(--space-md);
  max-width: var(--editorial);
  margin: var(--space-xl) auto 0;
}

.engagement-card {
  background: var(--surface);
  border: 1px solid var(--line-dark);
  border-radius: var(--radius-lg);
  padding: var(--space-md);
  box-shadow: var(--shadow-card);
}

.engagement-card h3 { font-size: 16px; line-height: 1.5; margin-block: var(--space-xs); }

.engagement-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.engagement-group { margin-top: var(--space-sm); }

.engagement-group .label {
  font-size: 14px;
  line-height: 1.4286;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

.engagement-group p { font-size: 14px; line-height: 1.625; margin-top: 4px; }

.engagement-deliverable {
  margin-top: var(--space-sm);
  padding: var(--space-sm);
  border: 1px solid var(--mint);
  border-radius: var(--radius-md);
}

.engagement-deliverable .label { color: var(--mint); }

.engagement-disclosure {
  display: block;
  margin-top: var(--space-sm);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--line-dark);
  font-size: 14px;
  line-height: 1.625;
  color: var(--muted);
}

@media (min-width: 768px) { .engagement-grid { grid-template-columns: repeat(2, 1fr); } }

/* --------------------------------------------------------------- thesis */
.thesis-inner { max-width: var(--editorial); margin-inline: auto; }

.thesis-head { margin-bottom: var(--space-stage); }

.thesis-title { font-size: 24px; line-height: 1.3334; }

.thesis-argument {
  display: grid;
  grid-template-areas: "head" "visual" "body";
  gap: var(--space-md);
}

.thesis-argument + .thesis-argument { margin-top: var(--space-split); }

.thesis-arg-head { grid-area: head; }

.thesis-arg-visual { grid-area: visual; min-width: 0; }

.thesis-arg-body { grid-area: body; }

.thesis-arg-head h3 { font-size: 24px; line-height: 1.3334; }

.thesis-arg-body > * + * { margin-top: var(--space-sm); }

.thesis-argument.is-wide { grid-template-areas: "head" "body" "visual"; text-align: center; }

.thesis-argument.is-wide .thesis-arg-body { max-width: var(--intro); margin-inline: auto; }

@media (min-width: 768px) {
  .thesis-title { font-size: 30px; line-height: 1.2; }
}

@media (min-width: 1024px) {
  .thesis-title { font-size: 36px; line-height: 1.1112; }
  .thesis-argument {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr auto auto 1fr;
    grid-template-areas:
      "visual ."
      "visual head"
      "visual body"
      "visual .";
    column-gap: var(--space-xl);
    row-gap: var(--space-md);
  }
  .thesis-argument.is-reverse {
    grid-template-areas:
      ". visual"
      "head visual"
      "body visual"
      ". visual";
  }
  .thesis-arg-visual { align-self: center; }
  .thesis-argument.is-wide {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas: "head" "body" "visual";
  }
  .thesis-arg-head h3 { font-size: 30px; line-height: 1.2; }
}

/* -------------------------------------------------------------- contact */
.section-contact { background: var(--contact); color: var(--light-text); }

.contact-grid { display: grid; gap: var(--space-xl); }

.contact-copy > * + * { margin-top: var(--space-md); }

.contact-checklist li { display: flex; gap: var(--space-sm); }

.contact-checklist li + li { margin-top: var(--space-sm); }

.contact-checklist svg { width: 20px; height: 20px; flex: none; margin-top: 2px; color: var(--mint); }

.contact-checklist strong { display: block; }

.contact-note {
  padding: var(--space-md);
  border: 1px solid rgb(245 245 245 / 25%);
  border-radius: var(--radius-md);
  font-size: 14px;
  line-height: 1.625;
}

/* Rendered only when BOOKING_URL is configured: the calendar note and the
   booking button read as one block rather than two stacked notices. */
.booking-block { display: grid; gap: var(--space-sm); justify-items: start; }

.booking-block .btn { width: 100%; }

@media (min-width: 640px) {
  .booking-block .btn { width: auto; }
}

.contact-panel {
  background: rgb(10 10 10 / 35%);
  border: 1px solid rgb(245 245 245 / 22%);
  border-radius: var(--radius-panel);
  padding: var(--space-lg);
}

.contact-panel h3 { font-size: 18px; line-height: 1.5556; }

.field-grid { display: grid; gap: var(--space-sm); margin-top: var(--space-md); }

.field { display: flex; flex-direction: column; gap: 6px; }

.field label { font-size: 14px; line-height: 1.4286; font-weight: 500; }

.field .req { color: var(--mint); }

.field input,
.field textarea {
  width: 100%;
  min-height: 50px;
  padding: 12px 16px;
  background: rgb(10 10 10 / 55%);
  border: 1px solid rgb(245 245 245 / 35%);
  border-radius: var(--radius-md);
  color: var(--light-text);
}

.field textarea { min-height: 132px; resize: vertical; }

.field input:focus-visible,
.field textarea:focus-visible { outline: 2px solid var(--mint); outline-offset: 2px; }

.field-hint { font-size: 14px; line-height: 1.625; color: var(--mint); }

/* Inline validation text, linked to its field with aria-describedby. Colour is
   never the only cue: the message itself is the cue, and it is announced. */
.field-error {
  margin: 0;
  font-size: 14px;
  line-height: 1.4286;
  color: var(--alert);
}

.field-error:empty { display: none; }

.field input[aria-invalid='true'],
.field textarea[aria-invalid='true'] { border-color: var(--alert); }

/* Honeypot. Present in the DOM with a real name so a form filling bot completes
   it, but 1px, clipped, off the flow and hidden from assistive technology, so no
   visitor is ever asked for it and nothing overflows. Not display:none, which
   some bots skip. */
.form-decoy {
  position: absolute;
  left: -1px;
  top: -1px;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip-path: inset(50%);
}

.form-status {
  margin-top: var(--space-sm);
  padding: var(--space-sm);
  border: 1px solid var(--mint);
  border-radius: var(--radius-md);
  font-size: 14px;
  line-height: 1.625;
}

.form-status:empty { display: none; }

/* Submission states. Each one is words first; the border colour only reinforces
   what the text already says. */
.form-status[data-state='pending'] { border-color: var(--muted); color: var(--muted); }
.form-status[data-state='sent'] { border-color: var(--mint); color: var(--mint); }
.form-status[data-state='error'] { border-color: var(--alert); color: var(--alert); }

.form-status[aria-busy],
[data-contact-form][aria-busy='true'] .btn-mint { cursor: progress; }

[data-contact-form] .btn-mint:disabled { opacity: 0.72; cursor: not-allowed; }

.form-foot { margin-top: var(--space-sm); font-size: 14px; line-height: 1.625; }

@media (min-width: 640px) {
  .field-grid { grid-template-columns: repeat(2, 1fr); }
  .field-span { grid-column: 1 / -1; }
}

@media (min-width: 1024px) {
  .contact-grid { grid-template-columns: 1fr 1fr; }
}

/* --------------------------------------------------------------- footer */
.site-footer { background: var(--dark); color: var(--light-text); }

.footer-main {
  display: grid;
  gap: var(--space-lg);
  padding-block: var(--space-stage);
}

.footer-brand > * + * { margin-top: var(--space-sm); }

.footer-group h2,
.footer-contact h2 {
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mint);
  margin-bottom: var(--space-sm);
}

.footer-group li + li,
.footer-contact li + li { margin-top: var(--space-xs); }

.footer-group a,
.footer-contact a { font-size: 14px; line-height: 1.625; text-decoration: none; }

.footer-group a:hover,
.footer-contact a:hover { text-decoration: underline; }

.footer-group a[aria-current="page"],
.footer-contact a[aria-current="page"] { color: var(--mint); font-weight: 600; }

.footer-contact ul { margin-bottom: var(--space-sm); }

.footer-contact p + p { margin-top: var(--space-sm); }

.footer-divider { height: 1px; background: var(--line-dark); }

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  justify-content: space-between;
  padding-block: var(--space-lg);
  font-size: 14px;
  line-height: 1.625;
  color: var(--muted);
}

@media (min-width: 768px) {
  .footer-main { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .footer-main { grid-template-columns: repeat(12, 1fr); gap: var(--space-lg); }
  .footer-brand { grid-column: span 3; }
  .footer-group { grid-column: span 3; }
  .footer-contact { grid-column: span 3; }
}

/* ------------------------------------------------------- inner page shell */
/* Shared by every generated page under pages/, authored or placeholder. The
   header is opaque here because these pages have no full height dark hero
   behind it. */
body[data-page="inner"] .site-header {
  background: rgb(15 15 15 / 95%);
  border-bottom-color: var(--line-dark);
}

.page-head {
  background: var(--hero);
  color: var(--light-text);
  padding-block: calc(var(--header-h) + var(--space-xl)) var(--space-xl);
}

.page-head > .container > * + * { margin-top: var(--space-md); }

.page-title {
  font-size: 36px;
  line-height: 1.25;
  font-weight: 400;
  font-family: var(--serif);
  max-width: 20ch;
}

.page-body { display: grid; gap: var(--space-xl); }

.page-main > * + * { margin-top: var(--space-md); }

.page-points > li {
  display: flex;
  gap: var(--space-sm);
  font-size: 18px;
  line-height: 1.5556;
}

.page-points > li + li { margin-top: var(--space-sm); }

.page-points svg {
  width: 20px;
  height: 20px;
  flex: none;
  margin-top: 5px;
  color: var(--forest);
}

/* ---------------------------------------------- authored page content (10A) */
/* One block per authored section. The heading of every block is written per
   page in scripts/site-data.mjs, so the spacing here is the only thing shared. */
.page-main > .page-block + .page-block { margin-top: var(--space-xl); }

.page-block > * + * { margin-top: var(--space-md); }

.page-block > .section-title + .measure { margin-top: var(--space-sm); }

.page-block > p + p { margin-top: var(--space-sm); }

/* Short named patterns and principles. Cards stay flat on the stone canvas:
   they carry text only, so a border is enough separation without a shadow. */
/* auto-fit rather than a breakpoint: the main column is 552px at 1024 and
   728px at 1400, so the card count has to follow the column, not the viewport.
   The 248px floor stays under the narrowest container (272px at 320px wide). */
.page-cards {
  display: grid;
  gap: var(--space-sm);
  grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));
}

.page-card {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.page-card h3 { font-size: 18px; line-height: 1.5556; margin-bottom: var(--space-xs); }

.page-card p { font-size: 15px; line-height: 1.6; }

/* Proposed work, in order. The number is order only and states no duration. */
/* The base reset only covers ul, and the step number is already written into
   the markup, so the default ordered marker would print it twice. */
.page-steps {
  display: grid;
  gap: var(--space-md);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-step {
  border-left: 2px solid var(--forest);
  padding-left: var(--space-md);
}

.page-step-num {
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--forest);
}

.page-step h3 { font-size: 18px; line-height: 1.5556; margin-block: 4px var(--space-xs); }

.page-step p { font-size: 15px; line-height: 1.6; max-width: 62ch; }

/* Fit against not a fit, side by side above 640px so the contrast is readable
   at a glance rather than a scroll apart. */
.page-split {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.page-column {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.page-column h3 { font-size: 16px; line-height: 1.5; margin-bottom: var(--space-sm); }

.page-column li {
  display: flex;
  gap: var(--space-xs);
  font-size: 15px;
  line-height: 1.6;
}

.page-column li + li { margin-top: var(--space-xs); }

.page-column li::before {
  content: "";
  width: 6px;
  height: 6px;
  margin-top: 9px;
  flex: none;
  background: var(--forest);
  border-radius: 50%;
}

/* Onward routes to the service outlines. Same affordance as the sibling list
   in the aside, so a reader learns one pattern for internal links. */
.page-links a {
  display: block;
  padding: 10px var(--space-sm);
  border-inline-start: 2px solid var(--line-light);
  text-decoration: none;
  color: var(--ink);
}

.page-links a:hover { border-inline-start-color: var(--forest); background: rgb(36 91 69 / 8%); }

.page-links .nav-menu-note { color: var(--ink); }

/* These sit inside body copy rather than in the aside, so the destination has
   to read as a link on its own and not only on hover. */
.page-links .nav-menu-label {
  color: var(--forest);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-links li + li { margin-top: var(--space-xs); }

/* The one line draft disclosure under the page head CTA. */
.page-disclosure {
  font-size: 14px;
  line-height: 1.625;
  color: var(--muted);
  border-left: 2px solid var(--mint);
  padding-left: var(--space-sm);
  max-width: 64ch;
}

.page-aside > * + * { margin-top: var(--space-md); }

/* Authored pages end on a next step rather than a status card. Same shell as
   the status card so the aside reads as one column in both templates. */
.next-card,
.status-card {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.next-card > * + *,
.status-card > * + * { margin-top: var(--space-sm); }

.next-card-title,
.status-card-title { font-size: 18px; line-height: 1.5556; }

.page-siblings {
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.page-siblings-title {
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--forest);
  margin-bottom: var(--space-sm);
}

.page-siblings a {
  display: block;
  padding: 10px var(--space-sm);
  border-inline-start: 2px solid var(--line-light);
  text-decoration: none;
  color: var(--ink);
}

.page-siblings a:hover { border-inline-start-color: var(--forest); background: rgb(36 91 69 / 8%); }

.page-siblings .nav-menu-note { color: var(--ink); }

/* --------------------------------------------- Insights and Resources (10B) */
/* Five more block kinds, all on the same stone canvas as the Step 10A blocks
   above and reusing its white card, forest rule and check list vocabulary. */

/* One long argument. The standfirst carries the claim, the note says what the
   piece is and why it has no byline, and each part is an h3 with its prose. */
.page-essay-standfirst { max-width: 64ch; }

.page-essay-note {
  font-size: 14px;
  line-height: 1.625;
  border-left: 2px solid var(--forest);
  padding-left: var(--space-sm);
  max-width: 64ch;
}

.page-essay-part + .page-essay-part { margin-top: var(--space-md); }

.page-essay-part h3 { font-size: 20px; line-height: 1.4; margin-bottom: var(--space-xs); }

.page-essay-part p + p { margin-top: var(--space-sm); }

/* A diagnostic question, the guidance behind it, and what a thin answer sounds
   like. The question leads visually because it is the part a reader acts on. */
.page-notes { display: grid; gap: var(--space-md); }

.page-note {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-left: 3px solid var(--forest);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.page-note h3 { font-size: 18px; line-height: 1.5556; }

.page-note-question {
  font-family: var(--sans);
  font-size: 18px;
  line-height: 1.5556;
  font-weight: 600;
  color: var(--forest);
  margin-block: var(--space-xs) var(--space-sm);
}

.page-note p:last-child { margin-top: var(--space-sm); }

.page-note-signal { font-size: 15px; line-height: 1.6; }

.page-note-label {
  display: block;
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--forest);
}

/* Hypothetical engagements. Every card repeats its own label, because a card
   read on its own has to carry the disclaimer with it. */
/* A 300px floor gives two scenarios per row in the 728px main column and one in
   the 552px column at 1024. min() keeps that floor from exceeding the column
   itself, which is 272px wide at a 320px viewport and would otherwise overflow. */
.page-scenarios {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}

.page-scenario {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.page-scenario-label {
  display: inline-block;
  background: var(--mint);
  color: var(--ink);
  border-radius: var(--radius-sm);
  padding: 4px 10px;
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
  margin-bottom: var(--space-sm);
}

.page-scenario h3 { font-size: 18px; line-height: 1.5556; margin-bottom: var(--space-xs); }

.page-scenario > p { font-size: 15px; line-height: 1.6; }

.page-scenario-part {
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--forest);
  margin-top: var(--space-md);
  margin-bottom: var(--space-xs);
}

.page-scenario-list li {
  display: flex;
  gap: var(--space-xs);
  font-size: 15px;
  line-height: 1.6;
}

.page-scenario-list li + li { margin-top: var(--space-xs); }

.page-scenario-list li::before {
  content: "";
  width: 6px;
  height: 6px;
  margin-top: 9px;
  flex: none;
  background: var(--forest);
  border-radius: 50%;
}

/* Questions and answers. A rule between entries rather than a card each, so a
   long list stays readable instead of turning into a grid of boxes. */
.page-faq-item + .page-faq-item {
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid var(--line-light);
}

.page-faq-item h3 { font-size: 20px; line-height: 1.4; margin-bottom: var(--space-xs); }

.page-faq-item p + p { margin-top: var(--space-sm); }

/* ------------------------------------------------------ planning worksheet */
/* Deliberately not a form: there is no form element, the controls have no name
   and no script reads them, so there is nothing to submit and nothing to keep.
   The print button is hidden unless js/site.js has run, because a control that
   cannot do anything should not be shown; the page names the browser's own
   print command for that case. */
.worksheet {
  background: var(--white);
  border: 1px solid var(--line-light);
  border-radius: var(--radius-md);
  padding: var(--space-md);
}

.worksheet-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  padding-bottom: var(--space-md);
  border-bottom: 1px solid var(--line-light);
}

.worksheet-local {
  font-size: 14px;
  line-height: 1.625;
  max-width: 52ch;
}

html:not(.js) [data-print] { display: none; }

.worksheet-parts { display: grid; gap: var(--space-lg); margin: var(--space-md) 0 0; padding: 0; list-style: none; }

.worksheet-part-num {
  font-size: 14px;
  line-height: 1.4286;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--forest);
}

.worksheet-part h3 { font-size: 20px; line-height: 1.4; margin-block: 4px var(--space-xs); }

.worksheet-prompt { font-size: 15px; line-height: 1.6; max-width: 62ch; }

.worksheet-field { margin-top: var(--space-md); }

.worksheet-field label {
  display: block;
  font-size: 15px;
  line-height: 1.6;
  font-weight: 600;
  margin-bottom: var(--space-xs);
  max-width: 62ch;
}

/* A forest edge rather than a faint one: this is a real control, and DESIGN.md
   requires meaningful control edges to carry contrast on stone and white. */
.worksheet-field textarea {
  display: block;
  width: 100%;
  min-height: 84px;
  padding: 10px 12px;
  background: var(--white);
  color: var(--ink);
  border: 1px solid var(--forest);
  border-radius: var(--radius-md);
  font-size: 16px;
  line-height: 1.5;
  resize: vertical;
}

@media (min-width: 768px) {
  .page-title { font-size: 48px; line-height: 1.1667; }
}

@media (min-width: 1024px) {
  .page-head { padding-block: calc(var(--header-h) + var(--space-split)) var(--space-split); }
  .page-title { font-size: 60px; line-height: 1.1; }
  .page-body {
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: var(--space-split);
    max-width: var(--editorial);
    margin-inline: auto;
  }
}

/* ---------------------------------------------------- refined advisory
   Opt-in presentation shared by the homepage and generated inner pages.
   Keep legacy selectors above while content migrates; never hide old copy.
   Navigation disclosure, hover bridge, media and form state rules stay intact. */
body.advisory-refined {
  --dark: #142b23;
  --hero: #10271e;
  --stone: #f3f2ed;
  --ink: #24332c;
  --muted: #bac7bf;
  --surface: #183329;
  --contact: #eeefe9;
  --container: 1248px;
  --editorial: 1160px;
  --gutter: clamp(24px, 4vw, 48px);
  --header-h: 88px;
  --space-section: clamp(52px, 6vw, 88px);
  --radius-sm: 2px;
  --radius-md: 2px;
  --radius-lg: 2px;
  --radius-panel: 2px;
  background: #faf9f6;
  color: var(--ink);
  line-height: 1.75;
}
.advisory-refined :is(h1, h2, h3, h4) { font-weight: 400; }
.advisory-refined :is(.section-title, .editorial-heading) {
  font-family: var(--serif);
  font-size: clamp(30px, 3.2vw, 44px);
  font-weight: 400;
  line-height: 1.22;
  letter-spacing: -0.025em;
  max-width: 23ch;
  text-wrap: balance;
}
.advisory-refined :is(.eyebrow, .editorial-label) {
  display: block;
  color: var(--forest);
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.advisory-refined .lead { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.7; }
.advisory-refined :focus-visible { outline-color: var(--forest); }
.advisory-refined :is(.hero, .site-header, .site-footer) :focus-visible { outline-color: var(--mint); }
.advisory-refined .btn {
  border-radius: 2px;
  padding: 13px 25px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.025em;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}
.advisory-refined .btn:hover { transform: none; }
.advisory-refined .btn-secondary { color: var(--forest); border-color: var(--forest); }
.advisory-refined .btn-secondary:hover { background: rgb(36 91 69 / 6%); }
.advisory-refined .site-header,
.advisory-refined .site-header.is-solid,
.advisory-refined .site-header.is-open,
body.advisory-refined[data-page="inner"] .site-header {
  background: #142b23;
  border-bottom-color: var(--line-dark);
}
.advisory-refined .brand { gap: 10px; }
.advisory-refined .brand-text { font-size: 22px; letter-spacing: 0; }
.advisory-refined .brand-mark { width: 36px; height: 40px; object-fit: contain; padding: 5px; background: #f3f2ed; border-radius: 2px; }
.advisory-refined .nav-group-button { font-weight: 400; }
.advisory-refined .nav-cta { background: transparent; border-color: rgb(255 255 255 / 48%); }
.advisory-refined .nav-cta:hover { background: rgb(255 255 255 / 10%); border-color: #fff; }
.advisory-refined .nav-menu { border-radius: 0; box-shadow: 0 12px 24px rgb(0 0 0 / 12%); }
.advisory-refined .nav-menu a { padding-block: 13px; }
.advisory-refined .nav-menu-note { margin-top: 3px; line-height: 1.5; }
.advisory-refined .hero {
  min-height: 720px;
  padding-block: calc(var(--header-h) + 48px) 64px;
  color: #fff;
}
.advisory-refined .hero-copy { max-width: 960px; }
.advisory-refined .hero-title {
  font-size: clamp(36px, 5.1vw, 72px);
  line-height: 1.14;
  letter-spacing: -0.035em;
  text-wrap: balance;
  color: #fff;
}
.advisory-refined .hero-title .accent { color: inherit; }
.advisory-refined .hero :is(.eyebrow, .editorial-label) { color: #fff; }
.advisory-refined .hero :is(.hero-lead, .lead) {
  max-width: 57ch;
  margin-inline: auto;
  color: #fff;
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.75;
  text-wrap: pretty;
}
.advisory-refined .hero .cta-row { margin-top: 36px; }
.advisory-refined .hero .editorial-link { color: #fff; margin-top: 0; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 10px 12px; }
.advisory-refined .hero .editorial-link:hover { color: var(--mint); }
.advisory-refined .hero .btn-secondary { color: #fff; border-color: rgb(255 255 255 / 75%); background: transparent; }
.advisory-refined .hero .btn-secondary:hover { background: rgb(255 255 255 / 12%); }
.advisory-refined .hero-media::after {
  background: linear-gradient(180deg, rgb(9 27 20 / 69%), rgb(9 27 20 / 53%) 35%, rgb(9 27 20 / 57%) 75%, rgb(9 27 20 / 65%));
}
.advisory-refined .editorial-section { padding-block: var(--space-section); background: #faf9f6; color: var(--ink); }
.advisory-refined .editorial-section.section-stone { background: var(--stone); }
.advisory-refined .editorial-section + .editorial-section { border-top: 1px solid var(--line-light); }
.advisory-refined .editorial-copy { max-width: 65ch; }
.advisory-refined .editorial-copy > * + * { margin-top: 20px; }
.advisory-refined .editorial-copy > p + h2 { margin-top: 48px; }
.advisory-refined .editorial-label + :is(.editorial-heading, h2, h3) { margin-top: 16px; }
.advisory-refined .editorial-heading + :is(p, .editorial-copy) { margin-top: 24px; }
.advisory-refined :is(.editorial-grid, .service-grid) {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 40px;
  margin-top: 48px;
}
/* A two-item group uses the full measure without an empty third column. */
.advisory-refined :is(.editorial-grid, .service-grid):has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.advisory-refined :is(.editorial-item, .editorial-copy, .contact-copy, .contact-panel, .page-main, .page-aside) { min-width: 0; }
.advisory-refined .editorial-item { padding-top: 24px; border-top: 1px solid #aebbb1; }
.advisory-refined .editorial-item > * + * { margin-top: 16px; }
.advisory-refined .editorial-item h3 { font-size: clamp(23px, 2.1vw, 28px); line-height: 1.3; letter-spacing: -0.02em; }
.advisory-refined .editorial-item p { max-width: 58ch; }
.advisory-refined .editorial-link {
  display: inline-block;
  color: var(--forest);
  font-size: 14px;
  font-weight: 500;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}
.advisory-refined .editorial-link:hover { color: var(--ink); }
.advisory-refined .editorial-rule { border: 0; border-top: 1px solid var(--line-light); margin-block: 40px; }
.advisory-refined .firm-intro .editorial-copy { font-size: 18px; line-height: 1.8; }
.advisory-refined .engagement-list { margin: 40px 0 0; padding: 0; list-style: none; }
.advisory-refined .engagement-list > li { padding-block: 24px; border-top: 1px solid var(--line-light); }
.advisory-refined .engagement-list h3 { font-size: 24px; line-height: 1.35; }
.advisory-refined .engagement-list p { max-width: 65ch; margin-top: 12px; }
.advisory-refined :is(.preview-notice, .page-disclosure) {
  font-size: 14px;
  line-height: 1.65;
  color: #59665d;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  max-width: 72ch;
}
.advisory-refined .preview-notice { margin-top: 28px; }
.advisory-refined :is(.hero, .site-footer) .preview-notice { color: #d5dfd8; }
.advisory-refined .hero .preview-notice { margin-inline: auto; }
.advisory-refined .section-contact { background: var(--contact); color: var(--ink); }
.advisory-refined .contact-grid { gap: clamp(40px, 6vw, 88px); align-items: start; }
.advisory-refined .contact-panel { background: transparent; border: 0; border-radius: 0; padding: 0; }
.advisory-refined .contact-panel #contact-form-title { font-family: var(--sans); font-size: 18px; line-height: 1.5; }
.advisory-refined .contact-note { border: 0; border-top: 1px solid var(--line-light); padding: 20px 0 0; border-radius: 0; color: #59665d; }
.advisory-refined .section-contact .muted { color: #59665d; }
.advisory-refined :is(.contact-checklist svg, .field .req, .field-hint) { color: var(--forest); }
.advisory-refined .field-grid { gap: 24px; margin-top: 28px; }
.advisory-refined .field { min-width: 0; gap: 9px; }
.advisory-refined .field :is(input, textarea, select) {
  width: 100%;
  background: #fafbf8;
  color: var(--ink);
  border: 1px solid #85968a;
  border-radius: 2px;
  font-size: 16px;
}
.advisory-refined .field :is(input, textarea, select):focus-visible { outline-color: var(--forest); }
.advisory-refined .field :is(input, textarea)::placeholder { color: #637066; opacity: 1; }
.advisory-refined .field-error { color: #973a28; }
.advisory-refined .field :is(input, textarea)[aria-invalid='true'] { border-color: #973a28; }
.advisory-refined .form-status { border-radius: 0; color: var(--forest); border-color: var(--forest); }
.advisory-refined .form-status[data-state='pending'] { color: #59665d; border-color: #85968a; }
.advisory-refined .form-status[data-state='sent'] { color: var(--forest); border-color: var(--forest); }
.advisory-refined .form-status[data-state='error'] { color: #973a28; border-color: #973a28; }
.advisory-refined .btn-mint { background: var(--forest); color: #fff; border-color: var(--forest); }
.advisory-refined .btn-mint:hover { background: var(--forest-hover); }
.advisory-refined .site-footer { background: #142b23; }
.advisory-refined .footer-main { padding-block: 64px; gap: 40px; }
.advisory-refined .footer-main > * { min-width: 0; }
.advisory-refined .footer-brand .brand-text { white-space: normal; font-size: 22px; }
.advisory-refined :is(.footer-group, .footer-contact) h2 { color: #d6dfd8; font-size: 12px; letter-spacing: 0.12em; }
.advisory-refined .footer-bottom { padding-block: 24px; font-size: 13px; }
.advisory-refined .page-head {
  background: var(--stone);
  color: var(--ink);
  padding-block: calc(var(--header-h) + clamp(48px, 6vw, 88px)) clamp(48px, 6vw, 80px);
  border-bottom: 1px solid var(--line-light);
}
.advisory-refined .page-title { font-size: clamp(36px, 4.5vw, 60px); line-height: 1.15; letter-spacing: -0.03em; text-wrap: balance; }
.advisory-refined .page-head .lead { max-width: 60ch; }
.advisory-refined .page-head .eyebrow { color: var(--forest); }
.advisory-refined .page-body { max-width: none; }
.advisory-refined .page-main > .page-block + .page-block { margin-top: 56px; }
.advisory-refined .page-block .section-title { font-size: clamp(28px, 2.6vw, 36px); }
.advisory-refined :is(.page-card, .page-column, .page-note, .page-scenario, .next-card, .status-card, .page-siblings, .worksheet) {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--line-light);
  border-radius: 0;
  padding: 24px 0 0;
  box-shadow: none;
}
.advisory-refined :is(.page-card, .page-step, .page-note, .page-scenario) h3 { font-size: 22px; line-height: 1.4; }
.advisory-refined :is(.page-card, .page-step, .page-scenario) p { font-size: 16px; line-height: 1.75; }
.advisory-refined .page-aside > * + * { margin-top: 40px; }
.advisory-refined .next-card-title { font-size: 25px; line-height: 1.35; }
.advisory-refined .badge-light { background: transparent; padding: 0; border: 0; color: var(--forest); }
.advisory-refined .page-scenario-label { background: transparent; border-radius: 0; padding: 0; }
.advisory-refined .page-essay-note { border-radius: 0; }
.advisory-refined :is(.page-links, .page-siblings) a { padding-inline: 0; border-inline-start: 0; border-bottom: 1px solid var(--line-light); }
.advisory-refined :is(.page-links, .page-siblings) a:hover { background: transparent; color: var(--forest); }
@media (min-width: 1024px) {
  .advisory-refined .page-body { grid-template-columns: minmax(0, 1fr) 280px; gap: 72px; }
  .advisory-refined .nav-list { gap: 18px; }
  .advisory-refined .nav-group:last-child .nav-menu { left: auto; right: 0; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .advisory-refined .site-header .container { padding-inline: 24px; }
  .advisory-refined .brand-text { font-size: 20px; }
  .advisory-refined .nav-list { gap: 12px; }
  .advisory-refined .nav-wrap { gap: 16px; }
  .advisory-refined .nav-cta { padding-inline: 16px; }
}
@media (max-width: 899px) {
  .advisory-refined :is(.editorial-grid, .service-grid),
  .advisory-refined :is(.editorial-grid, .service-grid):has(> :nth-child(2):last-child) { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 639px) {
  body.advisory-refined { --header-h: 80px; }
  .advisory-refined .brand-text { font-size: 20px; }
  .advisory-refined .brand-mark { width: 32px; height: 36px; padding: 4px; }
  .advisory-refined .hero { min-height: 90svh; padding-block: calc(var(--header-h) + 64px) 72px; }
  .advisory-refined .hero-title { font-size: clamp(32px, 8.5vw, 48px); }
  .advisory-refined .hero .cta-row { max-width: 300px; }
  .advisory-refined .editorial-grid, .advisory-refined .service-grid { margin-top: 32px; }
  .advisory-refined .footer-main { padding-block: 48px; }
}

/* ------------------------------------------------------- reduced motion */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  .btn:hover,
  .sector-card:hover { transform: none; }
}

/* ------------------------------------------------------------------ print */
/* Added in Step 10B for the planning worksheet, and applied site wide because
   the same furniture is in the way on every page. Printing is entirely local:
   the browser renders the page it already has, and nothing is uploaded, stored
   or sent anywhere in the process. */
@media print {
  .skip-link,
  .site-header,
  .site-footer,
  .page-aside,
  .worksheet-actions,
  .page-head .cta-row,
  .page-links,
  .page-siblings { display: none !important; }

  html,
  body { background: #fff; color: #000; }

  .container { max-width: none; padding-inline: 0; }

  .page-head {
    background: #fff;
    color: #000;
    padding-block: 0 16px;
  }

  .page-head .eyebrow { color: #000; }

  .page-disclosure { color: #000; border-left-color: #000; }

  .section { padding-block: 0; }

  .section-stone { background: #fff; }

  .page-body { display: block; max-width: none; }

  .page-card,
  .page-column,
  .page-note,
  .page-scenario,
  .worksheet { border-color: #000; break-inside: avoid; }

  .worksheet-part,
  .page-faq-item { break-inside: avoid; }

  /* Keeps a printed field writable by hand on a blank copy, and keeps a filled
     one inside a visible box rather than collapsing it to a line. */
  .worksheet-field textarea {
    min-height: 84px;
    height: auto;
    overflow: visible;
    resize: none;
    background: #fff;
    color: #000;
    border: 1px solid #000;
  }

  /* Internal destinations are hidden above, so no URL is worth printing. */
  a[href^="/"]::after,
  a[href^="#"]::after { content: ""; }
}

/* Scoped refinements must not override the existing printable worksheet. */
@media print {
  body.advisory-refined { background: #fff; color: #000; }
  .advisory-refined .page-head { padding-block: 0 16px; background: #fff; color: #000; }
  .advisory-refined :is(.section, .editorial-section) { padding-block: 0; background: #fff; }
  .advisory-refined .page-body { display: block; }
  .advisory-refined :is(.page-disclosure, .preview-notice, .page-head .eyebrow) { color: #000; }
}

/* Finishing adjustments retain natural growth when text is enlarged. */
.advisory-refined .hero .btn-primary { background: #f3f2ed; border-color: #f3f2ed; color: #142b23; }
.advisory-refined .hero .btn-primary:hover { background: #fff; border-color: #fff; }
.advisory-refined .hero .cta-row { align-items: center; gap: 16px; }
.advisory-refined #contact-delivery-note { margin-bottom: 18px; }
.advisory-refined .origination-context { max-width: 78ch; margin-top: 32px; color: #59665d; }
.advisory-refined .engagement-list { margin-top: 28px; margin-bottom: 20px; }
.advisory-refined .engagement-list > li { display: grid; grid-template-columns: 180px 1fr; gap: 32px; padding-block: 18px; align-items: baseline; }
.advisory-refined .engagement-list p { margin-top: 0; }
.advisory-refined .preview-notice { padding: 16px var(--gutter); margin: 0 auto; }
@media (max-width: 767px) {
  .advisory-refined .hero { min-height: 600px; padding-block: calc(var(--header-h) + 40px) 56px; }
  .advisory-refined .hero .cta-row { gap: 8px; }
  .advisory-refined .engagement-list > li { grid-template-columns: 1fr; gap: 8px; }
}
@media (max-width: 374px) {
  .advisory-refined .site-header .brand { gap: 8px; }
  .advisory-refined .site-header .brand-text { font-size: 19px; }
  .advisory-refined .site-header .brand-mark { width: 30px; height: 34px; padding: 4px; }
}

/* Metellus reference adaptation: original implementation, foundation 2026-09-24.
   Keep behavior selectors above intact. These tokens supersede the green/serif pass. */
body.metellus-rebuild {
  --rc-navy: #002855; --rc-blue: #0067a5; --rc-accent: #508bc9;
  --rc-fog: #f6f6f6; --rc-border: #e3e5eb; --rc-text: #444;
  --sans: Arial, Helvetica, sans-serif; --serif: var(--sans);
  --forest: var(--rc-blue); --dark: var(--rc-navy); --hero: var(--rc-navy);
  --ink: var(--rc-text); --stone: var(--rc-fog); --contact: var(--rc-fog);
  --muted: #657080; --mint: #508bc9; --surface: #fff;
  --container: 1248px; --gutter: 32px; --header-h: 88px;
  font-family: var(--sans); background: #fff; color: var(--rc-text); line-height: 1.6;
}
.metellus-rebuild :is(h1,h2,h3,h4,.brand-text) { font-family: var(--sans); color: var(--rc-navy); font-weight: 300; }
.metellus-rebuild :is(.section-title,.editorial-heading) { font-size: clamp(32px,3.6vw,52px); line-height: 1.04; letter-spacing: -.045em; font-weight: 300; }
.metellus-rebuild .site-header { background: #fff; color: var(--rc-navy); border-bottom: 3px solid var(--rc-navy); box-shadow: none; }
.metellus-rebuild .header-inner { min-height: 85px; gap: 20px; }
.metellus-rebuild .site-header .brand { color: var(--rc-navy); gap: 8px; }
.metellus-rebuild .site-header .brand-text { font-size: 18px; line-height: 1.1; max-width: 105px; }
.metellus-rebuild .site-header .brand-mark { width: 34px; height: 40px; background: #fff; padding: 2px; }
.metellus-rebuild .nav-wrap { gap: 18px; }
.metellus-rebuild .nav-list { gap: 14px; }
.metellus-rebuild .nav-group-button { color: var(--rc-navy); font-size: 10px; letter-spacing: .065em; text-transform: uppercase; padding-inline: 0; }
.metellus-rebuild .nav-group-button:hover,.metellus-rebuild .nav-group.is-open > .nav-group-button { color: var(--rc-blue); background: transparent; }
.metellus-rebuild .nav-menu { background: #fff; border: 1px solid var(--rc-border); border-top: 3px solid var(--rc-accent); box-shadow: 0 12px 28px #00285518; }
.metellus-rebuild .nav-menu a { color: var(--rc-navy); }
.metellus-rebuild .nav-menu a:hover { background: var(--rc-fog); }
.metellus-rebuild .nav-menu-note { color: #596473; }
.metellus-rebuild .nav-toggle { color: var(--rc-navy); border-color: var(--rc-border); }
.metellus-rebuild .btn { border-radius: 0; font-family: var(--sans); font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; padding: 15px 22px; }
.metellus-rebuild .btn-primary { background: var(--rc-navy); border-color: var(--rc-navy); color: #fff; }
.metellus-rebuild .btn-primary:hover { background: var(--rc-blue); border-color: var(--rc-blue); }
.metellus-rebuild .btn-secondary { color: var(--rc-navy); border-color: var(--rc-navy); background: transparent; }
.metellus-rebuild .hero { background-color: var(--rc-navy); min-height: 792px; }
.metellus-rebuild .hero::after { background: linear-gradient(90deg,#002855ba,#00285577); }
.metellus-rebuild .hero-title { font-size: clamp(38px,4.4vw,64px); font-weight: 300; line-height: .98; letter-spacing: -.05em; max-width: 820px; color: #fff; }
.metellus-rebuild .hero :is(h1,p) { color: #fff; }
.metellus-rebuild .hero .btn-primary { border-radius: 30px; background: transparent; color: #fff; border-color: #fff; }
.metellus-rebuild .hero .btn-primary:hover { background: #002855; }
.metellus-rebuild :is(.editorial-section,.rc-section) { padding-block: clamp(64px,7vw,112px); }
.metellus-rebuild :is(.section-stone,.rc-fog) { background: var(--rc-fog); }
.metellus-rebuild :is(.editorial-label,.eyebrow,.rc-label) { color: var(--rc-blue); font-size: 10px; font-weight: 600; line-height: 1.5; letter-spacing: .13em; text-transform: uppercase; margin-bottom: 22px; }
.metellus-rebuild .editorial-link { color: var(--rc-navy); }
.metellus-rebuild .rc-section-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; margin-bottom: 48px; }
.metellus-rebuild .rc-section-heading > p { border-left: 2px solid var(--rc-accent); padding-left: 22px; max-width: 48ch; }
.metellus-rebuild :is(.rc-grid,.service-grid) { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.metellus-rebuild .rc-grid-four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.metellus-rebuild :is(.rc-card,.service-grid .editorial-item) { min-width: 0; background: #fff; padding: 28px; border: 1px solid var(--rc-border); border-top: 2px solid var(--rc-accent); }
.metellus-rebuild :is(.rc-card,.service-grid .editorial-item) h3 { font-size: 23px; line-height: 1.2; margin-block: 14px; }
.metellus-rebuild :is(.rc-card,.service-grid .editorial-item) p { font-size: 14px; }
.metellus-rebuild .rc-number { color: var(--rc-blue); font-size: 11px; letter-spacing: .1em; }
.metellus-rebuild .rc-band { background: var(--rc-navy); color: #fff; padding-block: 36px; }
.metellus-rebuild .rc-dark { background: var(--rc-navy); color: #fff; }
.metellus-rebuild :is(.rc-dark,.rc-band) :is(h2,h3,p,a) { color: #fff; }
.metellus-rebuild .rc-dark .rc-card { background: transparent; border-color: #ffffff40; }
.metellus-rebuild .rc-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
.metellus-rebuild .rc-step-list { list-style: none; padding: 0; counter-reset: step; }
.metellus-rebuild .rc-step-list > li { counter-increment: step; padding: 22px 0 22px 48px; border-top: 1px solid var(--rc-border); position: relative; }
.metellus-rebuild .rc-step-list > li::before { content: counter(step,decimal-leading-zero); position: absolute; left: 0; color: var(--rc-blue); font-size: 12px; }
.metellus-rebuild .page-head { background: var(--rc-fog); padding-block: calc(var(--header-h) + 80px) 80px; border-bottom: 1px solid var(--rc-border); }
.metellus-rebuild .page-title { font-size: clamp(38px,4.2vw,60px); font-weight: 300; line-height: 1.05; letter-spacing: -.045em; color: var(--rc-navy); }
.metellus-rebuild .lead { font-size: 18px; line-height: 1.65; max-width: 70ch; }
.metellus-rebuild .rc-page-layout { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 72px; }
.metellus-rebuild .rc-page-aside { border-top: 3px solid var(--rc-accent); padding-top: 24px; align-self: start; }
.metellus-rebuild .rc-page-aside h2 { font-size: 22px; }
.metellus-rebuild .rc-page-aside .page-links { display: block; padding: 0; }
.metellus-rebuild .rc-page-aside li { list-style: none; border-bottom: 1px solid var(--rc-border); padding-block: 14px; }
.metellus-rebuild .rc-page-aside .nav-menu-note { display: block; font-size: 13px; margin-top: 5px; }
.metellus-rebuild .page-block { margin-block: 0 56px; }
.metellus-rebuild .page-block .section-title { font-size: 32px; margin-bottom: 24px; max-width: 30ch; }
.metellus-rebuild :is(.page-card,.page-step,.page-note) { border-color: var(--rc-border); }
.metellus-rebuild .contact-panel { background: #fff; border: 1px solid var(--rc-border); padding: 32px; }
.metellus-rebuild :is(input,textarea,select) { border-color: #7e8597; }
.metellus-rebuild .site-footer { background: #fff; color: var(--rc-text); border-top: 1px solid var(--rc-border); }
.metellus-rebuild .footer-main { display: grid; grid-template-columns: 1.2fr repeat(4,1fr); gap: 28px; padding-block: 64px; }
.metellus-rebuild .footer-brand { grid-column: 1 / -1; max-width: 360px; }
.metellus-rebuild .site-footer :is(a,h2,.brand-text) { color: var(--rc-navy); }
.metellus-rebuild .site-footer .muted { color: #596473; }
.metellus-rebuild .footer-group h2,.metellus-rebuild .footer-contact h2 { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.metellus-rebuild :focus-visible { outline: 2px solid var(--rc-blue); outline-offset: 4px; }
@media (min-width:1024px) and (max-width:1199px) {
 .metellus-rebuild .site-header .container { padding-inline: 16px; }
 .metellus-rebuild .nav-list { gap: 9px; }
 .metellus-rebuild .nav-wrap { gap: 10px; }
 .metellus-rebuild .nav-cta { padding-inline: 12px; }
 .metellus-rebuild .site-header .brand-text { font-size: 16px; max-width: 90px; }
}
@media (max-width:1023px) {
 .metellus-rebuild .nav-wrap { background: #fff; }
 .metellus-rebuild .nav-group-button { font-size: 13px; min-height: 48px; }
 .metellus-rebuild .nav-menu { box-shadow: none; }
 .metellus-rebuild .rc-page-layout { grid-template-columns: 1fr; gap: 48px; }
 .metellus-rebuild .rc-grid-four { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:767px) {
 body.metellus-rebuild { --gutter: 24px; --header-h: 76px; }
 .metellus-rebuild .header-inner { min-height: 73px; }
 .metellus-rebuild .hero { min-height: 600px; }
 .metellus-rebuild :is(.rc-section-heading,.rc-split,.rc-grid,.rc-grid-four,.service-grid) { grid-template-columns: 1fr; gap: 28px; }
 .metellus-rebuild .rc-section-heading { margin-bottom: 32px; }
 .metellus-rebuild .footer-main { grid-template-columns: 1fr 1fr; }
 .metellus-rebuild .page-head { padding-block: calc(var(--header-h) + 48px) 48px; }
 .metellus-rebuild .contact-panel { padding: 24px; }
}
@media print {
 body.metellus-rebuild { background: white; color: black; }
 .metellus-rebuild .rc-page-layout { display: block; }
 .metellus-rebuild .rc-page-aside { display: none; }
 .metellus-rebuild .page-head { padding: 0; }
}
.metellus-rebuild .hero-media::after { background: linear-gradient(90deg,#002855b8,#00285565); }
.metellus-rebuild .page-head { background: #fff; }
.metellus-rebuild .page-title { max-width: 22ch; }
.metellus-rebuild .rc-operating-view { padding-block: 24px; border-block: 1px solid var(--rc-border); }
.metellus-rebuild .rc-operating-inner { display: grid; grid-template-columns: 240px 1fr; gap: 40px; align-items: center; }
.metellus-rebuild .rc-operating-inner ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); list-style: none; padding: 0; margin: 0; }
.metellus-rebuild .rc-operating-inner li { background: #fff; border: 1px solid var(--rc-border); border-top: 2px solid var(--rc-blue); padding: 24px; }
.metellus-rebuild .rc-operating-inner strong { display: block; color: var(--rc-navy); font-size: 17px; font-weight: 400; margin-top: 22px; }
.metellus-rebuild .rc-operating-inner p { font-size: 13px; }
.metellus-rebuild .rc-section > .container > .page-block { margin: 0; }
.metellus-rebuild .rc-section .section-title { font-size: clamp(30px,3.3vw,48px); }
.metellus-rebuild .rc-section .page-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.metellus-rebuild .rc-section .page-card { background: #fff; border: 1px solid var(--rc-border); border-top: 2px solid var(--rc-accent); padding: 28px; }
.metellus-rebuild .rc-dark .page-card { background: transparent; }
.metellus-rebuild .rc-dark .editorial-label { color: #a3cef4; }
@media (max-width:767px) {
 .metellus-rebuild .rc-operating-inner,.metellus-rebuild .rc-operating-inner ol,.metellus-rebuild .rc-section .page-cards { grid-template-columns: 1fr; }
 .metellus-rebuild .rc-operating-inner { gap: 16px; }
}
@media (max-width:767px) {
 .metellus-rebuild .header-inner { min-height: 73px; padding-block: 12px; }
}

/* Shared spacing between substantial sibling blocks, including review/handoff. */
.metellus-rebuild .rc-section > .container > :is(.rc-grid,.rc-split) + :is(.rc-split,.editorial-copy,.cta-row) { margin-top: clamp(32px,4vw,56px); }
.metellus-rebuild :is(.rc-dark,.rc-band) .btn-primary { background: #fff; border-color: #fff; color: var(--rc-navy); }
.metellus-rebuild :is(.rc-dark,.rc-band) .btn-primary:hover { background: #e3e5eb; border-color: #e3e5eb; }
.metellus-rebuild :is(.rc-dark,.rc-band) :focus-visible { outline-color: #fff; }
/* The reference top rule is 3px: bridge that border as well as the menu gap. */
@media (min-width:1024px) {
 .metellus-rebuild .nav-menu::before { height: calc(var(--nav-menu-gap) + 3px); }
}
/* Reset the earlier 12-column footer spans for the current grouped grid. */
.metellus-rebuild :is(.footer-group,.footer-contact) { grid-column: auto; }
.metellus-rebuild .footer-main { grid-template-columns: repeat(4,minmax(0,1fr)); }
@media (max-width:767px) { .metellus-rebuild .footer-main { grid-template-columns: repeat(2,minmax(0,1fr)); } }
body.metellus-rebuild .site-header,
body.metellus-rebuild .site-header.is-solid,
body.metellus-rebuild .site-header.is-open,
body.metellus-rebuild[data-page="inner"] .site-header { background: #fff; color: var(--rc-navy); border-bottom: 3px solid var(--rc-navy); backdrop-filter: none; }
.metellus-rebuild .site-header .brand-text { white-space: normal; }
@media print {
 .metellus-rebuild .rc-section { padding-block: 12px; background: #fff; color: #000; }
 .metellus-rebuild .rc-operating-view { display: none; }
 .metellus-rebuild .worksheet { break-inside: auto; }
 .metellus-rebuild .worksheet-part { break-inside: auto; }
 .metellus-rebuild .worksheet-field { break-inside: avoid; }
}

/* Parent revision 1: intentional home gaps and compact editorial sections. */
.metellus-rebuild #firm .rc-section-heading { margin-bottom: 32px; }
.metellus-rebuild #firm .rc-section-heading > p { margin-bottom: 0; }
.metellus-rebuild #firm .rc-grid + .editorial-link { display: inline-block; margin-top: 20px; }
.metellus-rebuild .rc-application-details { margin-block: 24px; font-size: 14px; }
.metellus-rebuild .rc-application-details > div + div { margin-top: 16px; }
.metellus-rebuild .rc-application-details dt { font-weight: 600; }
.metellus-rebuild .rc-application-details dd { margin: 4px 0 0; }
.metellus-rebuild .rc-block-content > * + * { margin-top: 20px; }
.metellus-rebuild .rc-block-content > p + p { margin-top: 16px; }
@media (min-width: 1024px) {
  .metellus-rebuild .nav-group-button { font-size: 12px; letter-spacing: .04em; }
  .metellus-rebuild .rc-content-section { padding-block: 64px; }
  .metellus-rebuild .page-block:is(.rc-block-prose,.rc-block-steps,.rc-block-checks,.rc-block-links) {
    display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 64px; align-items: start;
  }
  .metellus-rebuild .page-block:is(.rc-block-prose,.rc-block-steps,.rc-block-checks,.rc-block-links) > * { margin: 0; }
  .metellus-rebuild .rc-block-content > :first-child { margin-top: 0; }
  .metellus-rebuild .rc-block-steps .page-steps { max-width: none; }
}
@media print {
  .metellus-rebuild .rc-content-section { padding-block: 12px; }
  .metellus-rebuild .page-block { display: block !important; }
}

/* Public policies use a single readable column. */
.metellus-rebuild .legal-document { max-width: 820px; padding-top: 144px; padding-bottom: 80px; }
.metellus-rebuild .legal-document h1 { font-size: clamp(36px, 5vw, 52px); font-weight: 300; }
.metellus-rebuild .legal-document h2 { font-size: 25px; line-height: 1.3; margin: 36px 0 16px; }
.metellus-rebuild .legal-document p { line-height: 1.75; margin-bottom: 18px; }
.metellus-rebuild .legal-document a { text-decoration: underline; }