/* ─────────────────────────── Liz's Safari — front door ───────────────────────────
   Warm lodge light. Teak, cream, amber, leaf. Nothing decorative that isn't earned.
──────────────────────────────────────────────────────────────────────────────── */

:root{
  --cream:#fbf5ea;
  --sand:#f2e6cf;
  --paper:#fffdf8;
  --teak:#4a2f1b;
  --ink:#241a10;
  --ink-soft:#6b5842;
  --ink-faint:#a3927b;
  --amber:#c0761d;
  --amber-hot:#e09433;
  --leaf:#3f6b3a;
  --deep:#14110c;
  --line:rgba(74,47,27,.16);

  --shell:min(1180px,92vw);
  --r:18px;
  --ease:cubic-bezier(.22,.68,.28,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--cream);color:var(--ink);
  font-family:"Satoshi",ui-sans-serif,system-ui,sans-serif;
  font-size:clamp(1rem,.55vw + .9rem,1.09rem);line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,video{display:block;max-width:100%}
a{color:inherit}

h1,h2,h3,.display{
  font-family:"Bespoke Slab","Satoshi",Georgia,serif;
  font-weight:700;line-height:1.05;letter-spacing:-.015em;margin:0;
  text-wrap:balance;
}
.eyebrow{
  font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--amber);margin:0 0 14px;
}
.lede{font-size:clamp(1.06rem,.7vw + .92rem,1.32rem);line-height:1.55;color:var(--ink-soft);max-width:56ch}

/* ───────────────────────────── header ───────────────────────────── */
.top{
  position:fixed;inset:0 0 auto;z-index:60;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:14px clamp(18px,4vw,42px);
  background:rgba(251,245,234,0);border-bottom:1px solid transparent;
  transition:background .4s var(--ease),border-color .4s var(--ease),backdrop-filter .4s;
}
.top.stuck{background:rgba(251,245,234,.9);border-bottom-color:var(--line);backdrop-filter:blur(14px) saturate(1.2)}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--paper);transition:color .4s var(--ease)}
.top.stuck .brand{color:var(--ink)}
.brand svg{width:34px;height:34px;flex:none}
.brand b{font-family:"Bespoke Slab",Georgia,serif;font-size:1.06rem;font-weight:700;letter-spacing:-.01em;white-space:nowrap}
.top nav{display:flex;gap:4px}
.top nav a{
  text-decoration:none;font-size:.88rem;font-weight:600;color:rgba(255,253,248,.82);
  padding:8px 13px;border-radius:999px;transition:background .25s,color .4s var(--ease)
}
.top.stuck nav a{color:var(--ink-soft)}
.top nav a:hover{background:rgba(255,255,255,.16)}
.top.stuck nav a:hover{background:rgba(74,47,27,.08);color:var(--ink)}
@media (max-width:720px){.top nav a:not(.nav-key){display:none}}

