/*
 * StirLight 2026 graphic profile — corpus pages only.
 * Scoped to body.stirlight-corpus. Site-wide chrome (header, footer, Astra
 * palette, older Spectra pages) lives in stirlight-2026-site.css.
 *
 * Tokens match StirLight Brand 2026 / 05_Web_Tokens/stirlight-2026.css.
 * Light mode is pinned: Paper canvas, Navy text, Amber Deep for links and
 * filled buttons. Coral is not used as a background.
 *
 * StirLight-one is ExtraLight and must never be synthesised as bold; hierarchy
 * is size. Until the webfont is hosted, headings fall through to Cabin.
 */

body.stirlight-corpus {
  --sl-navy-500: #4E5A73;
  --sl-navy-600: #3A445A;
  --sl-navy-700: #2A3243;
  --sl-navy-800: #1C2331;
  --sl-navy-900: #141A25;
  --sl-stone-100: #F2F4F7;
  --sl-stone-200: #E6E9EE;
  --sl-stone-300: #D2D6DE;
  --sl-stone-400: #B4BAC6;
  --sl-stone-500: #939BAC;
  --sl-stone-600: #646D7F;
  --sl-stone-700: #4B5364;
  --sl-warm-100: #FFF4E4;
  --sl-warm-200: #FEDEB8;
  --sl-warm-300: #F9B890;
  --sl-warm-400: #D4936B;
  --sl-warm-500: #D15410;
  --sl-warm-600: #A8410A;
  --sl-warm-700: #7C2F06;
  --sl-paper: #FBFAF8;
  --sl-white: #FFFFFF;

  --sl-canvas: #FBFAF8;
  --sl-surface: #FFFFFF;
  --sl-surface-alt: #F2F4F7;
  --sl-surface-warm: #FFF4E4;
  --sl-text: #2A3243;
  --sl-text-muted: #3A445A;
  --sl-text-subtle: #646D7F;
  --sl-text-invert: #FBFAF8;
  --sl-border: #D2D6DE;
  --sl-border-strong: #939BAC;
  --sl-accent: #D15410;
  --sl-accent-text: #A8410A;
  --sl-accent-quiet: #FEDEB8;
  --sl-focus: #D15410;

  --sl-font-head: "StirLight-one", "Cabin", "Trebuchet MS", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --sl-font-sans: "Cabin", "Trebuchet MS", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --sl-font-mono: Consolas, Menlo, "DejaVu Sans Mono", "Courier New", monospace;

  --sl-text-display: 3.8125rem;
  --sl-lh-display: 1.05;
  --sl-text-h1: 2.4375rem;
  --sl-lh-h1: 1.15;
  --sl-text-h2: 1.9375rem;
  --sl-lh-h2: 1.2;
  --sl-text-h3: 1.5625rem;
  --sl-lh-h3: 1.25;
  --sl-text-h4: 1.25rem;
  --sl-lh-h4: 1.3;
  --sl-text-body-lg: 1.125rem;
  --sl-lh-body-lg: 1.55;
  --sl-text-body: 1rem;
  --sl-lh-body: 1.55;
  --sl-text-small: 0.875rem;
  --sl-lh-small: 1.45;
  --sl-text-caption: 0.75rem;
  --sl-lh-caption: 1.4;
  --sl-text-micro: 0.625rem;
  --sl-lh-micro: 1.35;

  --sl-space-1: 4px;
  --sl-space-2: 8px;
  --sl-space-3: 12px;
  --sl-space-4: 16px;
  --sl-space-5: 24px;
  --sl-space-6: 32px;
  --sl-space-7: 48px;
  --sl-space-8: 64px;
  --sl-radius-sm: 4px;
  --sl-radius-md: 8px;
  --sl-radius-lg: 16px;
  --sl-radius-pill: 999px;
}

/* ------------------------------------------------------------------ canvas */
body.stirlight-corpus,
body.stirlight-corpus #content,
body.stirlight-corpus .site-content,
body.stirlight-corpus .site-content .ast-container,
body.stirlight-corpus .entry-content,
body.stirlight-corpus article {
  background-color: var(--sl-canvas);
  color: var(--sl-text);
}

