/* Visit / Field Guide. A long reference page, so: quick facts up top, a sticky jump bar,
   then sections built from the shared card/section styles in site.css. */

.visit-hero { position: relative; min-height: 52svh; display: flex; align-items: flex-end; color: #fff; background: var(--marsh-900); overflow: hidden; }
.visit-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.visit-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(20,34,25,.94) 0%, rgba(20,34,25,.7) 45%, rgba(20,34,25,.1) 85%); }
.visit-hero .wrap { position: relative; z-index: 1; width: 100%; padding-top: 5rem; padding-bottom: 2rem; }
.visit-hero .label { color: var(--marsh-300); }
.visit-hero h1 { margin: .4rem 0 .75rem; font-size: clamp(3rem, 13vw, 5.5rem); font-weight: 800; letter-spacing: -0.04em; line-height: .95; }
.visit-hero h1 em { font-weight: 300; }
.visit-hero p { max-width: 38rem; margin: 0; font-size: 1.125rem; color: #f3f1ea; }

/* Quick facts */
.facts { background: var(--marsh-900); color: var(--sand-50); padding: 1.25rem 0 1.5rem; }
.facts ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.14); border-radius: var(--radius); overflow: hidden; }
@media (min-width: 900px) { .facts ul { grid-template-columns: repeat(6, 1fr); } }
.facts li { background: var(--marsh-900); padding: .85rem .9rem; display: flex; flex-direction: column; gap: .15rem; }
.facts .material-symbols-outlined { color: var(--marsh-300); }
.facts strong { font-size: 1.0625rem; }
.facts span:last-child { font-size: .875rem; color: #c9d3c2; line-height: 1.35; }

/* Sticky jump bar */
.jump { position: sticky; top: 3.75rem; z-index: 40; background: rgba(245,239,226,.96); backdrop-filter: blur(10px); border-bottom: 1px solid var(--rule); }
.jump ul { list-style: none; margin: 0 auto; padding: .6rem var(--gutter); display: flex; gap: .5rem; overflow-x: auto; max-width: var(--wrap); scrollbar-width: none; }
.jump ul::-webkit-scrollbar { display: none; }
.jump a { display: block; white-space: nowrap; padding: .4rem .8rem; border-radius: 999px; border: 1px solid var(--rule); background: #fff; color: var(--marsh-900); text-decoration: none; font-weight: 600; font-size: .9375rem; }
.jump a:hover { border-color: var(--marsh-500); }
.visit-section { scroll-margin-top: 7.5rem; }

/* Launch points */
.launch-grid { display: grid; gap: 1rem; }
@media (min-width: 768px) { .launch-grid { grid-template-columns: 1fr 1fr; } }
.launch-card { background: #fff; border: 1px solid var(--rule); border-radius: var(--radius); padding: 1.15rem 1.25rem; }
.launch-card h3 { margin: 0 0 .25rem; font-size: 1.25rem; font-weight: 800; color: var(--marsh-950); display: flex; align-items: center; gap: .5rem; }
.launch-card h3 .material-symbols-outlined { color: var(--marsh-500); }
.launch-card .meta { margin: 0 0 .6rem; font-family: var(--font-label); font-size: .8125rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.launch-card p { margin: 0 0 .5rem; color: var(--ink-mid); }
.launch-card .warn-line { color: var(--bad); font-weight: 600; }
.map-figure { margin: 1.5rem 0 0; }
.map-figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); border: 1px solid var(--rule); }
.map-figure figcaption { margin-top: .5rem; font-size: .875rem; color: var(--ink-soft); }

/* Two-column text blocks */
.cols { display: grid; gap: 1.5rem; }
@media (min-width: 900px) { .cols { grid-template-columns: 1fr 1fr; gap: 2.5rem; } }
.prose p { margin: 0 0 1rem; color: var(--ink-mid); }
.prose p strong { color: var(--ink); }
.prose figure { margin: 0; }
.prose figure img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--radius); }
.prose figcaption { margin-top: .5rem; font-size: .875rem; color: var(--ink-soft); }

.facts-list { list-style: none; margin: 0; padding: 0; }
.facts-list li { padding: .85rem 0; border-bottom: 1px solid var(--rule); display: grid; gap: .2rem; }
.facts-list li:first-child { padding-top: 0; }
.facts-list strong { color: var(--marsh-950); font-size: 1.0625rem; }
.facts-list span { color: var(--ink-mid); }

