/* ==========================================================================
   Three Hollows Ranch — core stylesheet
   Brand tokens per approved Style Guide (early-Arizona-sunset palette,
   "Refined Ranch" type: Fraunces / Work Sans / Oswald)
   ========================================================================== */

:root{
  /* Foundations */
  --ink:#23201C;
  --bone:#F5EEE1;
  --sand:#EDE1CC;
  --azure-deep:#14496A;
  /* Early-sunset sky */
  --sky:#2E86C0;
  --sky-light:#6FB0D6;
  --sky-tint:#B7D9EC;
  --peach:#F3CBA0;
  /* Sunset */
  --terra:#C25536;
  --ember:#E88A5C;
  --amber:#EDB65E;
  /* Land */
  --cedar:#5C6B4E;
  --sage:#93A176;
  --leather:#7A5236;
  --walnut:#402E20;
  --limestone:#D9C7A5;

  --muted:#6B6459;
  --line:rgba(35,32,28,.15);
  --line-light:rgba(245,238,225,.22);

  --container:1200px;
  --pad:40px;
  --section-y:120px;

  /* Pre-footer CTA: deep azure settling into sunset — dark enough for cream text */
  --cta-gradient:linear-gradient(115deg,#0F3A56 0%,#154A6C 30%,#4C4A61 55%,#9A4A37 80%,#C25536 96%,#D66C3B 100%);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
/* the off-canvas mobile nav sits beyond the right edge — keep it from widening the page */
html,body{overflow-x:hidden;max-width:100%}
body{margin:0;background:var(--bone);color:var(--ink);
  font-family:"Work Sans",system-ui,-apple-system,sans-serif;font-size:17px;line-height:1.7;
  -webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
ul{list-style:none;margin:0;padding:0}
/* Headings carry their own bottom spacing so body copy never crowds them.
   Values are in em so the gap scales with each heading's size. */
h1,h2,h3,h4,h5{font-family:"Fraunces",Georgia,serif;font-weight:600;line-height:1.1;margin:0 0 .5em}
h1{margin-bottom:.45em}
h3{margin-bottom:.6em}
h4{margin-bottom:.6em}
h5{margin-bottom:.75em}
/* A heading immediately followed by another heading should sit tighter. */
h1+h2,h2+h3,h3+h4{margin-top:-.1em}
p{margin:0 0 1.1em}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--pad)}
.center{text-align:center}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:999;background:var(--ink);color:var(--bone);padding:10px 16px}

/* ---------- Type helpers ---------- */
.eyebrow{font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.28em;
  font-weight:500;font-size:12.5px;color:var(--terra);margin:0 0 14px}
