/* Fonts are split by script; a browser downloads a file only when the page uses a character in its range.
   latin = Western European; latin-ext = Central/Eastern European, Turkish, Baltic, Vietnamese (ń ł ő ş ț ā).
   geist-cyrillic is ready for a later Cyrillic locale; Archivo has no Cyrillic. Kalam is English hero decoration only.
   Rebuild from upstream with pyftsubset (see strategy.md §15). */
@font-face { font-family: "Archivo"; src: url("fonts/archivo-latin.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Archivo"; src: url("fonts/archivo-latin-ext.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist"; src: url("fonts/geist-latin.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist"; src: url("fonts/geist-latin-ext.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist"; src: url("fonts/geist-cyrillic.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Geist Mono"; src: url("fonts/geistmono-latin.woff2") format("woff2"); font-weight: 400 600; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist Mono"; src: url("fonts/geistmono-latin-ext.woff2") format("woff2"); font-weight: 400 600; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Kalam"; src: url("fonts/kalam-latin.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+2000-206F, U+20AC; }
@font-face { font-family: "Kalam"; src: url("fonts/kalam-latin-ext.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0100-02BA, U+1E00-1E9F, U+1EF2-1EFF; }
/* Arial tuned to each web font's width and line metrics, so text does not shift when the font arrives. */
@font-face { font-family: "Archivo Fallback"; src: local("Arial"); size-adjust: 101.7%; ascent-override: 86.4%; descent-override: 20.7%; line-gap-override: 0%; }
@font-face { font-family: "Geist Fallback"; src: local("Arial"); size-adjust: 103.9%; ascent-override: 96.7%; descent-override: 28.4%; line-gap-override: 0%; }

:root {
  --canvas: #ffffff;
  --mist: #f4f5f8;
  --mist-2: #eaecf2;
  --ink: #0f1220;
  --ink-2: #363b4e;
  --muted: #5c6275;
  --hairline: #e1e4ec;
  --hairline-strong: #c8cdda;
  --accent: #2337ff;
  --accent-hover: #1427e0;
  --accent-ink: #ffffff;
  --accent-soft: #eceeff;
  --accent-text: #2337ff;
  --band: #0f1220;
  --band-ink: #ffffff;
  --band-muted: #b5bbcb;
  --shadow: 0 0 0 1px rgba(15, 18, 32, .04), 0 2px 6px rgba(15, 18, 32, .05), 0 10px 28px rgba(15, 18, 32, .08);
  --radius-panel: 16px;
  --radius-pill: 999px;
  --display: "Archivo", "Archivo Fallback", "Helvetica Neue", Arial, sans-serif;
  --body: "Geist", "Geist Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Geist Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  --ease: cubic-bezier(.16, 1, .3, 1);
  --page: 1240px;
  --gutter: clamp(16px, 4vw, 40px);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --canvas: #0b0d14; --mist: #141723; --mist-2: #1b1f2d; --ink: #eef0f6; --ink-2: #c5cad8; --muted: #969cb0;
    --hairline: #252a39; --hairline-strong: #343a4c; --accent: #8a94ff; --accent-hover: #a3abff; --accent-ink: #0b0d14;
    --accent-soft: #1b1f3d; --accent-text: #9ea6ff; --band: #141723; --band-ink: #eef0f6; --band-muted: #969cb0;
    --shadow: 0 0 0 1px rgba(255, 255, 255, .05), 0 10px 30px rgba(0, 0, 0, .45);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --canvas: #0b0d14; --mist: #141723; --mist-2: #1b1f2d; --ink: #eef0f6; --ink-2: #c5cad8; --muted: #969cb0;
  --hairline: #252a39; --hairline-strong: #343a4c; --accent: #8a94ff; --accent-hover: #a3abff; --accent-ink: #0b0d14;
  --accent-soft: #1b1f3d; --accent-text: #9ea6ff; --band: #141723; --band-ink: #eef0f6; --band-muted: #969cb0;
  --shadow: 0 0 0 1px rgba(255, 255, 255, .05), 0 10px 30px rgba(0, 0, 0, .45);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; }
html.lenis { scroll-behavior: auto; }  /* Lenis does the smoothing; native smooth scroll would fight it */
body {
  margin: 0; background: var(--canvas); color: var(--ink);
  font: 400 16px/1.55 var(--body); font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
::selection { background: var(--accent); color: var(--accent-ink); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 6px; }
a { color: inherit; text-underline-offset: .24em; text-decoration-thickness: 1px; text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); }
a:hover { text-decoration-color: currentColor; }
input, textarea { caret-color: var(--accent); }
img, svg { display: block; max-width: 100%; }
button, input, select { font: inherit; color: inherit; }
.wrap { width: min(var(--page), 100% - 2 * var(--gutter)); margin-inline: auto; }
.mono { font-family: var(--mono); font-feature-settings: "tnum", "zero"; letter-spacing: -.01em; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
html { scrollbar-color: var(--hairline-strong) var(--canvas); }

/* ---------- Nav ---------- */
.nav { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--canvas) 88%, transparent); backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px); border-bottom: 1px solid transparent; transition: border-color .3s var(--ease); }
.nav.is-scrolled { border-bottom-color: var(--hairline); }
.nav__row { height: 68px; display: flex; align-items: center; gap: 32px; }
.brand { display: inline-flex; align-items: baseline; gap: 8px; text-decoration: none; }
.brand__mark { width: 22px; height: 22px; flex: none; color: var(--ink); align-self: baseline; transform: translateY(1px); }
.brand__word { font: 850 23px/1 var(--display); font-stretch: 112%; letter-spacing: -.045em; }
.brand__word span { font-weight: 500; letter-spacing: -.035em; }
.nav__links { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.nav__links a { display: block; padding: 8px 12px; border-radius: var(--radius-pill); font-size: 15px; font-weight: 500; text-decoration: none; color: var(--ink-2); transition: background .2s, color .2s; }
.nav__links a:hover { background: var(--mist); color: var(--ink); }
.nav__end { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.link-quiet { padding: 9px 14px; border-radius: var(--radius-pill); font-size: 15px; font-weight: 500; text-decoration: none; color: var(--ink-2); }
.link-quiet:hover { background: var(--mist); color: var(--ink); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: var(--radius-pill); border: 1px solid transparent; font-size: 15px; font-weight: 600; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background .2s, border-color .2s, transform .15s var(--ease); }
.btn:active { transform: scale(.98); }
.btn--ink { background: var(--ink); color: var(--canvas); }
.btn--ink:hover { background: var(--ink-2); }
.btn--line { border-color: var(--hairline-strong); background: var(--canvas); color: var(--ink); }
.btn--line:hover { border-color: var(--ink); }
.btn--accent { background: var(--accent); color: var(--accent-ink); }
.btn--accent:hover { background: var(--accent-hover); }
.nav__menu { display: none; }

/* ---------- Hero ---------- */
.hero { position: relative; isolation: isolate; padding: 40px 0 40px; text-align: left; }
.hero h1 {
  margin: 0; max-width: 13ch;
  font: 860 clamp(2.4rem, 5.2vw, 4.4rem)/.98 var(--display); font-stretch: 94%;
  letter-spacing: -.04em; word-spacing: .06em; text-wrap: balance;
}
.hero__sub { margin: 20px 0 0; max-width: 46ch; font-size: clamp(1.02rem, 1.4vw, 1.15rem); color: var(--muted); text-wrap: pretty; }

/* Search pill */
.search { margin: 30px 0 0; width: min(900px, 100%); display: grid; grid-template-columns: 1.45fr 1fr 1fr auto; align-items: center; background: var(--canvas); border: 1px solid var(--hairline); border-radius: var(--radius-pill); box-shadow: var(--shadow); padding: 6px; text-align: left; position: relative; }
.search__seg { position: relative; display: flex; flex-direction: column; justify-content: center; min-width: 0; height: 64px; padding: 0 24px; border-radius: var(--radius-pill); cursor: text; transition: background .2s; }
.search__seg + .search__seg::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 1px; background: var(--hairline); transition: opacity .2s; }
.search__seg:hover { background: var(--mist); }
.search__seg:hover::before, .search__seg:hover + .search__seg::before, .search__seg:focus-within::before, .search__seg:focus-within + .search__seg::before { opacity: 0; }
.search__seg:focus-within { background: var(--canvas); box-shadow: var(--shadow); }
.search__label { font-size: 12.5px; font-weight: 600; letter-spacing: .01em; }
.search__input, .search__select { width: 100%; border: 0; padding: 2px 0 0; background: transparent; font-size: 15px; color: var(--ink); outline: none; appearance: none; -webkit-appearance: none; text-overflow: ellipsis; }
.search__input::placeholder { color: var(--muted); opacity: 1; }
.search__select { cursor: pointer; color: var(--ink-2); }
.search__select option { color: #111614; background: #fff; }
.search__go { display: inline-flex; align-items: center; gap: 8px; height: 58px; padding: 0 22px 0 20px; margin-left: 4px; border: 0; border-radius: var(--radius-pill); background: var(--accent); color: var(--accent-ink); font-weight: 600; font-size: 16px; cursor: pointer; transition: background .2s, transform .15s var(--ease); }
.search__go:hover { background: var(--accent-hover); }
.search__go:active { transform: scale(.97); }
.search__go i { font-size: 20px; }
.suggest { position: absolute; z-index: 15; top: calc(100% + 10px); left: 0; width: min(520px, calc(100vw - 32px)); max-height: 340px; overflow-x: hidden; overflow-y: auto; margin: 0; padding: 8px; list-style: none; background: var(--canvas); border: 1px solid var(--hairline); border-radius: 20px; box-shadow: var(--shadow); }
.suggest[hidden] { display: none; }
.suggest li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 12px; cursor: pointer; font-size: 15px; }
.suggest li[aria-selected="true"], .suggest li:hover { background: var(--mist); }
.suggest li > * { min-width: 0; }
.suggest small { color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.suggest .is-closed { color: var(--muted); }

/* ---------- Sector strip + ranking ---------- */
.rank { padding: 26px 0 40px; }
.strip { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--hairline); padding: 0 2px; scroll-snap-type: x proximity; }
.strip::-webkit-scrollbar { display: none; }
.strip button { flex: 1 0 auto; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 10px 14px 14px; border: 0; background: none; color: var(--muted); font-size: 13.5px; font-weight: 600; white-space: nowrap; cursor: pointer; position: relative; scroll-snap-align: start; transition: color .2s; }
.strip button i { font-size: 26px; transition: transform .3s var(--ease); }
.strip button::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: -1px; height: 2px; background: var(--ink); border-radius: 2px; transform: scaleX(0); transition: transform .35s var(--ease); }
.strip button:hover { color: var(--ink); }
.strip button[aria-selected="true"] { color: var(--ink); }
.strip button[aria-selected="true"]::after { transform: scaleX(1); }
.strip button[aria-selected="true"] i { transform: translateY(-1px); }

.rank__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px 32px; margin: 28px 0 18px; }
.rank__title { margin: 0; font: 800 clamp(1.6rem, 2.6vw, 2.15rem)/1.08 var(--display); font-stretch: 96%; letter-spacing: -.03em; word-spacing: .05em; }
.rank__meta { margin: 8px 0 0; color: var(--muted); font-size: 15px; }
.rank__meta .mono { font-size: 13.5px; color: var(--ink-2); }
.rank__actions { display: flex; gap: 8px; }
.notice { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; padding: 10px 14px; border-radius: 12px; background: var(--mist); color: var(--ink-2); font-size: 13.5px; }
.notice i { font-size: 17px; color: var(--muted); flex: none; }

.table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 15px; }
.table th { position: sticky; top: 68px; z-index: 2; background: var(--canvas); text-align: left; font-size: 12.5px; font-weight: 600; color: var(--muted); padding: 12px 16px; border-bottom: 1px solid var(--hairline); white-space: nowrap; }
.table td { padding: 18px 16px; border-bottom: 1px solid var(--hairline); vertical-align: middle; }
.table tbody tr { transition: background .2s; }
.table tbody tr:hover { background: var(--mist); }
.table .num { text-align: right; }
.col-rank { width: 56px; }
.r-rank { font: 700 15px/1 var(--mono); color: var(--muted); }
.agency { display: flex; align-items: center; gap: 14px; min-width: 210px; }
.mono-tile { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 12px; font: 800 15px/1 var(--display); font-stretch: 110%; letter-spacing: -.03em; color: var(--tile-ink, #fff); background: var(--tile, #333); }
.agency__name { font-weight: 600; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.agency__name a { text-decoration: none; }
.agency__name a:hover { text-decoration: underline; }
.agency__hq { color: var(--muted); font-size: 13.5px; }
.tag-op { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: var(--radius-pill); border: 1px solid var(--hairline-strong); color: var(--ink-2); font-size: 11.5px; font-weight: 600; text-decoration: none; }
.tag-op:hover { border-color: var(--ink); }
.fact { display: inline-flex; flex-direction: column; gap: 4px; }
.fact__value { font-weight: 500; }
.chip { display: inline-flex; align-items: center; gap: 6px; width: fit-content; padding: 3px 9px 3px 6px; border-radius: var(--radius-pill); background: var(--accent-soft); color: var(--accent-text); font: 500 12px/1.3 var(--mono); text-decoration: none; white-space: nowrap; }
.chip i { font-size: 14px; }
.chip:hover { text-decoration: underline; }
.r-team, .r-year, .c-team, .c-year { color: var(--ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.score { display: inline-flex; align-items: baseline; gap: 2px; font: 800 26px/1 var(--display); font-stretch: 100%; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.score small { font: 500 12px/1 var(--mono); color: var(--muted); }
.rank__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 24px; }
.rank__foot p { margin: 0; color: var(--muted); font-size: 14px; }
.empty { padding: 56px 24px; text-align: center; border: 1px dashed var(--hairline-strong); border-radius: var(--radius-panel); }
.empty h3 { margin: 12px 0 6px; font: 800 1.35rem/1.15 var(--display); letter-spacing: -.02em; }
.empty p { margin: 0 auto 18px; max-width: 46ch; color: var(--muted); }
.empty i { font-size: 30px; color: var(--muted); }

/* restrike motion */
@media (prefers-reduced-motion: no-preference) {
  .is-striking tbody tr { animation: rowIn .62s var(--ease) both; animation-delay: calc(var(--i) * 55ms); }
  .is-striking .chip { animation: strike .5s var(--ease) both; animation-delay: calc(var(--i) * 55ms + 180ms); }
  @keyframes rowIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
  @keyframes strike { from { opacity: 0; transform: scale(1.18); filter: blur(3px); } to { opacity: 1; transform: none; filter: none; } }
}

/* ---------- Fact anatomy ---------- */
.anatomy { padding: 96px 0; background: var(--mist); }
.anatomy__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 88px); align-items: center; }
.h2 { margin: 0; font: 830 clamp(2rem, 3.6vw, 3.1rem)/1.02 var(--display); font-stretch: 94%; letter-spacing: -.035em; word-spacing: .05em; text-wrap: balance; }
.lede { margin: 20px 0 0; max-width: 46ch; color: var(--ink-2); font-size: 1.08rem; text-wrap: pretty; }
.points { margin: 28px 0 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.points li { display: grid; grid-template-columns: 28px 1fr; gap: 10px; color: var(--ink-2); }
.points i { font-size: 22px; color: var(--ink); margin-top: 1px; }

.record { background: var(--canvas); border-radius: 24px; box-shadow: var(--shadow); padding: clamp(22px, 3vw, 36px); }
.record__top { display: flex; align-items: center; gap: 14px; padding-bottom: 20px; border-bottom: 1px solid var(--hairline); }
/* Logo tiles: the agency's own icon on white, so brand colours read the same in both themes */
.mono-tile--logo { overflow: hidden; background: #fff; box-shadow: inset 0 0 0 1px var(--hairline); }
.mono-tile--logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mono-tile--logo.is-small img { width: 62%; height: 62%; }
.record__top .mono-tile { width: 52px; height: 52px; font-size: 17px; }
.record__name { font: 800 1.3rem/1.1 var(--display); letter-spacing: -.02em; }
.record__sub { color: var(--muted); font-size: 14px; }
.stage { margin-left: auto; display: flex; gap: 4px; }
.stage span { width: 26px; height: 6px; border-radius: 3px; background: var(--accent); }
.record__claim { margin: 24px 0 22px; font: 750 clamp(1.35rem, 2.3vw, 1.85rem)/1.18 var(--display); font-stretch: 98%; letter-spacing: -.025em; text-wrap: balance; }
.record__claim mark { background: var(--accent-soft); color: var(--accent-text); padding: .02em .1em .06em; border-radius: 6px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.ledger { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 0; border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.ledger div { padding: 14px 16px 14px 0; border-bottom: 1px solid var(--hairline); }
.ledger div:nth-child(even) { padding-left: 16px; }
.ledger div:nth-child(odd) { border-right: 1px solid var(--hairline); }
.ledger div:nth-last-child(-n+2) { border-bottom: 0; }
.ledger dt { font-size: 12.5px; font-weight: 600; color: var(--muted); margin-bottom: 3px; }
.ledger dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.ledger a { color: var(--accent-text); }
.record__addr { display: flex; align-items: center; gap: 10px; margin-top: 18px; padding: 8px 8px 8px 16px; border-radius: var(--radius-pill); background: var(--mist); }
.record__addr code { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 500 13px/1.3 var(--mono); color: var(--ink-2); }
.copy { height: 36px; padding: 0 14px; font-size: 14px; }
.copy.is-done { background: var(--accent); color: var(--accent-ink); }

/* ---------- Method band ---------- */
.method { padding: 104px 0; background: var(--band); color: var(--band-ink); }
.method .h2 { max-width: 16ch; }
.method .lede { color: var(--band-muted); }
.weights { margin-top: 56px; }
.weights__bar { display: grid; grid-template-columns: 30fr 30fr 15fr 15fr 10fr; height: 76px; gap: 6px; }
.weights__seg { flex: var(--w) 1 0; min-width: 0; border-radius: 14px; background: color-mix(in srgb, #2337ff calc(var(--a) * 100%), #0d1030); color: #ffffff; display: flex; align-items: center; padding: 0 18px; font: 850 clamp(1.3rem, 2.4vw, 2rem)/1 var(--display); letter-spacing: -.03em; transform-origin: left; }
.weights__legend { display: grid; grid-template-columns: 30fr 30fr 15fr 15fr 10fr; gap: 6px; margin-top: 14px; }  /* same columns as the bar, so each label sits under its segment */
.weights__legend div { flex: var(--w) 1 0; min-width: 0; }
.weights__legend strong, .weights__legend span { padding-right: 12px; }
.weights__legend strong { display: block; font-size: 15px; font-weight: 600; }
.weights__legend span { display: block; color: var(--band-muted); font-size: 13.5px; line-height: 1.4; margin-top: 2px; }
.method__foot { margin-top: 56px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
.method__foot .btn--onband { background: var(--band-ink); color: var(--band); }
.method__foot .btn--onband:hover { opacity: .9; }
.method__foot p { margin: 0; color: var(--band-muted); font-size: 15px; }
@media (prefers-reduced-motion: no-preference) {
  .weights.is-in .weights__seg { animation: grow .9s var(--ease) both; animation-delay: calc(var(--i) * 90ms); }
  @keyframes grow { from { transform: scaleX(.2); opacity: 0; } to { transform: none; opacity: 1; } }
}

/* ---------- Index ---------- */
.index { padding: 88px 0; border-top: 1px solid var(--hairline); }
.index__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 48px; }
.index__head .lede { margin-top: 14px; }
.legend { display: flex; gap: 18px; color: var(--muted); font-size: 14px; }
.legend span { display: inline-flex; align-items: center; gap: 7px; }
.legend i { font-size: 16px; }
.index__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 44px 32px; }
.sector h3, .sector h4 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; padding-bottom: 12px; border-bottom: 1px solid var(--ink); font: 800 1.05rem/1.2 var(--display); letter-spacing: -.01em; }
.sector h3 i, .sector h4 i { font-size: 20px; }
.sector ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.sector li a, .sector li span { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; font-size: 15px; text-decoration: none; }
.sector li a { color: var(--ink); font-weight: 500; }
.sector li a i { color: var(--accent-text); font-size: 16px; transition: transform .25s var(--ease); }
.sector li a:hover { color: var(--accent-text); }
.sector li a:hover i { transform: translateX(3px); }
.sector li span { color: var(--muted); }
.sector li span i { font-size: 15px; color: var(--muted); flex: none; }

/* ---------- Data + report ---------- */
.data { padding: 104px 0; }
.data__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.panel--ink { display: flex; flex-direction: column; }
.panel--ink .files { margin-top: auto; padding-top: 0; }
.panel--ink .lede { margin-bottom: 32px; }
.panel { border-radius: 24px; padding: clamp(28px, 3.4vw, 44px); }
.panel--ink { background: var(--ink); color: var(--canvas); }
.panel--ink .lede { color: color-mix(in srgb, var(--canvas) 72%, var(--ink)); }
.panel--mist { background: var(--mist); }
.panel h2 { margin: 0; font: 820 clamp(1.6rem, 2.6vw, 2.2rem)/1.05 var(--display); letter-spacing: -.03em; text-wrap: balance; }
.files { list-style: none; padding: 0; margin: 28px 0 0; border-top: 1px solid color-mix(in srgb, var(--canvas) 18%, transparent); }
.file { display: grid; grid-template-columns: 28px auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 16px 0; border-bottom: 1px solid color-mix(in srgb, var(--canvas) 18%, transparent); }
.file em { font: 500 12px/1 var(--mono); font-style: normal; color: color-mix(in srgb, var(--canvas) 66%, var(--ink)); padding: 7px 12px; border-radius: var(--radius-pill); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--canvas) 22%, transparent); white-space: nowrap; }
.file i { font-size: 22px; }
.file strong { font-weight: 600; }
.file span { font-size: 14px; color: color-mix(in srgb, var(--canvas) 66%, var(--ink)); }
.report__date { display: inline-block; margin-top: 18px; font: 500 13px/1 var(--mono); color: var(--muted); }
.subscribe { margin-top: 28px; display: grid; gap: 8px; }
.subscribe label { font-size: 14px; font-weight: 600; }
.subscribe__row { display: flex; gap: 8px; }
.subscribe input { flex: 1; min-width: 0; height: 48px; padding: 0 18px; border-radius: var(--radius-pill); border: 1px solid var(--hairline-strong); background: var(--canvas); outline: none; }
.subscribe input::placeholder { color: var(--muted); opacity: 1; }
.subscribe input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.subscribe input[aria-invalid="true"] { border-color: #c4291c; }
.subscribe .btn { height: 48px; }
.form-msg { min-height: 20px; margin: 0; font-size: 13.5px; color: var(--muted); }
.form-msg.is-error { color: #b42318; }
.form-msg.is-ok { color: var(--accent-text); }

/* ---------- For agencies ---------- */
.agencies { padding: 0 0 104px; }
.agencies__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px 48px; padding: 36px 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--hairline); }
.agencies h2 { margin: 0; font: 820 clamp(1.5rem, 2.4vw, 2rem)/1.1 var(--display); letter-spacing: -.03em; }
.agencies p { margin: 8px 0 0; color: var(--muted); max-width: 62ch; }

/* ---------- Footer ---------- */
.footer { background: var(--mist); padding: 72px 0 28px; font-size: 14.5px; }
.footer__grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 32px; }
.footer__about p { margin: 14px 0 0; color: var(--muted); max-width: 34ch; }
.footer h3 { margin: 0 0 12px; font-size: 14px; font-weight: 600; }
.footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.footer ul a { color: var(--muted); text-decoration: none; }
.footer ul a:hover { color: var(--ink); text-decoration: underline; }
.operator { margin-top: 48px; padding: 16px 20px; border-radius: 14px; background: var(--canvas); border: 1px solid var(--hairline); color: var(--ink-2); display: flex; gap: 12px; align-items: flex-start; }
.operator i { font-size: 20px; flex: none; margin-top: 1px; }
.operator a { color: var(--accent-text); }
.legal { margin-top: 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 13.5px; }
.theme { display: inline-flex; padding: 3px; border-radius: var(--radius-pill); border: 1px solid var(--hairline-strong); }
.theme button { display: grid; place-items: center; width: 34px; height: 30px; border: 0; border-radius: var(--radius-pill); background: none; color: var(--muted); cursor: pointer; }
.theme button[aria-pressed="true"] { background: var(--canvas); color: var(--ink); box-shadow: var(--shadow); }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .index__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .anatomy__grid, .data__grid { grid-template-columns: minmax(0, 1fr); }
  .nav__links { display: none; }
}
@media (max-width: 860px) {
  .search { grid-template-columns: 1fr; border-radius: 26px; padding: 8px; gap: 2px; }
  .search__seg { height: 58px; border-radius: 18px; }
  .search__seg + .search__seg::before { left: 24px; right: 24px; top: 0; bottom: auto; width: auto; height: 1px; }
  .search__go { margin: 6px 0 0; height: 54px; justify-content: center; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .footer__about { grid-column: 1 / -1; }
  .agencies__row { grid-template-columns: 1fr; }
  .file { grid-template-columns: 24px minmax(0, 1fr) auto; gap: 12px; }
  .file em { font-size: 11px; padding: 6px 10px; }
  .file span { display: none; }
  .weights__bar { height: 60px; gap: 4px; }
  .weights__seg { padding: 0 10px; border-radius: 10px; }
  .weights__legend { display: flex; flex-direction: column; gap: 10px; }
  .weights__legend div { display: grid; grid-template-columns: 52px 1fr; gap: 0 10px; }
  .weights__legend div::before { content: attr(data-w); grid-row: span 2; font: 800 18px/1.2 var(--display); }
  .weights__seg span { display: none; }
  /* table becomes stacked rows */
  .table thead { display: none; }
  .table, .table tbody, .table tr, .table td { display: block; }
  .table tbody tr { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; grid-template-areas: "rank agency score" ". fact fact" ". meta meta"; gap: 10px 12px; padding: 18px 4px; border-bottom: 1px solid var(--hairline); }
  .table td { padding: 0; border: 0; }
  .table td.c-rank { grid-area: rank; padding-top: 14px; }
  .table td.c-agency { grid-area: agency; }
  .table td.c-fact { grid-area: fact; min-width: 0; }
  .table td.c-fact .fact { display: flex; max-width: 100%; }
  .fact__value { overflow-wrap: anywhere; }
  .table td.c-fact .chip { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  .table td.c-std { display: none; }
  .table td.c-team { grid-area: meta; display: inline; color: var(--muted); font-size: 13.5px; }
  .table td.c-year { display: none; }
  .table td.c-score { grid-area: score; }
  .agency { min-width: 0; }
  .rank__actions { width: 100%; }
}
@media (max-width: 640px) {
  .nav__end .link-quiet { display: none; }
  .nav .brand__word { font-size: 19px; }
  .nav .brand__mark { width: 18px; height: 18px; }
  .nav__end .btn { height: 40px; padding: 0 16px; }
  .nav__more { display: none; }
  .hero { padding-top: 64px; }
  .index__grid { grid-template-columns: 1fr; }
  .ledger { grid-template-columns: 1fr; }
  .ledger div:nth-child(odd) { border-right: 0; }
  .ledger div:nth-child(even) { padding-left: 0; }
  .ledger div:nth-last-child(2) { border-bottom: 1px solid var(--hairline); }
  .stage { display: none; }
  .anatomy, .method, .index { padding: 72px 0; }
  .data { padding: 72px 0; }
  .agencies { padding-bottom: 72px; }
  .footer__grid { grid-template-columns: 1fr; }
  .subscribe__row { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation: none !important; scroll-behavior: auto !important; }
}

/* ---------- Agency record sheet ---------- */
.table tbody tr { cursor: pointer; }
.agency__open { padding: 0; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.agency__open:hover { text-decoration: underline; text-underline-offset: 3px; }
.record__open { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; padding: 0; border: 0; background: none; font: 600 15px/1.3 var(--body); color: var(--accent-text); cursor: pointer; }
.record__open:hover { text-decoration: underline; text-underline-offset: 3px; }
html:has(.sheet[open]) { overflow: hidden; }
.sheet { width: min(1080px, calc(100vw - 48px)); max-width: none; max-height: calc(100dvh - 48px); margin: auto; padding: 0; border: 0; border-radius: 24px; background: var(--canvas); color: var(--ink); box-shadow: var(--shadow); overflow: hidden; }
.sheet::backdrop { background: rgba(17, 22, 20, .48); }
.sheet[open] { animation: sheetIn .38s var(--ease) both; }
.sheet[open]::backdrop { animation: fadeIn .25s ease both; }
@keyframes sheetIn { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.sheet__inner { display: flex; flex-direction: column; max-height: calc(100dvh - 48px); }
.sheet__head { display: flex; align-items: center; gap: 14px; padding: 22px 24px 20px 36px; border-bottom: 1px solid var(--hairline); }
.sheet__head .mono-tile { width: 52px; height: 52px; font-size: 17px; }
.sheet__id { flex: 1; min-width: 0; }
.sheet__id h2 { margin: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font: 800 1.45rem/1.1 var(--display); letter-spacing: -.02em; }
.sheet__id p { margin: 3px 0 0; color: var(--muted); font-size: 14px; }
.sheet__close { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border: 1px solid var(--hairline); border-radius: var(--radius-pill); background: var(--canvas); color: var(--ink); font-size: 18px; cursor: pointer; transition: border-color .2s; }
.sheet__close:hover { border-color: var(--ink); }
.sheet__scroll { overflow-y: auto; overscroll-behavior: contain; padding: 4px 36px 32px; }
.sheet__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 20px 0 6px; border: 1px solid var(--hairline); border-radius: var(--radius-panel); }
.sheet__stats > div { display: flex; flex-direction: column; gap: 2px; padding: 14px 18px; min-width: 0; }
.sheet__stats > div + div { border-left: 1px solid var(--hairline); }
.sheet__k { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.sheet__v { font: 800 1.6rem/1.1 var(--display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.sheet__v small { font: 500 13px var(--body); color: var(--muted); letter-spacing: 0; }
.sheet__n { font-size: 13px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sheet__legend { margin: 18px 0 0; color: var(--muted); font-size: 13.5px; line-height: 1.9; }
.sheet__group { margin-top: 26px; }
.sheet__group h3 { margin: 0 0 4px; font: 750 1.05rem/1.2 var(--display); letter-spacing: -.01em; }
.frows { list-style: none; margin: 0; padding: 0; }
.frow { display: grid; grid-template-columns: 220px minmax(0, 1fr) auto; gap: 4px 18px; align-items: start; padding: 14px 0; border-bottom: 1px solid var(--hairline); scroll-margin-top: 12px; }
.frow:last-child { border-bottom: 0; }
.frow__label { padding-top: 2px; font-size: 13.5px; font-weight: 600; color: var(--muted); }
.frow__value { font-size: 15.5px; font-weight: 600; }
.frow__src { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.frow__src a { display: inline-flex; align-items: center; gap: 4px; min-width: 0; font: 500 12.5px/1.4 var(--mono); color: var(--accent-text); text-decoration: none; overflow-wrap: anywhere; }
.frow__src a:hover { text-decoration: underline; }
.frow__src a i { flex: none; font-size: 13px; }
.frow__meta { margin-top: 4px; font-size: 13px; color: var(--muted); }
.frow__meta a { color: var(--accent-text); }
.kind { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px 0 7px; border-radius: var(--radius-pill); font-size: 12px; font-weight: 600; white-space: nowrap; vertical-align: 1px; }
.kind i { font-size: 13px; }
.kind--vendor { background: var(--accent-soft); color: var(--accent-text); }
.kind--agency { background: var(--mist); color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--hairline); }
.frow__copy { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid transparent; border-radius: var(--radius-pill); background: none; color: var(--muted); font-size: 16px; cursor: pointer; transition: border-color .2s, color .2s; }
.frow__copy:hover { border-color: var(--hairline-strong); color: var(--ink); }
.frow__copy.is-done { color: var(--accent-text); border-color: var(--accent-text); }
.offices { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.offices li { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border-radius: var(--radius-panel); background: var(--mist); min-width: 0; }
.office__city { display: flex; align-items: center; gap: 7px; font-weight: 600; font-size: 14.5px; }
.office__city small { margin-left: 4px; color: var(--muted); font-weight: 500; font-size: 12.5px; }
.offices a { display: inline-flex; align-items: center; gap: 7px; width: fit-content; font-size: 14px; color: var(--ink-2); text-decoration: none; overflow-wrap: anywhere; }
.offices a:hover { color: var(--accent-text); text-decoration: underline; }
.offices a i { color: var(--muted); }
.offices + .frow__meta { margin-top: 12px; }
.sheet__sample { display: flex; gap: 10px; margin: 22px 0 0; padding: 14px 16px; border-radius: var(--radius-panel); background: var(--mist); color: var(--ink-2); font-size: 14px; }
.sheet__sample i { flex: none; margin-top: 3px; }
.sheet__foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 18px 36px; border-top: 1px solid var(--hairline); background: var(--canvas); }
.sheet__foot p { flex: 1 1 220px; margin: 0; color: var(--muted); font-size: 13px; }
.sheet__foot .btn--accent { order: -1; }
@media (max-width: 640px) {
  .sheet { width: 100vw; max-height: calc(100dvh - 24px); margin: auto 0 0; border-radius: 20px 20px 0 0; }
  .sheet__inner { max-height: calc(100dvh - 24px); }
  .sheet[open] { animation-name: sheetUp; }
  @keyframes sheetUp { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
  .sheet__head { padding: 16px 16px 14px; }
  .sheet__head .mono-tile { width: 44px; height: 44px; font-size: 15px; }
  .sheet__scroll { padding: 0 16px 24px; }
  .sheet__stats { grid-template-columns: 1fr 1fr; }
  .sheet__stats > div:nth-child(3) { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--hairline); }
  .frow { grid-template-columns: minmax(0, 1fr) auto; }
  .frow__label { grid-column: 1 / -1; }
  .frow__main { grid-column: 1; }
  .offices { grid-template-columns: 1fr; }
  .sheet__foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .sheet__foot .btn { flex: 1 1 0; }
  .sheet__foot p { flex-basis: 100%; }
}
@media (max-width: 860px) and (min-width: 641px) {
  .offices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .frow { grid-template-columns: 160px minmax(0, 1fr) auto; }
}

/* ---------- Browse by lens ---------- */
.browse { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 48px; align-items: start; }
.lenses { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 92px; }
.lenses button { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px; border: 0; border-radius: 14px; background: none; text-align: left; color: var(--ink-2); cursor: pointer; transition: background .2s, color .2s; }
.lenses button i { flex: none; font-size: 22px; color: var(--muted); transition: color .2s; }
.lenses button strong { display: block; font: 700 15.5px/1.2 var(--body); color: var(--ink); }
.lenses button small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--muted); }
.lenses button:hover { background: var(--mist); }
.lenses button[aria-selected="true"] { background: var(--ink); }
.lenses button[aria-selected="true"] strong { color: var(--canvas); }
.lenses button[aria-selected="true"] small, .lenses button[aria-selected="true"] i { color: color-mix(in srgb, var(--canvas) 72%, transparent); }
.lens-panel:not([hidden]) { animation: fadeIn .3s ease both; }
.lens-panel__head { display: grid; gap: 8px; padding-bottom: 24px; margin-bottom: 30px; border-bottom: 1px solid var(--hairline); }
.lens-panel__head h3 { margin: 0; font: 800 clamp(1.4rem, 2.2vw, 1.8rem)/1.1 var(--display); letter-spacing: -.02em; }
.lens-panel__head p { margin: 0; max-width: 62ch; color: var(--muted); }
.lens-panel__head code { justify-self: start; padding: 4px 10px; border-radius: var(--radius-pill); background: var(--mist); font: 500 12.5px/1.4 var(--mono); color: var(--ink-2); }
.lens-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 36px 32px; }
.sector h4 { font-size: 1rem; }
.sector li a .n { margin-left: auto; font: 500 12.5px/1 var(--mono); color: var(--muted); }
.filters { margin-top: 72px; padding: clamp(22px, 3vw, 32px); border-radius: 24px; background: var(--mist); }
.filters > h3 { margin: 0 0 20px; font: 750 1.15rem/1.2 var(--display); letter-spacing: -.01em; }
.filters__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.filters h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font: 600 14px/1.3 var(--body); }
.filters h4 i { font-size: 17px; color: var(--muted); }
.chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.chips button, .chips span { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border: 0; border-radius: var(--radius-pill); background: var(--canvas); box-shadow: inset 0 0 0 1px var(--hairline-strong); font: 500 13.5px/1 var(--body); color: var(--ink-2); }
.chips button { cursor: pointer; transition: box-shadow .2s var(--ease), background-color .2s var(--ease), color .2s var(--ease); }
.chips button:hover { box-shadow: inset 0 0 0 1px var(--ink); color: var(--ink); }
.chips button:active { transform: scale(.98); }
.chips button[aria-pressed="true"] { background: var(--ink); color: var(--canvas); box-shadow: none; }
.filters .is-off .chips span { background: transparent; color: var(--muted); box-shadow: inset 0 0 0 1px var(--hairline); }
.filters h4 small { margin-left: auto; font: 500 11.5px/1 var(--mono); color: var(--muted); }
.filters__status { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 22px 0 0; padding: 12px 16px; border-radius: 12px; background: var(--canvas); font-size: 14.5px; }
.filters__status[hidden] { display: none; }
.filters__status span { font-weight: 600; }
.filters__status a { color: var(--accent-text); font-weight: 600; }
.link-btn { padding: 0; border: 0; background: none; font: inherit; color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.link-btn:hover { color: var(--ink); }
.rank-none td { padding: 28px 16px; color: var(--ink-2); }
.filters__note { margin: 20px 0 0; font-size: 13.5px; color: var(--muted); }
.kind--public { background: var(--accent-soft); color: var(--accent-text); }
@media (max-width: 1080px) { .filters__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  .browse { grid-template-columns: 1fr; gap: 28px; }
  .lenses { position: static; flex-direction: row; overflow-x: auto; scrollbar-width: none; margin: 0 calc(var(--gutter) * -1); padding: 0 var(--gutter); }
  .lenses::-webkit-scrollbar { display: none; }
  .lenses button { width: auto; flex: none; padding: 10px 16px 10px 12px; border-radius: var(--radius-pill); box-shadow: inset 0 0 0 1px var(--hairline); }
  .lenses button small { display: none; }
}
@media (max-width: 640px) {
  .lens-groups { grid-template-columns: 1fr; gap: 28px; }
  .filters__grid { grid-template-columns: 1fr; }
}

.nowrap { white-space: nowrap; }

/* ---------- Hero routes into the index ---------- */
.hero__lenses { margin: 26px auto 0; max-width: 960px; }
.hero__lenses p { margin: 0 0 10px; font-size: 14px; color: var(--muted); }
.hero__lenses ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.lens-chip { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 15px 0 12px; border-radius: var(--radius-pill); border: 1px solid var(--hairline-strong); background: var(--canvas); font-size: 14px; font-weight: 500; color: var(--ink); text-decoration: none; white-space: nowrap; transition: border-color .2s, background .2s; }
.lens-chip i { font-size: 17px; color: var(--muted); transition: color .2s; }
.lens-chip:hover { border-color: var(--ink); }
.lens-chip:hover i { color: var(--accent-text); }
.hero__op { max-width: 80ch; margin: 22px auto 0; font-size: 13.5px; color: var(--muted); text-wrap: balance; }
.hero__op i { font-size: 15px; margin-right: 6px; vertical-align: -3px; }
.hero__op a { color: var(--ink-2); }
.index__side { display: grid; justify-items: end; gap: 10px; }
.index__data { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 500; color: var(--accent-text); text-decoration: none; }
.index__data:hover { text-decoration: underline; }
@media (max-width: 640px) {
  .hero__lenses ul { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; margin: 0 calc(var(--gutter) * -1); padding: 0 var(--gutter) 4px; scroll-snap-type: x proximity; }
  .hero__lenses ul::-webkit-scrollbar { display: none; }
  .hero__lenses li { scroll-snap-align: start; }
  .index__side { justify-items: start; }
}

/* =========================================================
   Information architecture v2 (15 Oct 2026): the front page routes, each ranking is its own page.
   ========================================================= */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -48px; z-index: 50; padding: 10px 16px; border-radius: var(--radius-pill); background: var(--ink); color: var(--canvas); font-weight: 600; text-decoration: none; transition: top .2s var(--ease); }
.skip:focus { top: 12px; }
[data-view][hidden] { display: none; }
.nav__end .btn i { font-size: 18px; }
.hero { padding-bottom: 56px; }

/* ---------- Front-page index of open rankings ---------- */
.home-index { padding: 32px 0 104px; }
.home-index__head { display: grid; gap: 4px; margin-bottom: 40px; }
.home-index__head .lede { max-width: 62ch; margin-top: 12px; }
.lx-wrap { display: grid; gap: 40px; }
.lx h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; padding-bottom: 14px; border-bottom: 1px solid var(--ink); font: 820 clamp(1.4rem, 2vw, 1.65rem)/1.15 var(--display); letter-spacing: -.02em; }
.lx h3 i { font-size: 20px; color: var(--muted); }
.lx__list { list-style: none; margin: 0; padding: 0; }
.lx__list li + li { border-top: 1px solid var(--hairline); }
.lx__row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.25fr) 104px 150px 20px; align-items: center; gap: 24px; margin-inline: -14px; padding: 18px 14px; border-radius: 12px; color: var(--ink); text-decoration: none; transition: background-color .2s var(--ease); }
.lx__row:hover { background: var(--mist); }
.lx__name { display: grid; gap: 3px; min-width: 0; }
.lx__name strong { font: 750 1.08rem/1.25 var(--display); letter-spacing: -.01em; }
.lx__name small { font-size: 13.5px; color: var(--muted); }
.lx__lead { display: flex; align-items: center; gap: 12px; min-width: 0; font-size: 14.5px; color: var(--ink-2); }
.lx__lead > span:last-child { display: grid; min-width: 0; }
.lx__lead small { font-size: 12.5px; color: var(--muted); }
.lx__lead b { margin-left: 4px; font: 800 15px/1 var(--display); color: var(--ink); font-variant-numeric: tabular-nums; }
.lx__tiles { display: flex; flex: none; }
.lx__tiles .mono-tile { width: 30px; height: 30px; border-radius: 9px; font-size: 11px; box-shadow: 0 0 0 2px var(--canvas); }
.lx__tiles .mono-tile--logo { box-shadow: inset 0 0 0 1px var(--hairline), 0 0 0 2px var(--canvas); }
.lx__tiles .mono-tile + .mono-tile { margin-left: -8px; }
.lx__n { font-size: 14.5px; color: var(--ink-2); }
.lx__n b { font: 800 15px/1 var(--display); color: var(--ink); font-variant-numeric: tabular-nums; }
.lx__date { font: 500 12.5px/1.3 var(--mono); color: var(--muted); }
.lx__go { font-size: 18px; color: var(--accent-text); transition: transform .25s var(--ease); }
.lx__row:hover .lx__go { transform: translateX(3px); }
.roadmap { margin-top: 48px; border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.roadmap summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 0; cursor: pointer; list-style: none; font: 700 1rem/1.3 var(--display); }
.roadmap summary::-webkit-details-marker { display: none; }
.roadmap summary i { font-size: 18px; color: var(--muted); transition: transform .25s var(--ease); }
.roadmap[open] summary i { transform: rotate(180deg); }
.roadmap__rule { margin: 0 0 20px; color: var(--muted); font-size: 14.5px; }
.roadmap__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 40px; padding-bottom: 28px; }
.roadmap__grid h4 { margin: 0 0 6px; font: 700 14.5px/1.3 var(--body); }
.roadmap__grid p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }

/* ---------- Ranking page ---------- */
.rpage { padding: 40px 0 104px; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 28px; padding: 0; list-style: none; font-size: 14px; color: var(--muted); }
.crumbs li + li::before { content: "/"; margin-right: 6px; color: var(--hairline-strong); }
.crumbs a { color: var(--ink-2); text-decoration: none; }
.crumbs a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.rhead { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px 40px; }
.rhead__title { margin: 0; max-width: 22ch; font: 840 clamp(2rem, 4vw, 3.4rem)/1.02 var(--display); font-stretch: 94%; letter-spacing: -.035em; word-spacing: .05em; text-wrap: balance; }
.rhead__meta { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 14px 0 0; color: var(--ink-2); font-size: 15px; }
.rhead__meta .mono { font: 500 13.5px/1 var(--mono); }
.rhead__meta a { color: var(--accent-text); }
.rhead__share { display: flex; align-items: center; gap: 8px; max-width: 100%; padding: 4px 4px 4px 16px; border-radius: var(--radius-pill); background: var(--mist); }
.rhead__share code { min-width: 0; overflow: hidden; font: 500 12.5px/1 var(--mono); color: var(--ink-2); white-space: nowrap; text-overflow: ellipsis; }
.rhead__share .btn { flex: none; height: 38px; padding: 0 14px; font-size: 14px; gap: 6px; }
.orient { display: flex; align-items: flex-start; gap: 10px; margin: 28px 0 0; padding: 12px 16px; border-radius: 12px; background: var(--mist); color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.orient i { flex: none; margin-top: 2px; font-size: 17px; color: var(--muted); }
.orient a { color: var(--accent-text); }
.rtools { display: flex; flex-wrap: wrap; align-items: end; gap: 12px 16px; margin: 32px 0 8px; }
.rtools__f { display: grid; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--muted); }
.rtools__f select { height: 44px; min-width: 200px; padding: 0 40px 0 16px; border: 1px solid var(--hairline-strong); border-radius: var(--radius-pill); background: var(--canvas) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%235a645f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 14px center / 14px no-repeat; color: var(--ink); font: 500 15px/1 var(--body); appearance: none; cursor: pointer; }
.rtools__f select:hover { border-color: var(--ink); }
.rtools__out { display: flex; align-items: center; gap: 14px; margin: 0 0 12px auto; font-size: 14.5px; color: var(--ink-2); }
.rank__note { margin: 16px 0 0; font-size: 13.5px; color: var(--muted); }
.rank-none td { padding: 28px 16px; color: var(--ink-2); }
.link-btn { padding: 0; border: 0; background: none; font: inherit; color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.link-btn:hover { color: var(--ink); }
.rfoot { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 20px; margin-top: 64px; }
.rfoot > section { padding: clamp(24px, 3vw, 36px); border-radius: 24px; background: var(--mist); }
.rfoot h2 { margin: 0 0 10px; font: 800 1.35rem/1.15 var(--display); letter-spacing: -.02em; }
.rfoot p { margin: 0; max-width: 60ch; color: var(--ink-2); font-size: 15px; }
.rc { list-style: none; margin: 20px 0 22px; padding: 0; border-top: 1px solid var(--hairline-strong); }
.rc li { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--hairline-strong); color: var(--muted); font-size: 15px; }
.rc__w { font: 800 16px/1 var(--display); font-variant-numeric: tabular-nums; }
.rc__s { font: 500 12px/1 var(--mono); }
.rc li.is-on { color: var(--ink); }
.rc li.is-on .rc__s { color: var(--accent-text); }
.rlist { list-style: none; margin: 12px 0 22px; padding: 0; }
.rlist li + li { border-top: 1px solid var(--hairline-strong); }
.rlist a { display: grid; grid-template-columns: minmax(0, 1fr) auto 18px; align-items: center; gap: 12px; padding: 12px 0; color: var(--ink); font-weight: 600; font-size: 15px; text-decoration: none; }
.rlist a span { font-weight: 400; font-size: 13.5px; color: var(--muted); }
.rlist a i { color: var(--accent-text); transition: transform .25s var(--ease); }
.rlist a:hover i { transform: translateX(3px); }
.rlist--wide { max-width: 720px; margin-top: 8px; }
.rlist--wide li + li { border-top-color: var(--hairline); }
.arrow-link { display: inline-flex; align-items: center; gap: 8px; color: var(--accent-text); font-weight: 600; font-size: 15px; text-decoration: none; }
.arrow-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.rpage--closed .lede { max-width: 60ch; }
.closed__sub { margin: 48px 0 0; font: 800 1.2rem/1.2 var(--display); letter-spacing: -.01em; }

/* ---------- Method page ---------- */
.mpage { padding: 40px 0 104px; }
.mpage__wrap { max-width: 860px; }
.mpage .lede { max-width: 62ch; }
.mblock { margin-top: 56px; scroll-margin-top: 96px; }
.mblock h2 { margin: 0 0 12px; font: 800 clamp(1.4rem, 2.2vw, 1.75rem)/1.15 var(--display); letter-spacing: -.02em; }
.mblock p { margin: 0; max-width: 68ch; color: var(--ink-2); }
.mblock a { color: var(--accent-text); }
.mtable { width: 100%; margin-top: 24px; border-collapse: collapse; font-size: 15px; }
.mtable th, .mtable td { padding: 14px 12px 14px 0; border-bottom: 1px solid var(--hairline); text-align: left; vertical-align: top; }
.mtable thead th { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.mtable tbody th { width: 30%; font-weight: 600; }
.mtable td { color: var(--ink-2); }
.mtable td.num { width: 72px; font: 800 16px/1.4 var(--display); color: var(--ink); }

/* ---------- Record sheet: where else the agency is ranked ---------- */
.appears { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.appears a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--hairline); color: var(--ink); font-weight: 600; font-size: 15px; text-decoration: none; }
.appears a:hover { color: var(--accent-text); }
.appears span { font: 500 12.5px/1.5 var(--mono); color: var(--muted); }

@media (min-width: 1081px) { .footer__grid { grid-template-columns: 1fr 3fr .8fr; } }
.footer__rankings ul { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 24px; }

@media (max-width: 1080px) {
  .lx__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 20px; gap: 6px 20px; }
  .lx__name { grid-column: 1; grid-row: 1; }
  .lx__n { grid-column: 1; grid-row: 2; }
  .lx__date { grid-column: 1; grid-row: 3; }
  .lx__lead { grid-column: 2; grid-row: 1 / span 3; }
  .lx__go { grid-column: 3; grid-row: 1 / span 3; }
  .roadmap__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rfoot { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .home-index { padding: 16px 0 72px; }
  .lx__row { grid-template-columns: minmax(0, 1fr) 18px; gap: 8px 12px; margin-inline: 0; padding: 16px 0; }
  .lx__row:hover { background: none; }
  .lx__name, .lx__lead, .lx__n { grid-column: 1; grid-row: auto; }
  .lx__go { grid-column: 2; grid-row: 1; }
  .lx__date { display: none; }
  .roadmap__grid { grid-template-columns: minmax(0, 1fr); }
  .rpage, .mpage { padding: 24px 0 72px; }
  .rhead__share { width: 100%; }
  .rtools__f { flex: 1 1 140px; }
  .rtools__f select { width: 100%; min-width: 0; }
  .rtools__out { margin-left: 0; }
  .mtable tbody th { width: auto; }
  .footer__rankings ul { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Hero: the pool (app.js "Hero globe") ---------- */
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 0 32px; align-items: center; }
.hero__grid > .search { grid-column: 1 / -1; position: relative; z-index: 5; }  /* above the globe, so its suggestions are never covered */
.hero__grid > .search { margin-top: -110px; }  /* the search sits over the foot of the globe: searching the pool */
.hero__globe { position: relative; width: 100%; max-width: 520px; aspect-ratio: 1 / 1; justify-self: end; touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; }
.hero__globe canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__op { margin-left: 0; }
@media (max-width: 860px) {
  .hero__grid { grid-template-columns: 1fr; }
  .hero__globe { justify-self: center; max-width: 380px; margin-top: 8px; }
  .hero__grid > .search { margin-top: -40px; }
}

/* The verified mark is a lit dot (Data Pool brand): replaces the seal icon everywhere it appears */
i.ph-fill.ph-seal-check { width: .5em; height: .5em; border-radius: 50%; background: currentColor; -webkit-mask: none; mask: none; vertical-align: .08em; flex: none; display: inline-block; }
i.ph-fill.ph-seal-check::before { content: none !important; }

/* "evidence" in the H1: a straight ultramarine rule, no hand-drawn stroke */
/* "evidence": a straight ultramarine line drawn in from the left once the page loads */
.hero__title .ev { text-decoration: none; background: linear-gradient(var(--accent), var(--accent)) 0 92% / 0 .075em no-repeat; animation: ev-draw 1.2s cubic-bezier(.65, 0, .35, 1) .4s forwards; }
@keyframes ev-draw { to { background-size: 100% .075em; } }
@media (prefers-reduced-motion: reduce) { .hero__title .ev { background-size: 100% .075em; } }

/* Index rows: the leader as "#1 Name score", no caption above it */
.lx__lead > span.lx__top { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lx__one { font: 500 12.5px var(--mono); color: var(--muted); margin-right: 2px; }
/* Phones: the nav button keeps only its icon so it never runs off the edge */
@media (max-width: 520px) {
  .nav__end .btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .nav__end .btn { width: 40px; padding: 0; justify-content: center; }
}

/* Ranking summary and FAQ (crawlable sentences above and below the table) */
.rsum { max-width: 72ch; margin: 18px 0 4px; color: var(--ink-2); font-size: 15.5px; line-height: 1.6; }
.rsum p { margin: 0 0 6px; }
.rsum a, .rfaq a { color: var(--accent-text); }
.rfaq { max-width: 72ch; margin: 36px 0 8px; }
.rfaq h2 { margin: 0 0 6px; font: 750 1.35rem/1.2 var(--display); letter-spacing: -.01em; }
.rfaq h3 { margin: 18px 0 4px; font: 650 1rem/1.35 var(--body); color: var(--ink); }
.rfaq p { margin: 0; color: var(--ink-2); line-height: 1.6; }

/* Agency profile page */
.apage__head { display: flex; gap: 18px; align-items: flex-start; margin: 8px 0 8px; }
.apage__head .mono-tile { width: 56px; height: 56px; flex: none; }
.apage__head h1 { margin: 0 0 8px; }
.apage .lede { max-width: 70ch; }
.apage__sec { margin-top: 34px; max-width: 920px; }
.apage__sec > h2 { margin: 0 0 8px; font: 750 1.35rem/1.2 var(--display); letter-spacing: -.01em; }
.apage__ranks { list-style: none; margin: 0; padding: 0; }
.apage__ranks li { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 2px 14px; padding: 12px 0; border-bottom: 1px solid var(--hairline); }
.apage__ranks .pos { grid-row: span 2; font: 700 18px/1.2 var(--mono); color: var(--ink); }
.apage__ranks a { font-weight: 600; color: var(--ink); text-decoration: none; }
.apage__ranks a:hover { text-decoration: underline; }
.apage__ranks small { color: var(--muted); font-size: 13.5px; }
.apage__links { list-style: none; margin: 0; padding: 0; columns: 2 300px; }
.apage__links li { break-inside: avoid; padding: 6px 0; }
.apage__links a { color: var(--accent-text); }
.apage__cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 28px; }
.apage__note { margin-top: 40px; }
@media (max-width: 860px) { .apage__head .mono-tile { width: 44px; height: 44px; } }
.keyfacts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap: 0 32px; margin: 0; }
.keyfacts div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--hairline); }
.keyfacts dt { font-size: 13.5px; font-weight: 600; color: var(--muted); }
.keyfacts dd { margin: 0; font-weight: 600; color: var(--ink); }
.apage__checked { margin: 12px 0 0; font-size: 13.5px; color: var(--muted); }
.apage .rfaq { margin-top: 34px; }
.frow__src .frow__more { color: var(--ink-2); }
.langs { margin-top: 10px; font-size: 13.5px; color: var(--band-muted, var(--muted)); }
.langs a { color: inherit; }
.langs [aria-current] { font-weight: 600; }
/* Header language selector: EN · DE · FR */
.nav-langs { display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: var(--radius-pill); box-shadow: inset 0 0 0 1px var(--hairline-strong); font: 600 12px/1 var(--mono); }
.nav-langs a, .nav-langs span { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 30px; padding: 0 8px; border-radius: var(--radius-pill); color: var(--muted); text-decoration: none; letter-spacing: .04em; }
.nav-langs a:hover { color: var(--ink); background: var(--mist); }
.nav-langs [aria-current] { color: var(--canvas); background: var(--ink); }
@media (max-width: 520px) { .nav-langs a, .nav-langs span { min-width: 28px; height: 28px; padding: 0 6px; } }
/* Country links, ask-an-AI links, info pages, editor line */
.rlocs { margin: 6px 0 0; font-size: 14px; color: var(--muted); }
.rlocs a { color: var(--accent-text); }
.rlocs span { font: 500 12px var(--mono); color: var(--muted); }
.askai { margin: 22px 0 0; font-size: 13px; color: var(--muted); }
.askai a { color: var(--muted); text-decoration: underline; text-decoration-color: var(--hairline-strong); }
.askai a:hover { color: var(--ink); }
.dpage__wrap { max-width: 780px; }
.dpage__sec { margin-top: 30px; }
.dpage__sec h2 { margin: 0 0 8px; font: 750 1.25rem/1.25 var(--display); letter-spacing: -.01em; }
.dpage__sec p { margin: 0 0 10px; color: var(--ink-2); line-height: 1.65; }
.dpage__sec a, .dpage__more a { color: var(--accent-text); }
.dpage__more { margin-top: 28px; }
.dpage .table-wrap { margin-top: 26px; }
.table.tiers td { vertical-align: top; padding-top: 14px; padding-bottom: 14px; }
.tiers__n { font: 500 12px var(--mono); color: var(--muted); }
.mpage__editor { margin-top: 26px; font-size: 13px; color: var(--muted); }
.mpage__editor a { color: inherit; }

.nav-langs:empty { display: none; }
/* Disclosure: one quiet line under each ranking table (and at the end of the profile) */
.rank__disc { margin: 10px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--muted); }
.rank__disc a { color: inherit; text-decoration: underline; text-decoration-color: var(--hairline-strong); }