/* ============================================================
   THEME: Editorial / Magazine
   Warm paper, ink black, one signal red. Rules instead of boxes,
   oversized serif display, wide letter-spacing on eyebrows.
   Reads like a research weekly, not a SaaS page.
   ============================================================ */

:root {
  --bg:            #faf7f1;
  --bg-2:          #ffffff;
  --bg-3:          #f2ede3;
  --paper:         #faf7f1;
  --paper-2:       #ffffff;
  --ink:           #14110d;

  --fg:            #1a1712;
  --fg-strong:     #14110d;
  --fg-muted:      rgba(26, 23, 18, 0.6);
  --fg-muted-strong: rgba(26, 23, 18, 0.62);

  --line:          rgba(26, 23, 18, 0.16);
  --line-strong:   rgba(26, 23, 18, 0.4);
  --hover-tint:    rgba(176, 42, 30, 0.05);
  --row-strong-bg: #f6efe0;

  --accent:        #b02a1e;   /* signal red */
  --accent-strong: #8f2118;
  --accent-text:   #b02a1e;
  --accent-fg:     #fffaf5;
  --data:          #2f6b45;
  --data-halo:     rgba(47, 107, 69, 0.16);
  --rust:          #b02a1e;

  --nav-bg:        rgba(250, 247, 241, 0.94);
  --disabled-bg:   rgba(26, 23, 18, 0.07);
  --shadow:        0 1px 0 rgba(26, 23, 18, 0.06);
  --shadow-featured: none;

  --font-display:  "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --font-body:     "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-mono:     ui-monospace, "Cascadia Mono", Consolas, Menlo, monospace;
  --weight-display: 700;
  --track-display: -0.015em;

  --radius: 0px;
  --border-w: 1px;
  --border-w-featured: 2px;
}

/* hero: ruled paper, no glow */
.hero { background: var(--bg); border-bottom: var(--border-w) solid var(--line); }
.hero-grid-bg {
  background:
    repeating-linear-gradient(0deg, transparent 0 47px, rgba(26,23,18,0.035) 47px 48px);
}
.hero h1 em { font-style: italic; }

/* editorial rules: cards become ruled columns */
.card-locked, .tier, .deepdive, .funnel, .layer, .hero-terminal, .issue-card { box-shadow: none; }
.fault, .gates li, .takeaway, .stat { background: var(--paper-2); }

/* oversized stat numbers, ink not accent */
.stat-num { color: var(--fg-strong); font-family: var(--font-display); font-weight: 700; }
.stat-label em { color: var(--accent-text); font-style: italic; }

/* section titles get a top rule like a magazine standfirst */
.section-title { border-top: 2px solid var(--ink); padding-top: 18px; }
.hero h1 { border-top: 2px solid var(--ink); padding-top: 22px; }

/* anatomy bar: flatter, editorial palette */
.seg-goods   { background: #b02a1e; }
.seg-freight { background: #c9553f; }
.seg-duty    { background: #d97f63; }
.seg-dest    { background: #e5ab93; }
.seg-comm    { background: #2f6b45; }
.seg-ful     { background: #5a9170; }
.seg-ads     { background: #14110d; }
.seg-net     { background: #d8c9a8; }
.sw-goods { background: #b02a1e; } .sw-freight { background: #c9553f; } .sw-duty { background: #d97f63; }
.sw-dest { background: #e5ab93; } .sw-comm { background: #2f6b45; } .sw-ful { background: #5a9170; }
.sw-ads { background: #14110d; } .sw-net { background: #d8c9a8; }

/* funnel: solid ink bars */
.funnel-row:nth-child(3) .funnel-bar { background: #2b2620; }
.funnel-row:nth-child(4) .funnel-bar { background: #3d372f; }
.funnel-row:nth-child(5) .funnel-bar { background: #524a3f; }

/* tier featured: rule + red flag, no shadow */
.tier-featured { box-shadow: none; }
.flag { background: var(--accent); color: var(--accent-fg); }
.lock-badge { background: var(--ink); color: var(--paper-2); }

/* dark sections read as ink blocks */
.signals, .anatomy, .sample { background: var(--bg-3); }
.footer { background: var(--ink); color: var(--paper-2); }
.footer .footer-tag, .footer a, .footer .footer-note, .footer .copyright { color: rgba(250,247,241,0.62); }
.footer h4, .footer a:hover { color: #e5ab93; }
.footer .brand { color: var(--paper-2); }
.footer .brand-mark { background: var(--accent); color: var(--accent-fg); }
.footer .disclaimer { color: rgba(250,247,241,0.5); }
.footer .disclaimer strong { color: rgba(250,247,241,0.75); }
.matrix th { background: var(--bg-3); color: var(--accent-text); }
.signals .stat { background: var(--bg-3); }
.signals .stats { background: var(--line); }