/* ── TOKENS (identical to homepage) ─────────────────────── */
:root {
	--ink: #0d1a0d;
	--earth: #1a3320;
	--bark: #2b5235;
	--sienna: #3d7a52;
	--amber: #2e6b42;
	--gold: #5a9e72;
	--sand: #a8c8b0;
	--dust: #eaf2ec;
	--cream: #f5f8f5;
	--white: #ffffff;
	--border: #c4d9c8;
	--muted: #5e7a66;
	--font-d: 'Cormorant Garamond', Georgia, serif;
	--font-b: 'DM Sans', system-ui, sans-serif;
	--nav-h: 68px;
	--max-w: 1200px;
	/* map colours */
	--map-bg: #0e1e10;
	--map-land: #192e1b;
	--map-pan: #c8d4c0;
	--map-pan-fill: rgba(200, 212, 192, .12);
	--map-road: rgba(90, 158, 114, .45);
	--map-road-2: rgba(90, 158, 114, .22);
	--camp-col: #2e6b42;
	--hole-col: #e8c830;
	--gate-col: #5a9e72;
	--floodlit-col: #f0a020;
}

*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	scroll-behavior: smooth;
}

body {
	font-family: var(--font-b);
	background: var(--cream);
	color: var(--earth);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

img {
	display: block;
	max-width: 100%;
}

a {
	color: inherit;
	text-decoration: none;
}

.grid-cols-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.grid-cols-3 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 10px;
}

/* ── NAV ──────────────────────────────────────────────────── */
nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 200;
	height: var(--nav-h);
	background: rgba(13, 26, 13, .96);
	backdrop-filter: blur(12px);
	border-bottom: 1px solid rgba(90, 158, 114, .2);
	display: flex;
	align-items: center;
	padding: 0 2rem;
	gap: 1.5rem;
}

.nav-logo {
	font-family: var(--font-d);
	color: var(--sand);
	font-size: 1.15rem;
	font-weight: 600;
	letter-spacing: .03em;
	white-space: nowrap;
	flex-shrink: 0;
}

.nav-logo em {
	color: var(--gold);
	font-style: italic;
}

.nav-links {
	display: flex;
	align-items: center;
	gap: .05rem;
	flex: 1;
	overflow: hidden;
}

.nav-links a {
	color: rgba(255, 255, 255, .62);
	font-size: .71rem;
	font-weight: 400;
	letter-spacing: .07em;
	text-transform: uppercase;
	padding: .45rem .6rem;
	white-space: nowrap;
	transition: color .2s, background .2s;
	border-radius: 2px;
}

.nav-links a:hover,
.nav-links a.active {
	color: var(--sand);
	background: rgba(255, 255, 255, .06);
}

.nav-actions {
	display: flex;
	gap: .6rem;
	flex-shrink: 0;
}

/* ── Tables ────────────────────────────────────────────── */
.pricing-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.pricing-card-header {
	background: var(--earth);
	padding: 1.2rem 1.8rem;
}

.pricing-card-header h3 {
	font-family: 'Playfair Display', serif;
	font-size: 1rem;
	color: var(--white);
	font-weight: 400;
}

.pricing-card-header span {
	font-size: 0.68rem;
	color: rgba(255, 255, 255, 0.55);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.pricing-table {
	width: 100%;
	border-collapse: collapse;
}

.pricing-table th {
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--tan);
	padding: 0.8rem 1.2rem;
	text-align: left;
	background: var(--sand);
	border-bottom: 1px solid var(--border);
}

.pricing-table td {
	font-size: 0.82rem;
	padding: 0.75rem 1.2rem;
	border-bottom: 1px solid var(--border);
	color: var(--earth);
}

.pricing-table tr:last-child td {
	border-bottom: none;
}

.pricing-table tr:hover td {
	background: var(--ivory);
}

.pricing-table td:first-child {
	color: var(--bark);
}

.price-val {
	font-weight: 500;
	color: var(--earth);
}

/* ── BUTTONS ────────────────────────────────────────────── */
.btn {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .5rem 1.2rem;
	border-radius: 2px;
	font-family: var(--font-b);
	font-size: .72rem;
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
	border: 1px solid transparent;
	transition: all .2s;
	white-space: nowrap;
}

.btn-amber {
	background: var(--amber);
	color: #fff;
	border-color: var(--amber);
}

.btn-amber:hover {
	background: #1f4f30;
	border-color: #1f4f30;
}

.btn-ghost {
	background: transparent;
	color: rgba(255, 255, 255, .75);
	border-color: rgba(255, 255, 255, .3);
}

.btn-ghost:hover {
	color: var(--sand);
	border-color: var(--sand);
}

.btn-outline {
	background: transparent;
	color: var(--earth);
	border-color: var(--sienna);
}

.btn-outline:hover {
	background: var(--earth);
	color: #fff;
}

.btn-white {
	background: #fff;
	color: #1a3320;
	border-color: #fff;
}

.btn-white:hover {
	background: var(--dust);
}

.btn-lg {
	padding: .8rem 2rem;
	font-size: .8rem;
}

.hamburger {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	flex-direction: column;
	gap: 5px;
	padding: .5rem;
	margin-left: auto;
}

.hamburger span {
	display: block;
	width: 22px;
	height: 1.5px;
	background: rgba(255, 255, 255, .7);
}

/* ── HERO (lodge variant — 70vh with gallery strip) ──────── */
.lhero {
	position: relative;
	height: 75vh;
	min-height: 560px;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
}

.lhero-bg {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
}

.lhero-bg::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(13, 26, 13, .1) 0%, rgba(13, 26, 13, .04) 40%, rgba(13, 26, 13, .6) 72%, rgba(13, 26, 13, .92) 100%);
}

.lhero-content {
	position: relative;
	z-index: 2;
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 0 2rem 3.5rem;
	width: 100%;
}

.lhero-breadcrumb {
	display: flex;
	align-items: center;
	gap: .5rem;
	margin-bottom: 1.5rem;
	font-size: .68rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .45);
}

.lhero-breadcrumb a {
	color: rgba(255, 255, 255, .45);
	transition: color .2s;
}

.lhero-breadcrumb a:hover {
	color: var(--sand);
}

.lhero-breadcrumb span {
	color: rgba(255, 255, 255, .2);
}

.lhero-eyebrow {
	font-size: .67rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: .75rem;
	display: flex;
	align-items: center;
	gap: .6rem;
}

.lhero-eyebrow::before {
	content: '';
	display: block;
	width: 28px;
	height: 1px;
	background: var(--gold);
}

.lhero-title {
	font-family: var(--font-d);
	font-size: clamp(2.4rem, 6vw, 4.2rem);
	font-weight: 300;
	color: var(--white);
	line-height: 1.08;
	letter-spacing: -.01em;
	margin-bottom: .6rem;
}

.lhero-title em {
	font-style: italic;
	color: var(--sand);
}

.lhero-sub {
	font-size: .95rem;
	color: rgba(255, 255, 255, .65);
	max-width: 520px;
	line-height: 1.7;
	margin-bottom: 2rem;
}

.lhero-meta {
	display: flex;
	align-items: center;
	gap: 2rem;
	flex-wrap: wrap;
}

.lhero-meta-item {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .75rem;
	color: rgba(255, 255, 255, .55);
}

.lhero-meta-item svg {
	width: 14px;
	height: 14px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
}

/* Gallery strip below hero */
.gallery-strip {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	height: 160px;
	gap: 2px;
	background: var(--ink);
}

.gthumb {
	overflow: hidden;
	cursor: pointer;
	position: relative;
}

.gthumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s, opacity .3s;
}

.gthumb:hover img {
	transform: scale(1.07);
	opacity: .85;
}

.gthumb-more {
	position: absolute;
	inset: 0;
	background: rgba(13, 26, 13, .6);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-d);
	font-size: 1rem;
	color: #fff;
	letter-spacing: .05em;
}



/* ── PAGE LAYOUT: sidebar + content ─────────────────────── */
.page-wrap {
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 3rem 2rem;
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: 3rem;
	align-items: start;
}

/* STICKY BOOKING SIDEBAR */
.sidebar {
	position: sticky;
	top: calc(var(--nav-h) + 1.5rem);
}

.booking-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 2rem;
}

.bc-title {
	font-family: var(--font-d);
	font-size: 1.2rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .3rem;
}

.bc-sub {
	font-size: .75rem;
	color: var(--muted);
	margin-bottom: 1.5rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--border);
}

.bc-label {
	font-size: .62rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .4rem;
}

.bc-value {
	font-family: var(--font-d);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: 1.25rem;
}

.bc-value span {
	font-size: .8rem;
	font-weight: 400;
	font-family: var(--font-b);
	color: var(--muted);
}

.bc-features {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	margin-bottom: 1.5rem;
	padding: 1.25rem;
	background: var(--dust);
}

.bc-feat {
	display: flex;
	align-items: center;
	gap: .6rem;
	font-size: .78rem;
	color: var(--earth);
}

.bc-feat svg {
	width: 14px;
	height: 14px;
	stroke: var(--amber);
	fill: none;
	stroke-width: 2;
	flex-shrink: 0;
}

.bc-actions {
	display: flex;
	flex-direction: column;
	gap: .6rem;
}

.bc-actions .btn {
	justify-content: center;
	width: 100%;
}

.bc-note {
	font-size: .68rem;
	color: var(--muted);
	text-align: center;
	margin-top: .75rem;
	line-height: 1.5;
}

/* Contact aside */
.contact-card {
	background: var(--earth);
	padding: 1.5rem;
	margin-top: 1rem;
}

.cc-title {
	font-size: .62rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--sand);
	margin-bottom: 1rem;
	opacity: .7;
}

.cc-items {
	display: flex;
	flex-direction: column;
	gap: .6rem;
}

.cc-item {
	display: flex;
	align-items: center;
	gap: .6rem;
	font-size: .78rem;
	color: rgba(255, 255, 255, .65);
}

.cc-item svg {
	width: 14px;
	height: 14px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
	flex-shrink: 0;
}

.cc-item a:hover {
	color: var(--sand);
}

/* Other camps aside */
.camps-card {
	border: 1px solid var(--border);
	margin-top: 1rem;
}

.camps-card-title {
	font-size: .62rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
	padding: .9rem 1.25rem;
	border-bottom: 1px solid var(--border);
}

.camp-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .75rem 1.25rem;
	border-bottom: 1px solid var(--border);
	font-size: .8rem;
	color: var(--earth);
	transition: background .2s, color .2s;
}

.camp-link:last-child {
	border-bottom: none;
}

.camp-link:hover {
	background: var(--dust);
	color: var(--amber);
}

.camp-link svg {
	width: 12px;
	height: 12px;
	stroke: var(--border);
	fill: none;
	stroke-width: 2;
	transition: stroke .2s;
}

.camp-link:hover svg {
	stroke: var(--amber);
}

/* ── CONTENT AREA ────────────────────────────────────────── */
.content {}

/* Section chrome */
.c-eyebrow {
	font-size: .64rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--amber);
	margin-bottom: .5rem;
	display: flex;
	align-items: center;
	gap: .5rem;
}

.c-eyebrow::after {
	content: '';
	flex: 0 0 24px;
	height: 1px;
	background: var(--amber);
}

.c-title {
	font-family: var(--font-d);
	font-size: clamp(1.5rem, 2.5vw, 2rem);
	font-weight: 400;
	color: var(--ink);
	line-height: 1.25;
	margin-bottom: .75rem;
}

.c-title em {
	color: var(--amber);
	font-style: italic;
}

.c-body {
	font-size: .88rem;
	color: var(--muted);
	line-height: 1.85;
	margin-bottom: 1rem;
}

/* Intro / overview */
.overview {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid var(--border);
}

.overview-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	margin-top: 2rem;
}

.overview-img {
	position: relative;
	overflow: hidden;
	min-height: 280px;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.overview-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.overview-img-caption {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: .75rem 1rem;
	background: rgba(13, 26, 13, .65);
	font-size: .68rem;
	color: rgba(255, 255, 255, .6);
	letter-spacing: .05em;
}

/* Highlight chips */
.highlights {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 1.25rem 0;
}

.hl {
	display: flex;
	align-items: center;
	gap: .4rem;
	background: var(--dust);
	border: 1px solid var(--border);
	padding: .35rem .85rem;
	font-size: .73rem;
	color: var(--earth);
	border-radius: 20px;
}

.hl svg {
	width: 12px;
	height: 12px;
	stroke: var(--amber);
	fill: none;
	stroke-width: 2;
}

/* ── ACCOMMODATION TYPES ─────────────────────────────────── */
.room-types {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid var(--border);
}

.rooms-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	margin-top: 2rem;
}

.room-card {
	border: 1px solid var(--border);
	background: var(--white);
	overflow: hidden;
	transition: box-shadow .2s;
}

.room-card:hover {
	box-shadow: 0 6px 28px rgba(26, 51, 32, .1);
}

.room-img {
	height: 180px;
	overflow: hidden;
}

.room-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}

.room-card:hover .room-img img {
	transform: scale(1.04);
}

.room-body {
	padding: 1.25rem;
}

.room-type-badge {
	display: inline-block;
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--amber);
	border: 1px solid rgba(46, 107, 66, .3);
	padding: .15rem .55rem;
	margin-bottom: .6rem;
}

.room-name {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .4rem;
}

.room-desc {
	font-size: .78rem;
	color: var(--muted);
	line-height: 1.7;
	margin-bottom: 1rem;
}

.room-specs {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-bottom: 1rem;
}

.room-spec {
	font-size: .68rem;
	color: var(--muted);
	display: flex;
	align-items: center;
	gap: .3rem;
}

.room-spec svg {
	width: 11px;
	height: 11px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 2;
}

.room-price-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: .75rem;
	border-top: 1px solid var(--border);
}

.room-from {
	font-size: .65rem;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--muted);
}

.room-price {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--earth);
}

/* ── WATERHOLE SECTION ───────────────────────────────────── */
.waterhole-sec {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid var(--border);
}

.waterhole-feature {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin-top: 2rem;
	align-items: center;
}

.wf-img {
	position: relative;
	overflow: hidden;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	height: 100%;
	min-height: 250px;
}



.wf-img img {
	width: 100%;
	height: 320px;
	object-fit: cover;
}

.wf-badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	background: rgba(13, 26, 13, .8);
	border: 1px solid rgba(90, 158, 114, .3);
	padding: .5rem 1rem;
	font-size: .65rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--sand);
}

.wf-info {}

.wf-stat-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	margin: 1.5rem 0;
}

.wf-stat {
	padding: 1rem;
	border: 1px solid var(--border);
}

.wf-stat-n {
	font-family: var(--font-d);
	font-size: 1.6rem;
	font-weight: 300;
	color: var(--amber);
	line-height: 1;
}

.wf-stat-l {
	font-size: .65rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	margin-top: .25rem;
}

.species-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin-top: 1rem;
}

.sc {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-size: .72rem;
	color: var(--earth);
	background: var(--dust);
	border: 1px solid var(--border);
	padding: .25rem .75rem;
	border-radius: 20px;
}

.sc::before {
	content: '';
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--amber);
	flex-shrink: 0;
}

/* ── SIGHTINGS TABLE ─────────────────────────────────────── */
.sightings-sec {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid var(--border);
}

.sightings-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 2px;
	background: var(--border);
	border: 1px solid var(--border);
	margin-top: 2rem;
	overflow: hidden;
}

.sg-cell {
	background: var(--white);
	padding: 1rem .75rem;
	text-align: center;
}

.sg-animal {
	font-family: var(--font-d);
	font-size: .85rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .3rem;
}

.sg-freq {
	font-size: .68rem;
	text-transform: uppercase;
	letter-spacing: .08em;
	margin-bottom: .5rem;
}

.sg-freq.daily {
	color: #2e7d32;
}

.sg-freq.common {
	color: var(--amber);
}

.sg-freq.likely {
	color: #78909c;
}

.sg-bars {
	display: flex;
	gap: 2px;
	justify-content: center;
}

.sg-bar {
	width: 6px;
	height: 18px;
	border-radius: 1px;
	background: var(--border);
}

.sg-bar.filled {
	background: var(--amber);
}

.sg-bar.filled.daily {
	background: #2e7d32;
}

.sg-time {
	font-size: .62rem;
	color: var(--muted);
	margin-top: .4rem;
}

/* ── BEST TIME ───────────────────────────────────────────── */
.seasons-sec {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid var(--border);
}

.seasons-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	margin-top: 2rem;
}

.season-card {
	padding: 1.5rem 1.25rem;
	border: 1px solid var(--border);
	background: var(--white);
}

.season-name {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .3rem;
}

.season-months {
	font-size: .65rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .75rem;
}

.season-rating {
	display: flex;
	gap: 3px;
	margin-bottom: .75rem;
}

.sr-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--border);
}

.sr-dot.on {
	background: var(--amber);
}

.season-desc {
	font-size: .75rem;
	color: var(--muted);
	line-height: 1.65;
}

