/* ── ARTICLE LAYOUT ── */
.article-layout {
  max-width: 760px;
  margin: 0 auto;
  padding: 60px 0 100px;
  width: 100%;
}

/* ── TABLE OVERRIDE: Prevent global 2100px min-width in articles ── */
.article-layout table {
  min-width: unset;
  table-layout: auto;
  width: 100%;
}

/* ── TOPBAR ── */
.topbar {
  background: rgba(10,13,15,0.92);
  border-bottom: 1px solid var(--border);
  padding: 0 24px;
  position: sticky;
  top: 0;
  z-index: 100;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  margin-left: -24px;
  margin-right: -24px;
}
.topbar-inner {
  max-width: 1900px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 52px;
}
.topbar-brand {
  font-family: 'DM Serif Display', serif;
  font-size: 16px;
  color: var(--text);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1;
}
.topbar-link {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  text-decoration: none;
  transition: color 0.18s;
}
.topbar-link:hover { color: var(--accent); }

/* ── HERO GRADIENTS (asset-specific) ── */
.hero.gold { background: linear-gradient(180deg, #100e06 0%, var(--bg) 100%); }
.hero.gold::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(245,158,11,0.09) 0%, transparent 70%); }
.hero.bonds { background: linear-gradient(180deg, #08090f 0%, var(--bg) 100%); }
.hero.bonds::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(165,180,252,0.07) 0%, transparent 70%); }
.hero.equities { background: linear-gradient(180deg, #080f0a 0%, var(--bg) 100%); }
.hero.equities::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(74,222,128,0.07) 0%, transparent 70%); }
.hero.real-estate { background: linear-gradient(180deg, #100a06 0%, var(--bg) 100%); }
.hero.real-estate::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(249,115,22,0.08) 0%, transparent 70%); }
.hero.cash { background: linear-gradient(180deg, #0a0f0a 0%, var(--bg) 100%); }
.hero.cash::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(34,197,94,0.07) 0%, transparent 70%); }
.hero.crypto { background: linear-gradient(180deg, #08060f 0%, var(--bg) 100%); }
.hero.crypto::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(167,139,250,0.09) 0%, transparent 70%); }
.hero.oil-energy { background: linear-gradient(180deg, #080a0c 0%, var(--bg) 100%); }
.hero.oil-energy::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(100,116,139,0.07) 0%, transparent 70%); }
.hero.small-physical-business { background: linear-gradient(180deg, #0f0905 0%, var(--bg) 100%); }
.hero.small-physical-business::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(251,146,60,0.08) 0%, transparent 70%); }
.hero.small-digital-business { background: linear-gradient(180deg, #060f08 0%, var(--bg) 100%); }
.hero.small-digital-business::before { background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(134,239,172,0.08) 0%, transparent 70%); }

/* ── ASSET ACCENT COLORS ── */
:root {
  --gold: #f59e0b;
  --gold-bg: rgba(245,158,11,0.07);
  --gold-border: rgba(245,158,11,0.2);
  --bond: #a5b4fc;
  --bond-bg: rgba(165,180,252,0.07);
  --bond-border: rgba(165,180,252,0.2);
  --eq: #4ade80;
  --eq-bg: rgba(74,222,128,0.07);
  --eq-border: rgba(74,222,128,0.2);
  --re: #f97316;
  --re-bg: rgba(249,115,22,0.07);
  --re-border: rgba(249,115,22,0.2);
  --cash: #22c55e;
  --cash-bg: rgba(34,197,94,0.07);
  --cash-border: rgba(34,197,94,0.2);
  --crypto: #a78bfa;
  --crypto-bg: rgba(167,139,250,0.07);
  --crypto-border: rgba(167,139,250,0.2);
  --oil: #64748b;
  --oil-bright: #94a3b8;
  --oil-bg: rgba(100,116,139,0.07);
  --oil-border: rgba(100,116,139,0.2);
  --phys: #fb923c;
  --phys-bg: rgba(251,146,60,0.07);
  --phys-border: rgba(251,146,60,0.2);
  --dig: #86efac;
  --dig-dim: #4ade80;
  --dig-bg: rgba(134,239,172,0.07);
  --dig-border: rgba(134,239,172,0.2);
}

/* ── TYPOGRAPHY ── */
.article-layout h2 {
  font-family: 'DM Serif Display', serif;
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 400;
  color: var(--text);
  margin: 60px 0 20px;
  line-height: 1.2;
}
.article-layout h2 em { font-style: italic; color: var(--accent); }

.article-layout h3 {
  font-family: 'DM Sans', sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  margin: 32px 0 10px;
  letter-spacing: 0.01em;
}

.article-layout p {
  font-size: 16px;
  color: #b0b8c4;
  margin-bottom: 20px;
  line-height: 1.8;
}
.article-layout p strong { color: var(--text); font-weight: 500; }
.article-layout p a { color: var(--accent); text-decoration: none; border-bottom: 1px solid rgba(56,189,248,0.3); transition: border-color 0.2s; }
.article-layout p a:hover { border-color: var(--accent); }

/* ── HERO ── */
.hero {
  background: linear-gradient(180deg, #090f0d 0%, var(--bg) 100%);
  border-bottom: 1px solid var(--border);
  padding: 72px 0 64px;
  position: relative;
  overflow: hidden;
  margin-left: max(-24px, -1 * env(safe-area-inset-left));
  margin-right: max(-24px, -1 * env(safe-area-inset-right));
  padding-left: max(48px, 8vw);
  padding-right: max(48px, 8vw);
}
.hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(34,197,94,0.07) 0%, transparent 70%);
  pointer-events: none;
}
.hero-inner {
  max-width: 760px;
  margin: 0 auto;
  position: relative;
}
.hero .eyebrow {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--exp, var(--accent));
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.hero .eyebrow::before {
  content: '';
  width: 24px; height: 1px;
  background: var(--exp, var(--accent));
}
.hero-meta {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.hero-meta span {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.hero-meta .dot { color: var(--border); }
.lead {
  font-size: 18px;
  font-weight: 400;
  color: #b0b8c4;
  line-height: 1.7;
  max-width: 680px;
  border-left: 3px solid var(--exp, var(--accent));
  padding-left: 20px;
}

/* ── ASSET CARDS ── */
.asset-grid { display: grid; gap: 16px; margin: 32px 0; }

.asset-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px 22px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.2s;
}
.asset-card:hover { border-color: #2d3a45; }
.asset-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
}
.asset-card.positive::before { background: var(--pos); }
.asset-card.negative::before { background: var(--neg); }
.asset-card.neutral::before  { background: var(--neu); }
.asset-card.mixed::before    { background: var(--mixed); }

.asset-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  flex-wrap: wrap;
  gap: 8px;
}
.asset-name {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: 'DM Serif Display', serif;
  font-size: 17px;
  color: var(--text);
}
.asset-icon { font-size: 20px; line-height: 1; }