body.stirlight-corpus .site-content {
  font-family: var(--sl-font-sans);
  font-size: var(--sl-text-body);
  line-height: var(--sl-lh-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.stirlight-corpus .site-content a:focus-visible,
body.stirlight-corpus .entry-title a:focus-visible {
  outline: 2px solid var(--sl-focus);
  outline-offset: 2px;
}

/* Flush the shared mast to the navy header (Astra otherwise adds ~60px). */
body.stirlight-corpus.ast-plain-container.ast-no-sidebar #primary,
body.stirlight-corpus.ast-plain-container.ast-single-post #primary {
  margin-top: 0;
}

/* ------------------------------------------------------------------ kicker + title
 * Shared section mast for Problems / Compare / Applications / Team
 * (and their child articles). Full-bleed ink band, Coral kicker, Paper
 * title — one treatment, not per-page CSS.
 */
body.stirlight-corpus .entry-header {
  background: var(--sl-navy-700);
  color: var(--sl-text-invert);
  box-shadow: 0 0 0 100vmax var(--sl-navy-700);
  clip-path: inset(0 -100vmax);
  margin: 0 0 var(--sl-space-6);
  padding: var(--sl-space-7) 0 var(--sl-space-6);
}

body.stirlight-corpus .entry-header .entry-title,
body.stirlight-corpus h1.entry-title {
  font-family: var(--sl-font-head) !important;
  font-weight: 400 !important;
  font-size: clamp(1.75rem, 1.2rem + 2vw, var(--sl-text-h1)) !important;
  line-height: var(--sl-lh-h1) !important;
  letter-spacing: -0.01em !important;
  color: var(--sl-text-invert) !important;
  text-transform: none !important;
  margin: 0 !important;
  max-width: 28em;
}

body.stirlight-corpus .entry-header .entry-title::before {
  display: block;
  margin: 0 0 var(--sl-space-3);
  font-family: var(--sl-font-sans);
  font-size: var(--sl-text-micro);
  font-weight: 600;
  line-height: var(--sl-lh-micro);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sl-warm-300);
}

body.stirlight-corpus.stirlight-kind-problems .entry-title::before { content: "Problems"; }
body.stirlight-corpus.stirlight-kind-compare .entry-title::before { content: "Compare"; }
body.stirlight-corpus.stirlight-kind-applications .entry-title::before { content: "Applications"; }
body.stirlight-corpus.stirlight-kind-sectors .entry-title::before { content: "Sectors"; }
body.stirlight-corpus.stirlight-kind-team .entry-title::before { content: "Team"; }

body.stirlight-corpus .ast-breadcrumbs-wrapper,
body.stirlight-corpus .rank-math-breadcrumb {
  font-size: var(--sl-text-caption);
  line-height: var(--sl-lh-caption);
  color: var(--sl-text-subtle);
  letter-spacing: 0.01em;
  margin-bottom: var(--sl-space-5);
}

body.stirlight-corpus .ast-breadcrumbs-wrapper a,
body.stirlight-corpus .rank-math-breadcrumb a {
  color: var(--sl-text-muted);
}

/* ------------------------------------------------------------------ article measure */
body.stirlight-corpus .stirlight-article {
  max-width: 920px;
  color: var(--sl-text-muted);
}

body.stirlight-corpus .stirlight-article > p,
body.stirlight-corpus .stirlight-article > h2,
body.stirlight-corpus .stirlight-article > h3,
body.stirlight-corpus .stirlight-article > h4,
body.stirlight-corpus .stirlight-article > ul:not(.stirlight-card-list),
body.stirlight-corpus .stirlight-article > ol,
body.stirlight-corpus .stirlight-byline {
  max-width: 72ch;
}

body.stirlight-corpus .stirlight-article p,
body.stirlight-corpus .stirlight-article li {
  font-size: var(--sl-text-body);
  line-height: var(--sl-lh-body);
}

