/* ============================================================
   Crumpler Mountain Resort — rugged Appalachian trail aesthetic
   Palette: deep forest pine + lime green logo accent
   ============================================================ */

:root, [data-theme="light"] {
  /* Surfaces — warm paper/canvas, like a trail map */
  --color-bg: #f5f1e8;
  --color-surface: #fbf8f1;
  --color-surface-2: #ffffff;
  --color-surface-offset: #ece5d6;
  --color-divider: #ddd3bf;
  --color-border: #cfc4ab;

  /* Text — near-black bark brown */
  --color-text: #211c14;
  --color-text-muted: #6b6151;
  --color-text-faint: #a89c84;
  --color-text-inverse: #f7f3ea;

  /* Primary — deep pine green */
  --color-primary: #265c40;
  --color-primary-hover: #1c4730;
  --color-primary-active: #143222;
  --color-primary-soft: #dfe8df;

  /* Accent — logo lime green */
  --color-accent: #85bf18;
  --color-accent-hover: #74a912;
  --color-accent-soft: #e6f1cf;
  --color-on-accent: #16270a;

  --radius-sm: 0.375rem;
  --radius-md: 0.625rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-full: 9999px;

  --transition-interactive: 200ms cubic-bezier(0.16, 1, 0.3, 1);

  --shadow-sm: 0 1px 3px rgba(33,28,20,.10);
  --shadow-md: 0 6px 20px rgba(33,28,20,.12);
  --shadow-lg: 0 18px 48px rgba(33,28,20,.22);

  --content-narrow: 680px;
  --content-default: 1040px;
  --content-wide: 1280px;

  --font-display: "Anton", "Arial Narrow", sans-serif;
  --font-body: "Roboto", "Helvetica Neue", sans-serif;

  /* Type scale */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.85rem);
  --text-sm: clamp(0.85rem, 0.8rem + 0.25vw, 0.95rem);
  --text-base: clamp(1rem, 0.96rem + 0.2vw, 1.1rem);
  --text-lg: clamp(1.15rem, 1rem + 0.6vw, 1.4rem);
  --text-xl: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem);
  --text-2xl: clamp(2.2rem, 1.4rem + 3vw, 3.8rem);
  --text-hero: clamp(3rem, 1.5rem + 7vw, 7rem);

  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem;
  --space-12:3rem; --space-16:4rem; --space-20:5rem; --space-24:6rem; --space-32:8rem;
}

[data-theme="dark"] {
  --color-bg: #15140f;
  --color-surface: #1c1a14;
  --color-surface-2: #232017;
  --color-surface-offset: #211e16;
  --color-divider: #2e2a20;
  --color-border: #3a3528;
  --color-text: #ece6d6;
  --color-text-muted: #9c947f;
  --color-text-faint: #6b6453;
  --color-text-inverse: #1c1a14;
  --color-primary: #5aa178;
  --color-primary-hover: #6fb88c;
  --color-primary-active: #4a8a64;
  --color-primary-soft: #23332a;
  --color-accent: #97d22a;
  --color-accent-hover: #a8e03c;
  --color-accent-soft: #28331a;
  --color-on-accent: #14200a;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.4);
  --shadow-md: 0 6px 20px rgba(0,0,0,.5);
  --shadow-lg: 0 18px 48px rgba(0,0,0,.6);
}