.verdict {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 100px;
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  white-space: nowrap;
}
.verdict-positive { background: var(--pos-bg); color: var(--pos); }
.verdict-negative { background: var(--neg-bg); color: var(--neg); }
.verdict-neutral  { background: var(--neu-bg); color: var(--neu); }
.verdict-mixed    { background: var(--mixed-bg); color: var(--mixed); }

.intensity { display: flex; gap: 3px; margin-bottom: 10px; }
.bar { height: 3px; width: 18px; border-radius: 2px; background: var(--border); }
.bar.pos { background: var(--pos); }
.bar.neg { background: var(--neg); }
.bar.neu { background: var(--neu); }
.bar.mix { background: var(--mixed); }

.asset-body { font-size: 14px; color: var(--muted); line-height: 1.7; }
.asset-body p { font-size: 14px; color: var(--muted); margin: 0; }
.asset-body p + p { margin-top: 8px; }
.asset-body strong { color: #c0c8d4; font-weight: 500; }

/* ── PULL QUOTE ── */
.pull-quote {
  border-left: 3px solid var(--exp, var(--accent));
  padding: 20px 24px;
  margin: 40px 0;
  background: var(--exp-bg, var(--accent-bg));
  border-radius: 0 8px 8px 0;
}
.pull-quote p {
  font-family: 'DM Serif Display', serif;
  font-size: 20px;
  font-style: italic;
  color: var(--text);
  margin: 0;
  line-height: 1.5;
}

/* ── STAT ROW ── */
.stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin: 32px 0;
}
.stat-box {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 18px 16px;
  text-align: center;
}
.stat-num {
  font-family: 'DM Serif Display', serif;
  font-size: 32px;
  color: var(--exp, var(--accent));
  line-height: 1;
  margin-bottom: 6px;
}
.stat-num.red  { color: var(--neg); }
.stat-num.blue { color: var(--accent); }
.stat-num.amber { color: var(--neu); }
.stat-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  line-height: 1.4;
}

/* ── FED POLICY BOX ── */
.article-layout .fed-box {
  background: rgba(56,189,248,0.04);
  border: 1px solid rgba(56,189,248,0.18);
  border-radius: 10px;
  padding: 20px 22px;
  margin: 32px 0;
}

