/* by yuyay — palette A: ivory and linen walls, espresso depth, olive accent, serif capitals. Single light theme by design. */
:root{
  --paper:#FFFFFF; --paper-2:#F5F2EC; --ink:#161513; --soft:#5A4F48; --muted:#9E9283;
  --line:rgba(58,48,44,.14); --olive:#4A5139; --espresso:#3A302C; --taupe:#B9AC98;
  --serif:"Cormorant Garamond","Cormorant",Georgia,serif; --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --gl:max(24px, env(safe-area-inset-left,0px)); --gr:max(24px, env(safe-area-inset-right,0px));
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:15.5px;line-height:1.8;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
a{color:inherit}
[hidden]{display:none!important}
.wrap{max-width:1200px;margin:0 auto;padding-left:var(--gl);padding-right:var(--gr)}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.1;margin:0;text-wrap:balance}
.caps{text-transform:uppercase;letter-spacing:.04em}
em{font-style:italic}
.label{font-size:10px;font-weight:400;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
:focus-visible{outline:1px solid var(--olive);outline-offset:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;font:400 10.5px/1 var(--sans);letter-spacing:.3em;text-transform:uppercase;text-decoration:none;padding:17px 32px;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;transition:background .35s,color .35s}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.dark{background:var(--ink);color:var(--paper)}
.btn.dark:hover{background:var(--espresso);border-color:var(--espresso)}
.link{font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:5px;transition:color .3s,border-color .3s}
.link:hover{color:var(--olive);border-color:var(--olive)}

/* prototype ribbon */
.proto{background:var(--paper-2);color:var(--soft);font-size:10px;letter-spacing:.2em;text-transform:uppercase;padding-block:8px}
.proto .wrap{display:flex;gap:16px;justify-content:center;align-items:center;flex-wrap:wrap}
.proto button{font:inherit;letter-spacing:inherit;text-transform:inherit;background:none;border:0;border-bottom:1px solid transparent;color:var(--muted);cursor:pointer;padding:2px 0}
.proto button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--ink)}

/* header: menu · logo · inquire */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--paper)}
.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(8px)}
.site .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding-block:22px;max-width:none}
.burger{justify-self:start;display:flex;align-items:center;gap:14px;background:none;border:0;padding:6px 0;cursor:pointer;color:var(--ink);font:400 10px var(--sans);letter-spacing:.3em;text-transform:uppercase}
.burger i{display:grid;gap:5px;width:30px}
.burger i::before,.burger i::after{content:"";height:1px;background:currentColor}
.logo{font-family:var(--serif);font-size:28px;font-weight:400;text-decoration:none;letter-spacing:.14em;text-transform:uppercase;line-height:1;white-space:nowrap}
.logo i{font-style:italic;text-transform:none;letter-spacing:.02em}
.inq{justify-self:end;font-size:10px;letter-spacing:.3em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:4px}
.inq:hover{color:var(--olive);border-color:var(--olive)}
@media (max-width:560px){.burger span{display:none}.logo{font-size:22px}}
/* home: header floats over the cover video, only the brand name in the middle */
.site.over{position:absolute;left:0;right:0;top:env(safe-area-inset-top,0px);background:transparent;backdrop-filter:none;color:#fff}
.site.over .wrap{padding-block:26px}
.site.over .burger,.site.over .inq{color:#fff;border-color:rgba(255,255,255,.8);opacity:.85}
.site.over .logo{font-size:clamp(26px,3.2vw,44px);letter-spacing:.32em;text-shadow:0 1px 18px rgba(0,0,0,.25)}
.site.over .logo i{font-style:normal;text-transform:uppercase;letter-spacing:.32em}

/* full-screen menu */
.overlay{position:fixed;inset:0;z-index:50;background:var(--paper);display:grid;grid-template-rows:auto 1fr auto;padding:calc(22px + env(safe-area-inset-top,0px)) var(--gr) calc(30px + env(safe-area-inset-bottom,0px)) var(--gl);animation:menu .4s ease both}
@keyframes menu{from{opacity:0}to{opacity:1}}
.overlay .top{display:flex;justify-content:space-between;align-items:center}
.overlay .close{background:none;border:0;font:400 10px var(--sans);letter-spacing:.3em;text-transform:uppercase;cursor:pointer;color:var(--ink);padding:6px 0}
.overlay nav{display:grid;align-content:center;justify-items:center;gap:6px}
.overlay nav a{font-family:var(--serif);font-size:clamp(34px,5vw,56px);text-decoration:none;text-transform:uppercase;letter-spacing:.06em;line-height:1.25;color:var(--soft);transition:color .3s}
.overlay nav a:hover,.overlay nav a[aria-current="page"]{color:var(--ink)}
.overlay nav a.minis{font-style:italic;text-transform:none;letter-spacing:.01em;color:var(--olive)}
.overlay .bottom{display:flex;justify-content:center;gap:24px;flex-wrap:wrap}

/* inner page title */
.pagehead .wrap{padding-block:clamp(60px,8vw,120px) clamp(36px,5vw,64px);display:grid;gap:20px;justify-items:center;text-align:center}
.pagehead h1{font-size:clamp(36px,5vw,64px);text-transform:uppercase;letter-spacing:.04em;font-weight:400}
.pagehead p{max-width:52ch;color:var(--soft);margin:0}

/* closing band */
.next .wrap{display:grid;justify-items:center;text-align:center;gap:26px;padding-block:clamp(70px,9vw,130px)}
.next h2{font-size:clamp(28px,3.4vw,44px);text-transform:uppercase;letter-spacing:.04em}

footer.foot .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;padding-block:34px;font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line)}
footer.foot a{text-decoration:none}
footer.foot a:hover{color:var(--ink)}

@keyframes fade{from{transform:translateY(10px)}to{transform:none}}
.rise{animation:fade 1.4s ease both}
.rise.d2{animation-delay:.2s}.rise.d3{animation-delay:.4s}

/* inner page covers: one large photograph, the title in capitals */
.pcover{position:relative;height:min(78svh,760px);min-height:420px;overflow:hidden;color:#fff;display:grid;align-items:end;background:#111}
.pcover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none}
.pcover::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.36),transparent 24%,transparent 52%,rgba(0,0,0,.42));pointer-events:none}
.pcover .t{position:relative;z-index:1;display:grid;justify-items:center;text-align:center;gap:12px;padding:0 var(--gr) clamp(36px,5vw,64px) var(--gl)}
.pcover h1{font-size:clamp(34px,5.2vw,70px);text-transform:uppercase;letter-spacing:.05em;font-weight:400;text-shadow:0 1px 24px rgba(0,0,0,.2)}
.pcover .label{color:rgba(255,255,255,.88)}
.pagehead.slim .wrap{padding-block:clamp(40px,5vw,64px) clamp(20px,3vw,36px)}
.pagehead.slim p{font-size:16.5px}