@font-face{font-family:'Fraunces';font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/Fraunces-300i-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/Fraunces-300i-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/Fraunces-300-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/Fraunces-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Fraunces-300-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Fraunces-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/HankenGrotesk-300-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/HankenGrotesk-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/HankenGrotesk-300-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/HankenGrotesk-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/HankenGrotesk-300-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/HankenGrotesk-300-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ============ Ili — In the Light : design system ============ */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --paper:#F6F7F5; --ink:#20231F; --muted:#8E938A; --line:#E3E4DE; --sea:#35617F;
  --pad:clamp(20px,5vw,64px); --maxw:1320px; --gap:clamp(88px,15vh,180px);
}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:'Hanken Grotesk',system-ui,sans-serif;
  font-weight:300;font-size:clamp(15px,1.05vw,17px);line-height:1.8;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.serif{font-family:'Fraunces',Georgia,serif;font-weight:300}
.eyebrow{font-size:11.5px;letter-spacing:0.26em;text-transform:uppercase;color:var(--muted);font-weight:400}

/* horizon signature */
.horizon{position:relative;height:1px;background:var(--line);width:100%}
.horizon .dot{position:absolute;top:50%;left:38%;width:6px;height:6px;border-radius:50%;background:var(--sea);transform:translate(-50%,-50%)}
.horizon.light{background:rgba(255,255,255,0.45)}
.horizon.light .dot{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,0.18)}

/* header + logo */
.hd{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .5s ease,color .5s ease,border-color .5s ease;color:#fff;border-bottom:1px solid transparent}
.hd .wrap{height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.hd.scrolled{background:rgba(246,247,245,0.92);backdrop-filter:blur(10px);color:var(--ink);border-bottom-color:var(--line)}
.hd.solid{position:sticky;background:var(--paper);color:var(--ink);border-bottom-color:var(--line)}
.logo{position:relative;display:block;width:62px;height:53px;flex:none;transition:width .5s ease,height .5s ease}
.logo .lg{position:absolute;top:0;left:0;height:100%;width:auto;transition:opacity .5s ease}
.hd.scrolled .logo,.hd.solid .logo{width:42px;height:36px}
.logo .lg-dark{opacity:0}
.hd.scrolled .lg-light,.hd.solid .lg-light{opacity:0}
.hd.scrolled .lg-dark,.hd.solid .lg-dark{opacity:1}
.nav-d{display:flex;align-items:center;gap:clamp(16px,2vw,32px)}
.nav-d a{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;text-decoration:none;opacity:.86;transition:opacity .3s,color .3s}
.nav-d a:hover{opacity:1}
.nav-d a.active{opacity:1;border-bottom:1px solid currentColor;padding-bottom:3px}
.nav-d a.book{border:1px solid currentColor;padding:10px 22px;opacity:1}
.nav-d a.book:hover{background:currentColor}
.nav-d a.book:hover span{color:var(--paper)}
.burger{display:none;background:none;border:0;color:inherit;font-size:12px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;padding:8px 0}
@media(max-width:920px){.nav-d{display:none}.burger{display:block}}

/* mobile menu */
.mm{position:fixed;inset:0;z-index:60;background:var(--paper);transform:translateY(-100%);
  transition:transform .55s cubic-bezier(.7,0,.2,1);display:flex;flex-direction:column;justify-content:center;padding:var(--pad)}
.mm.open{transform:none}
.mm nav{display:flex;flex-direction:column;gap:4px}
.mm a{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(32px,9vw,58px);line-height:1.1;text-decoration:none;color:var(--ink);padding:6px 0;transition:color .3s}
.mm a:hover{color:var(--sea)}
.mm .mm-meta{margin-top:48px;font-size:12px;letter-spacing:.1em}
.mm .mm-meta a{font-family:inherit;font-size:13px;color:var(--sea)}
.mm-close{position:absolute;top:24px;right:var(--pad);background:none;border:0;font-size:12px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;color:var(--ink)}

/* hero (video or slideshow) */
.hero{position:relative;height:100svh;min-height:600px;overflow:hidden}
.hero .hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#20231F}
.hero .kb{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;will-change:transform,opacity;animation:kb 21s ease-in-out infinite}
@keyframes kb{0%{opacity:0;transform:scale(1.03)}9.5%{opacity:1;transform:scale(1.05)}33.3%{opacity:1;transform:scale(1.10)}42.8%{opacity:0;transform:scale(1.12)}100%{opacity:0;transform:scale(1.12)}}
.hero .scrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,24,21,.78) 0%,rgba(20,24,21,.62) 14%,rgba(20,24,21,.34) 34%,rgba(20,24,21,.10) 56%,rgba(20,24,21,0) 78%),linear-gradient(180deg,rgba(20,24,21,.30) 0%,rgba(20,24,21,0) 16%)}
.hero .inner{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:clamp(48px,8vh,92px);color:#fff}
.hero .eyebrow{color:rgba(255,255,255,.82);margin-bottom:22px}
.hero h1{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(40px,6.4vw,96px);line-height:1.0;letter-spacing:-0.018em;max-width:16ch}
.hero .horizon{margin-top:34px;max-width:240px}
.hero .cta{margin-top:36px}
.cue{position:absolute;left:50%;bottom:24px;width:1px;height:38px;background:rgba(255,255,255,.5);transform-origin:top;animation:cue 2.6s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translateX(-50%) scaleY(.4);opacity:.3}50%{transform:translateX(-50%) scaleY(1);opacity:.9}}
/* short hero (interior pages that aren't full screen) */
.hero.short{height:clamp(58vh,70vh,760px);min-height:460px}

