/* =========================================================
   Amrakunja — mango orchard homestay
   Palette: stone-paper, ink, ember, pine, slate, snow-gold
   ========================================================= */

@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/Fraunces-normal.woff2) format('woff2');}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 700;font-display:swap;src:url(../fonts/Fraunces-italic.woff2) format('woff2');}
@font-face{font-family:'Karla';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/Karla-normal.woff2) format('woff2');}
@font-face{font-family:'Karla';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/Karla-italic.woff2) format('woff2');}

:root{
  --paper:#efeee9;
  --paper-2:#e6e5de;
  --paper-3:#d9d8cf;
  --ink:#1c2226;
  --ink-2:#495257;
  --ink-3:#79838a;
  --ember:#a2522f;
  --ember-deep:#84402a;
  --pine:#2b3a35;
  --pine-deep:#1e2b27;
  --slate:#4d6068;
  --slate-deep:#2c3c45;
  --sun:#bf9455;
  --line:rgba(28,34,38,.16);
  --line-soft:rgba(28,34,38,.09);
  --cream:#f7f5ee;
  --sans:'Karla',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --serif:'Fraunces','Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;
  --pad:clamp(18px,4.5vw,56px);
  --ease:cubic-bezier(.16,.84,.24,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
html:focus-within{scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:clamp(15.5px,.55vw + 14.4px,17.5px);
  line-height:1.62;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;}
::selection{background:var(--ember);color:var(--cream);}
:focus-visible{outline:2px solid var(--ember);outline-offset:3px;}

/* film grain */
body::after{
  content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.05;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--serif);font-weight:340;margin:0;letter-spacing:-.018em;line-height:1.02;}
p{margin:0 0 1.05em;}
p:last-child{margin-bottom:0;}
.kicker{
  font-family:var(--sans);font-size:11px;font-weight:600;line-height:1;
  letter-spacing:.24em;text-transform:uppercase;color:var(--ember);
  display:flex;align-items:center;gap:.75em;
}
.kicker::before{content:"";width:26px;height:1px;background:currentColor;opacity:.6;flex:none;}
.kicker.plain::before{display:none;}
.ital{font-style:italic;}
.muted{color:var(--ink-2);}
.small{font-size:.86em;}
.num{font-family:var(--serif);font-style:italic;font-variant-numeric:oldstyle-nums;}

.rule{height:1px;background:var(--line);border:0;margin:0;}

/* ---------- layout ---------- */
.wrap{width:100%;max-width:1280px;margin-inline:auto;padding-inline:var(--pad);}
section{position:relative;}
.sec{padding-block:clamp(64px,9vw,132px);}
.sec--tight{padding-block:clamp(48px,6vw,80px);}

.sec-head{display:grid;grid-template-columns:1fr;gap:22px;margin-bottom:clamp(34px,4.5vw,60px);}
@media(min-width:900px){
  .sec-head{grid-template-columns:minmax(0,1fr) minmax(0,.78fr);align-items:end;gap:48px;}
}
.sec-head h2{font-size:clamp(2rem,4.6vw,3.5rem);max-width:16ch;}
.sec-head .note{color:var(--ink-2);font-size:.95em;max-width:44ch;justify-self:start;}
@media(min-width:900px){.sec-head .note{justify-self:end;text-align:right;}}

/* ---------- buttons / links ---------- */
.btn{
  --bg:transparent;--fg:var(--cream);--bd:var(--ember);--fill:var(--ember);
  position:relative;display:inline-flex;align-items:center;gap:.7em;
  padding:1.02em 1.65em;border:1px solid var(--bd);background:var(--bg);color:var(--fg);
  font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  text-decoration:none;cursor:pointer;overflow:hidden;white-space:nowrap;flex:none;
  transition:color .45s var(--ease),border-color .45s var(--ease),transform .35s var(--ease);
  will-change:transform;
}
.btn span{position:relative;z-index:2;display:inline-flex;align-items:center;gap:.7em;}
.btn::before{
  content:"";position:absolute;inset:0;background:var(--fill);z-index:1;
  transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease);
}
.btn:hover::before,.btn:focus-visible::before{transform:scaleY(1);}
.btn:hover,.btn:focus-visible{color:var(--cream);}
.btn--solid{--bg:var(--ember);--bd:var(--ember);--fg:var(--cream);--fill:var(--ink);}
.btn--ghost{--fg:var(--ink);--bd:rgba(28,34,38,.28);--fill:var(--pine);}
.btn--ghost:hover,.btn--ghost:focus-visible{color:var(--cream);border-color:var(--pine);}
.btn--onimg{--fg:var(--cream);--bd:rgba(247,245,238,.5);--fill:var(--cream);}
.btn--onimg:hover,.btn--onimg:focus-visible{color:var(--ink);border-color:var(--cream);}
.btn .ar{transition:transform .45s var(--ease);}
.btn:hover .ar{transform:translateX(4px);}