.season-peak {
	display: inline-block;
	margin-top: .5rem;
	font-size: .62rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #fff;
	background: var(--amber);
	padding: .15rem .6rem;
}

/* ── ACTIVITIES ──────────────────────────────────────────── */
.activities-sec {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid var(--border);
}

.activities-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	margin-top: 2rem;
}

.act-card {
	padding: 1.5rem;
	border: 1px solid var(--border);
	display: flex;
	flex-direction: column;
	gap: .6rem;
}

.act-icon {
	width: 40px;
	height: 40px;
	background: var(--dust);
	border: 1px solid var(--border);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.act-icon svg {
	width: 18px;
	height: 18px;
	stroke: var(--amber);
	fill: none;
	stroke-width: 1.8;
}

.act-name {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--ink);
}

.act-desc {
	font-size: .75rem;
	color: var(--muted);
	line-height: 1.6;
}

.act-detail {
	font-size: .65rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--amber);
}

/* ── PRACTICAL INFO ──────────────────────────────────────── */
.practical-sec {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid var(--border);
}

.practical-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin-top: 2rem;
}

.info-block {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.info-row {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding: .7rem 0;
	border-bottom: 1px solid var(--border);
	font-size: .82rem;
	gap: 1rem;
}

.info-row:last-child {
	border-bottom: none;
}

.info-key {
	color: var(--muted);
	flex-shrink: 0;
	min-width: 120px;
}

.info-val {
	color: var(--earth);
	font-weight: 400;
	text-align: right;
}

/* ── FAQ ─────────────────────────────────────────────────── */
.faq-sec {
	margin-bottom: 3rem;
}

.faq-item {
	border-bottom: 1px solid var(--border);
}

.faq-q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 0;
	cursor: pointer;
	font-size: .88rem;
	font-weight: 500;
	color: var(--ink);
	gap: 1rem;
}

.faq-q svg {
	width: 16px;
	height: 16px;
	stroke: var(--amber);
	fill: none;
	stroke-width: 2;
	flex-shrink: 0;
	transition: transform .25s;
}

.faq-item.open .faq-q svg {
	transform: rotate(45deg);
}

.faq-a {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.8;
	padding-bottom: 1rem;
	display: none;
}

.faq-item.open .faq-a {
	display: block;
}

/* WATERHOLE INTRO GRID */
.intro-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
}

.intro-body p {
	font-size: .88rem;
	color: var(--muted);
	line-height: 1.85;
	margin-bottom: 1rem;
}

.intro-tips {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.75rem;
}

.intro-tips-title {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: 1rem;
	padding-bottom: .75rem;
	border-bottom: 1px solid var(--border);
}

.tip-row {
	display: flex;
	gap: .75rem;
	padding: .6rem 0;
	border-bottom: 1px solid var(--border);
	font-size: .82rem;
}

.tip-row:last-child {
	border-bottom: none;
}

.tip-icon {
	width: 28px;
	height: 28px;
	background: rgba(46, 107, 66, .08);
	border: 1px solid rgba(61, 122, 82, .2);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tip-icon svg {
	width: 13px;
	height: 13px;
	stroke: var(--sienna);
	fill: none;
	stroke-width: 2;
}

.tip-text {
	color: var(--muted);
	line-height: 1.6;
}

.tip-text strong {
	color: var(--earth);
}

/* FLOODLIT SECTION */
.floodlit-banner {
	background: var(--ink);
	padding: 4rem 2rem;
}

.floodlit-inner {
	max-width: var(--max-w);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: center;
}

.floodlit-body .seyebrow {
	color: var(--gold);
}

.floodlit-body .seyebrow::after {
	background: var(--gold);
}

.floodlit-body .stitle {
	color: var(--white);
}

.floodlit-body .stitle em {
	color: var(--sand);
}

.floodlit-body .sdesc {
	color: rgba(255, 255, 255, .5);
	max-width: none;
}

.floodlit-cards {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.fl-card {
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .1);
	padding: 1.25rem 1.5rem;
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
	transition: background .2s;
}

.fl-card:hover {
	background: rgba(46, 107, 66, .15);
}

.fl-badge {
	flex-shrink: 0;
	padding: .3rem .8rem;
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	font-weight: 500;
}

.fl-badge.premium {
	background: var(--amber);
	color: #fff;
}

.fl-badge.good {
	background: rgba(90, 158, 114, .3);
	color: var(--sand);
}

.fl-name {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--sand);
	margin-bottom: .25rem;
}

.fl-detail {
	font-size: .78rem;
	color: rgba(255, 255, 255, .45);
	line-height: 1.6;
}

/* WATERHOLE CARDS — MAIN GRID */
.wh-main-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.wh-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .25s, transform .25s;
}

.wh-card:hover {
	box-shadow: 0 8px 32px rgba(26, 51, 32, .12);
	transform: translateY(-2px);
}

.wh-card.featured {
	grid-column: span 2;
}

.wh-img {
	position: relative;
	height: 200px;
	overflow: hidden;
	background: var(--earth);
}

.wh-card.featured .wh-img {
	height: 280px;
}

.wh-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s;
}

.wh-card:hover .wh-img img {
	transform: scale(1.04);
}

.wh-img-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wh-img-placeholder svg {
	width: 48px;
	height: 48px;
	stroke: rgba(90, 158, 114, .3);
	fill: none;
	stroke-width: 1;
}

.wh-camp-badge {
	position: absolute;
	top: .75rem;
	left: .75rem;
	background: var(--earth);
	color: var(--sand);
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .25rem .7rem;
}

.wh-type-badge {
	position: absolute;
	top: .75rem;
	right: .75rem;
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .25rem .7rem;
}

.wh-type-badge.floodlit {
	background: rgba(255, 200, 50, .15);
	color: #e8c830;
	border: 1px solid rgba(255, 200, 50, .3);
}

.wh-type-badge.natural {
	background: rgba(90, 158, 114, .15);
	color: var(--gold);
	border: 1px solid rgba(90, 158, 114, .3);
}

.wh-body {
	padding: 1.4rem;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.wh-region {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .3rem;
}

.wh-name {
	font-family: var(--font-d);
	font-size: 1.2rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .6rem;
}

.wh-card.featured .wh-name {
	font-size: 1.5rem;
}

.wh-desc {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.75;
	margin-bottom: 1rem;
	flex: 1;
}

.wh-wildlife {
	margin-bottom: 1rem;
}

.wh-wildlife-label {
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .4rem;
}

.wh-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem;
}

.wh-tag {
	font-size: .61rem;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--sienna);
	background: rgba(46, 107, 66, .07);
	border: 1px solid rgba(61, 122, 82, .18);
	padding: .2rem .55rem;
	border-radius: 20px;
}

.wh-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: .9rem;
	border-top: 1px solid var(--border);
	font-size: .76rem;
	color: var(--muted);
}

.wh-best-time {
	display: flex;
	align-items: center;
	gap: .35rem;
}

.wh-best-time svg {
	width: 12px;
	height: 12px;
	stroke: var(--amber);
	fill: none;
	stroke-width: 2;
}

.wh-gps {
	font-size: .7rem;
	font-family: monospace;
	color: var(--muted);
	opacity: .7;
}

/* ── GALLERY LIGHTBOX ── */
.gallery-section {
	margin-bottom: 5rem;
}

.gallery-tabs {
	display: flex;
	gap: 0;
	border-bottom: 2px solid var(--amber);
	margin-bottom: 2rem;
	overflow-x: auto;
}

.gallery-tab {
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 0.8rem 1.4rem;
	color: var(--tan);
	background: none;
	border: none;
	cursor: pointer;
	white-space: nowrap;
	font-family: 'Jost', sans-serif;
	border-bottom: 2px solid transparent;
	margin-bottom: -2px;
	transition: color 0.2s, border-color 0.2s;
}

.gallery-tab:hover {
	color: var(--gold);
}

.gallery-tab.active {
	color: var(--gold);
	border-bottom-color: var(--gold);
}

.gallery-panel {
	display: none;
	height: 450px;
	overflow: scroll;
}

.gallery-panel.active {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 4px;
}

.gallery-thumb {
	/* aspect-ratio: 4/2; */
	overflow: hidden;
	cursor: zoom-in;
	background: var(--gold);
	height: 150px;
}

.gallery-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}

.gallery-thumb:hover img {
	transform: scale(1.05);
}

/* Lightbox */
.lightbox {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 1000;
	background: rgba(20, 14, 10, 0.96);
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.lightbox.open {
	display: flex;
}

.lightbox-img-wrap {
	position: relative;
	max-width: 90vw;
	max-height: 82vh;
	display: flex;
	align-items: center;
}

.lightbox img {
	max-width: 90vw;
	max-height: 80vh;
	object-fit: contain;
	display: block;
}

.lightbox-close {
	position: absolute;
	top: 1.5rem;
	right: 1.5rem;
	background: none;
	border: none;
	cursor: pointer;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.8rem;
	line-height: 1;
	transition: color 0.2s;
}

.lightbox-close:hover {
	color: white;
}

.lightbox-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.12);
	border: none;
	cursor: pointer;
	color: white;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}

.lightbox-nav:hover {
	background: rgba(255, 255, 255, 0.25);
}

.lightbox-prev {
	left: -60px;
}

.lightbox-next {
	right: -60px;
}

.lightbox-counter {
	margin-top: 1rem;
	font-size: 0.72rem;
	color: rgba(255, 255, 255, 0.45);
	letter-spacing: 0.15em;
}

/* MAP LAYOUT */
.map-layout {
	display: flex;
	height: calc(100vh - var(--nav-h));
	margin-top: var(--nav-h);
}

/* FILTERS */
.filters {
	padding: .9rem 1.4rem;
	border-bottom: 1px solid rgba(90, 158, 114, .15);
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}

.filter-btn {
	font-size: .62rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: .3rem .8rem;
	border-radius: 20px;
	cursor: pointer;
	border: 1px solid rgba(255, 255, 255, .15);
	background: transparent;
	color: rgba(255, 255, 255, .45);
	transition: all .2s;
	font-family: var(--font-b);
}

.filter-btn:hover {
	color: rgba(255, 255, 255, .75);
}

.filter-btn.active {
	background: var(--camp-col);
	border-color: var(--camp-col);
	color: #fff;
}

.filter-btn.active.wh {
	background: rgba(232, 200, 48, .2);
	border-color: var(--hole-col);
	color: var(--hole-col);
}

.filter-btn.active.gate {
	background: rgba(90, 158, 114, .2);
	border-color: var(--gate-col);
	color: var(--gate-col);
}

.filter-btn.active.floodlit {
	background: rgba(240, 160, 32, .2);
	border-color: var(--floodlit-col);
	color: var(--floodlit-col);
}

/* INFO PANEL */
.info-panel {
	flex: 1;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(90, 158, 114, .3) transparent;
}

.info-panel::-webkit-scrollbar {
	width: 4px;
}

.info-panel::-webkit-scrollbar-thumb {
	background: rgba(90, 158, 114, .3);
	border-radius: 2px;
}

.info-default {
	padding: 1.5rem 1.4rem;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.info-hint {
	font-size: .78rem;
	color: rgba(255, 255, 255, .3);
	line-height: 1.6;
}

.legend {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

.legend-item {
	display: flex;
	align-items: center;
	gap: .65rem;
	font-size: .75rem;
	color: rgba(255, 255, 255, .45);
}

.legend-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	flex-shrink: 0;
}

.legend-sq {
	width: 12px;
	height: 8px;
	border-radius: 1px;
	flex-shrink: 0;
}

/* INFO CARD */
.info-card {
	padding: 0;
	animation: slideIn .2s ease;
}

@keyframes slideIn {
	from {
		opacity: 0;
		transform: translateX(-8px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.ic-head {
	padding: 1.4rem;
	border-bottom: 1px solid rgba(90, 158, 114, .15);
}

.ic-type {
	font-size: .6rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: .3rem;
}

.ic-type.camp {
	color: var(--gold);
}

.ic-type.waterhole {
	color: var(--hole-col);
}

.ic-type.gate {
	color: var(--gate-col);
}

.ic-name {
	font-family: var(--font-d);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--sand);
	margin-bottom: .2rem;
}

.ic-region {
	font-size: .7rem;
	color: rgba(255, 255, 255, .35);
}

.ic-body {
	padding: 1.2rem 1.4rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.ic-desc {
	font-size: .8rem;
	color: rgba(255, 255, 255, .5);
	line-height: 1.75;
}

.ic-facts {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .6rem 1rem;
}

.ic-fact-label {
	font-size: .6rem;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .25);
	margin-bottom: .15rem;
}

.ic-fact-val {
	font-size: .8rem;
	color: rgba(255, 255, 255, .65);
}

.ic-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem;
}

.ic-tag {
	font-size: .6rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: .2rem .55rem;
	border-radius: 20px;
	border: 1px solid rgba(90, 158, 114, .3);
	color: var(--gold);
}

.ic-hours {
	display: flex;
	flex-direction: column;
	gap: .35rem;
}

.ic-hour-row {
	display: flex;
	justify-content: space-between;
	font-size: .78rem;
	padding: .35rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.ic-hour-row:last-child {
	border-bottom: none;
}

.ic-hour-label {
	color: rgba(255, 255, 255, .35);
}

.ic-hour-val {
	color: rgba(255, 255, 255, .65);
	font-weight: 500;
}

.ic-actions {
	padding: 1rem 1.4rem;
	border-top: 1px solid rgba(90, 158, 114, .15);
}

.ic-book {
	display: block;
	text-align: center;
	background: var(--amber);
	color: #fff;
	font-size: .7rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .75rem;
	transition: background .2s;
}

.ic-book:hover {
	background: #1f4f30;
}

.ic-back {
	display: flex;
	align-items: center;
	gap: .4rem;
	font-size: .65rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .3);
	cursor: pointer;
	padding: .6rem 1.4rem;
	border-bottom: 1px solid rgba(90, 158, 114, .15);
	transition: color .2s;
}

.ic-back:hover {
	color: var(--sand);
}

.ic-back svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
}

/* DISTANCES */
.distances {
	background: rgba(255, 255, 255, .03);
	border: 1px solid rgba(90, 158, 114, .15);
	margin: 0 1.4rem;
}

.dist-title {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .3);
	padding: .6rem .8rem;
	border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.dist-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: .76rem;
	padding: .4rem .8rem;
	border-bottom: 1px solid rgba(255, 255, 255, .04);
}

.dist-row:last-child {
	border-bottom: none;
}

.dist-to {
	color: rgba(255, 255, 255, .5);
}

.dist-km {
	color: var(--gold);
	font-family: var(--font-d);
	font-size: .9rem;
}

/* MAP CONTAINER */
.map-container {
	flex: 1;
	position: relative;
	overflow: hidden;
	background: var(--map-bg);
	cursor: grab;
}

.map-container:active {
	cursor: grabbing;
}

.map-canvas {
	position: absolute;
	inset: 0;
}

.map-svg {
	width: 100%;
	height: 100%;
}

/* MAP CONTROLS */
.map-controls {
	position: absolute;
	bottom: 1.5rem;
	right: 1.5rem;
	display: flex;
	flex-direction: column;
	gap: .4rem;
	z-index: 10;
}

.map-btn {
	width: 36px;
	height: 36px;
	background: rgba(13, 26, 13, .9);
	border: 1px solid rgba(90, 158, 114, .3);
	color: rgba(255, 255, 255, .7);
	font-size: 1.1rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 2px;
	transition: all .2s;
	font-family: var(--font-b);
}

.map-btn:hover {
	background: rgba(46, 107, 66, .4);
	color: #fff;
	border-color: rgba(90, 158, 114, .6);
}

.map-credit {
	position: absolute;
	bottom: 1.5rem;
	left: 50%;
	transform: translateX(-50%);
	font-size: .6rem;
	color: rgba(255, 255, 255, .15);
	letter-spacing: .06em;
	z-index: 5;
	white-space: nowrap;
}

/* TOOLTIP */
.map-tooltip {
	position: absolute;
	pointer-events: none;
	background: rgba(13, 26, 13, .95);
	border: 1px solid rgba(90, 158, 114, .4);
	padding: .4rem .75rem;
	font-size: .72rem;
	color: var(--sand);
	white-space: nowrap;
	z-index: 50;
	border-radius: 2px;
	display: none;
	transform: translate(-50%, -130%);
}

.map-tooltip::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	border: 5px solid transparent;
	border-top-color: rgba(90, 158, 114, .4);
}

/* ── NEARBY SECTION ──────────────────────────────────────── */
.nearby-sec {
	background: var(--dust);
	padding: 3rem 2rem;
	margin-top: 3rem;
}

.nearby-inner {
	max-width: var(--max-w);
	margin: 0 auto;
}

.nearby-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-top: 2rem;
}

.nb-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
	transition: box-shadow .2s, transform .2s;
}

.nb-card:hover {
	box-shadow: 0 6px 24px rgba(26, 51, 32, .1);
	transform: translateY(-2px);
}

.nb-img {
	height: 160px;
	overflow: hidden;
}

.nb-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}

.nb-card:hover .nb-img img {
	transform: scale(1.05);
}