/* buttons */
.btn{display:inline-block;font-size:12px;letter-spacing:0.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:all .4s ease;font-family:inherit}
.btn.light{color:#fff;border:1px solid rgba(255,255,255,.7);padding:15px 34px;background:none}
.btn.light:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn.dark{color:#fff;background:var(--ink);border:1px solid var(--ink);padding:15px 34px}
.btn.dark:hover{background:transparent;color:var(--ink)}

/* section rhythm */
main section{padding-top:var(--gap);padding-bottom:var(--gap)}
.lead{max-width:680px;margin:0 auto;text-align:center}
.lead .horizon{max-width:120px;margin:0 auto 40px}
.lead .eyebrow{display:block;margin-bottom:30px}
.lead p{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(24px,3.3vw,42px);line-height:1.34;letter-spacing:-0.01em;color:#2C302B}
.lead em{font-style:italic;color:var(--sea)}

/* full-bleed plate */
.plate{padding:0}
.plate figure{margin:0}
.plate img{width:100%;height:clamp(420px,82vh,860px);object-fit:cover}
.cap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:16px var(--pad) 0;font-size:11.5px;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted)}
.cap .mark{display:inline-flex;align-items:center;gap:9px}
.cap .mark::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sea)}

/* mini slideshow inside a full-bleed plate (4 photos, crossfade + slow zoom) */
.mshow{position:relative;width:100%;height:clamp(420px,82vh,860px);overflow:hidden}
.mshow .s{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;will-change:transform,opacity;animation:mkb 24s ease-in-out infinite}
@keyframes mkb{0%{opacity:0;transform:scale(1.04)}6.25%{opacity:1;transform:scale(1.05)}25%{opacity:1;transform:scale(1.10)}31.25%{opacity:0;transform:scale(1.12)}100%{opacity:0;transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.mshow .s{animation:none;opacity:0}.mshow .s:first-child{opacity:1;transform:none}}

/* 3-photo slideshow (villa space figures) */
.show3{position:relative;width:100%;overflow:hidden}
.show3 .s{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;will-change:transform,opacity;animation:kb3 18s ease-in-out infinite}
@keyframes kb3{0%{opacity:0;transform:scale(1.04)}8%{opacity:1;transform:scale(1.05)}33.3%{opacity:1;transform:scale(1.10)}41.3%{opacity:0;transform:scale(1.12)}100%{opacity:0;transform:scale(1.12)}}
.spaces .fig .show3{aspect-ratio:4/5}
@media(prefers-reduced-motion:reduce){.show3 .s{animation:none;opacity:0}.show3 .s:first-child{opacity:1;transform:none}}

/* home teasers */
.teasers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,40px)}
.teaser{display:flex;flex-direction:column;text-decoration:none;color:inherit;group:none}
.teaser .shot{position:relative;overflow:hidden;aspect-ratio:4/5}
.teaser .shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.teaser:hover .shot img{transform:scale(1.05)}
.teaser .kick{margin:20px 0 10px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--sea)}
.teaser p{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(18px,1.7vw,22px);line-height:1.3;color:#2C302B}
.teaser .go{margin-top:16px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;display:inline-flex;gap:8px;align-items:center}
.teaser .go .arr{transition:transform .4s ease}
.teaser:hover .go .arr{transform:translateX(6px)}
@media(max-width:820px){.teasers{grid-template-columns:1fr;max-width:460px;margin:0 auto}.teaser .shot{aspect-ratio:4/3}}

/* home: the house (asymmetric text + detail) */
.house{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,7vw,120px);align-items:center}
.house .txt{max-width:440px}
.house .label{margin-bottom:26px}
.house h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(28px,3.4vw,44px);line-height:1.12;letter-spacing:-0.01em;margin-bottom:26px}
.house p{color:#46493F}
.house .fig img{width:100%;aspect-ratio:3/4;object-fit:cover}
.house .fig figcaption{margin-top:14px;font-size:11.5px;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted)}
.txtlink{display:inline-block;margin-top:30px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:4px;transition:color .3s,border-color .3s}
.txtlink:hover{color:var(--sea);border-color:var(--sea)}
@media(max-width:760px){.house{grid-template-columns:1fr;gap:40px}.house .fig{order:-1}}