.eyebrow--light{color:#FFF3DC}
.eyebrow--gold{color:var(--amber)}
.lead{font-size:20px;line-height:1.6}
h2{font-size:clamp(28px,3.4vw,42px)}
h3{font-size:23px}
h4{font-size:19px}
.display{font-size:clamp(30px,4.2vw,50px);line-height:1.06}

/* ---------- Buttons ---------- */
.btn{display:inline-block;font-family:"Oswald",sans-serif;text-transform:uppercase;
  letter-spacing:.16em;font-size:13px;font-weight:500;padding:16px 32px;border:2px solid transparent;
  text-decoration:none;cursor:pointer;transition:.25s ease;white-space:nowrap}
.btn--primary{background:var(--terra);color:var(--bone);border-color:var(--terra)}
.btn--primary:hover{background:var(--ember);border-color:var(--ember)}
.btn--solid{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.btn--solid:hover{background:var(--leather);border-color:var(--leather)}
.btn--ghost{background:transparent;color:var(--bone);border-color:rgba(245,238,225,.7)}
.btn--ghost:hover{background:var(--bone);color:var(--ink);border-color:var(--bone)}
.btn--ghost-dark{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ghost-dark:hover{background:var(--ink);color:var(--bone)}

/* ---------- Sections ---------- */
.section{padding:var(--section-y) 0}
.section--sand{background:var(--sand)}
.section--azure{background:var(--azure-deep);color:var(--bone)}
.section-head{margin-bottom:56px;max-width:660px}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
/* supporting line under a section heading */
.sec-note{color:var(--muted);font-size:16.5px;max-width:60ch;margin:0}
.section-head.center .sec-note{margin-left:auto;margin-right:auto}
.section--azure .sec-note{color:rgba(245,238,225,.75)}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{position:fixed;inset:0 0 auto 0;z-index:100;transition:.3s ease;
  background:linear-gradient(to bottom,rgba(16,40,62,.55),rgba(16,40,62,0))}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:18px;padding-bottom:18px}
.brand{display:block;flex:0 0 auto}
.brand-logo{height:62px;width:auto;transition:.3s ease}
.brand-logo--dark{display:none}
.site-header.scrolled{background:var(--bone);box-shadow:0 1px 0 var(--line),0 6px 24px rgba(35,32,28,.07)}
.site-header.scrolled .brand-logo{height:50px}
.site-header.scrolled .brand-logo--light{display:none}
.site-header.scrolled .brand-logo--dark{display:block}

.primary-nav{display:flex;align-items:center;gap:34px}
.primary-nav ul{display:flex;gap:28px}
.primary-nav a{font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.14em;
  font-size:12.5px;font-weight:400;color:var(--bone);text-decoration:none;padding:6px 0;
  border-bottom:1px solid transparent;transition:.2s}
.primary-nav a:hover,.primary-nav a.is-current{border-bottom-color:var(--amber)}
.site-header.scrolled .primary-nav a{color:var(--ink)}
.site-header.scrolled .primary-nav a:hover,
.site-header.scrolled .primary-nav a.is-current{border-bottom-color:var(--terra)}
/* padding must live here: `.primary-nav a` above is more specific than `.nav-cta`
   alone, and would otherwise flatten the button to zero horizontal padding */
.primary-nav .nav-cta{padding:12px 24px;font-size:12px;color:var(--bone);
  border:2px solid var(--terra);border-radius:2px}
.primary-nav .nav-cta:hover{background:var(--ember);border-color:var(--ember)}
.site-header.scrolled .primary-nav .nav-cta{color:var(--bone)}

/* Pages with no hero image (Contact, Gallery) need a solid header from the start,
   otherwise the cream logo and nav sit on a cream background. */
body.solid-header .site-header{background:var(--bone);box-shadow:0 1px 0 var(--line),0 6px 24px rgba(35,32,28,.07)}
body.solid-header .brand-logo{height:50px}
body.solid-header .brand-logo--light{display:none}
body.solid-header .brand-logo--dark{display:block}
body.solid-header .primary-nav a{color:var(--ink)}
body.solid-header .primary-nav a:hover,
body.solid-header .primary-nav a.is-current{border-bottom-color:var(--terra)}
body.solid-header .primary-nav .nav-cta{color:var(--bone)}
body.solid-header .nav-toggle span{background:var(--ink)}
body.solid-header main{padding-top:96px}

/* Compact CTA that sits beside the hamburger on small screens.
   Hidden on desktop, where the full CTA lives inside the nav.
   Scoped to .header-inner so it outranks the responsive `.btn` size rules. */
.header-inner .nav-cta-mobile{display:none;padding:8px 14px;font-size:10.5px;
  letter-spacing:.12em;line-height:1.3;border-width:0;
  background:var(--terra);color:var(--bone)}
.header-inner .nav-cta-mobile:hover{background:var(--ember)}

.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:10px;gap:5px;flex-direction:column}
.nav-toggle span{display:block;width:26px;height:2px;background:var(--bone);transition:.25s}
.site-header.scrolled .nav-toggle span{background:var(--ink)}

/* ==========================================================================
   HERO
   ========================================================================== */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover}
.hero-scrim{position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(12,38,60,.86) 0%,rgba(12,38,60,.62) 38%,rgba(12,38,60,.20) 66%,rgba(58,44,30,.28) 100%)}
.hero-content{position:relative;color:var(--bone);padding-top:120px;padding-bottom:90px;max-width:1200px}
.hero h1{font-size:clamp(38px,5.6vw,74px);line-height:1.02;max-width:15ch;margin-bottom:0;
  text-shadow:0 2px 30px rgba(10,30,50,.4)}
.hero-sub{font-size:clamp(17px,1.5vw,20px);max-width:52ch;margin-top:26px;color:rgba(245,238,225,.94);
  text-shadow:0 1px 16px rgba(10,30,50,.4)}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:38px}
.hero-scroll{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);
  width:1px;height:56px;background:rgba(245,238,225,.35);overflow:hidden}
.hero-scroll span{display:block;width:100%;height:18px;background:var(--amber);animation:scrollCue 2.2s ease-in-out infinite}
@keyframes scrollCue{0%{transform:translateY(-20px)}50%{transform:translateY(56px)}100%{transform:translateY(-20px)}}

