*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'IBM Plex Sans', 'Inter', system-ui, -apple-system, sans-serif;
  font-feature-settings: "tnum";
  background: #FFFFFF;
  color: #1A1A1A;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
:root {
  --ink: #1A1A1A;
  --ink-80: #3D3D3D;
  --ink-48: #7A7A7A;
  --ink-24: #BDBDBD;
  --accent: #ED1C24;
  --canvas: #FFFFFF;
  --canvas-warm: #F7F7F5;
  --surface-dark: #111111;
  --surface-black: #000000;
  --on-dark: #FFFFFF;
  --muted-on-dark: #AAAAAA;
  --score-high: #2D8A4E;
  --score-mid: #F59E0B;
  --score-low: #C53030;
  --score-high-bg: #EAF6EE;
  --score-mid-bg: #FEF7E0;
  --score-low-bg: #FEE8E8;
  --hairline: #E4E4E4;
}
.container { max-width: 900px; margin: 0 auto; padding: 0 32px; }

/* ── STICKY NAV ── */
.sticky-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  background: var(--surface-black);
  height: 48px;
  display: flex; align-items: center; padding: 0 24px;
  transform: translateY(-100%);
  transition: transform 220ms cubic-bezier(0.4, 0, 0.2, 1);
  border-bottom: 1px solid #222;
}
.sticky-nav.visible { transform: translateY(0); }
.sticky-inner {
  max-width: 900px; margin: 0 auto; width: 100%;
  display: flex; align-items: center; gap: 8px;
}
.sticky-mark { width: 22px; height: 22px; border-radius: 50%; flex-shrink: 0; margin-right: 8px; }
.sticky-layers { display: flex; gap: 2px; flex: 1; overflow: hidden; }
.sticky-lnk {
  font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase;
  color: #666; text-decoration: none; padding: 4px 8px; border-radius: 4px;
  transition: color 150ms, background 150ms; white-space: nowrap;
}
.sticky-lnk:hover { color: var(--on-dark); background: rgba(255,255,255,0.08); }
.sticky-lnk.active { color: var(--on-dark); }
.sticky-score {
  font-size: 13px; font-weight: 700; color: var(--on-dark);
  font-feature-settings: "tnum"; display: flex; align-items: center; gap: 6px; flex-shrink: 0;
}
.sticky-dot { width: 7px; height: 7px; border-radius: 50%; }

/* ── REPORT HEADER ── */
.report-header { background: var(--surface-dark); padding: 44px 0 40px; }
.rh-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 36px; }
.rh-wordmark img { height: 26px; filter: brightness(0) invert(1); opacity: 0.92; }
.rh-mark img { width: 44px; height: 44px; border-radius: 50%; }
.rh-kicker {
  font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--muted-on-dark); margin-bottom: 10px;
}
.rh-company {
  font-size: 38px; font-weight: 700; line-height: 1.1; letter-spacing: -0.4px;
  color: var(--on-dark); margin-bottom: 14px;
}
.rh-meta { display: flex; font-size: 13px; color: var(--muted-on-dark); }
.rh-meta span + span::before { content: "·"; margin: 0 8px; color: #444; }

/* ── SCORE HERO ── */
.score-hero-section { background: var(--canvas); padding: 64px 0 56px; border-bottom: 1px solid var(--hairline); }
.score-hero { display: grid; grid-template-columns: 200px 1fr; gap: 56px; align-items: center; }
.score-ring-col { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.score-ring-svg { display: block; overflow: visible; }
.score-ring-track { fill: none; stroke: var(--hairline); stroke-width: 12; }
.score-ring-fill {
  fill: none; stroke-width: 12; stroke-linecap: round;
  transform-origin: center; transform: rotate(-90deg);
  stroke-dasharray: 452.389; stroke-dashoffset: 452.389;
  transition: stroke-dashoffset 1.3s cubic-bezier(0.22, 1, 0.36, 1);
}
.score-num { font-size: 52px; font-weight: 800; fill: var(--ink); font-feature-settings: "tnum"; letter-spacing: -2px; }
.score-denom { font-size: 13px; font-weight: 400; fill: var(--ink-48); }
.tier-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 14px; border-radius: 9999px;
  font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
}
.score-details-col {}
.score-kicker {
  font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-48); margin-bottom: 12px;
}
.exec-summary { font-size: 17px; line-height: 1.75; color: var(--ink-80); margin-top: 16px; }