.nb-body {
	padding: 1.25rem;
}

.nb-type {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--amber);
	margin-bottom: .3rem;
}

.nb-name {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .3rem;
}

.nb-dist {
	font-size: .72rem;
	color: var(--muted);
}

/* ── CTA BANNER ──────────────────────────────────────────── */
.cta-banner {
	background: #1a3320;
	padding: 4rem 2rem;
	text-align: center;
}

.cta-title {
	font-family: var(--font-d);
	font-size: clamp(1.8rem, 3.5vw, 2.8rem);
	font-weight: 300;
	color: #fff;
	margin-bottom: .5rem;
}

.cta-title em {
	font-style: italic;
}

.cta-sub {
	color: rgba(168, 200, 176, .75);
	font-size: .9rem;
	margin-bottom: 2rem;
}

.cta-actions {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}

/* ── FOOTER ──────────────────────────────────────────────── */
footer {
	background: #0d1a0d;
	padding: 4rem 2rem 2rem;
	border-top: 1px solid rgba(90, 158, 114, .15);
}

.fgrid {
	max-width: var(--max-w);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.5fr repeat(4, 1fr);
	gap: 2.5rem;
	margin-bottom: 3rem;
}

.fbrand {
	font-family: var(--font-d);
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--sand);
	margin-bottom: .5rem;
}

.fbrand em {
	color: var(--gold);
	font-style: italic;
}

.ftagline {
	font-size: .78rem;
	color: rgba(255, 255, 255, .35);
	line-height: 1.6;
	margin-bottom: 1.5rem;
}

.fsocial {
	display: flex;
	gap: .75rem;
}

.fsocial a {
	width: 32px;
	height: 32px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255, 255, 255, .4);
	font-size: .68rem;
	transition: background .2s, color .2s;
}

.fsocial a:hover {
	background: var(--amber);
	color: #fff;
	border-color: var(--amber);
}

.fcol-title {
	font-size: .61rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .25);
	margin-bottom: 1rem;
	padding-bottom: .5rem;
	border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.flinks {
	display: flex;
	flex-direction: column;
	gap: .4rem;
}

.flinks a {
	font-size: .78rem;
	color: rgba(255, 255, 255, .4);
	transition: color .2s;
}

.flinks a:hover {
	color: var(--sand);
}

.fbottom {
	max-width: var(--max-w);
	margin: 0 auto;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, .06);
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
	font-size: .72rem;
	color: rgba(255, 255, 255, .25);
}

/* ── SCROLL ANIMATION ────────────────────────────────────── */
@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(18px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.lhero-breadcrumb {
	animation: fadeUp .5s ease .1s both;
}

.lhero-eyebrow {
	animation: fadeUp .5s ease .25s both;
}

.lhero-title {
	animation: fadeUp .6s ease .35s both;
}

.lhero-sub {
	animation: fadeUp .5s ease .5s both;
}

.lhero-meta {
	animation: fadeUp .5s ease .6s both;
}

/* HERO */
.hero {
	position: relative;
	height: 80vh;
	min-height: 500px;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
	margin-top: 0;
	padding-top: var(--nav-h);
}

.hero-bg {
	position: absolute;
	inset: 0;
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
}

.hero-bg::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(13, 26, 13, .12) 0%, rgba(13, 26, 13, .04) 30%, rgba(13, 26, 13, .5) 70%, rgba(13, 26, 13, .88) 100%);
}

.hero-content {
	position: relative;
	z-index: 2;
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 0 2rem 5rem;
	width: 100%;
}

.hero-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	font-size: .67rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: 1.2rem;
}

.hero-eyebrow::before {
	content: '';
	display: block;
	width: 28px;
	height: 1px;
	background: var(--gold);
}

.hero-title {
	font-family: var(--font-d);
	font-size: clamp(2.5rem, 5vw, 4rem);
	font-weight: 300;
	color: var(--white);
	line-height: 1.05;
	letter-spacing: -.01em;
	margin-bottom: .75rem;
	max-width: 760px;
}

.hero-title em {
	font-style: italic;
	font-weight: 300;
	color: var(--sand);
	display: block;
}

.hero-sub {
	font-size: 1rem;
	color: rgba(255, 255, 255, .7);
	max-width: 500px;
	line-height: 1.7;
	margin-bottom: 2.5rem;
}

.hero-actions {
	display: flex;
	gap: .75rem;
	flex-wrap: wrap;
}

.hero-stats {
	position: absolute;
	right: 2rem;
	bottom: 5rem;
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	z-index: 2;
}

.hero-stat {
	text-align: right;
	border-right: 2px solid var(--amber);
	padding-right: 1rem;
}

.hero-stat-n {
	font-family: var(--font-d);
	font-size: 1.8rem;
	font-weight: 600;
	color: var(--sand);
	line-height: 1;
}

.hero-stat-l {
	font-size: .64rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .45);
}

.page-hero {
	padding-top: var(--nav-h);
	background: var(--ink);
	overflow: hidden;
	position: relative;
	min-height: 280px;
	display: flex;
	align-items: flex-end;
}

.page-hero-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 1.00;
}

.page-hero-bg::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, transparent 70%, rgba(13, 26, 13, .92) 100%);
}

.page-hero-inner {
	position: relative;
	z-index: 2;
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 3rem 2rem 3.5rem;
	width: 100%;
}

.breadcrumb {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: .66rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .35);
	margin-bottom: 1.5rem;
}

.breadcrumb a {
	color: rgba(255, 255, 255, .4);
	transition: color .2s;
}

.breadcrumb a:hover {
	color: var(--sand);
}

.breadcrumb span {
	color: rgba(255, 255, 255, .2);
}

.eyebrow {
	font-size: .67rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: .9rem;
	display: flex;
	align-items: center;
	gap: .6rem;
}

.eyebrow::before {
	content: '';
	display: block;
	width: 28px;
	height: 1px;
	background: var(--gold);
}

.hero-desc {
	font-size: .9rem;
	color: rgba(255, 255, 255, .55);
	max-width: 620px;
	line-height: 1.75;
}

.page-hero-eyebrow {
	font-size: .67rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: .9rem;
	display: flex;
	align-items: center;
	gap: .6rem;
}

.page-hero-eyebrow::before {
	content: '';
	display: block;
	width: 28px;
	height: 1px;
	background: var(--gold);
}

.page-hero-title {
	font-family: var(--font-d);
	font-size: clamp(2.2rem, 4.5vw, 3.6rem);
	font-weight: 300;
	color: var(--white);
	line-height: 1.08;
	margin-bottom: .9rem;
}

.page-hero-title em {
	font-style: italic;
	color: var(--sand);
}

.page-hero-desc {
	font-size: .9rem;
	color: rgba(255, 255, 255, .55);
	max-width: 620px;
	line-height: 1.75;
}

/* STICKY FILTER BAR */
.filter-bar {
	background: var(--white);
	border-bottom: 1px solid var(--border);
	position: sticky;
	top: var(--nav-h);
	z-index: 100;
}

.filter-bar-inner {
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 0 2rem;
	display: flex;
	align-items: center;
	gap: 0;
	overflow-x: auto;
	scrollbar-width: none;
}

.filter-bar-inner::-webkit-scrollbar {
	display: none;
}

.filter-link {
	font-size: .68rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	padding: .85rem 1.1rem;
	white-space: nowrap;
	border-bottom: 2px solid transparent;
	transition: color .2s, border-color .2s;
	cursor: pointer;
}

.filter-link:hover,
.filter-link.active {
	color: var(--earth);
	border-bottom-color: var(--amber);
}

.filter-sep {
	width: 1px;
	height: 20px;
	background: var(--border);
	flex-shrink: 0;
	margin: 0 .5rem;
}

.filter-pill {
	font-size: .62rem;
	letter-spacing: .07em;
	text-transform: uppercase;
	padding: .3rem .85rem;
	border-radius: 20px;
	cursor: pointer;
	border: 1px solid var(--border);
	color: var(--muted);
	transition: all .2s;
	white-space: nowrap;
	margin: .6rem .25rem;
	background: transparent;
	font-family: var(--font-b);
}

.filter-pill:hover {
	border-color: var(--sienna);
	color: var(--earth);
}

.filter-pill.on {
	background: var(--earth);
	border-color: var(--earth);
	color: #fff;
}

@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translateY(22px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.hero-eyebrow {
	animation: fadeUp .6s ease .2s both;
}

.hero-title {
	animation: fadeUp .7s ease .35s both;
}

.hero-sub {
	animation: fadeUp .6s ease .5s both;
}

.hero-actions {
	animation: fadeUp .6s ease .65s both;
}

.hero-stats {
	animation: fadeUp .6s ease .8s both;
}

/* SECTION */
.section {
	padding: 5rem 2rem;
}

.si {
	max-width: var(--max-w);
	margin: 0 auto;
}

.shd {
	margin-bottom: 3rem;
}

.seyebrow {
	font-size: .65rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--amber);
	margin-bottom: .6rem;
	display: flex;
	align-items: center;
	gap: .5rem;
}

.seyebrow::after {
	content: '';
	flex: 0 0 32px;
	height: 1px;
	background: var(--amber);
}

.stitle {
	font-family: var(--font-d);
	font-size: clamp(1.8rem, 3.5vw, 2.6rem);
	font-weight: 400;
	color: var(--ink);
	line-height: 1.2;
}

.stitle em {
	color: var(--amber);
	font-style: italic;
}

.sdesc {
	color: var(--muted);
	font-size: .9rem;
	line-height: 1.8;
	margin-top: .75rem;
	max-width: 560px;
}



.body-text {
	font-size: .88rem;
	color: var(--muted);
	line-height: 1.85;
	margin-bottom: 1rem;
}

.grid-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
}

.grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.grid-4 {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

.card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.75rem;
	transition: box-shadow .2s;
}

.card:hover {
	box-shadow: 0 6px 24px rgba(13, 26, 13, .1);
}

.card-title {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.card-body {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.75;
}

.fact-table {
	width: 100%;
	border-collapse: collapse;
}

.fact-table td {
	padding: .5rem 0;
	border-bottom: 1px solid var(--border);
	font-size: .82rem;
}

.fact-table tr:last-child td {
	border-bottom: none;
}

.fact-table .fl {
	color: var(--muted);
}

.fact-table .fv {
	color: var(--earth);
	font-weight: 500;
	text-align: right;
}

.tags {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin-top: .75rem;
}

.tag {
	font-size: .6rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sienna);
	background: rgba(46, 107, 66, .07);
	border: 1px solid rgba(61, 122, 82, .18);
	padding: .2rem .55rem;
	border-radius: 20px;
}

.itin-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 2rem;
	display: flex;
	flex-direction: column;
}

.itin-num {
	font-family: var(--font-d);
	font-size: 2.5rem;
	font-weight: 300;
	color: var(--border);
	line-height: 1;
	margin-bottom: .75rem;
}

.itin-title {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.itin-desc {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.7;
	flex: 1;
}

.day-row {
	padding: .75rem 0;
	border-bottom: 1px solid var(--border);
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
}

.day-row:last-child {
	border-bottom: none;
}

.day-num {
	font-family: var(--font-d);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--amber);
	line-height: 1;
	flex-shrink: 0;
	width: 40px;
}

.day-body {
	font-size: .83rem;
	color: var(--muted);
	line-height: 1.7;
}

.day-body strong {
	color: var(--earth);
}

.species-hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: start;
}

.species-img {
	height: 380px;
	overflow: hidden;
	position: relative;
}

.species-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.species-facts {
	background: var(--white);
	border: 1px solid var(--border);
}

.species-facts-head {
	background: var(--earth);
	padding: 1rem 1.25rem;
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--sand);
}

.species-facts table {
	width: 100%;
	border-collapse: collapse;
}

.species-facts td {
	padding: .6rem 1.1rem;
	font-size: .82rem;
	border-bottom: 1px solid var(--border);
}

.species-facts tr:last-child td {
	border-bottom: none;
}

.species-facts .fk {
	color: var(--muted);
}

.species-facts .fv {
	color: var(--earth);
	font-weight: 500;
}

.wh-best {
	background: var(--earth);
	padding: 1.5rem 2rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	flex-wrap: wrap;
	margin-bottom: 2rem;
}

.wh-best-label {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(168, 200, 176, .5);
}

.wh-best-val {
	font-family: var(--font-d);
	font-size: 1.1rem;
	color: var(--sand);
}

/* NWR CAMP GRID — FEATURED */
.nwr-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2px;
	background: var(--border);
}

.nwr-card {
	background: var(--white);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	transition: transform .25s, box-shadow .25s;
}

.nwr-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 40px rgba(13, 26, 13, .15);
}

.nwr-card.span2 {
	grid-column: span 2;
}

.nwr-img {
	position: relative;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.nwr-img img {
	transition: transform .55s;
}

.nwr-card:hover .nwr-img img {
	transform: scale(1.05);
}

.nwr-img-h {
	height: 240px;
}

.nwr-card.span2 .nwr-img-h {
	height: 320px;
}

.nwr-badge {
	position: absolute;
	top: .75rem;
	left: .75rem;
	font-size: .58rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .25rem .65rem;
}

.badge-inside {
	background: var(--amber);
	color: #fff;
}

.badge-budget {
	background: rgba(80, 140, 100, .85);
	color: #fff;
}

.badge-midrange {
	background: rgba(46, 80, 140, .8);
	color: #fff;
}

.badge-luxury {
	background: rgba(120, 60, 20, .85);
	color: #fff;
}

.badge-ultra {
	background: rgba(80, 20, 80, .8);
	color: #fff;
}

.badge-floodlit {
	position: absolute;
	top: .75rem;
	right: .75rem;
	background: rgba(240, 160, 32, .9);
	color: #fff;
	font-size: .58rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: .22rem .6rem;
	display: flex;
	align-items: center;
	gap: .3rem;
}

.nwr-body {
	padding: 1.4rem 1.5rem;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.nwr-loc {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .3rem;
}

.nwr-name {
	font-family: var(--font-d);
	font-size: 1.2rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.nwr-card.span2 .nwr-name {
	font-size: 1.45rem;
}

.nwr-desc {
	font-size: .8rem;
	color: var(--muted);
	line-height: 1.75;
	margin-bottom: 1rem;
	flex: 1;
}

.nwr-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem;
	margin-bottom: 1rem;
}

.nwr-tag {
	font-size: .6rem;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--sienna);
	background: rgba(46, 107, 66, .07);
	border: 1px solid rgba(61, 122, 82, .18);
	padding: .18rem .5rem;
	border-radius: 20px;
}

.nwr-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: .85rem;
	border-top: 1px solid var(--border);
}

.nwr-price {
	font-size: .75rem;
	color: var(--muted);
}

.nwr-price strong {
	display: block;
	font-family: var(--font-d);
	font-size: .95rem;
	color: var(--earth);
}

.nwr-actions {
	display: flex;
	gap: .4rem;
}

/* LODGE GRID */
.lodge-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.lodge-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .2s, transform .2s;
}

.lodge-card:hover {
	box-shadow: 0 6px 28px rgba(13, 26, 13, .1);
	transform: translateY(-2px);
}

.lodge-img {
	height: 200px;
	overflow: hidden;
	position: relative;
	background: var(--earth);
}

.lodge-img img {
	transition: transform .5s;
}

.lodge-card:hover .lodge-img img {
	transform: scale(1.05);
}

.lodge-img-ph {
	width: 100%;
	height: 100%;
	background: rgba(43, 82, 53, .25);
	display: flex;
	align-items: center;
	justify-content: center;
}

.lodge-img-ph svg {
	width: 36px;
	height: 36px;
	stroke: rgba(90, 158, 114, .3);
	fill: none;
	stroke-width: 1;
}

.lodge-badge {
	position: absolute;
	top: .6rem;
	left: .6rem;
	font-size: .57rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: .2rem .6rem;
}

.lodge-body {
	padding: 1.2rem 1.3rem;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.lodge-loc {
	font-size: .6rem;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .25rem;
}

.lodge-name {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .45rem;
}

.lodge-desc {
	font-size: .79rem;
	color: var(--muted);
	line-height: 1.7;
	margin-bottom: .85rem;
	flex: 1;
}

.lodge-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .28rem;
	margin-bottom: .85rem;
}

.lodge-tag {
	font-size: .58rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--sienna);
	background: rgba(46, 107, 66, .06);
	border: 1px solid rgba(61, 122, 82, .16);
	padding: .15rem .48rem;
	border-radius: 20px;
}

.lodge-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: .75rem;
	border-top: 1px solid var(--border);
}

.lodge-price {
	font-size: .72rem;
	color: var(--muted);
}

.lodge-price strong {
	display: block;
	font-family: var(--font-d);
	font-size: .9rem;
	color: var(--earth);
}

.lodge-actions {
	display: flex;
	gap: .35rem;
}

/* JUMP NAV */
.jump-nav {
	background: var(--white);
	border-bottom: 1px solid var(--border);
	position: sticky;
	top: var(--nav-h);
	z-index: 100;
}

