:root {
  --forest:#071a14;
  --moss:#23493b;
  --mist:#dce7df;
  --gold:#d8b879;
  --bone:#f3efe7;
  --ink:#10231c;
  --ease:cubic-bezier(.22,.8,.2,1);
}

* { box-sizing:border-box; }
html { background:var(--forest); scroll-behavior:smooth; }
body { margin:0; background:var(--forest); color:var(--bone); font-family:"Inter",sans-serif; font-weight:300; overflow-x:hidden; }
button, a { color:inherit; font:inherit; }
button { -webkit-tap-highlight-color:transparent; }
a { text-decoration:none; }
button:focus-visible,a:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
::selection { background:var(--gold); color:var(--forest); }

.grain { position:fixed; inset:-50%; z-index:30; pointer-events:none; opacity:.045; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); animation:grain .24s steps(2) infinite; }
@keyframes grain { 0%{transform:translate3d(0,0,0)} 25%{transform:translate3d(3%,-2%,0)} 50%{transform:translate3d(-2%,3%,0)} 75%{transform:translate3d(2%,2%,0)} 100%{transform:translate3d(-3%,-1%,0)} }

.preloader { position:fixed; inset:0; z-index:100; display:grid; place-content:center; justify-items:center; gap:20px; background:var(--forest); transition:opacity .8s var(--ease), visibility .8s; }
.preloader__mark { width:72px; height:72px; animation:preSpin 2.6s linear infinite; }
.preloader__mark img { width:100%; height:100%; }
.preloader__line { width:140px; height:1px; overflow:hidden; background:rgba(216,184,121,.22); }
.preloader__line i { display:block; width:100%; height:100%; background:var(--gold); transform:translateX(-100%); animation:preLine 1.25s var(--ease) forwards; }
.preloader > span { font-size:10px; letter-spacing:.24em; text-transform:uppercase; opacity:.62; }
body.is-ready .preloader { opacity:0; visibility:hidden; }
@keyframes preSpin { to { transform:rotate(360deg); } }
@keyframes preLine { to { transform:translateX(0); } }

.transition-iris { position:fixed; inset:0; z-index:90; pointer-events:none; overflow:hidden; visibility:hidden; }
.transition-iris i { position:absolute; left:50%; top:50%; width:10vmax; aspect-ratio:1; border-radius:50%; background:var(--forest); box-shadow:0 0 0 2px var(--gold), 0 0 80px rgba(216,184,121,.35); transform:translate(-50%,-50%) scale(0); }
body.is-leaving .transition-iris { visibility:visible; }
body.is-leaving .transition-iris i { animation:irisOut .8s var(--ease) forwards; }
@keyframes irisOut { 0%{transform:translate(-50%,-50%) scale(0)} 55%{box-shadow:0 0 0 2px var(--gold),0 0 80px rgba(216,184,121,.35)} 100%{transform:translate(-50%,-50%) scale(30);box-shadow:none} }