.stop { background: var(--call-nogo-bg); border-left: 5px solid var(--call-nogo); border-radius: var(--radius); padding: 1rem 1.15rem; margin: 1.5rem 0 0; }
.stop strong { display: block; color: #7a1d10; font-size: 1.125rem; margin-bottom: .25rem; }
.stop p { margin: 0; color: var(--ink); }

/* Rule lists with a source line */
.rules { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.rules li { display: flex; gap: .65rem; align-items: flex-start; line-height: 1.5; }
.rules .material-symbols-outlined { color: var(--marsh-500); flex-shrink: 0; margin-top: .1rem; }
.rules strong { color: var(--ink); }
.source-line { margin: 1.25rem 0 0; font-size: .9375rem; color: var(--ink-soft); }

/* Packing checklist (same look as the planner's) */
.pack-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
@media (min-width: 768px) { .pack-grid { grid-template-columns: 1fr 1fr; gap: .55rem 2rem; } }
.pack-grid label { display: flex; gap: .7rem; align-items: flex-start; cursor: pointer; line-height: 1.45; }
.pack-grid input { width: 1.2rem; height: 1.2rem; margin-top: .2rem; accent-color: var(--marsh-700); flex-shrink: 0; }
.pack-grid input:checked + span { text-decoration: line-through; color: var(--ink-soft); }
.pack-sub { margin: 1.5rem 0 .75rem; font-size: 1.125rem; font-weight: 800; color: var(--marsh-950); }

/* Safety block (dark) */
.safety { background: var(--marsh-950); color: var(--sand-50); }
.safety .section-head .label { color: var(--marsh-300); }
.safety .section-head h2 { color: #fff; }
.safety .section-head p { color: #dfe5d8; }
.emergency { display: grid; gap: 1px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.14); border-radius: var(--radius); overflow: hidden; margin-bottom: 1.5rem; }
@media (min-width: 768px) { .emergency { grid-template-columns: repeat(3, 1fr); } }
.emergency div { background: var(--marsh-950); padding: 1.1rem; }
.emergency .label { color: var(--marsh-300); font-size: .75rem; }
.emergency .num { display: block; margin: .3rem 0; font-size: 2rem; font-weight: 800; color: #fff; }
.emergency p { margin: 0; color: #dfe5d8; font-size: .9375rem; line-height: 1.5; }
.dont-go { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
@media (min-width: 768px) { .dont-go { grid-template-columns: 1fr 1fr; gap: .55rem 2rem; } }
.dont-go li { display: flex; gap: .6rem; color: #e3e8dc; line-height: 1.5; }
.dont-go li::before { content: "—"; color: #f3a08f; flex-shrink: 0; }
.safety .more-link { display: inline-block; margin-top: 1.25rem; color: #eef2e8; font-weight: 600; }
.safety h3 { margin: 0 0 .75rem; font-size: 1.25rem; color: #fff; }

/* FAQ */
.faq details { background: #fff; border: 1px solid var(--rule); border-radius: var(--radius); margin-bottom: .6rem; }
.faq summary { cursor: pointer; padding: 1rem 1.15rem; font-weight: 700; font-size: 1.0625rem; color: var(--marsh-950); list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--marsh-500); }
.faq details[open] summary::after { content: "–"; }
.faq details p { margin: 0; padding: 0 1.15rem 1.1rem; color: var(--ink-mid); }

.visit-callout { margin-top: 1rem; padding: 1rem 1.15rem; background: var(--sand-50); border: 1px solid var(--rule); border-left: 4px solid var(--marsh-700); border-radius: var(--radius); }
.visit-callout p { margin: 0; }
.pack-sub-first { margin-top: 0; }
.section-head-tight { margin-bottom: 1rem; }
.emergency .num-text { font-size: 1.25rem; }

.sources-band { padding: 2rem 0; }
.sources-band .label { color: var(--ink-soft); }
.visit-sources .independent { margin-top: 1rem; }
.visit-sources { font-size: .9375rem; color: var(--ink-mid); }
.visit-sources ul { margin: .5rem 0 0; padding-left: 1.1rem; }
.visit-sources li { margin-bottom: .35rem; }