/* ───────────────────────────── hero ───────────────────────────── */
.hero{position:relative;min-height:min(94svh,900px);display:grid;align-items:end;overflow:hidden;background:var(--deep)}
.hero .bleed{position:absolute;inset:0}
.hero .bleed video,.hero .bleed img{width:100%;height:100%;object-fit:cover}
.hero .bleed::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(to top,rgba(20,17,12,.96) 0%,rgba(20,17,12,.86) 26%,rgba(20,17,12,.5) 54%,rgba(20,17,12,.14) 78%,rgba(20,17,12,.42) 100%);
}
@media (max-width:720px){
  .hero .bleed::after{background:linear-gradient(to top,rgba(20,17,12,.97) 0%,rgba(20,17,12,.9) 40%,rgba(20,17,12,.62) 70%,rgba(20,17,12,.4) 100%)}
}
.hero-in{position:relative;width:var(--shell);margin:0 auto;padding:0 0 clamp(52px,7vw,96px);color:var(--paper)}
.hero h1{font-size:clamp(2.9rem,7.4vw,5.6rem);color:var(--paper);max-width:19ch}
.hero .lede{color:rgba(255,253,248,.84);margin:20px 0 0;max-width:48ch}
.hero .eyebrow,.band-in .eyebrow{color:#f0b45f;text-shadow:0 1px 10px rgba(20,17,12,.85)}
.hero h1,.band-in h2{text-shadow:0 2px 26px rgba(20,17,12,.42)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

.btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:14px 24px;border-radius:999px;border:1.5px solid transparent;
  font-family:"Satoshi",sans-serif;font-size:.97rem;font-weight:700;letter-spacing:-.005em;
  text-decoration:none;cursor:pointer;
  transition:transform .22s var(--ease),background .22s,border-color .22s,box-shadow .22s;
}
.btn:hover{transform:translateY(-2px)}
.btn--go{background:var(--amber-hot);color:#2a1704;box-shadow:0 10px 26px -12px rgba(224,147,51,.9)}
.btn--go:hover{background:#eda547}
.btn--ghost{border-color:rgba(255,253,248,.42);color:var(--paper)}
.btn--ghost:hover{border-color:var(--paper);background:rgba(255,255,255,.1)}
.btn--dark{background:var(--teak);color:var(--cream)}
.btn--dark:hover{background:#5d3c23}
.btn--line{border-color:var(--line);color:var(--ink)}
.btn--line:hover{border-color:var(--teak);background:rgba(74,47,27,.05)}
.btn svg{width:17px;height:17px;flex:none}

/* ───────────────────────────── sections ───────────────────────────── */
section{position:relative}
[id]{scroll-margin-top:78px}
.shell{width:var(--shell);margin:0 auto}
.pad{padding:clamp(76px,10vw,146px) 0}
.head{max-width:64ch;margin-bottom:clamp(38px,5vw,62px)}
.head h2{font-size:clamp(2rem,4vw,3.15rem)}
.head .lede{margin:18px 0 0}

.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,68px);align-items:center}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.frame{
  border-radius:var(--r);overflow:hidden;background:var(--sand);
  box-shadow:0 34px 70px -34px rgba(36,26,16,.5),0 2px 0 rgba(255,255,255,.7) inset;
}
.frame img,.frame video{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.frame--tall img{aspect-ratio:3/4}

.note{
  margin-top:26px;padding:16px 20px;border-left:3px solid var(--amber);
  background:rgba(192,118,29,.07);border-radius:0 12px 12px 0;
  font-size:.95rem;line-height:1.55;color:var(--ink-soft)
}
.note strong{color:var(--ink)}

/* the three doors */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,26px)}
@media (max-width:920px){.doors{grid-template-columns:1fr}}
.door{
  position:relative;display:flex;flex-direction:column;
  border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.door:hover{transform:translateY(-5px);box-shadow:0 30px 56px -30px rgba(36,26,16,.42)}
.door .shot{position:relative;aspect-ratio:16/11;overflow:hidden;background:var(--sand)}
.door .shot img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.door:hover .shot img{transform:scale(1.05)}
.door .body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.door h3{font-size:1.4rem}
.door p{margin:0;font-size:.95rem;color:var(--ink-soft);line-height:1.55}
.door .go{
  margin-top:auto;padding-top:14px;display:inline-flex;align-items:center;gap:7px;
  font-size:.85rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--amber)
}
.door .go svg{width:15px;height:15px;transition:transform .3s var(--ease)}
.door:hover .go svg{transform:translateX(4px)}
.tag{
  position:absolute;top:13px;left:13px;z-index:2;
  padding:5px 12px;border-radius:999px;background:var(--amber-hot);color:#2a1704;
  font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
}
.tag--soon{background:rgba(20,17,12,.78);color:rgba(255,253,248,.92)}

/* full-bleed moving bands */
.band{position:relative;min-height:min(78svh,720px);display:grid;place-items:center;overflow:hidden;background:var(--deep)}
.band .bleed{position:absolute;inset:0}
.band .bleed video,.band .bleed img{width:100%;height:100%;object-fit:cover}
.band .bleed::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(20,17,12,.5),rgba(20,17,12,.24) 42%,rgba(20,17,12,.82))}
.band-in{position:relative;width:var(--shell);color:var(--paper);text-align:center;padding:clamp(48px,7vw,90px) 0}
.band-in h2{font-size:clamp(1.9rem,4.4vw,3.4rem);color:var(--paper);max-width:24ch;margin:0 auto}
.band-in p{color:rgba(255,253,248,.85);max-width:52ch;margin:18px auto 0;font-size:clamp(1rem,.6vw + .9rem,1.2rem)}