.ulink{
  text-decoration:none;color:var(--ink);position:relative;display:inline-block;
  padding-bottom:2px;background-image:linear-gradient(var(--ember),var(--ember));
  background-repeat:no-repeat;background-position:0 100%;background-size:0% 1px;
  transition:background-size .5s var(--ease),color .3s;
}
.ulink:hover,.ulink:focus-visible{background-size:100% 1px;color:var(--ember);}

/* ---------- loader ---------- */
#loader{
  position:fixed;inset:0;z-index:10000;background:var(--paper);
  display:grid;place-items:center;transition:transform 1s var(--ease),opacity .6s;
}
#loader .lm{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,4vw,2.4rem);color:var(--ink);opacity:.85;letter-spacing:.01em;}
#loader .lm span{display:inline-block;opacity:0;transform:translateY(8px);animation:lIn .7s var(--ease) forwards;}
#loader .lm span:nth-child(2){animation-delay:.10s}
#loader .lm span:nth-child(3){animation-delay:.18s}
#loader .lm span:nth-child(4){animation-delay:.26s}
#loader .lm span:nth-child(5){animation-delay:.34s}
#loader .lm span:nth-child(6){animation-delay:.42s}
#loader .lm span:nth-child(7){animation-delay:.48s}
#loader .lm span:nth-child(8){animation-delay:.54s}
#loader .lm span:nth-child(9){animation-delay:.60s}
@keyframes lIn{to{opacity:1;transform:none}}
body.done #loader{transform:translateY(-101%);}

/* ---------- scroll progress ---------- */
#prog{position:fixed;top:0;left:0;height:2px;background:var(--ember);width:0;z-index:9997;transition:width .12s linear;}