.jump-nav-inner {
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 0 2rem;
	display: flex;
	gap: 0;
	overflow-x: auto;
	scrollbar-width: none;
}

.jump-nav-inner::-webkit-scrollbar {
	display: none;
}

.jump-nav-inner a {
	font-size: .68rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	padding: .85rem 1.1rem;
	white-space: nowrap;
	border-bottom: 2px solid transparent;
	transition: color .2s, border-color .2s;
}

.jump-nav-inner a:hover {
	color: var(--earth);
	border-bottom-color: var(--amber);
}

/* SEASON GRID */
.season-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

.scard {
	border: 1px solid var(--border);
	background: var(--white);
	overflow: hidden;
	transition: box-shadow .2s;
}

.scard:hover {
	box-shadow: 0 6px 24px rgba(46, 107, 66, .1);
}

.scard-head {
	padding: 1.5rem 1.5rem 1rem;
	border-bottom: 1px solid var(--border);
}

.scard-season {
	font-size: .62rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .3rem;
}

.scard-months {
	font-family: var(--font-d);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.scard-body {
	padding: 1.25rem 1.5rem;
}

.scard-body p {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.7;
	margin-bottom: .75rem;
}

.scard-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
}

.stag {
	font-size: .61rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	border: 1px solid var(--border);
	padding: .2rem .6rem;
	border-radius: 20px;
	color: var(--sienna);
}

.stag.good {
	background: rgba(46, 107, 66, .07);
	border-color: rgba(61, 122, 82, .25);
	color: var(--sienna);
}

.stag.best {
	background: rgba(46, 107, 66, .14);
	border-color: rgba(46, 107, 66, .4);
	color: var(--bark);
}

.stag.fair {
	background: rgba(200, 180, 120, .1);
	border-color: rgba(180, 160, 100, .3);
	color: #7a6520;
}

.month-bar {
	margin-top: 3.5rem;
}

.month-bar-label {
	font-size: .65rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: 1rem;
}

.month-row {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 3px;
}

.month-cell {
	padding: .5rem .2rem;
	text-align: center;
	font-size: .62rem;
	color: var(--muted);
}

.month-cell-name {
	font-size: .58rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .3rem;
}

.month-fill {
	height: 28px;
	border-radius: 2px;
}

.fill-peak {
	background: var(--bark);
}

.fill-good {
	background: rgba(90, 158, 114, .5);
}

.fill-fair {
	background: rgba(168, 200, 176, .4);
}

/* GATES TABLE */
.gates-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
}

.gate-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.gate-head {
	background: var(--earth);
	padding: 1.25rem 1.5rem;
}

.gate-name {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--sand);
}

.gate-region {
	font-size: .65rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(168, 200, 176, .55);
	margin-top: .2rem;
}

.gate-body {
	padding: 1.25rem 1.5rem;
}

.gate-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: .45rem 0;
	border-bottom: 1px solid var(--border);
	font-size: .82rem;
}

.gate-row:last-child {
	border-bottom: none;
}

.gate-row-label {
	color: var(--muted);
}

.gate-row-val {
	color: var(--earth);
	font-weight: 500;
}

/* FEES TABLE */
.fees-wrap {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.fees-table {
	width: 100%;
	border-collapse: collapse;
}

.fees-table th {
	background: var(--earth);
	color: rgba(168, 200, 176, .85);
	font-size: .65rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .85rem 1.25rem;
	text-align: left;
	font-weight: 400;
}

.fees-table td {
	padding: .8rem 1.25rem;
	font-size: .85rem;
	color: var(--earth);
	border-bottom: 1px solid var(--border);
}

.fees-table tr:last-child td {
	border-bottom: none;
}

.fees-table tr:nth-child(even) td {
	background: rgba(234, 242, 236, .4);
}

.fees-table .fee-val {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--ink);
}

.fees-note {
	margin-top: 1rem;
	font-size: .78rem;
	color: var(--muted);
	line-height: 1.7;
}

/* DISTANCES */
.dist-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}

.dist-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.5rem;
}

.dist-from {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .2rem;
}

.dist-to {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .75rem;
}

.dist-rows {
	display: flex;
	flex-direction: column;
	gap: .35rem;
}

.dist-row {
	display: flex;
	justify-content: space-between;
	font-size: .8rem;
	color: var(--muted);
	padding: .3rem 0;
	border-bottom: 1px solid var(--border);
}

.dist-row:last-child {
	border-bottom: none;
}

.dist-row strong {
	color: var(--earth);
}

/* RULES */
.rules-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.rule-card {
	display: flex;
	gap: 1.25rem;
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.5rem;
}

.rule-icon {
	width: 44px;
	height: 44px;
	background: rgba(46, 107, 66, .08);
	border: 1px solid rgba(61, 122, 82, .2);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.rule-icon svg {
	width: 20px;
	height: 20px;
	stroke: var(--sienna);
	fill: none;
	stroke-width: 1.5;
}

.rule-title {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .35rem;
}

.rule-desc {
	font-size: .8rem;
	color: var(--muted);
	line-height: 1.7;
}

/* PACK LIST */
.pack-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.pack-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.5rem;
}

.pack-head {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-bottom: 1rem;
	padding-bottom: .75rem;
	border-bottom: 1px solid var(--border);
}

.pack-icon {
	width: 36px;
	height: 36px;
	background: rgba(46, 107, 66, .08);
	border: 1px solid rgba(61, 122, 82, .2);
	border-radius: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.pack-icon svg {
	width: 18px;
	height: 18px;
	stroke: var(--sienna);
	fill: none;
	stroke-width: 1.5;
}

.pack-title {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ink);
}

.pack-items {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: .3rem;
}

.pack-items li {
	font-size: .8rem;
	color: var(--muted);
	display: flex;
	align-items: flex-start;
	gap: .5rem;
	line-height: 1.5;
}

.pack-items li::before {
	content: '';
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--gold);
	flex-shrink: 0;
	margin-top: .45rem;
}

/* FAQ */
.faq-list {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	max-width: 900px;
	margin: auto;
}

.faq-item {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.faq-q {
	width: 100%;
	background: none;
	border: none;
	padding: 1.25rem 1.5rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	font-family: var(--font-d);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--ink);
	text-align: left;
	gap: 1rem;
	transition: background .2s;
}

.faq-q:hover {
	background: var(--dust);
}

.faq-q svg {
	width: 16px;
	height: 16px;
	stroke: var(--muted);
	fill: none;
	stroke-width: 2;
	flex-shrink: 0;
	transition: transform .25s;
}

.faq-item.open .faq-q svg {
	transform: rotate(45deg);
}

.faq-a {
	display: none;
	padding: 0 1.5rem 1.25rem;
	font-size: .84rem;
	color: var(--muted);
	line-height: 1.8;
}

.faq-item.open .faq-a {
	display: block;
}

/* GATE INTRO CARD */
.gate-intro {
	background: var(--earth);
	padding: 1.5rem 2rem;
	margin-bottom: 2rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	flex-wrap: wrap;
}


.gate-intro-label {
	font-size: .62rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(168, 200, 176, .5);
	margin-bottom: .3rem;
}

.gate-intro-name {
	font-family: var(--font-d);
	font-size: 1.2rem;
	font-weight: 600;
	color: var(--sand);
}

.gate-intro-detail {
	font-size: .8rem;
	color: rgba(255, 255, 255, .45);
	margin-top: .3rem;
}

.gate-intro-facts {
	display: flex;
	gap: 2rem;
	flex-wrap: wrap;
}

.gate-fact {
	text-align: center;
}

.gate-fact-n {
	font-family: var(--font-d);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--sand);
	line-height: 1;
}

.gate-fact-l {
	font-size: .62rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(168, 200, 176, .45);
}

/* ── OVERVIEW STRIP ── */
.overview-strip {
	background: var(--earth);
	padding: 2rem 2rem;
}

.overview-inner {
	max-width: var(--max-w);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 0;
}

.ov-item {
	padding: 1.1rem 1.4rem;
	border-right: 1px solid rgba(255, 255, 255, .08);
	text-align: center;
}

.ov-item:last-child {
	border-right: none;
}

.ov-n {
	font-family: var(--font-d);
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--sand);
	line-height: 1;
	margin-bottom: .2rem;
}

.ov-l {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(168, 200, 176, .45);
}

/* ── SCHEMATIC MAP ── */
.map-section {
	background: var(--ink);
	padding: 5rem 2rem;
}

.map-inner {
	max-width: var(--max-w);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1.4fr;
	gap: 4rem;
	align-items: start;
}

.map-legend-list {
	display: flex;
	flex-direction: column;
	gap: .6rem;
	margin-top: 1.5rem;
}

.map-legend-item {
	display: flex;
	align-items: flex-start;
	gap: .75rem;
	font-size: .8rem;
	color: rgba(255, 255, 255, .5);
	padding: .5rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, .05);
}

.map-legend-item:last-child {
	border-bottom: none;
}

.map-leg-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	flex-shrink: 0;
	margin-top: .15rem;
}

.map-leg-sq {
	width: 24px;
	height: 3px;
	flex-shrink: 0;
	margin-top: .55rem;
}

.map-leg-tri {
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 10px solid var(--gold);
	flex-shrink: 0;
	margin-top: .15rem;
}

.map-legend-label {
	color: rgba(255, 255, 255, .7);
	font-weight: 500;
	margin-bottom: .1rem;
}

.map-legend-detail {
	font-size: .72rem;
	color: rgba(255, 255, 255, .35);
	display: block;
}

.map-actions {
	display: flex;
	gap: .75rem;
	flex-wrap: wrap;
	margin-top: 2rem;
}

/* MAP SECTION */

.map-list {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	margin-top: 2rem;
}

.map-list-item {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: .65rem .9rem;
	border: 1px solid rgba(255, 255, 255, .08);
	cursor: pointer;
	transition: background .2s, border-color .2s;
	font-size: .82rem;
	color: rgba(255, 255, 255, .55);
}

.map-list-item:hover {
	background: rgba(46, 107, 66, .15);
	border-color: rgba(90, 158, 114, .3);
	color: var(--sand);
}

.map-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.map-dot.floodlit {
	background: rgba(255, 200, 50, .8);
}

.map-dot.natural {
	background: rgba(90, 158, 114, .7);
}

.map-dot.camp {
	background: var(--amber);
}

.map-item-name {
	flex: 1;
}

.map-item-camp {
	font-size: .68rem;
	color: rgba(255, 255, 255, .3);
}

/* TIPS SECTION */
.tips-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.tip-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 2rem;
}

.tip-num {
	font-family: var(--font-d);
	font-size: 3rem;
	font-weight: 300;
	color: var(--border);
	line-height: 1;
	margin-bottom: .75rem;
}

.tip-title {
	font-family: var(--font-d);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.tip-body {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.75;
}

/* ── DISTANCES ── */
.dist-section-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
}

.dist-table-wrap {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.dist-table-title {
	background: var(--earth);
	padding: .8rem 1.2rem;
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--sand);
}

.dist-table {
	width: 100%;
	border-collapse: collapse;
}

.dist-table th {
	background: rgba(234, 242, 236, .7);
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	padding: .65rem 1rem;
	text-align: left;
	font-weight: 400;
	border-bottom: 1px solid var(--border);
}

.dist-table td {
	padding: .65rem 1rem;
	font-size: .82rem;
	color: var(--earth);
	border-bottom: 1px solid var(--border);
}

.dist-table tr:last-child td {
	border-bottom: none;
}

.dist-table .td-dest {
	font-weight: 500;
}

.dist-table .td-km {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--ink);
}

.dist-table .td-time {
	color: var(--muted);
}

.dist-table .td-note {
	font-size: .72rem;
	color: var(--muted);
}

/* ── ARRIVALS TABLE ── */
.arrivals-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.arrival-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.arrival-head {
	background: var(--bark);
	padding: 1rem 1.3rem;
}

.arrival-gate {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--sand);
}

.arrival-sub {
	font-size: .65rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(168, 200, 176, .5);
	margin-top: .15rem;
}

.arrival-table {
	width: 100%;
	border-collapse: collapse;
}

.arrival-table td {
	padding: .6rem 1.1rem;
	font-size: .82rem;
	color: var(--earth);
	border-bottom: 1px solid var(--border);
}

.arrival-table tr:last-child td {
	border-bottom: none;
}

.arrival-table .at-city {
	font-weight: 500;
	color: var(--ink);
}

.arrival-table .at-km {
	font-family: var(--font-d);
	font-size: .9rem;
	font-weight: 600;
}

.arrival-table .at-road {
	font-size: .7rem;
	color: var(--muted);
}

/* ── GAME DRIVE ROUTES ── */
.routes-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.route-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
	transition: box-shadow .2s;
}

.route-card:hover {
	box-shadow: 0 6px 24px rgba(13, 26, 13, .1);
}

.route-head {
	padding: 1.4rem 1.5rem;
	border-bottom: 1px solid var(--border);
	display: flex;
	gap: 1rem;
	align-items: flex-start;
}

.route-num {
	font-family: var(--font-d);
	font-size: 2.5rem;
	font-weight: 300;
	color: var(--border);
	line-height: 1;
	flex-shrink: 0;
}

.route-meta {}

.route-tag {
	font-size: .58rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: .2rem;
}

.route-name {
	font-family: var(--font-d);
	font-size: 1.2rem;
	font-weight: 600;
	color: var(--ink);
}

.route-stats {
	display: flex;
	gap: 1.2rem;
	margin-top: .35rem;
	flex-wrap: wrap;
}

.route-stat {
	font-size: .72rem;
	color: var(--muted);
	display: flex;
	align-items: center;
	gap: .3rem;
}

.route-stat svg {
	width: 11px;
	height: 11px;
	stroke: var(--amber);
	fill: none;
	stroke-width: 2;
}

.route-body {
	padding: 1.2rem 1.5rem;
}

.route-desc {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.75;
	margin-bottom: 1rem;
}

.route-stops {
	display: flex;
	flex-direction: column;
	gap: .35rem;
}

.route-stop {
	display: flex;
	align-items: flex-start;
	gap: .65rem;
	font-size: .79rem;
	color: var(--muted);
}

.route-stop-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--amber);
	flex-shrink: 0;
	margin-top: .35rem;
}

.route-stop strong {
	color: var(--earth);
}

.route-svg-wrap {
	background: var(--ink);
	padding: 1.2rem;
	border-top: 1px solid var(--border);
}

/* ── GPS TABLE ── */
.gps-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.gps-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.gps-card-head {
	background: var(--earth);
	padding: .8rem 1.1rem;
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--sand);
}

.gps-table {
	width: 100%;
	border-collapse: collapse;
}

.gps-table td {
	padding: .5rem .9rem;
	font-size: .78rem;
	border-bottom: 1px solid var(--border);
}

.gps-table tr:last-child td {
	border-bottom: none;
}

.gps-name {
	color: var(--earth);
	font-weight: 500;
}

.gps-coord {
	font-family: monospace;
	font-size: .72rem;
	color: var(--muted);
}

.gps-type {
	font-size: .6rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--muted);
}

/* ── ROADS ── */
.roads-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.road-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.5rem;
}

.road-icon {
	width: 44px;
	height: 44px;
	background: rgba(46, 107, 66, .08);
	border: 1px solid rgba(61, 122, 82, .2);
	border-radius: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
}

.road-icon svg {
	width: 22px;
	height: 22px;
	stroke: var(--sienna);
	fill: none;
	stroke-width: 1.5;
}

.road-title {
	font-family: var(--font-d);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.road-desc {
	font-size: .81rem;
	color: var(--muted);
	line-height: 1.75;
}

/* BIG SPECIES CARD */
.species-card {
	display: grid;
	grid-template-columns: 1fr 1fr;
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
	margin-bottom: 2px;
	transition: box-shadow .25s;
}

.species-card:hover {
	box-shadow: 0 6px 28px rgba(26, 51, 32, .1);
}

.species-card.reverse {
	direction: rtl;
}

.species-card.reverse>* {
	direction: ltr;
}

.sc-img {
	position: relative;
	min-height: 340px;
	overflow: hidden;
}

.sc-img img {
	transition: transform .6s ease;
}

.species-card:hover .sc-img img {
	transform: scale(1.04);
}

.sc-badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .3rem .8rem;
}

.sc-badge.big5 {
	background: var(--amber);
	color: #fff;
}

.sc-badge.predator {
	background: rgba(180, 60, 40, .8);
	color: #fff;
}

.sc-badge.endemic {
	background: rgba(100, 60, 160, .7);
	color: #fff;
}

.sc-badge.special {
	background: rgba(50, 100, 160, .7);
	color: #fff;
}

.sc-body {
	padding: 2.5rem 3rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.sc-taxon {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .3rem;
	font-style: italic;
}

.sc-name {
	font-family: var(--font-d);
	font-size: 2rem;
	font-weight: 600;
	color: var(--ink);
	line-height: 1.1;
	margin-bottom: .75rem;
}

.sc-desc {
	font-size: .85rem;
	color: var(--muted);
	line-height: 1.85;
	margin-bottom: 1.5rem;
}

.sc-facts {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .5rem 1.5rem;
	margin-bottom: 1.5rem;
}

.sc-fact {
	font-size: .78rem;
}

.sc-fact-label {
	color: var(--muted);
	font-size: .64rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	margin-bottom: .1rem;
}

.sc-fact-val {
	color: var(--earth);
	font-weight: 500;
}

.sc-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
}

