:root{
  --ink:#1C3140; --sea:#2E6A73; --plaster:#EDEFEC; --stone:#D9DCD6;
  --peach:#E8B49A; --mute:#5A6B73; --white:#FFFFFF;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Jost",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(72px + env(safe-area-inset-top,0px))}
body{margin:0;background:var(--plaster);color:var(--ink);font-family:var(--sans);font-weight:300;
  font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--peach);outline-offset:3px}

/* header */
.nav{position:fixed;top:0;left:0;right:0;z-index:20;padding-top:env(safe-area-inset-top,0px);
  transition:background .3s ease, box-shadow .3s ease}
.nav-in{max-width:1240px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:18px 24px}
.nav .logo{height:22px;width:auto}
.nav .logo.navy{display:none}
.nav ul{list-style:none;display:flex;gap:28px;margin:0;padding:0;font-size:.95rem;font-weight:400}
.nav a{text-decoration:none;color:#fff}
.nav.solid{background:var(--plaster);box-shadow:0 1px 0 var(--stone)}
.nav.solid a{color:var(--ink)}
.nav.solid .logo.white{display:none}
.nav.solid .logo.navy{display:block}
.nav .cta{border:1px solid currentColor;padding:7px 14px;border-radius:2px}
.nav .cta.book-now,.nav.solid .cta.book-now{background:var(--peach);border-color:var(--peach);color:var(--ink);font-weight:500;transition:background .2s,border-color .2s}
.nav .cta.book-now:hover,.nav.solid .cta.book-now:hover{background:#fff;border-color:#fff}
.nav.solid .cta.book-now:hover{background:var(--ink);border-color:var(--ink);color:#fff}
@media (max-width:760px){.nav ul li.hide-m{display:none}.nav ul{gap:18px}}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(20,33,43,.88) 0%,rgba(20,33,43,.35) 45%,rgba(20,33,43,.15) 100%)}
.hero-in{position:relative;z-index:1;max-width:1240px;width:100%;margin:0 auto;padding:0 24px 9vh}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(3.4rem,10vw,7.5rem);line-height:.95;margin:0;letter-spacing:-.01em}
.hero .by{font-family:var(--serif);font-style:italic;font-size:clamp(1.6rem,4vw,2.6rem);color:var(--peach);margin:4px 0 22px}
.hero p.lede{max-width:34ch;font-size:1.15rem;margin:0 0 28px;color:#E3EAEC}
.sunset{display:inline-flex;align-items:center;gap:12px;font-size:.98rem;color:#E3EAEC;border-top:1px solid rgba(255,255,255,.35);padding-top:14px}
.sunset svg{flex:none}

/* sections */
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
section{padding:110px 0}
h2{font-family:var(--serif);font-weight:500;font-size:clamp(2.3rem,5vw,3.6rem);line-height:1.05;margin:0 0 22px;letter-spacing:-.005em}
h3{font-family:var(--serif);font-weight:600;font-size:1.55rem;line-height:1.2;margin:0 0 8px}
p{margin:0 0 16px}
.muted{color:var(--mute)}
.measure{max-width:60ch}

.split{display:grid;grid-template-columns:1.05fr 1fr;gap:72px;align-items:center}
.split.rev{grid-template-columns:1fr 1.05fr}
.split.rev .media{order:2}
@media (max-width:860px){.split,.split.rev{grid-template-columns:1fr;gap:36px}.split.rev .media{order:0}section{padding:80px 0}}

.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--stone);margin-top:56px}
.facts div{padding:22px 20px 22px 0;border-bottom:1px solid var(--stone)}
.facts strong{display:block;font-family:var(--serif);font-weight:500;font-size:1.6rem;line-height:1.2;margin-bottom:4px}
.facts span{font-size:.95rem;color:var(--mute)}
@media (max-width:860px){.facts{grid-template-columns:1fr 1fr}}

/* gallery */
.gallery{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:300px 300px;gap:10px;margin-top:44px}
.gallery img{width:100%;height:100%;object-fit:cover}
.gallery .a{grid-row:1/3}
.gallery .d{grid-column:2/4}
@media (max-width:760px){.gallery{grid-template-columns:1fr 1fr;grid-template-rows:240px 200px 200px}.gallery .a{grid-row:auto;grid-column:1/3}.gallery .d{grid-column:1/3}}