body.stirlight-corpus .stirlight-article > p:first-of-type {
  font-size: var(--sl-text-body-lg);
  line-height: var(--sl-lh-body-lg);
  color: var(--sl-text);
}

body.stirlight-corpus .stirlight-article p {
  margin: 0 0 var(--sl-space-5);
}

body.stirlight-corpus .stirlight-article ul,
body.stirlight-corpus .stirlight-article ol {
  margin: 0 0 var(--sl-space-5);
  padding-left: 1.25em;
}

body.stirlight-corpus .stirlight-article li + li {
  margin-top: var(--sl-space-2);
}

body.stirlight-corpus .stirlight-article a {
  color: var(--sl-accent-text);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

body.stirlight-corpus .stirlight-article a:hover {
  color: var(--sl-warm-700);
}

/* ------------------------------------------------------------------ headings in content */
body.stirlight-corpus .stirlight-article h2,
body.stirlight-corpus .stirlight-article h3,
body.stirlight-corpus .stirlight-article h4,
body.stirlight-corpus .entry-content h2,
body.stirlight-corpus .entry-content h3,
body.stirlight-corpus .entry-content h4 {
  font-family: var(--sl-font-head) !important;
  font-weight: 400 !important;
  color: var(--sl-text) !important;
  letter-spacing: -0.01em;
  text-transform: none !important;
  scroll-margin-top: 5rem;
}

body.stirlight-corpus .stirlight-article h2,
body.stirlight-corpus .entry-content h2 {
  font-size: clamp(1.375rem, 1rem + 1.2vw, var(--sl-text-h2)) !important;
  line-height: var(--sl-lh-h2) !important;
  margin: var(--sl-space-7) 0 var(--sl-space-4) !important;
}

body.stirlight-corpus .stirlight-article h3,
body.stirlight-corpus .entry-content h3 {
  font-size: var(--sl-text-h3) !important;
  line-height: var(--sl-lh-h3) !important;
  letter-spacing: 0 !important;
  margin: var(--sl-space-6) 0 var(--sl-space-3) !important;
}

body.stirlight-corpus .stirlight-article h4,
body.stirlight-corpus .entry-content h4 {
  font-size: var(--sl-text-h4) !important;
  line-height: var(--sl-lh-h4) !important;
  letter-spacing: 0 !important;
  margin: var(--sl-space-5) 0 var(--sl-space-2) !important;
}

/* ------------------------------------------------------------------ byline + direct answer */
body.stirlight-corpus .stirlight-byline {
  font-size: var(--sl-text-small);
  line-height: var(--sl-lh-small);
  color: var(--sl-text-subtle);
  margin: 0 auto var(--sl-space-6);
  max-width: 72ch;
}

body.stirlight-corpus .stirlight-byline a {
  color: var(--sl-accent-text);
}

body.stirlight-corpus .stirlight-direct-answer {
  background: var(--sl-surface-warm);
  color: var(--sl-text);
  border-left: 4px solid var(--sl-accent);
  border-radius: 0 var(--sl-radius-md) var(--sl-radius-md) 0;
  padding: var(--sl-space-5) var(--sl-space-5) var(--sl-space-5) var(--sl-space-6);
  margin: 0 0 var(--sl-space-7);
  font-size: var(--sl-text-body-lg);
  line-height: var(--sl-lh-body-lg);
}

body.stirlight-corpus .stirlight-direct-answer strong {
  color: var(--sl-text);
  font-weight: 600;
}

body.stirlight-corpus .stirlight-disclaimer,
body.stirlight-corpus .stirlight-vignette {
  background: var(--sl-surface-alt);
  border: 1px solid var(--sl-border);
  border-radius: var(--sl-radius-md);
  padding: var(--sl-space-4) var(--sl-space-5);
  color: var(--sl-text-muted);
}

body.stirlight-corpus .stirlight-disclaimer {
  border-left: 4px solid var(--sl-navy-700);
}

/* ------------------------------------------------------------------ tables (guidelines: navy header, striped rows) */
body.stirlight-corpus .stirlight-table-wrap {
  overflow-x: auto;
  margin: 0 0 var(--sl-space-6);
  border: 1px solid var(--sl-border);
  border-radius: var(--sl-radius-md);
  background: var(--sl-surface);
  -webkit-overflow-scrolling: touch;
}

body.stirlight-corpus .stirlight-article table,
body.stirlight-corpus .entry-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
  font-size: var(--sl-text-small);
  line-height: var(--sl-lh-small);
  color: var(--sl-text-muted);
  font-variant-numeric: tabular-nums;
}