.sc-tag {
	font-size: .61rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sienna);
	background: rgba(46, 107, 66, .07);
	border: 1px solid rgba(61, 122, 82, .18);
	padding: .2rem .55rem;
	border-radius: 20px;
}

/* SMALLER SPECIES GRID */
.species-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.sp-card {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
	transition: box-shadow .2s, transform .2s;
}

.sp-card:hover {
	box-shadow: 0 6px 24px rgba(26, 51, 32, .1);
	transform: translateY(-2px);
}

.sp-img {
	height: 220px;
	overflow: hidden;
	position: relative;
	background: var(--earth);
}

.sp-img-ph {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(43, 82, 53, .2);
}

.sp-img-ph svg {
	width: 40px;
	height: 40px;
	stroke: rgba(90, 158, 114, .3);
	fill: none;
	stroke-width: 1.2;
}

.sp-badge {
	position: absolute;
	top: .6rem;
	left: .6rem;
	font-size: .58rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: .2rem .6rem;
}

.sp-badge.big5 {
	background: var(--amber);
	color: #fff;
}

.sp-badge.predator {
	background: rgba(180, 60, 40, .8);
	color: #fff;
}

.sp-badge.endemic {
	background: rgba(100, 60, 160, .7);
	color: #fff;
}

.sp-badge.special {
	background: rgba(50, 100, 160, .7);
	color: #fff;
}

.sp-body {
	padding: 1.25rem;
}

.sp-taxon {
	font-size: .6rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	font-style: italic;
	margin-bottom: .2rem;
}

.sp-name {
	font-family: var(--font-d);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.sp-desc {
	font-size: .8rem;
	color: var(--muted);
	line-height: 1.7;
	margin-bottom: .9rem;
}

.sp-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: .75rem;
	border-top: 1px solid var(--border);
	font-size: .72rem;
	color: var(--muted);
}

.sp-chance {
	display: flex;
	align-items: center;
	gap: .4rem;
}

.chance-dots {
	display: flex;
	gap: 2px;
}

.chance-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--border);
}

.chance-dot.filled {
	background: var(--amber);
}

.sp-best {
	font-size: .7rem;
	color: var(--muted);
}

/* BIRDS SECTION */
.birds-intro {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: start;
	margin-bottom: 3rem;
}

.birds-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}

.bird-card {
	position: relative;
	overflow: hidden;
	aspect-ratio: 3/4;
	background: var(--ink);
	cursor: pointer;
}

.bird-card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .8;
	transition: opacity .4s, transform .5s;
}

.bird-card:hover img {
	opacity: 1;
	transform: scale(1.06);
}

.bird-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(transparent 40%, rgba(13, 26, 13, .85) 100%);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 1rem .9rem;
}

.bird-name {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--white);
	line-height: 1.2;
}

.bird-hint {
	font-size: .65rem;
	color: rgba(255, 255, 255, .5);
	letter-spacing: .07em;
	text-transform: uppercase;
	margin-top: .2rem;
}

/* SIGHTING LIKELIHOOD TABLE */
.likelihood-wrap {
	background: var(--white);
	border: 1px solid var(--border);
	overflow: hidden;
}

.lt-table {
	width: 100%;
	border-collapse: collapse;
}

.lt-table th {
	background: var(--earth);
	color: rgba(168, 200, 176, .8);
	font-size: .64rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .8rem 1.1rem;
	text-align: left;
	font-weight: 400;
}

.lt-table td {
	padding: .75rem 1.1rem;
	font-size: .83rem;
	color: var(--earth);
	border-bottom: 1px solid var(--border);
	vertical-align: middle;
}

.lt-table tr:last-child td {
	border-bottom: none;
}

.lt-table tr:nth-child(even) td {
	background: rgba(234, 242, 236, .4);
}

.lt-species {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
}

.lt-dots {
	display: flex;
	gap: 3px;
}

.lt-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--border);
}

.lt-dot.on {
	background: var(--amber);
}

.lt-note {
	font-size: .76rem;
	color: var(--muted);
}

.lt-season {
	font-size: .72rem;
	color: var(--muted);
}

/* VIEWING ADVICE */
.advice-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
}

.advice-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.75rem 2rem;
	display: flex;
	gap: 1.25rem;
}

.advice-num {
	font-family: var(--font-d);
	font-size: 2.5rem;
	font-weight: 300;
	color: var(--border);
	line-height: 1;
	flex-shrink: 0;
	width: 2.5rem;
}

.advice-title {
	font-family: var(--font-d);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .4rem;
}

.advice-body {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.75;
}

/* HIDDEN */
.lodge-card.hidden,
.nwr-card.hidden {
	display: none;
}

/* RESPONSIVE */
@media(max-width:1024px) {
	.species-card {
		grid-template-columns: 1fr;
	}

	.species-card.reverse {
		direction: ltr;
	}

	.sc-img {
		min-height: 280px;
	}

	.birds-intro {
		grid-template-columns: 1fr;
	}

	.birds-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media(max-width:768px) {

	.species-grid {
		grid-template-columns: 1fr;
	}

	.advice-grid {
		grid-template-columns: 1fr;
	}

	.birds-grid {
		grid-template-columns: 1fr 1fr;
	}

	.sc-body {
		padding: 1.75rem 1.5rem;
	}
}

@media(max-width:480px) {
	.birds-grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media(max-width:1024px) {
	.wh-main-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.wh-card.featured {
		grid-column: span 1;
	}

	.floodlit-inner {
		grid-template-columns: 1fr;
	}

	.intro-grid {
		grid-template-columns: 1fr;
	}
}

@media(max-width:768px) {

	.wh-main-grid {
		grid-template-columns: 1fr;
	}

	.tips-grid {
		grid-template-columns: 1fr;
	}
}

/* RESPONSIVE */
@media(max-width:1024px) {
	.map-inner {
		grid-template-columns: 1fr;
	}

	.dist-section-grid {
		grid-template-columns: 1fr;
	}

	.arrivals-grid {
		grid-template-columns: 1fr;
	}

	.gps-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.overview-inner {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media(max-width:768px) {

	.routes-grid {
		grid-template-columns: 1fr;
	}

	.roads-grid {
		grid-template-columns: 1fr;
	}

	.gps-grid {
		grid-template-columns: 1fr;
	}

	.overview-inner {
		grid-template-columns: repeat(2, 1fr);
	}

}

@media(max-width:480px) {

	.overview-inner {
		grid-template-columns: 1fr 1fr;
	}
}

/* RESPONSIVE */
@media(max-width:768px) {

	.season-grid {
		grid-template-columns: 1fr;
	}

	.gates-grid {
		grid-template-columns: 1fr;
	}

	.dist-grid {
		grid-template-columns: 1fr;
	}

	.rules-grid {
		grid-template-columns: 1fr;
	}

	.pack-grid {
		grid-template-columns: 1fr;
	}

	.fgrid {
		grid-template-columns: 1fr 1fr;
	}

	.section {
		padding: 3.5rem 1.25rem;
	}

	.month-row {
		grid-template-columns: repeat(6, 1fr);
	}
}

@media(max-width:1024px) {
	.nwr-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.nwr-card.span2 {
		grid-column: span 1;
	}

	.lodge-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media(max-width:768px) {

	.grid-2,
	.grid-cols-2,
	.grid-3,
	.grid-cols-3,
	.grid-4 {
		grid-template-columns: 1fr;
	}

	.species-hero {
		grid-template-columns: 1fr;
	}

	.nwr-grid {
		grid-template-columns: 1fr;
	}

	.lodge-grid {
		grid-template-columns: 1fr;
	}

	.gate-intro {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* WHY VISIT */
.why {
	background: var(--ink);
	padding: 0;
}

.why-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
}

.why-card {
	padding: 3rem 2rem;
	border-right: 1px solid rgba(255, 255, 255, .07);
	text-align: center;
	transition: background .3s;
}

.why-card:last-child {
	border-right: none;
}

.why-card:hover {
	background: rgba(46, 107, 66, .15);
}

.why-icon {
	width: 52px;
	height: 52px;
	background: rgba(46, 107, 66, .2);
	border: 1px solid rgba(90, 158, 114, .3);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 1.25rem;
}

.why-icon svg {
	width: 24px;
	height: 24px;
	stroke: var(--sand);
	fill: none;
	stroke-width: 1.5;
}

.why-card-title {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--sand);
	margin-bottom: .5rem;
}

.why-card-desc {
	font-size: .79rem;
	color: rgba(168, 200, 176, .65);
	line-height: 1.7;
}

/* ACCOMMODATION */
.accom {
	background: var(--dust);
}

.accom-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2px;
	background: var(--border);
	border: 1px solid var(--border);
	overflow: hidden;
}

.acard {
	background: var(--white);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	transition: transform .25s, box-shadow .25s;
}

.acard:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 40px rgba(61, 43, 26, .15);
}

.acard:first-child {
	grid-column: span 2;
}

.aimg {
	position: relative;
	overflow: hidden;
	height: 220px;
}

.acard:first-child .aimg {
	height: 300px;
}

.aimg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s ease;
}

.acard:hover .aimg img {
	transform: scale(1.05);
}

.abadge {
	position: absolute;
	top: .8rem;
	left: .8rem;
	background: var(--amber);
	color: #fff;
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .2rem .65rem;
}

.abody {
	padding: 1.5rem;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.aloc {
	font-size: .64rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .4rem;
}

.aname {
	font-family: var(--font-d);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.adesc {
	font-size: .82rem;
	color: var(--muted);
	line-height: 1.7;
	margin-bottom: 1rem;
	flex: 1;
}

.atags {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin-bottom: 1.2rem;
}

.atag {
	font-size: .61rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sienna);
	background: rgba(46, 107, 66, .08);
	border: 1px solid rgba(61, 122, 82, .2);
	padding: .2rem .6rem;
	border-radius: 20px;
}

.afooter {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: .75rem;
	border-top: 1px solid var(--border);
}

.aprice {
	font-size: .75rem;
	color: var(--muted);
}

.aprice strong {
	display: block;
	font-family: var(--font-d);
	font-size: 1rem;
	color: var(--earth);
	font-weight: 600;
}

.arow {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2px;
	background: var(--border);
	border: 1px solid var(--border);
	margin-top: 2px;
	overflow: hidden;
}

.acard-h {
	flex-direction: row;
}

.acard-h .aimg {
	height: auto;
	width: 220px;
	flex-shrink: 0;
}

.acard-h .aimg img {
	height: 100%;
}

/* WILDLIFE */
.wildlife {
	background: var(--cream);
}

.wgrid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1rem;
}

.wcard {
	position: relative;
	overflow: hidden;
	border-radius: 2px;
	cursor: pointer;
	aspect-ratio: 3/4;
	background: var(--ink);
}

.wcard img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .85;
	transition: opacity .4s, transform .5s;
}

.wcard:hover img {
	opacity: 1;
	transform: scale(1.06);
}

.woverlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(transparent 40%, rgba(26, 18, 8, .85) 100%);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 1.25rem 1rem;
}

.wname {
	font-family: var(--font-d);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--white);
	line-height: 1.2;
}

.whint {
	font-size: .66rem;
	color: rgba(255, 255, 255, .5);
	letter-spacing: .08em;
	text-transform: uppercase;
	margin-top: .2rem;
}

.warrow {
	position: absolute;
	top: .8rem;
	right: .8rem;
	width: 28px;
	height: 28px;
	background: rgba(200, 124, 34, .9);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity .25s;
}

.wcard:hover .warrow {
	opacity: 1;
}

.warrow svg {
	width: 12px;
	height: 12px;
	stroke: #fff;
	stroke-width: 2.5;
	fill: none;
}

/* WATERHOLES */
.waterholes {
	background: var(--dust);
	padding: 3rem 2rem;
}

.wh-label {
	font-size: .64rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: 1.2rem;
}

.wh-scroll {
	display: flex;
	gap: .5rem;
	overflow-x: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: .25rem;
}

.wh-scroll::-webkit-scrollbar {
	display: none;
}

.wh-pill {
	display: flex;
	align-items: center;
	gap: .5rem;
	padding: .55rem 1.2rem;
	background: var(--white);
	border: 1px solid var(--border);
	white-space: nowrap;
	cursor: pointer;
	font-size: .78rem;
	color: var(--earth);
	border-radius: 20px;
	transition: background .2s, border-color .2s, color .2s;
}

.wh-pill:hover {
	background: var(--amber);
	border-color: var(--amber);
	color: #fff;
}

.wh-pill .dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--amber);
	flex-shrink: 0;
}

.wh-pill:hover .dot {
	background: rgba(255, 255, 255, .7);
}

/* ITINERARIES */
.itin {
	background: var(--earth);
}

.igrid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1rem;
}

.icard {
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .1);
	padding: 2rem 1.5rem;
	transition: background .25s, border-color .25s;
	cursor: pointer;
	display: block;
}

.icard:hover {
	background: rgba(46, 107, 66, .2);
	border-color: rgba(90, 158, 114, .5);
}

.idays {
	font-family: var(--font-d);
	font-size: 3rem;
	font-weight: 300;
	color: var(--amber);
	line-height: 1;
	margin-bottom: .25rem;
}

.idays span {
	font-size: 1rem;
	color: rgba(255, 255, 255, .3);
}

.ititle {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--sand);
	margin-bottom: .75rem;
}

.idesc {
	font-size: .78rem;
	color: rgba(255, 255, 255, .45);
	line-height: 1.7;
	margin-bottom: 1.5rem;
}

.ihls {
	display: flex;
	flex-direction: column;
	gap: .3rem;
	margin-bottom: 1.5rem;
}

.ihl {
	font-size: .72rem;
	color: rgba(255, 255, 255, .5);
	display: flex;
	align-items: center;
	gap: .5rem;
}

.ihl::before {
	content: '';
	display: block;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--gold);
	flex-shrink: 0;
}

.ilink {
	font-size: .67rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--amber);
	display: flex;
	align-items: center;
	gap: .35rem;
}

.ilink svg {
	width: 12px;
	height: 12px;
	stroke: currentColor;
	stroke-width: 2;
	fill: none;
}

.ilink:hover {
	color: var(--gold);
}

/* MAP TEASER */
.map-teaser {
	background: var(--ink);
	display: grid;
	grid-template-columns: 1fr 1fr;
	min-height: 480px;
	overflow: hidden;
}

.mt-visual {
	position: relative;
	overflow: hidden;
	background: #081208;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
}

.mt-body {
	padding: 4rem 3rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.mt-feats {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	margin: 2rem 0;
}

.mt-feat {
	display: flex;
	align-items: center;
	gap: .75rem;
	font-size: .82rem;
	color: rgba(255, 255, 255, .55);
}

.mt-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--gold);
	flex-shrink: 0;
}

/* PLANNING */
.planning {
	background: var(--cream);
}

.pgrid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

.pcard {
	padding: 2rem;
	border: 1px solid var(--border);
	background: var(--white);
	cursor: pointer;
	transition: border-color .2s, box-shadow .2s;
	display: block;
}

.pcard:hover {
	border-color: var(--amber);
	box-shadow: 0 4px 20px rgba(46, 107, 66, .12);
}

.pnum {
	font-family: var(--font-d);
	font-size: 2.5rem;
	font-weight: 300;
	color: var(--border);
	line-height: 1;
	margin-bottom: .75rem;
}

.ptitle {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.pdesc {
	font-size: .8rem;
	color: var(--muted);
	line-height: 1.65;
	margin-bottom: 1.25rem;
}

.plink {
	font-size: .67rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--amber);
	display: flex;
	align-items: center;
	gap: .3rem;
}

.plink svg {
	width: 11px;
	height: 11px;
	stroke: currentColor;
	stroke-width: 2.5;
	fill: none;
}

/* EDITORIAL */
.editorial {
	background: var(--earth);
	display: grid;
	grid-template-columns: 1fr 1fr;
	overflow: hidden;
}

.ed-img {
	position: relative;
	min-height: 420px;
	overflow: hidden;
}

.ed-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ed-img::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, transparent 60%, #1a3320 100%);
}

.ed-body {
	padding: 4rem 3rem 4rem 2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.ed-eyebrow {
	font-size: .64rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: .75rem;
}

.ed-title {
	font-family: var(--font-d);
	font-size: clamp(1.6rem, 3vw, 2.4rem);
	font-weight: 300;
	color: var(--white);
	line-height: 1.2;
	margin-bottom: 1rem;
}

.ed-title em {
	font-style: italic;
	color: var(--sand);
}

.ed-text {
	font-size: .85rem;
	color: rgba(255, 255, 255, .5);
	line-height: 1.8;
	margin-bottom: 1.5rem;
}

.ed-links {
	display: flex;
	flex-direction: column;
}

.ed-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .65rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, .07);
	font-size: .8rem;
	color: rgba(255, 255, 255, .55);
	transition: color .2s;
}