/* ── LAYER GRID ── */
.layer-grid-section { background: var(--canvas-warm); padding: 48px 0; border-bottom: 1px solid var(--hairline); }
.layer-grid-label {
  font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-48); margin-bottom: 20px;
}
.layer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.layer-card {
  background: var(--canvas); border: 1px solid var(--hairline); border-radius: 10px;
  padding: 20px 22px; border-top: 3px solid transparent;
}
.layer-card.lc-green { border-top-color: var(--score-high); }
.layer-card.lc-amber { border-top-color: var(--score-mid); }
.layer-card.lc-red { border-top-color: var(--score-low); }
.lc-top { margin-bottom: 12px; }
.lc-name { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.10em; text-transform: uppercase; color: var(--ink-48); margin-bottom: 6px; }
.lc-score { display: block; font-size: 26px; font-weight: 800; letter-spacing: -0.5px; font-feature-settings: "tnum"; white-space: nowrap; }
.lc-max { font-size: 13px; font-weight: 400; color: var(--ink-48); }
.lc-bar { height: 4px; background: var(--hairline); border-radius: 9999px; overflow: hidden; }
.lc-fill { height: 100%; border-radius: 9999px; width: 0; transition: width 0.9s cubic-bezier(0.22, 1, 0.36, 1); }
.lc-fill.green { background: var(--score-high); }
.lc-fill.amber { background: var(--score-mid); }
.lc-fill.red { background: var(--score-low); }

/* ── SECTION SHARED ── */
.section-title { font-size: 32px; font-weight: 700; letter-spacing: -0.32px; color: var(--ink); }
.section-sub { font-size: 11px; font-weight: 700; letter-spacing: 0.10em; text-transform: uppercase; color: var(--ink-48); margin-top: 28px; margin-bottom: 14px; }

/* ── INSIGHTS ── */
.insights-section { background: var(--canvas); padding: 64px 0; border-bottom: 1px solid var(--hairline); }
.insights-section .section-title { margin-bottom: 4px; }
.insight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.insight-card { border-radius: 6px; padding: 20px; border-left: 4px solid; }
.insight-card.strength { background: var(--score-high-bg); border-color: var(--score-high); }
.insight-card.weakness { background: var(--score-low-bg); border-color: var(--score-low); }
.ic-title { font-size: 15px; font-weight: 600; letter-spacing: -0.15px; margin-bottom: 6px; }
.ic-body { font-size: 14px; color: var(--ink-80); line-height: 1.55; }