/* ---------- nav ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:9990;
  transition:background .5s var(--ease),box-shadow .5s,transform .55s var(--ease),color .4s;
  color:var(--cream);
}
.nav .bar{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:clamp(16px,2.2vw,26px) var(--pad);
  transition:padding .5s var(--ease);
}
.brand{display:flex;align-items:baseline;gap:.6em;text-decoration:none;line-height:1;}
.brand b{
  font-family:var(--serif);font-weight:400;font-size:clamp(1.25rem,2vw,1.62rem);
  letter-spacing:-.01em;transition:font-size .4s var(--ease);
}
.brand i{font-family:var(--sans);font-style:normal;font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;opacity:.7;}
.nav-links{display:none;gap:clamp(18px,2.4vw,34px);align-items:center;}
.nav-links a{
  text-decoration:none;font-size:11px;font-weight:600;letter-spacing:.19em;text-transform:uppercase;
  opacity:.85;transition:opacity .3s,color .3s;position:relative;padding-block:3px;
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease);
}
.nav-links a:hover{opacity:1}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left;}
.nav.is-solid{
  background:rgba(239,238,233,.93);color:var(--ink);
  box-shadow:0 1px 0 var(--line-soft);
  -webkit-backdrop-filter:saturate(140%) blur(9px);backdrop-filter:saturate(140%) blur(9px);
}
.nav.is-solid .bar{padding-block:clamp(11px,1.4vw,15px);}
.nav.is-solid .brand b{font-size:clamp(1.15rem,1.7vw,1.36rem);}
.nav.hide{transform:translateY(-105%);}
.nav .nav-book{display:none;}
@media(min-width:940px){
  .nav-links{display:flex;}
  .nav .nav-book{display:inline-flex;padding:.85em 1.25em;font-size:10.5px;}
  .nav.is-solid .nav-book{--bd:rgba(28,34,38,.25);--fg:var(--ink);--fill:var(--pine);}
}

.burger{
  display:inline-flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:6px;
  width:46px;height:40px;background:none;border:0;color:inherit;cursor:pointer;padding:0;
}
.burger i{display:block;height:1px;width:26px;background:currentColor;transition:transform .4s var(--ease),width .4s var(--ease);}
.burger i:nth-child(2){width:17px;}
.burger:hover i:nth-child(2){width:26px;}
@media(min-width:940px){.burger{display:none;}}
body.menu-open .burger i:nth-child(1){transform:translateY(3.5px) rotate(45deg);width:26px;}
body.menu-open .burger i:nth-child(2){transform:translateY(-3.5px) rotate(-45deg);width:26px;}

#menu{
  position:fixed;inset:0;z-index:9989;background:var(--paper);color:var(--ink);
  display:flex;flex-direction:column;justify-content:center;padding:0 var(--pad);
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease);visibility:hidden;
}
body.menu-open #menu{clip-path:inset(0 0 0 0);visibility:visible;}
#menu ol{list-style:none;margin:0;padding:0;display:grid;gap:clamp(6px,1.4vh,14px);}
#menu li{overflow:hidden;}
#menu a{
  display:flex;align-items:baseline;gap:.7em;text-decoration:none;
  font-family:var(--serif);font-size:clamp(1.9rem,8vw,2.9rem);font-weight:340;line-height:1.12;
  transform:translateY(110%);transition:transform .7s var(--ease),color .3s;
}
#menu a em{font-family:var(--sans);font-style:normal;font-size:10px;letter-spacing:.2em;color:var(--ember);opacity:.9;}
body.menu-open #menu a{transform:none;}
#menu li:nth-child(1) a{transition-delay:.10s}
#menu li:nth-child(2) a{transition-delay:.16s}
#menu li:nth-child(3) a{transition-delay:.22s}
#menu li:nth-child(4) a{transition-delay:.28s}
#menu li:nth-child(5) a{transition-delay:.34s}
#menu li:nth-child(6) a{transition-delay:.40s}
#menu .mfoot{margin-top:clamp(26px,5vh,52px);display:grid;gap:2px;font-size:.92rem;color:var(--ink-2);}
#menu .mfoot a{font-family:var(--sans);font-size:1.02rem;font-weight:500;letter-spacing:0;transform:none;
  text-decoration:none;color:var(--ember);border-bottom:1px solid rgba(164,67,42,.35);justify-self:start;padding-bottom:1px;}
body.menu-open .nav{color:var(--ink);background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;}
body.menu-open .nav .brand i{opacity:.5;}
body.menu-open .nav-book{visibility:hidden;}

/* ---------- hero ---------- */
.hero{position:relative;min-height:min(94vh,880px);display:flex;align-items:flex-end;isolation:isolate;overflow:hidden;}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden;}
.hero-media img{width:100%;height:112%;object-fit:cover;object-position:center 58%;transform:scale(1.06);will-change:transform;}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(to top,rgba(16,21,23,.93) 0%,rgba(16,21,23,.76) 24%,rgba(16,21,23,.30) 52%,rgba(16,21,23,.14) 72%,rgba(16,21,23,.46) 100%),
    radial-gradient(125% 85% at 8% 100%,rgba(14,19,21,.55),transparent 62%);
}
.hero-inner{
  width:100%;max-width:1280px;margin:0 auto;padding:0 var(--pad) clamp(34px,6vw,72px);
  color:var(--cream);
}
.hero .kicker{color:rgba(247,245,238,.86);margin-bottom:clamp(16px,2.4vw,26px);}
.hero h1,.hero .lede,.hero-facts,.hero .kicker{text-shadow:0 1px 26px rgba(16,21,23,.5),0 1px 2px rgba(16,21,23,.28);}
.hero h1{
  font-size:clamp(2.55rem,7.1vw,6rem);line-height:.99;letter-spacing:-.028em;
  max-width:19ch;text-wrap:balance;
}
.hero h1 em{font-style:italic;color:#eccfa4;}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.06em;}
.hero h1 .line>span{display:block;transform:translateY(112%);transition:transform 1.15s var(--ease);transition-delay:var(--d,0s);}
body.done .hero h1 .line>span{transform:none;}
.hero-foot{
  display:flex;flex-wrap:wrap;align-items:end;gap:clamp(20px,3vw,44px);
  margin-top:clamp(22px,3.4vw,38px);
  opacity:0;transform:translateY(14px);transition:opacity 1s var(--ease) .55s,transform 1s var(--ease) .55s;
}
body.done .hero-foot{opacity:1;transform:none;}
.hero-foot .lede{max-width:37ch;color:rgba(247,245,238,.86);font-size:clamp(.95rem,.35vw + .88rem,1.06rem);margin:0;}
.hero-facts{
  display:flex;flex-wrap:wrap;gap:.4em 1.6em;margin-top:auto;padding-top:clamp(26px,4vw,54px);
  width:100%;border-top:1px solid rgba(247,245,238,.3);
  font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:#f7f5ee;
  opacity:0;transition:opacity 1.1s ease .8s;
}
body.done .hero-facts{opacity:1;}
.hero-facts span{display:inline-flex;align-items:center;gap:.7em;}
.hero-facts span::before{content:"";width:5px;height:5px;background:#e8c98f;transform:rotate(45deg);flex:none;box-shadow:0 0 0 1px rgba(16,21,23,.25);}
.hero-side{
  position:absolute;right:calc(var(--pad) * .42);top:0;bottom:0;display:none;
  align-items:center;z-index:2;
}
@media(min-width:1100px){.hero-side{display:flex;}}
.hero-side p{
  writing-mode:vertical-rl;margin:0;font-size:10px;letter-spacing:.32em;text-transform:uppercase;
  color:rgba(247,245,238,.55);
}
.scrollcue{
  position:absolute;right:var(--pad);bottom:clamp(34px,6vw,72px);display:none;
  align-items:center;gap:10px;color:rgba(247,245,238,.72);
  font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;
}
@media(min-width:760px){.scrollcue{display:flex;}}
.scrollcue i{display:block;width:1px;height:46px;background:linear-gradient(rgba(247,245,238,.1),rgba(247,245,238,.8));position:relative;overflow:hidden;}
.scrollcue i::after{content:"";position:absolute;top:-46px;left:0;width:1px;height:46px;background:#eccfa4;animation:drip 2.4s var(--ease) infinite;}
@keyframes drip{0%{top:-46px}60%,100%{top:46px}}

/* ---------- marquee ---------- */
.ribbon{
  background:var(--pine);color:#eef0eb;overflow:hidden;padding-block:14px;
  border-block:1px solid rgba(0,0,0,.15);
}
.mq{display:flex;width:max-content;animation:slide 46s linear infinite;}
.ribbon:hover .mq{animation-play-state:paused;}
.mq-rev{animation-direction:reverse;}
@keyframes slide{to{transform:translateX(-50%);}}
.mq span{
  display:inline-flex;align-items:center;gap:clamp(20px,3vw,42px);padding-right:clamp(20px,3vw,42px);
  font-family:var(--serif);font-style:italic;font-size:clamp(.95rem,1.5vw,1.12rem);
  letter-spacing:.02em;white-space:nowrap;opacity:.92;
}
.mq span::after{content:"✳";font-style:normal;font-size:.62em;color:#c9a26a;opacity:.85;letter-spacing:0;}

/* ---------- story ---------- */
.story-grid{display:grid;gap:clamp(34px,5vw,72px);}
@media(min-width:980px){.story-grid{grid-template-columns:1.02fr .98fr;align-items:start;}}
.story-copy p{font-size:clamp(1rem,.28vw + .95rem,1.09rem);color:#332f26;max-width:54ch;}
.story-copy p:first-of-type::first-letter{
  font-family:var(--serif);float:left;font-size:3.9em;line-height:.78;padding:.06em .12em 0 0;color:var(--ember);
}
.pull{
  font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,2.1vw,1.6rem);line-height:1.32;
  color:var(--pine);margin:clamp(24px,3vw,34px) 0;padding-left:clamp(16px,2vw,24px);
  border-left:2px solid var(--paper-3);max-width:34ch;
}
.story-figs{position:relative;display:grid;gap:clamp(20px,3vw,30px);}
@media(min-width:980px){
  .story-figs{display:block;}
  .story-figs .fig.tall{width:78%;}
  .story-figs .fig.polaroid{position:absolute;right:0;bottom:-10px;width:46%;margin:0;}
  .story-figs .fig.tall .cap{max-width:52%;}
}
.fig{position:relative;}
.fig img{width:100%;}
.fig.tall img{aspect-ratio:4/5;object-fit:cover;}
.fig.polaroid{
  background:#f6f4ec;padding:10px 10px 16px;box-shadow:0 18px 40px -28px rgba(28,34,38,.5),0 1px 0 rgba(0,0,0,.04);
  transform:rotate(-2.4deg);width:min(60%,290px);margin-left:auto;position:relative;z-index:3;
  transition:transform .6s var(--ease);
}
.fig.polaroid:hover{transform:rotate(-.6deg) translateY(-4px);}
.fig.polaroid img{aspect-ratio:4/5;object-fit:cover;}
.fig.polaroid figcaption{font-family:var(--serif);font-style:italic;font-size:.86em;color:var(--ink-2);padding-top:9px;text-align:center;}
.fig .cap{margin-top:10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);}

.stats{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);
  border-block:1px solid var(--line);margin-top:clamp(34px,5vw,64px);
}
@media(min-width:820px){.stats{grid-template-columns:repeat(4,1fr);}}
.stat{background:var(--paper);padding:clamp(20px,2.6vw,30px) clamp(14px,2vw,24px);}
.stat b{display:block;font-family:var(--serif);font-weight:340;font-size:clamp(2rem,3.6vw,3rem);line-height:1;letter-spacing:-.02em;}
.stat b i{font-style:normal;font-size:.5em;vertical-align:.42em;color:var(--ember);margin-left:.12em;letter-spacing:0;}
.stat s{
  display:block;text-decoration:none;margin-top:.65em;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-3);
}

/* ---------- rooms ---------- */
.rooms{border-top:1px solid var(--line);}
.room{
  display:grid;grid-template-columns:1fr;gap:clamp(16px,2.4vw,34px);
  padding-block:clamp(26px,3.4vw,40px);border-bottom:1px solid var(--line);
  text-decoration:none;position:relative;transition:background .6s var(--ease);
}
@media(min-width:820px){
  .room{grid-template-columns:minmax(0,300px) minmax(0,1fr) auto;align-items:center;gap:clamp(24px,3.6vw,54px);}
}
.room:hover{background:linear-gradient(90deg,rgba(230,229,222,.55),rgba(230,229,222,0));}
.room-media{position:relative;overflow:hidden;aspect-ratio:4/3;background:var(--paper-3);}
.room-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease),filter .6s;}
.room:hover .room-media img{transform:scale(1.045);}
.room-media .tag{
  position:absolute;left:0;bottom:0;background:var(--paper);color:var(--ink);
  font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;padding:.62em .85em;
}
.room h3{font-size:clamp(1.5rem,2.5vw,2.05rem);letter-spacing:-.02em;}
.room h3 em{font-size:.62em;font-style:italic;color:var(--ink-3);margin-left:.5em;letter-spacing:0;}
.room .desc{margin:.6em 0 0;color:var(--ink-2);font-size:.95em;max-width:46ch;}
.room .feats{display:flex;flex-wrap:wrap;gap:.35em 1.25em;margin-top:.95em;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);}
.room .feats span{display:inline-flex;align-items:center;gap:.55em;}
.room .feats span::before{content:"·";color:var(--ember);font-size:1.6em;line-height:0;}
.room-price{text-align:left;white-space:nowrap;}
@media(min-width:820px){.room-price{text-align:right;}}
.room-price b{display:block;font-family:var(--serif);font-weight:340;font-size:clamp(1.5rem,2.2vw,1.95rem);line-height:1;letter-spacing:-.01em;}
.room-price em{display:block;font-style:normal;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin-top:.6em;}
.room-cta{
  display:inline-flex;align-items:center;gap:.55em;margin-top:clamp(14px,1.6vw,18px);
  font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ember);font-weight:600;
}
.room-cta .ar{transition:transform .5s var(--ease);}
.room:hover .room-cta .ar{transform:translateX(6px);}