.ed-link:hover {
	color: var(--sand);
}

.ed-link svg {
	width: 13px;
	height: 13px;
	stroke: currentColor;
	stroke-width: 2;
	fill: none;
	opacity: .5;
}

/* RESPONSIVE */
@media(max-width:1024px) {
	.igrid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media(max-width:768px) {
	.why-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.accom-grid {
		grid-template-columns: 1fr;
	}

	.acard:first-child {
		grid-column: span 1;
	}

	.arow {
		grid-template-columns: 1fr;
	}

	.acard-h {
		flex-direction: column;
	}

	.acard-h .aimg {
		width: 100%;
		height: 200px;
	}

	.wgrid {
		grid-template-columns: repeat(2, 1fr);
	}

	.igrid {
		grid-template-columns: repeat(2, 1fr);
	}

	.map-teaser {
		grid-template-columns: 1fr;
	}

	.mt-visual {
		min-height: 260px;
	}

	.pgrid {
		grid-template-columns: repeat(2, 1fr);
	}

	.editorial {
		grid-template-columns: 1fr;
	}

	.ed-img {
		display: none;
	}

	.hero-stats {
		display: none;
	}

	.section {
		padding: 3.5rem 1.25rem;
	}

	.nav-actions {
		display: none;
		gap: .6rem;
		flex-shrink: 0;
	}
}

@media(max-width:480px) {
	.why-grid {
		grid-template-columns: 1fr;
	}

	.wgrid {
		grid-template-columns: 1fr 1fr;
	}

	.igrid {
		grid-template-columns: 1fr;
	}

	.pgrid {
		grid-template-columns: 1fr;
	}
}

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media(max-width:1024px) {
	.page-wrap {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.sidebar {
		position: static;
	}

	.fgrid {
		grid-template-columns: 1fr 1fr;
	}
}

@media(max-width:768px) {

	.hamburger {
		display: flex;
		flex-direction: column;
		gap: 4px;
		background: none;
		border: 0;
		cursor: pointer;
	}

	.hamburger span {
		width: 24px;
		height: 2px;
		background: #fff;
	}

	.nav-links {
		display: none;
	}

	.nav-links.show {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: #1f1f1f;
		padding: 1rem;
		z-index: 1000;
	}

	.nav-links.show a {
		width: 100%;
		padding: 0.85rem 0;
	}

	.hamburger {
		display: flex;
	}

	.lhero {
		height: 60vh;
	}

	.gallery-strip {
		grid-template-columns: repeat(2, 1fr);
		height: 120px;
	}

	.overview-grid {
		grid-template-columns: 1fr;
	}

	.rooms-grid {
		grid-template-columns: 1fr;
	}

	.waterhole-feature {
		grid-template-columns: 1fr;
	}

	.seasons-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.activities-list {
		grid-template-columns: repeat(2, 1fr);
	}

	.practical-grid {
		grid-template-columns: 1fr;
	}

	.sightings-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.nearby-grid {
		grid-template-columns: 1fr 1fr;
	}

	.fgrid {
		grid-template-columns: 1fr 1fr;
	}
}

@media(max-width:480px) {
	.seasons-grid {
		grid-template-columns: 1fr;
	}

	.activities-list {
		grid-template-columns: 1fr;
	}

	.sightings-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.nearby-grid {
		grid-template-columns: 1fr;
	}

	.fgrid {
		grid-template-columns: 1fr;
	}
}


.nls {
	display: flex;
	align-items: center;
	gap: .05rem;
	flex: 1;
	overflow: hidden;
}

.nls a {
	color: rgba(255, 255, 255, .62);
	font-size: .71rem;
	font-weight: 400;
	letter-spacing: .07em;
	text-transform: uppercase;
	padding: .45rem .6rem;
	white-space: nowrap;
	transition: color .2s, background .2s;
	border-radius: 2px;
}

.nls a:hover,
.nls a.act {
	color: var(--sand);
	background: rgba(255, 255, 255, .06);
}

.na {
	display: flex;
	gap: .6rem;
	flex-shrink: 0;
}

.ba {
	background: var(--amb);
	color: #fff;
	border-color: var(--amb);
}

.ba:hover {
	background: #1f4f30;
}

.bg {
	background: transparent;
	color: rgba(255, 255, 255, .75);
	border-color: rgba(255, 255, 255, .3);
}

.bg:hover {
	color: var(--sand);
	border-color: var(--sand);
}

.bo {
	background: transparent;
	color: var(--earth);
	border-color: var(--sien);
}

.bo:hover {
	background: var(--earth);
	color: #fff;
}

.bw {
	background: #fff;
	color: #1a3320;
	border-color: #fff;
}

.bw:hover {
	background: var(--dust);
}

.bl {
	padding: .8rem 2rem;
	font-size: .8rem;
}

.ham {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
	flex-direction: column;
	gap: 5px;
	padding: .5rem;
	margin-left: auto;
}

.ham span {
	display: block;
	width: 22px;
	height: 1.5px;
	background: rgba(255, 255, 255, .7);
}

/* ── HERO ─────────────────────────── */
/* .hero {
	position: relative;
	height: 52vh;
	min-height: 420px;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
	margin-top: var(--nav-h);
} */

.hbg {
	position: absolute;
	inset: 0;
	background: url('https://images.unsplash.com/photo-1516426122078-c23e76319801?w=1800&q=80') center 60%/cover no-repeat;
}

.hbg::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(13, 26, 13, .1) 0%, rgba(13, 26, 13, .55) 65%, rgba(13, 26, 13, .9) 100%);
}

.hc {
	position: relative;
	z-index: 2;
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 0 2rem 3.5rem;
	width: 100%;
}

.hbc {
	display: flex;
	align-items: center;
	gap: .5rem;
	margin-bottom: 1.25rem;
	font-size: .67rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .4);
}

.hbc a {
	color: rgba(255, 255, 255, .4);
	transition: color .2s;
}

.hbc a:hover {
	color: var(--sand);
}

.hbc span {
	color: rgba(255, 255, 255, .2);
}

.hey {
	font-size: .66rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: .7rem;
	display: flex;
	align-items: center;
	gap: .55rem;
}

.hey::before {
	content: '';
	display: block;
	width: 26px;
	height: 1px;
	background: var(--gold);
}

.ht {
	font-family: var(--font-d);
	font-size: clamp(2rem, 5vw, 3.6rem);
	font-weight: 300;
	color: var(--white);
	line-height: 1.08;
	letter-spacing: -.01em;
	margin-bottom: .6rem;
}

.ht em {
	font-style: italic;
	color: var(--sand);
}

.hs {
	font-size: .92rem;
	color: rgba(255, 255, 255, .62);
	max-width: 480px;
	line-height: 1.7;
}

@keyframes fu {
	from {
		opacity: 0;
		transform: translateY(18px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.hbc {
	animation: fu .5s ease .1s both;
}

.hey {
	animation: fu .5s ease .25s both;
}

.ht {
	animation: fu .6s ease .35s both;
}

.hs {
	animation: fu .5s ease .5s both;
}

/* ── ITINERARY CARDS GRID ─────────── */
.cards-sec {
	background: var(--ink);
	padding: 0;
}

.cards-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
}

.ic {
	padding: 2.5rem 1.75rem;
	border-right: 1px solid rgba(255, 255, 255, .07);
	cursor: pointer;
	transition: background .25s;
	position: relative;
}

.ic:last-child {
	border-right: none;
}

.ic:hover,
.ic.sel {
	background: rgba(46, 107, 66, .18);
}

.ic.sel::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--amb);
}

.ic-days {
	font-family: var(--font-d);
	font-size: 2.6rem;
	font-weight: 300;
	color: var(--amb);
	line-height: 1;
	margin-bottom: .2rem;
}

.ic-days span {
	font-size: .95rem;
	color: rgba(255, 255, 255, .3);
}

.ic-name {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--sand);
	margin-bottom: .5rem;
}

.ic-desc {
	font-size: .73rem;
	color: rgba(255, 255, 255, .38);
	line-height: 1.6;
	margin-bottom: 1rem;
}

.ic-tags {
	display: flex;
	flex-direction: column;
	gap: .25rem;
}

.ic-tag {
	font-size: .65rem;
	color: rgba(255, 255, 255, .4);
	display: flex;
	align-items: center;
	gap: .4rem;
}

.ic-tag::before {
	content: '';
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--amb);
	flex-shrink: 0;
}

/* ── LAYOUT ───────────────────────── */
.page {
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 3.5rem 2rem;
	display: grid;
	grid-template-columns: 1fr 300px;
	gap: 3rem;
	align-items: start;
}

.main {}

/* ── ITINERARY PANEL ──────────────── */
.itin-panel {
	display: none;
}

.itin-panel.vis {
	display: block;
}

/* Panel header */
.panel-hd {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: 2.5rem;
	padding-bottom: 2.5rem;
	border-bottom: 1px solid var(--border);
}

.ph-left {}

.ph-eyebrow {
	font-size: .64rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--amb);
	margin-bottom: .5rem;
	display: flex;
	align-items: center;
	gap: .5rem;
}

.ph-eyebrow::after {
	content: '';
	flex: 0 0 22px;
	height: 1px;
	background: var(--amb);
}

.ph-title {
	font-family: var(--font-d);
	font-size: clamp(1.6rem, 3vw, 2.2rem);
	font-weight: 400;
	color: var(--ink);
	line-height: 1.2;
	margin-bottom: .6rem;
}

.ph-title em {
	color: var(--amb);
	font-style: italic;
}

.ph-desc {
	font-size: .87rem;
	color: var(--muted);
	line-height: 1.8;
	max-width: 520px;
}

.ph-stats {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	flex-shrink: 0;
}

.ph-stat {
	text-align: right;
	padding-right: .85rem;
	border-right: 2px solid var(--border);
}

.ph-stat-n {
	font-family: var(--font-d);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--amb);
	line-height: 1;
}

.ph-stat-l {
	font-size: .62rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
}

/* Summary chips */
.itin-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem;
	margin-bottom: 2rem;
}

.chip {
	display: flex;
	align-items: center;
	gap: .4rem;
	background: var(--dust);
	border: 1px solid var(--border);
	padding: .32rem .85rem;
	font-size: .72rem;
	color: var(--earth);
	border-radius: 20px;
}

.chip svg {
	width: 12px;
	height: 12px;
	stroke: var(--amb);
	fill: none;
	stroke-width: 2;
}

/* ── ROUTE MAP SVG ────────────────── */
.route-map-wrap {
	background: var(--ink);
	padding: 2rem;
	margin-bottom: 2.5rem;
	border: 1px solid rgba(90, 158, 114, .15);
}

.rm-label {
	font-size: .62rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(168, 200, 176, .4);
	margin-bottom: 1.25rem;
}

.route-map-wrap svg {
	width: 100%;
	height: auto;
	display: block;
}

/* ── DAY TIMELINE ─────────────────── */
.days {}

.day-block {
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: 0;
	margin-bottom: 0;
}

.day-spine {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: .25rem;
}

.day-num-wrap {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--amb);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	position: relative;
	z-index: 1;
}

.day-num {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: #fff;
	line-height: 1;
}

.day-line {
	width: 2px;
	background: var(--border);
	flex: 1;
	margin-top: 4px;
	min-height: 40px;
}

.day-block:last-child .day-line {
	display: none;
}

.day-content {
	padding: 0 0 3rem 0;
}

.day-header {
	margin-bottom: 1.25rem;
}

.day-label {
	font-size: .62rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--amb);
	margin-bottom: .2rem;
}

.day-title {
	font-family: var(--font-d);
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--ink);
}

.day-title em {
	font-style: italic;
	color: var(--amb);
}

.day-date-hint {
	font-size: .72rem;
	color: var(--muted);
	margin-top: .15rem;
}

/* Stop cards within a day */
.stops {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 1.25rem;
}

.stop {
	display: grid;
	grid-template-columns: 48px 1fr;
	gap: 0;
	background: var(--white);
	border: 1px solid var(--border);
}

.stop-time-col {
	background: var(--dust);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding: .9rem .4rem;
	border-right: 1px solid var(--border);
}

.stop-time {
	font-size: .65rem;
	font-weight: 500;
	color: var(--amb);
	letter-spacing: .04em;
	text-align: center;
	line-height: 1.3;
}

.stop-icon {
	width: 26px;
	height: 26px;
	border-radius: 50%;
	border: 1px solid var(--border);
	background: var(--white);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: .5rem;
}

.stop-icon svg {
	width: 13px;
	height: 13px;
	stroke: var(--amb);
	fill: none;
	stroke-width: 2;
}

.stop-body {
	padding: .9rem 1rem;
}

.stop-type {
	font-size: .6rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .2rem;
}

.stop-name {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .3rem;
}

.stop-desc {
	font-size: .78rem;
	color: var(--muted);
	line-height: 1.65;
	margin-bottom: .6rem;
}

.stop-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
}

.stag {
	font-size: .62rem;
	color: var(--sien);
	background: rgba(46, 107, 66, .07);
	border: 1px solid rgba(61, 122, 82, .18);
	padding: .15rem .55rem;
	border-radius: 20px;
}

/* Drive connector */
.drive-connector {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin: 0 0 .75rem 0;
	padding: .6rem 1rem;
	background: rgba(46, 107, 66, .06);
	border: 1px dashed rgba(46, 107, 66, .25);
}

.dc-icon svg {
	width: 14px;
	height: 14px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
}

.dc-text {
	font-size: .74rem;
	color: var(--muted);
}

.dc-text strong {
	color: var(--earth);
}

/* Day notes */
.day-note {
	background: var(--dust);
	border-left: 3px solid var(--amb);
	padding: .9rem 1.1rem;
	font-size: .8rem;
	color: var(--muted);
	line-height: 1.7;
	margin-top: .5rem;
}

.day-note strong {
	color: var(--earth);
}

/* Overnight camp callout */
.overnight {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1rem 1.25rem;
	border: 1px solid var(--border);
	background: var(--white);
	margin-top: .5rem;
}

.ov-icon {
	width: 36px;
	height: 36px;
	background: var(--amb);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.ov-icon svg {
	width: 16px;
	height: 16px;
	stroke: #fff;
	fill: none;
	stroke-width: 2;
}

.ov-label {
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .1rem;
}

.ov-name {
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ink);
}

.ov-link {
	margin-left: auto;
	font-size: .68rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--amb);
	display: flex;
	align-items: center;
	gap: .25rem;
	white-space: nowrap;
}

.ov-link svg {
	width: 11px;
	height: 11px;
	stroke: currentColor;
	stroke-width: 2;
	fill: none;
}

/* ── SIDEBAR ──────────────────────── */
.sidebar {
	position: sticky;
	top: calc(var(--nav-h) + 1.5rem);
}

.sb-book {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.75rem;
	margin-bottom: 1rem;
}

.sb-title {
	font-family: var(--font-d);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .25rem;
}

.sb-sub {
	font-size: .73rem;
	color: var(--muted);
	margin-bottom: 1.25rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--border);
}

.sb-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: .5rem 0;
	border-bottom: 1px solid var(--border);
	font-size: .8rem;
}

.sb-row:last-of-type {
	border-bottom: none;
	margin-bottom: 1.25rem;
}

.sb-key {
	color: var(--muted);
}

.sb-val {
	color: var(--earth);
	font-weight: 500;
	text-align: right;
}

.sb-btns {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

.sb-btns .btn {
	justify-content: center;
	width: 100%;
}

.sb-note {
	font-size: .67rem;
	color: var(--muted);
	text-align: center;
	margin-top: .65rem;
	line-height: 1.5;
}

.sb-camps {
	border: 1px solid var(--border);
	margin-bottom: 1rem;
}

.sb-camps-title {
	font-size: .61rem;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--muted);
	padding: .8rem 1.1rem;
	border-bottom: 1px solid var(--border);
}

.sbc-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .7rem 1.1rem;
	border-bottom: 1px solid var(--border);
	font-size: .79rem;
	color: var(--earth);
	transition: background .2s, color .2s;
}

.sbc-link:last-child {
	border-bottom: none;
}

.sbc-link:hover {
	background: var(--dust);
	color: var(--amb);
}

.sbc-link svg {
	width: 11px;
	height: 11px;
	stroke: var(--border);
	fill: none;
	stroke-width: 2;
	transition: stroke .2s;
}

.sbc-link:hover svg {
	stroke: var(--amb);
}

.sb-tips {
	background: var(--earth);
	padding: 1.25rem;
	margin-bottom: 1rem;
}

.sb-tips-title {
	font-size: .61rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--sand);
	opacity: .65;
	margin-bottom: .85rem;
}

.tip {
	display: flex;
	align-items: flex-start;
	gap: .55rem;
	font-size: .76rem;
	color: rgba(255, 255, 255, .6);
	margin-bottom: .65rem;
	line-height: 1.55;
}

.tip:last-child {
	margin-bottom: 0;
}