.cursor-halo { position:fixed; z-index:80; width:34px; height:34px; border:1px solid rgba(243,239,231,.55); border-radius:50%; pointer-events:none; transform:translate(-50%,-50%); opacity:0; transition:width .25s,height .25s,background .25s,border-color .25s,opacity .25s; mix-blend-mode:difference; }
.cursor-halo.on { opacity:1; }
.cursor-halo.active { width:58px; height:58px; background:rgba(255,255,255,.16); border-color:#fff; }

.topbar { position:fixed; z-index:40; left:0; top:0; width:100%; min-height:88px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; padding:22px clamp(22px,4vw,68px); color:#fff; border-bottom:1px solid rgba(255,255,255,.14); background:linear-gradient(to bottom,rgba(7,26,20,.42),transparent); }
.wordmark { display:inline-flex; align-items:center; justify-self:start; gap:13px; min-height:44px; }
.wordmark img { width:34px; height:34px; }
.wordmark span { font-size:13px; font-weight:400; letter-spacing:.42em; }
.topbar__place { display:flex; align-items:center; gap:10px; font-size:11px; letter-spacing:.16em; text-transform:uppercase; opacity:.78; }
.topbar__place i { width:6px; height:6px; background:var(--gold); border-radius:50%; box-shadow:0 0 0 5px rgba(216,184,121,.12); }
.topbar__actions { justify-self:end; display:flex; align-items:center; gap:26px; }
.sound-toggle { display:flex; align-items:center; gap:9px; border:0; padding:10px 0; background:none; cursor:pointer; font-size:11px; letter-spacing:.14em; text-transform:uppercase; opacity:.8; }
.sound-toggle > span { width:14px; height:14px; border:1px solid currentColor; border-radius:50%; position:relative; }
.sound-toggle[aria-pressed="true"] > span::after { content:""; position:absolute; inset:3px; background:var(--gold); border-radius:50%; }
.book-link { border:1px solid rgba(255,255,255,.42); border-radius:999px; padding:12px 17px; font-size:12px; letter-spacing:.05em; background:rgba(7,26,20,.14); backdrop-filter:blur(10px); transition:background .25s,color .25s,border-color .25s; }
.book-link:hover { background:var(--gold); border-color:var(--gold); color:var(--forest); }
.book-link b { font-weight:400; margin-left:10px; }

.hero { position:relative; min-height:100svh; overflow:hidden; isolation:isolate; background:#112d23; }
.hero__media,.invitation__media,.room__media { position:absolute; inset:-4%; z-index:-3; will-change:transform; }
.hero__media picture,.hero__media img,.invitation__media img,.room__media picture,.room__media img { width:100%; height:100%; display:block; object-fit:cover; }
.hero__media img { object-position:52% 50%; }
.hero__shade { position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(5,20,15,.56) 0%,rgba(5,20,15,.13) 48%,rgba(5,20,15,.22) 100%),linear-gradient(to top,rgba(5,20,15,.64),transparent 52%); }
.hero__copy { position:absolute; z-index:2; left:clamp(22px,7vw,110px); top:50%; transform:translateY(-46%); max-width:min(850px,66vw); }
.chapter { display:flex; align-items:center; gap:14px; margin:0 0 18px; font-size:10px; letter-spacing:.23em; text-transform:uppercase; }
.chapter span { display:inline-grid; place-items:center; width:31px; height:31px; border:1px solid rgba(255,255,255,.52); border-radius:50%; letter-spacing:0; }
.chapter.dark { color:rgba(16,35,28,.72); }
.chapter.dark span { border-color:rgba(16,35,28,.35); }
h1,h2 { font-family:"Cormorant Garamond",serif; font-weight:400; }
.hero h1 { margin:0; font-size:clamp(68px,10.4vw,176px); letter-spacing:-.055em; line-height:.72; text-shadow:0 6px 45px rgba(0,0,0,.18); }
.hero h1 span,.hero h1 em { display:block; }
.hero h1 em { margin-left:.65em; color:var(--gold); font-weight:400; }
.hero__intro { max-width:43ch; margin:42px 0 0 .7em; font-size:clamp(13px,1.15vw,17px); line-height:1.65; letter-spacing:.015em; }
.hero__copy > * { opacity:0; transform:translateY(28px); }
body.is-ready .hero__copy > * { animation:reveal 1.2s var(--ease) forwards; }
body.is-ready .hero__copy h1 { animation-delay:.12s; }
body.is-ready .hero__copy .hero__intro { animation-delay:.28s; }
@keyframes reveal { to { opacity:1; transform:translateY(0); } }

.portal-link { position:absolute; z-index:4; right:clamp(34px,8vw,140px); top:50%; width:clamp(118px,12vw,174px); aspect-ratio:1; transform:translateY(-35%); display:grid; place-items:center; border-radius:50%; color:#fff; }
.portal-link svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; animation:portalSpin 20s linear infinite; }
.portal-link text { fill:#fff; font-family:"Inter",sans-serif; font-size:8px; letter-spacing:2.15px; }
.portal-link__core { width:58%; aspect-ratio:1; display:grid; place-content:center; justify-items:center; gap:3px; border-radius:50%; background:rgba(7,26,20,.68); border:1px solid rgba(255,255,255,.5); backdrop-filter:blur(12px); transition:transform .45s var(--ease),background .45s; }
.portal-link__core b { font-family:"Cormorant Garamond",serif; font-size:22px; font-weight:400; }
.portal-link__core i { font-style:normal; color:var(--gold); }
.portal-link__pulse { position:absolute; inset:14%; border:1px solid rgba(216,184,121,.72); border-radius:50%; animation:portalPulse 2.4s ease-out infinite; }
.portal-link:hover .portal-link__core { transform:scale(1.15); background:var(--gold); color:var(--forest); }
@keyframes portalSpin { to { transform:rotate(360deg); } }
@keyframes portalPulse { 0%{transform:scale(.72);opacity:0} 28%{opacity:.9} 100%{transform:scale(1.55);opacity:0} }

.hero__meta { position:absolute; z-index:2; left:clamp(22px,4vw,68px); right:clamp(22px,4vw,68px); bottom:25px; display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:24px; border-top:1px solid rgba(255,255,255,.22); padding-top:18px; }
.hero__meta p { margin:0; font-size:11px; letter-spacing:.11em; }
.hero__meta p span { display:block; margin-bottom:6px; font-size:9px; letter-spacing:.2em; text-transform:uppercase; opacity:.6; }
.hero__prompt { display:flex; align-items:center; gap:11px; text-transform:uppercase; }
.hero__prompt i { display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(255,255,255,.36); border-radius:50%; font-style:normal; animation:nudge 1.8s ease-in-out infinite; }
@keyframes nudge { 50% { transform:translateY(5px); } }

.manifesto { min-height:94svh; padding:clamp(90px,13vw,190px) clamp(24px,7vw,110px); background:var(--bone); color:var(--ink); position:relative; overflow:hidden; }
.manifesto__grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr); gap:clamp(45px,9vw,150px); align-items:end; }
.manifesto h2 { margin:0; font-size:clamp(54px,7.7vw,126px); line-height:.86; letter-spacing:-.045em; }
.manifesto h2 em { color:#6d806f; }
.manifesto__grid > div { padding-bottom:12px; }
.manifesto__grid p { max-width:34ch; font-size:clamp(15px,1.25vw,18px); line-height:1.75; }
.text-link { display:inline-flex; align-items:center; gap:18px; margin-top:22px; padding-bottom:8px; border-bottom:1px solid rgba(16,35,28,.38); font-size:13px; font-weight:400; }
.text-link span { transition:transform .25s; }
.text-link:hover span { transform:translate(4px,-4px); }
.manifesto__orbit { position:absolute; right:-100px; bottom:-110px; width:460px; height:460px; border:1px solid rgba(16,35,28,.13); border-radius:50%; animation:portalSpin 40s linear infinite; }
.manifesto__orbit::before,.manifesto__orbit::after { content:""; position:absolute; inset:54px; border:1px solid rgba(16,35,28,.1); border-radius:50%; }
.manifesto__orbit::after { inset:110px; }
.manifesto__orbit span { position:absolute; font-family:"Cormorant Garamond",serif; font-size:17px; color:#617265; }
.manifesto__orbit span:nth-child(1){left:50%;top:-10px}.manifesto__orbit span:nth-child(2){right:-20px;top:34%}.manifesto__orbit span:nth-child(3){right:12%;bottom:5%}.manifesto__orbit span:nth-child(4){left:5%;bottom:15%}.manifesto__orbit span:nth-child(5){left:-25px;top:28%}

.invitation { min-height:100svh; position:relative; isolation:isolate; display:flex; align-items:center; padding:100px clamp(24px,7vw,110px); overflow:hidden; }
.invitation__media { inset:-10%; }
.invitation__media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,26,20,.72),rgba(7,26,20,.16) 68%),linear-gradient(to top,rgba(7,26,20,.45),transparent); }
.invitation__copy { max-width:800px; }
.invitation h2 { margin:0 0 42px; font-size:clamp(66px,9vw,150px); line-height:.78; letter-spacing:-.05em; }
.invitation h2 em { color:var(--gold); }
.round-link { display:inline-flex; align-items:center; gap:32px; border:1px solid rgba(255,255,255,.48); border-radius:999px; padding:8px 9px 8px 24px; font-size:13px; }
.round-link b { width:46px; height:46px; display:grid; place-items:center; background:var(--gold); color:var(--forest); border-radius:50%; transition:transform .35s var(--ease); }
.round-link:hover b { transform:rotate(45deg) scale(1.08); }