.house-note{
  margin-top:clamp(28px,4vw,48px);display:grid;gap:16px;padding:clamp(22px,3vw,34px);
  border:1px solid var(--line);background:
    linear-gradient(180deg,rgba(230,229,222,.55),rgba(239,238,233,.2));
  position:relative;
}
@media(min-width:760px){.house-note{grid-template-columns:1fr auto;align-items:center;}}
.house-note h3{font-size:clamp(1.2rem,2vw,1.5rem);font-style:italic;}
.house-note p{color:var(--ink-2);font-size:.94em;margin:.5em 0 0;max-width:52ch;}
.house-note .stamp{
  font-family:var(--sans);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ember);
  border:1px solid var(--ember);padding:.7em 1em;transform:rotate(-2deg);justify-self:start;white-space:nowrap;
}

/* ---------- interlude (parallax quote) ---------- */
.interlude{position:relative;isolation:isolate;overflow:hidden;color:var(--cream);min-height:clamp(380px,58vh,560px);display:grid;place-items:center;text-align:center;}
.interlude .bg{position:absolute;inset:-12% 0;z-index:-2;}
.interlude .bg img{width:100%;height:100%;object-fit:cover;object-position:center 55%;will-change:transform;}
.interlude::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(24,21,15,.5),rgba(24,21,15,.34) 45%,rgba(24,21,15,.62));}
.interlude blockquote{margin:0;max-width:min(900px,86vw);padding-inline:var(--pad);}
.interlude q{text-wrap:balance;
  font-family:var(--serif);font-style:italic;font-weight:300;quotes:"“" "”";
  font-size:clamp(1.5rem,3.9vw,2.9rem);line-height:1.22;letter-spacing:-.02em;display:block;
}
.interlude cite{display:block;margin-top:clamp(16px,2vw,24px);font-style:normal;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:rgba(247,245,238,.68);}