/* ---------- base ---------- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html {
  -webkit-text-size-adjust:none; text-size-adjust:none;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; scroll-behavior:smooth;
  scroll-padding-top:5rem;
}
body {
  min-height:100dvh; line-height:1.65;
  font-family:var(--font-body); font-size:var(--text-base);
  color:var(--color-text); background:var(--color-bg);
  overflow-x:hidden;
}
img,picture,video,svg { display:block; max-width:100%; height:auto; }
ul[role=list] { list-style:none; }
button { cursor:pointer; background:none; border:none; font:inherit; color:inherit; }
a { color:inherit; text-decoration:none; }
h1,h2,h3,h4 { line-height:1.05; text-wrap:balance; }
p { text-wrap:pretty; }

::selection { background:var(--color-accent-soft); color:var(--color-text); }
:focus-visible { outline:2px solid var(--color-accent); outline-offset:3px; border-radius:var(--radius-sm); }

a,button { transition:color var(--transition-interactive),background var(--transition-interactive),
  border-color var(--transition-interactive),box-shadow var(--transition-interactive),transform var(--transition-interactive); }

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

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- layout helpers ---------- */
.wrap { width:100%; max-width:var(--content-wide); margin-inline:auto; padding-inline:clamp(1.25rem,5vw,3rem); }
.narrow { max-width:var(--content-narrow); }
.section { padding-block:clamp(3.5rem,9vw,8rem); }
.eyebrow {
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--font-body); font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  font-size:var(--text-xs); color:var(--color-accent);
}
.eyebrow::before { content:""; width:1.75rem; height:2px; background:var(--color-accent); }
h2.section-title {
  font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  font-size:var(--text-2xl); letter-spacing:.01em; margin-top:var(--space-3);
  line-height:.95;
}
.lead { font-size:var(--text-lg); color:var(--color-text-muted); margin-top:var(--space-4); max-width:60ch; }