/* ── OPPORTUNITIES ── */
.opportunities-section { background: var(--canvas-warm); padding: 64px 0; border-bottom: 1px solid var(--hairline); }
.opp-group { margin-top: 36px; }
.opp-group-hd { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.priority-badge {
  display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; padding: 3px 10px; border-radius: 9999px;
}
.pb-immediate { background: #FEE2E2; color: #991B1B; }
.pb-next { background: #FEF3C7; color: #92400E; }
.pb-later { background: #DBEAFE; color: #1E40AF; }
.opp-group-desc { font-size: 12px; color: var(--ink-48); font-weight: 500; }
.opp-card {
  background: var(--canvas); border: 1px solid var(--hairline); border-radius: 10px;
  padding: 18px 22px; margin-bottom: 10px;
  transition: box-shadow 150ms;
}
.opp-card:hover { box-shadow: 0 2px 10px rgba(0,0,0,0.07); }
.opp-title { font-size: 15px; font-weight: 600; letter-spacing: -0.15px; margin-bottom: 6px; }
.opp-body { font-size: 14px; color: var(--ink-80); line-height: 1.55; margin-bottom: 12px; }
.opp-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.opp-tag {
  font-size: 11px; font-weight: 600; letter-spacing: 0.03em;
  padding: 2px 8px; background: var(--canvas-warm); border: 1px solid var(--hairline);
  border-radius: 4px; color: var(--ink-80);
}

/* ── SIGNALS DETAILED ── */
.signals-section { background: var(--canvas); padding: 64px 0 80px; }
.signals-section-hd { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 40px; }
.expand-all-btn {
  font-size: 13px; font-weight: 600; color: var(--ink-48); background: none;
  border: 1px solid var(--hairline); border-radius: 6px; padding: 6px 14px;
  cursor: pointer; transition: color 150ms, border-color 150ms;
}
.expand-all-btn:hover { color: var(--ink); border-color: var(--ink-24); }
.layer-section { margin-bottom: 52px; }
.layer-section:last-child { margin-bottom: 0; }
.ls-header {
  display: flex; align-items: center; gap: 14px;
  padding: 0 0 16px; border-bottom: 2px solid var(--ink); margin-bottom: 0;
}
.ls-num { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-48); width: 52px; flex-shrink: 0; }
.ls-name { font-size: 19px; font-weight: 700; letter-spacing: -0.2px; flex: 1; }
.ls-score { font-size: 13px; font-weight: 700; color: var(--ink-48); font-feature-settings: "tnum"; }
.ls-color-bar { width: 4px; height: 20px; border-radius: 2px; flex-shrink: 0; }
.ls-color-bar.green { background: var(--score-high); }
.ls-color-bar.amber { background: var(--score-mid); }
.ls-color-bar.red { background: var(--score-low); }

/* Signal accordion item */
.signal-item {
  border: 1px solid var(--hairline); border-top: none;
  background: var(--canvas); overflow: hidden;
  transition: background 150ms;
}
.signal-item:first-of-type { border-top: 1px solid var(--hairline); }
.signal-item:last-child { border-radius: 0 0 8px 8px; }
.signal-item.open { background: #FDFDFB; }
.si-header {
  display: flex; align-items: center; padding: 14px 22px; cursor: pointer;
  gap: 14px; user-select: none; transition: background 120ms;
}
.si-header:hover { background: var(--canvas-warm); }
.si-id { font-size: 11px; font-weight: 700; color: var(--ink-24); min-width: 22px; font-feature-settings: "tnum"; }
.si-name { font-size: 15px; font-weight: 600; letter-spacing: -0.15px; color: var(--ink); flex: 1; }
.si-score-wrap { display: flex; align-items: center; gap: 7px; }
.score-pip { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.pip-high { background: var(--score-high); }
.pip-mid { background: var(--score-mid); }
.pip-low { background: var(--score-low); }
.si-score-val { font-size: 14px; font-weight: 700; font-feature-settings: "tnum"; color: var(--ink); }
.confidence-tag {
  font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: 9999px; letter-spacing: 0.02em;
}
.ct-high { background: #C6F6D5; color: #276749; }
.ct-medium { background: #FEFCBF; color: #744210; }
.ct-low { background: #FED7D7; color: #9B2C2C; }
.si-expand {
  width: 18px; height: 18px; display: flex; align-items: center; justify-content: center;
  color: var(--ink-24); flex-shrink: 0; transition: transform 220ms ease, color 150ms;
}
.signal-item.open .si-expand { transform: rotate(45deg); color: var(--ink-48); }
.si-body {
  max-height: 0; overflow: hidden;
  transition: max-height 350ms cubic-bezier(0.4, 0, 0.2, 1);
}
.signal-item.open .si-body { max-height: 1200px; }
.si-body-inner { padding: 4px 22px 22px; border-top: 1px solid var(--hairline); }
.si-evidence {
  font-size: 13px; line-height: 1.65; color: var(--ink-80); font-style: italic;
  padding: 10px 14px; border-left: 3px solid var(--hairline);
  background: var(--canvas-warm); border-radius: 0 4px 4px 0; margin: 16px 0 14px;
}
.si-evidence-lbl {
  font-size: 10px; font-weight: 700; letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--ink-48); font-style: normal; display: block; margin-bottom: 4px;
}
.si-sec-lbl {
  font-size: 10px; font-weight: 700; letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--ink-48); margin: 14px 0 7px;
}
.si-list { padding-left: 18px; font-size: 14px; color: var(--ink-80); line-height: 1.6; }
.si-list li { margin-bottom: 4px; }

/* ── COMPETITIVE BENCHMARK ── */
.benchmark-section { background: var(--canvas-warm); padding: 64px 0; border-top: 1px solid var(--hairline); }
.benchmark-table { width: 100%; border-collapse: collapse; margin-top: 28px; }
.benchmark-table th {
  text-align: left; font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.10em; color: var(--ink-48); padding: 8px 12px;
  border-bottom: 2px solid var(--hairline);
}
.benchmark-table td { padding: 12px; border-bottom: 1px solid var(--hairline); font-size: 15px; }
.benchmark-table tr.current-brand { font-weight: 700; background: var(--canvas); }

/* ── FOOTER ── */
footer { background: var(--canvas-warm); border-top: 1px solid var(--hairline); padding: 36px 0; }
.footer-inner { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.footer-brand { display: flex; align-items: center; gap: 10px; }
.footer-mark { width: 22px; height: 22px; border-radius: 50%; }
.footer-wordmark { height: 15px; opacity: 0.5; }
.footer-text { font-size: 11px; color: var(--ink-48); line-height: 1.55; text-align: right; }

/* ── PRINT BTN ── */
.print-btn {
  position: fixed; bottom: 24px; right: 24px; z-index: 100;
  background: var(--ink); color: var(--on-dark); border: none;
  padding: 9px 16px; border-radius: 6px; font-size: 13px; font-weight: 600;
  cursor: pointer; display: flex; align-items: center; gap: 6px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.18); transition: background 150ms, transform 150ms;
  font-family: inherit;
}
.print-btn:hover { background: #333; transform: translateY(-1px); }
.print-btn:active { transform: translateY(0); }

/* ── INDEX PAGE (homepage) ── */
.index-hero { background: var(--surface-dark); padding: 56px 0 48px; }
.index-hero-inner { max-width: 900px; margin: 0 auto; padding: 0 32px; }
.index-hero-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 36px; }
.index-hero-top .rh-wordmark img { height: 26px; filter: brightness(0) invert(1); opacity: 0.92; }
.index-hero-top .rh-mark img { width: 44px; height: 44px; border-radius: 50%; }
.index-kicker {
  font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--muted-on-dark); margin-bottom: 10px;
}
.index-title {
  font-size: 38px; font-weight: 700; line-height: 1.1; letter-spacing: -0.4px;
  color: var(--on-dark); margin-bottom: 14px;
}
.index-lede { font-size: 16px; color: var(--muted-on-dark); max-width: 600px; line-height: 1.55; }

.runs-section { padding: 56px 0 80px; background: var(--canvas); }
.runs-table-wrap { overflow-x: auto; margin-top: 28px; }
.runs-table { width: 100%; border-collapse: collapse; }
.runs-table th {
  text-align: left; font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.10em; color: var(--ink-48); padding: 12px 14px;
  border-bottom: 2px solid var(--hairline); cursor: pointer; user-select: none;
  white-space: nowrap;
}
.runs-table th:hover { color: var(--ink); }
.runs-table th .sort-arrow { display: inline-block; margin-left: 4px; opacity: 0.4; font-size: 10px; }
.runs-table th.sort-asc .sort-arrow, .runs-table th.sort-desc .sort-arrow { opacity: 1; color: var(--ink); }
.runs-table td {
  padding: 14px; border-bottom: 1px solid var(--hairline); font-size: 14px;
  color: var(--ink-80);
}
.runs-table tr.run-row { transition: background 120ms; cursor: pointer; }
.runs-table tr.run-row:hover { background: var(--canvas-warm); }
.run-company { font-weight: 600; color: var(--ink); font-size: 15px; letter-spacing: -0.15px; }
.run-domain { color: var(--ink-48); font-size: 13px; }
.run-industry { color: var(--ink-80); }
.run-score-cell { white-space: nowrap; }
.run-score-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 12px; border-radius: 9999px;
  font-size: 13px; font-weight: 700; font-feature-settings: "tnum";
  color: var(--on-dark);
}
.run-score-num { font-size: 14px; }
.run-score-denom { font-size: 11px; opacity: 0.7; font-weight: 500; }
.run-tier-badge {
  display: inline-flex; align-items: center;
  padding: 3px 10px; border-radius: 9999px;
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
}
.run-date { color: var(--ink-48); font-size: 13px; font-feature-settings: "tnum"; white-space: nowrap; }
.runs-empty { padding: 64px 0; text-align: center; color: var(--ink-48); font-size: 15px; }

/* ── LOADING/ERROR STATES ── */
.viewer-status {
  padding: 96px 32px; text-align: center; color: var(--ink-48); font-size: 15px;
}
.viewer-status a { color: var(--ink); text-decoration: underline; }

/* ── RESPONSIVE ── */
@media (max-width: 640px) {
  .score-hero { grid-template-columns: 1fr; }
  .score-ring-col { margin-bottom: 8px; }
  .layer-grid { grid-template-columns: 1fr 1fr; }
  .insight-grid { grid-template-columns: 1fr; }
  .rh-top { flex-direction: column; align-items: flex-start; gap: 12px; }
  .rh-company { font-size: 28px; }
  .footer-inner { flex-direction: column; text-align: center; }
  .footer-text { text-align: center; }
  .sticky-layers { display: none; }
  .index-hero-top { flex-direction: column; align-items: flex-start; gap: 12px; }
  .index-title { font-size: 28px; }
  .runs-table th, .runs-table td { padding: 10px 8px; font-size: 13px; }
  .run-industry { display: none; }
}
@media (max-width: 480px) {
  .layer-grid { grid-template-columns: 1fr; }
}

/* ── PRINT ── */
@media print {
  .print-btn, .sticky-nav { display: none !important; }
  .si-body { max-height: none !important; }
  .lc-fill { transition: none; }
  .layer-section { page-break-inside: avoid; }
}

/* ───────────────────────────────────────────────────────────────────────
   LANDING PAGE  (index.html — brand surface)
   ─────────────────────────────────────────────────────────────────────── */

.landing-page {
  background: var(--canvas);
  font-family: 'IBM Plex Sans', system-ui, sans-serif;
  font-feature-settings: "tnum";
}
.landing-page .display-serif,
.landing-page .landing-hero-h1,
.landing-page .framework-h2,
.landing-page .sample-h2,
.landing-page .method-h2,
.landing-page .who-h2,
.landing-page .closer-h2,
.landing-page .layer-row-num,
.landing-page .landing-hero-stats dd,
.landing-page .preview-intro h1 {
  font-family: 'Prata', Georgia, 'Times New Roman', serif;
  font-weight: 400;
  font-feature-settings: "tnum";
}
/* Prata has no italic; suppress browser-synthesized faux italic on <em> in the hero. */
.landing-page .landing-hero-h1 em {
  font-style: normal;
  color: inherit;
  font-weight: inherit;
}

.landing-page main {
  display: block;
}

.landing-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-48);
  margin-bottom: 18px;
}

/* ── Landing nav ── */
.landing-nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--surface-black);
  height: 64px;
  display: flex;
  align-items: center;
  padding: 0 32px;
  border-bottom: 1px solid #181818;
}
.landing-nav-inner {
  max-width: 1240px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 28px;
}
.landing-nav-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
}
.landing-nav-mark {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  flex-shrink: 0;
}
.landing-nav-wordmark {
  height: 15px;
  filter: brightness(0) invert(1);
  opacity: 0.94;
}
.landing-nav-links {
  display: flex;
  gap: 28px;
  flex: 1;
  margin-left: 18px;
}
.landing-nav-lnk {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.05px;
  color: rgba(255, 255, 255, 0.66);
  text-decoration: none;
  transition: color 160ms ease;
  padding: 8px 0;
}
.landing-nav-lnk:hover,
.landing-nav-lnk:focus-visible {
  color: var(--on-dark);
  outline: none;
}
.landing-nav-cta {
  background: var(--accent);
  color: var(--on-dark);
  padding: 9px 18px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.1px;
  text-decoration: none;
  flex-shrink: 0;
  transition: background 160ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}