/* the villa: spaces */
.spaces .space{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,7vw,110px);align-items:center;margin-bottom:var(--gap)}
.spaces .space:last-child{margin-bottom:0}
.spaces .fig img{width:100%;aspect-ratio:4/5;object-fit:cover}
.spaces .space.rev .fig{order:2}
.spaces .txt{max-width:440px}
.spaces .label{margin-bottom:22px}
.spaces h3{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(26px,3.1vw,40px);line-height:1.12;letter-spacing:-0.01em;margin-bottom:22px}
.spaces p{color:#46493F}
@media(max-width:760px){.spaces .space{grid-template-columns:1fr;gap:30px}.spaces .space.rev .fig{order:-1}}

/* amenities */
.amen{max-width:920px;margin:0 auto}
.amen .eyebrow{display:block;text-align:center;margin-bottom:40px}
.amen ul{list-style:none;columns:2;column-gap:64px}
.amen li{padding:16px 0;border-bottom:1px solid var(--line);break-inside:avoid;display:flex;align-items:center;gap:16px;font-size:clamp(15px,1.4vw,18px)}
.amen li svg{width:22px;height:22px;flex:none;color:var(--sea);stroke:currentColor;fill:none}
@media(max-width:600px){.amen ul{columns:1}}

/* gallery + lightbox */
.gallery-s .eyebrow{display:block;text-align:center;margin-bottom:12px}
.gallery-s .lead-line{text-align:center;max-width:40ch;margin:0 auto 44px;color:#52564D}
/* gallery sections: Indoor / Outdoor — full-width lead + masonry */
.gal-sec{margin-bottom:var(--gap)}
.gal-sec:last-of-type{margin-bottom:0}
.gal-sec .head{text-align:center;margin-bottom:clamp(30px,4vw,52px)}
.gal-sec .head .eyebrow{display:block;margin-bottom:16px}
.gal-sec .head h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(30px,4vw,54px);line-height:1;letter-spacing:-0.01em}
.gallery-lead{margin-bottom:clamp(8px,1.2vw,16px)}
.gallery-lead img{height:clamp(300px,44vw,600px);object-fit:cover}
/* lead + masonry tiles settle in gently (soft fade + slight zoom, no vertical jump) */
@media(prefers-reduced-motion:no-preference){
  .gallery-lead.reveal > *{transform:scale(1.035);transition:opacity 1.6s ease,transform 2s cubic-bezier(.2,.7,.2,1)}
  .gallery-lead.reveal.in > *{transform:none}
  .masonry .g-item.reveal > *{transform:scale(1.04);transition:opacity 1.2s ease,transform 1.5s cubic-bezier(.2,.7,.2,1)}
  .masonry .g-item.reveal.in > *{transform:none}
}
.masonry{columns:3;column-gap:clamp(8px,1.2vw,16px)}
.masonry .g-item{margin:0 0 clamp(8px,1.2vw,16px);break-inside:avoid}
.g-item{padding:0;border:0;background:none;cursor:pointer;overflow:hidden;display:block;width:100%}
.g-item img{width:100%;height:auto;display:block;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.g-item:hover img{transform:scale(1.04)}
@media(max-width:820px){.masonry{columns:2}}
@media(max-width:520px){.masonry{columns:1}}
.lb{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;background:rgba(20,24,21,.94);padding:40px}
.lb.open{display:flex}
.lb-img{max-width:92vw;max-height:86vh;object-fit:contain;box-shadow:0 24px 70px rgba(0,0,0,.45)}
.lb button{background:none;border:0;color:#fff;cursor:pointer}
.lb-x{position:absolute;top:22px;right:26px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.85}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);font-size:42px;line-height:1;padding:8px 18px;opacity:.7;transition:opacity .3s}
.lb-nav:hover{opacity:1}
.lb-prev{left:6px}.lb-next{right:6px}
.lb-count{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase}

/* practical / facts table */
.facts{max-width:780px;margin:0 auto}
.facts .eyebrow{text-align:center;display:block;margin-bottom:48px}
.row{display:grid;grid-template-columns:1fr 2fr;gap:24px;padding:22px 0;border-top:1px solid var(--line)}
.row:last-child{border-bottom:1px solid var(--line)}
.row dt{font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--muted);font-weight:400}
.row dd{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(19px,2vw,26px);line-height:1.3}
@media(max-width:600px){.row{grid-template-columns:1fr;gap:6px}}