/* ==========================================================================
   PAGE HERO (interior pages - shorter than the home hero)
   ========================================================================== */
.page-hero{position:relative;min-height:62vh;display:flex;align-items:flex-end;overflow:hidden}
.page-hero .hero-media{position:absolute;inset:0}
.page-hero .hero-media img{width:100%;height:100%;object-fit:cover}
.page-hero-scrim{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(12,38,60,.62) 0%,rgba(12,38,60,.20) 42%,rgba(20,34,26,.72) 100%)}
.page-hero-content{position:relative;color:var(--bone);padding-top:150px;padding-bottom:66px}
.page-hero h1{font-size:clamp(32px,4.6vw,60px);line-height:1.04;max-width:18ch;margin-bottom:0;
  text-shadow:0 2px 26px rgba(10,30,50,.42)}

/* ---------- Narrow centered text block ---------- */
.narrow{max-width:760px}
.center-block{margin-left:auto;margin-right:auto;text-align:center}
.center-block .eyebrow{margin-left:auto;margin-right:auto}
.muted-lead{color:var(--muted);font-size:18px;max-width:60ch;margin-left:auto;margin-right:auto}

/* ---------- Land section (copy + stat block) ---------- */
.land-inner{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:start}
.land-copy p:last-child{color:var(--muted);margin-bottom:0}
.land-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.lstat{background:var(--sand);padding:26px 20px;text-align:center}
.lstat-num{display:block;font-family:"Fraunces",serif;font-weight:600;font-size:clamp(21px,2.2vw,29px);color:var(--leather)}
.lstat-label{display:block;font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.16em;
  font-size:11px;color:var(--muted);margin-top:8px;line-height:1.4}

/* ---------- Full-bleed figure ---------- */
.bleed-figure{margin:80px 0 0;position:relative}
.bleed-figure img{width:100%;height:clamp(280px,46vw,560px);object-fit:cover}
.bleed-figure figcaption{max-width:var(--container);margin:14px auto 0;padding:0 var(--pad);
  font-size:13.5px;color:var(--muted);font-style:italic}

/* ---------- Feature cards (Signature Country) ---------- */
.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.feature{border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;transition:.3s ease}
.feature:hover{box-shadow:0 18px 40px rgba(35,32,28,.12);transform:translateY(-4px)}
.feature-media{aspect-ratio:4/3;overflow:hidden;background:var(--limestone)}
.feature-media img{width:100%;height:100%;object-fit:cover;transition:.6s ease}
.feature:hover .feature-media img{transform:scale(1.05)}
.feature-body{padding:30px 32px 34px}
.feature-body h3{margin-bottom:.55em}
.feature-body p{color:var(--muted);font-size:16px;margin:0}

/* ---------- Generic split (copy + media) ---------- */
.split-inner{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.split-media img{width:100%;aspect-ratio:4/3;object-fit:cover}
.split-copy p{margin-bottom:1.1em}
.split-copy .btn{margin-top:12px}
.section--azure .split-copy p{color:rgba(245,238,225,.85)}
.section:not(.section--azure) .split-copy p{color:var(--muted)}
.section:not(.section--azure) .split-copy h2{color:var(--ink)}

/* ==========================================================================
   STATS
   ========================================================================== */
.stats{background:var(--ink);color:var(--bone)}
/* dividers come from borders, not a gap-background, so the container padding stays clean */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:40px 22px;text-align:center;border-left:1px solid rgba(245,238,225,.15)}
.stat:first-child{border-left:0}
.stat-num{display:block;font-family:"Fraunces",serif;font-weight:600;font-size:clamp(24px,2.6vw,34px);color:var(--amber)}
.stat-label{display:block;font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.2em;
  font-size:11.5px;color:rgba(245,238,225,.75);margin-top:10px}

/* ==========================================================================
   INTRO
   ========================================================================== */
.intro-inner{max-width:820px}
.intro .lead{margin-bottom:1.2em}
.intro p:last-child{color:var(--muted);margin-bottom:0}

/* ==========================================================================
   PILLARS
   ========================================================================== */
.pillar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.pillar{text-decoration:none;color:inherit;display:flex;flex-direction:column;background:var(--bone);
  border:1px solid var(--line);transition:.3s ease}
