/* ============================================================
   Conejos River Anglers — original skin on the Bowman skeleton
   Palette: Espresso Timber / Valley Sand / Cutthroat Ember / Conejos Green
   Type: Bitter (display slab) + Figtree (body)
   ============================================================ */

:root {
  --ink: #241B12;
  --ink-2: #33271A;
  --paper: #F2EBDD;
  --paper-2: #E9E0CB;
  --card: #FBF8F0;
  --ember: #A8471F;
  --ember-deep: #8C3A18;
  --river: #2C4A3C;
  --river-deep: #223A2F;
  --stone: #77725E;
  --sand-on-dark: #E6DCC8;
  --sand-dim: rgba(230, 220, 200, 0.68);
  --line: rgba(36, 27, 18, 0.12);
  --display: 'Bitter', Georgia, serif;
  --body: 'Figtree', -apple-system, sans-serif;
  --shadow-card: 0 1px 2px rgba(36,27,18,.05), 0 8px 24px rgba(36,27,18,.08);
  --shadow-card-hover: 0 2px 4px rgba(36,27,18,.06), 0 18px 44px rgba(36,27,18,.14);
  --ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--body);
  font-weight: 400;
  font-size: clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
  line-height: 1.6;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
img { max-width: 100%; display: block; }
a { color: inherit; }

.container { max-width: 1180px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 44px); }

