/* ---- Fonts (self-hosted, OFL) ---- */
@font-face { font-family:"Space Grotesk"; font-style:normal; font-weight:500; font-display:swap;
  src:url("fonts/spacegrotesk-500.woff2") format("woff2"); }
@font-face { font-family:"Space Grotesk"; font-style:normal; font-weight:600; font-display:swap;
  src:url("fonts/spacegrotesk-600.woff2") format("woff2"); }
@font-face { font-family:"IBM Plex Sans"; font-style:normal; font-weight:400; font-display:swap;
  src:url("fonts/plexsans-400.woff2") format("woff2"); }
@font-face { font-family:"IBM Plex Sans"; font-style:normal; font-weight:600; font-display:swap;
  src:url("fonts/plexsans-600.woff2") format("woff2"); }
@font-face { font-family:"IBM Plex Mono"; font-style:normal; font-weight:400; font-display:swap;
  src:url("fonts/plexmono-400.woff2") format("woff2"); }
@font-face { font-family:"IBM Plex Mono"; font-style:normal; font-weight:500; font-display:swap;
  src:url("fonts/plexmono-500.woff2") format("woff2"); }
@font-face { font-family:"IBM Plex Mono"; font-style:normal; font-weight:600; font-display:swap;
  src:url("fonts/plexmono-600.woff2") format("woff2"); }

/* ---- Design tokens ---- */
:root {
  --paper:#FBFAF7; --paper-2:#F3F0E8; --ink:#12141A; --muted:#5B6070; --muted-2:#42474F;
  --oxblood:#8A2E2E; --oxblood-2:#A5382F; --rule:#E7E3D9; --rule-2:#F0ECE2; --field-border:#D9D4C7;
  --rule-strong:#12141A; --index-ghost:#C7BFAE;
  --surface-raised:color-mix(in srgb, var(--ink) 3%, var(--paper));
  --dark:#0E1014; --dark-ink:#F2EFE8; --dark-muted:#A7ABB5; --dark-card:#15181E;
  --dark-border:#26292F; --dark-field-border:#30343B;
  --display:"Space Grotesk", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --sans:"IBM Plex Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --maxw:1200px; --pad:clamp(1.25rem,5vw,3rem);
  color-scheme: light;
}

/* ---- Base ---- */
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans);
  font-size:clamp(1rem,0.35vw+0.95rem,1.075rem); line-height:1.65; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { font-family:var(--display); font-weight:600; letter-spacing:-0.02em; margin:0; }