/* location: map */
.map{padding-top:0}
.map .frame{position:relative;width:100%;height:clamp(360px,52vw,560px);border:1px solid var(--line);overflow:hidden;filter:saturate(.9)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.map .cap{padding-top:14px}

/* contact — details column + form card */
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,5vw,80px);align-items:start;max-width:1160px;margin:0 auto}
/* left: reach us */
.details .horizon{max-width:90px;margin-bottom:30px}
.details h3{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(26px,3vw,40px);line-height:1.08;letter-spacing:-0.01em;margin-bottom:16px}
.details .intro{color:#46493F;margin-bottom:34px;max-width:34ch}
.details .clist{list-style:none}
.details .clist li{display:flex;align-items:center;gap:15px;padding:16px 0;border-top:1px solid var(--line)}
.details .clist li:last-child{border-bottom:1px solid var(--line)}
.details .clist svg{width:19px;height:19px;color:var(--sea);flex:none;stroke:currentColor;fill:none}
.details .clist a,.details .clist span.v{text-decoration:none;font-size:15.5px;color:#33362F;transition:color .25s}
.details .clist a:hover{color:var(--sea)}
.details .meta{margin-top:28px;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
/* right: form card */
.form{background:#fff;border:1px solid var(--line);padding:clamp(26px,3.5vw,48px);box-shadow:0 34px 70px -46px rgba(20,35,30,.30)}
.form .lead-in{margin-bottom:30px;color:#46493F}
.form .field{margin-bottom:20px}
.form label{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.form input,.form textarea,.form select{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:3px;padding:13px 15px;font-family:inherit;font-size:15.5px;color:var(--ink);transition:border-color .25s,background .25s,box-shadow .25s}
.form select{-webkit-appearance:none;appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 20px,calc(100% - 12px) 20px;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.form input::placeholder,.form textarea::placeholder{color:#b6b8b1}
.form input:focus,.form textarea:focus,.form select:focus{outline:none;border-color:var(--sea);background-color:#fff;box-shadow:0 0 0 3px rgba(53,97,127,.10)}
.form textarea{resize:vertical;min-height:112px}
.form input[type=date]{-webkit-appearance:none;appearance:none;min-height:48px;color:var(--ink)}
.form input[type=date]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer;transition:opacity .2s}
.form input[type=date]:hover::-webkit-calendar-picker-indicator{opacity:.85}
.form input[type=date]:invalid,.form input[type=date]:not(:focus):placeholder-shown{color:var(--muted)}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form .btn.dark{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;margin-top:6px}
.form .btn .arr{transition:transform .35s ease}
.form .btn:hover .arr{transform:translateX(6px)}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form .note{margin-top:16px;font-size:13px;color:var(--muted)}
.form .ok{padding:16px 18px;border:1px solid var(--sea);background:rgba(53,97,127,.05);color:var(--sea);margin-bottom:26px;font-size:15px}
.form .err{padding:16px 18px;border:1px solid #a3423a;background:rgba(163,66,58,.05);color:#a3423a;margin-bottom:26px;font-size:15px}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr;gap:44px}.form .row2{grid-template-columns:1fr}}

/* book page — how it works + form subheads */
.howto{max-width:900px;margin:0 auto}
.howto .eyebrow{display:block;text-align:center;margin-bottom:38px}
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,46px)}
.steps li{display:flex;gap:16px;align-items:flex-start}
.steps .sn{flex:none;width:36px;height:36px;border-radius:50%;border:1px solid var(--sea);color:var(--sea);display:flex;align-items:center;justify-content:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px}
.steps h4{font-family:'Fraunces',serif;font-weight:300;font-size:19px;line-height:1.2;margin-bottom:7px}
.steps p{color:#4A4E48;font-size:14.5px;line-height:1.7}
@media(max-width:700px){.steps{grid-template-columns:1fr;gap:22px;max-width:400px;margin:0 auto}}
.form .fsub{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sea);margin:0 0 14px}
.form .fsub.mt{margin-top:32px}

/* faq accordion */
.faq{max-width:840px;margin:0 auto}
.faq .eyebrow{display:block;text-align:center;margin-bottom:40px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:24px 0;display:flex;justify-content:space-between;gap:24px;align-items:baseline;font-family:'Fraunces',serif;font-weight:300;font-size:clamp(19px,2.1vw,26px);color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .plus{flex:none;color:var(--sea);font-size:22px;line-height:1;transition:transform .3s ease}
.faq details[open] summary .plus{transform:rotate(45deg)}
.faq .a{padding:0 0 26px;color:#46493F;max-width:66ch}

/* closing band */
.closing{position:relative;padding:0}
.closing img{width:100%;height:clamp(460px,80vh,820px);object-fit:cover}
.closing .ov{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;background:linear-gradient(0deg,rgba(20,24,21,.62),rgba(20,24,21,.28) 60%,rgba(20,24,21,.34))}
.closing .ov .eyebrow{display:block;color:rgba(255,255,255,.82);margin-bottom:18px}
.closing h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(36px,5.6vw,80px);line-height:1.02;letter-spacing:-0.018em;margin-bottom:34px}
.closing .mail{margin-top:22px;font-size:12px;letter-spacing:0.1em;color:rgba(255,255,255,.82);text-decoration:none}

/* ===== LOCATION page ===== */
/* wayfinding strip — from the door */
.wayfind{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.wayfind .wf{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:clamp(30px,4vw,46px) 14px;border-left:1px solid var(--line)}
.wayfind .wf:first-child{border-left:0}
.wayfind .wf svg{width:26px;height:26px;color:var(--sea);stroke:currentColor;fill:none}
.wayfind .wf .d{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(17px,2vw,23px);color:var(--ink);letter-spacing:.02em}
.wayfind .wf .l{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
@media(max-width:640px){.wayfind{grid-template-columns:1fr 1fr}.wayfind .wf:nth-child(odd){border-left:0}.wayfind .wf:nth-child(n+3){border-top:1px solid var(--line)}}

/* the specific setting of ili */
.setting{max-width:720px;margin:0 auto;text-align:center}
.setting .horizon{max-width:120px;margin:0 auto 40px}
.setting .eyebrow{display:block;margin-bottom:26px}
.setting .stmt{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(22px,3vw,38px);line-height:1.32;letter-spacing:-0.01em;color:#2C302B}
.setting .stmt em{font-style:italic;color:var(--sea)}
.setting .note{margin-top:22px;color:#46493F;max-width:52ch;margin-left:auto;margin-right:auto}
.setting .nearby{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:36px}
.setting .nearby span{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:9px 17px}

/* leaflet map — minimal light */
.locmap{padding-top:0}
#map{height:clamp(380px,52vw,560px);width:100%;border:1px solid var(--line);z-index:0;background:var(--paper)}
.leaflet-container{font-family:inherit;background:var(--paper)}
.leaflet-control-attribution{font-size:10px;background:rgba(246,247,245,.82) !important;color:var(--muted)}
.leaflet-control-attribution a{color:var(--sea)}
.leaflet-bar a{color:var(--ink);border-color:var(--line)}
.ili-pin{width:16px;height:16px;border-radius:50%;background:var(--sea);border:3px solid #fff;box-shadow:0 0 0 1.5px var(--sea),0 6px 16px rgba(20,35,30,.3)}
.locmap .cap{padding-top:14px}
.locmap .cap a{text-decoration:none;color:var(--sea)}

/* naxos guide */
.guide-intro{max-width:700px;margin:0 auto;text-align:center}
.guide-intro .eyebrow{display:block;margin-bottom:26px}
.guide-intro p{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(22px,3vw,38px);line-height:1.32;letter-spacing:-0.01em;color:#2C302B}
.guide-intro em{font-style:italic;color:var(--sea)}
.guide-intro .note{margin-top:26px;font-family:'Hanken Grotesk',sans-serif;font-size:clamp(14px,1.2vw,16px);color:var(--muted);font-style:normal}
.poi{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center;padding:clamp(38px,5vw,66px) 0;border-top:1px solid var(--line)}
.poi:last-of-type{border-bottom:1px solid var(--line)}
.poi .p-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.poi .no{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;letter-spacing:.18em;color:var(--sea);display:block;margin-bottom:16px}
.poi h3{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(24px,2.8vw,38px);line-height:1.1;letter-spacing:-0.01em;margin-bottom:18px}
.poi p{color:#46493F}
@media(max-width:760px){.poi{grid-template-columns:1fr;gap:22px}.poi .p-txt{order:2}}

/* ===== HOMEPAGE (narrative) ===== */
/* hero availability bar */
.hero .availbar{display:flex;flex-wrap:wrap;gap:1px;background:rgba(227,228,222,.6);border:1px solid rgba(255,255,255,.5);border-radius:5px;overflow:hidden;max-width:660px;margin-top:34px;box-shadow:0 24px 54px -26px rgba(0,0,0,.55)}
.availbar .ab-field{flex:1 1 34%;background:rgba(255,255,255,.95);padding:11px 18px;display:flex;flex-direction:column;gap:3px;text-align:left}
.availbar label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.availbar input,.availbar select{border:0;background:none;font-family:inherit;font-size:14.5px;color:var(--ink);padding:2px 0;outline:none;width:100%;-webkit-appearance:none;appearance:none}
.availbar .ab-btn{flex:1 1 100%;background:var(--ink);color:#fff;border:0;cursor:pointer;font-family:inherit;font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:16px;transition:background .3s}
.availbar .ab-btn:hover{background:var(--sea)}
@media(min-width:620px){.availbar .ab-btn{flex:0 0 auto;padding:0 30px}}

/* the house — a glimpse (split) */
.glimpse{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(32px,5vw,84px);align-items:center}
.glimpse .g-media img{width:100%;aspect-ratio:4/5;object-fit:cover}
.glimpse .g-body{max-width:460px}
.glimpse .eyebrow{display:block;margin-bottom:20px}
.glimpse h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(30px,4vw,52px);line-height:1.04;letter-spacing:-0.015em;margin-bottom:24px}
.glimpse p{color:#46493F;margin-bottom:30px}
@media(max-width:800px){.glimpse{grid-template-columns:1fr;gap:30px}.glimpse .g-media{order:-1}}

/* at a glance band */
.glance{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(26px,3.4vw,38px) 0}
.glance-row{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(18px,3vw,46px);align-items:center}
.glance-row span{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:#46493F;display:inline-flex;align-items:center;gap:12px}
.glance-row span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--sea);flex:none}

/* a day at ili (timeline) */
.day .head{text-align:center;max-width:640px;margin:0 auto clamp(42px,5vw,62px)}
.day .head .horizon{max-width:100px;margin:0 auto 26px}
.day .head .eyebrow{display:block;margin-bottom:16px}
.day .head h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(28px,3.6vw,46px);line-height:1.06;letter-spacing:-0.015em}
.day-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3vw,44px)}
.day-part{margin:0}
.day-part .d-img img{width:100%;aspect-ratio:3/4;object-fit:cover}
.day-part .k{margin:20px 0 10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--sea)}
.day-part h3{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(20px,2vw,26px);line-height:1.15;margin-bottom:10px}
.day-part p{color:#4A4E48;font-size:15.5px;line-height:1.75}
@media(max-width:760px){.day-grid{grid-template-columns:1fr;max-width:440px;margin:0 auto;gap:40px}}

/* guest reviews */
.reviews .head{text-align:center;max-width:620px;margin:0 auto clamp(42px,6vw,66px)}
.reviews .head .horizon{max-width:110px;margin:0 auto 28px}
.reviews .head .eyebrow{display:block;margin-bottom:16px}
.reviews .head h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(30px,4vw,52px);line-height:1;letter-spacing:-0.015em}
.rev-slider{position:relative;max-width:840px;margin:0 auto}
.rs-viewport{overflow:hidden}
.rs-track{display:flex;align-items:stretch;transition:transform .6s cubic-bezier(.2,.7,.2,1);will-change:transform}
.rs-slide{flex:0 0 50%;min-width:0;padding:0 clamp(20px,3vw,44px);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.rs-slide .qmark{font-family:'Fraunces',serif;font-size:48px;line-height:.55;color:var(--sea);opacity:.4;margin-bottom:16px}
.rs-slide .quote{font-family:'Fraunces',serif;font-weight:300;font-style:italic;font-size:clamp(17px,1.8vw,23px);line-height:1.45;letter-spacing:-0.005em;color:#2A2E27;margin:0;max-width:46ch}
.rs-slide .by{margin-top:26px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.rs-slide .by .name{color:var(--ink)}
.rs-arrow{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;cursor:pointer;color:var(--muted);font-size:34px;line-height:1;padding:10px 12px;transition:color .25s}
.rs-arrow:hover{color:var(--sea)}
.rs-prev{left:-8px}.rs-next{right:-8px}
.rs-dots{display:flex;justify-content:center;gap:10px;margin-top:clamp(32px,4vw,48px)}
.rs-dot{width:8px;height:8px;padding:0;border-radius:50%;border:1px solid var(--line);background:none;cursor:pointer;transition:background .25s,border-color .25s,transform .25s}
.rs-dot:hover{border-color:var(--muted)}
.rs-dot.active{background:var(--sea);border-color:var(--sea);transform:scale(1.15)}
@media(max-width:640px){.rs-arrow{display:none}.rs-slide{flex:0 0 100%;padding:0}}
@media(prefers-reduced-motion:reduce){.rs-track{transition:none}}

/* legal / policy pages */
.legal{max-width:760px;margin:0 auto}
.legal .doc-head{margin-bottom:clamp(40px,6vw,66px)}
.legal .doc-head .horizon{max-width:90px;margin-bottom:28px}
.legal .doc-head .eyebrow{display:block;margin-bottom:18px}
.legal h1{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(38px,6vw,68px);line-height:1;letter-spacing:-0.02em;margin-bottom:18px}
.legal .updated{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.legal h2{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(22px,2.6vw,32px);line-height:1.14;letter-spacing:-0.01em;margin:clamp(40px,5vw,60px) 0 18px;padding-top:clamp(28px,4vw,40px);border-top:1px solid var(--line)}
.legal h2:first-of-type{border-top:0;padding-top:0}
.legal p,.legal li{color:#3B3E37;line-height:1.85}
.legal p{margin-bottom:16px;max-width:66ch}
.legal ul{list-style:none;margin:6px 0 16px;max-width:66ch}
.legal li{position:relative;padding:6px 0 6px 22px}
.legal li::before{content:"";position:absolute;left:0;top:15px;width:5px;height:5px;border-radius:50%;background:var(--sea)}
.legal a{color:var(--sea);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s}
.legal a:hover{border-bottom-color:var(--sea)}
.legal .ph{color:var(--sea);font-style:italic}
.legal .intro{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(19px,2vw,24px);line-height:1.5;color:#2C302B;margin-bottom:6px;max-width:60ch}

/* footer */
footer{padding:clamp(56px,8vw,92px) 0 38px;border-top:1px solid var(--line);background:var(--paper)}
.ftcols{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:clamp(30px,5vw,72px)}
.ft-brand .logo-f{display:block;height:60px;margin-bottom:22px}
.ft-brand .logo-f img{height:60px;width:auto}
.ft-social{display:flex;gap:14px;margin-top:18px}
.ft-social a{display:inline-flex;color:#3A3D36;transition:color .25s}
.ft-social a:hover{color:var(--sea)}
.ft-social svg{width:20px;height:20px;stroke:currentColor;fill:none}
.ft-brand p{color:#46493F;max-width:34ch}
.ftcol .eyebrow{display:block;margin-bottom:18px}
.ftcol a{display:block;text-decoration:none;padding:6px 0;color:#3A3D36;transition:color .3s}
.ftcol a:hover{color:var(--sea)}
.ftbase{display:flex;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;margin-top:clamp(46px,7vw,80px);padding-top:24px;border-top:1px solid var(--line);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.credit{color:var(--muted)}
.credit a{color:inherit;text-decoration:none;transition:color .25s}
.credit a:hover{color:var(--sea)}
.credit .heart{display:inline-block;color:#C24A3E;font-size:1.15em;vertical-align:-1px;animation:heartbeat 1.5s ease-in-out infinite}
@keyframes heartbeat{0%,100%{transform:scale(1)}12%{transform:scale(1.3)}24%{transform:scale(1)}36%{transform:scale(1.18)}50%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.credit .heart{animation:none}}
@media(max-width:700px){.ftcols{grid-template-columns:1fr;gap:36px}}

/* mobile-only sticky Book CTA */
.book-bar{display:none}
.availfloat{display:none}
@media(max-width:920px){
  body{padding-bottom:52px}
  .book-bar{display:inline-flex;align-items:center;gap:9px;position:fixed;left:50%;bottom:16px;z-index:44;text-decoration:none;
    background:var(--sea);color:#fff;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;
    padding:13px 28px;border-radius:999px;box-shadow:0 12px 28px -10px rgba(53,97,127,.55);
    transform:translate(-50%,calc(100% + 26px));transition:transform .45s cubic-bezier(.2,.7,.2,1)}
  .book-bar .bb-arr{transition:transform .35s ease}
  .book-bar:active .bb-arr{transform:translateX(4px)}
  .book-bar.show{transform:translate(-50%,0)}
}
@media(min-width:921px){
  .availfloat{position:fixed;left:50%;bottom:22px;z-index:44;display:flex;align-items:stretch;gap:1px;
    background:rgba(227,228,222,.7);border:1px solid rgba(255,255,255,.6);border-radius:6px;overflow:hidden;
    box-shadow:0 22px 54px -24px rgba(20,35,30,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    transform:translate(-50%,calc(100% + 34px));transition:transform .5s cubic-bezier(.2,.7,.2,1)}
  .availfloat.show{transform:translate(-50%,0)}
  .af-field{background:rgba(255,255,255,.96);padding:9px 18px;display:flex;flex-direction:column;gap:2px}
  .af-field label{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
  .af-field input,.af-field select{border:0;background:none;font-family:inherit;font-size:13.5px;color:var(--ink);outline:none;-webkit-appearance:none;appearance:none;min-width:112px}
  .af-field select{min-width:66px}
  .af-btn{background:var(--ink);color:#fff;border:0;cursor:pointer;font-family:inherit;font-size:11px;letter-spacing:.18em;text-transform:uppercase;padding:0 24px;transition:background .3s}
  .af-btn:hover{background:var(--sea)}
}
@media(prefers-reduced-motion:reduce){.book-bar,.availfloat{transition:none}}

/* reveal — staggered children (titles, text, images ease in one after another) */
.reveal > *{opacity:0;transform:translateY(18px);transition:opacity .95s cubic-bezier(.2,.7,.2,1),transform .95s cubic-bezier(.2,.7,.2,1)}
.reveal.in > *{opacity:1;transform:none}
.reveal.in > *:nth-child(2){transition-delay:.09s}
.reveal.in > *:nth-child(3){transition-delay:.18s}
.reveal.in > *:nth-child(4){transition-delay:.27s}
.reveal.in > *:nth-child(5){transition-delay:.36s}
.reveal.in > *:nth-child(6){transition-delay:.45s}
.reveal.in > *:nth-child(n+7){transition-delay:.52s}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--sea);outline-offset:3px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero .kb{animation:none;opacity:0}.hero .kb:first-child{opacity:1;transform:none}.cue{animation:none}.reveal > *{opacity:1;transform:none;transition:none}.teaser .shot img,.g-item img{transition:none}}