.landing-nav-cta:hover { background: #C8151C; transform: translateY(-1px); }
.landing-nav-cta:focus-visible { outline: 2px solid var(--on-dark); outline-offset: 2px; }

/* ── Hero ── */
.landing-hero {
  padding: 124px 32px 96px;
  border-bottom: 1px solid var(--hairline);
  background: var(--canvas);
}
.landing-hero-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.landing-hero-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-48);
  margin-bottom: 28px;
}
.landing-hero-h1 {
  font-size: clamp(44px, 6.6vw, 80px);
  line-height: 1.06;
  letter-spacing: -0.012em;
  color: var(--ink);
  max-width: 17ch;
  margin-bottom: 32px;
}
.landing-hero-lede {
  font-size: clamp(17px, 1.6vw, 20px);
  font-weight: 400;
  line-height: 1.55;
  color: var(--ink-80);
  max-width: 62ch;
  margin-bottom: 44px;
}
.landing-hero-actions {
  display: flex;
  gap: 24px;
  align-items: center;
  margin-bottom: 72px;
}
.cta-primary {
  background: var(--accent);
  color: var(--on-dark);
  padding: 13px 22px;
  border-radius: 6px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.1px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background 160ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 200ms ease;
}
.cta-primary:hover {
  background: #C8151C;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(237, 28, 36, 0.22);
}
.cta-primary:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}
.cta-arrow {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--ink);
  transition: color 160ms ease, border-color 160ms ease;
}
.cta-arrow:hover {
  color: var(--ink-80);
  border-color: var(--ink-80);
}