/* ---------- type ---------- */
h1, h2, h3, h4 { font-family: var(--display); }
h2 {
  font-size: clamp(1.75rem, 1.2rem + 2.4vw, 2.75rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.015em;
}
.kicker {
  font-size: clamp(0.6875rem, 0.65rem + 0.15vw, 0.75rem);
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ember-deep);
  margin-bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.kicker::before { content: ""; width: 26px; height: 2px; background: var(--ember); flex: none; }
.kicker-light { color: #D89A6E; }
.kicker-ember { color: #E8A87A; }
.section-sub { color: var(--stone); max-width: min(58ch, 100%); margin-top: 16px; }
.section-head { margin-bottom: clamp(32px, 5vw, 56px); }
.section-head h2 { max-width: min(24ch, 100%); }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-family: var(--body);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 14px 30px;
  border-radius: 3px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .22s var(--ease), background .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease), box-shadow .22s var(--ease);
  white-space: nowrap;
}
.btn-ember { background: var(--ember); border-color: var(--ember); color: #fff; }
.btn-ember:hover { background: var(--ember-deep); border-color: var(--ember-deep); transform: translateY(-2px); box-shadow: 0 10px 24px rgba(140,58,24,.28); }
.btn-ember-outline { background: transparent; border-color: rgba(168,71,31,.55); color: var(--ember-deep); }
.btn-ember-outline:hover { background: var(--ember); border-color: var(--ember); color: #fff; transform: translateY(-2px); }
.btn-river { background: var(--river); border-color: var(--river); color: #fff; }
.btn-river:hover { background: var(--river-deep); transform: translateY(-2px); }
.btn-outline-light { background: rgba(255,255,255,0.02); border-color: rgba(255,255,255,0.38); color: rgba(255,255,255,0.94); }
.btn-outline-light:hover { border-color: #fff; background: rgba(255,255,255,0.08); transform: translateY(-2px); }
.btn-lg { padding: 16px 38px; font-size: 0.8125rem; }
.btn-xl { padding: 18px 42px; font-size: 0.8125rem; }
.btn-nav { padding: 10px 22px; }
.btn-block { width: 100%; }

.skip-nav { position: absolute; left: -9999px; top: 0; background: var(--ink); color: #fff; padding: 10px 18px; z-index: 200; }
.skip-nav:focus { left: 0; }

/* ---------- nav ---------- */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: rgba(24, 17, 10, 0.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(230, 220, 200, 0.12);
}
.nav-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 14px clamp(20px, 4vw, 44px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.wordmark { text-decoration: none; line-height: 1; display: flex; flex-direction: column; }
.wordmark-top {
  font-family: var(--display);
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: 0.01em;
  color: var(--sand-on-dark);
}
.wordmark-bottom {
  font-family: var(--body);
  font-weight: 700;
  font-size: 0.615rem;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: #D89A6E;
  margin-top: 4px;
}
.nav-links { display: flex; gap: clamp(16px, 2.4vw, 32px); }
.nav-links a {
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-decoration: none;
  color: var(--sand-dim);
  transition: color .2s;
}
.nav-links a:hover { color: #fff; }
.nav-right { display: flex; align-items: center; gap: 20px; }
.nav-phone {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 0.8125rem; font-weight: 600;
  color: var(--sand-dim); text-decoration: none; transition: color .2s;
}
.nav-phone:hover { color: #fff; }
.menu-toggle { display: none; background: none; border: 0; width: 30px; height: 24px; position: relative; cursor: pointer; }
.menu-toggle span { position: absolute; left: 3px; right: 3px; height: 2px; background: var(--sand-on-dark); transition: transform .25s, opacity .25s; }
.menu-toggle span:nth-child(1) { top: 4px; }
.menu-toggle span:nth-child(2) { top: 11px; }
.menu-toggle span:nth-child(3) { top: 18px; }
body.nav-open .menu-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.nav-open .menu-toggle span:nth-child(2) { opacity: 0; }
body.nav-open .menu-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.mobile-nav {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99;
  background: var(--ink);
  padding: 110px clamp(24px, 6vw, 40px) 40px;
  flex-direction: column;
  gap: 8px;
}
.mobile-nav a {
  font-family: var(--display);
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--sand-on-dark);
  text-decoration: none;
  padding: 10px 0;
  border-bottom: 1px solid rgba(230,220,200,0.1);
}
.mobile-nav a.btn { font-family: var(--body); font-size: 0.8125rem; border-bottom: 0; margin-top: 18px; color: #fff; }
body.nav-open .mobile-nav { display: flex; }

/* ---------- hero ---------- */
.hero {
  position: relative;
  min-height: min(92vh, 940px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
}
.hero-bg {
  position: absolute; inset: 0;
  background-image: url('assets/img_006_1440x753.jpg');
  background-size: cover;
  background-position: center 30%;
}
.hero-scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(20,14,8,0.5) 0%, rgba(20,14,8,0.12) 34%, rgba(20,14,8,0.62) 78%, rgba(20,14,8,0.86) 100%),
    linear-gradient(76deg, rgba(20,14,8,0.55) 0%, rgba(20,14,8,0.12) 55%);
}
.hero-content {
  position: relative;
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  padding: clamp(130px, 16vh, 190px) clamp(20px, 4vw, 44px) clamp(36px, 5vh, 56px);
}
.hero-kicker {
  font-size: clamp(0.6875rem, 0.64rem + 0.2vw, 0.8125rem);
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: #E8A87A;
  margin-bottom: 20px;
}
.hero h1 {
  font-size: clamp(2.35rem, 1.35rem + 4.6vw, 4.35rem);
  font-weight: 900;
  line-height: 1.03;
  letter-spacing: -0.018em;
  max-width: 15.5em;
  text-wrap: balance;
  text-shadow: 0 2px 30px rgba(0,0,0,0.35);
}
.hero-sub {
  margin-top: 22px;
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.1875rem);
  font-weight: 400;
  line-height: 1.55;
  color: rgba(255,255,255,0.88);
  max-width: min(56ch, 100%);
}
.hero-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.hero-proof {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 14px 18px;
  margin-top: 30px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(255,255,255,0.82);
}
.hero-proof-item { display: inline-flex; align-items: center; gap: 8px; }
.stars { color: #E8A87A; letter-spacing: 2px; font-size: 0.75rem; }
.hero-proof-sep { width: 3px; height: 3px; border-radius: 50%; background: rgba(255,255,255,0.4); }
.hero-stats {
  position: relative;
  border-top: 1px solid rgba(255,255,255,0.18);
  background: rgba(20, 14, 8, 0.36);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.hero-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
}
.hero-stat {
  padding: clamp(18px, 2.4vw, 28px) clamp(14px, 2.5vw, 44px);
  border-left: 1px solid rgba(255,255,255,0.14);
}
.hero-stat:first-child { border-left: 0; }
.hero-stat strong {
  display: block;
  font-family: var(--display);
  font-size: clamp(1.45rem, 1.1rem + 1.4vw, 2.1rem);
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1;
}
.hero-stat span {
  display: block;
  margin-top: 7px;
  font-size: clamp(0.625rem, 0.6rem + 0.1vw, 0.6875rem);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.62);
}

/* ---------- river report ---------- */
.report { background: var(--river); color: var(--sand-on-dark); }
.report-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(36px, 5vw, 56px) clamp(20px, 4vw, 44px);
  display: grid;
  grid-template-columns: minmax(150px, 0.62fr) minmax(0, 2fr) minmax(170px, 0.9fr);
  gap: clamp(22px, 3.5vw, 52px);
  align-items: center;
}
.report-label {
  display: flex; align-items: center; gap: 10px;
  font-size: 0.6875rem; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(230,220,200,0.75);
}
.report-dot { width: 8px; height: 8px; border-radius: 50%; background: #7FBF9A; box-shadow: 0 0 0 4px rgba(127,191,154,0.18); flex: none; }
.report-quote {
  font-family: var(--display);
  font-size: clamp(1.02rem, 0.9rem + 0.55vw, 1.3rem);
  font-weight: 500;
  font-style: italic;
  line-height: 1.5;
  color: #F4EEDF;
  border: 0;
}
.report-flows { display: flex; gap: clamp(20px, 2.5vw, 36px); justify-content: flex-end; }
.report-flow strong {
  display: block;
  font-family: var(--display);
  font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.7rem);
  font-weight: 800;
  color: #fff;
  line-height: 1;
}
.report-flow span {
  display: block; margin-top: 6px;
  font-size: 0.625rem; font-weight: 600;
  letter-spacing: 0.13em; text-transform: uppercase;
  color: rgba(230,220,200,0.6);
  white-space: nowrap;
}

/* ---------- waters ---------- */
.waters { padding: clamp(64px, 9vw, 110px) 0; }
.waters-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(16px, 2vw, 24px);
}
.water-card {
  grid-column: span 4;
  background: var(--card);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
  display: flex;
  flex-direction: column;
}
.water-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-card-hover); }
.water-card-tall { grid-column: span 12; flex-direction: row; min-height: 380px; }
.water-card-tall .water-img { flex: 1.35; min-height: 100%; }
.water-card-tall .water-body { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 4vw, 56px); }
.water-img {
  height: 230px;
  background-size: cover;
  background-position: center;
}
.water-body { padding: clamp(20px, 2.5vw, 30px); position: relative; }
.water-num {
  font-family: var(--display);
  font-size: 0.8125rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--ember-deep);
  display: block;
  margin-bottom: 10px;
}
.water-num::after { content: ""; display: inline-block; vertical-align: middle; width: 34px; height: 1px; background: rgba(168,71,31,.4); margin-left: 10px; }
.water-card h3 {
  font-size: clamp(1.25rem, 1.1rem + 0.7vw, 1.7rem);
  font-weight: 800;
  letter-spacing: -0.01em;
  margin-bottom: 10px;
}
.water-card p { color: var(--stone); font-size: 0.9375rem; max-width: 52ch; }

/* ---------- trips ---------- */
.trips { padding: clamp(64px, 9vw, 110px) 0; background: var(--paper-2); }
.trips-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: clamp(32px, 5vw, 52px);
}
.trips-note { font-size: 0.875rem; color: var(--stone); max-width: 34ch; }
.trips-note a { color: var(--ember-deep); font-weight: 600; }
.trips-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2vw, 24px);
  align-items: stretch;
}
.trip-card {
  position: relative;
  background: var(--card);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.trip-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-card-hover); }
