/**
 * CONTENT REVIEW 2026-08-29 — CSS corrections.
 *
 * Loaded last, and only when FIXES_ENABLED (see src/config/fixes.ts). Under
 * PARITY_MODE=1 the layout omits the <link> entirely, so the parity build stays
 * a byte-faithful reproduction of production.
 *
 * These two could not go through applyFixes(): they are stylesheet defects, not
 * markup defects. Both are reproduced and measured on the origin.
 */

/* ── 1. Eyebrow labels failed WCAG AA ───────────────────────────────────────
 * .ds-eyebrow / .ds-ind-eyebrow / .ds-mega-feature__eyebrow / .cx-eyebrow all
 * take --cx-accent (#5b54f0), which measures 3.36:1 on #15181d, 3.74:1 on
 * #0a0a0e and 3.83:1 on #060609 — under the 4.5:1 AA threshold for normal text
 * at their 12.8px/12.5px size. Lighthouse scores the page 100 because it samples
 * against the lighter gradient areas; the darkest sections are where it fails.
 *
 * #8b84ff measures 5.80 / 6.44 / 6.59:1 on the same three grounds. Action indigo
 * is deliberately untouched — its label is white-on-fill and already passes.
 * ------------------------------------------------------------------------- */
:root { --cx-eyebrow: #8b84ff; }

/* Theme-CSS labels, coloured through --cx-accent. */
.ds-eyebrow,
.ds-ind-eyebrow,
.ds-mega-feature__eyebrow,
.cx-eyebrow { color: var(--cx-eyebrow); }

/* Track C labels, coloured through --orange (same #5b54f0, legacy name). The
 * token itself is NOT redefined: --orange also fills buttons and draws borders,
 * where the pairing is white-on-indigo and already passes. Only the small text
 * that sits ON the dark ground is lifted. :root raises specificity so these win
 * over page-common.css and over any page's own late <style> block. */
:root .dsp-eyebrow,
:root .dsp-card .k,
:root .dsp-card .more,
:root .dsp-reel-body .k,
:root .dsp-table th,
:root .dsp-crumb .curr,
:root .dsp-crumb a:hover,
:root .dsp-onpage-list .n,
:root .dsp-onpage-list a.is-active { color: var(--cx-eyebrow); }

/* ── 2. /insights card grid collapsed ───────────────────────────────────────
 * The deep_insights view nests its rows one level deeper than the grid class:
 *
 *   .dsp-grid.c3.dsp-viewgrid  >  .view-content.row  >  div  >  a.dsp-card
 *
 * so the grid on the outer wrapper only ever had one child and collapsed to a
 * single auto-sized track. Measured at a 1440px viewport: container 571px,
 * columns 199.30 / 185.71 / 177.81px, card heights 424/360/443/342/415/388.
 * Titles wrapped to five or six lines and two-thirds of the viewport sat empty
 * — on the page carrying the best content on the site.
 *
 * Move the grid onto .view-content, the real card parent. Double-class
 * selectors so this beats the page's own late <style> block whatever the
 * source order.
 * ------------------------------------------------------------------------- */
.dsp-viewgrid.dsp-grid { display: block; }

.dsp-viewgrid .view-content {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  align-items: stretch;
  gap: 4px;
  width: 100%;
  margin: 0;
}

/* Views wraps each row in a bare <div>; make it a full-height flex cell so
   sibling cards share a row height instead of ragging. */
.dsp-viewgrid .view-content > div { display: flex; }
.dsp-viewgrid .view-content > div > .dsp-card { width: 100%; }

@media (max-width: 700px) {
  .dsp-viewgrid .view-content { grid-template-columns: 1fr; }
}

/* Insight card meta line — the teaser carried an inline style="" per card. */
.dsp-card__meta {
  margin-top: auto;
  color: var(--cx-n400, #9b9b9b);
  font-family: var(--cx-fmono, var(--f-mono, monospace));
  font-size: .74rem;
  letter-spacing: .06em;
}

/* Case-study stat card: the client tag now sits under the metric instead of
   replacing it. */
.ds-card__tag {
  font-family: var(--cx-fmono, monospace);
  font-size: .74rem;
  letter-spacing: .06em;
  color: var(--cx-n500, #8a8a8a);
}