.landing-hero-stats {
  display: grid;
  grid-template-columns: repeat(4, max-content);
  gap: 56px;
  padding-top: 32px;
  border-top: 1px solid var(--hairline);
  margin: 0;
}
.landing-hero-stats > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.landing-hero-stats dt {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-48);
}
.landing-hero-stats dd {
  font-size: 44px;
  line-height: 1;
  letter-spacing: -0.005em;
  font-feature-settings: "tnum";
  color: var(--ink);
  margin: 0;
}

/* ── Framework section ── */
.framework-section {
  padding: 104px 32px;
  background: var(--canvas-warm);
  border-bottom: 1px solid var(--hairline);
}
.framework-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.framework-h2 {
  font-size: clamp(30px, 3.8vw, 48px);
  line-height: 1.1;
  letter-spacing: -0.012em;
  color: var(--ink);
  max-width: 22ch;
  margin-bottom: 56px;
}
.layer-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}
.layer-row {
  display: grid;
  grid-template-columns: 96px 1fr 1fr;
  gap: 48px;
  padding: 32px 0;
  border-top: 1px solid var(--ink);
  align-items: start;
}
.layer-row:last-child {
  border-bottom: 1px solid var(--ink);
}
.layer-row-num {
  font-size: 44px;
  font-feature-settings: "tnum";
  color: var(--ink);
  letter-spacing: -0.005em;
  line-height: 1;
  padding-top: 2px;
}
.layer-row-name {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.013em;
  color: var(--ink);
  margin: 0 0 10px;
}
.layer-row-q {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--ink-80);
  max-width: 38ch;
  margin: 0;
}
.layer-row-meta {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: flex-start;
}
.layer-row-weight {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-48);
  font-feature-settings: "tnum";
}
.layer-row-signals {
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--ink-80);
}
.layer-row-signals span:not(:last-child)::after {
  content: " · ";
  color: var(--ink-24);
  margin: 0 4px;
}
.framework-foot {
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--ink-48);
  max-width: 58ch;
  margin-top: 32px;
}