/* ---------- experiences ---------- */
.xp-list{border-top:1px solid var(--line);}
.xp{
  position:relative;display:grid;grid-template-columns:auto 1fr;gap:clamp(14px,2.4vw,30px);
  padding-block:clamp(18px,2.4vw,26px);border-bottom:1px solid var(--line);
  transition:padding-left .5s var(--ease),background .5s;
}
@media(min-width:820px){.xp{grid-template-columns:56px minmax(0,1fr) minmax(0,.85fr) auto;align-items:baseline;gap:clamp(18px,2.6vw,34px);}}
.xp:hover{padding-left:clamp(6px,1.2vw,16px);background:linear-gradient(90deg,rgba(230,229,222,.5),transparent 70%);}
.xp .no{font-family:var(--serif);font-style:italic;font-size:.95rem;color:var(--ember);letter-spacing:.02em;padding-top:.12em;}
.xp h3{font-size:clamp(1.15rem,1.9vw,1.5rem);letter-spacing:-.015em;transition:color .4s;}
.xp:hover h3{color:var(--ember);}
.xp p{margin:0;color:var(--ink-2);font-size:.94em;max-width:46ch;}
.xp .when{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;justify-self:start;}
@media(min-width:820px){.xp .when{justify-self:end;}}
.pop{
  position:fixed;z-index:9000;width:210px;pointer-events:none;opacity:0;
  transform:translate(-50%,-50%) scale(.94) rotate(-3deg);transition:opacity .35s,transform .45s var(--ease);
  box-shadow:0 24px 50px -26px rgba(0,0,0,.6);background:#f6f4ec;padding:6px 6px 8px;
}
.pop img{aspect-ratio:4/3;object-fit:cover;width:100%;}
.pop.on{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-2deg);}
@media(hover:none){.xp-hint{display:none;}}
.xp-hint{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-top:18px;}

