/* AI Indexes brand layer (Design handoff, 2026-09-27). Loaded after modernist.css, the index's tokens.css and site.css
   on every index site, so it wins on equal specificity. It changes type, the mark, the shared chrome (family stripe,
   nav, footer) and two heroes; everything below the hero keeps site.css, except that numbers set in the mono face.
   --font-heading stays Archivo because site.css uses it at 800 for kickers, nav and labels; the condensed display face
   is its own variable and reaches only the headings and the wordmark. */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Narrow:wght@700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  --font-display: "Archivo Narrow", "Archivo", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --index-gtm: #ec3013;
  --index-hr: #8d2a5e;
  --index-it: #1f5fa8;
  --index-finance: #1e7a4c;
  --index-hub: #201e1d;
  --gutter: 32px;
  --pad: 24px;   /* the shell's own side padding, which full-bleed bands pull back */
}
@media (max-width: 640px) { :root { --pad: 16px; --gutter: 16px; } }

/* ---------------------------------------------------------------- type */
h1, h2, h3, .hero h1, .cat-hero h1 { font-family: var(--font-display); font-weight: 700; }
.hero h1 { font-size: clamp(44px, 6.5vw, 88px); line-height: 0.92; letter-spacing: -0.02em; }
.cat-hero h1 { font-size: clamp(36px, 5vw, 64px); line-height: 0.94; letter-spacing: -0.015em; }
h2 { letter-spacing: -0.01em; }
.sec-head h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1; }
.btn { font-family: "Archivo", system-ui, sans-serif; font-weight: 800; white-space: nowrap; }

/* Numbers: every share, count, rank and date in the mono face, tabular. */
.num, .idx, .stat-n, .lb-num, .bar-val, .anti-pct, .share-pct, .warn-pct, .rs-n, .st-rs, .st-share, .vr-share, .vr-n.num,
.step-n, .qmenu.defs .qm-n, .ladder .v, .premise-stat .big, .cmp-stats .sv, .stand-rank, .stand-share, .q-rank, .q-key-row .num,
.vstat-n, .vseg-share .num, .fr-n, .al-same .num, .al-took .num, .ci-row .num, .ci-page .num, .rm-n, .cmp-val, .fw-n, .cs-share,
.pack-rep-n, .rstat-n, .mv-count b, .mv-value b, .mv-chg, .mv-reading, .mv-share, .cov-count, .delta {
  font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-weight: 500; letter-spacing: -0.01em;
}
.stat-n, .premise-stat .big, .rm-n, .rstat-n, .mv-reading, .vstat-n, .mv-count b, .vseg-share .num, .cov-count { letter-spacing: -0.03em; }
.num-xl, .num-lg, .num-md { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-weight: 500; line-height: 0.9; }
.num-xl { font-size: clamp(96px, 11vw, 136px); letter-spacing: -0.05em; }
.num-lg { font-size: 56px; line-height: 1; letter-spacing: -0.03em; }
.num-md { font-size: 30px; line-height: 1; letter-spacing: -0.03em; }
.mono-kicker { font-family: var(--font-mono); font-size: 12px; color: var(--color-accent-700); text-transform: uppercase; letter-spacing: 0.02em; }
.ed-badge { font-family: var(--font-mono); font-weight: 500; letter-spacing: 0; text-transform: none; }

/* ---------------------------------------------------------------- mark */
.mark { display: block; flex: none; }