/* ---------- buttons ---------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-weight:700; font-size:var(--text-sm); letter-spacing:.02em;
  padding:.85rem 1.6rem; border-radius:var(--radius-full);
  text-transform:uppercase;
}
.btn-primary { background:var(--color-accent); color:var(--color-on-accent); box-shadow:var(--shadow-sm); }
.btn-primary:hover { background:var(--color-accent-hover); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-ghost { background:transparent; color:var(--color-text); border:2px solid var(--color-border); }
.btn-ghost:hover { border-color:var(--color-accent); color:var(--color-accent); }
.btn-light { background:#fff; color:var(--color-primary-active); }
.btn-light:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn svg { width:1.1em; height:1.1em; }

/* ---------- header ---------- */
.header {
  position:fixed; inset:0 0 auto 0; z-index:100;
  transition:transform .35s cubic-bezier(.16,1,.3,1), background .3s, box-shadow .3s, backdrop-filter .3s;
}
.header.scrolled {
  background:color-mix(in oklab, var(--color-bg) 88%, transparent);
  backdrop-filter:blur(14px); box-shadow:var(--shadow-sm);
  border-bottom:1px solid var(--color-divider);
}
.header.hide { transform:translateY(-100%); }
.nav { display:flex; align-items:center; justify-content:space-between; height:5rem; }
.brand { display:flex; align-items:center; gap:.7rem; font-family:var(--font-display); text-transform:uppercase; font-size:1.25rem; letter-spacing:.02em; }
.brand .mark { width:42px; height:42px; flex:none; }
.brand .brand-text { line-height:1; }
.brand .brand-sub { display:block; font-family:var(--font-body); font-weight:700; font-size:.6rem; letter-spacing:.22em; color:var(--color-accent); margin-top:3px; }
/* image logo */
.brand-logo { display:block; height:44px; width:auto; flex:none; }
.brand-logo.dark { display:none; }
.header.scrolled .brand-logo.light { display:none; }
.header.scrolled .brand-logo.dark { display:block; }
[data-theme="dark"] .header.scrolled .brand-logo.dark { display:none; }
[data-theme="dark"] .header.scrolled .brand-logo.light { display:block; }
.header:not(.scrolled) .nav-links a, .header:not(.scrolled) .theme-toggle { color:#fff; }

.nav-links { display:flex; align-items:center; gap:clamp(1rem,2vw,2rem); }
.nav-links a { font-size:var(--text-sm); font-weight:600; }
.nav-links a:not(.btn):hover { color:var(--color-accent); }
.nav-actions { display:flex; align-items:center; gap:1rem; }
.theme-toggle { width:2.5rem; height:2.5rem; display:grid; place-items:center; border-radius:var(--radius-full); border:1px solid transparent; }
.theme-toggle:hover { background:color-mix(in oklab,var(--color-text) 10%,transparent); }
.nav-toggle { display:none; width:2.75rem; height:2.75rem; place-items:center; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {
  content:""; display:block; width:24px; height:2px; background:currentColor; transition:.3s; position:relative;
}
.nav-toggle span::before { position:absolute; top:-7px; }
.nav-toggle span::after { position:absolute; top:7px; }

/* ---------- hero ---------- */
.hero { position:relative; min-height:100svh; display:flex; align-items:flex-end; color:#fff; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:-2; }
.hero-bg img { width:100%; height:100%; object-fit:cover; }
.hero::after {
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(15,25,18,.55) 0%, rgba(15,25,18,.15) 35%, rgba(15,25,18,.55) 75%, rgba(12,20,15,.92) 100%);
}
.hero-content { padding-block:clamp(6rem,14vh,11rem) clamp(3rem,8vh,6rem); }
.hero .est { font-weight:700; letter-spacing:.3em; text-transform:uppercase; font-size:var(--text-xs); color:#cfe6a0; }
.hero h1 { font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:var(--text-hero); line-height:.86; margin-top:var(--space-3); text-shadow:0 4px 30px rgba(0,0,0,.4); }
.hero h1 .accent { color:var(--color-accent); }
.hero .tagline { font-size:var(--text-lg); font-weight:500; max-width:40ch; margin-top:var(--space-5); color:#f0ede4; }
.hero-cta { display:flex; flex-wrap:wrap; gap:1rem; margin-top:var(--space-8); }
.hero-meta { display:flex; flex-wrap:wrap; gap:clamp(1.5rem,4vw,3.5rem); margin-top:var(--space-12); padding-top:var(--space-6); border-top:1px solid rgba(255,255,255,.25); }
.hero-meta .item .n { font-family:var(--font-display); font-size:var(--text-xl); color:#fff; line-height:1; }
.hero-meta .item .l { font-size:var(--text-xs); letter-spacing:.12em; text-transform:uppercase; color:#d8d3c6; margin-top:.35rem; }

/* ---------- intro / about ---------- */
.about-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.about-img { position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:4/5; }
.about-img img { width:100%; height:100%; object-fit:cover; }
.about-badge {
  position:absolute; left:-1rem; bottom:-1rem; background:var(--color-accent); color:var(--color-on-accent);
  font-family:var(--font-display); text-transform:uppercase; padding:1rem 1.4rem; border-radius:var(--radius-md);
  box-shadow:var(--shadow-md); line-height:.9; text-align:center;
}
.about-badge .big { display:block; font-size:2rem; }
.about-badge .small { font-size:.65rem; letter-spacing:.18em; font-family:var(--font-body); }
.prose p + p { margin-top:var(--space-4); }
.prose p { color:var(--color-text-muted); }

/* ---------- feature cards ---------- */
.grid-3 { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:var(--space-6); }
.grid-2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); gap:var(--space-6); }
.card {
  background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg);
  overflow:hidden; transition:transform var(--transition-interactive), box-shadow var(--transition-interactive), border-color var(--transition-interactive);
}
.card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--color-border); }
.feature { padding:var(--space-8); }
.feature .ico { width:3rem; height:3rem; border-radius:var(--radius-md); display:grid; place-items:center; background:var(--color-primary-soft); color:var(--color-primary); margin-bottom:var(--space-5); }
.feature .ico svg { width:1.6rem; height:1.6rem; }
.feature h3 { font-size:var(--text-lg); margin-bottom:var(--space-2); }
.feature p { color:var(--color-text-muted); font-size:var(--text-sm); }

/* section heads */
.section-head { max-width:var(--content-narrow); margin-bottom:var(--space-12); }
.section-head.center { margin-inline:auto; text-align:center; }
.section-head.center .eyebrow { justify-content:center; }

/* ---------- trail band ---------- */
.band { position:relative; color:#fff; overflow:hidden; }
.band-bg { position:absolute; inset:0; z-index:-2; }
.band-bg img { width:100%; height:100%; object-fit:cover; }
.band::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(110deg, rgba(20,34,24,.92) 0%, rgba(20,34,24,.72) 55%, rgba(20,34,24,.45) 100%); }
.band .section-title { color:#fff; }
.band .lead { color:#e4e0d6; }
.trail-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:var(--space-5); margin-top:var(--space-8); }
.trail-item { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.18); border-radius:var(--radius-md); padding:var(--space-6); backdrop-filter:blur(4px); }
.trail-item h3 { font-size:var(--text-lg); color:#fff; }
.trail-item .badge { display:inline-block; font-size:var(--text-xs); font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#cfe6a0; margin-bottom:.4rem; }
.trail-item p { color:#d8d3c6; font-size:var(--text-sm); margin-top:.4rem; }

/* ---------- cabins ---------- */
.cabin-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr)); gap:var(--space-8); }
.cabin {
  background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg);
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform var(--transition-interactive), box-shadow var(--transition-interactive), border-color var(--transition-interactive);
}
.cabin:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:var(--color-border); }
.cabin-photo { position:relative; aspect-ratio:3/2; overflow:hidden; }
.cabin-photo img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.cabin:hover .cabin-photo img { transform:scale(1.06); }
.cabin-sleeps {
  position:absolute; top:.85rem; right:.85rem; background:var(--color-accent); color:var(--color-on-accent);
  font-weight:700; font-size:var(--text-xs); letter-spacing:.04em; text-transform:uppercase;
  padding:.35rem .8rem; border-radius:var(--radius-full); box-shadow:var(--shadow-sm);
}
.cabin-tag {
  position:absolute; top:.85rem; left:.85rem; background:rgba(20,34,24,.85); color:#fff;
  font-family:var(--font-display); font-size:.95rem; letter-spacing:.05em;
  padding:.3rem .7rem; border-radius:var(--radius-sm);
}
.cabin-body { padding:var(--space-6); display:flex; flex-direction:column; flex:1; }
.cabin-body h3 { font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:var(--text-lg); letter-spacing:.02em; }
.cabin-beds { color:var(--color-text-muted); font-size:var(--text-sm); margin-top:.4rem; }
.cabin-amen { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:var(--space-4); }
.chip { font-size:var(--text-xs); font-weight:600; padding:.3rem .65rem; border-radius:var(--radius-full); background:var(--color-surface-offset); color:var(--color-text-muted); border:1px solid var(--color-divider); }
.cabin-foot { margin-top:auto; padding-top:var(--space-5); display:flex; flex-direction:column; gap:.6rem; }
.cabin-body h3 a { color:inherit; }
.cabin-body h3 a:hover { color:var(--color-accent); }
.cabin-btns { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.cabin-btns .btn { justify-content:center; padding-inline:1rem; }
@media (max-width:400px){ .cabin-btns { grid-template-columns:1fr; } }
.w3w {
  display:flex; align-items:center; gap:.6rem; font-size:var(--text-sm); font-weight:600;
  color:var(--color-primary); padding:.65rem .85rem; border-radius:var(--radius-md);
  background:var(--color-primary-soft); border:1px dashed var(--color-primary);
}
.w3w:hover { background:var(--color-primary); color:#fff; }
.w3w .w3w-sq { color:#e11b22; font-weight:900; flex:none; }
.w3w:hover .w3w-sq { color:#fff; }
.w3w .w3w-words { font-family:var(--font-body); }
.w3w-note { font-size:var(--text-xs); color:var(--color-text-faint); padding-inline:.2rem; }

/* ---------- stay options (rv/tent) ---------- */
.stay-card { display:grid; grid-template-columns:1fr 1fr; min-height:300px; }
.stay-card.rev { direction:rtl; }
.stay-card.rev > * { direction:ltr; }
.stay-card .photo { position:relative; overflow:hidden; }
.stay-card .photo img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.stay-card .info { padding:clamp(2rem,4vw,3.5rem); display:flex; flex-direction:column; justify-content:center; }
.stay-card .info h3 { font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:var(--text-xl); }
.stay-card .info p { color:var(--color-text-muted); margin-top:var(--space-3); font-size:var(--text-sm); }
.rate-list { margin-top:var(--space-5); display:flex; flex-direction:column; gap:.6rem; }
.rate { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; padding:.7rem 0; border-bottom:1px solid var(--color-divider); }
.rate .label { font-weight:600; font-size:var(--text-sm); }
.rate .price { font-family:var(--font-display); color:var(--color-accent); font-size:var(--text-lg); white-space:nowrap; }
.rate .price small { font-family:var(--font-body); color:var(--color-text-muted); font-size:var(--text-xs); font-weight:500; }

/* ---------- gallery ---------- */
.gallery { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:180px; gap:var(--space-3); }
.gallery a { overflow:hidden; border-radius:var(--radius-md); position:relative; }
.gallery img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.gallery a:hover img { transform:scale(1.08); }
.gallery .big { grid-column:span 2; grid-row:span 2; }
.gallery .tall { grid-row:span 2; }

/* ---------- shop / service split ---------- */
.split { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:var(--space-8); }
.svc-list { display:flex; flex-direction:column; gap:var(--space-4); margin-top:var(--space-5); }
.svc-item { display:flex; gap:var(--space-4); }
.svc-item .ico { flex:none; width:2.6rem; height:2.6rem; border-radius:var(--radius-md); display:grid; place-items:center; background:var(--color-accent-soft); color:var(--color-accent); }
.svc-item .ico svg { width:1.4rem; height:1.4rem; }
.svc-item h4 { font-size:var(--text-base); }
.svc-item p { font-size:var(--text-sm); color:var(--color-text-muted); }

/* ---------- contact ---------- */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); }
.contact-card { background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg); padding:clamp(1.75rem,4vw,2.75rem); }
.contact-row { display:flex; gap:var(--space-4); padding-block:var(--space-4); border-bottom:1px solid var(--color-divider); }
.contact-row:last-child { border-bottom:0; }
.contact-row .ico { flex:none; width:2.75rem; height:2.75rem; border-radius:var(--radius-md); display:grid; place-items:center; background:var(--color-primary-soft); color:var(--color-primary); }
.contact-row .ico svg { width:1.4rem; height:1.4rem; }
.contact-row .k { font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.1em; color:var(--color-text-faint); }
.contact-row .v { font-size:var(--text-lg); font-weight:600; }
.contact-row .v a:hover { color:var(--color-accent); }
.map-embed { border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--color-divider); min-height:340px; height:100%; }
.map-embed iframe { width:100%; height:100%; min-height:340px; border:0; display:block; }
.social-row { display:flex; gap:.75rem; margin-top:var(--space-5); }
.social-row a { width:2.75rem; height:2.75rem; border-radius:var(--radius-full); display:grid; place-items:center; background:var(--color-surface-offset); border:1px solid var(--color-divider); }
.social-row a:hover { background:var(--color-accent); color:var(--color-on-accent); border-color:var(--color-accent); transform:translateY(-2px); }
.social-row svg { width:1.3rem; height:1.3rem; }