/* dark band */
.dark{background:var(--ink);color:#E3EAEC}
.dark h2,.dark h3{color:#fff}
.dark .muted{color:#9FB2B8}

.formats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;border-top:1px solid rgba(255,255,255,.18)}
.formats div{padding:28px 24px 8px 0;border-right:1px solid rgba(255,255,255,.12);margin-right:24px}
.formats div:last-child{border-right:0;margin-right:0}
@media (max-width:860px){.formats{grid-template-columns:1fr 1fr}.formats div{border-right:0;margin-right:0;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:20px}}
@media (max-width:520px){.formats{grid-template-columns:1fr}}

.day{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid rgba(255,255,255,.18)}
.day li{padding:20px 16px 0 0}
.day time{display:block;font-family:var(--serif);font-size:1.5rem;color:var(--peach);margin-bottom:6px}
@media (max-width:860px){.day{grid-template-columns:1fr 1fr}.day li{padding-bottom:16px}}

/* statement */
.statement{position:relative;min-height:78vh;display:flex;align-items:center;color:#fff;overflow:hidden}
.statement img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.statement::after{content:"";position:absolute;inset:0;background:rgba(20,33,43,.45)}
.statement blockquote{position:relative;z-index:1;margin:0 auto;max-width:900px;padding:0 24px;text-align:center;
  font-family:var(--serif);font-style:italic;font-size:clamp(2rem,4.6vw,3.4rem);line-height:1.15}

/* lists */
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:40px}
.cols ul{list-style:none;margin:0;padding:0}
.cols li{padding:10px 0;border-bottom:1px solid var(--stone)}
@media (max-width:760px){.cols{grid-template-columns:1fr;gap:28px}}

.pair{display:grid;grid-template-columns:repeat(4,1fr);gap:36px;margin-top:40px}
@media (max-width:860px){.pair{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.pair{grid-template-columns:1fr}}

/* brunch band */
.brunch-band{background:var(--peach);color:var(--ink);padding:0}
.brunch-band .wrap{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;padding-top:56px;padding-bottom:56px}
.brunch-band h2{margin:0 0 6px;font-size:clamp(2rem,4vw,2.8rem)}
.brunch-band p{margin:0}
@media (max-width:760px){.brunch-band .wrap{grid-template-columns:1fr}}

.btn{display:inline-block;text-decoration:none;font-weight:500;padding:14px 24px;border-radius:2px;background:var(--ink);color:#fff;border:0;font:inherit;font-weight:500;cursor:pointer}
.btn.light{background:#fff;color:var(--ink)}
.btn.alt{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}

/* contact */
.contact dl{display:grid;grid-template-columns:auto 1fr;gap:12px 28px;margin:28px 0 0}
.contact dt{color:#9FB2B8}
.contact dd{margin:0}
.contact a{text-decoration-color:rgba(255,255,255,.35);text-underline-offset:4px}

footer{background:var(--ink);color:#9FB2B8;font-size:.88rem;border-top:1px solid rgba(255,255,255,.1)}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:28px;padding-bottom:28px}
footer img{height:16px;width:auto;opacity:.8}
footer .signin{color:#9FB2B8;opacity:.7;font-size:.8rem;text-decoration:none;margin-left:auto}
footer .signin:hover{opacity:1;text-decoration:underline}

/* brunch page */
.page-head{position:relative;height:56vh;min-height:360px;color:#fff;display:flex;align-items:flex-end;overflow:hidden}
.page-head img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-head::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,33,43,.85),rgba(20,33,43,.15) 70%)}
.page-head .wrap{position:relative;z-index:1;width:100%;padding-bottom:44px}
.page-head h1{font-family:var(--serif);font-weight:500;font-size:clamp(2.8rem,8vw,5.2rem);line-height:1;margin:0 0 8px}
.page-head p{margin:0;color:#E3EAEC;font-size:1.1rem}
.book{display:grid;grid-template-columns:1fr 1.1fr;gap:72px;padding:80px 0 110px}
@media (max-width:860px){.book{grid-template-columns:1fr;gap:40px;padding:56px 0 80px}}
.details{border-top:1px solid var(--stone);margin:0}
.details div{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--stone)}
.details dt{color:var(--mute)}
.details dd{margin:0;font-weight:400;text-align:right}
form.bk{display:grid;gap:16px;background:#fff;padding:32px;border-radius:2px}
form.bk label{display:grid;gap:6px;font-size:.92rem;color:var(--mute)}
form.bk input,form.bk select,form.bk textarea{font:inherit;font-weight:400;color:var(--ink);background:var(--plaster);
  border:1px solid var(--stone);border-radius:2px;padding:12px 14px;width:100%;min-width:0;min-height:50px;margin:0}
form.bk select{-webkit-appearance:none;appearance:none;padding-right:40px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235A6B73' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
form.bk input[type=date]{-webkit-appearance:none;appearance:none}
form.bk input::-webkit-date-and-time-value{text-align:left}
form.bk textarea{min-height:84px;resize:vertical}
form.bk .row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:end}
form.bk .total{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0;border-top:1px solid var(--stone);border-bottom:1px solid var(--stone)}
form.bk .total strong{font-family:var(--serif);font-weight:500;font-size:1.9rem}
form.bk .note{font-size:.86rem;color:var(--mute);margin:0}
@media (max-width:520px){form.bk{padding:22px}form.bk .row{grid-template-columns:1fr}}

/* brunch popup */
.promo{border:0;padding:0;border-radius:2px;width:min(440px,calc(100vw - 32px));background:var(--plaster);color:var(--ink);
  box-shadow:0 24px 60px rgba(20,33,43,.35);overflow:hidden}
.promo::backdrop{background:rgba(20,33,43,.55)}
.promo[open]{animation:promo-in .35s ease}
@keyframes promo-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.promo img{width:100%;height:200px;object-fit:cover;object-position:50% 40%}
.promo-in{padding:26px 28px 28px}
.promo-k{margin:0 0 4px;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sea);font-weight:400}
.promo h2{font-size:2.2rem;margin:0 0 10px}
.promo-a{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:20px 0 0}
.promo-later{background:none;border:0;font:inherit;color:var(--mute);cursor:pointer;text-decoration:underline;text-underline-offset:4px;padding:0}
.promo-x{position:absolute;top:10px;right:10px;width:36px;height:36px;border:0;border-radius:50%;background:rgba(20,33,43,.6);
  color:#fff;font-size:1.4rem;line-height:1;cursor:pointer}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.nav{transition:none}.promo[open]{animation:none}}

/* contact actions */
.contact-a{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:28px}

/* booking popup (rooms & events): pastel coastal wash behind a quiet form; prices beside each choice */
.bkd{--bg:#F6F9F9;--wash1:#E4F1F2;--wash2:#FBEDE5;--surface:#fff;--line:#DAE4E6;--muted:#617379;--sunset:#D9825F;
  border:0;padding:0;border-radius:16px;width:min(620px,calc(100vw - 24px));max-height:calc(100svh - 24px);color:var(--ink);
  background:linear-gradient(170deg,var(--wash1) 0%,var(--bg) 42%,var(--wash2) 100%);box-shadow:0 24px 60px rgba(20,33,43,.35);
  overflow:hidden;font-weight:400;font-size:16px;line-height:1.5}
.bkd[open]{display:flex;flex-direction:column;animation:promo-in .35s ease}
.bkd::backdrop{background:rgba(20,33,43,.6)}
.bkd [hidden]{display:none!important}
.bkd-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:24px 28px 0}
.bkd-top h2{font-family:var(--sans);font-weight:300;font-size:clamp(28px,6vw,38px);line-height:1.1;margin:0;letter-spacing:.01em}
.bkd-x{flex:none;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink);font-size:1.4rem;line-height:1;cursor:pointer}
.bkd-body{overflow-y:auto;padding:12px 28px 28px;flex:1 1 auto}
.bkd-lede{color:var(--muted);margin:0 0 24px;max-width:52ch}
.bkd-hp{position:absolute;left:-9999px}
.bkd form,.bkd-part{display:flex;flex-direction:column;gap:28px}
.bkd button,.bkd input,.bkd select,.bkd textarea{font:inherit;color:inherit}
.bkd :focus-visible{outline:2px solid var(--sea);outline-offset:2px}
.bkd fieldset{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:12px;min-width:0}
.bkd legend{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:0;margin-bottom:12px}
.bkd .seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:999px;padding:4px;background:var(--surface)}
.bkd .seg label{position:relative;text-align:center;padding:9px;border-radius:999px;cursor:pointer;color:var(--muted)}
.bkd .seg input,.bkd .opt input{position:absolute;opacity:0;pointer-events:none}
.bkd .seg label:has(input:checked){background:var(--wash1);color:var(--ink)}
.bkd .seg label:has(input:focus-visible){outline:2px solid var(--sea)}
.bkd .opts{display:grid;gap:8px}
.bkd .opt{position:relative;display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:13px 16px;cursor:pointer}
.bkd .opt:has(input:checked){border-color:var(--sea);box-shadow:inset 0 0 0 1px var(--sea)}
.bkd .opt:has(input:focus-visible){outline:2px solid var(--sea);outline-offset:2px}
.bkd .opt div{display:flex;flex-direction:column;min-width:0;text-align:left}
.bkd .opt small{color:var(--muted);font-size:14px}
.bkd .opt .p{font-variant-numeric:tabular-nums;color:var(--muted);font-size:14px;white-space:nowrap}
.bkd .row{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));align-items:end}
.bkd label.f{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted);min-width:0}
.bkd input[type=text],.bkd input[type=tel],.bkd input[type=email],.bkd input[type=date],.bkd input[type=number],.bkd select,.bkd textarea{
  display:block;width:100%;min-width:0;min-height:48px;margin:0;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:11px 12px;color:var(--ink);line-height:1.5}
.bkd select{-webkit-appearance:none;appearance:none;padding-right:38px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23617379' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.bkd input[type=date]{-webkit-appearance:none;appearance:none}
.bkd input::-webkit-date-and-time-value{text-align:left}
.bkd textarea{min-height:90px;resize:vertical}
.bkd .est{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:1px solid var(--line);padding-top:16px;margin-bottom:-16px}
.bkd .est span{color:var(--muted);font-size:14px}
.bkd .est b{font-weight:400;font-size:24px;font-variant-numeric:tabular-nums}
.bkd .submit{background:var(--ink);color:#fff;border:0;border-radius:999px;padding:14px 22px;font-weight:500;cursor:pointer;width:100%}
.bkd .submit:disabled{opacity:.5;cursor:wait}
.bkd .fine{font-size:13px;color:var(--muted);margin:0}
.bkd .adv{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--sea);border-radius:10px;padding:12px 14px;font-size:14px}
.bkd .adv.warn{border-left-color:var(--sunset)}
.bkd .adv p{margin:0 0 8px}.bkd .adv p:last-child{margin:0}
.bkd .adv strong{font-weight:500}
.bkd .adv .sugg{display:flex;flex-wrap:wrap;gap:8px}
.bkd .adv button{background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:7px 12px;cursor:pointer;font-size:13px}
.bkd .adv button:hover{border-color:var(--sea)}
.bkd .adv button.go{background:var(--ink);color:#fff;border-color:var(--ink);font-weight:500}
.bkd .err{color:var(--sunset);font-size:14px;margin:0}
.bkd .done{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.bkd .done h3{margin:0;font-family:var(--sans);font-weight:300;font-size:28px}
.bkd .done p{margin:0}
.bkd #bkFallback{display:flex;flex-direction:column;gap:10px;width:100%}
.bkd .ref{font-variant-numeric:tabular-nums;font-size:20px;letter-spacing:.06em;color:var(--sea)}
.bkd .code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;word-break:break-all;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px;color:var(--muted)}
.bkd .copy{background:none;border:1px solid var(--line);border-radius:999px;padding:8px 16px;cursor:pointer;align-self:start}
@media (max-width:560px){
  .bkd{width:100vw;max-width:100vw;height:100svh;max-height:100svh;margin:0;border-radius:0}
  .bkd-top,.bkd-body{padding-left:20px;padding-right:20px}
}
@media (prefers-reduced-motion:reduce){.bkd[open]{animation:none}}