.pillar:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(35,32,28,.13)}
.pillar-media{aspect-ratio:4/3;overflow:hidden;background:var(--limestone)}
.pillar-media img{width:100%;height:100%;object-fit:cover;transition:.6s ease}
.pillar:hover .pillar-media img{transform:scale(1.05)}
.pillar-body{padding:30px 30px 34px}
.pillar-body p{color:var(--muted);font-size:16px;margin:0 0 18px}
.link-arrow{font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.16em;
  font-size:12px;color:var(--terra)}
.link-arrow::after{content:" →";transition:.25s}
.pillar:hover .link-arrow::after{padding-left:6px}

/* ==========================================================================
   WILDLIFE
   ========================================================================== */
.wildlife-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.wildlife-copy p{color:rgba(245,238,225,.85)}
.species{display:grid;grid-template-columns:repeat(2,1fr);gap:0 30px;margin:32px 0 38px}
.species li{font-family:"Work Sans",sans-serif;font-size:15.5px;padding:11px 0;
  border-bottom:1px solid var(--line-light);color:var(--bone)}
.wildlife-media img{width:100%;aspect-ratio:3/4;object-fit:cover}

/* ==========================================================================
   LODGING
   ========================================================================== */
.lodging-inner{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.lodging-media img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 32%}
.lodging-copy p{color:var(--muted)}
.lodging-copy .btn{margin-top:10px}

/* ==========================================================================
   AUDIENCE
   ========================================================================== */
.aud-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px}
.aud{padding-top:24px;border-top:2px solid var(--leather)}
.aud h4{margin-bottom:.55em}
.aud p{color:var(--muted);font-size:15.5px;margin:0}

/* ==========================================================================
   GALLERY STRIP
   ========================================================================== */
.gallery-strip{padding-bottom:80px}
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 48px}
.strip figure{margin:0;overflow:hidden;aspect-ratio:3/4}
.strip img{width:100%;height:100%;object-fit:cover;transition:.6s ease}
.strip figure:hover img{transform:scale(1.06)}

/* ==========================================================================
   SPECIES (Wildlife page)
   ========================================================================== */
.species-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.species-card{margin:0;position:relative;overflow:hidden;background:var(--limestone)}
.species-card img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:.6s ease}
.species-card:hover img{transform:scale(1.05)}
.species-card figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;
  font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.16em;font-size:12.5px;
  color:var(--bone);background:linear-gradient(to top,rgba(12,26,38,.88),rgba(12,26,38,0))}
.species-more{margin-top:56px;padding-top:38px;border-top:1px solid var(--line)}
.species-more h3{font-size:19px;margin-bottom:20px}
.species-list{display:grid;grid-template-columns:repeat(4,1fr);gap:10px 30px}
.species-list li{font-size:16px;padding:10px 0;border-bottom:1px solid var(--line);color:var(--ink)}

/* ---------- Steps (trophy care) ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.steps li{padding-top:22px;border-top:2px solid var(--leather)}
.step-n{display:block;font-family:"Oswald",sans-serif;font-size:12px;letter-spacing:.2em;color:var(--terra);margin-bottom:10px}
.steps h4{margin-bottom:.55em}
.steps p{color:var(--muted);font-size:15.5px;margin:0}

/* ==========================================================================
   LODGING extras
   ========================================================================== */
.quote-section{padding-top:0}
.pullquote{margin:0;max-width:860px;margin-left:auto;margin-right:auto;text-align:center;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:52px 20px}
.pullquote p{font-family:"Fraunces",serif;font-size:clamp(20px,2.4vw,28px);line-height:1.45;
  font-style:italic;color:var(--ink);margin:0 0 22px}
.pullquote cite{font-family:"Oswald",sans-serif;font-style:normal;text-transform:uppercase;
  letter-spacing:.24em;font-size:11.5px;color:var(--terra)}
.amenities{display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px;max-width:960px;margin:0 auto}
.amenities li{padding:14px 0 14px 26px;border-bottom:1px solid var(--line-light);position:relative;
  color:var(--bone);font-size:16px}
.amenities li::before{content:"";position:absolute;left:0;top:23px;width:9px;height:9px;
  background:var(--amber);transform:rotate(45deg)}

/* ==========================================================================
   GALLERY page
   ========================================================================== */