/* ── CAUTION BOX ── */
.caution-box {
  background: rgba(245,158,11,0.06);
  border: 1px solid rgba(245,158,11,0.2);
  border-radius: 10px;
  padding: 18px 22px;
  margin: 32px 0;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.caution-icon { font-size: 20px; flex-shrink: 0; margin-top: 2px; }
.caution-body { font-size: 14px; color: #c0b070; line-height: 1.7; }
.caution-body strong { color: var(--neu); font-weight: 500; }

/* ── SCORECARD ── */
.scorecard {
  margin: 32px 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}
.scorecard-header {
  padding: 14px 20px;
  background: var(--surface2);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
.scorecard-title {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--exp, var(--accent));
}
.scorecard-sub {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  color: var(--muted);
}
.scorecard-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.scorecard-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 20px;
  border-bottom: 1px solid var(--border);
  gap: 12px;
}
.scorecard-row:last-child { border-bottom: none; }
.scorecard-row:nth-child(odd) { background: rgba(255,255,255,0.015); }
.sc-condition {
  font-size: 13px;
  color: #b0b8c4;
  display: flex;
  align-items: center;
  gap: 8px;
}
.sc-icon { font-size: 14px; flex-shrink: 0; }
.sc-rating {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  padding: 2px 9px;
  border-radius: 100px;
  white-space: nowrap;
}
.sc-strong-pos { background: var(--pos-bg); color: var(--pos); }
.sc-pos { background: rgba(34,197,94,0.05); color: #16a34a; }
.sc-neutral { background: var(--neu-bg); color: var(--neu); }
.sc-mixed { background: var(--mixed-bg); color: var(--mixed); }
.sc-neg { background: rgba(239,68,68,0.05); color: #dc2626; }
.sc-strong-neg { background: var(--neg-bg); color: var(--neg); }

/* ── CYCLE CARDS ── */
.cycle-grid {
  display: grid;
  gap: 16px;
  margin: 32px 0;
}
.cycle-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px 22px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.2s;
}
.cycle-card:hover { border-color: #2d3a45; }
.cycle-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 3px; height: 100%;
}
.cycle-card.strong-pos::before { background: var(--pos); }
.cycle-card.pos::before { background: #16a34a; }
.cycle-card.neutral::before { background: var(--neu); }
.cycle-card.mixed::before { background: var(--mixed); }
.cycle-card.neg::before { background: #dc2626; }
.cycle-card.strong-neg::before { background: var(--neg); }
.cycle-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  flex-wrap: wrap;
  gap: 8px;
}
.cycle-name {
  display: flex;
  align-items: center;
  gap: 9px;
  font-family: 'DM Serif Display', serif;
  font-size: 16px;
  color: var(--text);
}
.cycle-icon { font-size: 18px; line-height: 1; }
.cycle-body {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.7;
}
.cycle-body strong { color: #c0c8d4; font-weight: 500; }

/* ── BOND / SECTOR TAGS ── */
.bond-row,
.sector-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.bond-tag,
.sector-tag {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.08em;
  padding: 2px 8px;
  border-radius: 100px;
  border: 1px solid var(--border);
  color: var(--muted);
}
.bond-tag.win,
.sector-tag.win {
  border-color: rgba(34,197,94,0.3);
  color: var(--pos);
  background: var(--pos-bg);
}
.bond-tag.lose,
.sector-tag.lose {
  border-color: rgba(239,68,68,0.3);
  color: var(--neg);
  background: var(--neg-bg);
}
.bond-tag.ok,
.sector-tag.neutral {
  border-color: rgba(245,158,11,0.3);
  color: var(--neu);
  background: var(--neu-bg);
}

/* ── DURATION TABLE ── */
.duration-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.duration-table th {
  background: var(--surface2);
  padding: 10px 14px;
  text-align: left;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}
.duration-table td {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  color: #b0b8c4;
  vertical-align: middle;
}
.duration-table tr:last-child td { border-bottom: none; }
.duration-table tr:hover td { background: rgba(255,255,255,0.02); }
.dt-type { font-weight: 500; color: var(--text); }

/* ── ROTATION TABLE ── */
.rotation-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.rotation-table th {
  background: var(--surface2);
  padding: 10px 14px;
  text-align: left;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}
.rotation-table td {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  color: #b0b8c4;
  vertical-align: middle;
}
.rotation-table tr:last-child td { border-bottom: none; }
.rotation-table tr:hover td { background: rgba(255,255,255,0.02); }
.rt-phase {
  font-weight: 500;
  color: var(--text);
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ── OPTIMAL CONDITIONS ── */
.optimal-box {
  background: var(--exp-bg, var(--accent-bg));
  border: 1px solid var(--exp-border, rgba(56,189,248,0.2));
  border-radius: 12px;
  padding: 22px 24px;
  margin: 32px 0;
}
.optimal-title {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--exp, var(--accent));
  margin-bottom: 14px;
}
.optimal-items {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.optimal-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 14px;
  color: #b0b8c4;
  line-height: 1.65;
}
.optimal-item .opt-check {
  color: var(--exp, var(--accent));
  flex-shrink: 0;
  font-family: 'DM Mono', monospace;
  margin-top: 2px;
}
.optimal-item strong { color: var(--text); font-weight: 500; }

/* ── MISTAKES BOX ── */
.mistakes-box {
  background: rgba(239,68,68,0.04);
  border: 1px solid rgba(239,68,68,0.15);
  border-radius: 12px;
  padding: 22px 24px;
  margin: 32px 0;
}
.mistakes-title {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--neg);
  margin-bottom: 14px;
}
.mistakes-items {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mistakes-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 14px;
  color: #c08080;
  line-height: 1.65;
}
.mistakes-item strong { color: #e09090; font-weight: 500; }

/* ── ACCESS GRID ── */
.access-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin: 24px 0;
}
.access-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 18px;
}
.access-icon { font-size: 22px; margin-bottom: 8px; }
.access-name {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 4px;
}
.access-desc { font-size: 12px; color: var(--muted); line-height: 1.5; }
.access-badge {
  display: inline-block;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  padding: 2px 7px;
  border-radius: 100px;
  margin-top: 6px;
}
.access-badge.easy { background: var(--pos-bg); color: var(--pos); }
.access-badge.medium { background: var(--neu-bg); color: var(--neu); }
.access-badge.complex { background: var(--neg-bg); color: var(--neg); }

/* ── ERR ICON ── */
.err-icon { flex-shrink: 0; margin-top: 2px; }

/* ── ARTICLE-SPECIFIC H2 EM ACCENTS ── */
.article-layout h2 { margin: 60px 0 20px; }
.article-layout h2 em { font-style: italic; color: var(--accent); }
.article-layout h2.gold-em em { color: var(--gold); }
.article-layout h2.bonds-em em { color: var(--bond); }
.article-layout h2.equities-em em { color: var(--eq); }

/* ── KEY TAKEAWAYS ── */
.takeaway-list {
  list-style: none;
  margin: 24px 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 0;
}
.takeaway-list li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  font-size: 15px;
  color: #b0b8c4;
  line-height: 1.65;
}
.takeaway-list li .arrow {
  font-family: 'DM Mono', monospace;
  color: var(--accent);
  flex-shrink: 0;
  width: 16px;
  margin-top: 3px;
}
.takeaway-list li .text { flex: 1; }
.takeaway-list li strong { color: var(--text); font-weight: 500; }

/* ── CTA ── */
.cta-box {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 32px 28px;
  margin: 60px 0 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cta-box::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
}
.cta-box h3 {
  font-family: 'DM Serif Display', serif;
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 22px;
  color: var(--text);
}
.cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--accent);
  color: #000;
  font-family: 'DM Mono', monospace;
  font-size: 12px;
  font-weight: 500;
  padding: 11px 24px;
  border-radius: 100px;
  text-decoration: none;
  letter-spacing: 0.05em;
  transition: opacity 0.18s;
}
.cta-btn:hover { opacity: 0.85; }

