/* ===== Badlands + Black Hills — site.css (built 2026-10-05) ===== */
/* Palette sampled from deck cover (PIL): bark #2b1a10 from cover's darkest
   pixels (#221107 avg); rust/gold/cream = Badlands striation tones from the
   deck's "Badlands striation" identity. Full palette replacement verified —
   no template hex colors remain. */

/* ===== Badlands striation graphic identity (2026-10-05) =====
   Avoidance check vs library (2026-10-05): Memphis vinyl (concentric circles),
   DC Greek-key (fret), Joshua Tree sunburst (radial), Tahoe ridgeline
   (clip-path), Sedona strata/sunburst, Italy aqueduct arcade + cypress spires +
   coin badges, Vermont/Japan/Scotland/Alaska falling leaves, Bethlehem waves,
   Iceland aurora veil, Route 66 neon highway, Maui palms, Death Valley salt
   hexagons, Banff aurora ribbons, Glacier stripes, Acadia waves, SF fog,
   Savannah iron, New Orleans beads, Switzerland peaks, Grand Canyon strata
   dividers + underline badges, Colorado ridgeline card. Closest to Grand
   Canyon's strata family — the differentiator here: (1) horizontal strata
   STRIP at the hero base (band stack, not dividers); (2) strata-CHIP day
   badges (rounded rect of 4 sediment bands with a cream pill + bark numeral,
   vs canyon's underline badges); (3) strata-band section dividers; (4) pull
   quote as a striated bark tablet with a 4-band top edge. Pure CSS only,
   mobile-safe. Palette flows through the entire page. */