.page-intro{padding-bottom:40px}
.page-intro h1{margin-bottom:.4em}
.gallery-section{padding:0 0 96px}
.masonry{columns:4;column-gap:8px;padding:0 8px}
.masonry figure{margin:0 0 8px;break-inside:avoid;overflow:hidden;cursor:zoom-in;background:var(--limestone)}
.masonry img{width:100%;height:auto;display:block;transition:transform .5s ease,opacity .3s ease}
.masonry figure:hover img{transform:scale(1.03);opacity:.94}

/* ---------- Lightbox ---------- */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(12,22,32,.94);
  display:flex;align-items:center;justify-content:center;padding:40px}
.lightbox[hidden]{display:none}
.lightbox img{max-width:92vw;max-height:88vh;object-fit:contain;box-shadow:0 20px 70px rgba(0,0,0,.5)}
.lb-close,.lb-prev,.lb-next{position:absolute;background:none;border:0;color:var(--bone);cursor:pointer;
  font-size:44px;line-height:1;padding:14px 20px;opacity:.75;transition:.2s}
.lb-close:hover,.lb-prev:hover,.lb-next:hover{opacity:1}
.lb-close{top:10px;right:18px;font-size:38px}
.lb-prev{left:8px;top:50%;transform:translateY(-50%);font-size:60px}
.lb-next{right:8px;top:50%;transform:translateY(-50%);font-size:60px}

/* ==========================================================================
   CONTACT page
   ========================================================================== */
.section-tight{padding:0 0 24px}
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ccard{display:flex;flex-direction:column;gap:6px;padding:30px 32px;text-decoration:none;color:inherit;
  background:var(--sand);border:1px solid var(--line);transition:.25s}
a.ccard:hover{background:var(--limestone);transform:translateY(-3px)}
.ccard-label{font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.2em;
  font-size:11px;color:var(--terra)}
.ccard-value{font-family:"Fraunces",serif;font-weight:600;font-size:20px;word-break:break-word}
.ccard-note{font-size:13.5px;color:var(--muted)}

.form-inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:start}
.form-copy p{color:var(--muted)}
.form-points{margin-top:24px}
.form-points li{padding:11px 0 11px 24px;border-bottom:1px solid var(--line);position:relative;font-size:15.5px}
.form-points li::before{content:"";position:absolute;left:0;top:20px;width:8px;height:8px;
  background:var(--cedar);transform:rotate(45deg)}

.inquiry-form{background:#fff;border:1px solid var(--line);padding:38px 38px 34px}
.field{margin-bottom:20px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field label{display:block;font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.14em;
  font-size:11.5px;color:var(--muted);margin-bottom:8px}
.req{color:var(--terra)}
.field input,.field select,.field textarea{width:100%;font-family:inherit;font-size:16px;color:var(--ink);
  background:var(--bone);border:1px solid var(--line);padding:13px 15px;transition:.18s;border-radius:2px}
.field textarea{resize:vertical;line-height:1.6}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--sky);
  box-shadow:0 0 0 3px rgba(46,134,192,.15);background:#fff}
.field input.invalid{border-color:var(--terra);box-shadow:0 0 0 3px rgba(194,85,54,.14)}
.hp{position:absolute;left:-9999px}
.inquiry-form .btn{width:100%;margin-top:6px;border:0;cursor:pointer}
.form-fallback{font-size:13.5px;color:var(--muted);margin:18px 0 0;text-align:center}
.form-status{margin:14px 0 0;font-size:14.5px;text-align:center;display:none}
.form-status.show{display:block}
.form-status.ok{color:var(--cedar)}
.form-status.err{color:var(--terra)}

.map-frame{border:1px solid var(--line);overflow:hidden;background:var(--limestone)}
.map-frame iframe{width:100%;height:clamp(300px,42vw,480px);border:0;display:block}
.map-note{font-size:13.5px;color:var(--muted);margin-top:12px;text-align:center;font-style:italic}

/* ==========================================================================
   CTA
   ========================================================================== */
.cta{position:relative;background:var(--cta-gradient);color:var(--bone);padding:110px 0;text-align:center;isolation:isolate}
/* light, even scrim — the deep-azure base already carries most of the contrast */
.cta::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(12,34,52,.16)}
.cta-inner{max-width:640px;margin:0 auto}
.cta h2{margin-bottom:.45em;text-shadow:0 2px 24px rgba(16,45,70,.28)}
.cta p{color:#FDFAF3;text-shadow:0 1px 14px rgba(16,45,70,.3)}
.cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:30px}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{background:var(--ink);color:rgba(245,238,225,.8);padding:80px 0 30px;font-size:15px}
.footer-inner{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px;padding-bottom:50px}
.footer-logo{height:86px;width:auto;margin-bottom:22px}
.footer-brand p{max-width:38ch;color:rgba(245,238,225,.6)}
.footer-col h5{font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.2em;
  font-size:11.5px;color:var(--amber);margin-bottom:18px;font-weight:500}