/* directions */
.directions { background:var(--color-surface-offset); border:1px solid var(--color-divider); border-radius:var(--radius-lg); padding:clamp(1.5rem,4vw,2.5rem); margin-top:var(--space-8); }
.directions h3 { font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:var(--text-lg); margin-bottom:var(--space-4); }
.directions ol { padding-left:1.2rem; display:flex; flex-direction:column; gap:.7rem; }
.directions li { color:var(--color-text-muted); font-size:var(--text-sm); padding-left:.3rem; }
.directions .warn { color:var(--color-accent); font-weight:700; }

/* faq */
.faq { max-width:var(--content-narrow); margin-inline:auto; }
.faq details { border:1px solid var(--color-divider); border-radius:var(--radius-md); background:var(--color-surface); margin-bottom:var(--space-3); overflow:hidden; }
.faq summary { padding:var(--space-5) var(--space-6); font-weight:600; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; font-size:var(--text-base); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; font-size:1.5rem; color:var(--color-accent); transition:transform .25s; flex:none; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { padding:0 var(--space-6) var(--space-5); color:var(--color-text-muted); font-size:var(--text-sm); }

/* ---------- CTA strip ---------- */
.cta-strip { position:relative; color:#fff; overflow:hidden; text-align:center; }
.cta-strip-bg { position:absolute; inset:0; z-index:-2; }
.cta-strip-bg img { width:100%; height:100%; object-fit:cover; }
.cta-strip::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(15,25,18,.82), rgba(15,25,18,.9)); }
.cta-strip h2 { font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:var(--text-2xl); color:#fff; }
.cta-strip p { color:#e4e0d6; max-width:50ch; margin:var(--space-4) auto 0; }
.cta-strip .hero-cta { justify-content:center; }

/* ---------- footer ---------- */
.footer { background:#14110b; color:#cfc7b6; padding-block:var(--space-16) var(--space-8); }
[data-theme="dark"] .footer { background:#0e0d09; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:var(--space-10); }
.footer .brand { color:#fff; margin-bottom:var(--space-4); }
.footer p { font-size:var(--text-sm); color:#a59d8c; max-width:40ch; }
.footer h4 { font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.15em; color:#cfe6a0; margin-bottom:var(--space-4); }
.footer ul { display:flex; flex-direction:column; gap:.6rem; }
.footer a { font-size:var(--text-sm); color:#cfc7b6; }
.footer a:hover { color:#fff; }
.footer-bottom { margin-top:var(--space-12); padding-top:var(--space-6); border-top:1px solid rgba(255,255,255,.12); display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; font-size:var(--text-xs); color:#8a8270; }

/* ---------- reveal animation ---------- */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.reveal.in { opacity:1; transform:none; }

/* ---------- responsive ---------- */
@media (max-width:920px){
  .about-grid { grid-template-columns:1fr; }
  .about-img { aspect-ratio:16/10; max-width:560px; }
  .contact-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .gallery { grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
  .gallery .big { grid-column:span 2; grid-row:span 1; }
}
@media (max-width:760px){
  .nav-links {
    position:fixed; inset:5rem 0 auto 0; flex-direction:column; align-items:stretch;
    background:var(--color-surface); padding:var(--space-6); gap:var(--space-2);
    box-shadow:var(--shadow-lg); border-bottom:1px solid var(--color-divider);
    transform:translateY(-130%); transition:transform .35s cubic-bezier(.16,1,.3,1); z-index:99;
  }
  .nav-links.open { transform:none; }
  .header:not(.scrolled) .nav-links a { color:var(--color-text); }
  .nav-links a { padding:.65rem .25rem; border-bottom:1px solid var(--color-divider); }
  .nav-links a:last-child { border-bottom:0; }
  .nav-links .btn { justify-content:center; margin-top:var(--space-2); }
  .nav-toggle { display:grid; }
  .stay-card, .stay-card.rev { grid-template-columns:1fr; direction:ltr; }
  .stay-card .photo { aspect-ratio:16/10; position:relative; min-height:240px; }
}
@media (max-width:560px){
  .footer-grid { grid-template-columns:1fr; gap:var(--space-8); }
  .hero-meta { gap:var(--space-6) var(--space-8); }
  .gallery { grid-template-columns:1fr 1fr; }
}

/* ====================================================================
   CABIN DETAIL PAGES
   ==================================================================== */
.subhero {
  position:relative; padding-block:clamp(7rem,14vw,10rem) clamp(2.5rem,6vw,4rem);
  color:#fff; overflow:hidden;
}
.subhero-bg { position:absolute; inset:0; z-index:-2; }
.subhero-bg img { width:100%; height:100%; object-fit:cover; }
.subhero::after { content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(15,25,18,.55) 0%, rgba(15,25,18,.86) 100%); }
.crumbs { display:flex; align-items:center; gap:.5rem; font-size:var(--text-xs); font-weight:600;
  text-transform:uppercase; letter-spacing:.1em; color:#e4e0d6; margin-bottom:var(--space-4); }
.crumbs a { color:#cfe6a0; } .crumbs a:hover { color:#fff; }
.crumbs span { color:#a59d8c; }
.subhero h1 { font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  font-size:var(--text-3xl); line-height:.9; }
.subhero .sleeps-tag { display:inline-flex; align-items:center; gap:.5rem; margin-top:var(--space-4);
  background:var(--color-accent); color:var(--color-on-accent); font-weight:700; font-size:var(--text-sm);
  text-transform:uppercase; letter-spacing:.04em; padding:.45rem 1rem; border-radius:var(--radius-full); }

.cabin-layout { display:grid; grid-template-columns:1.6fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:start; }

/* gallery */
.cab-gallery { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-3); }
.cab-gallery a { overflow:hidden; border-radius:var(--radius-md); position:relative; aspect-ratio:3/2; display:block; }
.cab-gallery a.lead { grid-column:span 2; aspect-ratio:16/9; }
.cab-gallery img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.cab-gallery a:hover img { transform:scale(1.05); }

.cab-video { margin-top:var(--space-8); }
.cab-video h2 { font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  font-size:var(--text-xl); margin-bottom:var(--space-4); }
.video-frame { position:relative; aspect-ratio:16/9; border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid var(--color-divider); box-shadow:var(--shadow-md); }
.video-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }

/* sidebar */
.cab-side { position:sticky; top:6rem; display:flex; flex-direction:column; gap:var(--space-6);
  background:var(--color-surface); border:1px solid var(--color-divider);
  border-radius:var(--radius-lg); padding:clamp(1.5rem,3vw,2rem); box-shadow:var(--shadow-sm); }
.cab-side h2 { font-family:var(--font-display); font-weight:400; text-transform:uppercase; font-size:var(--text-lg); }
.spec { display:flex; flex-direction:column; gap:.3rem; }
.spec .k { font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.1em; color:var(--color-text-faint); }
.spec .v { font-size:var(--text-base); font-weight:600; color:var(--color-text); }
.cab-side .cabin-amen { margin-top:0; }
.cab-side .btn { width:100%; }

.other-cabins { display:flex; flex-wrap:wrap; gap:.5rem; }
.other-cabins a { font-size:var(--text-sm); font-weight:600; padding:.4rem .8rem; border-radius:var(--radius-full);
  background:var(--color-surface-offset); border:1px solid var(--color-divider); color:var(--color-text-muted); }
.other-cabins a:hover { background:var(--color-accent); color:var(--color-on-accent); border-color:var(--color-accent); }
.other-cabins a.current { background:var(--color-primary); color:#fff; border-color:var(--color-primary); }

@media (max-width:920px){
  .cabin-layout { grid-template-columns:1fr; }
  .cab-side { position:static; }
}
@media (max-width:560px){
  .cab-gallery { grid-template-columns:1fr; }
  .cab-gallery a, .cab-gallery a.lead { aspect-ratio:3/2; grid-column:auto; }
}

/* ====================================================================
   POWERED BY TOOFAST — footer credit
   ==================================================================== */
.tf-powered-by { font-size:var(--text-xs); color:#8a8270; letter-spacing:.02em; }
.tf-powered-by a { display:inline-flex; align-items:center; gap:.25rem; color:#cfc7b6; font-weight:700; }
.tf-powered-by a:hover { color:#fff; }
.tf-powered-by .tf-dot { width:.42rem; height:.42rem; border-radius:50%; background:#FF5026; display:inline-block; margin-left:.12rem; }

