@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300;1,400&family=Jost:wght@300;400&display=swap');

*{box-sizing:border-box;margin:0;padding:0}
:root{
  --sand:#F4F0E8;
  --sand2:#EDE8DE;
  --warm:#C9B99A;
  --dark:#2A2520;
  --mid:#7A6E63;
  --accent:#8B7355;
  --white:#FDFCF9;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Jost',sans-serif;
  --max:1320px;
  --pad:clamp(24px,5vw,80px);
}

html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--dark);background:var(--sand);font-weight:300}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}

/* ── UTILITY ── */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.section-label{font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.36em;text-transform:uppercase;color:var(--accent);margin-bottom:clamp(14px,2vw,22px);font-weight:400;display:block}
.section-title{font-family:var(--serif);font-size:clamp(28px,4.5vw,52px);font-weight:300;color:var(--dark);line-height:1.18;margin-bottom:clamp(16px,2.5vw,26px)}
.section-title em{font-style:italic}
.body-text{font-family:var(--sans);font-size:clamp(12px,1.3vw,14px);line-height:1.95;color:var(--mid);font-weight:300}
.cta-link{font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.26em;text-transform:uppercase;color:var(--dark);border-bottom:.5px solid var(--dark);padding-bottom:3px;font-weight:300;display:inline-block;cursor:pointer;transition:opacity .2s}
.cta-link:hover{opacity:.6}
.btn-primary{background:var(--dark);color:var(--white);padding:clamp(11px,1.5vw,15px) clamp(24px,3.5vw,42px);font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.28em;text-transform:uppercase;font-weight:400;border:none;cursor:pointer;border-radius:0;display:inline-block;transition:opacity .2s}
.btn-primary:hover{opacity:.85}
.btn-outline{border:.5px solid var(--dark);color:var(--dark);padding:clamp(11px,1.5vw,15px) clamp(24px,3.5vw,42px);font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.28em;text-transform:uppercase;font-weight:300;background:transparent;cursor:pointer;border-radius:0;display:inline-block;transition:all .2s}
.btn-outline:hover{background:var(--dark);color:var(--white)}
.btn-accent{background:var(--accent);color:var(--white);padding:clamp(11px,1.5vw,15px) clamp(24px,3.5vw,42px);font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.28em;text-transform:uppercase;font-weight:400;border:none;cursor:pointer;border-radius:0;display:inline-block;transition:opacity .2s}
.btn-accent:hover{opacity:.85}

/* ── NAV ── */
.site-nav{background:rgba(253,252,249,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:clamp(16px,2vw,24px) var(--pad);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;border-bottom:.5px solid rgba(42,37,32,.12);transition:background .3s}
.nav-logo{font-family:var(--serif);font-size:clamp(17px,2vw,22px);font-weight:300;letter-spacing:.08em;color:var(--dark);text-align:center;line-height:1.2;position:absolute;left:50%;transform:translateX(-50%)}
.nav-logo small{display:block;font-family:var(--sans);font-size:clamp(7px,.8vw,8px);letter-spacing:.3em;text-transform:uppercase;color:var(--mid);margin-top:2px;font-weight:300}
.nav-left,.nav-right{display:flex;gap:clamp(14px,2vw,28px);align-items:center;list-style:none}
.nav-left a,.nav-right a{font-size:clamp(8px,.85vw,9px);letter-spacing:.18em;text-transform:uppercase;color:var(--mid);font-weight:300;transition:color .2s;white-space:nowrap}
.nav-left a:hover,.nav-right a:hover{color:var(--dark)}
.nav-reserve{background:var(--dark)!important;color:var(--white)!important;padding:8px clamp(14px,1.5vw,20px)!important;font-size:9px!important}
.nav-reserve:hover{opacity:.85}
.nav-lang{font-size:9px!important;letter-spacing:.14em!important;border:.5px solid rgba(42,37,32,.3);padding:5px 10px;border-radius:0;cursor:pointer;background:transparent;color:var(--mid);font-family:var(--sans);transition:all .2s}
.nav-lang:hover{border-color:var(--dark);color:var(--dark)}
.nav-hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none}
.nav-hamburger span{display:block;width:22px;height:.5px;background:var(--dark);transition:all .3s}