.footer-col li{margin-bottom:10px}
.footer-col a{text-decoration:none;transition:.2s}
.footer-col a:hover{color:var(--amber)}
.footer-base{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  border-top:1px solid rgba(245,238,225,.15);padding-top:26px;
  font-size:12.5px;color:rgba(245,238,225,.5)}

/* ==========================================================================
   REVEAL
   ========================================================================== */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero-scroll span{animation:none}
  html{scroll-behavior:auto}
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1024px){
  :root{--section-y:88px;--pad:28px}
  .land-inner,.split-inner{grid-template-columns:1fr;gap:44px}
  .split-media{order:2}
  .split-media img{aspect-ratio:16/10}
  .feature-grid{grid-template-columns:1fr;gap:26px}
  .bleed-figure{margin-top:56px}
  .page-hero{min-height:52vh}
  .page-hero-content{padding-top:130px}
  .wildlife-inner,.lodging-inner{grid-template-columns:1fr;gap:44px}
  .lodging-media{order:2}
  .wildlife-media img,.lodging-media img{aspect-ratio:4/3}
  .pillar-grid{grid-template-columns:1fr;gap:26px}
  .pillar-media{aspect-ratio:16/9}
  .aud-grid{grid-template-columns:repeat(2,1fr);gap:28px}
  .footer-inner{grid-template-columns:1fr 1fr;gap:40px}
  .strip{grid-template-columns:repeat(2,1fr)}
  .species-grid{grid-template-columns:repeat(2,1fr)}
  .species-list{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .amenities{grid-template-columns:repeat(2,1fr);gap:0 28px}
  .masonry{columns:3}
  .contact-cards{grid-template-columns:1fr}
  .form-inner{grid-template-columns:1fr;gap:44px}
}
@media (max-width:820px){
  .nav-toggle{display:flex}
  /* push the compact CTA and hamburger together on the right */
  .header-inner .nav-cta-mobile{display:inline-block;margin-left:auto;margin-right:4px}
  .primary-nav{position:fixed;inset:0 0 0 auto;width:min(84vw,360px);background:var(--azure-deep);
    flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;padding:60px 40px;
    transform:translateX(100%);transition:transform .35s ease;box-shadow:-20px 0 60px rgba(0,0,0,.3)}
  .primary-nav.open{transform:none}
  .primary-nav ul{flex-direction:column;gap:6px;width:100%}
  .primary-nav a{color:var(--bone);font-size:16px;letter-spacing:.16em;padding:12px 0;display:block}
  .site-header.scrolled .primary-nav a{color:var(--bone)}
  /* inside the dark off-canvas drawer, links stay cream on every page */
  body.solid-header .primary-nav a{color:var(--bone)}
  body.solid-header main{padding-top:84px}
  .nav-cta{margin-top:18px}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(odd){border-left:0}
  .stat:nth-child(n+3){border-top:1px solid rgba(245,238,225,.15)}
  .hero{min-height:90vh}
  .hero-content{padding-top:140px}
}
@media (max-width:520px){
  :root{--pad:20px;--section-y:70px}
  .land-stats{grid-template-columns:1fr 1fr}
  .lstat{padding:20px 12px}
  .aud-grid,.footer-inner{grid-template-columns:1fr}
  .species{grid-template-columns:1fr}
  .strip{grid-template-columns:1fr 1fr;gap:4px}
  .btn{padding:14px 24px;font-size:12px}
  .hero-actions .btn{width:100%;text-align:center}
  .brand-logo{height:48px}
  .species-grid{grid-template-columns:1fr 1fr;gap:12px}
  .species-list,.steps,.amenities{grid-template-columns:1fr}
  .masonry{columns:2;column-gap:5px;padding:0 5px}
  .masonry figure{margin-bottom:5px}
  .field-row{grid-template-columns:1fr;gap:0}
  .inquiry-form{padding:26px 22px 24px}
  .pullquote{padding:38px 8px}
  .lightbox{padding:16px}
  .lb-prev,.lb-next{font-size:42px;padding:10px 12px}
}