/* ── Sample section ── */
.sample-section {
  padding: 104px 32px;
  background: var(--canvas);
  border-bottom: 1px solid var(--hairline);
}
.sample-inner {
  max-width: 1240px;
  margin: 0 auto;
}
.sample-h2 {
  font-size: clamp(30px, 3.8vw, 48px);
  line-height: 1.1;
  letter-spacing: -0.012em;
  color: var(--ink);
  max-width: 22ch;
  margin-bottom: 18px;
}
.sample-lede {
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-80);
  max-width: 62ch;
  margin-bottom: 48px;
}
.sample-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}
.sample-card {
  display: flex;
  flex-direction: column;
}
.sample-meta {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--hairline);
}
.sample-meta-name {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.012em;
  color: var(--ink);
  margin-bottom: 3px;
}
.sample-meta-domain {
  font-size: 12.5px;
  color: var(--ink-48);
  letter-spacing: -0.02px;
}
.sample-meta-score {
  margin-left: auto;
  font-size: 12px;
  font-weight: 700;
  font-feature-settings: "tnum";
  letter-spacing: 0.02em;
  padding: 5px 12px;
  border-radius: 9999px;
  background: var(--score-mid-bg);
  color: #92400E;
  white-space: nowrap;
  flex-shrink: 0;
}
.sample-frame-wrap {
  position: relative;
  height: 560px;
  border: 1px solid var(--hairline);
  border-radius: 8px;
  overflow: hidden;
  background: var(--canvas-warm);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.02), 0 12px 32px rgba(0, 0, 0, 0.05);
}
.sample-frame {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: var(--canvas);
}
.sample-link-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}
.sample-link-row a {
  color: var(--ink);
  text-decoration: none;
  padding-bottom: 1px;
  border-bottom: 1px solid var(--accent);
  transition: color 160ms ease;
}
.sample-link-row a:hover { color: var(--accent); }
.sample-link-row svg { color: var(--ink-48); }