/* the gallery */
.gal{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,2vw,22px)}
.tile{
  position:relative;border-radius:var(--r);overflow:hidden;margin:0;
  background:var(--sand);border:1px solid var(--line);
}
.tile--full{grid-column:1 / -1}
@media (max-width:640px){.gal{grid-template-columns:1fr}}
.tile img{width:100%;height:auto;display:block;aspect-ratio:16/10;object-fit:cover;transition:transform .8s var(--ease)}
.tile:hover img{transform:scale(1.04)}
.tile figcaption{
  position:absolute;inset:auto 0 0;padding:44px 20px 18px;
  background:linear-gradient(to top,rgba(20,17,12,.9),rgba(20,17,12,0));
  color:var(--paper);
}
.tile figcaption b{display:block;font-family:"Bespoke Slab",serif;font-size:1.12rem;font-weight:700;letter-spacing:-.01em}
.tile figcaption span{display:block;margin-top:3px;font-size:.86rem;color:rgba(255,253,248,.78)}

/* the roster */
.roster{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:clamp(20px,3vw,40px)}
.roster h3{
  font-family:"Satoshi",sans-serif;font-size:.76rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;color:var(--amber);
  padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:14px;
}
.roster ul{margin:0;padding:0;list-style:none;display:grid;gap:7px}
.roster li{font-size:.95rem;color:var(--ink-soft);line-height:1.42}

/* footer */
.foot{background:var(--deep);color:rgba(255,253,248,.74);padding:clamp(58px,7vw,92px) 0 40px}
.foot .shell{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(28px,5vw,60px)}
@media (max-width:820px){.foot .shell{grid-template-columns:1fr}}
.foot h2{color:var(--paper);font-size:clamp(1.5rem,2.6vw,2.1rem);max-width:22ch}
.foot p{font-size:.95rem;line-height:1.6;margin:14px 0 0;max-width:52ch}
.credits{display:grid;gap:16px;align-content:start}
.credits div{padding-bottom:14px;border-bottom:1px solid rgba(255,253,248,.14)}
.credits span{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,253,248,.5);margin-bottom:4px}
.credits b{font-family:"Bespoke Slab",serif;font-size:1.06rem;font-weight:700;color:var(--paper)}
.rule{margin:clamp(38px,5vw,58px) auto 0;padding-top:22px;border-top:1px solid rgba(255,253,248,.14);font-size:.83rem;color:rgba(255,253,248,.5)}

/* reveal */
.rise{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rise.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rise{opacity:1;transform:none;transition:none}
  .btn:hover,.door:hover,.tile:hover img,.door:hover .shot img{transform:none}
}

