/* Mallorca Work & Flow House – styles measured 1:1 from the original Wix page
   Font mapping (free, self-hosted look-alikes, width-matched):
   Georgia            -> Georgia (system) / Gelasio (metric-compatible fallback)
   Avenir 85 Heavy    -> Avenir Heavy (Apple devices) / Nunito Sans 800
   DIN Neuzeit Grotesk-> Barlow Condensed 300   (buttons)
   DIN Next Light     -> Barlow 300             (form step titles)
   Futura Book/Light  -> Jost 400 / 300         (form)                          */
@font-face{font-family:"Gelasio";src:url("/assets/fonts/gelasio-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Gelasio";src:url("/assets/fonts/gelasio-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Gelasio";src:url("/assets/fonts/gelasio-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Gelasio";src:url("/assets/fonts/gelasio-latin-700-italic.woff2") format("woff2");font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url("/assets/fonts/nunito-sans-latin-800-normal.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito Sans";src:url("/assets/fonts/nunito-sans-latin-800-italic.woff2") format("woff2");font-weight:800;font-style:italic;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("/assets/fonts/barlow-condensed-latin-300-normal.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Barlow";src:url("/assets/fonts/barlow-latin-300-normal.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Jost";src:url("/assets/fonts/jost-latin-300-normal.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Jost";src:url("/assets/fonts/jost-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}

:root{
  --navy:#1e3b67; --slate:#324158; --sand:#c89b6d; --sand-dark:#b5875a;
  --cream:#f5efe6; --card:rgba(250,245,238,.8); --card-sand:rgba(222,190,156,.6);
  --line:rgba(200,155,109,.6); --line-navy:rgba(30,59,103,.45);
  --serif:Georgia,"Gelasio","Times New Roman",serif;
  --avenir:"Avenir","Nunito Sans","Avenir Next",sans-serif;
  --din:"Barlow Condensed","DIN Condensed","Arial Narrow",sans-serif;
  --dinnext:"Barlow","DIN Next","Helvetica Neue",sans-serif;
  --futura:"Jost","Futura",sans-serif;
  --shadow:0 10px 22px rgba(70,45,20,.15);
  --radius:22px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:var(--serif);font-size:16px;line-height:1.4;color:var(--navy);background:var(--cream)}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:var(--cream) var(--texture) center/cover no-repeat;opacity:.9}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy)}
:focus-visible{outline:3px solid var(--sand);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;z-index:20}.skip:focus{left:8px}
.wrap{width:min(980px,92vw);margin-inline:auto}
.narrow{width:min(970px,92vw);margin-inline:auto}
/* Avenir Heavy look-alike */
.av{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em}

/* ---------- hero ---------- */
.hero{position:relative;height:435px;display:grid;place-items:center;text-align:center;color:#fff;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:rgba(25,35,50,.32)}
.hero-inner{position:relative;z-index:1;padding:40px 4vw 10px;width:100%}
.topbar{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:12px 4vw}
.topbar nav{display:flex;gap:20px}
.topbar a{color:#fff;text-decoration:none;font-family:var(--serif);font-size:15px}
.topbar a:hover{text-decoration:underline}
.lang{font-family:var(--serif);font-size:15px}
.lang a{opacity:.7;text-decoration:none}.lang a[aria-current]{opacity:1;text-decoration:underline}
.hero-logo{width:180px;margin:0 auto 10px}
.tagline{font-family:var(--serif);font-weight:700;font-size:40px;line-height:40px;margin:0 0 10px}
.hero h1{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;font-size:20px;line-height:1.2;margin:0 auto 22px;max-width:740px;text-transform:uppercase}

/* ---------- buttons ---------- */
.btn{display:inline-block;font-family:var(--din);font-weight:300;font-size:30px;letter-spacing:3px;line-height:1.2;text-transform:uppercase;color:#fff;background:var(--sand);padding:8px 34px 9px;border-radius:999px;text-decoration:none;box-shadow:0 5px 14px rgba(80,50,20,.22);border:0;cursor:pointer}
.btn:hover{background:var(--sand-dark)}
#rooms .btn{font-size:27px;letter-spacing:2.7px}
#future .btn,#faq .btn{font-size:23px;letter-spacing:2.3px}
.btn.navy{background:var(--navy);font-size:18px;letter-spacing:1.8px;padding:6px 22px}
.cta{text-align:center;margin:48px 0 0}
.cta p{font-size:18px;line-height:25.2px;margin:0 0 14px}
.small-caps{font-family:var(--serif);font-size:18px;line-height:25.2px;margin:26px 0 0}

/* ---------- headings ---------- */
section{padding:0}
.h2{display:flex;align-items:center;justify-content:center;gap:18px;font-family:var(--serif);font-weight:700;color:var(--navy);font-size:35px;line-height:49px;margin:0 0 40px;text-align:center}
.h2::before,.h2::after{content:"";flex:0 1 210px;height:1px;background:var(--line)}
#experience .h2,#day .h2{font-size:40px;line-height:56px}
.lead{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;text-align:center;font-size:18px;line-height:21.6px;max-width:830px;margin:0 auto}
.ruled{display:flex;justify-content:center;align-items:flex-start;gap:18px}
.ruled::before,.ruled::after{content:"";flex:0 0 60px;height:1px;background:var(--line-navy);margin-top:18px}
.ruled .big{font-family:var(--serif);font-weight:700;font-size:25px;line-height:35px;color:var(--navy);text-align:center;margin:0}

/* ---------- experience ---------- */
#experience{padding-top:56px}
#experience .lead{margin-bottom:34px}
.icons{display:grid;grid-template-columns:repeat(4,175px);justify-content:center;gap:55px}
.icon-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 8px 16px;text-align:center;font-size:20px;line-height:28px}
.icon-card img{width:149px;height:92px;object-fit:contain;margin:0 auto 8px}
.statement{text-align:center;margin-top:62px}
.statement .caps{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:18px;line-height:21.6px;margin:12px auto 0;max-width:310px}

/* ---------- rooms ---------- */
#rooms{padding-top:92px}
.rooms{display:grid;grid-template-columns:repeat(3,252px);justify-content:center;gap:16px}
.room{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;text-align:center}
.room.popular{background:var(--card-sand)}
.gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.gallery::-webkit-scrollbar{display:none}
.gallery img{flex:0 0 100%;height:188px;object-fit:cover;scroll-snap-align:start}
.room-body{padding:24px 14px 18px}
.room h3{font-family:var(--serif);font-weight:700;font-size:20px;line-height:28px;margin:0 0 14px}
.price{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;font-size:22px;line-height:22px;border-block:1px solid var(--line);margin:0 28px 14px;padding:9px 0}
.price small{font-size:18px}
.room p{font-size:17px;line-height:23.8px;margin:0}
.room em{display:block;font-style:italic;font-size:16px;line-height:22.4px;margin-top:14px}
.room.popular em{font-weight:700;margin-top:24px}
.room .note{font-style:italic;font-size:12px;line-height:16px;margin-top:6px}
.swipe{display:none}

/* ---------- a day at ---------- */
#day{padding-top:128px}
#day .h2{margin-bottom:49px}
.day2{position:relative;width:980px;max-width:100%;height:450px;margin:0 auto}
.day2>*{position:absolute;margin:0}
.d-h{font-family:var(--serif);font-weight:700;font-size:24px;line-height:33.6px;color:var(--slate);white-space:nowrap}
.d-t{font-size:20px;line-height:28px;color:var(--navy)}
.ln{height:1px;background:var(--line)}
.d-sun{left:50px;top:0;width:115px}
.d-morning{left:178px;top:25px}
.l1{left:296px;top:42px;width:122px}
.d-laptop{left:418px;top:2px;width:130px}
.l2{left:548px;top:42px;width:126px}
.d-t1{left:55px;top:91px;width:220px}
.d-t2{left:361px;top:91px;width:230px;text-align:center}
.d-wave{left:733px;top:103px;width:142px}
.d-t3{left:670px;top:175px;width:272px;text-align:center}
.l3{left:36px;top:242px;width:385px}
.d-after{left:421px;top:225px;width:140px;text-align:center}
.l4{left:561px;top:242px;width:126px}
.l5{left:157px;top:347px;width:156px}
.d-even{left:313px;top:330px;width:219px;text-align:center}
.l6{left:532px;top:347px;width:155px}
.d-night{left:705px;top:290px;width:147px}
.d-t4{left:240px;top:404px;width:600px;text-align:center}

/* ---------- future self ---------- */
#future{padding-top:95px}
#future .h2{margin-bottom:36px}
.quotes{display:grid;grid-template-columns:repeat(3,307px);justify-content:center;gap:24px}
.quote{background:var(--card-sand);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 18px 18px;text-align:center;margin:0}
.quote img{width:110px;margin:0 auto 8px;opacity:.85}
.quote p{font-size:14px;line-height:19.6px;margin:0 0 14px}
.quote cite{display:block;font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;font-style:italic;text-transform:uppercase;font-size:14px;line-height:14px;max-width:150px;margin:0 auto}
.disclaimer{text-align:center;font-size:12px;font-style:italic;opacity:.75;margin:14px 0 0}
#future .cta{margin-top:36px}

/* ---------- faq ---------- */
#faq{padding-top:130px}
#faq .h2{margin-bottom:46px}
.faq details{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 17px;margin:0 0 18px}
.faq summary{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:16px;line-height:19px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--serif);font-weight:400;font-size:22px;line-height:18px;color:var(--sand)}
.faq details[open] summary::after{content:"–"}
.faq details p{font-size:14px;line-height:19.6px;margin:11px 0 0}
#faq .cta{margin-top:30px}

/* ---------- founder ---------- */
#founder{padding-top:150px}
.founder{display:grid;grid-template-columns:450px 1fr;gap:98px;align-items:center}
.founder img.photo{border-radius:var(--radius);box-shadow:var(--shadow);width:450px;height:400px;object-fit:cover}
.founder h2{font-family:var(--serif);font-weight:700;color:var(--sand);font-size:35px;line-height:49px;margin:0}
.founder .rule{width:135px;height:1px;background:var(--line);margin:6px 0 22px}
.founder h3{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:18px;line-height:21.6px;margin:0 0 20px}
.founder blockquote{margin:0;font-style:italic;font-size:18px;line-height:25.2px}
.founder blockquote p{margin:0}
.founder .sig{width:95px;margin-top:20px}
.founder .bio{font-size:14px;line-height:19.6px;margin-top:18px;max-width:420px}

/* ---------- commitment ---------- */
#commitment{padding-top:140px}
#commitment::before{content:"";display:block;width:min(660px,80vw);height:1px;background:var(--line);margin:0 auto 90px}
.ruled.commit{margin-bottom:18px}
#commitment .lead{margin-bottom:56px;max-width:860px}
.terms{display:grid;grid-template-columns:repeat(3,310px);justify-content:center;gap:20px 20px}
.term{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px 22px;text-align:center}
.term img{width:95px;height:59px;object-fit:contain;margin:0 auto 6px}
.term h3{font-family:var(--serif);font-weight:700;font-size:20px;line-height:28px;margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.term p{font-size:14px;line-height:19.6px;margin:0}
.agree{text-align:center;margin-top:52px}
.agree p{display:inline-block;font-size:16px;line-height:22.4px;border-bottom:1px solid var(--navy);padding:0 26px 10px;margin:0 0 12px}

/* ---------- footer ---------- */
footer{text-align:center;padding:150px 0 40px}
footer .flogo{width:130px;margin:0 auto 18px}
.social{display:flex;justify-content:center;gap:12px;margin-bottom:12px}
.social a{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--navy);border-radius:50%}
.social svg{width:16px;height:16px;fill:var(--navy)}
.legal{font-size:14px;line-height:19.6px;color:var(--slate);margin:8px 0 0}
.legal a{text-decoration:none;color:var(--slate)}.legal a:hover{text-decoration:underline}
.founded{font-size:12px;opacity:.8;margin-top:6px}

/* ---------- legal pages (GTC style) ---------- */
.legal-top{display:flex;justify-content:space-between;align-items:center;padding:22px 0 0}
.legal-top .lang a{color:var(--navy)}
.legal-logo img{width:110px}
main.narrow>h1.h2{margin-top:30px}
.doc{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px clamp(18px,4vw,40px);margin:0 auto 40px}
.doc.legal h2{font-family:var(--serif);font-weight:400;font-size:20px;line-height:1.35;color:var(--navy);margin:26px 0 6px;text-transform:none;letter-spacing:0}
.doc.legal h2:first-child{margin-top:0}
.doc.legal h3{font-family:var(--serif);font-size:16px;margin:18px 0 4px}
.doc.legal p,.doc.legal li{font-size:14px;line-height:1.45;margin:4px 0}
.doc.legal ul{margin:4px 0 8px;padding-left:22px}
.langnote{font-style:italic;font-size:13px;opacity:.85}
.back{text-align:center;margin:10px 0 0}
.page-head{background:var(--navy);color:#fff;padding:16px 4vw;display:flex;justify-content:space-between;align-items:center}
.page-head a{color:#fff;text-decoration:none}
.page-head img{width:150px}

/* ---------- consent ---------- */
#consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:50;max-width:560px;margin-inline:auto;background:#fffaf3;border-radius:18px;box-shadow:0 12px 34px rgba(30,40,60,.25);padding:18px 20px;font-size:14px;line-height:1.45}
#consent p{margin:0 0 12px}
.consent-btns{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.consent-btns .btn{font-size:17px;letter-spacing:1.5px;padding:6px 18px}
.btn.ghost{background:transparent;color:var(--navy);box-shadow:none;border:1px solid var(--navy)}
.c-opts{margin:0 0 12px}
.c-row{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:8px 0}
.c-row input{margin-top:3px}

/* ---------- application form (measured from Wix form) ---------- */
.apply-wrap{width:min(911px,94vw);margin:0 auto;padding:20px 0 80px}
.apply-h{display:flex;align-items:center;justify-content:center;gap:28px;font-family:var(--serif);font-weight:400;font-size:30px;line-height:42px;margin:16px 0 56px;text-align:center}
.apply-h b{font-weight:700}
.apply-h::before,.apply-h::after{content:"";flex:0 0 56px;height:1px;background:var(--line-navy)}
.apply-card{background:#f7eee5;border-radius:30px;box-shadow:0 12px 28px rgba(70,45,20,.12);padding:24px}
.step{border:0;margin:0;padding:0;min-width:0}
.step-h{font-family:var(--dinnext);font-weight:300;text-transform:uppercase;font-size:25px;line-height:37.5px;letter-spacing:-.01em;padding:0;margin:0 0 2px}
.step-sub{font-family:var(--futura);font-weight:400;font-size:14px;line-height:21px;margin:0 0 6px}
.apply-card label,.apply-card .lbl{display:block;font-family:var(--futura);font-weight:400;font-size:14px;line-height:19.6px;margin:25px 0 9px}
.apply-card label.sub{margin:8px 0 9px}
.apply-card input:not([type=radio]):not([type=checkbox]),.apply-card select,.apply-card textarea{width:100%;border:0;border-radius:30px;background:rgba(255,255,255,.88);height:40px;padding:0 16px;font:300 16px var(--futura);color:var(--navy)}
.apply-card textarea{height:96px;padding:12px 16px;border-radius:24px;resize:vertical}
.apply-card select{appearance:none;-webkit-appearance:none;background:rgba(255,255,255,.88) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' fill='none' stroke='%231e3b67' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat right 16px center/14px}
.bday{display:grid;grid-template-columns:408fr 191fr 191fr;gap:23px}
.opts{display:grid;gap:4px}
.opts.months{grid-template-columns:repeat(3,1fr)}
.apply-card label.opt{display:flex;align-items:center;gap:14px;margin:6px 0;font-weight:300;font-size:17px;line-height:1.4}
.apply-card .opt input{width:16px;height:16px;margin:0;accent-color:var(--sand);flex:0 0 16px}
.apply-card .agree{align-items:center;margin-top:22px}
.apply-card .agree span{text-align:left}
.apply-card .agree a{color:var(--sand)}
.step-nav{display:flex;justify-content:space-between;margin-top:24px}
.pill{background:var(--sand);color:#fff;border:0;border-radius:30px;font:400 16px/20.8px var(--serif);width:100px;height:48px;cursor:pointer}
.pill:hover{background:var(--sand-dark)}
.err{color:#9b2c2c;font-size:14px;margin:8px 0 0}
.hp{position:absolute;left:-5000px}
.apply-card:not(.js) .step-nav{display:none}
.apply-card:not(.js) .step[data-step="3"] .step-nav{display:flex}
/* thank-you page */
.doc h1{font-family:var(--serif);font-size:30px;margin:0 0 8px}

/* =================== MOBILE =================== */
@media (max-width:1000px){
  .day2{height:auto;width:auto;display:grid;justify-items:center;text-align:center;gap:6px;
        grid-template-areas:"sun" "m" "t1" "lap" "t2" "wave" "a" "t3" "night" "e" "t4"}
  .day2>*{position:static}
  .day2 .ln{display:none}
  .d-t{width:auto!important;text-align:center;margin-bottom:16px}
  .d-sun{grid-area:sun;width:100px}.d-morning{grid-area:m}.d-t1{grid-area:t1}.d-laptop{grid-area:lap;width:110px}.d-t2{grid-area:t2}
  .d-wave{grid-area:wave;width:115px}.d-after{grid-area:a}.d-t3{grid-area:t3}.d-night{grid-area:night;width:115px}.d-even{grid-area:e}.d-t4{grid-area:t4}
  .terms{grid-template-columns:repeat(2,minmax(0,310px))}
  .founder{grid-template-columns:1fr;gap:28px;justify-items:center}
  .founder img.photo{width:100%;max-width:450px;height:auto;aspect-ratio:9/8}
}
@media (max-width:760px){
  body{font-size:15px}
  .hero{height:auto;min-height:440px}
  .hero-inner{padding:70px 6vw 40px}
  .topbar nav{display:none}
  .hero-logo{width:150px}
  .tagline{font-size:30px;line-height:34px}
  .hero h1{font-size:15px;line-height:19px}
  .btn{font-size:24px;letter-spacing:2.4px;padding:7px 26px}
  #rooms .btn,#future .btn,#faq .btn{font-size:21px;letter-spacing:2px}
  .h2,#experience .h2,#day .h2{font-size:26px;line-height:34px;gap:12px;margin-bottom:26px}
  .h2::before,.h2::after{flex-basis:28px}
  .lead,.statement .caps,.founder h3{font-size:14px;line-height:18px}
  #experience{padding-top:44px}
  .icons{grid-template-columns:repeat(2,minmax(0,160px));gap:16px}
  .icon-card{font-size:16px;line-height:22px}
  .icon-card img{width:110px;height:68px}
  .ruled .big{font-size:21px;line-height:28px}
  .ruled::before,.ruled::after{flex-basis:28px;margin-top:14px}
  .statement{margin-top:44px}
  #rooms,#future{padding-top:70px}
  #day{padding-top:80px}
  #faq{padding-top:80px}
  #founder{padding-top:90px}
  #commitment{padding-top:80px}
  #commitment::before{margin-bottom:60px}
  .rooms,.quotes{grid-template-columns:minmax(0,330px);gap:20px}
  .gallery img{height:auto;aspect-ratio:4/3}
  .d-h{font-size:21px;line-height:28px}
  .d-t{font-size:17px;line-height:24px}
  .faq details{padding:16px 14px}
  .faq summary{font-size:14px;line-height:18px}
  .founder h2{font-size:28px;line-height:36px}
  .founder blockquote{font-size:16px;line-height:23px}
  .terms{grid-template-columns:minmax(0,330px)}
  footer{padding-top:90px}
  .apply-h{font-size:22px;line-height:30px;gap:10px;margin:8px 0 28px}
  .apply-h::before,.apply-h::after{flex-basis:24px}
  .apply-card{padding:20px 16px;border-radius:24px}
  .step-h{font-size:21px;line-height:30px}
  .bday{grid-template-columns:1.6fr 1fr 1fr;gap:10px}
  .opts.months{grid-template-columns:repeat(2,1fr)}
  .apply-card label.opt{font-size:16px}
  .legal-top{padding-top:14px}
}

/* ---- fine-tuning after side-by-side measurement (desktop) ---- */
@media (min-width:761px){
  .h2::before,.h2::after{flex:1 1 0;max-width:210px}
  #experience .h2{margin-bottom:23px}
  .statement{margin-top:109px}
  #rooms .cta{margin-top:125px}
  #day{padding-top:108px}
  #future{padding-top:72px}
  #faq{padding-top:120px}
  #faq .h2{margin-bottom:36px}
  #commitment{padding-top:60px}
  #commitment::before{margin-bottom:60px}
  .terms{row-gap:12px}
  .term{padding-bottom:14px}
  .agree{margin-top:64px}
}
.apply-lang{position:absolute;top:14px;right:4vw}
.apply-lang a{color:var(--navy)}
.apply-wrap{padding-top:58px}
@media (min-width:761px){.apply-h{margin-bottom:47px}.bday{gap:36px}.apply-card label.sub{margin-top:0}}

/* ---- buttons: exact box sizes & spacing from the original ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:0 0 1px;box-shadow:2.94px 4.05px 20px rgba(160,160,159,.75);border-radius:30px;white-space:nowrap}
.hero .btn{width:328px;height:55px}
.hero h1{margin-bottom:32px}
.tagline{margin-bottom:8px}
#rooms .btn{width:320px;height:48px}
#future .btn,#faq .btn{width:275px;height:48px}
.btn.navy{width:182px;height:34px;padding:0}
.cta p{margin:0 0 19px}
.small-caps{margin-top:26px}
.agree{display:flex;flex-direction:column;align-items:center}
.agree br{display:none}
.agree p{margin:0 0 18px;padding:0 26px 10px}
.back .btn.navy,.consent-btns .btn{width:auto;height:auto;padding:6px 20px}
@media (max-width:760px){
  .hero .btn{width:280px;height:50px}
  #rooms .btn{width:280px;height:46px}
  #future .btn,#faq .btn{width:250px;height:46px}
  .btn.navy{width:170px;height:34px}
  .hero h1{margin-bottom:24px}
}
.cta .small-caps{margin:26px 0 0}
.cta p{margin-bottom:17px}
.agree p{margin-bottom:14px}
.hero-inner{padding-top:52px}
@media (min-width:761px){#rooms .cta{margin-top:101px}}

/* =====================================================================
   SPACING STANDARD (derived from the original page, see analysis)
   xs 8 · sm 12 · md 20 · lg 28 · xl 44 · section 112
   text→text in a block: md · heading→text: lg · heading→cards/images: xl
   image→text in cards: lg · card padding: md · card grid gap: md
   between sections: section · small px corrections offset line-height
   ===================================================================== */
:root{--xs:8px;--sm:12px;--md:20px;--lg:28px;--xl:44px;--sec:112px}
@media (max-width:760px){:root{--xs:6px;--sm:10px;--md:16px;--lg:22px;--xl:32px;--sec:72px}}

.hero-logo{width:246px;height:86px;object-fit:contain;margin:0 auto 20px}
.tagline{margin-bottom:calc(var(--xs) + 7px)}
.hero h1{margin-bottom:calc(var(--lg) + 1px)}
#experience .h2{margin-bottom:calc(var(--lg) - 1px)}
#experience .lead{margin-bottom:var(--xl)}
.icons{grid-template-columns:repeat(4,165px);gap:calc(var(--xl) + var(--md))}
.icon-card{padding-bottom:calc(var(--md) - 1px)}
.icon-card img{margin-bottom:var(--xs)}
.statement{margin-top:var(--sec)}
.statement .caps{margin-top:var(--md)}

#rooms{padding-top:calc(var(--sec) - 2px)}
#rooms .h2{margin-bottom:var(--xl)}
.rooms{gap:var(--md)}
.room-body{padding:calc(var(--lg) - 1px) 14px var(--md)}
.room h3{margin-bottom:calc(var(--lg) - 7px)}
.price{margin-bottom:calc(var(--lg) - 7px)}
.room em{margin-top:calc(var(--md) - 3px)}
.room.popular em{margin-top:calc(var(--lg) - 1px)}
.room .note{margin-top:var(--xs)}
#rooms .cta{margin-top:var(--sec)}
.cta p{margin-bottom:calc(var(--md) - 3px)}
.cta .small-caps{margin-top:calc(var(--lg) - 2px)}

#day{padding-top:calc(var(--sec) - 4px)}
#day .h2{margin-bottom:calc(var(--xl) - 3px)}

#future{padding-top:calc(var(--sec) - 21px)}
#future .h2{margin-bottom:calc(var(--xl) - 3px)}
.quotes{gap:var(--md)}
.quote{padding:calc(var(--sm) - 2px) 18px var(--xs)}
.quote img{margin-bottom:var(--xs)}
.quote p{margin-bottom:calc(var(--md) + 1px)}
.disclaimer{margin-top:14px}
#future .cta{margin-top:12px}

#faq{padding-top:calc(var(--sec) - 2px)}
#faq .h2{margin-bottom:calc(var(--xl) - 3px)}
.faq details{padding:var(--md) 17px;margin-bottom:var(--md)}
.faq details p{margin-top:var(--sm)}
#faq .cta{margin-top:calc(var(--xl) - 1px)}

#founder{padding-top:calc(var(--sec) - 40px)}
.founder .rule{margin-bottom:var(--lg)}
.founder h3{margin-bottom:var(--md)}
.founder .sig{margin-top:var(--md)}

#commitment{padding-top:calc(var(--sec) - 21px)}
#commitment::before{margin-bottom:calc(var(--sec) - 21px)}
.ruled.commit{margin-bottom:var(--md)}
#commitment .lead{margin-bottom:calc(var(--xl) + var(--lg))}
.terms{grid-template-columns:repeat(3,313px);gap:var(--md)}
.term{padding:var(--sm) 18px var(--md)}
.term h3{margin-bottom:calc(var(--sm) + 4px)}
.agree{margin-top:calc(var(--xl) - 1px)}
.agree p{margin-bottom:calc(var(--sm) + 2px)}

footer{padding-top:calc(var(--sec) * 1.5)}
footer .flogo{margin-bottom:var(--md)}
.social{margin-bottom:var(--lg)}
footer .legal{margin-top:0}

@media (max-width:1000px){.terms{grid-template-columns:repeat(2,minmax(0,313px))}}
@media (max-width:760px){
  .hero-logo{width:180px;height:63px}
  .icons{grid-template-columns:repeat(2,minmax(0,160px));gap:var(--md)}
  .rooms,.quotes,.terms{grid-template-columns:minmax(0,330px)}
  #founder{padding-top:var(--sec)}
  #commitment{padding-top:calc(var(--sec) / 2)}
  #commitment::before{margin-bottom:calc(var(--sec) / 2)}
}
.hero-logo{margin-bottom:30px}
#rooms .h2{margin-bottom:calc(var(--xl) - 3px)}
#founder{padding-top:calc(var(--sec) - 43px)}
#commitment{padding-top:calc(var(--sec) - 24px)}
.cta p{margin-bottom:calc(var(--md) - 1px)}
.agree p{margin-bottom:calc(var(--sm) + 4px)}
.faq details{padding:calc(var(--md) + 2px) 17px calc(var(--md) - 2px)}
@media (max-width:760px){.hero-logo{margin-bottom:20px}#founder{padding-top:var(--sec)}#commitment{padding-top:calc(var(--sec) / 2)}}

/* =====================================================================
   LEGAL PAGES (terms, house rules, imprint, data protection) – GTC design
   measured from original: title 40px Georgia bold with side lines,
   card 853px · radius 30 · shadow, intro Avenir caps 20/24,
   section headings Georgia 20 regular, text Georgia 14/19.6, list indent 25
   Standard: page→title 72 · title→card lg · card padding 36/36/44/20
   intro→first heading lg · heading→text 4 · between sections 24
   card→footer 1.5×section · footer logo→links 40
   ===================================================================== */
.legal-body{position:relative}
.legal-wrap{width:min(853px,92vw);margin:0 auto;padding-top:62px}
.legal-h{display:flex;align-items:center;justify-content:center;gap:18px;font-family:var(--serif);font-weight:700;font-size:40px;line-height:56px;color:var(--navy);text-align:center;margin:0 0 var(--lg)}
.legal-h span{max-width:420px}
.legal-h::before,.legal-h::after{content:"";flex:0 0 60px;height:1px;background:var(--line-navy)}
.legal-card{background:rgba(245,239,230,.57);border-radius:30px;box-shadow:10.7px 13.21px 20px 3px rgba(0,0,0,.21);padding:calc(var(--lg) + var(--xs)) calc(var(--lg) + var(--xs)) var(--xl) var(--md);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.legal-intro{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:20px;line-height:24px;text-align:center;max-width:560px;margin:0 auto calc(var(--lg) - 2px)}
.legal-card h2{font-family:var(--serif);font-weight:400;font-size:20px;line-height:28px;color:var(--navy);margin:20px 0 0;text-transform:none;letter-spacing:0}
.legal-card .legal-intro+h2,.legal-card .legal-intro+p+h2{margin-top:0}
.legal-card h3{font-family:var(--serif);font-weight:700;font-size:15px;line-height:22px;margin:12px 0 0}
.legal-card p,.legal-card li{font-size:14px;line-height:19.6px;margin:0}
.legal-card p+p{margin-top:19.6px}
.legal-card h2+p,.legal-card h2+ul,.legal-card h3+p{margin-top:0}
.legal-card ul{list-style:disc;margin:0;padding-left:25px}
.legal-card li::marker{font-size:11px}
.legal-card a{color:var(--navy)}
.legal-card .langnote{font-style:italic;opacity:.8;margin-bottom:20px}
.legal-footer{text-align:center;padding:calc(var(--sec) * 1.5) 0 40px}
.legal-footer img{width:141px;margin:0 auto 40px}
.legal-links{font-size:14px;line-height:19.6px;margin:0 0 6px;color:var(--slate)}
.legal-links a{color:var(--slate);text-decoration:none}.legal-links a:hover{text-decoration:underline}
@media (max-width:760px){
  .legal-wrap{padding-top:52px}
  .legal-h{font-size:28px;line-height:36px;gap:10px}
  .legal-h::before,.legal-h::after{flex-basis:24px}
  .legal-card{padding:24px 16px 32px;border-radius:24px;box-shadow:4px 6px 14px 1px rgba(0,0,0,.16)}
  .legal-intro{font-size:15px;line-height:19px}
  .legal-card h2{font-size:18px;line-height:25px}
}
.legal-wrap{padding-top:70px}
.legal-h{margin-bottom:calc(var(--lg) - 3px)}
.legal-card .legal-intro{margin:0 auto calc(var(--lg) - 1px)}
.legal-card h2{margin-top:22px}
.legal-card .legal-intro+h2,.legal-card .legal-intro+p+h2{margin-top:0}
.legal-card h2+p,.legal-card h2+ul,.legal-card h3+p{margin-top:3px}
.legal-card{padding-bottom:calc(var(--xl) - 2px)}
@media (max-width:760px){.legal-wrap{padding-top:52px}}
.legal-card h2+h3{margin-top:4px}
.legal-intro{max-width:680px}

/* ===== typographic polish: balanced line breaks, no lonely words ===== */
h1,h2,h3,.h2,.tagline,.lead,.legal-intro,.statement .caps,.ruled .big,.quote cite,.faq summary,.founder h3,.d-h,.apply-h,.step-h,.cta p,.small-caps,.icon-card,.room h3,.room p,.room em,.term h3,.term p{text-wrap:balance}
p,li,blockquote,.d-t{text-wrap:pretty}
/* forced line breaks only where there is room for them */
@media (max-width:1000px){
  .legal-intro br,#commitment .lead br,.hero h1 br{display:none}
  .legal-intro{font-size:clamp(13px,1.2vw + 9px,18px);line-height:1.25;max-width:600px}
}
.lead,#commitment .lead{text-wrap:pretty}
/* tablet (761–1000px): nothing may overflow */
@media (min-width:761px) and (max-width:1000px){
  .icons{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;max-width:760px;margin-inline:auto}
  .icon-card{font-size:17px;line-height:24px}
  .icon-card img{width:100%;max-width:149px;height:auto}
  .rooms,.quotes{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:820px;margin-inline:auto}
  .room p{font-size:15.5px;line-height:21px}
  .terms{grid-template-columns:repeat(2,minmax(0,313px))}
}
@media (max-width:600px){.icons{grid-template-columns:repeat(2,minmax(0,160px))}}
.d-t2{left:344px;width:264px}
@media (min-width:761px) and (max-width:1000px){.room h3{font-size:18px;line-height:25px}.room-body{padding-inline:10px}}
@media (max-width:760px){.legal-intro{font-size:13px;line-height:17px;letter-spacing:-.015em}.legal-card{padding-inline:14px}}
/* specificity fix: intro must beat ".legal-card p" */
.legal-card .legal-intro{font-size:20px;line-height:24px;max-width:680px}
@media (max-width:1000px){.legal-card .legal-intro{font-size:clamp(13px,1.2vw + 9px,18px);line-height:1.25;max-width:600px}}
@media (max-width:760px){.legal-card .legal-intro{font-size:13px;line-height:17px}}
@media (max-width:760px){.legal-card .legal-intro{font-size:12.5px;line-height:16.5px;letter-spacing:-.02em;margin-inline:-4px}}

/* exceptions requested: experience intro one size smaller · founder text indented on mobile */
#experience .lead{font-size:17px;line-height:20.4px}
@media (max-width:760px){
  #experience .lead{font-size:13px;line-height:17px}
  .founder>div{padding-inline:20px 8px}
}
.hero h1{max-width:640px}
@media (max-width:760px){.hero h1{font-size:14px;line-height:18px;max-width:330px}}
@media (min-width:761px){.hero h1{max-width:820px}}
/* founder photo: centred on the text body (from "why this place exists" to the last line) */
@media (min-width:1001px){.founder img.photo{position:relative;top:33px}}
@media (min-width:1001px){#commitment{padding-top:calc(var(--sec) + 9px)}}

/* ===== facts "at a glance" + guide pages ===== */
#facts{padding-top:var(--sec)}
#facts .h2{margin-bottom:calc(var(--xl) - 3px)}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:var(--md);margin:0}
.facts>div{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--md)}
.facts dt{font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:14px;line-height:18px;margin:0 0 6px}
.facts dd{margin:0;font-size:16px;line-height:22.4px}
.guide-link{text-align:center;font-size:16px;margin:var(--lg) 0 0}
.crumb{font-size:13px;margin:0 0 var(--md);opacity:.8}
.crumb a{color:var(--navy)}
.legal-card .answer{background:rgba(255,255,255,.55);border-left:3px solid var(--sand);border-radius:12px;padding:14px 16px;font-size:15px;line-height:22px;margin:0 0 26px}
.guide .legal-card p,.guide .legal-card li{font-size:15.5px;line-height:23px}
.guide .legal-card h2{margin-top:30px;font-size:22px;line-height:30px}
.tbl{overflow-x:auto;margin:10px 0 6px}
.legal-card table{border-collapse:collapse;width:100%;font-size:14.5px;line-height:20px;min-width:440px}
.legal-card th,.legal-card td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line)}
.legal-card th{font-family:var(--avenir);font-weight:800;text-transform:uppercase;font-size:12.5px;letter-spacing:0}
.guide-faq{padding-top:var(--sec)}
.guide .cta{margin-top:var(--xl)}
.guide .cta .btn{width:275px;height:48px;font-size:23px;letter-spacing:2.3px}
.updated{text-align:center;font-size:13px;font-style:italic;opacity:.8;margin:var(--xl) 0 0}
@media (max-width:760px){
  .facts{grid-template-columns:1fr}
  .guide .legal-card h2{font-size:19px;line-height:26px}
  .guide .legal-card p,.guide .legal-card li{font-size:15px;line-height:22px}
  .guide .cta .btn{width:250px;height:46px;font-size:21px}
}
.facts dt .em{font-size:16px;margin-right:8px;vertical-align:-1px}

/* ===== conversion elements – kept in the original look ===== */
.infobar{margin:0;background:var(--navy);color:#fff;text-align:center;font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:12px;line-height:16px;padding:8px 16px}
.hero-ctas{display:flex;flex-direction:column;align-items:center;gap:14px}
.hero-link{color:#fff;font-family:var(--serif);font-size:16px;text-decoration:underline;text-underline-offset:4px}
.hero-link:hover{color:#fff;opacity:.85}
.usps{margin:22px 0 0;font-family:var(--serif);font-style:italic;font-size:16px;color:#fff;opacity:.95}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--md);max-width:760px;margin:var(--xl) auto 0;text-align:center}
.stats dt{font-family:var(--serif);font-weight:700;font-size:34px;line-height:1.1;color:var(--navy)}
.stats dd{margin:6px 0 0;font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:13px;color:var(--navy)}
.room-body{display:flex;flex-direction:column}
.room{display:flex;flex-direction:column}
.room-body{flex-grow:1}
.btn.navy.room-apply{width:auto;height:36px;padding:0 18px;margin:var(--md) auto 0;font-size:16px;letter-spacing:1.4px}
.room .room-apply{margin-top:auto}
.room .note+.room-apply,.room em+.room-apply,.room p+.room-apply{margin-top:var(--md)}
.quick{margin:var(--md) 0 0!important;font-size:15px}
.season-note{margin:var(--md) 0 0;font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:13px}
.talk{margin:8px 0 0;font-size:15px;line-height:21px;max-width:420px}
.sticky-cta{display:none}
@media (max-width:760px){
  .infobar{font-size:10.5px;line-height:14px;padding:7px 12px}
  .usps{font-size:14px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--lg)}
  .stats dt{font-size:28px}
  .sticky-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(12px + env(safe-area-inset-bottom,0px));background:rgba(245,239,230,.97);border-top:1px solid var(--line);box-shadow:0 -6px 16px rgba(30,40,60,.1)}
  .sticky-cta p{margin:0;font-size:13px;line-height:17px}
  .sticky-cta p span{font-family:var(--avenir);font-weight:800;text-transform:uppercase;font-size:12px}
  .sticky-cta .btn{width:auto;height:44px;padding:0 24px;font-size:21px;letter-spacing:2px}
  footer{padding-bottom:110px}
  #consent{bottom:84px}
}
#rooms .room .btn.room-apply{width:auto;height:36px;padding:0 18px;font-size:16px;letter-spacing:1.4px;margin:auto auto 0;align-self:center}
.room-body>*:nth-last-child(2){margin-bottom:var(--md)}
@media (max-width:760px){#rooms .room .btn.room-apply{height:42px;font-size:17px}}
@media (max-width:760px){.ib-opt{display:none}.infobar{font-size:10px}}

/* =====================================================================
   DYNAMIC LAYER – kickers, reveal, hover, hero zoom, sticky header,
   gallery dots, "a look inside" band, "how it works" steps, micro promise
   ===================================================================== */
.kicker{margin:0 0 var(--xs);text-align:center;font-family:var(--avenir);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:var(--sand-dark)}
.kicker+.h2,.kicker+.ruled{margin-top:0}
.micro{display:block;margin:10px 0 0!important;font-family:var(--serif);font-style:italic;font-size:14px;opacity:.85}
.hero .micro{color:#fff;opacity:.9}

/* 1 reveal */
.js-reveal .rv{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.js-reveal .rv.in{opacity:1;transform:none}
/* 2 hover */
.icon-card,.room,.facts>div,.term,.quote,.step{transition:transform .25s ease,box-shadow .25s ease}
@media (hover:hover){.icon-card:hover,.room:hover,.facts>div:hover,.term:hover,.quote:hover,.step:hover{transform:translateY(-4px);box-shadow:0 16px 30px rgba(70,45,20,.18)}}
/* 3 hero zoom */
@keyframes kb{from{transform:scale(1.06)}to{transform:scale(1)}}
.hero>img{animation:kb 8s ease-out both}
/* 4 sticky header */
.topbar{transition:background .3s ease,box-shadow .3s ease}
.topbar.stuck{position:fixed;background:rgba(245,239,230,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 4px 14px rgba(30,40,60,.08)}
.topbar.stuck a{color:var(--navy)}
/* 5 gallery dots + arrows */
.gal{position:relative}
.gal-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:6px;pointer-events:none}
.gal-dots span{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.gal-dots span.on{background:#fff}
.gal-btn,.band-btn{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.85);color:var(--navy);font:22px/1 var(--serif);cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity .2s}
.gal-btn.prev{left:8px}.gal-btn.next{right:8px}
.gal:hover .gal-btn,.gal-btn:focus-visible{opacity:1}
@media (hover:none){.gal-btn{display:none}}
/* 6 band */
.band-sec{padding-top:var(--sec)}
.band-sec .h2{margin-bottom:var(--xl)}
.band{position:relative}
.band-track{display:flex;gap:var(--md);overflow-x:auto;scroll-snap-type:x mandatory;padding:6px max(4vw,calc((100vw - 980px)/2)) 24px;scrollbar-width:none}
.band-track::-webkit-scrollbar{display:none}
.band-track figure{flex:0 0 min(420px,78vw);margin:0;scroll-snap-align:center}
.band-track img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}
.band-track figcaption{margin-top:10px;font-size:14px;font-style:italic;text-align:center}
.band-btn{opacity:1;top:calc(50% - 20px);width:44px;height:44px;box-shadow:var(--shadow)}
.band-btn.prev{left:max(12px,calc((100vw - 1080px)/2))}.band-btn.next{right:max(12px,calc((100vw - 1080px)/2))}
@media (max-width:760px){.band-btn{display:none}}
/* 8 steps */
#steps{padding-top:var(--sec)}
#steps .h2{margin-bottom:var(--xl)}
.steps{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--md);max-width:900px;counter-reset:none}
.step{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--lg) var(--md) var(--md);text-align:center}
.step .num{display:block;font-family:var(--din);font-weight:300;font-size:40px;letter-spacing:3px;color:var(--sand-dark);line-height:1}
.step h3{margin:var(--sm) 0 var(--xs);font-size:20px;line-height:28px;color:var(--navy)}
.step p{margin:0;font-size:15px;line-height:21px}
#steps .cta{margin-top:var(--xl)}
#steps .btn{width:320px;height:48px;font-size:27px;letter-spacing:2.7px}
/* 9 faq link */
.faq-all{text-align:center;margin:var(--md) 0 0;font-size:16px}
.faq-all a{color:var(--navy)}
@media (max-width:760px){
  .steps{grid-template-columns:1fr;max-width:420px}
  #steps .btn{width:280px;height:46px;font-size:24px}
  .kicker{font-size:11px}
}
@media (prefers-reduced-motion:reduce){.hero>img{animation:none}.js-reveal .rv{opacity:1;transform:none}}
.kicker{color:#8c6239}.step .num{color:#8c6239}

/* fix: stats exactly under the four icon cards; calmer hero */
.stats{grid-template-columns:repeat(4,165px);gap:0 calc(var(--xl) + var(--md));max-width:none;justify-content:center}
.stats>div{display:flex;flex-direction:column;align-items:center}
.stats dt{font-size:30px;white-space:nowrap}
@media (min-width:761px) and (max-width:1000px){.stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;max-width:760px;margin-inline:auto}}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,minmax(0,160px));gap:var(--lg) var(--md)}}
.hero{height:auto;min-height:470px}
.hero-inner{padding:72px 4vw 56px}
.hero h1{margin-bottom:28px}
.hero .micro{margin-top:12px!important}

/* ===== cinematic hero (same colours, fonts and photo – more space, less clutter) ===== */
.hero{min-height:min(88vh,860px);height:auto;align-items:end;place-items:end center}
.hero::after{background:linear-gradient(180deg,rgba(20,30,45,.30) 0%,rgba(20,30,45,.10) 35%,rgba(20,30,45,.55) 100%)}
.hero-inner{padding:120px 4vw 110px;max-width:980px}
.hero-kicker{margin:0 0 14px;font-family:var(--avenir);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:#fff;opacity:.92}
.tagline{font-size:clamp(40px,5.6vw,72px);line-height:1.02;margin-bottom:16px;text-shadow:0 2px 18px rgba(0,0,0,.25)}
.hero h1{font-size:18px;line-height:1.3;max-width:640px;margin:0 auto 30px;opacity:.95}
.topbar{padding:14px 4vw}
.brand img{width:150px;height:auto;display:block}
.topnav{display:flex;align-items:center;gap:26px}
.topbar.stuck .brand img{filter:brightness(0) saturate(100%) invert(19%) sepia(35%) saturate(1500%) hue-rotate(190deg) brightness(92%)}
.scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;width:28px;height:44px;border:1.5px solid rgba(255,255,255,.8);border-radius:16px}
.scroll-cue span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:#fff;animation:cue 1.8s ease-in-out infinite}
@keyframes cue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}
@media (prefers-reduced-motion:reduce){.scroll-cue span{animation:none}}
@media (max-width:760px){
  .hero{min-height:82vh}
  .hero-inner{padding:110px 6vw 96px}
  .hero-kicker{font-size:11px;letter-spacing:.1em}
  .tagline{font-size:38px}
  .hero h1{font-size:14px}
  .brand img{width:118px}
  .topnav nav{display:none}
}
/* mobile: stats in the same 2-column grid as the icon cards */
@media (max-width:760px){
  .icons,.stats{grid-template-columns:repeat(2,minmax(0,160px));column-gap:16px;justify-content:center}
  .stats{row-gap:var(--lg);margin-inline:auto}
  .stats>div{text-align:center}
}

/* stats: lining figures in the button typeface so every number sits on one line and looks centred */
.stats dt{font-family:var(--din);font-weight:300;font-size:46px;line-height:1;letter-spacing:1px;font-variant-numeric:lining-nums}
.stats dd{margin-top:8px}
.stats>div{justify-content:flex-start}
@media (max-width:760px){.stats dt{font-size:40px}}
.topbar.stuck .lang{color:var(--navy)}
.hero>img{object-position:center 62%}
@media (max-width:760px){.hero>img{object-position:22% 60%}}
/* stats back to Georgia bold (original style), alignment kept */
.stats dt{font-family:var(--serif);font-weight:700;font-size:34px;line-height:1.15;letter-spacing:0}
@media (max-width:760px){.stats dt{font-size:30px}}

/* hero: bay photo; closing CTA on the sunset photo */
.hero>img{object-position:center 55%}
@media (max-width:760px){.hero>img{object-position:58% center}}
.cta.cta-photo{position:relative;isolation:isolate;margin-top:var(--xl);padding:96px 24px 88px;border-radius:var(--radius);overflow:hidden;color:#fff;background:#3a4a5c var(--bg) center 60%/cover no-repeat}
.cta.cta-photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,30,45,.25),rgba(20,30,45,.55))}
.cta.cta-photo p,.cta.cta-photo .micro,.cta.cta-photo .quick{color:#fff}
.cta.cta-photo .quick a{color:#fff}
@media (max-width:760px){.cta.cta-photo{padding:64px 18px 60px}}
/* stronger, softer veil behind the hero text on the busy bay photo */
.hero::after{background:radial-gradient(ellipse 60% 45% at 50% 58%,rgba(20,30,45,.45),rgba(20,30,45,0) 70%),linear-gradient(180deg,rgba(20,30,45,.35) 0%,rgba(20,30,45,.12) 30%,rgba(20,30,45,.55) 100%)}
.hero h1{text-shadow:0 1px 12px rgba(0,0,0,.35)}

/* optical centring: letter-spaced kickers and headings ending in a full stop */
.kicker{padding-left:.08em}
.ruled{align-items:center}
.ruled .big{padding-left:.28em}

/* hero as <picture>: landscape on desktop, portrait on mobile */
.hero>picture{position:absolute;inset:0;z-index:0}
.hero>picture>img{width:100%;height:100%;object-fit:cover;object-position:center 45%;animation:kb 8s ease-out both}
@media (prefers-reduced-motion:reduce){.hero>picture>img{animation:none}}
@media (max-width:760px){
  .hero>picture>img{object-position:center 30%}
  .hero{place-items:start center;align-items:start}
  .hero-inner{padding-top:120px;padding-bottom:0}
  .hero::after{background:linear-gradient(180deg,rgba(20,30,45,.30) 0%,rgba(20,30,45,.18) 45%,rgba(20,30,45,0) 60%,rgba(20,30,45,.25) 100%)}
}

/* nav without logo; flag language switch; lighter hero veil */
.topbar{justify-content:flex-end}
.lang{display:flex;align-items:center;gap:8px}
.lang a{display:inline-flex;line-height:0;border-radius:3px;opacity:.6;transition:opacity .2s,transform .2s}
.lang a[aria-current]{opacity:1;box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.lang a:hover{opacity:1;transform:translateY(-1px)}
.flag{display:block;border-radius:2px}
.topbar.stuck .lang a[aria-current]{box-shadow:0 0 0 2px var(--navy)}
.hero-logo{width:200px;height:auto;margin:0 auto 18px;display:block;filter:drop-shadow(0 2px 10px rgba(0,0,0,.25))}
@media (min-width:761px){
  .hero::after{background:linear-gradient(180deg,rgba(20,30,45,.18) 0%,rgba(20,30,45,0) 30%,rgba(20,30,45,0) 55%,rgba(20,30,45,.35) 100%),radial-gradient(ellipse 42% 34% at 50% 55%,rgba(20,30,45,.30),rgba(20,30,45,0) 75%)}
  .tagline,.hero h1{text-shadow:0 2px 16px rgba(0,0,0,.45),0 1px 3px rgba(0,0,0,.3)}
}
@media (max-width:760px){.hero-logo{width:150px;margin-bottom:12px}.hero-inner{padding-top:96px}}

/* header like boutique best performers: menu left · logo centred · language right */
.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-content:normal;padding:14px 4vw}
.topbar nav{justify-self:start;display:flex;gap:22px}
.topbar .brand{justify-self:center}
.topbar .brand img{width:150px;height:auto;display:block;filter:drop-shadow(0 1px 6px rgba(0,0,0,.25))}
.topbar .lang{justify-self:end}
.topbar.stuck .brand img{width:120px;filter:brightness(0) saturate(100%) invert(19%) sepia(35%) saturate(1500%) hue-rotate(190deg) brightness(92%)}
.hero-inner{padding-top:150px}
@media (max-width:760px){
  .topbar{grid-template-columns:1fr auto 1fr;padding:10px 16px}
  .topbar nav{display:none}
  .topbar .brand{grid-column:2}
  .topbar .brand img{width:118px}
  .topbar .lang{grid-column:3}
  .hero-inner{padding-top:110px}
}

/* text placed in the calm sky at the top of the photo */
@media (min-width:761px){
  .hero.text-top{place-items:start center;align-items:start}
  .hero.text-top .hero-inner{padding-top:118px;padding-bottom:0}
  .hero.text-top::after{background:linear-gradient(180deg,rgba(20,30,45,.30) 0%,rgba(20,30,45,.12) 38%,rgba(20,30,45,0) 55%)}
  .hero.text-top>picture>img{object-position:center 70%}
}
/* split layout: claim in the sky, details + button over the calm pool water */
@media (min-width:761px){
  .hero.text-top{min-height:min(92vh,900px)}
  .hero.text-top .hero-inner{position:absolute;inset:0;max-width:none;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:96px 4vw 64px}
  .hero.text-top .tagline{margin:0}
  .hero.text-top h1{margin:0 auto 18px;max-width:720px}
  .hero.text-top .hero-bottom{display:flex;flex-direction:column;align-items:center}
  .hero.text-top::after{background:linear-gradient(180deg,rgba(20,30,45,.28) 0%,rgba(20,30,45,0) 26%,rgba(20,30,45,0) 62%,rgba(20,30,45,.42) 100%)}
  .hero.text-top .scroll-cue{display:none}
}
@media (min-width:761px){.hero.text-top .hero-inner{padding-bottom:40px}}
@media (max-width:760px){.hero.text-top>picture>img{object-position:center 78%}}

/* sharper desktop hero: almost no zoom; mobile: micro promise over the pool water */
@keyframes kbs{from{transform:scale(1.015)}to{transform:scale(1)}}
.hero>picture>img{animation:kbs 6s ease-out both}
@media (max-width:760px){
  .hero.text-top .micro{position:absolute;left:0;right:0;bottom:34px;margin:0!important;z-index:2;font-size:14px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.55),0 0 2px rgba(0,0,0,.4);opacity:1}
  .hero.text-top .scroll-cue{display:none}
  .hero.text-top::after{background:linear-gradient(180deg,rgba(20,30,45,.30) 0%,rgba(20,30,45,.16) 42%,rgba(20,30,45,0) 58%,rgba(20,30,45,0) 82%,rgba(20,30,45,.28) 100%)}
}
@media (max-width:760px){.hero.text-top .hero-inner{position:absolute;inset:0;padding:96px 6vw 0}}

/* hero text: away from the edges – claim centred in the sky, details + button lifted */
@media (min-width:761px){
  .hero.text-top .hero-inner{padding:15vh 4vw 9vh}
  .hero.text-top h1{margin-bottom:26px}
}
/* mobile: claim + subline centred in the sky, button + micro promise over the pool */
@media (max-width:760px){
  .hero.text-top{min-height:86vh}
  .hero.text-top .hero-inner{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:15vh 6vw 34px}
  .hero.text-top .hero-bottom{display:contents}
  .hero.text-top h1{margin:6px auto 0}
  .hero.text-top .hero-ctas{margin-top:auto}
  .hero.text-top .micro{position:static;margin-top:10px!important}
  .hero.text-top::after{background:linear-gradient(180deg,rgba(20,30,45,.30) 0%,rgba(20,30,45,.14) 40%,rgba(20,30,45,0) 55%,rgba(20,30,45,0) 74%,rgba(20,30,45,.30) 100%)}
}
@media (min-width:761px){
  .hero.text-top h1{text-shadow:0 1px 10px rgba(0,0,0,.6),0 0 2px rgba(0,0,0,.45)}
  .hero.text-top .hero-bottom{position:relative}
  .hero.text-top .hero-bottom::before{content:"";position:absolute;inset:-30px -60px -20px;z-index:-1;background:radial-gradient(ellipse at center,rgba(20,30,45,.38),rgba(20,30,45,0) 70%);pointer-events:none}
}
/* room button always inside the card and centred */
#rooms .room .btn.room-apply{max-width:calc(100% - 24px);box-sizing:border-box;white-space:nowrap;align-self:center;justify-content:center;letter-spacing:1.2px}
/* flag switch on sub-pages (cream background) */
.apply-lang.lang{display:flex;gap:8px;align-items:center}
.apply-lang.lang a{opacity:.55;box-shadow:none}
.apply-lang.lang a[aria-current]{opacity:1;box-shadow:0 0 0 2px var(--navy)}
.apply-lang.lang a:hover{opacity:1}
/* sub-pages: flags exactly like the main page header (same size, spacing, opacity, ring) */
.apply-lang.lang{gap:8px;font-size:0}
.apply-lang.lang a{opacity:.6;border-radius:3px;box-shadow:none;transition:opacity .2s,transform .2s}
.apply-lang.lang a[aria-current]{opacity:1;box-shadow:0 0 0 1.5px var(--navy)}
.apply-lang.lang a:hover{opacity:1;transform:translateY(-1px)}
.apply-lang.lang .flag{width:22px;height:15px}

/* ===== social flow section (Instagram / TikTok / LinkedIn) ===== */
.sflow{--sf-top:0px;--sf-bottom:14px;--cream-2:#ece3d5;--sand-2:#ead9c3;--navy-2:#2a5088;--ink:var(--navy);--muted:#5d6676;--sans:var(--avenir)}
.sflow{position:relative;padding:var(--sec,112px) 16px 120px}
.sflow .sf-social__head{max-width:1080px;margin:0 auto 24px;text-align:center}
.sflow .sf-social__wrap{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.sflow .sf-social__stage{position:sticky;top:10vh;height:80vh;display:flex;align-items:center;justify-content:center;order:2}
.sflow .sf-social__steps{order:1}
.sflow .sf-step{min-height:85vh;display:flex;flex-direction:column;justify-content:center;max-width:420px;opacity:.28;transition:opacity .5s ease}
.sflow .sf-step.sf-is-active{opacity:1}
.sflow .sf-pill{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);background:var(--sand-2);border-radius:999px;padding:6px 12px;margin-bottom:16px}
.sflow .sf-pill svg{width:14px;height:14px}
.sflow .sf-step h3{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3vw,36px);line-height:1.15;color:var(--navy);text-transform:lowercase;margin-bottom:12px}
.sflow .sf-step p{color:var(--muted);margin-bottom:20px}
.sflow .sf-link{align-self:flex-start;font-weight:600;color:var(--navy);text-decoration:none;border-bottom:1px solid var(--sand);padding-bottom:2px}
.sflow .sf-link:hover{border-color:var(--navy)}
.sflow .sf-ctas{display:flex;flex-wrap:wrap;gap:10px}
.sflow .sf-dots{position:absolute;right:-28px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px}
.sflow .sf-dots span{width:6px;height:6px;border-radius:50%;background:var(--sand-2);transition:background .3s,transform .3s}
.sflow .sf-dots span.sf-on{background:var(--navy);transform:scale(1.3)}
.sflow .sf-phone{position:relative;width:min(300px,72vw);aspect-ratio:9/19.5;border-radius:44px;background:#0d1220;padding:10px;box-shadow:0 40px 80px -30px rgba(31,42,68,.45),0 0 0 1px rgba(31,42,68,.15);transform:rotate(-2deg);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.sflow .sf-phone[data-platform="tiktok"]{transform:rotate(2deg)}
.sflow .sf-phone[data-platform="linkedin"]{transform:rotate(-1deg)}
.sflow .sf-phone[data-platform="cta"]{transform:rotate(0) scale(1.02)}
.sflow .sf-phone::before{content:"";position:absolute;top:18px;left:50%;transform:translateX(-50%);width:84px;height:24px;border-radius:20px;background:#0d1220;z-index:5}
.sflow .sf-screen{position:relative;width:100%;height:100%;border-radius:36px;overflow:hidden;background:#fff}
.sflow .sf-scr{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;display:flex;flex-direction:column}
.sflow .sf-scr.sf-is-on{opacity:1}
.sflow .sf-sb{height:44px;flex:none;display:flex;align-items:flex-end;justify-content:space-between;padding:0 22px 4px;font:600 12px/1 var(--sans)}
.sflow .sf-ig{background:#fff;color:#111}
.sflow .sf-ig__bar{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:12px;font-weight:600}
.sflow .sf-ig__bar img{width:28px;height:28px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--sand)}
.sflow .sf-ig__bar small{display:block;font-weight:400;color:#777;font-size:10px}
.sflow .sf-ig__feed{position:relative;flex:1;overflow:hidden}
.sflow .sf-ig__track{position:absolute;left:0;right:0;top:0;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.sflow .sf-ig__post img,.sflow .sf-ig__post video{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.sflow .sf-ig__media{position:relative}
.sflow .sf-ig__reel{position:absolute;top:8px;right:8px;width:18px;height:18px;color:#fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.sflow .sf-ig__acts{display:flex;gap:12px;padding:8px 12px 2px}
.sflow .sf-ig__acts svg{width:20px;height:20px}
.sflow .sf-ig__cap{padding:0 12px 14px;font-size:11px;line-height:1.4}
.sflow .sf-ig__cap b{font-weight:600}
.sflow .sf-tt{background:#000;color:#fff}
.sflow .sf-tt video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.sflow .sf-tt video.sf-is-vid{opacity:1}
.sflow .sf-tt__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,transparent 25%,transparent 60%,rgba(0,0,0,.6) 100%)}
.sflow .sf-tt .sf-sb{position:relative;z-index:2;color:#fff}
.sflow .sf-tt__tabs{position:relative;z-index:2;text-align:center;font-size:12px;font-weight:600;margin-top:6px}
.sflow .sf-tt__tabs span{opacity:.6;margin:0 6px}
.sflow .sf-tt__tabs span.sf-on{opacity:1;border-bottom:2px solid #fff;padding-bottom:2px}
.sflow .sf-tt__side{position:absolute;right:10px;bottom:90px;z-index:2;display:flex;flex-direction:column;gap:14px;align-items:center;font-size:10px}
.sflow .sf-tt__side img{width:36px;height:36px;border-radius:50%;border:2px solid #fff}
.sflow .sf-tt__side div{display:flex;flex-direction:column;align-items:center;gap:2px}
.sflow .sf-tt__side svg{width:26px;height:26px}
.sflow .sf-tt__cap{position:absolute;left:12px;right:60px;bottom:22px;z-index:2;font-size:11px;line-height:1.4}
.sflow .sf-tt__cap b{display:block;font-size:12px;margin-bottom:2px}
.sflow .sf-li{background:#F4F2EE;color:#191919}
.sflow .sf-li__top{display:flex;align-items:center;gap:8px;padding:6px 12px 8px;background:#fff;border-bottom:1px solid #e5e5e5}
.sflow .sf-li__top .sf-search{flex:1;height:26px;border-radius:4px;background:#EEF3F8}
.sflow .sf-li__card{background:#fff;margin:8px 0;padding:12px;font-size:11px;line-height:1.45}
.sflow .sf-li__who{display:flex;gap:8px;margin-bottom:8px}
.sflow .sf-li__who img{width:36px;height:36px;border-radius:50%}
.sflow .sf-li__who b{font-size:12px;display:block}
.sflow .sf-li__who small{color:#666;font-size:10px;display:block}
.sflow .sf-li__card .sf-img{margin:10px -12px 0;display:block;width:calc(100% + 24px);aspect-ratio:1/1;object-fit:cover}
.sflow .sf-li__react{display:flex;justify-content:space-around;border-top:1px solid #eee;margin-top:8px;padding-top:8px;color:#666;font-weight:600;font-size:10px}
.sflow .sf-end{background:var(--navy);color:var(--cream);align-items:center;justify-content:center;text-align:center;padding:24px;gap:10px}
.sflow .sf-end img{width:84px;height:84px;border-radius:50%;margin-bottom:6px;box-shadow:0 0 0 3px var(--sand)}
.sflow .sf-end h4{font-family:var(--serif);font-weight:400;font-size:22px;text-transform:lowercase}
.sflow .sf-end p{font-size:12px;opacity:.75;margin-bottom:8px}
.sflow .sf-end a{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px;border-radius:12px;background:rgba(247,242,234,.1);color:var(--cream);text-decoration:none;font-size:13px;font-weight:600}
.sflow .sf-end a svg{width:16px;height:16px}
@media (max-width:760px){.sflow{padding:var(--sec,72px) 16px 72px}
.sflow .sf-social__wrap{grid-template-columns:1fr;gap:0}
.sflow .sf-social__stage{order:1;position:sticky;top:var(--sf-top,0px);height:auto;padding:10px 0 24px;z-index:3;
    background:linear-gradient(180deg,var(--cream) 0%,var(--cream) 90%,rgba(245,239,230,0) 100%)}
.sflow .sf-phone{width:270px;zoom:.56}
.sflow .sf-dots{right:auto;left:50%;top:auto;bottom:-26px;transform:translateX(-50%);flex-direction:row}
.sflow .sf-dots span{width:8px;height:8px}
.sflow .sf-social__steps{order:2;position:relative;z-index:1}
.sflow .sf-step{min-height:62vh;justify-content:flex-end;max-width:none;opacity:1;padding-bottom:var(--sf-bottom,14px)}
.sflow .sf-step__card p{display:none}
.sflow .sf-step__card{background:#fbf8f3;border:1px solid var(--sand-2);border-radius:18px;padding:16px 18px;box-shadow:0 12px 30px -18px rgba(31,42,68,.35)}
.sflow .sf-pill{margin-bottom:10px;padding:5px 10px;font-size:11px}
.sflow .sf-step h3{font-size:22px;margin-bottom:6px}
.sflow .sf-step p{font-size:14px;line-height:1.5;margin-bottom:10px}}
@media (prefers-reduced-motion: reduce){.sflow .sf-phone,.sflow .sf-ig__track,.sflow .sf-scr,.sflow .sf-step{transition:none}}
@media (max-width:760px){.sflow{--sf-top:62px;--sf-bottom:84px}}
.sflow .sf-social__head .h2{margin-bottom:var(--md)}
.sflow .sf-social__head p.lead{max-width:830px;margin:0 auto}
.sflow .sf-step__card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--lg);backdrop-filter:none;border:0}
.sflow .sf-pill{background:none;padding:0;border-radius:0;font-family:var(--avenir);font-weight:800;letter-spacing:-.01em;text-transform:uppercase;font-size:14px;line-height:18px;color:var(--navy);margin:0 0 12px;gap:8px}
.sflow .sf-pill svg{width:16px;height:16px}
.sflow .sf-step h3{font-family:var(--serif);font-weight:700;font-size:24px;line-height:32px;color:var(--navy);text-transform:none;margin:0 0 10px}
.sflow .sf-step p{font-family:var(--serif);font-size:17px;line-height:23.8px;color:var(--navy);margin:0 0 16px}
.sflow .sf-link{font-family:var(--serif);font-weight:400;font-size:16px;color:var(--navy);text-decoration:underline;text-underline-offset:3px;border:0;padding:0}
.sflow .sf-ctas{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.sflow .sf-ctas .btn{width:auto;height:44px;padding:0 26px;font-size:21px;letter-spacing:2px;gap:8px}
.sflow .sf-ctas .btn.ghost{height:36px;padding:0 16px;font-size:16px;letter-spacing:1.4px;box-shadow:none}
.sflow .sf-ctas .btn svg{width:14px;height:14px}
.sflow .sf-screen{font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif}
.sflow .sf-end h4{font-family:var(--serif)}
@media (max-width:760px){.sflow .sf-step__card{padding:var(--md)}.sflow .sf-step h3{font-size:20px;line-height:28px;margin-bottom:8px}.sflow .sf-pill{margin-bottom:8px}.sflow .sf-step:last-child .btn.ghost{display:none}}