.trip-featured { outline: 2px solid var(--ember); outline-offset: -2px; }
.trip-badge {
  position: absolute;
  top: 14px; left: 14px;
  z-index: 2;
  background: var(--ember);
  color: #fff;
  font-size: 0.5938rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 100px;
}
.trip-img { height: clamp(190px, 24vw, 240px); background-size: cover; background-position: center 28%; }
.trip-body { padding: clamp(22px, 2.6vw, 30px); display: flex; flex-direction: column; flex: 1; }
.trip-body h3 { font-size: 1.3125rem; font-weight: 800; margin-bottom: 8px; }
.trip-desc { font-size: 0.9063rem; color: var(--stone); margin-bottom: 18px; }
.rate-list { list-style: none; margin: auto 0 20px; }
.rate-list li {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 0.875rem;
}
.rate-list li:last-child { border-bottom: 0; }
.rate-list span { color: var(--stone); font-weight: 500; flex: none; }
.rate-list em { flex: 1; border-bottom: 1px dotted rgba(36,27,18,0.22); transform: translateY(-4px); }
.rate-list strong { font-family: var(--display); font-size: 1.0625rem; font-weight: 800; flex: none; }
.rate-list-dark li { border-color: rgba(230,220,200,0.14); }
.rate-list-dark span { color: rgba(230,220,200,0.62); }
.rate-list-dark em { border-color: rgba(230,220,200,0.25); }
.rate-list-dark strong { color: #fff; }

/* ---------- stay & fish ---------- */
.stay {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  background: var(--ink);
  color: var(--sand-on-dark);
}
.stay-media { position: relative; min-height: 420px; }
.stay-img {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center 88%;
}
.stay-media::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(36,27,18,0) 40%, rgba(36,27,18,0.55) 78%, rgba(36,27,18,0.96) 100%);
}
.stay-content { padding: clamp(56px, 7vw, 96px) clamp(24px, 4.5vw, 72px); }
.stay-content h2 { color: #F4EEDF; max-width: 18ch; }
.stay-sub { margin-top: 18px; color: rgba(230,220,200,0.72); max-width: min(58ch, 100%); font-size: 0.9375rem; }
.stay-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(14px, 1.6vw, 22px);
  margin: 30px 0 34px;
}
.stay-pack {
  background: rgba(230,220,200,0.05);
  border: 1px solid rgba(230,220,200,0.13);
  border-radius: 6px;
  padding: 18px 20px;
}
.stay-pack h4 {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #F4EEDF;
  margin-bottom: 6px;
}
.stay-pack .rate-list { margin: 0; }
.stay-pack .rate-list li { padding: 6px 0; font-size: 0.8125rem; }
.stay-pack .rate-list strong { font-size: 0.9375rem; }

