@font-face{font-family:Geist;font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/geist-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:Geist;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/geist-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:Geist;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/geist-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/geist-mono-latin-400-normal.woff2) format('woff2')}

:root{
  --bg:#FBF9F5;--beige:#F2ECE3;--sand:#E6DCCD;--line:#DDD3C4;--ink:#1E1B17;--muted:#6F6559;--body:#4A443C;--soft:#ECE4D7;--err:#8A2B10;--ok:#3C6B47;
  --pad:clamp(20px,4vw,56px);--wrap:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.5 Geist,system-ui,sans-serif;overflow-x:clip;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:var(--ink)}a:hover{color:var(--muted)}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mono{font-family:'Geist Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.h2{margin:0;font-weight:300;font-size:clamp(40px,5vw,72px);line-height:1;letter-spacing:-.045em}
.arrow{display:inline-block;transition:transform .3s ease}
a:hover .arrow,button:hover .arrow{transform:translateX(5px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);color:var(--bg);border:0;border-radius:999px;font:500 15px Geist,sans-serif;padding:14px 22px;cursor:pointer;text-decoration:none;transition:background .2s ease}
.btn:hover{background:#3A352E;color:var(--bg)}
.btn:disabled{background:var(--sand);color:var(--muted);cursor:not-allowed}

/* hover photo zoom */
.hov{overflow:hidden;position:relative;display:block}
.zoomw{position:absolute;inset:0;display:block;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.hov:hover .zoomw{transform:scale(1.07)}
.ph{width:100%;height:100%;object-fit:cover;display:block}
.peek{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.6);opacity:0;transition:all .35s ease;background:var(--bg);color:var(--ink);border-radius:999px;padding:12px 18px;font:500 13px Geist,sans-serif;pointer-events:none}
.hov:hover .peek,.hov:focus-visible .peek{opacity:1;transform:translate(-50%,-50%) scale(1)}
.cap{background-image:linear-gradient(var(--ink),var(--ink));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .4s ease}
figure:hover .cap{background-size:100% 1px}

/* 1 hero */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;max-height:1000px;overflow:hidden;background:#BFB2A0;color:#fff}
.hero picture,.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,17,13,.32) 0%,rgba(20,17,13,0) 24%,rgba(20,17,13,0) 52%,rgba(20,17,13,.5) 100%)}
.nav{position:absolute;top:0;left:0;right:0;z-index:3;display:flex;align-items:center;gap:32px;padding:28px var(--pad)}
.brand{color:#fff;text-decoration:none;font-weight:500;font-size:17px;letter-spacing:-.01em;margin-right:auto}
.brand:hover{color:#fff}
.nav-links{display:flex;gap:32px;font-size:14px}
.nl{color:#fff;text-decoration:none;opacity:.85;background-image:linear-gradient(#fff,#fff);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .3s ease;padding-bottom:3px}
.nl:hover{opacity:1;color:#fff;background-size:100% 1px}
.lang{font-family:'Geist Mono',monospace;font-size:12px;display:flex;gap:10px}
.lang a{color:rgba(255,255,255,.7);text-decoration:none;padding:6px 2px}
.lang a[aria-current]{color:#fff;border-bottom:1px solid #fff}
.cta{color:var(--ink);background:var(--bg);text-decoration:none;font-size:14px;font-weight:500;padding:12px 20px;border-radius:999px;white-space:nowrap}
.cta:hover{color:var(--ink)}
.hero-txt{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:0 var(--pad) 48px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.hero h1{margin:0;font-weight:300;font-size:clamp(60px,10vw,156px);line-height:.9;letter-spacing:-.055em}
.hero-place{display:flex;flex-direction:column;align-items:flex-end;gap:6px;padding-bottom:14px;font-size:15px}
.hero-place .mono{opacity:.8;text-transform:none}

/* 2 statement */
.statement{padding-top:180px;padding-bottom:140px}
.statement p{margin:0;font-weight:300;font-size:clamp(32px,4.6vw,64px);line-height:1.12;letter-spacing:-.035em}
.statement span{display:block}
.statement span.dim{color:var(--muted)}

/* 3 facts */
.facts{padding-bottom:160px}
.facts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));border-top:1px solid var(--line);margin:0;padding:0;list-style:none}
.fact{padding:28px 20px 24px 12px;display:flex;flex-direction:column;gap:18px;transition:background .3s ease}
.fact:hover{background:var(--beige)}
.fact svg{transition:transform .4s ease}.fact:hover svg{transform:translateY(-4px) rotate(-6deg)}
.fact b{font-weight:300;font-size:56px;line-height:1;letter-spacing:-.04em}
.fact span{font-size:15px;color:var(--muted)}

/* 4 rooms stack */
.rooms{background:var(--beige);padding:140px var(--pad) 160px}
.rooms-in{max-width:var(--wrap);margin:0 auto}
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:56px}
.sec-head .mono{color:var(--muted)}
.room{position:sticky;margin:0 0 40px;height:min(640px,72vh);background:#CDBFAC;display:flex;align-items:flex-end;justify-content:space-between;padding:28px;color:#fff;transform-origin:center top}
.room:last-child{margin-bottom:0}
.room::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,17,13,0) 55%,rgba(20,17,13,.45) 100%);pointer-events:none}
.room figcaption{position:relative;z-index:1;font-size:28px;font-weight:300;letter-spacing:-.03em}
.room .mono{position:relative;z-index:1;font-size:12px;letter-spacing:0}