body.stirlight-corpus .stirlight-article caption,
body.stirlight-corpus .entry-content table caption {
  caption-side: top;
  text-align: left;
  font-size: var(--sl-text-caption);
  line-height: var(--sl-lh-caption);
  letter-spacing: 0.01em;
  color: var(--sl-text-subtle);
  padding: var(--sl-space-3) var(--sl-space-4);
  background: var(--sl-surface-alt);
}

body.stirlight-corpus .stirlight-article thead th,
body.stirlight-corpus .entry-content thead th {
  background: var(--sl-navy-700);
  color: var(--sl-white);
  font-family: var(--sl-font-sans);
  font-weight: 600;
  font-size: var(--sl-text-caption);
  letter-spacing: 0.02em;
  text-align: left;
  padding: 10px var(--sl-space-4);
  border: 0;
  white-space: nowrap;
}

body.stirlight-corpus .stirlight-article tbody td,
body.stirlight-corpus .entry-content tbody td,
body.stirlight-corpus .stirlight-article tbody th,
body.stirlight-corpus .entry-content tbody th {
  padding: 10px var(--sl-space-4);
  border-bottom: 1px solid var(--sl-border);
  background: var(--sl-surface);
  vertical-align: top;
}

body.stirlight-corpus .stirlight-article tbody tr:nth-child(even) td,
body.stirlight-corpus .entry-content tbody tr:nth-child(even) td {
  background: var(--sl-stone-100);
}

body.stirlight-corpus .stirlight-article tbody tr:last-child td {
  border-bottom: 0;
}

body.stirlight-corpus .stirlight-article tbody td:first-child {
  color: var(--sl-text);
  font-weight: 600;
}

/* ------------------------------------------------------------------ FAQ */
body.stirlight-corpus .stirlight-faq {
  margin: var(--sl-space-7) 0;
  padding: var(--sl-space-6) 0 0;
  border-top: 1px solid var(--sl-border);
}

body.stirlight-corpus .stirlight-faq > h2 {
  margin-top: 0 !important;
}

body.stirlight-corpus .stirlight-faq > h3 {
  background: var(--sl-surface);
  border: 1px solid var(--sl-border);
  border-bottom: 0;
  border-radius: var(--sl-radius-md) var(--sl-radius-md) 0 0;
  padding: var(--sl-space-4) var(--sl-space-5) var(--sl-space-2);
  margin: var(--sl-space-5) 0 0 !important;
  font-size: var(--sl-text-h4) !important;
  line-height: var(--sl-lh-h4) !important;
}

body.stirlight-corpus .stirlight-faq > h3 + p {
  background: var(--sl-surface);
  border: 1px solid var(--sl-border);
  border-top: 0;
  border-radius: 0 0 var(--sl-radius-md) var(--sl-radius-md);
  padding: 0 var(--sl-space-5) var(--sl-space-5);
  margin: 0 0 var(--sl-space-4);
}

/* ------------------------------------------------------------------ hub / team cards */
body.stirlight-corpus .stirlight-card-list {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--sl-space-6);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sl-space-4);
}

@media (min-width: 720px) {
  body.stirlight-corpus .stirlight-card-list {
    grid-template-columns: 1fr 1fr;
  }
}

body.stirlight-corpus .stirlight-card-list > li {
  margin: 0;
}