/* ---------- gallery ---------- */
.gal{columns:2;column-gap:clamp(10px,1.6vw,18px);}
@media(min-width:900px){.gal{columns:3;}}
.gal figure{margin:0 0 clamp(10px,1.6vw,18px);break-inside:avoid;position:relative;overflow:hidden;cursor:zoom-in;background:var(--paper-3);}
.gal img{width:100%;transition:transform 1.2s var(--ease),filter .6s;}
.gal figure:hover img{transform:scale(1.04);}
.gal figcaption{
  position:absolute;left:0;bottom:0;right:0;padding:14px 14px 12px;
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--cream);
  background:linear-gradient(to top,rgba(20,17,12,.72),transparent);
  opacity:0;transform:translateY(6px);transition:opacity .45s,transform .45s var(--ease);
}
.gal figure:hover figcaption{opacity:1;transform:none;}

/* lightbox */
#lb{
  position:fixed;inset:0;z-index:9999;background:rgba(20,17,12,.94);display:grid;place-items:center;
  opacity:0;visibility:hidden;transition:opacity .45s,visibility .45s;padding:clamp(16px,4vw,48px);
}
#lb.on{opacity:1;visibility:visible;}
#lb img{max-width:min(1100px,92vw);max-height:82vh;width:auto;object-fit:contain;transform:scale(.97);transition:transform .5s var(--ease);box-shadow:0 40px 80px -40px #000;}
#lb.on img{transform:none;}
#lb .cap{position:absolute;bottom:clamp(18px,3vw,34px);left:0;right:0;text-align:center;color:rgba(247,245,238,.7);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;}
#lb button{position:absolute;top:clamp(12px,2.6vw,28px);right:clamp(12px,2.6vw,28px);background:none;border:1px solid rgba(247,245,238,.4);color:var(--cream);width:44px;height:44px;font-size:18px;cursor:pointer;line-height:1;transition:background .3s,color .3s;}
#lb button:hover{background:var(--cream);color:var(--ink);}