/* ---------- guides ---------- */
.guides { padding: clamp(64px, 9vw, 110px) 0; }
.guides-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(0, 1.6fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}
.guides-intro h2 { max-width: 14ch; }
.guides-intro > p { color: var(--stone); margin-top: 16px; max-width: 40ch; }
.guides-photo { margin-top: 28px; }
.guides-photo-img {
  aspect-ratio: 4 / 5;
  border-radius: 6px;
  background-size: cover;
  background-position: center 20%;
  box-shadow: var(--shadow-card);
}
.guides-photo-caption {
  display: block;
  margin-top: 10px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--stone);
}
.guides-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
  gap: clamp(14px, 1.8vw, 22px);
}
.guide-card {
  background: var(--card);
  border-radius: 6px;
  padding: clamp(22px, 2.4vw, 28px);
  box-shadow: var(--shadow-card);
  border-top: 3px solid var(--river);
}
.guide-card h4 {
  font-size: 1.1875rem;
  font-weight: 800;
  margin-bottom: 8px;
}
.guide-card p { font-size: 0.875rem; color: var(--stone); }

/* ---------- shop ---------- */
.shop { background: var(--ink); color: var(--sand-on-dark); padding: clamp(64px, 9vw, 110px) 0; }
.shop-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.shop-content h2 { color: #F4EEDF; max-width: 16ch; }
.shop-content > p { margin-top: 18px; color: rgba(230,220,200,0.72); max-width: min(52ch, 100%); font-size: 0.9375rem; }
.shop-list { list-style: none; margin: 24px 0 30px; }
.shop-list li {
  position: relative;
  padding: 9px 0 9px 30px;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #EFE8D8;
  border-bottom: 1px solid rgba(230,220,200,0.1);
}
.shop-list li:last-child { border-bottom: 0; }
.shop-list li::before {
  content: "";
  position: absolute;
  left: 2px; top: 17px;
  width: 14px; height: 6px;
  border-left: 2px solid #D89A6E;
  border-bottom: 2px solid #D89A6E;
  transform: rotate(-45deg) translateY(-4px);
}
.shop-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 200px 180px;
  gap: 14px;
}
.shop-photo { border-radius: 6px; background-size: cover; background-position: center; box-shadow: 0 14px 40px rgba(0,0,0,0.35); }
.shop-photo-a { grid-column: 1 / -1; }
.shop-photo-b { grid-column: 1 / -1; }

/* ---------- gallery ---------- */
.gallery { padding: clamp(64px, 9vw, 110px) 0 clamp(72px, 10vw, 120px); }
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: clamp(120px, 16vw, 210px);
  gap: clamp(12px, 1.6vw, 20px);
}
.g-item {
  position: relative;
  grid-column: span 4;
  border-radius: 6px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  box-shadow: var(--shadow-card);
}
.g-feature { grid-column: span 8; grid-row: span 2; }
.g-item:nth-child(2) { grid-row: span 2; }
.g-item figcaption {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 34px 16px 12px;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.92);
  background: linear-gradient(180deg, rgba(20,14,8,0) 0%, rgba(20,14,8,0.72) 100%);
}
.g-item figcaption::before {
  content: "";
  display: inline-block;
  width: 16px; height: 2px;
  background: #E8A87A;
  margin-right: 8px;
  vertical-align: middle;
}

