/* Lore page specific styles (lean, complements base.css) */
.lore-hero { padding-block: var(--space-12); }
.lore-hero__grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--space-8); align-items: center; }
.lore-hero__media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.kicker { color: var(--color-primary); font-family: var(--font-display); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: var(--space-3); }
.hint { color: var(--color-muted); font-size: var(--fs-sm); margin-top: var(--space-3); }
.cta-group { display: flex; gap: var(--space-4); margin-top: var(--space-6); }

/* TOC */
.toc { position: sticky; top: 0; z-index: 5; padding-block: var(--space-6); }
.toc .card { padding: var(--space-6); }
.toc__nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-4); margin-top: var(--space-4); }
.toc__nav a { display: inline-block; padding: var(--space-3) var(--space-4); border: 1px solid rgba(255,255,255,0.06); border-radius: var(--radius-md); background: var(--color-surface); }
.toc__nav a:hover { background: var(--color-elevated); }

/* Sections */
#lore-sections { margin-block: var(--space-10); }
#lore-sections .card + .card { margin-top: var(--space-8); }
.section-figure { margin-top: var(--space-5); }
.section-figure img { border-radius: var(--radius-md); box-shadow: var(--shadow-md); }
.section-figure figcaption { color: var(--color-muted); font-size: var(--fs-sm); margin-top: var(--space-3); }

/* Closing image */
.closing-figure img { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.closing-figure figcaption { text-align: center; margin-top: var(--space-4); color: var(--color-muted); }

/* Responsive */
@media (max-width: 960px) {
  .lore-hero__grid { grid-template-columns: 1fr; }
  .toc { position: static; }
  .cta-group { flex-wrap: wrap; }
}
