/* Lore page specific styles — keep consistent with base.css and avoid duplicates */

.hero { padding: var(--space-11) 0 var(--space-10); position: relative; }
.hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 50% at 70% 10%, rgba(199,31,55,0.12), transparent 60%), radial-gradient(40% 40% at 10% 20%, rgba(201,162,39,0.12), transparent 60%); pointer-events: none; }
.hero-inner { display: grid; gap: var(--space-8); grid-template-columns: 1.1fr 1fr; align-items: center; }
.hero-copy .lead { color: var(--color-text-muted); max-width: 60ch; margin-top: var(--space-4); }
.hero-cta { display: flex; gap: var(--space-4); margin-top: var(--space-6); flex-wrap: wrap; }
.hero-media { margin: 0; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); border: 1px solid rgba(201,162,39,0.18); }
.hero-media img { display: block; width: 100%; height: auto; }

@media (max-width: 980px) { .hero-inner { grid-template-columns: 1fr; } }

/* Table of contents */
.toc { margin: var(--space-8) 0 var(--space-6); }
.toc-card { display: grid; gap: var(--space-4); }
.toc-title { margin: 0; }
.toc-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); margin: 0; padding: 0; }
.toc-list a { display: block; padding: var(--space-4) var(--space-5); border-radius: var(--radius-sm); background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.2)); border: 1px solid var(--gray-800); color: var(--gray-100); }
.toc-list a:hover { text-decoration: none; border-color: rgba(201,162,39,0.4); color: #f1e3b0; }
.toc-list a[aria-current="true"] { border-color: var(--color-accent); box-shadow: var(--focus-ring); color: #f1e3b0; }

@media (max-width: 900px) { .toc-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .toc-list { grid-template-columns: 1fr; } }

/* Sections */
.section { padding: var(--space-10) 0; }
.section h2 + p { margin-top: var(--space-4); }

/* Scroll offset for anchored headings under sticky header */
.section[id] { scroll-margin-top: 92px; }

/* Grids fine-tuning */
.beings-grid > .card, .places-grid > .card { height: 100%; }

/* Media frames */
.media-frame { margin: var(--space-6) 0 0; }
.media-frame img { border-radius: var(--radius-md); border: 1px solid rgba(201,162,39,0.18); box-shadow: var(--shadow-md); }
.media-frame figcaption { margin-top: var(--space-3); color: var(--color-text-muted); font-size: var(--text-sm); }

/* Table wrapper to enable horizontal scroll on small screens */
.table-wrap { overflow-x: auto; }
.table-wrap table { min-width: 640px; }

/* CTA row at the end */
.cta-row { display: flex; gap: var(--space-4); margin: var(--space-6) 0; flex-wrap: wrap; }

/* Helper: subtle divider spacing in helper nav */
.section + .section { border-top: 1px solid rgba(201,162,39,0.12); }