/* ---------- faq ---------- */
.faq { padding: clamp(64px, 9vw, 110px) 0; background: var(--paper-2); }
.faq-layout {
  display: grid;
  grid-template-columns: minmax(240px, 0.8fr) minmax(0, 1.5fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}
.faq-left { position: sticky; top: 110px; }
.faq-left h2 { max-width: 12ch; }
.faq-cta-text { margin: 18px 0 16px; color: var(--stone); font-size: 0.9375rem; }
.faq-item {
  background: var(--card);
  border-radius: 6px;
  box-shadow: var(--shadow-card);
  margin-bottom: 12px;
  overflow: hidden;
}
.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 20px 54px 20px 24px;
  font-family: var(--display);
  font-size: 1.0313rem;
  font-weight: 700;
  position: relative;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: "+";
  position: absolute;
  right: 22px; top: 50%;
  transform: translateY(-50%);
  font-family: var(--body);
  font-size: 1.25rem;
  font-weight: 400;
  color: var(--ember-deep);
  transition: transform .25s var(--ease);
}
.faq-item[open] summary::after { content: "\2013"; }
.faq-item p { padding: 0 24px 22px; color: var(--stone); font-size: 0.9375rem; max-width: 62ch; }

/* ---------- final cta ---------- */
.final-cta {
  position: relative;
  padding: clamp(90px, 14vw, 170px) 0;
  color: #fff;
  text-align: center;
}
.final-cta-bg { position: absolute; inset: 0; background-size: cover; background-position: center 60%; }
.final-cta-scrim {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(20,14,8,0.72) 0%, rgba(20,14,8,0.55) 45%, rgba(20,14,8,0.82) 100%);
}
.final-cta-content { position: relative; max-width: 820px; margin: 0 auto; padding: 0 clamp(20px, 4vw, 44px); }
.final-cta-content .kicker { justify-content: center; }
.final-cta-content .kicker::before { background: #E8A87A; }
.final-cta h2 {
  font-size: clamp(1.9rem, 1.3rem + 2.8vw, 3.1rem);
  font-weight: 800;
  color: #fff;
  text-wrap: balance;
}
.final-cta p { margin-top: 18px; color: rgba(255,255,255,0.85); font-size: 1.0313rem; }
.final-cta-actions {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 14px;
  margin-top: 34px;
}
.final-cta-actions .btn-outline-light { text-transform: none; letter-spacing: 0.02em; font-size: 0.9063rem; font-weight: 500; }

/* ---------- footer ---------- */
.footer { background: var(--ink); color: var(--sand-dim); padding: clamp(48px, 6vw, 72px) 0 0; }
.footer-inner {
  display: grid;
  grid-template-columns: minmax(200px, 1fr) auto minmax(200px, 1fr);
  gap: clamp(28px, 4vw, 48px);
  align-items: start;
  padding-bottom: clamp(36px, 5vw, 56px);
}
.wordmark-footer .wordmark-top { font-size: 1.25rem; }
.footer-tagline { display: block; margin-top: 12px; font-size: 0.8125rem; color: var(--sand-dim); }
.footer-nav { display: flex; flex-direction: column; gap: 10px; }
.footer-nav a {
  font-family: var(--display);
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--sand-on-dark);
  text-decoration: none;
  transition: color .2s;
}
.footer-nav a:hover { color: #E8A87A; }
.footer-contact { display: flex; flex-direction: column; gap: 8px; justify-self: end; text-align: right; }
.footer-contact a { font-size: 0.9063rem; color: var(--sand-dim); text-decoration: none; transition: color .2s; }
.footer-contact a:hover { color: #fff; }
.footer-social { display: flex; gap: 14px; margin-top: 10px; justify-content: flex-end; }
.footer-social a { color: rgba(230,220,200,0.45); transition: color .2s; }
.footer-social a:hover { color: #E8A87A; }
.footer-legal {
  border-top: 1px solid rgba(230,220,200,0.12);
  padding-top: 20px;
  padding-bottom: 26px;
  font-size: 0.75rem;
  color: rgba(230,220,200,0.45);
}

/* ---------- mobile sticky ---------- */
.mobile-sticky {
  display: none;
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 90;
  background: rgba(24, 17, 10, 0.94);
  backdrop-filter: blur(10px);
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  gap: 10px;
  border-top: 1px solid rgba(230,220,200,0.14);
}
.mobile-sticky-phone {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px; height: 46px;
  border-radius: 3px;
  border: 1px solid rgba(230,220,200,0.3);
  color: var(--sand-on-dark);
}
.mobile-sticky-btn { flex: 1; }

/* ---------- reveal animation ---------- */
.reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: no-preference) {
  .js .reveal {
    opacity: 0;
    transform: translateY(34px);
    transition: opacity .7s var(--ease), transform .7s var(--ease);
  }
  .js .reveal.is-visible { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   FLUID RESPONSIVE — intentional at every width 320→1920
   ============================================================ */

@media (max-width: 1100px) {
  .guides-layout { grid-template-columns: minmax(230px, 0.9fr) minmax(0, 1.4fr); }
}

/* 2-col middle range: last card goes horizontal so nothing orphans */
@media (max-width: 1024px) and (min-width: 701px) {
  .trips-grid { grid-template-columns: repeat(2, 1fr); }
  .trip-card:nth-child(3) { grid-column: span 2; flex-direction: row; }
  .trip-card:nth-child(3) .trip-img { width: 44%; height: auto; min-height: 260px; }
  .trip-card:nth-child(3) .trip-body { flex: 1; }
}
@media (max-width: 700px) {
  .trips-grid { grid-template-columns: 1fr; }
  .trip-img { height: clamp(220px, 52vw, 320px); }
}
@media (max-width: 960px) and (min-width: 769px) {
  .waters-grid { grid-template-columns: repeat(2, 1fr); }
  .water-card { grid-column: span 1; }
  .water-card-tall { grid-column: span 2; }
  .water-card:nth-child(4) { grid-column: span 2; flex-direction: row; }
  .water-card:nth-child(4) .water-img { width: 44%; height: auto; min-height: 100%; }
  .water-card:nth-child(4) .water-body { flex: 1; }
}

@media (max-width: 960px) {
  .nav-links { display: none; }
  .report-inner { grid-template-columns: 1fr; gap: 18px; }
  .report-flows { justify-content: flex-start; }
  .stay { grid-template-columns: 1fr; }
  .stay-media { min-height: clamp(240px, 42vw, 380px); }
  .stay-media::after { background: linear-gradient(180deg, rgba(36,27,18,0) 62%, rgba(36,27,18,0.85) 100%); }
  .shop-layout { grid-template-columns: 1fr; }
  .shop-photos { grid-template-rows: clamp(170px, 30vw, 260px) clamp(150px, 26vw, 230px); }
  .guides-layout { grid-template-columns: 1fr; }
  .guides-intro h2 { max-width: 20ch; }
  .guides-photo { max-width: 420px; }
  .faq-layout { grid-template-columns: 1fr; }
  .faq-left { position: static; }
  .water-card-tall { flex-direction: column; min-height: 0; }
  .water-card-tall .water-img { min-height: clamp(200px, 36vw, 300px); }
}

@media (max-width: 768px) {
  .nav-phone { display: none; }
  .btn-nav { display: none; }
  .menu-toggle { display: block; }
  .hero { min-height: 88vh; }
  .hero-stats { grid-template-columns: repeat(2, 1fr); }
  .hero-stat { border-left: 0; border-top: 1px solid rgba(255,255,255,0.12); }
  .hero-stat:nth-child(even) { border-left: 1px solid rgba(255,255,255,0.12); }
  .hero-stat:nth-child(-n+2) { border-top: 0; }
  .waters-grid { grid-template-columns: 1fr; }
  .water-card, .water-card-tall, .waters-grid .water-card:nth-child(4) { grid-column: span 1; flex-direction: column; }
  .water-card .water-img, .waters-grid .water-card:nth-child(4) .water-img { width: 100%; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: clamp(130px, 30vw, 200px); }
  .g-item { grid-column: span 1; }
  .g-feature { grid-column: span 2; grid-row: span 2; }
  .g-item:nth-child(2) { grid-row: span 1; }
  .footer-inner { grid-template-columns: 1fr; }
  .footer-contact { justify-self: start; text-align: left; }
  .footer-social { justify-content: flex-start; }
  .mobile-sticky { display: flex; }
  .footer { padding-bottom: 60px; }
}

@media (max-width: 520px) {
  .hero-ctas .btn { width: 100%; }
  .final-cta-actions .btn { width: 100%; }
  .trips-head { flex-direction: column; align-items: flex-start; }
  .stay-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