/* October 2026 botanical editorial refresh. */
:root{--cream:#f7f1e5;--sand:#eee8d8;--paper:#fffdf6;--teak:#153f35;--ink:#25322e;--ink-soft:#526158;--amber:#8a642a;--amber-hot:#d6a344;--leaf:#6f8862;--deep:#0d2c25;--line:rgba(21,63,53,.18);--r:10px}
h1,h2,h3,.display,.brand b,.tile figcaption b,.credits b{font-family:"Fraunces",Georgia,serif}
body,.btn{font-family:"Nunito Sans",ui-sans-serif,system-ui,sans-serif}
a:focus-visible,button:focus-visible{outline:3px solid #d6a344;outline-offset:5px}
.skip-link{position:fixed;top:-100px;left:18px;z-index:100;background:var(--paper);padding:12px 20px;color:var(--teak)}
.skip-link:focus{top:12px}
.top{background:rgba(13,44,37,.94);border-bottom:1px solid rgba(214,163,68,.4);backdrop-filter:blur(12px)}
.brand b{font-size:1.25rem}.brand svg{color:#d6a344}
.hero{min-height:850px;min-height:92svh}
.hero .bleed::after{background:linear-gradient(90deg,rgba(13,44,37,.92),rgba(13,44,37,.7) 40%,rgba(13,44,37,.08) 78%),linear-gradient(0deg,rgba(13,44,37,.88),transparent 60%)}
.hero-in{padding-top:180px;padding-bottom:90px}
.hero h1{font-size:clamp(3rem,6.5vw,5.8rem);max-width:13ch;line-height:1.02;letter-spacing:-.035em}
.hero .lede{max-width:43ch}
.hero .eyebrow,.band-in .eyebrow{color:#ebc984}
.pad{background-image:radial-gradient(ellipse at 0 0,rgba(111,136,98,.09),transparent 35%)}
.head .eyebrow{display:inline-block;padding:5px 12px;border-left:3px solid #d6a344;background:rgba(111,136,98,.1)}
.door{border-top:3px solid #d6a344;box-shadow:0 12px 35px rgba(21,63,53,.06)}
.door h3{font-size:1.6rem}.door .body{padding:28px}
.btn{border-radius:5px}.btn--dark:hover{background:#24574a}
.tag{background:var(--teak);color:var(--paper);border-radius:3px}
.tile figcaption{padding:60px 24px 22px;background:linear-gradient(0deg,rgba(13,44,37,.96),transparent)}
.tile figcaption b{font-size:1.5rem}
.foot{border-top:4px solid #d6a344}
.art-label{display:block;font-size:.75rem;letter-spacing:.06em;color:var(--ink-soft);margin-top:10px}
@media(max-width:720px){
.top{position:sticky;flex-direction:column;align-items:flex-start;padding:12px 16px;gap:8px;background:var(--deep)}
.top .brand,.top.stuck .brand{color:var(--paper)}.top nav{width:100%;overflow:auto;gap:2px;padding-bottom:3px}
.top nav a:not(.nav-key){display:block}.top nav a,.top.stuck nav a{color:var(--paper);white-space:nowrap;padding:8px 10px;font-size:.8rem}
.hero{min-height:680px}.hero-in{padding-top:100px;padding-bottom:60px}
.hero .bleed video{object-position:62% center}.hero .bleed::after{background:linear-gradient(0deg,rgba(13,44,37,.98),rgba(13,44,37,.82) 40%,rgba(13,44,37,.12))}
.hero h1{max-width:13ch;font-size:clamp(2.65rem,10vw,4rem)}
.pad{padding:64px 0}.head h2{font-size:2.25rem}[id]{scroll-margin-top:130px}
}
/* Review corrections: consistent navigation, readable controls and faithful posters. */
:root{--ink-faint:#59665d;--header-offset:76px}
.top,.top.stuck,.cards-page header.top{background:var(--deep);border-bottom-color:rgba(214,163,68,.4)}
.top .brand,.top.stuck .brand,.top nav a,.top.stuck nav a{color:var(--paper)}
.top nav a{min-height:44px;display:flex;align-items:center}
.top nav a:hover,.top.stuck nav a:hover{background:rgba(255,253,246,.14);color:var(--paper)}
.top nav a[aria-current]{text-decoration:underline;text-underline-offset:5px}
.roster h3,.foot-mark{font-family:"Nunito Sans",system-ui,sans-serif}
.band .btn--ghost{background:rgba(13,44,37,.55)}
.tile img{aspect-ratio:auto}.frame--tall img{height:auto;aspect-ratio:auto;object-fit:contain}
.band .bleed::after{background:linear-gradient(0deg,rgba(13,44,37,.92),rgba(13,44,37,.68))}
[id]{scroll-margin-top:calc(var(--header-offset) + 20px)}
.motion-toggle{position:fixed;right:18px;bottom:18px;z-index:80;min-height:44px;padding:10px 16px;border:1px solid #ebc984;border-radius:6px;background:var(--deep);color:var(--paper);font:inherit;font-size:.85rem;cursor:pointer;box-shadow:0 3px 18px #0003}
.motion-paused .bleed video{display:none}.motion-paused .bleed{background:var(--poster) center/cover}
.motion-paused .rise{opacity:1;transform:none;transition:none}
.motion-paused *{animation:none !important;transition:none !important}
@media(max-width:960px){
 :root{--header-offset:158px}
 .top{position:sticky;flex-direction:column;align-items:flex-start;gap:6px;padding:12px 16px}
 .top nav{width:100%;display:flex;flex-wrap:wrap;overflow:visible;gap:0}
 .top nav a,.top nav a:not(.nav-key){display:flex;padding:8px 10px;font-size:.85rem;min-height:44px}
 .hero-in{padding-top:60px}.hero{min-height:680px}
}
@media(prefers-reduced-motion:reduce){.bleed video{display:none}.bleed{background:var(--poster) center/cover}}
@media print{.motion-toggle{display:none !important}}

.motion-toggle{position:relative;right:auto;bottom:auto;display:block;margin-top:20px;z-index:auto}