/* Mobile nav */
.mobile-menu{display:none;position:fixed;inset:0;background:var(--white);z-index:200;flex-direction:column;align-items:center;justify-content:center;gap:clamp(18px,3vw,28px)}
.mobile-menu.open{display:flex}
.mobile-menu a{font-family:var(--serif);font-size:clamp(22px,4vw,32px);font-weight:300;color:var(--dark);letter-spacing:.04em}
.mobile-menu a:hover{color:var(--accent)}
.mobile-close{position:absolute;top:24px;right:var(--pad);background:none;border:none;font-size:28px;cursor:pointer;color:var(--dark);font-family:var(--sans);font-weight:300}
.mobile-lang{font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--mid);border:.5px solid rgba(42,37,32,.3);padding:8px 20px;cursor:pointer;background:transparent;margin-top:16px}

@media(max-width:900px){
  .nav-left,.nav-right{display:none}
  .nav-hamburger{display:flex}
  .nav-logo{position:static;transform:none}
}

/* ── HERO ── */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#2a3d2a}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;background-size:cover;background-position:center}
.hero-overlay{position:absolute;inset:0;background:rgba(18,12,6,.45);z-index:1}
.hero-content{position:relative;z-index:2;text-align:center;padding:clamp(20px,5vw,60px) clamp(20px,8vw,100px);max-width:960px;width:100%}
.hero-label{font-family:var(--sans);font-size:clamp(8px,1.1vw,10px);letter-spacing:.38em;text-transform:uppercase;color:rgba(215,207,195,.85);margin-bottom:clamp(16px,2.5vw,24px);font-weight:300}
.hero-title{font-family:var(--serif);font-size:clamp(40px,7.5vw,88px);font-weight:300;color:#F9F4EB;line-height:1.0;letter-spacing:.01em;margin-bottom:clamp(14px,2vw,20px)}
.hero-title em{font-style:italic}
.hero-sub{font-family:var(--sans);font-size:clamp(9px,1.1vw,11px);letter-spacing:.32em;color:rgba(201,191,178,.8);text-transform:uppercase;font-weight:300;margin-bottom:clamp(32px,4.5vw,52px)}
.hero-btns{display:flex;gap:clamp(12px,2vw,20px);justify-content:center;flex-wrap:wrap}
.hero-btn-primary{background:#F9F4EB;color:var(--dark);padding:clamp(11px,1.5vw,15px) clamp(24px,3.5vw,42px);font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.28em;text-transform:uppercase;font-weight:400;border:none;cursor:pointer;border-radius:0;transition:opacity .2s}
.hero-btn-primary:hover{opacity:.85}
.hero-btn-ghost{border:.5px solid rgba(249,244,235,.5);color:#F9F4EB;padding:clamp(11px,1.5vw,15px) clamp(24px,3.5vw,42px);font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.28em;text-transform:uppercase;font-weight:300;background:transparent;cursor:pointer;border-radius:0;transition:all .2s}
.hero-btn-ghost:hover{background:rgba(249,244,235,.1)}
.hero-scroll{position:absolute;z-index:2;bottom:clamp(16px,3vw,32px);left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(249,244,235,.35);font-size:8px;letter-spacing:.25em;text-transform:uppercase;font-family:var(--sans)}
.hero-scroll-line{width:.5px;height:clamp(24px,3vw,40px);background:rgba(249,244,235,.25)}

/* ── PAGE HERO (inner pages) ── */
.page-hero{background:var(--dark);padding:clamp(80px,10vw,120px) var(--pad) clamp(48px,6vw,72px);text-align:center}
.page-hero .section-label{color:var(--warm)}
.page-hero .section-title{color:#F9F4EB}
.page-hero .body-text{color:rgba(249,244,235,.55);max-width:640px;margin:0 auto}

/* ── SECTIONS ── */
.section-white{background:var(--white);padding:clamp(56px,8vw,100px) var(--pad)}
.section-sand{background:var(--sand);padding:clamp(56px,8vw,100px) var(--pad)}
.section-sand2{background:var(--sand2);padding:clamp(56px,8vw,100px) var(--pad)}
.section-dark{background:var(--dark);padding:clamp(56px,8vw,100px) var(--pad)}
.section-center{text-align:center}
.section-center .body-text{max-width:600px;margin-left:auto;margin-right:auto;margin-bottom:clamp(24px,3vw,40px)}

/* ── PILLARS ── */
.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);background:var(--sand2)}
@media(max-width:750px){.pillars-grid{grid-template-columns:1fr}}
.pillar{padding:clamp(36px,5vw,64px) clamp(24px,4vw,48px);border-right:.5px solid #d6d6d6}
.pillar:last-child{border-right:none}
@media(max-width:750px){.pillar{border-right:none;border-bottom:.5px solid #d6d6d6}.pillar:last-child{border-bottom:none}}
.pillar-num{font-family:var(--serif);font-size:11px;color:var(--warm);margin-bottom:clamp(12px,2vw,20px);letter-spacing:.04em;display:block}
.pillar-title{font-family:var(--serif);font-size:clamp(22px,2.8vw,32px);font-weight:300;color:var(--dark);margin-bottom:clamp(10px,1.5vw,16px);line-height:1.15}
.pillar-title em{font-style:italic}
.pillar-body{font-family:var(--sans);font-size:clamp(11px,1.2vw,13px);line-height:1.88;color:var(--mid);font-weight:300;margin-bottom:clamp(16px,2vw,24px)}
.pillar-link{font-family:var(--sans);font-size:clamp(8px,.9vw,9px);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);border-bottom:.5px solid var(--accent);padding-bottom:2px;display:inline-block;transition:opacity .2s}
.pillar-link:hover{opacity:.65}

/* ── MOSAIC ── */
.mosaic-grid{display:grid;grid-template-columns:3fr 2fr;gap:5px}
@media(max-width:640px){.mosaic-grid{grid-template-columns:1fr}}
.mosaic-right{display:grid;grid-template-rows:1fr 1fr;gap:5px;height:100%}
.mosaic-cell{position:relative;overflow:hidden;cursor:pointer;min-height:clamp(200px,30vw,420px);background:var(--sand2)}
.mosaic-cell.tall{min-height:clamp(340px,52vw,620px)}
@media(max-width:640px){.mosaic-cell.tall{min-height:clamp(220px,55vw,360px)}.mosaic-right{grid-template-rows:auto}}
.mosaic-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.mosaic-cell:hover .mosaic-img{transform:scale(1.04)}
.mosaic-fade{position:absolute;bottom:0;left:0;right:0;height:55%;background:linear-gradient(0,rgba(10,6,2,.72) 0%,transparent 100%)}
.mosaic-caption{position:absolute;bottom:0;left:0;right:0;padding:clamp(14px,2vw,22px) clamp(16px,2.5vw,24px)}
.mosaic-cat{font-family:var(--sans);font-size:clamp(7px,.85vw,8px);letter-spacing:.28em;text-transform:uppercase;color:rgba(249,244,235,.62);display:block;margin-bottom:5px}
.mosaic-name{font-family:var(--serif);font-size:clamp(17px,2.2vw,26px);font-weight:300;color:#F9F4EB;font-style:italic;display:block}

/* ── EXP CARDS (dark) ── */
.exp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(249,244,235,.06)}
@media(max-width:900px){.exp-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.exp-grid{grid-template-columns:1fr}}
.exp-card{background:var(--dark);padding:clamp(24px,3.5vw,44px) clamp(18px,2.5vw,32px)}
.exp-title{font-family:var(--serif);font-size:clamp(17px,2vw,22px);font-weight:300;color:#F9F4EB;font-style:italic;margin-bottom:clamp(10px,1.5vw,14px);line-height:1.25}
.exp-desc{font-family:var(--sans);font-size:clamp(11px,1.1vw,12px);color:rgba(249,244,235,.42);line-height:1.8;font-weight:300;margin-bottom:clamp(16px,2vw,26px)}
.btn-gold-ghost{border:.5px solid rgba(201,185,154,.4);color:#C9B99A;padding:9px clamp(14px,2vw,20px);font-family:var(--sans);font-size:8px;letter-spacing:.24em;text-transform:uppercase;font-weight:300;background:transparent;cursor:pointer;border-radius:0;display:inline-block;transition:all .2s}
.btn-gold-ghost:hover{background:rgba(201,185,154,.1)}

/* ── ROOM STRIP ── */
.room-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}
@media(max-width:1000px){.room-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:580px){.room-strip{grid-template-columns:repeat(2,1fr)}}
.room-card{position:relative;overflow:hidden;cursor:pointer;min-height:clamp(220px,30vw,400px)}
.room-card-bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .7s ease}
.room-card:hover .room-card-bg{transform:scale(1.05)}
.room-card-overlay{position:absolute;bottom:0;left:0;right:0;padding:clamp(18px,2.5vw,28px) clamp(12px,1.5vw,18px);background:linear-gradient(0,rgba(10,6,2,.85) 0%,transparent 100%)}
.room-name{font-family:var(--serif);font-size:clamp(13px,1.6vw,17px);font-weight:300;color:#F9F4EB;font-style:italic;display:block;margin-bottom:5px}
.room-from{font-family:var(--sans);font-size:clamp(8px,.9vw,9px);color:var(--warm);letter-spacing:.15em;font-weight:300;display:block}

/* ── REVIEWS ── */
.reviews-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:clamp(32px,4vw,52px);flex-wrap:wrap;gap:16px}
.rating-big{font-family:var(--serif);font-size:clamp(42px,5vw,58px);font-weight:300;color:#F9F4EB;line-height:1;display:block}
.rating-stars{color:var(--warm);font-size:13px;letter-spacing:2px;display:block;margin:5px 0}
.rating-count{font-family:var(--sans);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(249,244,235,.35);font-weight:300}
.featured-quote{border-top:.5px solid rgba(249,244,235,.1);border-bottom:.5px solid rgba(249,244,235,.1);padding:clamp(28px,4vw,48px) 0;margin-bottom:clamp(28px,4vw,44px)}
.featured-quote blockquote{font-family:var(--serif);font-size:clamp(18px,2.6vw,32px);font-weight:300;color:#F9F4EB;font-style:italic;line-height:1.5;max-width:820px}
.featured-quote cite{display:block;margin-top:14px;font-family:var(--sans);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:rgba(249,244,235,.38);font-style:normal;font-weight:300}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,2vw,18px)}
@media(max-width:768px){.review-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.review-grid{grid-template-columns:1fr}}
.review-card{background:rgba(249,244,235,.04);border:.5px solid rgba(249,244,235,.08);padding:clamp(18px,2.5vw,28px)}
.review-stars{color:var(--warm);font-size:10px;letter-spacing:2px;margin-bottom:12px;display:block}
.review-text{font-family:var(--serif);font-size:clamp(14px,1.5vw,17px);font-weight:300;color:rgba(249,244,235,.85);font-style:italic;line-height:1.6;margin-bottom:14px}
.review-avatar{width:28px;height:28px;border-radius:50%;background:rgba(201,185,154,.18);display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-size:9px;color:var(--warm);font-weight:400;flex-shrink:0}
.review-name{font-family:var(--sans);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:rgba(249,244,235,.4);font-weight:300}
.review-date{font-family:var(--sans);font-size:9px;color:rgba(249,244,235,.2);margin-top:2px}

/* ── QUOTE DIVIDER ── */
.divider-row{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:clamp(16px,3vw,40px);padding:clamp(40px,5vw,64px) 0}
@media(max-width:750px){.divider-row{grid-template-columns:1fr;gap:24px}}
.divider-quote{font-family:var(--serif);font-size:clamp(18px,2.5vw,30px);font-weight:300;color:var(--dark);font-style:italic;line-height:1.45}
.divider-bar{width:.5px;height:55px;background:rgba(42,37,32,.2)}
@media(max-width:750px){.divider-bar{display:none}}
.stat-num{font-family:var(--serif);font-size:clamp(28px,3.5vw,42px);color:var(--accent);font-weight:300;display:block;text-align:center;line-height:1}
.stat-label{font-family:var(--sans);font-size:clamp(7px,.85vw,9px);letter-spacing:.26em;text-transform:uppercase;color:var(--mid);font-weight:300;text-align:center;margin-top:6px;display:block}

/* ── FOOTER ── */
.site-footer{background:var(--dark);padding:clamp(48px,6vw,72px) var(--pad) clamp(20px,3vw,32px)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(24px,4vw,52px);margin-bottom:clamp(36px,5vw,52px)}
@media(max-width:860px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr}}
.footer-logo{font-family:var(--serif);font-size:clamp(20px,2.5vw,26px);font-weight:300;color:#F9F4EB;letter-spacing:.08em;margin-bottom:12px}
.footer-detail{font-family:var(--sans);font-size:clamp(10px,1.1vw,12px);color:rgba(249,244,235,.38);line-height:1.8;font-weight:300}
.footer-col h4{font-family:var(--sans);font-size:clamp(7px,.85vw,8px);letter-spacing:.3em;text-transform:uppercase;color:var(--warm);margin-bottom:clamp(12px,1.8vw,18px);font-weight:400}
.footer-col a{display:block;font-family:var(--sans);font-size:clamp(10px,1.1vw,12px);color:rgba(249,244,235,.38);margin-bottom:9px;font-weight:300;transition:color .2s}
.footer-col a:hover{color:rgba(249,244,235,.75)}
.footer-bottom{border-top:.5px solid rgba(249,244,235,.1);padding-top:clamp(16px,2vw,24px);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-copy{font-family:var(--sans);font-size:9px;color:rgba(249,244,235,.2);font-weight:300}
.footer-social{display:flex;gap:clamp(14px,2vw,24px)}
.footer-social a{font-family:var(--sans);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:rgba(249,244,235,.3);transition:color .2s}
.footer-social a:hover{color:rgba(249,244,235,.7)}

/* ── BLOG ── */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,32px)}
@media(max-width:900px){.blog-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.blog-grid{grid-template-columns:1fr}}
.blog-card{cursor:pointer;background:var(--white)}
.blog-card-img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;transition:transform .5s ease;overflow:hidden}
.blog-card:hover .blog-card-img{transform:scale(1.03)}
.blog-card-img-wrap{overflow:hidden}
.blog-card-body{padding:clamp(16px,2.5vw,28px) 0}
.blog-card-cat{font-family:var(--sans);font-size:8px;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;display:block;font-weight:400}
.blog-card-title{font-family:var(--serif);font-size:clamp(18px,2vw,24px);font-weight:300;color:var(--dark);line-height:1.3;margin-bottom:10px}
.blog-card-excerpt{font-family:var(--sans);font-size:clamp(11px,1.1vw,12.5px);color:var(--mid);line-height:1.8;font-weight:300;margin-bottom:14px}
.blog-card-date{font-family:var(--sans);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(42,37,32,.4);font-weight:300}

/* ── BOOKING PAGE ── */
.booking-frame{width:100%;height:calc(100vh - 70px);border:none;display:block}

/* ── LANGUAGE SWITCHER ── */
[data-lang]{transition:opacity .2s}




.editor-badge{position:fixed;bottom:24px;right:24px;background:var(--accent);color:var(--white);font-family:var(--sans);font-size:9px;letter-spacing:.18em;text-transform:uppercase;padding:10px 18px;cursor:pointer;z-index:999;border:none;font-weight:400;transition:opacity .2s}
.editor-badge:hover{opacity:.85}

/* ── EDITOR BADGE ── */
.editor-badge{position:fixed;bottom:24px;right:24px;background:var(--accent);color:var(--white);font-family:var(--sans);font-size:9px;letter-spacing:.18em;text-transform:uppercase;padding:10px 18px;cursor:pointer;z-index:999;border:none;font-weight:400;transition:opacity .2s;display:none}
.editor-badge:hover{opacity:.85}
.editor-badge.visible{display:block}

/* Mosaic height fix, right cells fill full height */
.mosaic-grid{height:clamp(400px,55vw,680px)}
.mosaic-cell.tall{min-height:unset;height:100%}
.mosaic-right{height:100%}
.mosaic-right .mosaic-cell{min-height:unset;height:100%}

/* Pillars, own padding, no section utility class needed */
.pillars-grid .pillar{padding:clamp(40px,5vw,72px) clamp(28px,4vw,52px)}

/* Divider stats, always horizontal */
@media(max-width:600px){
  .divider-stats{grid-template-columns:1fr!important}
}

/* Full-width fixes, no wrap constraint on these sections */
.site-footer .wrap{max-width:none;padding:0}
.footer-grid{padding:0 var(--pad)}
.footer-bottom{padding:0 var(--pad)}