a { color:var(--oxblood); }
a:hover { color:var(--oxblood-2); }
:focus-visible { outline:2px solid var(--oxblood); outline-offset:3px; }
::selection { background:var(--oxblood); color:var(--paper); }
.tnum { font-variant-numeric:tabular-nums; }
.wrap { max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.section { padding-block:clamp(4rem,9vw,7rem); }
/* .section's top padding is landing-page rhythm — breathing room between stacked
   sections, and above the hero it reads as deliberate. The dossier page opens on a
   breadcrumb directly under the masthead, where the same 7rem reads as the page
   failing to start. Only the top is trimmed; the bottom keeps the shared rhythm. */
.section--dossier { padding-block-start:clamp(1.5rem,3vw,2.5rem); }
.section--alt { background:var(--paper-2); border-block:1px solid var(--rule); }
.section--dark { background:var(--dark); color:var(--dark-ink); position:relative;
  /* Fainter echo of the hero's instrument grid, lit from the top-right corner. */
  --grid-tick:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='200'%20height='200'%3E%3Cpath%20d='M100%2093V107M93%20100H107'%20stroke='rgba(242,239,232,0.16)'%20stroke-width='1'/%3E%3C/svg%3E");
  --grid-line:rgba(242,239,232,.04);
  --grid-mask:radial-gradient(145% 135% at 96% 0%, #000 32%, transparent 82%); }
.section--dark > * { position:relative; z-index:1; }
.eyebrow { font-family:var(--mono); font-size:0.75rem; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--oxblood); }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip { position:absolute; left:-999px; }
.skip:focus { left:1rem; top:1rem; z-index:20; background:var(--ink); color:var(--paper);
  padding:0.6rem 0.9rem; border-radius:6px; text-decoration:none; }

/* ---- Buttons ---- */
.btn { display:inline-flex; align-items:center; justify-content:center; text-decoration:none;
  background:var(--oxblood); color:#fff; border:0; border-radius:8px; padding:0.75rem 1.4rem;
  font:inherit; font-weight:500; cursor:pointer; white-space:nowrap; }
.btn:hover { background:var(--oxblood-2); color:#fff; }
.btn--sm { padding:0.6rem 1.1rem; font-size:0.92rem; border-radius:7px; }
.btn--ghost { background:transparent; color:var(--ink); border:1px solid var(--field-border);
  font-weight:500; font-size:0.95rem; padding:0.7rem 1.2rem; }
.btn--ghost:hover { background:transparent; color:var(--ink); border-color:var(--ink); }
.btn--plain { background:transparent; color:var(--muted); padding:0.7rem 0.4rem; font-size:0.95rem; }
.btn--plain:hover { background:transparent; color:var(--ink); }

/* ---- Nav ---- */
.nav { position:sticky; top:0; z-index:10; background:var(--paper);
  background:rgba(251,250,247,0.82); backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--rule); }
.nav__inner { display:flex; align-items:center; gap:1.5rem; padding-block:0.85rem; }
.wordmark { font-family:var(--mono); font-weight:600; font-size:1.05rem; letter-spacing:0.22em;
  color:var(--ink); text-decoration:none; }
.nav__links { display:flex; flex-wrap:wrap; gap:1.5rem; margin-inline-end:auto; font-family:var(--mono);
  font-size:0.82rem; letter-spacing:0.02em; }
.nav__links a { color:var(--muted); text-decoration:none; position:relative; }
.nav__links a:hover { color:var(--ink); }
.nav__links a::after { content:""; position:absolute; left:0; right:0; bottom:-3px; height:1px;
  background:var(--oxblood); transform:scaleX(0); transform-origin:left; transition:transform .2s ease; }
.nav__links a:hover::after, .nav__links a:focus-visible::after { transform:scaleX(1); }
@media (prefers-reduced-motion: reduce){ .nav__links a::after{ transition:none; } }

/* ---- Dossier masthead ---- */
.masthead { border-bottom:1px solid var(--rule); background:var(--paper); }
.masthead__inner { display:flex; align-items:center; justify-content:space-between; gap:1rem;
  flex-wrap:wrap; padding-block:.55rem; font-family:var(--mono); font-size:.72rem;
  letter-spacing:.06em; color:#8A8E98; }
.masthead__l { color:var(--ink); font-weight:600; text-transform:uppercase; }
.masthead__r { text-transform:uppercase; }
.masthead__r b { color:var(--oxblood); font-weight:500; }
/* ---- Indexed eyebrow ---- */
.eyebrow--idx { margin:0; }
.eyebrow--idx .idx-n { color:var(--index-ghost); }
/* ---- Hero meta-strip (replaces pills) ---- */
.metastrip { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--rule);
  border-radius:10px; overflow:hidden; margin:0 auto; max-width:30rem; flex-basis:100%; width:100%; }
.metastrip__cell { padding:.7rem .9rem; border-right:1px solid var(--rule); }
.metastrip__cell:last-child { border-right:0; }
.metastrip__lab { display:block; font-family:var(--mono); font-size:.6rem; letter-spacing:.08em;
  text-transform:uppercase; color:#9AA0AC; }
.metastrip__val { font-family:var(--display); font-weight:500; font-size:.95rem; }
/* ---- Source-line annotation ---- */
.source-line { font-family:var(--mono); font-size:.68rem; letter-spacing:.04em; color:#8A8E98; margin:0; }
.source-line--exhibit { display:flex; justify-content:space-between; align-items:center;
  text-transform:uppercase; padding-bottom:.55rem; border-bottom:1px solid var(--rule); margin-bottom:.9rem; }
.source-line b { color:var(--oxblood); font-weight:500; }

/* ---- Hero ---- */
.hero { position:relative; }
.hero__inner { display:flex; flex-wrap:wrap; column-gap:clamp(2rem,5vw,4.5rem); row-gap:1.5rem; align-items:start; position:relative; z-index:1; }
.hero__col { flex:1 1 440px; min-width:300px; }
.hero__card-col { flex:1 1 380px; min-width:300px; margin-top:30px; }
.hero h1 { font-size:clamp(2.3rem,5.2vw,4rem); line-height:1.02; letter-spacing:-0.025em; margin:0 0 1.4rem; }
.hero h1 .accent { color:var(--oxblood); }
.lede { font-size:clamp(1.05rem,1.4vw,1.25rem); color:var(--muted-2); max-width:52ch; margin:0 0 1.6rem; }
.hook { display:flex; gap:0.5rem; flex-wrap:wrap; flex-basis:100%; width:100%; }
.hook__field { position:relative; flex:1 1 17rem; display:flex; }
.hook__icon { position:absolute; left:0.9rem; top:50%; transform:translateY(-50%);
  width:1.05rem; height:1.05rem; color:var(--muted); pointer-events:none; }
.hook input { width:100%; padding:0.75rem 1rem 0.75rem 2.6rem; border:1px solid var(--field-border);
  border-radius:8px; background:#fff; color:var(--ink); font:inherit; font-size:0.98rem; }
.hook input::-webkit-search-cancel-button { -webkit-appearance:none; }
/* Instrument grid — a fine plotting surface with crosshair ticks at every major
   (4-cell) node. Used by the dark bands; the surface supplies its own
   --grid-tick / --grid-line / --grid-mask. Self-hosted SVG, no CDN. */
.section--dark::before {
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:var(--grid-tick),
    repeating-linear-gradient(to right,  var(--grid-line) 0 1px, transparent 1px 50px),
    repeating-linear-gradient(to bottom, var(--grid-line) 0 1px, transparent 1px 50px);
  background-size:200px 200px, auto, auto;
  -webkit-mask-image:var(--grid-mask); mask-image:var(--grid-mask); }
/* Perspective "data floor" behind the hero — a receding plane the headline and card
   float above. The grid is wider near the viewer and converges toward a horizon under
   the card, drifting slowly forward. The wrapper's own overflow clips the plane's
   spread to the hero, so it never scrolls the page (and leaves the hero's own overflow
   free for the search dropdown). Reduced-motion-safe, self-hosted (no CDN). */
.hero__floor { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.hero__floor::before { content:""; position:absolute; inset:0;
  background:radial-gradient(130% 82% at 62% 30%, rgba(165,56,47,.055), transparent 60%); }
/* The plane carries the grid AND the data pulses (JS children); its perspective
   transform foreshortens both together, so pulses ride the receding lines for free. */
.hero__floor-plane { position:absolute; left:-55%; right:-55%; top:20%; bottom:-45%;
  background-image:
    repeating-linear-gradient(to right,  rgba(18,20,26,.12) 0 1px, transparent 1px 54px),
    repeating-linear-gradient(to bottom, rgba(18,20,26,.12) 0 1px, transparent 1px 54px);
  transform:perspective(440px) rotateX(61deg); transform-origin:50% 0;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 16%, #000 82%, transparent 100%);
  mask-image:linear-gradient(to bottom, transparent 0, #000 16%, #000 82%, transparent 100%); }
@media (prefers-reduced-motion: no-preference){
  .hero__floor-plane { animation:hero-floor 6s linear infinite; }
}
@keyframes hero-floor { to { background-position:0 54px, 0 54px; } }
/* Data-flow pulses (JS-spawned): oxblood comets that ride the grid lines in any
   direction — up/down the receding lines, left/right along them. Positioned in the
   plane's local space, so the perspective foreshortens them with the plane. The
   gradient points toward the travel direction so the bright head always leads. */
.hero__pulse { position:absolute; top:0; left:0; border-radius:3px; }
.hero__pulse.v { width:3px; }
.hero__pulse.h { height:3px; }
.hero__pulse.up    { background:linear-gradient(to top,    transparent, var(--oxblood)); }
.hero__pulse.down  { background:linear-gradient(to bottom, transparent, var(--oxblood)); }
.hero__pulse.left  { background:linear-gradient(to left,   transparent, var(--oxblood)); }
.hero__pulse.right { background:linear-gradient(to right,  transparent, var(--oxblood)); }

/* ---- Credit-view card ---- */
.credit { margin:0; border:1px solid var(--rule); border-radius:14px; background:#fff;
  box-shadow:0 1px 0 var(--rule), 0 24px 60px -32px rgba(18,20,26,0.35); overflow:hidden; }
.credit__head, .dcard__band { display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:0.85rem 1.1rem; background:var(--ink); }
.credit__label, .dcard__title { font-family:var(--mono); font-size:0.72rem; letter-spacing:0.06em;
  color:#8FA0B8; text-transform:uppercase; }
.credit__state { display:inline-flex; align-items:center; gap:0.4rem; font-family:var(--mono);
  font-size:0.68rem; color:#7EC79B; }
.credit__dot { width:7px; height:7px; border-radius:999px; background:#7EC79B; }
.credit__co { display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  padding:1.1rem 1.25rem 0.9rem; }
.credit__co b { font-family:var(--display); font-weight:600; font-size:1.05rem; }
.credit__yr { font-family:var(--mono); font-size:0.72rem; color:#8A8E98; }
.credit__rows { padding:0 1.25rem 0.6rem; display:grid; gap:0.05rem; }
.credit__row { display:flex; align-items:center; justify-content:space-between; gap:0.75rem;
  padding:0.7rem 0; border-top:1px solid var(--rule-2); }
.credit__k { color:var(--muted-2); font-size:0.92rem; }
.credit__k span { color:#9A9EA8; }
.credit__v { display:inline-flex; align-items:center; gap:0.6rem; }
.credit__v .num { font-family:var(--mono); font-weight:600; font-size:1.05rem; font-variant-numeric:tabular-nums; }
.credit__note { margin:0; padding:0.85rem 1.25rem; border-top:1px solid var(--rule-2); background:var(--paper);
  font-family:var(--mono); font-size:0.7rem; color:#8A8E98; }
.tag { font-family:var(--mono); font-size:0.62rem; letter-spacing:0.02em; border-radius:5px; padding:0.1rem 0.4rem; border:1px solid; }
.tag--structured { color:#2E7D5B; background:#EAF4EE; border-color:#CDE6D8; }
.tag--derived { color:#3A5A8A; background:#EAF0F7; border-color:#CFDCEC; }
.tag--llm { color:var(--oxblood); background:#F9F0EE; border-color:#E0C9C4; }
.tag--output { color:var(--ink); background:var(--paper-2); border-color:var(--rule); }
/* Dual-basis value cell (e.g. company-adj vs rating-agency-adj leverage) */
.credit__v--dual { flex-direction:column; align-items:flex-end; gap:0.12rem; }
.credit__vline { display:inline-flex; align-items:center; gap:0.6rem; }
.credit__alt { font-family:var(--mono); font-size:0.66rem; letter-spacing:0.02em; color:#9A9EA8; }

/* ---- Value band ---- */
.band { max-width:900px; margin-inline:auto; padding-block:clamp(4rem,8vw,6.5rem); text-align:center; }
.band__lead { font-family:var(--display); font-weight:500; font-size:clamp(1.7rem,4vw,2.8rem);
  line-height:1.15; letter-spacing:-0.02em; margin:0 0 1.3rem; }
.band__sub { color:var(--dark-muted); font-size:1.05rem; max-width:60ch; margin-inline:auto; }

/* ---- Problem ---- */
.sec-h { display:grid; grid-template-columns:1fr minmax(160px,220px); gap:clamp(1.5rem,4vw,3rem);
  align-items:end; border-bottom:2px solid var(--rule-strong); padding-bottom:1rem; margin-bottom:1.8rem; }
.sec-h > div:first-child { min-width:0; }
.sec-h h2 { font-size:clamp(1.7rem,3.4vw,2.6rem); line-height:1.08; margin:0; }
.sec-meta { margin:0; display:flex; flex-direction:column; }
.sec-meta__row { display:flex; justify-content:space-between; gap:1rem; padding:.4rem 0;
  border-top:1px solid var(--rule); font-family:var(--mono); font-size:.74rem; }
.sec-meta__row:first-child { border-top:0; }
.sec-meta dt { color:#8A8E98; letter-spacing:.04em; text-transform:uppercase; font-size:.64rem; }
.sec-meta dd { margin:0; color:var(--ink); font-weight:500; text-align:right; }
.sec-meta dd.ox { color:var(--oxblood); }
@media (max-width:900px){ .sec-h{ grid-template-columns:1fr; } }
.sec-h--nometacol { grid-template-columns:1fr; }
.h2-lg { font-size:clamp(1.7rem,3.4vw,2.6rem); line-height:1.08; margin:0.6rem 0 1.4rem; max-width:20ch; }
.problem__body { color:var(--muted-2); max-width:66ch; margin:0 0 1.2rem; }
.problem__claim { font-family:var(--display); font-weight:500; font-size:clamp(1.3rem,2.4vw,1.75rem);
  color:var(--oxblood); letter-spacing:-0.01em; margin:0; max-width:none; }

/* ---- How it works ---- */
.rows { list-style:none; padding:0; margin:0; border-top:1px solid var(--rule); }
.row-item { display:grid; grid-template-columns:auto 1fr auto; gap:1.2rem; align-items:center;
  padding:1.1rem .2rem; border-bottom:1px solid var(--rule); transition:background .15s ease; }
.row-item:hover { background:var(--surface-raised); }
.row-item__ix { font-family:var(--mono); font-weight:600; font-size:1.1rem; color:var(--index-ghost);
  font-variant-numeric:tabular-nums; }
.row-item__txt { margin:0; color:var(--muted-2); max-width:64ch; }
.row-item__txt b { font-family:var(--display); font-weight:600; color:var(--ink); }
@media (max-width:640px){ .row-item{ grid-template-columns:auto 1fr; }
  .row-item .tag{ grid-column:2; justify-self:start; } }

/* ---- Pricing ---- */
.price__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; align-items:stretch; }
@media (max-width:1000px){ .price__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .price__grid{ grid-template-columns:1fr; } }
.price__card { position:relative; display:flex; flex-direction:column; border:1px solid var(--rule);
  border-radius:14px; padding:1.5rem 1.35rem; background:#fff;
  transition:transform .15s ease, box-shadow .15s ease; }
.price__card:hover { transform:translateY(-3px); box-shadow:0 16px 40px -28px rgba(18,20,26,.5); }
.price__ix { font-family:var(--mono); font-size:.7rem; color:var(--index-ghost); letter-spacing:.06em; }
.price__name { font-family:var(--display); font-weight:600; font-size:1.25rem; margin:.35rem 0 .3rem; }
.price__for { color:var(--muted); font-size:.9rem; margin:0 0 1rem; min-height:2.7em; }
.price__amount { display:flex; align-items:baseline; gap:.35rem; margin:0; min-height:2.4rem; }
.price__val { font-family:var(--display); font-weight:600; font-size:2.1rem; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums; }
.price__per { font-family:var(--mono); font-size:.72rem; color:var(--muted); }
.price__annual { font-family:var(--mono); font-size:.68rem; color:#8A8E98; margin:.35rem 0 1rem; min-height:1.1em; }
.price__credits { display:flex; flex-direction:column; gap:.15rem; border:1px solid var(--rule);
  border-radius:8px; padding:.6rem .75rem; background:var(--surface-raised); }
.price__cred-k { font-family:var(--display); font-weight:500; font-size:.9rem; }
.price__glyph { color:var(--oxblood); }
.price__cred-sub { font-family:var(--mono); font-size:.66rem; color:#8A8E98; }
.price__rule { border:0; border-top:1px solid var(--rule); margin:1.1rem 0 .9rem; }
.price__inc { font-family:var(--mono); font-size:.7rem; letter-spacing:.02em; color:var(--muted); margin:0 0 .7rem; }
.price__list { list-style:none; padding:0; margin:0 0 1.2rem; display:grid; gap:.55rem; }
.price__list li { position:relative; padding-left:1.4rem; color:var(--muted-2); font-size:.92rem; }
.price__list li::before { content:"\2713"; position:absolute; left:0; top:0; color:var(--oxblood);
  font-family:var(--mono); font-weight:600; }
.price__cta { margin-top:auto; display:grid; gap:.6rem; }
.price__cta .btn { width:100%; }
.price__trial { text-align:center; font-family:var(--mono); font-size:.78rem; color:var(--muted); text-decoration:none; }
.price__trial:hover { color:var(--oxblood); }
/* Inverted button — white on the dark feature card (mirrors the reference's light CTA) */
.btn--invert { background:#fff; color:var(--ink); }
.btn--invert:hover { background:var(--paper-2); color:var(--ink); }
/* Highlighted "most chosen" tier — reuses the site's dark treatment, not a coloured pill */
.price__card--feature { background:var(--dark); color:var(--dark-ink); border-color:var(--dark-border); }
.price__card--feature .price__ix { color:#6C7079; }
.price__card--feature .price__for,
.price__card--feature .price__per { color:var(--dark-muted); }
.price__card--feature .price__annual,
.price__card--feature .price__cred-sub { color:#8B8F99; }
.price__card--feature .price__credits { background:var(--dark-card); border-color:var(--dark-border); }
.price__card--feature .price__rule { border-top-color:var(--dark-border); }
.price__card--feature .price__inc { color:#9AA0AC; }
.price__card--feature .price__list li { color:var(--dark-ink); }
.price__card--feature .price__list li::before,
.price__card--feature .price__glyph { color:#C98A84; }
.price__card--feature .price__trial { color:#9AA0AC; }
.price__card--feature .price__trial:hover { color:#E8B4AE; }
.price__badge { position:absolute; top:1rem; right:1rem; font-family:var(--mono); font-size:.6rem;
  letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--oxblood);
  padding:.25rem .5rem; border-radius:999px; }

/* ---- Who ---- */
.who__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1.25rem; }
.who__card { border:1px solid var(--rule); border-radius:12px; padding:1.6rem 1.5rem 1.5rem;
  background:#fff; position:relative; overflow:hidden;
  transition:transform .15s ease, box-shadow .15s ease; }
.who__card:hover { transform:translateY(-3px); box-shadow:0 16px 40px -28px rgba(18,20,26,.5); }
.who__card::after { content:""; position:absolute; top:0; right:0;
  border-top:26px solid var(--oxblood); border-left:26px solid transparent; opacity:.85; }
.who__ix { font-family:var(--mono); font-size:.7rem; color:var(--index-ghost); letter-spacing:.06em; }
.who__card h3 { font-size:1.15rem; margin:.5rem 0 .55rem; padding-top:.6rem; border-top:1px solid var(--rule); }
.who__card p { margin:0; color:var(--muted); }

/* ---- Design partner ---- */
.dp__inner { display:flex; flex-wrap:wrap; gap:clamp(2rem,5vw,4rem); align-items:start; }
.dp__copy { flex:1 1 360px; min-width:290px; }
.eyebrow--on-dark .idx-n { color:#6C7079; }
.source-line--on-dark { color:#8B8F99; margin:.2rem 0 1rem; }
.dp__copy .eyebrow { color:#C98A84; }
.dp__copy h2 { font-size:clamp(1.7rem,3.4vw,2.5rem); line-height:1.1; margin:0.7rem 0 1.2rem; }
.dp__lede { color:var(--dark-muted); max-width:48ch; margin:0 0 1.2rem; }
.dp__mail { color:#8B8F99; font-size:0.95rem; margin:0; }
.dp__mail a { color:#E8B4AE; }
.dp__form { flex:1 1 360px; min-width:290px; display:grid; gap:0.35rem; border:1px solid var(--dark-border);
  border-radius:14px; padding:1.7rem; background:var(--dark-card); }
.dp__form label { font-family:var(--mono); font-size:0.72rem; letter-spacing:0.04em; color:#9AA0AC; margin-top:0.6rem; }
.dp__form label:first-of-type { margin-top:0.4rem; }
.dp__form input[type=text], .dp__form input[type=email] { padding:0.65rem 0.85rem; border:1px solid var(--dark-field-border);
  border-radius:7px; background:var(--dark); color:var(--dark-ink); font:inherit; font-size:0.95rem; }
.dp__consent { display:flex; gap:0.55rem; align-items:flex-start; font-size:0.8rem; color:#8B8F99;
  margin-top:0.9rem; font-weight:400; font-family:var(--sans); letter-spacing:0; }
.dp__consent input { margin-top:0.2rem; accent-color:var(--oxblood); }
.dp__consent a { color:#E8B4AE; }
.dp__form button { margin-top:1.1rem; font-weight:600; }
.dp__hp { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.dp__msg { font-family:var(--mono); font-size:0.75rem; margin-top:0.7rem; min-height:1em; color:#E8B4AE; }
.dp__msg--ok { color:#8FBF9F; }

/* ---- FAQ ---- */
.faq__wrap { max-width:820px; }
.faq__title { font-size:clamp(1.7rem,3.4vw,2.6rem); line-height:1.08; margin:0 0 clamp(1.5rem,3vw,2.2rem); }
.faq__item { border-top:1px solid var(--rule); }
.faq__item:last-child { border-bottom:1px solid var(--rule); }
.faq__item details { padding:1.05rem 0; }
.faq__item summary { font-family:var(--display); font-weight:500; font-size:1.1rem; cursor:pointer;
  list-style:none; display:flex; justify-content:flex-start; align-items:center; gap:.9rem; }
.faq__item summary::-webkit-details-marker { display:none; }
.faq__item summary::after { content:"+"; color:var(--oxblood); font-family:var(--mono); font-weight:400; margin-left:auto; }
.faq__item details[open] summary::after { content:"\2212"; }
.faq__item details p { color:var(--muted); max-width:70ch; margin:0.8rem 0 0; }
.faq__q { font-family:var(--mono); font-size:.7rem; color:var(--index-ghost); letter-spacing:.06em; }

/* ---- Footer ---- */
.foot { border-top:1px solid var(--rule); padding:clamp(2.5rem,5vw,3.5rem) 0 2rem; }
.foot__inner { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:clamp(1.5rem,4vw,3rem); }
.foot__brand { grid-column:span 2; min-width:240px; }
.foot__brand .wordmark { font-size:1rem; }
.foot__brand p { color:var(--muted); max-width:32ch; margin:0.8rem 0 0.6rem; }
.foot__etym { font-size:0.85rem; color:#7A7F89; margin:0 !important; }
.foot__col { display:grid; gap:0.5rem; align-content:start; }
.foot__col h4 { margin:0 0 0.3rem; font-family:var(--mono); font-weight:600; font-size:0.72rem;
  letter-spacing:0.1em; text-transform:uppercase; color:#8A8E98; }
.foot__col a { color:var(--ink); text-decoration:none; font-size:0.95rem; }
.foot__col a:hover { color:var(--oxblood); }
.foot__legal { max-width:var(--maxw); margin:2rem auto 0; padding-inline:var(--pad); color:#8A8E98; font-size:0.85rem; }
.foot__colophon { color:#8A8E98; padding-block:0 1.4rem; margin:0 auto; }

/* ---- Reveal-on-scroll (progressive enhancement; content is visible without JS) ---- */
.reveal { opacity:0; transform:translateY(10px);
  transition:opacity .5s ease, transform .5s ease; transition-delay:calc(var(--i,0) * 60ms); }
.reveal.is-visible { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* Hero typeahead results — progressive-enhancement popup over .hook */
.hook { position: relative; }
.hook__results {
  list-style: none; margin: 0.4rem 0 0; padding: 0.35rem;
  position: absolute; top: 100%; left: 0; right: 0; z-index: 20;
  background: #fff; border: 1px solid var(--field-border); border-radius: 12px;
  box-shadow: 0 12px 32px rgba(18, 20, 26, 0.10);
  max-height: 22rem; overflow-y: auto;
}
.hook__results[hidden] { display: none; }
.hook__opt {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.55rem 0.6rem; border-radius: 8px; cursor: pointer;
}
.hook__opt[aria-selected="true"] { background: var(--paper-2); }
.hook__opticon {
  width: 34px; height: 34px; flex: none; padding: 6px;
  color: var(--muted); background: var(--surface-raised);
  border: 1px solid var(--rule); border-radius: 8px;
}
.hook__opticon path {
  fill: none; stroke: currentColor; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
.hook__optbody { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.hook__optname {
  font-family: var(--display); font-weight: 500; color: var(--ink); font-size: 0.95rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hook__optname mark { background: none; color: var(--oxblood); font-weight: 700; }
.hook__optloc {
  font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.04em; color: var(--muted);
}

/* Company profile page */
.crumb {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem;
  font-family: var(--mono); font-size: 0.72rem; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--muted); margin: 0 0 1.5rem;
}
.crumb__a { color: var(--muted); text-decoration: none; }
a.crumb__a:hover { color: var(--ink); }
.crumb__sep { color: var(--index-ghost); }

.co-head {
  display: flex; gap: 1.25rem; align-items: flex-start;
  padding-bottom: 1.5rem; border-bottom: 1px solid var(--rule); margin-bottom: 1.75rem;
}
.co-head > svg {
  width: 84px; height: 84px; flex: none; padding: 16px;
  color: var(--muted); background: var(--surface-raised);
  border: 1px solid var(--rule); border-radius: 12px;
}
.co-head > svg path {
  fill: none; stroke: currentColor; stroke-width: 1.4;
  stroke-linecap: round; stroke-linejoin: round;
}
.co-name {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(1.5rem, 4vw, 2.2rem); margin: 0 0 0.35rem; color: var(--ink);
}
.co-addr { color: var(--muted-2); margin: 0 0 0.75rem; }
.co-id__meta { display: flex; flex-wrap: wrap; gap: 0.4rem 1.25rem; }
.co-id__row { display: inline-flex; align-items: center; gap: 0.45rem; }
.co-id__k {
  font-family: var(--mono); font-size: 0.68rem; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--muted);
}
.co-id__v { font-family: var(--mono); font-size: 0.82rem; color: var(--ink); }

.co-credit { max-width: 34rem; }
.co-actions { display:flex; flex-wrap:wrap; gap:0.75rem; margin-top:1.75rem; }

.tag--absent { color: var(--muted); background: var(--paper-2); border-color: var(--rule); }

.co-missing { padding: 3rem 0; }
.co-missing__k {
  font-family: var(--display); font-weight: 600; font-size: 1.4rem; margin: 0 0 0.4rem;
}
.co-missing__d { color: var(--muted-2); margin: 0 0 1.25rem; }
.co-noscript { color: var(--muted-2); }

/* ============ Company credit dossier (worked example) ============ */
.tag--adjusted { color:#8A6D2E; background:#F7F1E6; border-color:#E6D8BC; }
.tag--default { color:#4A5568; background:#EEF1F4; border-color:#D6DBE1; }
.dtable__breach { color:var(--oxblood); font-weight:600; }

.dossier { display:flex; flex-direction:column; gap:2.75rem; margin-top:2rem; }
.co-summary { display:flex; flex-direction:column; gap:0.75rem; }
/* Summary card + covenant companion side by side; stacks on narrow screens.
   Flex is the fallback (and the stacked layout): it wraps on its own once the two
   basis widths stop fitting. Where subgrid is supported and the columns already fit
   unwrapped, .co-top below is promoted to a shared 3-row grid so the covenant card
   matches the *credit card's* height — see the @supports block. */
.co-top { display:flex; flex-wrap:wrap; gap:1.75rem 2.5rem; align-items:stretch; }
.co-top > .co-summary { flex:0 1 34rem; }
.co-cov { flex:1 1 24rem; min-width:0; display:flex; flex-direction:column; gap:0.65rem; }
.co-cov > .cov { flex:1 1 auto; display:flex; flex-direction:column; justify-content:center; }

/* Equal-height cards: both columns opt into one 3-row grid (eyebrow / card / sources)
   via subgrid, so the covenant card sizes to the credit card's height instead of the
   whole left column. The left card's sources hang in row 3; the covenant column's row 3
   stays empty. gap:normal makes each subgrid inherit the parent row-gap so the card row
   starts at the same y in both columns.

   1080px is derived, not chosen: grid never wraps, so it must only take over once the
   flex fallback has already stopped wrapping — engaging earlier squeezes the covenant
   column over a band where flex correctly stacked it full-width instead.
   .co-summary basis 34rem + column-gap 2.5rem + .co-cov basis 24rem = 60.5rem (968px)
   of content, plus .wrap's 2×3rem padding = 1064px. Media queries measure the viewport
   *including* the scrollbar while the container excludes it, so round up past a ~15px
   classic scrollbar → 1080px. Erring high is deliberate: too high only costs the
   equal-height polish for ~1rem of width, too low cramps the chart. */
@supports (grid-template-rows: subgrid) {
  @media (min-width:1080px) {
    .co-top { display:grid; grid-template-columns:minmax(0,34rem) minmax(0,1fr);
      grid-template-rows:auto auto auto; column-gap:2.5rem; row-gap:0.75rem; }
    .co-summary, .co-cov { display:grid; grid-row:1 / span 3;
      grid-template-rows:subgrid; gap:normal; }
  }
}
.dsec > .eyebrow--idx { margin-bottom:0.9rem; }

/* worked-example framing */
.frame__label { font-family:var(--mono); font-size:0.7rem; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--muted); }
.frame__src { font-family:var(--mono); font-size:0.72rem; color:var(--muted);
  display:flex; flex-wrap:wrap; gap:0.35rem 1rem; }

/* covenant bars */
.cov { border:1px solid var(--rule); border-radius:10px; padding:1.1rem 1.2rem; background:var(--paper-2); }
.cov__title { font-family:var(--mono); font-size:0.7rem; letter-spacing:0.05em;
  text-transform:uppercase; color:var(--muted); margin-bottom:0.9rem; }
.cov__row { display:flex; align-items:center; gap:0.6rem; margin-bottom:0.7rem; }
.cov__label { width:12rem; font-family:var(--mono); font-size:0.74rem; color:var(--muted-2);
  display:flex; align-items:center; gap:0.4rem; }
.cov__track { position:relative; flex:1; height:1.15rem; background:var(--paper);
  border:1px solid var(--rule); border-radius:4px; }
.cov__fill { position:absolute; top:0; bottom:0; left:0; background:#B7AE9D; border-radius:4px; }
.cov__limit { position:absolute; top:-3px; bottom:-3px; border-left:1.5px dashed var(--oxblood); }
.cov__val { width:3.2rem; text-align:right; font-family:var(--display); font-weight:600; }


/* data tables (financials + derived metrics), each wrapped in a header-band .dcard */
.dcard { border:1px solid var(--rule); border-radius:14px; background:#fff; overflow:hidden;
  box-shadow:0 1px 0 var(--rule), 0 24px 60px -32px rgba(18,20,26,0.35); }
.dcard + .dcard { margin-top:1rem; }
.dcard__meta { font-family:var(--mono); font-size:0.72rem; letter-spacing:0.04em; color:#8A8E98; }
.dcard__live { margin-left:0.6rem; color:var(--oxblood); font-family:var(--mono); font-size:0.62rem; letter-spacing:0.04em; white-space:nowrap; }
.dcard .dtable__scroll { padding:0.3rem 0.5rem 0.55rem; }
.dtable__scroll { overflow-x:auto; }
.dtable { width:100%; border-collapse:collapse; font-size:0.85rem; }
.dtable th, .dtable td { padding:0.4rem 0.7rem; border-bottom:1px solid var(--rule-2); white-space:nowrap; }
.dtable td:last-child { white-space:normal; }
.dtable th { font-family:var(--mono); font-size:0.68rem; text-transform:uppercase; color:var(--muted);
  text-align:right; font-weight:500; }
.dtable th:first-child, .dtable td:first-child { text-align:left; }
.dtable td:not(:first-child) { text-align:right; font-variant-numeric:tabular-nums; }
.dtable__note { font-size:0.8rem; color:var(--muted); margin-bottom:0.7rem; }

/* provenance legend */
.legend { display:flex; flex-direction:column; gap:0.8rem; }
.legend__item { display:grid; grid-template-columns:auto 1fr; gap:0.7rem; align-items:start; }
.legend__head { font-family:var(--mono); font-size:0.72rem; color:var(--muted); white-space:nowrap; }
.legend__body { font-size:0.85rem; color:var(--muted-2); line-height:1.55; }