/* ── Methodology section ── */
.method-section {
  padding: 104px 32px;
  background: var(--canvas-warm);
  border-bottom: 1px solid var(--hairline);
}
.method-inner {
  max-width: 980px;
  margin: 0 auto;
}
.method-h2 {
  font-size: clamp(30px, 3.8vw, 48px);
  line-height: 1.1;
  letter-spacing: -0.012em;
  color: var(--ink);
  max-width: 24ch;
  margin-bottom: 8px;
}
.method-list {
  list-style: none;
  padding: 0;
  margin: 48px 0 64px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.method-row {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 32px;
  align-items: start;
}
.method-row-num {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-48);
  padding-top: 12px;
  font-feature-settings: "tnum";
}
.method-row-h {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.013em;
  color: var(--ink);
  margin: 0 0 12px;
}
.method-row-body {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ink-80);
  max-width: 62ch;
  margin: 0;
}

.tier-strip {
  margin-top: 16px;
  padding-top: 32px;
  border-top: 1px solid var(--hairline);
}
.tier-strip-h {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-48);
  margin-bottom: 16px;
}
.tier-strip-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  border: 1px solid var(--hairline);
  border-radius: 6px;
  overflow: hidden;
  background: var(--canvas);
}
.tier-cell {
  padding: 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  border-right: 1px solid var(--hairline);
}
.tier-cell:last-child { border-right: none; }
.tier-cell-elite {
  background: var(--ink);
  color: var(--on-dark);
}
.tier-cell-range {
  font-size: 12px;
  font-weight: 700;
  font-feature-settings: "tnum";
  color: var(--ink);
  letter-spacing: 0.01em;
}
.tier-cell-elite .tier-cell-range { color: var(--on-dark); }
.tier-cell-name {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-48);
}
.tier-cell-elite .tier-cell-name { color: rgba(255, 255, 255, 0.7); }

/* ── Who section ── */
.who-section {
  padding: 104px 32px;
  background: var(--canvas);
  border-bottom: 1px solid var(--hairline);
}
.who-inner {
  max-width: 820px;
  margin: 0 auto;
}
.who-mark {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  margin-bottom: 32px;
}
.who-h2 {
  font-size: clamp(28px, 3.2vw, 40px);
  line-height: 1.18;
  letter-spacing: -0.012em;
  color: var(--ink);
  max-width: 28ch;
  margin-bottom: 28px;
}
.who-body {
  font-size: 17px;
  line-height: 1.65;
  color: var(--ink-80);
  margin: 0 0 16px;
  max-width: 65ch;
}

/* ── Closer ── */
.closer-section {
  padding: 104px 32px 96px;
  background: var(--surface-dark);
  color: var(--on-dark);
}
.closer-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.closer-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted-on-dark);
  margin-bottom: 20px;
}
.closer-h2 {
  font-size: clamp(36px, 4.4vw, 60px);
  line-height: 1.08;
  letter-spacing: -0.012em;
  color: var(--on-dark);
  max-width: 22ch;
  margin-bottom: 18px;
}
.closer-sub {
  font-size: 18px;
  line-height: 1.55;
  color: var(--muted-on-dark);
  margin: 0 0 64px;
  max-width: 56ch;
}
.closer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
}
.closer-card {
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  padding-top: 28px;
}
.closer-card-kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--muted-on-dark);
  margin-bottom: 14px;
}
.closer-card-h {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.015em;
  color: var(--on-dark);
  margin: 0 0 14px;
}
.closer-card-body {
  font-size: 15px;
  line-height: 1.6;
  color: var(--muted-on-dark);
  margin: 0 0 28px;
  max-width: 44ch;
}
.closer-card-cta {
  background: #F24E54;
  color: var(--on-dark);
  padding: 12px 22px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.1px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background 160ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}
.closer-card-cta:hover { background: var(--accent); transform: translateY(-1px); }
.closer-card-cta:focus-visible { outline: 2px solid var(--on-dark); outline-offset: 2px; }

.closer-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.closer-form[hidden] { display: none; }
.closer-form-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--muted-on-dark);
  margin-top: 6px;
  margin-bottom: -4px;
}
.closer-form-input {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  padding: 12px 14px;
  color: var(--on-dark);
  font-family: inherit;
  font-size: 14px;
  letter-spacing: -0.05px;
  transition: border-color 160ms ease, background 160ms ease;
  width: 100%;
}
.closer-form-input::placeholder {
  color: rgba(255, 255, 255, 0.42);
}
.closer-form-input:hover {
  border-color: rgba(255, 255, 255, 0.3);
}
.closer-form-input:focus-visible {
  outline: none;
  border-color: var(--on-dark);
  background: rgba(255, 255, 255, 0.08);
}
.closer-form-submit {
  margin-top: 12px;
  background: var(--on-dark);
  color: var(--ink);
  border: none;
  padding: 13px 18px;
  border-radius: 6px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.05px;
  cursor: pointer;
  transition: background 160ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}