:root {
  color-scheme: light dark;
  --paper: #faf2e3;
  --paper-2: #fffaf0;
  --ink: #2b1a10;
  --muted: #7a5f45;
  --bark: #2b1a10;
  --night: #1e0f06;
  --ochre: #8a5a24;
  --rust: #b4552d;
  --rust-deep: #8a3d1e;
  --gold: #d9a441;
  --gold-soft: #eec36f;
  --line: #d9c3a0;
  --white: #fffdf7;
  --shadow: rgba(43, 26, 16, .18);
  --max: 1180px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #16100a;
    --paper-2: #1f160d;
    --ink: #f7ecdc;
    --muted: #c9b3a0;
    --bark: #3a2412;
    --night: #120b05;
    --ochre: #7a5426;
    --rust: #d97f47;
    --rust-deep: #e08a4f;
    --gold: #d9a441;
    --gold-soft: #eec36f;
    --line: #4a3a28;
    --white: #2a2014;
    --shadow: rgba(0, 0, 0, .4);
  }
  .stat-band { background: linear-gradient(135deg, #5e2c12, #46200d); }
  /* Dark mode: keep the #7c5410 ts-tag readable — lighten it for dark backgrounds */
  .ts-tag { color: #eec36f; }
}
.accordion-panel { display: none; }
.day.is-open .accordion-panel, .accordion-item.is-open .accordion-panel { display: block; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "DM Sans", system-ui, sans-serif; line-height: 1.65; text-rendering: optimizeLegibility; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: 4px; }
button, input, select { font: inherit; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.progress { position: fixed; z-index: 30; inset: 0 auto auto 0; width: 0; height: 4px; background: var(--gold); }

/* ---------- Header ---------- */
.site-header { background: var(--bark); color: #fff8e9; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.header-inner { max-width: var(--max); margin: 0 auto; padding: 14px clamp(16px, 4vw, 24px); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.home-mark { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 13px; text-decoration: none; color: #fffaf0; }
.home-mark .brand-logo { width: 56px; height: 56px; border-radius: 50%; }
.brand-wordmark { display: grid; gap: 1px; color: #fffaf0; font-family: "Domine", serif; font-size: 1.02rem; font-weight: 700; line-height: 1.1; }
.brand-wordmark span:last-child { color: var(--gold-soft); }
.site-nav { display: flex; align-items: center; gap: 14px; }
.site-nav a { color: #fff8e9; text-decoration: none; }
.header-search, .header-share { background: none; border: 0; color: #fff8e9; cursor: pointer; padding: 8px; border-radius: 8px; }
.header-search svg, .header-share svg { width: 22px; height: 22px; display: block; }
.header-search-bar { display: none; max-width: var(--max); margin: 0 auto; padding: 0 clamp(16px, 4vw, 24px) 12px; position: relative; }
.header-search-bar.open { display: block; }
.header-search-bar .search-wrap { position: relative; }
.header-search-bar input { width: 100%; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--line); background: var(--white); color: var(--ink); }

/* ---------- Mega menu (source of truth: menu-config.json + menu-sync.py) ---------- */
.trip-menu { position: relative; }
.trip-menu summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; color: #fff8e9; font-weight: 700; padding: 8px 12px; border-radius: 10px; }
.trip-menu summary::-webkit-details-marker { display: none; }
.menu-bars { display: inline-grid; gap: 4px; }
.menu-bars span { display: block; width: 20px; height: 2px; background: var(--gold); border-radius: 2px; }
.menu-chevron { width: 10px; height: 10px; border-right: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(45deg) translateY(-2px); }
.trip-menu-panel { position: absolute; right: 0; top: calc(100% + 10px); min-width: min(560px, 92vw); background: var(--bark); color: #fffaf0; border: 1px solid rgba(217, 164, 65, .35); border-radius: 14px; padding: 20px 22px; box-shadow: 0 18px 50px rgba(0, 0, 0, .35); z-index: 60; }
.menu-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.menu-panel-title { margin: 0; font-family: "Domine", serif; font-size: 1.15rem; color: #fffaf0; }
.menu-all { color: var(--gold); font-weight: 700; text-decoration: none; font-size: .9rem; }
.destination-jump { margin-bottom: 14px; }
.destination-jump label { display: block; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-soft); margin-bottom: 6px; }
.destination-jump select { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(217, 164, 65, .4); background: var(--night); color: #fffaf0; }
.style-heading { font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-soft); margin: 14px 0 8px; }
.style-grid { display: grid; gap: 10px; }
.style-group h3 { margin: 0 0 6px; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--gold-soft); }
.style-group a { display: block; padding: 6px 0; color: #fffaf0; text-decoration: none; font-size: .95rem; }
.style-group a:hover { color: var(--gold); }
.menu-panel-foot { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .14); }

/* ---------- Hero ---------- */
.hero { min-height: 90svh; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr); background: var(--night); color: #fff8e9; overflow: hidden; position: relative; padding: 0 clamp(20px, 6vw, 32px); }
/* Strata strip along the hero base (identity touch #1): horizontal sediment bands */
.hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 84px; pointer-events: none;
  background: linear-gradient(to bottom, #8a3d1e 0 18%, #b4552d 18% 42%, #d9a441 42% 60%, #f7efe0 60% 78%, #2b1a10 78% 100%); }
.hero-copy { padding: clamp(42px, 8vw, 118px) clamp(24px, 7vw, 104px) 120px; display: flex; flex-direction: column; justify-content: space-between; position: relative; isolation: isolate; }
/* Warm rust dusk glow behind the headline */
.hero-copy::before { content: ""; position: absolute; width: 560px; height: 560px; left: -240px; top: -180px; background: radial-gradient(circle, rgba(180, 85, 45, .30), transparent 65%); z-index: -1; }
.category-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.cat-badge { display: inline-block; font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.cat-primary { background: #8a3d1e; color: #fff8e9; }
.cat-secondary { background: transparent; color: var(--gold-soft); border: 1px solid rgba(217, 164, 65, .5); }
.kicker, .section-kicker { margin: 0 0 22px; font-size: .78rem; font-weight: 800; letter-spacing: .19em; text-transform: uppercase; }
.kicker { color: var(--gold); }
.section-kicker { color: var(--rust-deep); }
h1 { max-width: 850px; margin: 0; font-family: "Domine", serif; font-weight: 700; font-size: clamp(2.6rem, 6vw, 5.6rem); line-height: .98; letter-spacing: -.02em; color: #fffdf7; }
h1 em { display: block; color: #d9a441; font-style: italic; font-weight: 600; }
.dek { max-width: 680px; margin: 28px 0 34px; font-family: "Domine", serif; font-size: clamp(1.2rem, 2vw, 1.7rem); line-height: 1.32; color: #f2e4cf; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 10px 28px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .22); font-size: .84rem; font-weight: 700; color: #f2e4cf; }
.hero-art { position: relative; min-height: 660px; margin: 0; background: var(--night); }
.hero-art img { width: 100%; height: 100%; object-fit: contain; }
.hero-art figcaption { position: absolute; right: 18px; bottom: 18px; background: rgba(30, 15, 6, .9); color: #fff; padding: 8px 12px; font-size: .72rem; border-radius: 6px; }
.guide-style-tags { margin: 14px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ts-tag { display: inline-block; font-size: .72rem; font-weight: 600; letter-spacing: .02em; padding: 3px 10px; border-radius: 999px; background: rgba(217, 164, 65, .15); color: #7c5410; border: 1px solid rgba(217, 164, 65, .35); white-space: nowrap; }
.zoomable { cursor: zoom-in; }

/* Strata-band section divider (identity touch #3): horizontal sediment bands */
hr.strata-divider { border: 0; height: 26px; margin: 0;
  background: linear-gradient(to bottom, #2b1a10 0 22%, #8a3d1e 22% 47%, #b4552d 47% 72%, #d9a441 72% 100%); }

/* ---------- TOC ---------- */
.jump-wrap { max-width: var(--max); margin: 0 auto; padding: 26px clamp(16px, 4vw, 24px) 0; }
details.toc { background: var(--paper-2); border: 1px solid var(--line); border-radius: 14px; padding: 14px 18px; }
details.toc summary { cursor: pointer; font-weight: 800; color: var(--rust-deep); }
nav.jump { display: flex; flex-wrap: wrap; gap: 8px 18px; padding-top: 10px; }
nav.jump a { color: var(--ink); font-size: .92rem; }
.guide-hero { max-width: var(--max); margin: 26px auto 0; padding: 0 clamp(16px, 4vw, 24px); }
.guide-hero img { width: 100%; border-radius: 18px; box-shadow: 0 14px 40px var(--shadow); }
figcaption { font-size: .82rem; color: var(--muted); padding-top: 8px; overflow-wrap: anywhere; }
figcaption a { color: var(--rust-deep); }

/* ---------- Sections ---------- */
section.overview, section.intro, section.route, section.planning, section.gallery, section.faq, section.checks, section.related, section.sources { max-width: var(--max); margin: 0 auto; padding: 56px clamp(16px, 4vw, 24px); }
section h2 { font-family: "Domine", serif; font-size: clamp(1.7rem, 3.4vw, 2.5rem); color: var(--ink); margin: 0 0 18px; letter-spacing: -.01em; }

/* Overview: at-a-glance + budget + recap + day summaries */
.overview-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.overview-head h2 { margin: 0; }
.at-a-glance { background: var(--paper-2); border: 1px solid var(--line); border-radius: 18px; padding: 24px 26px; margin-bottom: 22px; }
.at-a-glance h3 { margin: 0 0 12px; font-family: "Domine", serif; font-size: 1.25rem; color: var(--rust-deep); }
.at-a-glance dl { margin: 0; display: grid; gap: 12px; }
.at-a-glance dl > div { display: grid; grid-template-columns: 130px 1fr; gap: 12px; }
.at-a-glance dt { font-weight: 800; font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; color: var(--rust-deep); }
.at-a-glance dd { margin: 0; }
.budget { background: linear-gradient(135deg, var(--bark), var(--night)); color: #fff8e9; border-radius: 18px; padding: 26px 28px; margin-bottom: 22px; border-top: 4px solid var(--rust); }
.budget-label { margin: 0 0 6px; font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); }
.budget-total { margin: 0; font-family: "Domine", serif; font-size: clamp(1.9rem, 4vw, 2.6rem); color: #fffdf7; }
.budget-sub { margin: 8px 0 0; font-size: .88rem; color: #e9dcc4; }
.recap-figure { margin: 0 0 26px; }
.recap-figure img { width: 100%; height: auto; border-radius: 18px; box-shadow: 0 14px 40px var(--shadow); }
.day-summary-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.day-summary-button { display: block; width: 100%; padding: 0; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--paper-2); cursor: pointer; text-align: left; }
.day-summary-button img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.day-summary-label { display: block; padding: 10px 14px; font-weight: 700; font-size: .88rem; color: var(--ink); }

/* Share control */
.share-control { position: relative; flex: 0 0 auto; }
.share-trip-button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 44px; padding: 10px 16px; border: 1px solid var(--rust); border-radius: 999px; background: transparent; color: var(--rust-deep); font-size: .78rem; font-weight: 900; line-height: 1.2; cursor: pointer; }
.share-trip-button:hover, .share-trip-button[aria-expanded="true"] { background: var(--rust-deep); color: #fff8e9; }
.share-trip-button svg { width: 18px; height: 18px; flex: 0 0 auto; }
.share-menu { position: absolute; z-index: 20; top: calc(100% + 10px); right: 0; width: min(300px, calc(100vw - 48px)); padding: 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; border: 1px solid var(--line); border-radius: 14px; background: var(--white); box-shadow: 0 16px 40px var(--shadow); }
.share-menu[hidden] { display: none; }
.share-menu button { min-width: 0; min-height: 48px; display: flex; align-items: center; gap: 10px; padding: 10px 11px; border: 0; border-radius: 9px; background: transparent; color: var(--ink); font-size: .78rem; font-weight: 800; text-align: left; cursor: pointer; }
.share-menu button:hover, .share-menu button:focus-visible { background: var(--paper); color: var(--rust-deep); }
.share-menu svg { width: 19px; height: 19px; flex: 0 0 auto; }
.share-copy-fallback { flex: 1 1 100%; display: flex; align-items: center; gap: 10px; max-width: 680px; padding-top: 4px; }
.share-copy-fallback[hidden] { display: none; }
.share-copy-fallback label { flex: 0 0 auto; color: var(--muted); font-size: .75rem; font-weight: 800; }
.share-copy-fallback input { min-width: 0; width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); }

/* Intro + stat band */
.intro p { max-width: 72ch; }
.byline { margin-top: 18px; font-size: .9rem; color: var(--muted); }
.verified-chip { display: inline-block; background: var(--bark); color: #fff8e9; font-weight: 700; font-size: .78rem; padding: 3px 10px; border-radius: 999px; }
.stat-band { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); background: linear-gradient(135deg, var(--rust-deep), #6e2f14); border-radius: 18px; overflow: hidden; }
.stat-band > div { padding: 22px 20px; text-align: center; border-left: 1px solid rgba(255, 255, 255, .18); }
.stat-band > div:first-child { border-left: 0; }
.stat-band strong { display: block; font-family: "Domine", serif; font-size: 1.7rem; color: #fffdf7; }
.stat-band span { font-size: .82rem; color: #ffe9c9; }

/* ---------- Day accordions ---------- */
.day { border: 1px solid var(--line); border-radius: 16px; margin-bottom: 16px; background: var(--paper-2); overflow: hidden; }
.accordion-toggle { width: 100%; display: grid; grid-template-columns: auto 1fr auto; gap: 6px 14px; align-items: center; background: none; border: 0; padding: 18px 20px; cursor: pointer; text-align: left; }
/* Strata-chip day badges (identity touch #2): rounded rect of 4 sediment bands + cream pill + bark numeral */
.day-index { display: inline-flex; align-items: center; justify-content: center; width: 66px; height: 66px; border-radius: 14px; flex: 0 0 auto;
  background: linear-gradient(to bottom, #2b1a10 0 22%, #8a3d1e 22% 47%, #b4552d 47% 72%, #d9a441 72% 100%);
  box-shadow: inset 0 0 0 2px rgba(247, 239, 224, .35); }
.day-num { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; padding: 0 8px; border-radius: 10px; background: #f7efe0; color: #2b1a10; font-family: "Domine", serif; font-weight: 700; font-size: 1.15rem; }
.accordion-place { font-family: "Domine", serif; font-weight: 700; font-size: 1.18rem; color: var(--ink); }
.accordion-theme { grid-column: 2; font-size: .9rem; color: var(--muted); }
.accordion-icon { grid-row: 1 / span 2; grid-column: 3; font-size: 1.6rem; font-weight: 700; color: var(--rust-deep); line-height: 1; }
.accordion-panel { padding: 0 22px 26px; }
.day-image { margin: 6px 0 20px; }
.day-image img { width: 100%; height: auto; border-radius: 14px; }
.day-photo { margin: 22px 0 0; }
.day-photo img { width: 100%; border-radius: 14px; box-shadow: 0 10px 30px var(--shadow); }
.day .accordion-panel h4 { font-family: "Domine", serif; font-size: 1.08rem; color: var(--rust-deep); margin: 26px 0 10px; }
.day .accordion-panel p { margin: 0 0 14px; max-width: 74ch; }
.day .accordion-panel ul { margin: 0 0 16px; padding-left: 22px; max-width: 74ch; }
.day .accordion-panel li { margin-bottom: 8px; }
.route-note { background: rgba(180, 85, 45, .1); border-left: 4px solid var(--rust); padding: 12px 16px; border-radius: 0 10px 10px 0; margin: 18px 0; font-size: .94rem; }
.tip { background: var(--night); color: #f4ead6; border-radius: 12px; padding: 14px 18px; margin: 18px 0; font-size: .94rem; }
.tip strong { color: var(--gold); }

/* Pull quote (identity touch #4): striated bark tablet with 4-band top edge */
.pull-quote { background: var(--bark); color: #fff8e9; border-radius: 14px; padding: 34px 34px 30px; margin: 34px 0; border-top: 10px solid #b4552d; border-image: linear-gradient(to right, #2b1a10, #8a3d1e, #b4552d, #d9a441) 1; position: relative; }
.pull-quote p { font-family: "Domine", serif; font-size: clamp(1.25rem, 2.6vw, 1.7rem); line-height: 1.4; margin: 0; color: #fffdf7; }
.pull-quote p span { color: var(--gold); font-style: italic; }
.route-map { margin: 34px auto 0; max-width: 640px; }
.route-map img { width: 100%; height: auto; display: block; border-radius: 16px; box-shadow: 0 14px 40px var(--shadow); }

/* ---------- About CTA ---------- */
section.about-cta { background: var(--night); border-radius: 22px; }
.about-cta-inner { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; }
.about-cta-kicker { margin: 0 0 8px; font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.about-cta h2 { color: #fffdf7; }
.about-cta p { color: #e9dcc4; max-width: 62ch; }
.about-cta-button { display: inline-block; background: var(--gold); color: #241108; font-weight: 800; padding: 14px 26px; border-radius: 999px; text-decoration: none; white-space: nowrap; }
.about-cta-button:hover { background: var(--gold-soft); color: #241108; }

/* ---------- Planning: budget, packing, extras ---------- */
.budget-breakdown { background: linear-gradient(135deg, #5e2c12, #46200d); border: 1px solid #5e2c12; border-radius: 18px; padding: 24px 26px; margin-bottom: 22px; color: #fff8e9; }
.budget-breakdown h3 { margin: 0 0 6px; font-family: "Domine", serif; font-size: 1.25rem; color: var(--gold-soft); }
.budget-breakdown li strong { color: var(--gold-soft); }
.budget-breakdown ul { margin: 14px 0 0; padding-left: 22px; }
.budget-breakdown li { margin-bottom: 8px; }
.pack { background: var(--paper-2); border: 1px solid var(--line); border-radius: 18px; padding: 24px 26px; margin-bottom: 22px; }
.pack h3 { margin: 0 0 12px; font-family: "Domine", serif; font-size: 1.25rem; color: var(--rust-deep); }
.pack ul { list-style: none; margin: 0 0 18px; padding: 0; }
.pack li { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.pack li::before { content: "✓"; color: var(--rust-deep); font-weight: 800; flex: 0 0 auto; }
.pack-photos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.pack-photos figure { margin: 0; }
.pack-photos img { width: 100%; border-radius: 12px; aspect-ratio: 4/3; object-fit: cover; }
.plan-extras { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; }
.plan-extra-copy { background: var(--paper-2); border: 1px solid var(--line); border-radius: 18px; padding: 24px 26px; }
.plan-extra-copy h3 { margin: 0 0 10px; font-family: "Domine", serif; font-size: 1.2rem; color: var(--rust-deep); }
.plan-extra-copy p { margin: 0; }

/* ---------- Gallery / Instagram CTA ---------- */
.gallery { display: grid; gap: 22px; }
.gallery figure { margin: 0; max-width: 560px; }
.gallery img { width: 100%; height: auto; border-radius: 16px; box-shadow: 0 14px 40px var(--shadow); }
aside.instagram-cta { background: linear-gradient(135deg, var(--ochre), var(--night)); border-radius: 22px; }
.instagram-cta-inner { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; }
.instagram-cta h2 { color: #fffdf7; }
.instagram-cta p { color: #e9dcc4; margin: 0; max-width: 60ch; }
.ig-button { display: inline-block; background: var(--gold); color: #241108; font-weight: 800; padding: 14px 26px; border-radius: 999px; text-decoration: none; white-space: nowrap; }
.ig-button:hover { background: var(--gold-soft); color: #241108; }

/* ---------- FAQ ---------- */
.faq-item { border: 1px solid var(--line); border-radius: 14px; margin-bottom: 12px; background: var(--paper-2); }
.faq-item summary { cursor: pointer; padding: 16px 20px; font-weight: 700; color: var(--ink); }
.faq-item summary::marker { color: var(--rust); }
.faq-item > div { padding: 0 20px 18px; }
.faq-item p { margin: 0 0 10px; }

/* ---------- Checks / related / sources ---------- */
section.checks { background: var(--paper-2); border: 1px solid var(--line); border-radius: 18px; }
.checks h2 { color: var(--rust-deep); }
.checks ul { margin: 0; padding-left: 22px; }
.checks li { margin-bottom: 10px; }
.related-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.related-card { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--paper-2); }
.related-card a { text-decoration: none; display: block; }
.related-card img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.related-card h3 { font-family: "Domine", serif; font-size: 1.1rem; margin: 0; padding: 14px 16px 4px; color: var(--ink); }
.related-card p { margin: 0; padding: 0 16px 16px; font-size: .9rem; color: var(--muted); }
.sources ul { margin: 0 0 14px; padding-left: 22px; }
.sources li { margin-bottom: 8px; font-size: .94rem; }
.sources a { color: var(--rust-deep); }
.sources-note { font-size: .86rem; color: var(--muted); border-top: 1px solid var(--line); padding-top: 12px; }

/* ---------- Trip browser ---------- */
.route-browser { max-width: var(--max); margin: 0 auto; padding: 40px clamp(16px, 4vw, 24px) 60px; }
.browser-inner { background: var(--paper-2); border: 1px solid var(--line); border-radius: 22px; padding: clamp(20px, 4vw, 40px); }
.browser-head { display: grid; gap: 10px; margin-bottom: 20px; }
.browser-note { margin: 0; color: var(--muted); font-size: .92rem; }
.filter-panel { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 14px; }
.filter-field label { display: block; font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--rust-deep); margin-bottom: 5px; }
.filter-field input, .filter-field select { width: 100%; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--white); color: var(--ink); }
.filter-reset { justify-self: start; background: none; border: 1px solid var(--rust); color: var(--rust-deep); border-radius: 999px; padding: 8px 20px; font-weight: 700; cursor: pointer; }
.result-line { grid-column: 1 / -1; display: flex; gap: 10px; align-items: baseline; font-size: .9rem; color: var(--muted); }
.filter-prompt { display: flex; gap: 12px; align-items: center; justify-content: center; padding: 26px; color: var(--muted); }
.filter-prompt[hidden] { display: none; }
.prompt-arrow { font-size: 4rem; color: var(--rust); line-height: 1; }
.library-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; }
.trip-item[hidden] { display: none; }
.route-browser.is-dormant .trip-item { display: none; }
.library-card { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--white); }
.library-card a { text-decoration: none; display: block; }
.library-media img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.library-copy { padding: 14px 16px 16px; }
.route-label { margin: 0 0 4px; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--rust-deep); }
.library-copy h3, .featured-route-copy h3 { font-family: "Domine", serif; margin: 0 0 6px; font-size: 1.15rem; color: var(--ink); }
.library-dek, .route-dek { margin: 0 0 10px; font-size: .9rem; color: var(--muted); }
.library-meta { display: flex; justify-content: space-between; align-items: center; font-size: .85rem; font-weight: 700; color: var(--rust-deep); }
.featured-route { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 0; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--white); margin-bottom: 18px; }
.featured-route-media img { width: 100%; height: 100%; object-fit: cover; }
.featured-route-copy { padding: 24px; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; }
.route-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.route-tag { font-size: .75rem; font-weight: 700; background: rgba(180, 85, 45, .12); color: var(--rust-deep); padding: 4px 12px; border-radius: 999px; }
.route-link { color: var(--rust-deep); font-weight: 800; text-decoration: none; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 22px; }
.page-btn { min-height: 52px; padding: 10px 26px; border-radius: 999px; border: 1px solid var(--rust); background: none; color: var(--rust-deep); font-weight: 800; cursor: pointer; }
.page-info { font-weight: 700; color: var(--muted); }
.browser-empty { display: none; text-align: center; padding: 30px; }
.browser-empty.show { display: block; }

/* ---------- Footer ---------- */
footer { background: var(--night); color: #e9dcc4; margin-top: 20px; }
.footer-inner { max-width: var(--max); margin: 0 auto; padding: 56px clamp(16px, 4vw, 24px) 30px; }
.footer-brand { display: grid; gap: 14px; margin-bottom: 30px; }
.footer-brand .brand-logo { width: 92px; height: 92px; border-radius: 50%; }
.footer-brand p { margin: 0; max-width: 56ch; }
.footer-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.follow-button { display: inline-block; background: var(--gold); color: #241108; font-weight: 800; padding: 12px 22px; border-radius: 999px; text-decoration: none; }
.follow-button.secondary { background: transparent; color: var(--gold-soft); border: 1px solid var(--gold); }
.footer-nav { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 26px; }
.footer-nav a { color: #e9dcc4; font-size: .88rem; text-decoration: none; }
.footer-nav a:hover, .footer-nav a[aria-current="page"] { color: var(--gold); }
.email-line { display: grid; gap: 4px; margin-bottom: 26px; }
.email-line b { color: #fffdf7; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: .85rem; }
.to-top { color: var(--gold); text-decoration: none; font-weight: 700; }

/* ---------- Image viewer ---------- */
.image-viewer { position: fixed; inset: 0; z-index: 100; background: rgba(10, 15, 13, .92); display: grid; place-items: center; }
.image-viewer[hidden] { display: none; }
.image-viewer-bar { position: absolute; top: 0; right: 0; padding: 16px; }
.image-viewer-close { background: var(--gold); color: #241108; border: 0; border-radius: 50%; width: 48px; height: 48px; font-size: 1.5rem; cursor: pointer; }
.image-viewer-stage img { max-width: 92vw; max-height: 88vh; object-fit: contain; }
.image-viewer-stage img.is-zoomed { max-width: none; width: 150%; }
body.viewer-open { overflow: hidden; }

/* ---------- Comparison table (GEO) ---------- */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 18px -4px; padding: 0 4px; }
.booking-table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: .92rem; background: var(--paper-2); border-radius: 14px; overflow: hidden; }
.booking-table caption { text-align: left; font-weight: 800; padding: 10px 0; color: var(--rust-deep); }
.booking-table th, .booking-table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.booking-table th { background: var(--bark); color: #fff8e9; font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; }
.booking-table tr:last-child td { border-bottom: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; }
  .hero-art { min-height: 420px; }
  .featured-route { grid-template-columns: 1fr; }
  .about-cta-inner, .instagram-cta-inner { grid-template-columns: 1fr; }
  .share-menu { right: auto; left: 0; width: min(300px, calc(100vw - 36px)); }
}
@media (max-width: 520px) {
  .route-map { max-width: 100%; }
  .at-a-glance dl > div { grid-template-columns: 1fr; gap: 2px; }
  .stat-band { grid-template-columns: 1fr 1fr; }
  .stat-band > div { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .18); }
  .prompt-arrow { font-size: 3rem; }
  .share-control, .share-trip-button { max-width: 100%; }
  .share-copy-fallback { align-items: stretch; flex-direction: column; gap: 6px; }
}
/* ===== end Badlands striation graphic identity ===== */

/* header-compact-390 (2026-10-05): prevent header overflow at 390px — hide
   wordmark-adjacent Home link (logo already links home), tighten gaps. */
@media (max-width: 520px){
  .header-inner{gap:12px}
  .brand-wordmark{font-size:.9rem}
  .site-nav{gap:10px}
  .site-nav>a{display:none}
}