.content-hero {
  background: radial-gradient(circle at 82% 22%, #7a12343d, transparent 32%), var(--bg);
  padding: clamp(72px, 9vw, 126px) clamp(24px, 8vw, 128px) clamp(68px, 8vw, 110px);
}

.content-hero h1 {
  font: 900 clamp(48px, 7.6vw, 100px)/.92 var(--font-serif);
  letter-spacing: -.052em;
  margin: 24px 0 32px;
  max-width: 1080px;
}

.content-hero h1 em { color: var(--rose); font-style: normal; }
.content-hero .hero-lede { font-size: clamp(20px, 2.2vw, 28px); max-width: 800px; }
.content-hero .hero-actions { margin-top: 34px; }

.crumbs {
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 11px;
  gap: 8px;
  margin-bottom: 22px;
}

.crumbs a { color: var(--rose); text-underline-offset: 3px; }

.content-section {
  padding: clamp(68px, 8vw, 110px) clamp(24px, 8vw, 128px);
}

.content-section:nth-child(even) { background: var(--panel); }
.content-section.magenta { background: var(--wine); }

.split-section {
  display: grid;
  gap: clamp(48px, 9vw, 130px);
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
}

.content-heading h2 {
  font: 900 clamp(36px, 5vw, 62px)/1.02 var(--font-serif);
  letter-spacing: -.038em;
  margin: 18px 0 24px;
  max-width: 780px;
}

.content-heading > p:not(.eyebrow) { color: var(--muted); line-height: 1.7; max-width: 700px; }
.magenta .content-heading > p:not(.eyebrow) { color: #f2dce4; }

.decision-list { border-top: 1px solid var(--line); counter-reset: decisions; }
.decision-list li { border-bottom: 1px solid var(--line); color: var(--muted); line-height: 1.65; padding: 22px 0 22px 52px; position: relative; }
.decision-list li::before { color: var(--rose); content: counter(decisions, decimal-leading-zero); counter-increment: decisions; font: 600 11px var(--font-mono); left: 0; position: absolute; top: 25px; }
.decision-list strong { color: var(--soft-ink); display: block; font: 700 20px/1.35 var(--font-serif); margin-bottom: 5px; }

.answer-grid {
  background: var(--line);
  border: 1px solid var(--line);
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 52px;
}

.answer-card { background: var(--bg); min-height: 300px; padding: clamp(28px, 4vw, 48px); }
.answer-card.featured { background: var(--wine); }
.answer-card .answer-topic { color: var(--rose); font: 600 10px var(--font-mono); letter-spacing: .13em; text-transform: uppercase; }
.answer-card.featured .answer-topic { color: #ffc8da; }
.answer-card h2, .answer-card h3 { font: 900 clamp(25px, 3vw, 38px)/1.1 var(--font-serif); margin: 28px 0 18px; }
.answer-card p { color: var(--muted); line-height: 1.65; }
.answer-card.featured p { color: #f2dce4; }
.answer-card a { color: var(--rose); display: inline-block; font-size: 13px; font-weight: 700; margin-top: 18px; text-underline-offset: 4px; }
.answer-card.featured a { color: #fff; }

.answer-preview { border-block: 1px solid var(--line); margin-top: 26px; padding: 20px 0; }
.answer-preview strong { color: var(--soft-ink); display: block; font: 700 18px/1.45 var(--font-serif); }
.answer-preview p { margin-bottom: 0; }

.related-strip { background: var(--wine); padding: clamp(54px, 7vw, 84px) clamp(24px, 8vw, 128px); }
.related-strip h2 { font: 900 clamp(33px, 4.8vw, 58px)/1.04 var(--font-serif); margin: 16px 0 26px; }
.related-strip a { background: #fff; color: var(--wine); display: inline-block; font-weight: 700; padding: 15px 20px; text-decoration: none; }

.error-page { align-items: flex-start; display: flex; flex-direction: column; justify-content: center; min-height: calc(100svh - 80px); }

@media (max-width: 980px) {
  .desktop-nav { gap: 18px; }
}

@media (max-width: 680px) {
  .content-hero, .content-section, .related-strip { padding-left: 22px; padding-right: 22px; }
  .split-section, .answer-grid { grid-template-columns: 1fr; }
  .content-hero h1 { margin-top: 20px; }
  .answer-card { min-height: 0; }
}