/* ---------------------------------------------------------------- family stripe */
.fam-stripe { display: flex; align-items: stretch; justify-content: space-between; height: 30px; margin: 0 calc(-1 * var(--pad)); padding: 0 var(--pad);
  background: var(--index-hub); color: #f3f2f2; font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; line-height: 1; }
.fam-tabs { display: flex; align-items: stretch; }
.fam-stripe a { display: flex; align-items: center; gap: 7px; padding: 0 14px; color: #d7d3d3; text-decoration: none; border-bottom: 3px solid transparent; border-top: 3px solid transparent; }
.fam-stripe a:hover { color: #f3f2f2; }
.fam-stripe a.fam-home { color: #bab6b6; padding-right: 0; }
.fam-tabs a:first-child { padding-left: 0; }
.fam-stripe a[aria-current] { color: #fff; font-weight: 600; border-bottom-color: var(--fam); }
.fam-stripe a.fam-home[aria-current] { --fam: #f3f2f2; }
.fam-sq { width: 8px; height: 8px; background: var(--fam); flex: none; }
.fam-ed { display: flex; align-items: center; font-family: var(--font-mono); color: #d7d3d3; letter-spacing: 0; text-transform: none; font-size: 11.5px; }


/* ---------------------------------------------------------------- nav */
.site-head { align-items: center; min-height: 60px; padding: 0; border-bottom: 2px solid var(--color-divider); gap: 20px 28px; }
.site-head .brand { gap: 10px; }
.site-head .brand .mark { width: 22px; height: 22px; }
.wordmark { font-family: var(--font-display); font-weight: 700; font-size: 19px; letter-spacing: 0.02em; text-transform: uppercase; line-height: 1; }
.site-nav { gap: 28px; }
.site-nav a { font-family: "Archivo", system-ui, sans-serif; font-weight: 600; font-size: 13px; letter-spacing: 0.04em; color: var(--color-text); padding: 4px 0 2px; border-bottom: 2px solid transparent; }
.site-nav a:hover { color: var(--color-text); border-bottom-color: var(--color-neutral-400); }
.site-nav a[aria-current="page"] { border-bottom-color: var(--color-accent); }
.site-nav a.navfund, .site-nav a.navfund[aria-current="page"] { font-weight: 800; padding: 8px 12px; margin-left: 0; border-bottom: 0; background: var(--color-accent); color: var(--color-bg); }
.site-nav a.navfund:hover { background: var(--color-accent-700); color: var(--color-bg); }

/* ---------------------------------------------------------------- home hero: the quadrant */
.hq { margin: 0; border-bottom: 2px solid var(--color-divider); }
.hq-top { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 32px; align-items: end; padding: 40px 0 32px; border-bottom: 2px solid var(--color-divider); }
.hq-top h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(48px, 7.5vw, 96px); line-height: 0.9; letter-spacing: -0.02em; margin-top: 18px; text-wrap: balance; }
.hq-right p { font-size: 15px; line-height: 1.55; color: var(--color-neutral-800); margin: 0 0 18px; max-width: none; }
.hq-right p strong { font-weight: 600; color: var(--color-text); }
.hq-right .btns { display: flex; flex-wrap: wrap; gap: 10px; }
.hq-right .search.home { margin-top: 18px; }
.hq-right .hero-stats { margin-top: 10px; }
.hq-cells { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hq-cell { padding: 22px 24px 24px; border-left: 1px solid var(--color-divider); color: var(--color-text); text-decoration: none; display: flex; flex-direction: column; gap: 10px; }
.hq-cell:first-child { border-left: 0; background: var(--color-accent); color: var(--color-bg); }
.hq-cell:hover .hq-label { text-decoration: underline; text-underline-offset: 3px; }
.hq-label { font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.hq-cell p { font-size: 13px; line-height: 1.5; margin: 0; max-width: none; color: inherit; }
.hq-cell:not(:first-child) p { color: var(--color-neutral-800); }
@media (max-width: 900px) { .hq-top { grid-template-columns: minmax(0, 1fr); align-items: start; } .hq-cells { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hq-cell:nth-child(3) { border-left: 0; } .hq-cell:nth-child(n+3) { border-top: 1px solid var(--color-divider); } }
@media (max-width: 560px) { .hq-cells { grid-template-columns: minmax(0, 1fr); } .hq-cell { border-left: 0; } .hq-cell + .hq-cell { border-top: 1px solid var(--color-divider); } }

/* ---------------------------------------------------------------- category hero */
.crumbs.ch-crumbs { margin: 0; padding: 14px 0; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.02em; color: var(--color-accent-700); border-bottom: 1px solid var(--color-divider); }
.crumbs.ch-crumbs a { color: var(--color-accent-700); text-decoration: none; }
.crumbs.ch-crumbs a:hover { text-decoration: underline; }
.crumbs.ch-crumbs .muted { color: var(--color-neutral-500); }
.ch { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); margin: 0; border-bottom: 2px solid var(--color-divider); }
.ch > div { padding: 36px var(--gutter); }
.ch > .ch-l { padding-left: 0; }
.ch > .ch-r { padding-right: 0; }
.ch-l h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(36px, 5vw, 64px); line-height: 0.94; letter-spacing: -0.015em; text-wrap: balance; }
.ch-l h1 .h1-seg { color: var(--color-neutral-600); }
.ch-l .asked { font-size: 14px; line-height: 1.55; margin-top: 18px; color: var(--color-neutral-800); }
.ch-r { border-left: 2px solid var(--color-divider); display: flex; flex-direction: column; justify-content: space-between; gap: 22px; }
.ch-label { font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-neutral-700); }
.ch-lead { display: flex; align-items: flex-end; gap: 22px; flex-wrap: wrap; }
.ch-lead .num-xl { color: var(--color-text); }
.ch.consensus .ch-lead .num-xl { color: var(--color-accent); }
.ch-who { display: flex; flex-direction: column; gap: 10px; padding-bottom: 8px; min-width: 0; }
.ch-name { font-family: var(--font-display); font-weight: 700; font-size: 40px; line-height: 0.95; letter-spacing: -0.01em; }
.ch-name a { color: var(--color-text); text-decoration: none; }
.ch-name a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.ch-name .tied { display: block; font-size: 22px; color: var(--color-neutral-700); margin-top: 4px; }
.ch-tag { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-neutral-700); }
.ch-tag .sq { width: 8px; height: 8px; box-sizing: border-box; border: 2px solid var(--color-neutral-700); }
.ch.consensus .ch-tag { color: var(--color-accent-700); }
.ch.consensus .ch-tag .sq { background: var(--color-accent); border: 0; }
.ch-bar { display: flex; gap: 2px; height: 12px; background: var(--color-neutral-200); }
.ch-bar span { display: block; height: 100%; background: var(--color-neutral-600); }
.ch-bar span:nth-child(1) { background: var(--color-text); }
.ch-bar span:nth-child(2) { background: var(--color-neutral-800); }
.ch.consensus .ch-bar span:nth-child(1) { background: var(--color-accent); }
.ch-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-700); margin-top: 10px; }
.ch-legend b { font-weight: 600; color: var(--color-text); margin-right: 6px; }
.ch-verdict { font-size: 13px; line-height: 1.5; color: var(--color-neutral-800); margin: 0; max-width: none; }
.ch-r .mv-wrap { margin-top: 4px; }
@media (max-width: 900px) { .ch { grid-template-columns: minmax(0, 1fr); } .ch-r { border-left: 0; border-top: 1px solid var(--color-divider); } }
@media (max-width: 560px) { .ch-name { font-size: 32px; } }

/* ---------------------------------------------------------------- footer */
.site-foot { border-top: 2px solid var(--color-divider); padding-top: 0; }
.fsub { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 32px; padding: 26px 0; border-bottom: 1px solid var(--color-divider); }
.fsub .notify.compact { flex: 1 1 360px; max-width: 560px; margin: 0; }
.fsub .notify button, .fsub .notify .btn { background: var(--color-accent); color: var(--color-bg); border-color: var(--color-accent); font-weight: 800; }
.fcols { display: grid; grid-template-columns: 4fr 3fr 3fr 3fr; }
.fcols h6.fgap { margin-top: 18px; }
.fcols > div { padding: 28px var(--gutter); border-left: 1px solid var(--color-divider); display: flex; flex-direction: column; gap: 6px; font-size: 13px; line-height: 1.45; }
.fcols > div:last-child { padding-right: 0; }
.fcols > div:first-child { padding-left: 0; border-left: 0; gap: 14px; }
.fcols h6 { margin: 0 0 6px; font-family: "Archivo", system-ui, sans-serif; font-weight: 600; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-neutral-700); }
.fcols a { color: var(--color-text); text-decoration: none; }
.fcols a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fcols .wordmark { display: flex; align-items: center; gap: 10px; }
.fcols .wordmark .mark { width: 22px; height: 22px; }
.fcols .fnote { color: var(--color-neutral-700); line-height: 1.5; margin: 0; }
.fcols .fed { font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-700); }
.fam-row { display: flex; align-items: center; gap: 9px; }
.fam-row .fam-sq { width: 8px; height: 8px; }
.fam-row.here { font-weight: 600; }
@media (max-width: 900px) { .fcols { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fcols > div { border-top: 1px solid var(--color-divider); } .fcols > div:first-child { grid-column: 1 / -1; border-top: 0; } .fcols > div:nth-child(2n) { border-left: 0; } }
@media (max-width: 560px) { .fcols { grid-template-columns: 1fr; } .fcols > div { border-left: 0; } }
.hero.hq { padding: 0; gap: 0; display: block; }
.hq-top a.mono-kicker { text-decoration: none; border: 0; }
.hq-top a.mono-kicker:hover { text-decoration: underline; }
.hq + .standing, .hero.hq + .standing { margin-top: 0; padding-top: 32px; }
.sec-head h2, .two-col h2, .block h2, .standing .st-title { font-family: var(--font-display); font-weight: 700; }
.ch-name a, .crumbs.ch-crumbs a, .fcols a, .hq-cell, .fam-stripe a { border-bottom-width: 0; text-decoration: none; }
.fam-stripe a[aria-current] { border-bottom-width: 3px; }

@media (max-width: 900px) { .ch > .ch-r { padding-left: 0; } .fcols > div:nth-child(2n) { padding-left: 0; } .fcols > div:nth-child(2n+1):not(:first-child) { padding-right: 0; } }
@media (max-width: 560px) { .fcols > div { padding-left: 0; padding-right: 0; } }
.ch-name > a { display: inline-flex; align-items: center; gap: 14px; }
.ch-name .pmark { flex: none; width: 36px; height: 36px; }
.st-cmd.st-nav { position: sticky; z-index: 19; }

/* Headings site.css sets by class (specificity beats the plain h1/h2/h3 rule above): every one on the display face. */
.findings h3, .msec h2, .msec h3, .cc h3, .claim h2, .step h3, .quad-block h3, .block h3, .ci-cols h3, .vhero h1, .cmp-hero h1,
.su-band h1, .su-sec h2, .su-card h3, .poster .statement, .offer-h .t, .two-col h2 { font-family: var(--font-display); font-weight: 700; }