.closer-form-submit:hover {
  background: #F5F5F5;
  transform: translateY(-1px);
}
.closer-form-submit:focus-visible {
  outline: 2px solid var(--on-dark);
  outline-offset: 2px;
}
.closer-form-error {
  font-size: 13px;
  color: #FFD7D7;
  padding: 10px 14px;
  border: 1px solid rgba(255, 100, 100, 0.4);
  border-radius: 6px;
  background: rgba(255, 0, 0, 0.06);
  margin-top: 4px;
}
.closer-form-error[hidden] { display: none; }
.closer-form-success {
  font-size: 15px;
  line-height: 1.55;
  color: var(--on-dark);
  padding: 18px 18px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.05);
  margin-top: 8px;
}
.closer-form-success[hidden] { display: none; }
.closer-form-success strong {
  color: var(--on-dark);
  display: block;
  margin-bottom: 6px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.closer-fine {
  font-size: 12px;
  color: var(--muted-on-dark);
  margin-top: 14px;
  opacity: 0.78;
}

/* ── Landing responsive ── */
@media (max-width: 1000px) {
  .landing-hero-h1 { max-width: none; }
  .layer-row { grid-template-columns: 72px 1fr; }
  .layer-row-meta {
    grid-column: 1 / -1;
    padding-left: 96px;
    padding-top: 6px;
  }
  .sample-grid { grid-template-columns: 1fr; }
  .closer-grid { grid-template-columns: 1fr; gap: 48px; }
}
@media (max-width: 720px) {
  .landing-nav { padding: 0 16px; height: 56px; }
  .landing-nav-links { display: none; }
  .landing-nav-inner { gap: 14px; }
  .landing-hero { padding: 72px 24px 64px; }
  .landing-hero-actions { flex-direction: column; align-items: flex-start; gap: 18px; margin-bottom: 56px; }
  .landing-hero-stats { gap: 28px; grid-template-columns: repeat(2, max-content); }
  .landing-hero-stats dd { font-size: 30px; }
  .framework-section,
  .sample-section,
  .method-section,
  .who-section,
  .closer-section {
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 72px;
    padding-bottom: 72px;
  }
  .layer-row {
    grid-template-columns: 56px 1fr;
    gap: 20px;
    padding: 24px 0;
  }
  .layer-row-num { font-size: 28px; }
  .layer-row-meta { padding-left: 76px; }
  .layer-row-signals { font-size: 13px; }
  .sample-frame-wrap { height: 460px; }
  .sample-meta { flex-wrap: wrap; }
  .sample-meta-score { margin-left: 0; margin-top: 6px; }
  .method-row { grid-template-columns: 1fr; gap: 8px; }
  .method-row-num { padding-top: 0; }
  .tier-strip-grid { grid-template-columns: 1fr 1fr; }
  .tier-cell { border-right: 1px solid var(--hairline); }
  .tier-cell:nth-child(2n) { border-right: none; }
  .tier-cell { border-bottom: 1px solid var(--hairline); }
  .tier-cell:nth-last-child(-n+2) { border-bottom: none; }
  .closer-section { padding-top: 72px; padding-bottom: 72px; }
  .closer-sub { margin-bottom: 48px; }
}
@media (max-width: 420px) {
  .landing-hero-stats { grid-template-columns: repeat(2, 1fr); gap: 20px 24px; }
  .layer-row-meta { padding-left: 0; }
  .layer-row-meta { padding-top: 12px; }
  .sample-frame-wrap { height: 380px; }
}

/* Reduced motion: kill entrance animations and slow transitions */
@media (prefers-reduced-motion: reduce) {
  .cta-primary,
  .landing-nav-cta,
  .closer-card-cta,
  .closer-form-submit { transition: background 100ms ease; transform: none !important; }
  .cta-primary:hover,
  .landing-nav-cta:hover,
  .closer-card-cta:hover,
  .closer-form-submit:hover { transform: none !important; box-shadow: none !important; }
}