/* ---------- host ---------- */
.host-grid{display:grid;gap:clamp(28px,4vw,60px);align-items:start;}
@media(min-width:900px){.host-grid{grid-template-columns:.82fr 1.18fr;gap:clamp(40px,6vw,84px);}}
.host-fig{position:relative;}
.host-fig img{aspect-ratio:4/5;object-fit:cover;width:100%;}
.host-fig::before{
  content:"";position:absolute;inset:-12px -12px auto auto;width:52%;height:52%;
  border-top:1px solid var(--paper-3);border-right:1px solid var(--paper-3);z-index:-1;
}
.host-fig figcaption{margin-top:14px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);}
.host-copy h2{font-size:clamp(1.85rem,3.6vw,2.9rem);max-width:22ch;margin-bottom:.7em;text-wrap:balance;}
.host-copy p{color:var(--ink-2);max-width:52ch;}
.sig{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--pine);margin-top:1.4em;}
.sig small{display:block;font-family:var(--sans);font-style:normal;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);margin-top:.5em;}

/* ---------- visit ---------- */
.visit{background:var(--paper-2);border-block:1px solid var(--line);}
.visit-grid{display:grid;gap:clamp(30px,4vw,56px);}
@media(min-width:960px){.visit-grid{grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,80px);}}
.visit h2{font-size:clamp(1.9rem,3.8vw,3rem);margin-bottom:.55em;max-width:18ch;}
.travel{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.travel li{display:grid;grid-template-columns:auto 1fr;gap:clamp(14px,2vw,26px);padding-block:clamp(13px,1.8vw,18px);border-bottom:1px solid var(--line-soft);}
.travel .k{font-size:10px;letter-spacing:.19em;text-transform:uppercase;color:var(--ink-3);padding-top:.42em;min-width:74px;}
.travel .v{color:#332f26;font-size:.96em;}
.travel .v b{font-weight:600;}
.addr{font-family:var(--serif);font-style:italic;font-size:clamp(1.02rem,1.6vw,1.18rem);line-height:1.55;color:var(--ink);margin-top:clamp(20px,2.6vw,28px);}
.map{position:relative;margin-top:clamp(18px,2.4vw,26px);border:1px solid var(--line);background:#e6e5dc;overflow:hidden;}
.map svg{display:block;width:100%;height:auto;}
.map .cap{position:absolute;left:12px;bottom:9px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);}

.tariff{width:100%;border-collapse:collapse;margin-top:clamp(16px,2vw,22px);}
.tariff th{text-align:left;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);font-weight:600;padding-bottom:10px;border-bottom:1px solid var(--line);}
.tariff td{padding:.72em 0;border-bottom:1px solid var(--line-soft);font-size:.95em;vertical-align:baseline;}
.tariff td:last-child,.tariff th:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.tariff td:last-child{font-family:var(--serif);font-size:1.12em;}
.tariff tr td:first-child i{display:block;font-style:normal;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-top:.2em;}
.tf-note{font-size:.84em;color:var(--ink-3);margin-top:14px;line-height:1.55;}

/* ---------- book ---------- */
.book{background:var(--slate-deep);color:#eef0eb;position:relative;overflow:hidden;}
.book::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;
  background-image:radial-gradient(circle at 1px 1px,rgba(238,240,235,.5) 1px,transparent 0);
  background-size:22px 22px;
}
.book .wrap{position:relative;}
.book .kicker{color:#c9a26a;}
.book h2{font-size:clamp(2rem,4.4vw,3.4rem);color:var(--cream);max-width:20ch;}
.book .sub{color:rgba(238,240,235,.76);max-width:44ch;margin-top:.9em;font-size:.98em;}
.book-grid{display:grid;gap:clamp(32px,5vw,64px);margin-top:clamp(30px,4.5vw,56px);}
@media(min-width:940px){.book-grid{grid-template-columns:1.15fr .85fr;gap:clamp(48px,6vw,90px);}}
form{display:grid;gap:clamp(16px,2vw,22px);}
.f-row{display:grid;gap:clamp(16px,2vw,22px);}
@media(min-width:620px){.f-row{grid-template-columns:1fr 1fr;}}
.field{position:relative;display:grid;gap:.5em;}
.field label{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(238,240,235,.62);}
.field input,.field select,.field textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid rgba(238,240,235,.34);
  color:var(--cream);font-family:var(--sans);font-size:.98rem;padding:.55em 0 .7em;
  transition:border-color .4s,background .4s;border-radius:0;appearance:none;-webkit-appearance:none;
}
.field textarea{resize:vertical;min-height:74px;}
.field select{background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23efe7d5' stroke-width='1.2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .2em center;padding-right:1.6em;cursor:pointer;}
.field select option{background:var(--slate-deep);color:var(--cream);}
.field input::placeholder,.field textarea::placeholder{color:rgba(238,240,235,.36);}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:#c9a26a;}
.field input[type=date]{color-scheme:dark;}
.form-note{font-size:.8em;color:rgba(238,240,235,.55);margin-top:2px;}
.book .btn--solid{--bg:#e4e6df;--bd:#e4e6df;--fg:var(--pine);--fill:var(--cream);}
.book .btn--solid:hover{color:var(--pine);}
.book-aside{border-left:1px solid rgba(238,240,235,.2);padding-left:clamp(0px,3vw,36px);}
@media(max-width:939px){.book-aside{border-left:0;border-top:1px solid rgba(238,240,235,.2);padding-left:0;padding-top:26px;}}
.book-aside dl{margin:0;display:grid;gap:14px;}
.book-aside dt{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(238,240,235,.55);}
.book-aside dd{margin:.25em 0 0;font-family:var(--serif);font-size:1.06rem;color:var(--cream);}
.book-aside dd a{text-decoration:none;border-bottom:1px solid rgba(238,240,235,.3);transition:border-color .3s;}
.book-aside dd a:hover{border-color:#c9a26a;}
#thanks{
  display:none;margin-top:6px;padding:16px 18px;border:1px solid rgba(224,178,106,.55);
  background:rgba(224,178,106,.1);font-size:.92em;color:#f4ecd9;
}
#thanks.on{display:block;animation:fadeUp .7s var(--ease) both;}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- footer ---------- */
footer{background:var(--paper);padding-block:clamp(46px,6vw,76px) 26px;}
.f-top{display:grid;gap:clamp(28px,4vw,48px);}
@media(min-width:820px){.f-top{grid-template-columns:1.4fr .8fr .8fr .8fr;}}
.f-brand b{font-family:var(--serif);font-weight:340;font-size:clamp(1.9rem,4vw,2.7rem);line-height:1;letter-spacing:-.02em;display:block;}
.f-brand p{color:var(--ink-2);font-size:.9em;max-width:32ch;margin-top:.9em;}
.f-col h4{font-family:var(--sans);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin-bottom:1.1em;}
.f-col ul{list-style:none;margin:0;padding:0;display:grid;gap:.6em;font-size:.93em;}
.f-col a{text-decoration:none;color:var(--ink-2);transition:color .3s;}
.f-col a:hover{color:var(--ember);}
.f-bot{
  margin-top:clamp(34px,5vw,58px);padding-top:20px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:space-between;
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
}

[id]{scroll-margin-top:82px;}

/* ---------- reveals ---------- */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .95s var(--ease),transform .95s var(--ease);transition-delay:var(--d,0s);}
[data-reveal].in{opacity:1;transform:none;}
/* clip the inner image, never the observed box: clip-path on the observed
   element collapses its IntersectionObserver ratio to zero */
[data-reveal="clip"]{opacity:1;transform:none;}
[data-reveal="clip"] img{clip-path:inset(0 0 101% 0);transform:scale(1.08);
  transition:clip-path 1.2s var(--ease),transform 1.7s var(--ease);transition-delay:var(--d,0s);}
[data-reveal="clip"].in img{clip-path:inset(0 0 0 0);transform:none;}
[data-reveal="clip"] figcaption{opacity:0;transition:opacity .9s ease .35s;}
[data-reveal="clip"].in figcaption{opacity:1;}
[data-reveal="fade"]{transform:none;}
[data-reveal="left"]{transform:translateX(-26px);}
[data-reveal="left"].in{transform:none;}

/* mobile sticky book bar */
@media(max-width:939px){body{padding-bottom:64px;}}
.mbar{
  position:fixed;left:0;right:0;bottom:0;z-index:9980;display:flex;gap:10px;
  padding:10px 12px;background:rgba(239,238,233,.96);border-top:1px solid var(--line);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transform:translateY(110%);transition:transform .5s var(--ease);
}
.mbar.on{transform:none;}
.mbar .btn{flex:1;justify-content:center;font-size:10.5px;padding:.9em 1em;}
@media(min-width:940px){@media(max-width:939px){body{padding-bottom:64px;}}
.mbar{display:none;}}

@media(prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  .hero-media img{transform:none!important;}
  [data-reveal],.hero-foot,.hero-facts{opacity:1!important;transform:none!important;clip-path:none!important;}
  .hero h1 .line>span{transform:none!important;}
  #loader{display:none;}
}