body.stirlight-corpus .stirlight-card-list a {
  display: block;
  height: 100%;
  padding: var(--sl-space-5);
  background: var(--sl-surface);
  border: 1px solid var(--sl-border);
  border-radius: var(--sl-radius-md);
  color: var(--sl-text);
  text-decoration: none;
  box-shadow: 0 1px 0 rgba(20, 26, 37, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.stirlight-corpus .stirlight-card-list a:hover {
  border-color: var(--sl-accent);
  color: var(--sl-text);
  box-shadow: 0 8px 24px rgba(20, 26, 37, 0.06);
}

body.stirlight-corpus .stirlight-card-kicker {
  display: block;
  font-size: var(--sl-text-micro);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--sl-accent-text);
  margin-bottom: var(--sl-space-2);
}

body.stirlight-corpus .stirlight-card-title {
  display: block;
  font-family: var(--sl-font-head);
  font-weight: 400;
  font-size: var(--sl-text-h4);
  line-height: var(--sl-lh-h4);
  color: var(--sl-text);
  margin-bottom: var(--sl-space-2);
}

body.stirlight-corpus .stirlight-card-meta {
  display: block;
  font-size: var(--sl-text-small);
  line-height: var(--sl-lh-small);
  color: var(--sl-text-subtle);
}

body.stirlight-corpus .stirlight-profile {
  background: var(--sl-surface);
  border: 1px solid var(--sl-border);
  border-radius: var(--sl-radius-lg);
  padding: var(--sl-space-6);
  margin: 0 0 var(--sl-space-6);
}

body.stirlight-corpus .stirlight-profile h3 {
  margin-top: 0 !important;
}

/* ------------------------------------------------------------------ CTA + related */
body.stirlight-corpus .stirlight-cta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sl-space-3);
  margin: var(--sl-space-7) 0 var(--sl-space-6);
  padding: var(--sl-space-6);
  background: var(--sl-navy-900);
  color: var(--sl-stone-100);
  border-radius: var(--sl-radius-lg);
}

body.stirlight-corpus .stirlight-cta p {
  flex: 1 1 100%;
  margin: 0 0 var(--sl-space-4);
  color: var(--sl-stone-400);
  font-size: var(--sl-text-small);
}

body.stirlight-corpus .stirlight-cta p strong {
  display: block;
  font-family: var(--sl-font-head);
  font-weight: 400;
  font-size: var(--sl-text-h3);
  line-height: var(--sl-lh-h3);
  color: var(--sl-paper);
  margin-bottom: var(--sl-space-2);
}

body.stirlight-corpus .stirlight-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  border-radius: var(--sl-radius-sm);
  font-family: var(--sl-font-sans);
  font-size: var(--sl-text-small);
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  border: 1px solid transparent;
}

body.stirlight-corpus .stirlight-btn--primary {
  background: var(--sl-warm-600);
  color: var(--sl-white) !important;
}

body.stirlight-corpus .stirlight-btn--primary:hover {
  background: var(--sl-warm-700);
  color: var(--sl-white) !important;
}

body.stirlight-corpus .stirlight-btn--secondary {
  background: transparent;
  color: var(--sl-warm-200) !important;
  border-color: var(--sl-navy-500);
}

body.stirlight-corpus .stirlight-btn--secondary:hover {
  border-color: var(--sl-warm-300);
  color: var(--sl-white) !important;
}

body.stirlight-corpus .stirlight-related {
  margin: var(--sl-space-6) 0 0;
  padding: var(--sl-space-5);
  background: var(--sl-surface-warm);
  border-radius: var(--sl-radius-md);
  font-size: var(--sl-text-small);
  color: var(--sl-text-muted);
}

body.stirlight-corpus .stirlight-related p {
  margin: 0;
}

body.stirlight-corpus .stirlight-article hr {
  display: none;
}

/* ------------------------------------------------------------------ editor-only TODO */
body.stirlight-corpus mark.stirlight-todo {
  background: var(--sl-warm-200);
  color: var(--sl-navy-800);
  outline: 2px solid var(--sl-warm-500);
  padding: 0 0.2em;
}

@media (prefers-reduced-motion: reduce) {
  body.stirlight-corpus .stirlight-card-list a {
    transition: none;
  }
}