/* 5 gallery */
.galwrap{height:2200px;position:relative}
.gal-pin{position:sticky;top:0;height:100vh;height:100svh;max-height:1000px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:40px}
.gal-head{padding:0 var(--pad);display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
.gal-head .mono{color:var(--muted)}
.track{display:flex;gap:20px;width:max-content;padding:0 var(--pad);align-items:flex-start}
.track figure{margin:0;display:flex;flex-direction:column;gap:14px;font-size:15px}
.track button{border:0;padding:0;background:var(--sand);cursor:zoom-in}
.g0 button{width:520px;height:560px}.g1{padding-top:80px}.g1 button{width:380px;height:480px}
.g2 button{width:640px;height:560px}.g3{padding-top:120px}.g3 button{width:420px;height:440px}.g4 button{width:560px;height:560px}

/* 6 location */
.loc{padding-top:120px;padding-bottom:160px;display:flex;flex-wrap:wrap;gap:64px;align-items:flex-start}
.loc-txt{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:40px}
.loc address{font-style:normal;font-size:18px;line-height:1.5}
.walks{margin:0;display:flex;flex-direction:column;border-top:1px solid var(--line)}
.walks div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.walks dt{font-size:17px}
.walks dd{margin:0;font-weight:300;font-size:36px;letter-spacing:-.03em;white-space:nowrap}
.loc .mono{color:var(--muted)}
.map{flex:1 1 520px;min-width:0;height:600px;background:var(--sand);position:relative;display:flex;align-items:flex-end;padding:28px}
.map svg,.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.map-card{position:relative;background:var(--bg);padding:22px;max-width:340px;display:flex;flex-direction:column;gap:14px}
.map-card p{margin:0;font-size:14px;line-height:1.5;color:var(--body)}
.map-card>span{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
.map-card .btn{font-size:14px;padding:12px 18px}
.map-card a:not(.btn){font-size:14px;padding:10px 0;white-space:nowrap}
.map.loaded{padding:0}.map.loaded .map-card,.map.loaded svg{display:none}

/* 7 request */
.req{background:var(--beige)}
.req-in{padding-top:140px;padding-bottom:140px;display:flex;flex-direction:column;gap:56px}
.req-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.req-head>div{display:flex;flex-direction:column;gap:18px}
.req-head p{margin:0;font-size:17px;line-height:1.5;color:var(--body);max-width:520px}
.navbtns{display:flex;gap:8px}
.circ{width:48px;height:48px;border-radius:50%;border:1px solid var(--ink);background:none;color:var(--ink);font-size:18px;cursor:pointer}
.circ:disabled{opacity:.25;cursor:default}
.req-body{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start}
.cal{flex:999 1 600px;min-width:0;background:var(--bg);padding:clamp(18px,3vw,40px);display:flex;flex-direction:column;gap:24px}
.months{display:flex;flex-wrap:wrap;gap:48px}
.month{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:14px}
.month h3{margin:0 0 4px;font-weight:400;font-size:20px;letter-spacing:-.02em}
.wd,.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.wd{font-family:'Geist Mono',monospace;font-size:11px;color:var(--muted);text-align:center}
.days{row-gap:4px}
.day{height:46px;border:0;padding:0;font:400 15px/1 Geist,sans-serif;display:flex;align-items:center;justify-content:center;cursor:pointer;background:transparent;color:var(--ink);border-radius:999px}
.day:hover:not(:disabled){box-shadow:inset 0 0 0 1px var(--ink)}
.day.pad{visibility:hidden}
.day.taken{color:#8A7F70;text-decoration:line-through;cursor:not-allowed}
.day.past{color:#BDB3A5;cursor:default}
.day.in{background:var(--soft);border-radius:0}
.day.sel{background:var(--ink);color:var(--bg)}
.day.ghost{background:var(--ink);color:var(--bg);opacity:.55}
.legend{display:flex;flex-wrap:wrap;gap:10px 28px;font-size:13px;color:var(--body);padding-top:20px;border-top:1px solid var(--sand)}
.legend span{display:flex;align-items:center;gap:8px}
.legend i{width:12px;height:12px;border-radius:50%;display:inline-block}
.cal-state{font-size:14px;color:var(--muted);margin:0}
.form{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:26px}
.picked{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--ink)}
.picked>div{padding:16px 16px 0 0;display:flex;flex-direction:column;gap:6px}
.picked>div+div{padding:16px 0 0 16px;border-left:1px solid var(--line)}
.picked .mono{color:var(--muted)}
.picked output{font-size:18px}
.field{display:flex;flex-direction:column;gap:2px}
.field>span{font-size:13px;color:var(--muted)}
.ul{background:none;border:0;border-bottom:1px solid #CFC4B4;font:400 17px Geist,sans-serif;color:var(--ink);padding:10px 0;width:100%;border-radius:0}
.ul:focus{outline:none;border-bottom-color:var(--ink)}
textarea.ul{resize:vertical}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.guests{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #CFC4B4;padding-bottom:10px}
.guests>span:first-child{font-size:13px;color:var(--muted)}
.guests>span:last-child{display:flex;align-items:center;gap:16px}
.guests output{font-size:20px;min-width:20px;text-align:center}
.guests button{width:44px;height:44px;border-radius:50%;border:1px solid #CFC4B4;background:none;color:var(--ink);font-size:18px;cursor:pointer}
.form .btn[type=submit]{padding:18px 24px;font-size:16px}
.err{margin:0;font-size:14px;line-height:1.45;color:var(--err)}
.done{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--ink);padding-top:24px}
.done strong{font-weight:300;font-size:40px;letter-spacing:-.04em;line-height:1}
.done p{margin:0;font-size:16px;line-height:1.55;color:var(--body)}
.linkbtn{align-self:flex-start;background:none;border:0;border-bottom:1px solid var(--ink);font:400 15px Geist,sans-serif;color:var(--ink);padding:6px 0;cursor:pointer}
[hidden]{display:none !important}

/* 8 faq */
.faq-sec{max-width:1000px;margin:0 auto;padding:140px var(--pad)}
.faq-sec .h2{font-size:clamp(36px,4.4vw,60px);margin-bottom:40px}
.faqs{border-top:1px solid var(--ink)}
.faq{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:24px 0;font-size:20px;letter-spacing:-.01em;transition:padding .3s ease}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{padding-left:10px}
.faq .pl{font-weight:300;transition:transform .2s}
.faq[open] .pl{transform:rotate(45deg)}
.faq p{margin:0 0 24px;font-size:16px;line-height:1.6;color:var(--body);max-width:680px}
.faq h3{all:unset}

/* 9 footer */
.foot{background:var(--ink);color:var(--beige)}
.foot-in{padding-top:100px;padding-bottom:36px;display:flex;flex-direction:column;gap:64px}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px}
.foot-big{font-weight:300;font-size:clamp(56px,9vw,140px);line-height:.9;letter-spacing:-.055em}
.foot .cta{background:var(--beige);font-size:15px;padding:16px 26px}
.foot-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;font-size:13px;color:#B5AB9C;border-top:1px solid #3A352E;padding-top:22px}
.foot-bot span{display:flex;gap:24px}
.foot-bot a{color:var(--beige)}

/* lightbox */
.lb{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100vw;height:100vh;margin:0}
.lb::backdrop{background:rgba(20,17,13,.88)}
.lb[open]{display:flex;align-items:center;justify-content:center}
.lb-fig{margin:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:72px 96px 28px}
.lb img{max-width:100%;max-height:calc(100vh - 150px);object-fit:contain;user-select:none;-webkit-user-select:none}
.lb figcaption{display:flex;gap:18px;align-items:baseline;color:#F2ECE3;font-size:15px}
.lb figcaption .mono{font-size:11px;letter-spacing:.08em;opacity:.7}
.lb button{position:absolute;width:48px;height:48px;border-radius:50%;border:0;background:var(--bg);color:var(--ink);font-size:20px;cursor:pointer;transition:transform .2s ease}
.lb button:hover{transform:scale(1.06)}
.lb-x{top:20px;right:20px}
.lb:focus{outline:none}
.lb-nav{top:50%;margin-top:-24px}
.lb-prev{left:24px}.lb-next{right:24px}
.lb.single .lb-nav{display:none}
.lb img.in-r{animation:lbin-r .35s cubic-bezier(.2,.7,.2,1)}
.lb img.in-l{animation:lbin-l .35s cubic-bezier(.2,.7,.2,1)}
@keyframes lbin-r{from{opacity:0;transform:translateX(28px)}}
@keyframes lbin-l{from{opacity:0;transform:translateX(-28px)}}
.roomopen{position:absolute;inset:0;z-index:1;border:0;background:none;padding:0;cursor:zoom-in}
.room figcaption,.room .mono{pointer-events:none}

/* legal pages */
.legal{max-width:760px;margin:0 auto;padding:80px var(--pad) 120px}
.legal h1{font-weight:300;font-size:clamp(40px,5vw,64px);letter-spacing:-.045em;margin:24px 0 32px;line-height:1}
.legal p,.legal li{color:var(--body);line-height:1.6}

/* scroll-driven motion (progressive enhancement) */
@supports (animation-timeline: view()){
  .hero-img{animation:heroImg linear both;animation-timeline:scroll();animation-range:0 900px}
  .hero-txt{animation:heroTxt linear both;animation-timeline:scroll();animation-range:0 600px}
  .statement span{animation:lineIn linear both;animation-timeline:view();animation-range:entry 30% cover 50%}
  .up{animation:up linear both;animation-timeline:view();animation-range:entry 0% entry 80%}
  .clip{animation:clip linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
  .room:not(:last-child){animation:stack linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
  .par{animation:par linear both;animation-timeline:view()}
  .galwrap{view-timeline-name:--gal}
  .track{animation:track linear both;animation-timeline:--gal;animation-range:contain 0% contain 100%}
  @keyframes heroImg{from{transform:scale(1.14)}to{transform:scale(1) translateY(140px)}}
  @keyframes heroTxt{to{opacity:0;transform:translateY(-80px)}}
  @keyframes lineIn{from{opacity:.14}to{opacity:1}}
  @keyframes up{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:none}}
  @keyframes par{from{transform:translateY(-7%) scale(1.16)}to{transform:translateY(7%) scale(1.16)}}
  @keyframes clip{from{clip-path:inset(22% 8% 0 8%)}to{clip-path:inset(0 0 0 0)}}
  @keyframes stack{to{transform:scale(.92);filter:brightness(.82)}}
  @keyframes track{from{transform:translateX(0)}to{transform:translateX(calc(-100% + 100vw))}}
}
/* Browsers without scroll timelines: gallery becomes a normal swipe row */
@supports not (animation-timeline: view()){
  .galwrap{height:auto;padding:120px 0}
  .gal-pin{position:static;height:auto;max-height:none}
  .track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
  .track figure{scroll-snap-align:start}
}

@media (max-width:720px){
  .lb-fig{padding:64px 12px 92px}
  .lb img{max-height:calc(100vh - 190px)}
  .lb-nav{top:auto;bottom:24px;margin:0}
  .lb-prev{left:calc(50% - 60px)}.lb-next{right:calc(50% - 60px)}
  .nav{gap:16px;padding:20px var(--pad)}
  .nav-links{display:none}
  .cta{padding:10px 16px;font-size:13px}
  .hero-txt{padding-bottom:32px}
  .hero-place{align-items:flex-start;padding-bottom:0}
  .statement{padding-top:110px;padding-bottom:90px}
  .facts{padding-bottom:100px}
  .facts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fact b{font-size:44px}
  .rooms{padding-top:96px;padding-bottom:110px}
  .room{height:62vh;padding:20px}
  .room figcaption{font-size:22px}
  /* Pinned horizontal scroll is fiddly on phones: use a swipe row */
  .galwrap{height:auto;padding:96px 0}
  .gal-pin{position:static;height:auto;max-height:none;gap:28px}
  .track{animation:none !important;width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;gap:12px;scrollbar-width:none}
  .track::-webkit-scrollbar{display:none}
  .track figure{scroll-snap-align:center;padding-top:0 !important}
  .track button{width:78vw !important;height:96vw !important}
  .loc{padding-top:80px;padding-bottom:100px;gap:40px}
  .map{height:420px;padding:16px}
  .walks dd{font-size:28px}
  .req-in{padding-top:96px;padding-bottom:96px;gap:36px}
  .req-body{gap:36px}
  .months{gap:32px}
  .faq-sec{padding-top:96px;padding-bottom:96px}
  .faq summary{font-size:18px}
  .foot-in{padding-top:72px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-img,.hero-txt,.statement span,.up,.clip,.room,.track,.par{animation:none !important}
  .zoomw,.peek,.arrow{transition:none}
  .galwrap{height:auto;padding:120px 0}
  .gal-pin{position:static;height:auto;max-height:none}
  .track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
}

/* footer credit + legal pages */
.foot-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.foot-bot .made{color:#B5AB9C;text-decoration:none;white-space:nowrap}
.foot-bot .made:hover{color:var(--beige)}
.legal section{padding-bottom:48px}
.legal section+section{border-top:1px solid var(--line);padding-top:48px}
.legal h2{font-weight:500;font-size:16px;margin:28px 0 6px}
.legal .sub{color:var(--muted);font-size:14px;margin-top:-16px}
.legal-nav{font-size:14px}

/* avoid single-word last lines */
h1,h2,h3{text-wrap:balance}
p,li,dd,figcaption{text-wrap:pretty}