:root{
  --green:#0B4033;--deep:#08251d;--cream:#F5EBDA;--sand:#EADFC8;--brass:#C9A56B;--ink:#1d2622;
  --bg:var(--cream);--fg:var(--ink);--muted:#5d665f;--card:#fbf5e9;--line:rgba(11,64,51,.18);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;--sans:'Jost',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --pad:clamp(20px,5vw,72px);box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0c1a15;--fg:#f1e8d6;--muted:#a9b3aa;--card:#12261e;--line:rgba(201,165,107,.25)}}
:root[data-theme="dark"]{--bg:#0c1a15;--fg:#f1e8d6;--muted:#a9b3aa;--card:#12261e;--line:rgba(201,165,107,.25)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(84px + env(safe-area-inset-top,0px));-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:300 clamp(16px,1.05vw + 12px,18px)/1.7 var(--sans);overflow-x:hidden;overflow-wrap:anywhere}
img,svg{max-width:100%}
h1,h2,h3,p{margin:0;overflow-wrap:break-word;hyphens:auto}
h2,h3{font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-.01em}
h2{font-size:clamp(2.2rem,5.2vw,4.2rem)}
a{color:inherit}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 var(--pad)}
section{padding:clamp(72px,11vw,150px) 0}
.lead{max-width:56ch;color:var(--muted);margin-top:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 34px;border-radius:999px;border:1px solid var(--brass);background:var(--brass);color:#1a1408;font:500 .95rem var(--sans);letter-spacing:.04em;text-decoration:none;cursor:pointer;transition:background .3s,color .3s,transform .3s}
.btn:hover{background:transparent;color:var(--brass)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.btn.ghost:hover{background:var(--cream);color:var(--green)}

/* nav */
header{position:fixed;inset:0 0 auto 0;z-index:50;padding-top:env(safe-area-inset-top,0px);transition:background .4s,backdrop-filter .4s}
header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(8,37,29,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);opacity:0;transition:opacity .4s}header.solid::before{opacity:1}
.logo,.burger{position:relative;z-index:2}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px;color:var(--cream)}
.logo{text-decoration:none;display:flex;flex-direction:column;line-height:1;min-width:0}
.logo small{font-size:.6rem;letter-spacing:.42em;font-weight:300}
.logo b{font:500 1.5rem var(--sans);letter-spacing:.2em}
.links{display:flex;gap:clamp(18px,2.6vw,38px);align-items:center}
.links a{text-decoration:none;font-size:.92rem;letter-spacing:.06em;opacity:.85;transition:opacity .3s}
.links a:hover{opacity:1}
.links .btn{min-height:42px;padding:0 24px;opacity:1;color:#1a1408}
.burger{display:none;width:46px;height:46px;border:1px solid rgba(245,235,218,.4);border-radius:50%;background:none;color:var(--cream);cursor:pointer;position:relative}
.burger i,.burger i::before{position:absolute;left:14px;width:16px;height:1.5px;background:currentColor;transition:transform .3s}
.burger i{top:22px}.burger i::before{content:"";left:0;top:-5px;box-shadow:0 10px 0 currentColor}
.burger[aria-expanded="true"] i{transform:rotate(45deg)}
.burger[aria-expanded="true"] i::before{transform:translateY(5px) rotate(90deg);box-shadow:none}
@media (max-width:820px){
  .burger{display:block}
  .links{position:fixed;inset:0;z-index:1;height:100vh;height:100dvh;overflow-y:auto;background:radial-gradient(90% 60% at 80% 0,#14594a,var(--deep) 70%);flex-direction:column;align-items:center;justify-content:flex-start;gap:26px;padding:96px 24px 40px;text-align:center;visibility:hidden;clip-path:circle(0 at calc(100% - 44px) 36px);transition:clip-path .7s cubic-bezier(.7,0,.2,1),visibility 0s .7s}
  .links a{font:400 clamp(1.8rem,8vw,2.6rem) var(--serif);opacity:0;transform:translateY(18px);transition:opacity .5s,transform .5s}
  .links a:first-child{margin-top:auto}
  .links .btn{font:500 1rem var(--sans);margin-bottom:auto}
  body.open .links{visibility:visible;clip-path:circle(150% at calc(100% - 44px) 36px);transition:clip-path .7s cubic-bezier(.7,0,.2,1),visibility 0s}
  body.open .links a{opacity:1;transform:none}
  body.open .links a:nth-child(1){transition-delay:.25s}body.open .links a:nth-child(2){transition-delay:.32s}body.open .links a:nth-child(3){transition-delay:.39s}body.open .links a:nth-child(4){transition-delay:.46s}body.open .links a:nth-child(5){transition-delay:.53s}
}

/* hero */
.hero{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:end;background:radial-gradient(120% 90% at 70% 10%,#14594a 0,var(--green) 40%,var(--deep) 100%);color:var(--cream);overflow:hidden;padding:0}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at var(--x,72%) var(--y,30%),rgba(240,190,110,.32),transparent 65%);transition:background .15s;pointer-events:none}
.arch{position:absolute;right:max(var(--pad),4vw);top:50%;transform:translateY(calc(-52% + var(--py,0px)));width:min(34vw,420px);aspect-ratio:3/4.4;border-radius:999px 999px 14px 14px;border:1px solid rgba(201,165,107,.55);background:linear-gradient(180deg,rgba(240,190,110,.16),rgba(245,235,218,.03));box-shadow:inset 0 0 90px rgba(240,190,110,.12);animation:glow 6s ease-in-out infinite alternate}
.arch::after{content:"";position:absolute;inset:14px;border-radius:999px 999px 8px 8px;border:1px solid rgba(201,165,107,.22)}
@keyframes glow{to{box-shadow:inset 0 0 130px rgba(240,190,110,.28),0 0 90px rgba(240,190,110,.10)}}
.hero .wrap{position:relative;z-index:2;padding-top:130px;padding-bottom:clamp(48px,9vh,110px)}
.hero small{display:block;font-size:clamp(.7rem,1.6vw,.95rem);letter-spacing:.7em;margin-bottom:10px;font-weight:300}
.hero h1{font:500 clamp(3.4rem,17vw,13rem)/.95 var(--sans);letter-spacing:.14em;margin-left:-.05em;word-break:keep-all;hyphens:none}
.hero p{font:italic 400 clamp(1.25rem,3vw,2rem)/1.3 var(--serif);max-width:24ch;margin-top:26px;color:#e9dcc2}
.hero .cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
@media (max-width:820px){.arch{width:56vw;top:24%;transform:translateY(var(--py,0px));opacity:.55}}
@media (prefers-reduced-motion:no-preference){.hero p,.hero .cta,.hero small{animation:rise 1.2s cubic-bezier(.2,.7,.2,1) both}.hero h1 span{display:inline-block;animation:rise 1.2s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i)*.1s + .15s)}.hero p{animation-delay:.9s}.hero .cta{animation-delay:1.1s}}
@keyframes rise{from{opacity:0;transform:translateY(28px)}}

/* effects */
.bar{position:fixed;top:0;left:0;height:2px;width:100%;transform:scaleX(0);transform-origin:0 50%;background:var(--brass);z-index:70;pointer-events:none}
.motes{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.mote{position:absolute;bottom:-12px;left:var(--l);width:var(--s);height:var(--s);border-radius:50%;background:rgba(240,190,110,.85);box-shadow:0 0 8px rgba(240,190,110,.7);opacity:0;animation:float var(--t) linear var(--dl) infinite}
@keyframes float{0%{transform:translate3d(0,0,0);opacity:0}12%{opacity:.85}100%{transform:translate3d(var(--x),-105vh,0);opacity:0}}
.cue{position:absolute;left:50%;bottom:20px;width:1px;height:46px;background:linear-gradient(var(--brass),transparent);transform-origin:top;animation:cue 2.2s ease-in-out infinite;z-index:2}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@media (max-width:820px),(max-height:560px){.cue{display:none}}
.marq{overflow:hidden;border-bottom:1px solid var(--line);padding:22px 0;background:var(--bg)}
.track{display:flex;width:max-content;animation:mq 60s linear infinite}
.track:hover{animation-play-state:paused}
.set{display:flex;align-items:center;gap:36px;padding-right:36px;font:italic 400 clamp(1.4rem,3vw,2rem)/1.2 var(--serif);white-space:nowrap}
.set i{color:var(--brass);font-style:normal;font-size:.7em}
@keyframes mq{to{transform:translateX(-50%)}}
@media (hover:hover){.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}.btn:hover::after{transform:translateX(120%);transition:transform .8s}}
.btn{position:relative;overflow:hidden}

/* stats */
.stats{background:var(--green);color:var(--cream);padding:clamp(40px,6vw,72px) 0}
.stats ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:28px 20px}
.stats b{display:block;font:400 clamp(2.4rem,5vw,3.8rem)/1 var(--serif);color:var(--brass)}
.stats span{font-size:.9rem;opacity:.8}

/* story */
.story .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(32px,7vw,110px);align-items:start}
.story h2 em,.owners h2 em{font-style:italic;color:var(--green)}
.pillars{display:grid;gap:0;border-top:1px solid var(--line)}
.pillars div{padding:26px 0;border-bottom:1px solid var(--line)}
.pillars h3{font-size:1.7rem}.pillars p{color:var(--muted);margin-top:6px}
@media (max-width:820px){.story .wrap{grid-template-columns:1fr}}

/* stays */
.stays{background:var(--sand)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .stays{background:#0f2119}}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin:34px 0 40px}
.chip{min-height:44px;padding:0 22px;border-radius:999px;border:1px solid var(--line);background:transparent;color:inherit;font:400 .92rem var(--sans);cursor:pointer;transition:all .3s}
.chip[aria-pressed="true"]{background:var(--green);color:var(--cream);border-color:var(--green)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));gap:22px}
.card{position:relative;will-change:transform;display:flex;flex-direction:column;justify-content:flex-end;min-height:400px;padding:26px;border-radius:200px 200px 16px 16px;color:var(--cream);overflow:hidden;background:linear-gradient(165deg,var(--a),var(--b));isolation:isolate;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.card:hover{box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
.card::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 22%,rgba(255,214,150,.38),transparent 55%),linear-gradient(0deg,rgba(0,0,0,.55),transparent 60%);transition:opacity .5s}
.card:hover{transform:translateY(-8px)}
.card[hidden]{display:none}
.card h3{font-size:clamp(1.8rem,3vw,2.2rem)}
.card p{font-size:.92rem;opacity:.88;margin:8px 0 18px}
.card button{align-self:flex-start;min-height:44px;padding:0 22px;border-radius:999px;border:1px solid rgba(245,235,218,.6);background:transparent;color:var(--cream);font:400 .9rem var(--sans);cursor:pointer;transition:all .3s}
.card button:hover{background:var(--cream);color:var(--green)}
.card .tag{position:absolute;top:22px;left:50%;transform:translateX(-50%);font-size:.75rem;letter-spacing:.2em;opacity:.8;text-align:center;width:70%}

/* experience */
.exp .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:clamp(24px,4vw,56px);margin-top:56px}
.exp .row div{border-top:1px solid var(--brass);padding-top:22px}
.exp h3{font-size:1.9rem}.exp p{color:var(--muted);margin-top:10px}

/* book */
.book{background:var(--deep);color:var(--cream)}
.book .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,7vw,100px);align-items:start}
.book .lead{color:#c9d2c8}
form{display:grid;gap:18px;grid-template-columns:1fr 1fr;min-width:0}
label{display:grid;gap:8px;font-size:.88rem;letter-spacing:.05em;min-width:0}
.full{grid-column:1/-1}
input,select,textarea{width:100%;min-width:0;min-height:52px;padding:12px 16px;border-radius:12px;border:1px solid rgba(245,235,218,.3);background:rgba(245,235,218,.06);color:var(--cream);font:300 1rem var(--sans);color-scheme:dark}
select option{color:#111}
input:focus,select:focus,textarea:focus{border-color:var(--brass);outline:none}
.note{font-size:.85rem;color:#a9b8ad;grid-column:1/-1}
.err{color:#ffb4a2;font-size:.85rem;grid-column:1/-1;min-height:1.2em}
@media (max-width:820px){.book .wrap{grid-template-columns:1fr}}
@media (max-width:480px){form{grid-template-columns:1fr}}

/* owners */
.owners .wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,90px);align-items:center}
.terms{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.terms div{background:var(--card);padding:26px 22px}
.terms b{display:block;font:400 clamp(2rem,4vw,3rem)/1 var(--serif);color:var(--green)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .terms b{color:var(--brass)}}
.terms span{font-size:.88rem;color:var(--muted)}
@media (max-width:820px){.owners .wrap{grid-template-columns:1fr}}

footer{background:var(--green);color:var(--cream);padding:56px 0 40px}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px}
footer p,footer a{font-size:.92rem;opacity:.85;text-decoration:none}
footer .big{font:400 clamp(1.6rem,3vw,2.2rem)/1.2 var(--serif);opacity:1;max-width:20ch}

.js .rv{opacity:0;transform:translateY(24px);transition:opacity .9s,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .rv{opacity:1;transform:none}html{scroll-behavior:auto}}
.heroimg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.4s}
.heroimg.on{opacity:.42}
.card .ph{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center}
.card.hasimg::before{background:linear-gradient(0deg,rgba(0,0,0,.72),transparent 65%)}
.acts{display:flex;flex-wrap:wrap;gap:10px}
.card .acts a{display:inline-flex;align-items:center;min-height:44px;padding:0 22px;border-radius:999px;border:1px solid var(--brass);background:var(--brass);color:#1a1408;font:400 .9rem var(--sans);text-decoration:none;transition:all .3s}
.card .acts a:hover{background:transparent;color:var(--brass)}
.fab{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:45;display:flex;flex-direction:column;gap:12px}
.fab a{position:relative;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:0 10px 26px rgba(0,0,0,.35);transition:transform .3s}
.fab a:hover{transform:scale(1.08) translateY(-2px)}
.fab svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fab .wa{background:#25D366}
.fab .ig{background:radial-gradient(circle at 30% 107%,#fdf497 0,#fd5949 45%,#d6249f 60%,#285AEB 90%)}
.fab .wa::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;animation:ping 2.4s ease-out infinite;pointer-events:none}
@keyframes ping{to{transform:scale(1.6);opacity:0}}
.fab a span{position:absolute;right:calc(100% + 12px);background:var(--deep);color:var(--cream);font-size:.8rem;padding:6px 12px;border-radius:999px;white-space:nowrap;opacity:0;transform:translateX(8px);transition:opacity .3s,transform .3s;pointer-events:none}
@media (hover:hover){.fab a:hover span{opacity:1;transform:none}}
@media (max-width:480px){.fab a{width:48px;height:48px}}
footer{padding-bottom:96px}

.logo img{height:36px;width:auto;display:block}
.flogo{height:44px;width:auto;display:block;margin-bottom:18px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hero h1 .sr{animation:none}
.hero h1 span:nth-child(1){--i:0}.hero h1 span:nth-child(2){--i:1}.hero h1 span:nth-child(3){--i:2}.hero h1 span:nth-child(4){--i:3}.hero h1 span:nth-child(5){--i:4}
.btn.dk{background:var(--green);border-color:var(--green);color:var(--cream)}
.btn.dk:hover{background:transparent;color:var(--green)}
.mt{margin-top:28px}
.nf{min-height:100vh;display:grid;place-content:center;justify-items:center;text-align:center;gap:22px;background:var(--green);color:var(--cream);padding:24px}
.nf h1{font:400 clamp(2.4rem,7vw,4rem)/1.1 var(--serif)}
/* no zoom / no stretch */
html{touch-action:pan-x pan-y;overscroll-behavior:none}
body{overscroll-behavior:none}
a,button,.chip,.btn,label{touch-action:manipulation}
input,select,textarea{font-size:max(16px,1rem)}
img,svg,video{max-width:100%;height:auto}
img{-webkit-user-drag:none;user-select:none}
.card .ph,.heroimg{background-repeat:no-repeat;background-size:cover;background-position:center}
/* iPhone / Safari fixes */

/* 1. Notch space was added twice: at the top of the page and at the bottom */
:root{padding-top:0;padding-bottom:0}
html{overflow-x:clip}

/* 2. Rounded cards spill outside their corners in Safari */
.card,.terms,.arch{-webkit-mask-image:-webkit-radial-gradient(white,black);transform:translateZ(0)}

/* 3. Date fields overflow and look different on iOS */
input[type="date"]{-webkit-appearance:none;appearance:none;display:block;width:100%;min-width:0;min-height:52px;text-align:left;line-height:normal}
input[type="date"]::-webkit-date-and-time-value{text-align:left;min-height:1.4em}
input,select,textarea{-webkit-appearance:none;appearance:none;border-radius:12px}
select{background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:44px}

/* 4. Tapping a button leaves it stuck in its hover look on touch screens */
@media (hover:none){
  .btn:hover{background:var(--brass);color:#1a1408}
  .btn.ghost:hover{background:transparent;color:inherit}
  .btn.dk:hover{background:var(--green);color:var(--cream)}
  .card .acts a:hover{background:var(--brass);color:#1a1408}
  .card button:hover{background:transparent;color:var(--cream)}
  .card:hover{transform:none;box-shadow:none}
  .fab a:hover{transform:none}
}

/* 5. Mobile menu spacing under the notch */
@media (max-width:820px){
  .links{padding-top:calc(96px + env(safe-area-inset-top,0px));padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}
}
/* Check-in / Check-out overflow fix (iOS Safari) */
form{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:480px){form{grid-template-columns:minmax(0,1fr)}}
label{grid-template-columns:minmax(0,1fr);width:100%;max-width:100%;min-width:0}
input,select,textarea{max-width:100%;box-sizing:border-box}
input[type="date"]{
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  -webkit-min-logical-width:calc(100% - 16px);
  height:52px;
  padding:0 16px;
  line-height:52px;
  overflow:hidden;
  text-align:left;
  -webkit-appearance:none;
  appearance:none;
}
input[type="date"]::-webkit-datetime-edit{padding:0;display:block;line-height:52px}
input[type="date"]::-webkit-date-and-time-value{text-align:left;margin:0;min-height:0}
input[type="date"]::-webkit-calendar-picker-indicator{opacity:.7}
/* Scroll fix: restore normal page scrolling */
html{
  overflow:visible;
  height:auto;
  touch-action:manipulation;
  overscroll-behavior:auto;
}
body{
  overflow-x:hidden;
  height:auto;
  position:static;
  touch-action:auto;
  overscroll-behavior:auto;
}
/* if the mobile menu ever leaves the page locked, this unlocks it */
body:not(.open){overflow-y:visible!important}
.card .bk{width:100%;margin:10px 0 8px;font-size:.78rem;letter-spacing:.14em;opacity:.75}
.card .bk + .acts{margin-bottom:0}
#abp a{text-decoration:underline;text-underline-offset:3px}
.card.up::after{content:"";position:absolute;inset:12px;border:1px dashed rgba(245,235,218,.4);border-radius:inherit;pointer-events:none}