.tip svg {
	width: 13px;
	height: 13px;
	stroke: var(--gold);
	fill: none;
	stroke-width: 1.8;
	flex-shrink: 0;
	margin-top: 2px;
}

.sb-quick {
	border: 1px solid var(--border);
}

.sb-quick-title {
	font-size: .61rem;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--muted);
	padding: .8rem 1.1rem;
	border-bottom: 1px solid var(--border);
}

.sq-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .65rem 1.1rem;
	border-bottom: 1px solid var(--border);
	font-size: .78rem;
	color: var(--earth);
	transition: background .2s, color .2s;
}

.sq-link:last-child {
	border-bottom: none;
}

.sq-link:hover {
	background: var(--dust);
	color: var(--amb);
}

.sq-link svg {
	width: 11px;
	height: 11px;
	stroke: var(--border);
	fill: none;
	stroke-width: 2;
}

.sq-link:hover svg {
	stroke: var(--amb);
}

/* ── PACKING / TIPS SECTION ───────── */
.prep-sec {
	background: var(--dust);
	padding: 4rem 2rem;
}

.prep-inner {
	max-width: var(--max-w);
	margin: 0 auto;
}

.prep-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	margin-top: 2rem;
}

.prep-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.5rem;
}

.prep-icon {
	width: 40px;
	height: 40px;
	background: var(--dust);
	border: 1px solid var(--border);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
}

.prep-icon svg {
	width: 18px;
	height: 18px;
	stroke: var(--amb);
	fill: none;
	stroke-width: 1.8;
}

.prep-title {
	font-family: var(--font-d);
	font-size: .95rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .5rem;
}

.prep-list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: .3rem;
}

.prep-list li {
	font-size: .75rem;
	color: var(--muted);
	display: flex;
	align-items: flex-start;
	gap: .4rem;
	line-height: 1.5;
}

.prep-list li::before {
	content: '';
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--amb);
	flex-shrink: 0;
	margin-top: 6px;
}

/* ── CTA ──────────────────────────── */
.cta {
	background: #1a3320;
	padding: 4rem 2rem;
	text-align: center;
}

.cta-t {
	font-family: var(--font-d);
	font-size: clamp(1.8rem, 3.5vw, 2.8rem);
	font-weight: 300;
	color: #fff;
	margin-bottom: .5rem;
}

.cta-t em {
	font-style: italic;
}

.cta-s {
	color: rgba(168, 200, 176, .72);
	font-size: .9rem;
	margin-bottom: 2rem;
}

.cta-btns {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}

/* ── FOOTER ───────────────────────── */
footer {
	background: #0d1a0d;
	padding: 4rem 2rem 2rem;
	border-top: 1px solid rgba(90, 158, 114, .15);
}

.fg {
	max-width: var(--max-w);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.5fr repeat(4, 1fr);
	gap: 2.5rem;
	margin-bottom: 3rem;
}

.fb {
	font-family: var(--font-d);
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--sand);
	margin-bottom: .5rem;
}

.fb em {
	color: var(--gold);
	font-style: italic;
}

.ft {
	font-size: .78rem;
	color: rgba(255, 255, 255, .35);
	line-height: 1.6;
	margin-bottom: 1.5rem;
}

.fso {
	display: flex;
	gap: .75rem;
}

.fso a {
	width: 32px;
	height: 32px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255, 255, 255, .4);
	font-size: .68rem;
	transition: background .2s, color .2s;
}

.fso a:hover {
	background: var(--amb);
	color: #fff;
	border-color: var(--amb);
}

.fct {
	font-size: .61rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .25);
	margin-bottom: 1rem;
	padding-bottom: .5rem;
	border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.fls {
	display: flex;
	flex-direction: column;
	gap: .4rem;
}

.fls a {
	font-size: .78rem;
	color: rgba(255, 255, 255, .4);
	transition: color .2s;
}

.fls a:hover {
	color: var(--sand);
}

.fbot {
	max-width: var(--max-w);
	margin: 0 auto;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, .06);
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem;
	font-size: .72rem;
	color: rgba(255, 255, 255, .25);
}

.hover-lodge {
	position: fixed;
	bottom: 35px;
	right: 30px;
}

.form-col {
	grid-column: span 2;
}

.form-group {
	margin-bottom: 20px;
}

.form-card {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 2rem;
}

.form-group label {
	font-size: .72rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	display: block;
	margin-bottom: .4rem;
}

.form-group input,
textarea,
select {
	width: 100%;
	padding: .65rem .9rem;
	border: 1px solid var(--border);
	font-family: var(--font-b);
	font-size: .88rem;
}

.btn-flex {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;

	input {
		flex: 1;
		justify-content: center;
		cursor: pointer;
	}
}

/* ── RESPONSIVE ───────────────────── */
@media(max-width:1024px) {
	.page {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.sidebar {
		position: static;
	}

	.prep-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.fg {
		grid-template-columns: 1fr 1fr;
	}
}

@media(max-width:768px) {
	.form-group {
		margin-bottom: 10px;
	}

	.nls {
		display: none;
	}

	.ham {
		display: flex;
	}

	.cards-grid {
		grid-template-columns: repeat(3, 1fr);
	}

	.prep-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.panel-hd {
		flex-direction: column;
	}

	.ph-stats {
		flex-direction: row;
		align-self: stretch;
		justify-content: flex-start;
	}

	.ph-stat {
		text-align: left;
		padding-left: .85rem;
		border-left: 2px solid var(--border);
		border-right: none;
		padding-right: 0;
	}

	.stop {
		grid-template-columns: 42px 1fr;
	}

	.page {
		padding: 2rem 1.25rem;
	}
}

@media(max-width:480px) {
	.cards-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.prep-grid {
		grid-template-columns: 1fr;
	}

	.fg {
		grid-template-columns: 1fr;
	}

	.hero {
		height: 45vh;
	}
}

/* Parks dropdown in the nav */
.nav-parks {
	position: relative;
	z-index: 1000;
}

.nav-parks>button {
	background: none;
	border: none;
	cursor: pointer;
	font-family: var(--font-b);
	color: rgba(255, 255, 255, .62);
	font-size: .71rem;
	font-weight: 400;
	letter-spacing: .07em;
	text-transform: uppercase;
	padding: .45rem .6rem;
	display: inline-flex;
	align-items: center;
	gap: .3rem;
}

.nav-parks>button::after {
	content: '▾';
	font-size: .8em;
	opacity: .6;
}

.nav-parks>button:hover {
	color: var(--sand);
}

.parks-menu {
	display: none;
	position: absolute;
	top: calc(100% + .8rem);
	left: 0;
	background: var(--white);
	border: 1px solid var(--border);
	box-shadow: 0 18px 50px rgba(13, 26, 13, .3);
	padding: 1.1rem 1.3rem;
	columns: 2;
	column-gap: 1.8rem;
	width: 520px;
	z-index: 9999;
}

.nav-parks.open .parks-menu {
	display: block;
}

.parks-menu a {
	display: block;
	break-inside: avoid;
	font-size: .78rem;
	color: var(--earth);
	padding: .3rem 0;
}

.parks-menu a:hover {
	color: var(--amber);
}

@media(max-width:768px) {
	.nav-links.show .nav-parks {
		width: 100%;
	}

	.parks-menu {
		position: static;
		width: 100%;
		columns: 1;
		box-shadow: none;
		background: transparent;
		border: none;
		padding: .2rem 0 .4rem 1rem;
	}

	.parks-menu a {
		color: rgba(255, 255, 255, .6);
	}
}

/* Enquiry section helpers */
.enquire-wrap {
	max-width: 620px;
	margin: 0 auto;
}

.whatsapp-line {
	margin-top: 1.4rem;
	font-size: .85rem;
	color: var(--muted);
	text-align: center;
}

.whatsapp-line a {
	color: var(--amber);
	font-weight: 500;
}

.whatsapp-line a:hover {
	color: var(--sienna);
}

.nav-byline {
	font-family: var(--font-d);
	font-size: .66rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gold);
	margin-top: .18rem;
	white-space: nowrap;
}

@media(max-width:420px) {
	.nav-byline {
		font-size: .62rem;
		letter-spacing: .1em;
	}
}

/* Floating WhatsApp pill */
.wa-float {
	position: fixed;
	right: 1.5rem;
	bottom: 1.5rem;
	z-index: 200;
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	background: #25D366;
	color: #fff;
	font-family: var(--font-b);
	font-size: .8rem;
	font-weight: 500;
	letter-spacing: .04em;
	padding: .7rem 1.15rem;
	border-radius: 999px;
	box-shadow: 0 6px 22px rgba(13, 26, 13, .28);
	transition: transform .2s, box-shadow .2s, background .2s;
}

.wa-float:hover {
	background: #1FB855;
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(13, 26, 13, .34);
}

.wa-float i {
	font-size: 1.35rem;
	line-height: 1;
}

@media(max-width:600px) {
	.wa-float {
		right: 1rem;
		bottom: 1rem;
		padding: .65rem 1rem;
		font-size: .75rem;
	}
}

/* Snippet (collapsible) section */
.snips {
	max-width: 100%;
}

.snips .faq-q span {
	font-family: var(--font-d);
	font-size: 1.1rem;
}

.snips .faq-a {
	font-size: .87rem;
	color: var(--earth);
}

.snips .faq-a p {
	margin-bottom: .9rem;
	line-height: 1.8;
}

.snips .faq-a h4 {
	font-family: var(--font-d);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--sienna);
	margin: 1.3rem 0 .5rem;
}

.snips .faq-a ul {
	margin: 0 0 .9rem 1.15rem;
	padding: 0;
}

.snips .faq-a li {
	margin-bottom: .3rem;
	line-height: 1.75;
}

.snips .faq-a ul ul {
	margin-top: .3rem;
}

.snips .faq-a ul ul li {
	color: var(--muted);
	font-size: .82rem;
}

.snips .faq-a table {
	border-collapse: collapse;
	width: 100%;
	margin: .5rem 0;
}

.snips .faq-a td {
	border: 1px solid var(--border);
	padding: .55rem .75rem;
	font-size: .83rem;
	color: var(--earth);
}

.snips .faq-a tr:first-child td {
	background: var(--dust);
	font-weight: 500;
	color: var(--ink);
	text-transform: uppercase;
	font-size: .7rem;
	letter-spacing: .08em;
}

.snips-actions {
	margin-bottom: 1.25rem;
}

.snips-toggle {
	background: none;
	border: none;
	cursor: pointer;
	font-family: var(--font-b);
	font-size: .7rem;
	font-weight: 500;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--amber);
	padding: 0;
}

.snips-toggle:hover {
	color: var(--sienna);
}

/* Mask empty trailing cells in the 3-up lodge grid */
.nwr-filler {
	background: var(--dust);
}

.park-map-wrap {
	max-width: var(--max-w);
	margin: 0 auto;
	padding-bottom: 3rem;
}

.park-map-wrap iframe {
	border: 1px solid var(--border);
	display: block;
	width: 100%;
}

div[id].section,
.faq-item[id] {
	scroll-margin-top: calc(var(--nav-h) + 16px);
}

/* Sticky gate search bar (pattern from the Fish River page, restyled) */
.gatebar {
	position: sticky;
	top: var(--nav-h);
	z-index: 100;
	background: var(--cream);
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	box-shadow: 0 4px 14px rgba(13, 26, 13, .06);
}

.gatebar-inner {
	max-width: var(--max-w);
	margin: 0 auto;
	padding: .65rem 2rem;
	display: flex;
	align-items: center;
	gap: .5rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.gatebar-inner::-webkit-scrollbar {
	display: none;
}

.gatebar-label {
	font-size: .62rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted);
	white-space: nowrap;
	margin-right: .3rem;
	flex-shrink: 0;
}

.gate-pill {
	font-family: var(--font-b);
	font-size: .7rem;
	font-weight: 500;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--sienna);
	background: var(--white);
	border: 1px solid var(--border);
	border-radius: 999px;
	padding: .38rem .95rem;
	white-space: nowrap;
	cursor: pointer;
	transition: all .2s;
	flex-shrink: 0;
}

.gate-pill:hover {
	border-color: var(--amber);
	color: var(--amber);
}

.gate-pill.active {
	background: var(--amber);
	border-color: var(--amber);
	color: var(--white);
}

.gate-note {
	font-size: .75rem;
	color: var(--muted);
	margin-top: 1rem;
	display: none;
}

.nwr-card.gate-match {
	outline: 2px solid var(--amber);
	outline-offset: -2px;
}

.gate-dist {
	font-size: .72rem;
	color: var(--muted);
	display: none;
}

.gate-dist strong {
	font-family: var(--font-d);
	font-size: .95rem;
	color: var(--earth);
	display: block;
}

/* Opened-out guide sections */
.gsec .prose {
	max-width: 46em;
	margin-top: 1.5rem;
}

.gsec .prose p {
	font-size: .9rem;
	color: var(--earth);
	line-height: 1.8;
	margin-bottom: 1rem;
}

.gsec .prose h3 {
	font-family: var(--font-d);
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--ink);
	margin: 2rem 0 .75rem;
}

.gsec .prose h4 {
	font-family: var(--font-d);
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--sienna);
	margin: 1.6rem 0 .5rem;
}

.gsec .prose h5 {
	font-size: .8rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--muted);
	margin: 1.2rem 0 .4rem;
}

.gsec .prose ul {
	margin: 0 0 1rem 1.2rem;
	padding: 0;
}

.gsec .prose li {
	font-size: .87rem;
	color: var(--earth);
	line-height: 1.75;
	margin-bottom: .35rem;
}

.gsec .prose ul ul {
	margin-top: .35rem;
	margin-bottom: .5rem;
}

.gsec .prose ul ul li {
	font-size: .82rem;
	color: var(--muted);
}

.gsec .prose table {
	border-collapse: collapse;
	width: 100%;
	margin: 1rem 0;
}

.gsec .prose td {
	border: 1px solid var(--border);
	padding: .6rem .8rem;
	font-size: .85rem;
	color: var(--earth);
}

.gsec .prose tr:nth-child(odd) td {
	background: var(--dust);
}

.gsec .prose a {
	color: var(--amber);
}

.gsec .prose a:hover {
	color: var(--sienna);
}

/* Madbookings byline under the site name */
.nav-logo {
	display: flex;
	flex-direction: column;
	justify-content: center;
	line-height: 1.12;
}

.nav-byline {
	font-family: var(--font-d);
	font-size: .66rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gold);
	margin-top: .18rem;
	white-space: nowrap;
}

@media(max-width:420px) {
	.nav-byline {
		font-size: .62rem;
		letter-spacing: .1em;
	}
}

/* ////////////////////////////////////////////////////////////////////////////////////////
/* ///////////////////////////// LODGE PAGES STYLING //////////////////////////////////////
/* ////////////////////////////////////////////////////////////////////////////////////////

/* Page header + side-by-side intro */
.lodge-head {
	padding: 2.5rem 2rem 0;
}

.lodge-head-inner {
	max-width: var(--max-w);
	margin: 0 auto;
}

.lodge-eyebrow {
	font-size: .7rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--amber);
	margin-bottom: .6rem;
}

.lodge-h1 {
	font-family: var(--font-d);
	font-weight: 600;
	color: var(--ink);
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1.12;
	margin-bottom: .4rem;
}

.lodge-h1 em {
	font-style: italic;
	color: var(--sienna);
}

.lodge-park {
	font-size: .9rem;
	color: var(--muted);
}

.intro-sec {
	padding: 2rem 2rem 4rem;
}

.intro-sec .si {
	max-width: var(--max-w);
	margin: 0 auto;
}

.intro-grid .intro-copy p {
	font-size: .95rem;
	line-height: 1.85;
	color: var(--earth);
	margin-bottom: 1rem;
}

.intro-actions {
	display: flex;
	gap: .7rem;
	flex-wrap: wrap;
	margin-top: 1.3rem;
}

@media(max-width:768px) {
	.intro-grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.overview-img {
		min-height: 220px;
	}
}

/* Sticky jump bar */
.jump-nav-inner a.active {
	color: var(--earth);
	border-bottom-color: var(--amber);
}

@media(max-width:768px) {
	.jump-nav-inner {
		padding: 0 1rem;
	}
}

/* Price collapsibles */
.price-item .faq-a {
	padding: 0 0 1.25rem;
}

.table-scroll {
	overflow-x: auto;
}

.price-item .pricing-table {
	min-width: 560px;
}

.price-item .faq-q span {
	font-size: 1rem;
}

/* Room blocks */
.rooms-wrap {
	display: flex;
	flex-direction: column;
	gap: 2px;
	background: var(--border);
}

.room-block {
	background: var(--white);
	padding: 2rem;
}

.room-block-head {
	display: flex;
	align-items: baseline;
	gap: .9rem;
	margin-bottom: 1rem;
}

.room-num {
	font-family: var(--font-d);
	font-size: .95rem;
	color: var(--amber);
	letter-spacing: .06em;
}

.room-block-name {
	font-family: var(--font-d);
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--ink);
}