/* Interior page */
.dome { height:100svh; overflow:hidden; }
.room { position:relative; width:100%; height:100svh; overflow:hidden; isolation:isolate; background:#071711; }
.room__media { inset:-4% -8%; cursor:grab; touch-action:none; user-select:none; transform:translate3d(var(--look-x,0),var(--look-y,0),0) scale(1.04); transition:transform .12s linear; }
.room__media:active { cursor:grabbing; }
.room__media img { object-position:center; -webkit-user-drag:none; user-select:none; }
.room__shade { position:absolute; inset:0; z-index:-2; pointer-events:none; background:linear-gradient(90deg,rgba(4,14,11,.75) 0%,rgba(4,14,11,.36) 32%,transparent 62%),linear-gradient(to top,rgba(4,14,11,.55),transparent 42%); }
.room__copy { position:absolute; left:clamp(24px,5.8vw,96px); top:50%; transform:translateY(-46%); width:min(590px,45vw); }
.room__copy h1 { margin:0; font-size:clamp(58px,7vw,116px); line-height:.77; letter-spacing:-.045em; }
.room__copy h1 em { color:var(--gold); }
.room__copy > p:last-child { max-width:34ch; margin:34px 0 0; line-height:1.65; font-size:14px; }
.room__copy > * { opacity:0; transform:translateY(24px); }
body.is-ready .room__copy > * { animation:reveal 1.1s var(--ease) forwards; }
body.is-ready .room__copy h1 { animation-delay:.12s; }
body.is-ready .room__copy > p:last-child { animation-delay:.24s; }

.look-guide { position:absolute; left:50%; top:112px; transform:translateX(-50%); text-align:center; transition:opacity .55s; }
.look-guide.hide { opacity:0; }
.look-guide > span { display:block; margin-bottom:10px; font-size:9px; letter-spacing:.22em; text-transform:uppercase; }
.look-guide > div { display:flex; align-items:center; gap:9px; justify-content:center; }
.look-guide i { font-style:normal; opacity:.7; }
.look-guide b { display:block; width:46px; height:18px; position:relative; }
.look-guide b::before { content:""; position:absolute; left:50%; top:0; width:13px; height:17px; border:1px solid #fff; border-radius:8px 8px 6px 6px; animation:dragCue 2.4s var(--ease) infinite; }
@keyframes dragCue { 0%,100%{transform:translateX(-30px)} 50%{transform:translateX(16px)} }

.hotspot { position:absolute; left:var(--x); top:var(--y); z-index:8; transform:translate(-50%,-50%); transition:transform .18s; }
.hotspot button { position:relative; width:108px; height:108px; padding:0; border:0; border-radius:50%; background:none; cursor:pointer; color:#fff; }
.hotspot button::before,.hotspot button::after { content:""; position:absolute; inset:22px; border:1px solid rgba(255,255,255,.76); border-radius:50%; transition:transform .35s,background .35s; }
.hotspot button::after { inset:8px; border-color:rgba(216,184,121,.5); animation:hotPulse 2.3s ease-out infinite; }
.hotspot button i { position:absolute; left:50%; top:50%; width:6px; height:6px; border-radius:50%; background:var(--gold); transform:translate(-50%,-50%); box-shadow:0 0 18px 6px rgba(216,184,121,.38); }
.hotspot button span { position:absolute; left:50%; top:82%; transform:translateX(-50%); white-space:nowrap; padding:5px 9px; border-radius:999px; background:rgba(7,26,20,.7); backdrop-filter:blur(8px); font-size:9px; letter-spacing:.16em; text-transform:uppercase; opacity:0; transition:opacity .25s,top .25s; }
.hotspot button:hover::before,.hotspot button:focus-visible::before { transform:scale(1.24); background:rgba(216,184,121,.13); }
.hotspot button:hover span,.hotspot button:focus-visible span { top:91%; opacity:1; }
.dome:not(.has-interacted) .hotspot button span { top:91%; opacity:1; }
.hotspot.seen button::after { animation:none; opacity:.25; }
@keyframes hotPulse { 0%{transform:scale(.55);opacity:0} 30%{opacity:.85} 100%{transform:scale(1.35);opacity:0} }

.story-card { position:absolute; z-index:20; right:clamp(22px,4vw,68px); bottom:92px; width:min(390px,calc(100vw - 44px)); padding:28px 30px 30px; background:rgba(7,26,20,.74); border:1px solid rgba(216,184,121,.55); backdrop-filter:blur(18px); opacity:0; transform:translateY(24px); pointer-events:none; transition:opacity .45s var(--ease),transform .45s var(--ease); }
.story-card.show { opacity:1; transform:none; pointer-events:auto; }
.story-card__close { position:absolute; right:13px; top:10px; width:34px; height:34px; border:0; background:none; cursor:pointer; font-size:22px; }
.story-card__number { margin:0 0 28px; color:var(--gold); font-size:9px; letter-spacing:.22em; }
.story-card h2 { margin:0 0 12px; font-size:42px; line-height:1; color:var(--gold); }
.story-card__body { margin:0; font-size:13px; line-height:1.7; }

.room__footer { position:absolute; z-index:9; left:clamp(22px,4vw,68px); right:clamp(22px,4vw,68px); bottom:21px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; padding-top:15px; border-top:1px solid rgba(255,255,255,.2); }
.room__footer > a { justify-self:start; display:flex; gap:11px; align-items:center; font-size:11px; letter-spacing:.08em; }
.room__footer > p { margin:0; font-size:11px; letter-spacing:.1em; }
.room__footer > p span { opacity:.55; margin-right:9px; text-transform:uppercase; font-size:9px; letter-spacing:.2em; }
.availability { justify-self:end; border:0; background:none; cursor:pointer; font-size:11px; letter-spacing:.08em; padding:10px 0; }
.availability span { margin-left:12px; color:var(--gold); }
.demo-note { position:absolute; z-index:25; right:clamp(22px,4vw,68px); bottom:82px; background:var(--bone); color:var(--ink); padding:12px 16px; font-size:11px; opacity:0; transform:translateY(12px); pointer-events:none; transition:.35s var(--ease); }
.demo-note.show { opacity:1; transform:none; }

@media (max-width:900px) {
  .topbar { min-height:70px; padding:14px 18px; grid-template-columns:1fr auto; }
  .topbar__place { display:none; }
  .wordmark span { font-size:11px; letter-spacing:.3em; }
  .sound-toggle { display:none; }
  .book-link { padding:10px 13px; }
  .hero__copy { left:22px; top:44%; max-width:calc(100vw - 44px); }
  .hero h1 { font-size:clamp(66px,18vw,110px); }
  .hero h1 em { margin-left:.18em; }
  .hero__intro { max-width:31ch; margin-top:28px; margin-left:0; }
  .portal-link { right:24px; top:auto; bottom:86px; width:116px; transform:none; }
  .hero__meta { grid-template-columns:1fr auto; }
  .hero__meta p:nth-child(2) { display:none; }
  .hero__prompt span { display:none; }
  .manifesto { min-height:auto; }
  .manifesto__grid { grid-template-columns:1fr; }
  .manifesto__orbit { opacity:.55; transform:scale(.7); transform-origin:bottom right; }
  .invitation h2 { font-size:clamp(64px,17vw,106px); }
  .room__copy { left:22px; top:44%; width:calc(100vw - 44px); }
  .room__copy h1 { font-size:clamp(58px,14vw,96px); }
  .hotspot button { width:82px; height:82px; }
  .hotspot button::before { inset:19px; }
  .hotspot--materials { display:none; }
  .room__footer { grid-template-columns:1fr auto; }
  .room__footer > p { display:none; }
}

@media (max-width:560px) {
  .book-link { font-size:0; width:43px; height:43px; display:grid; place-items:center; padding:0; }
  .book-link b { font-size:15px; margin:0; }
  .hero__copy { top:40%; }
  .hero h1 { line-height:.78; }
  .chapter { margin-bottom:14px; }
  .hero__intro { font-size:13px; }
  .portal-link { bottom:90px; }
  .manifesto__grid { gap:32px; }
  .manifesto h2 { font-size:clamp(50px,14.5vw,78px); }
  .invitation { align-items:flex-end; padding-bottom:110px; }
  .invitation h2 { line-height:.82; }
  .room__copy { top:34%; }
  .room__copy h1 { font-size:clamp(51px,13.8vw,78px); }
  .room__copy > p:last-child { max-width:27ch; margin-top:22px; }
  .look-guide { top:84px; }
  .hotspot--sleep { --x:69%!important;--y:57%!important; }
  .hotspot--water { --x:30%!important;--y:60%!important; }
  .story-card { bottom:78px; }
  .availability { font-size:0; width:42px; height:42px; border:1px solid rgba(255,255,255,.4); border-radius:50%; }
  .availability span { font-size:15px; margin:0; }
}

@media (pointer:coarse) { .cursor-halo { display:none; } .hotspot button span { opacity:1; top:89%; } }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .room__media { transform:none!important; }
}