/* ── DIVIDER ── */
.divider {
  border: none;
  border-top: 1px solid var(--border);
  margin: 48px 0;
  opacity: 0.5;
}

/* ── SERIES NAV ── */
.series-nav {
  margin: 32px 0;
  padding: 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.series-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 12px;
}
.series-items {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.series-pill {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 100px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  text-decoration: none;
  background: var(--surface2);
  border: 1px solid var(--border);
  color: var(--muted);
  transition: all 0.18s;
}
.series-pill:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: rgba(56,189,248,0.06);
}
.series-pill.active {
  background: var(--accent);
  color: #000;
  border-color: var(--accent);
}

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  .hero { padding-top: 52px; padding-bottom: 48px; }
  .article-layout { padding-top: 44px; }
  .stat-row { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
  .article-layout h2 { font-size: 22px; margin-top: 44px; }
  .lead { font-size: 16px; }
  .stat-row { grid-template-columns: 1fr 1fr; gap: 10px; }
  .stat-num { font-size: 26px; }
  .summary-table { font-size: 12px; }
  .summary-table td, .summary-table th { padding: 9px 10px; }
  .asset-card { padding: 16px 18px; }
  .cta-box { padding: 24px 20px; }
  .pull-quote p { font-size: 17px; }
  .article-layout .fed-box { padding: 16px 18px; }
  .hero-meta { gap: 10px; }
  .hero { padding-left: 18px; padding-right: 18px; margin-left: -18px; margin-right: -18px; }
  /* SCORECARD: collapse to 1 column on mobile */
  .scorecard-grid { grid-template-columns: 1fr; }
  .sc-rating { font-size: 9px; }
  /* PREVENT horizontal overflow on mobile */
  body { overflow-x: hidden; }
}

@media (max-width: 400px) {
  .stat-row { grid-template-columns: 1fr; }
  .hero-meta .dot { display: none; }
}