.room-block-body {
	display: grid;
	grid-template-columns: 1.35fr 1fr;
	gap: 2.5rem;
}

.room-block-text p {
	font-size: .88rem;
	line-height: 1.85;
	color: var(--earth);
	margin-bottom: .9rem;
}

.room-block-fac {
	background: var(--dust);
	padding: 1.25rem 1.4rem;
}

.room-fac-title {
	font-size: .68rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--sienna);
	margin-bottom: .7rem;
}

.room-block-fac ul {
	margin: 0 0 0 1.1rem;
	padding: 0;
}

.room-block-fac li {
	font-size: .82rem;
	color: var(--earth);
	line-height: 1.7;
	margin-bottom: .3rem;
}

.room-photos {
	display: grid;
	gap: 2px;
	background: var(--border);
	margin-top: 1.2rem;
	height: 150px;
}

.room-photos .gthumb {
	overflow: hidden;
	cursor: pointer;
}

.room-photos img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}

.room-photos .gthumb:hover img {
	transform: scale(1.05);
}

@media(max-width:600px) {
	.room-photos {
		height: 110px;
	}
}

.room-actions {
	display: flex;
	gap: .5rem;
	flex-wrap: wrap;
	margin-top: 1.1rem;
}

.btn-sm {
	font-size: .68rem;
	padding: .5rem 1rem;
}

.pricing-table a {
	color: var(--amber);
	font-weight: 500;
	text-decoration: underline;
}

.pricing-table a:hover {
	color: var(--sienna);
}

.room-extra-links {
	margin-top: 2rem;
	display: flex;
	gap: .7rem;
	flex-wrap: wrap;
}

.room-extra-links .btn {
	max-width: 100%;
	text-align: center;
}

@media(max-width:600px) {
	.room-extra-links {
		flex-direction: column;
		align-items: stretch;
	}

	.room-extra-links .btn {
		white-space: normal;
		line-height: 1.4;
	}
}

@media(max-width:768px) {
	.room-block-body {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}

	.room-block {
		padding: 1.5rem 1.25rem;
	}
}

/* Gallery */
.gallery-strip {
	height: 210px;
}

.gthumb:hover img {
	transform: scale(1.05);
}

@media(max-width:768px) {
	.gallery-strip {
		height: 150px;
	}
}

/* Booking form */
.book-wrap {
	max-width: 900px;
	margin: 0 auto;
}

.form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.1rem;
}

.form-row-3 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 1.1rem;
}

.booking-card form {
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

.form-group label strong {
	font-weight: bold;
}

.form-group input,
.form-group textarea {
	width: 100%;
	font-family: var(--font-b);
	font-size: .9rem;
	color: var(--ink);
	background: var(--white);
	border: 1px solid var(--border);
	padding: .7rem .85rem;
}

.form-group input:focus,
.form-group textarea:focus {
	outline: 2px solid var(--amber);
	outline-offset: 1px;
	border-color: var(--amber);
}

.form-note {
	display: block;
	font-size: .72rem;
	color: var(--muted);
	margin-top: .35rem;
}

.form-hint {
	display: block;
	font-size: .75rem;
	color: var(--muted);
	margin-bottom: .4rem;
}

.form-check {
	display: flex;
	align-items: flex-start;
	gap: .6rem;
}

.form-check label {
	font-size: .82rem;
	color: var(--earth);
}

.form-check input {
	margin-top: .25rem;
}

.book-submit {
	margin-top: .4rem;
}

.book-submit input {
	font-family: var(--font-b);
	font-size: .8rem;
	font-weight: 500;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
	background: var(--amber);
	color: #fff;
	border: none;
	padding: .85rem 1.8rem;
}

.book-submit input:hover {
	background: var(--sienna);
}

@media(max-width:768px) {
	.form-row {
		grid-template-columns: 1fr;
	}

	.form-row-3 {
		grid-template-columns: 1fr;
	}
}

[id] {
	scroll-margin-top: calc(var(--nav-h) + 58px);
}


.map-head {
	padding: 2.5rem 2rem 0;
}

.map-head-inner {
	max-width: 900px;
	margin: 0 auto;
}

.map-eyebrow {
	font-size: .7rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--amber);
	margin-bottom: .6rem;
}

.map-h1 {
	font-family: var(--font-d);
	font-weight: 600;
	color: var(--ink);
	font-size: clamp(1.9rem, 4vw, 2.8rem);
	line-height: 1.12;
	margin-bottom: .4rem;
}

.map-park {
	font-size: .9rem;
	color: var(--muted);
	margin-bottom: 1.4rem;
}

.map-sec {
	padding: 2.5rem 2rem 5rem;
}

.map-sec-inner {
	max-width: 900px;
	margin: 0 auto;
}

.map-block {
	background: var(--white);
	border: 1px solid var(--border);
	padding: 1.8rem;
	margin-bottom: 1.5rem;
}

.map-block-title {
	font-family: var(--font-d);
	font-size: 1.35rem;
	font-weight: 600;
	color: var(--ink);
	margin-bottom: .8rem;
}

.map-answer {
	font-size: .92rem;
	line-height: 1.8;
	color: var(--earth);
}

.map-embed {
	margin-top: 1.2rem;
}

.map-embed iframe {
	border: 1px solid var(--border);
	display: block;
}

.map-static {
	margin-top: 1.2rem;
	background: var(--dust);
	padding: .5rem;
}

.map-static img {
	width: 100%;
	height: auto;
	display: block;
}

/* Map page additions */
.map-shot {
	border: 1px solid var(--border);
	overflow: hidden;
	box-shadow: 0 18px 50px rgba(13, 26, 13, .12);
}

.map-shot img {
	display: block;
	width: 100%;
	height: auto;
}

.map-embed {
	border: 1px solid var(--border);
	overflow: hidden;
}

.map-embed iframe {
	display: block;
	width: 100%;
	height: 450px;
	border: 0;
}

.gate-note {
	background: var(--dust);
	border-left: 3px solid var(--amber);
	padding: 1.5rem 1.75rem;
	max-width: 720px;
}

.gate-note p {
	font-size: .9rem;
	line-height: 1.8;
	color: var(--earth);
	margin: 0;
}

@media(max-width:600px) {
	.map-embed iframe {
		height: 320px;
	}
}

/* steps */
.step {
	border-top: 1px solid var(--border);
	padding: 3rem 0;
}

.step:first-of-type {
	border-top: none;
}

.step-head {
	display: flex;
	align-items: baseline;
	gap: .9rem;
	margin-bottom: .5rem;
}

.step-n {
	font-family: var(--font-d);
	font-size: 1rem;
	color: var(--white);
	background: var(--amber);
	width: 30px;
	height: 30px;
	flex: 0 0 30px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.step-title {
	font-family: var(--font-d);
	font-size: 1.6rem;
	font-weight: 600;
	color: var(--ink);
}

.hint {
	font-size: .87rem;
	color: var(--muted);
	max-width: 62ch;
	line-height: 1.75;
	margin-bottom: 1.5rem;
}

.hint strong {
	color: var(--earth);
	font-weight: 500;
}

.field {
	display: flex;
	flex-direction: column;
	gap: .4rem;
}

.field label {
	font-size: .68rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
}

.field select,
.field input[type=range] {
	font-family: var(--font-b);
	font-size: .9rem;
	color: var(--ink);
	background: var(--white);
	border: 1px solid var(--border);
	padding: .7rem .8rem;
}

.field select:focus {
	outline: 2px solid var(--amber);
	outline-offset: 1px;
}

.gates-row,
.controls {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.2rem;
	max-width: 720px;
}

/* camp picker */
#picks {
	display: flex;
	flex-direction: column;
	gap: .2rem;
}

.grouphead {
	font-size: .68rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--sienna);
	margin: 1.4rem 0 .7rem;
	padding-top: .8rem;
	border-top: 1px solid var(--border);
}

#picks>.grouphead:first-child {
	margin-top: 0;
	border-top: none;
	padding-top: 0;
}

.picks {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: .6rem;
}

.camp {
	position: relative;
	text-align: left;
	cursor: pointer;
	background: var(--white);
	border: 1px solid var(--border);
	padding: .85rem .95rem;
	font-family: var(--font-b);
	transition: border-color .15s, background .15s, transform .15s;
}

.camp:hover {
	border-color: var(--amber);
	transform: translateY(-1px);
}

.camp:focus-visible {
	outline: 2px solid var(--amber);
	outline-offset: 2px;
}

.camp .cn {
	display: block;
	font-family: var(--font-d);
	font-size: 1rem;
	font-weight: 600;
	color: var(--ink);
	padding-right: 1.6rem;
}

.camp .ct {
	display: block;
	font-size: .7rem;
	color: #48664f;
	margin-top: .1rem;
}

.camp .plus {
	display: block;
	font-size: .64rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--amber);
	margin-bottom: .45rem;
}

.camp .badge {
	position: absolute;
	top: .5rem;
	right: .5rem;
	font-family: var(--font-b);
	font-size: .68rem;
	font-weight: 500;
	color: var(--white);
	background: var(--amber);
	border-radius: 999px;
	padding: .2rem .55rem;
	white-space: nowrap;
	box-shadow: 0 1px 4px rgba(13, 26, 13, .25);
}

.camp .badge:empty {
	display: none;
}

.camp.used {
	border-color: var(--amber);
	background: var(--dust);
}

.camp.used .plus {
	color: var(--amber);
}

@media(max-width:1000px) {
	.picks {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media(max-width:760px) {
	.picks {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media(max-width:480px) {
	.picks {
		grid-template-columns: 1fr;
	}
}

/* route builder */
.route-build {
	margin-top: 1.6rem;
	background: var(--dust);
	padding: 1.4rem;
}

.rb-empty {
	font-size: .87rem;
	color: var(--muted);
	margin: 0;
}

#legList {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.leg-item {
	display: flex;
	align-items: center;
	gap: .75rem;
	background: var(--white);
	border: 1px solid var(--border);
	padding: .7rem .9rem;
}

.drag-handle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 26px;
	flex: 0 0 22px;
	cursor: grab;
	color: #93ab99;
	margin-left: -.2rem;
	touch-action: none;
	/* only the handle blocks scroll, so swiping a row still scrolls */
}

.drag-handle:active {
	cursor: grabbing;
}

.drag-handle svg {
	fill: currentColor;
}

.leg-item:hover .drag-handle {
	color: var(--amber);
}

.leg-item.dragging {
	opacity: .92;
	box-shadow: 0 10px 26px rgba(13, 26, 13, .22);
	border-color: var(--amber);
	position: relative;
	z-index: 5;
}

#legList.reordering .leg-item:not(.dragging) {
	transition: transform .12s ease;
}

.movers {
	display: inline-flex;
	flex-direction: column;
	gap: 2px;
}

.mv {
	width: 22px;
	height: 15px;
	padding: 0;
	line-height: 1;
	border: 1px solid var(--border);
	background: var(--white);
	color: var(--muted);
	cursor: pointer;
	font-size: .62rem;
}

.mv:hover:not(:disabled) {
	border-color: var(--amber);
	color: var(--amber);
}

.mv:disabled {
	opacity: .3;
	cursor: default;
}

@media(max-width:520px) {
	.leg-item {
		flex-wrap: wrap;
		gap: .5rem .6rem;
	}

	.lname {
		flex: 1 1 100%;
		order: 2;
	}

	.stepper {
		order: 3;
	}

	.movers {
		order: 4;
		margin-left: auto;
	}

	.rm {
		order: 5;
	}
}

.lnum {
	font-family: var(--font-d);
	font-size: .85rem;
	color: var(--white);
	background: var(--amber);
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.lname {
	flex: 1;
	font-size: .92rem;
	color: var(--ink);
	font-weight: 500;
}

.lname small {
	display: block;
	font-size: .7rem;
	color: var(--muted);
	font-weight: 400;
}

.stepper {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
}

.stepper button {
	width: 26px;
	height: 26px;
	border: 1px solid var(--border);
	background: var(--white);
	color: var(--earth);
	cursor: pointer;
	font-size: 1rem;
	line-height: 1;
}

.stepper button:hover {
	border-color: var(--amber);
	color: var(--amber);
}

.nn {
	font-size: .78rem;
	color: var(--earth);
	min-width: 62px;
	text-align: center;
}

.rm {
	background: none;
	border: none;
	cursor: pointer;
	color: var(--muted);
	font-size: .9rem;
	padding: .2rem .3rem;
}

.rm:hover {
	color: #a33;
}

.rb-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .5rem 1rem;
	margin-top: 1rem;
	flex-wrap: wrap;
}

.rb-count {
	font-size: .85rem;
	color: var(--earth);
}

.rb-hint {
	font-size: .74rem;
	color: #48664f;
	flex: 1 1 100%;
	order: 3;
}

.rb-clear {
	background: none;
	border: none;
	cursor: pointer;
	font-family: var(--font-b);
	font-size: .68rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--muted);
}

.rb-clear:hover {
	color: var(--amber);
}

.target-warn {
	display: none;
	margin-top: 1rem;
	font-size: .82rem;
	color: var(--sienna);
	background: var(--white);
	border-left: 3px solid var(--amber);
	padding: .7rem .9rem;
}

.build-row {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	flex-wrap: wrap;
	margin-top: 1.6rem;
}

.mini-note {
	font-size: .76rem;
	color: var(--muted);
	max-width: 46ch;
	line-height: 1.6;
}

/* results */
#results {
	display: none;
}

#results.on {
	display: block;
}

.summary {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 2px;
	background: var(--border);
	margin: 0 0 2rem;
}

.summary>div {
	background: var(--white);
	padding: 1.1rem 1.2rem;
}

.summary dt {
	font-size: .66rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: .3rem;
}

.summary dd {
	margin: 0;
	font-family: var(--font-d);
	font-size: 1.15rem;
	color: var(--ink);
}

@media(max-width:820px) {
	.summary {
		grid-template-columns: 1fr 1fr;
	}
}

.result-grid {
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 2rem;
	align-items: start;
}

@media(max-width:900px) {
	.result-grid {
		grid-template-columns: 1fr;
	}
}

.map-panel {
	background: var(--ink);
	padding: 1rem;
	position: sticky;
	top: calc(var(--nav-h) + 16px);
}

.map-panel svg {
	width: 100%;
	height: auto;
	display: block;
}

.map-caption {
	font-size: .7rem;
	color: rgba(255, 255, 255, .5);
	margin: .7rem 0 0;
	text-align: center;
}

.itin-row {
	display: grid;
	grid-template-columns: 92px 1fr;
	gap: 1rem;
	padding: 1.2rem 0;
	border-bottom: 1px solid var(--border);
}

.itin-row .day {
	font-size: .68rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--amber);
	padding-top: .25rem;
}

.itin-row h3 {
	font-family: var(--font-d);
	font-size: 1.2rem;
	font-weight: 600;
	color: var(--ink);
	margin: .15rem 0 .4rem;
}

.itin-row p {
	font-size: .86rem;
	color: var(--earth);
	line-height: 1.75;
	margin: 0;
}

.itin-row p a {
	color: var(--amber);
}

.itin-row .drive {
	font-size: .72rem;
	color: #48664f;
	letter-spacing: .04em;
}

.itin-row.gate-row h3 {
	color: var(--sienna);
}

.warnings {
	margin-top: 1.8rem;
	display: flex;
	flex-direction: column;
	gap: .6rem;
}

.warn {
	font-size: .84rem;
	color: var(--earth);
	line-height: 1.7;
	background: var(--dust);
	padding: .85rem 1rem;
	border-left: 3px solid var(--border);
}

.warn strong {
	color: var(--ink);
	font-weight: 500;
}

.warn.alert {
	background: #fdf6e6;
	border-left-color: var(--amber);
}

.share {
	margin-top: 3rem;
	background: var(--ink);
	color: var(--white);
	padding: 2.5rem;
}

.share .eyebrow {
	font-size: .68rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: .6rem;
}

.share h2 {
	font-family: var(--font-d);
	font-size: 1.9rem;
	font-weight: 600;
	margin-bottom: .6rem;
}

.share p {
	font-size: .9rem;
	color: rgba(255, 255, 255, .6);
	line-height: 1.75;
	max-width: 56ch;
}

.share .btns {
	display: flex;
	gap: .7rem;
	flex-wrap: wrap;
	margin-top: 1.5rem;
	align-items: center;
}

.share .btn-ghost {
	border-color: rgba(255, 255, 255, .4);
	color: #fff;
}

.copy-btn {
	background: none;
	border: none;
	cursor: pointer;
	font-family: var(--font-b);
	font-size: .72rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--gold);
}

.copy-btn:hover {
	color: var(--sand);
}

#copyNote {
	font-size: .75rem;
	color: var(--gold);
	margin-top: .8rem;
	min-height: 1em;
}

.planner-wrap {
	max-width: var(--max-w);
	margin: 0 auto;
	padding: 0 2rem;
}

@media(max-width:600px) {
	.planner-wrap {
		padding: 0 1.1rem;
	}

	.share {
		padding: 1.6rem;
	}
}