:root{
  /* Brand accents (theme-independent) */
  --teal:#1aa6a8; --teal-lo:#159a9c; --teal-deep:#0a4c4e;
  /* brand accent = Arrivederci turquoise (was gold) */
  --gold:#12938f; --gold-lo:#0c6f6c; --gold-hi:#1aa6a8;
  --ivory:#f6f2e9; --paper:#faf7f0;
  --ink-lt:#14201f; --slate:#5f716f;
  --serif:'EB Garamond',Georgia,serif;
  --display:'Cormorant Garamond','EB Garamond',Georgia,serif;
  --sans:'Jost',system-ui,-apple-system,sans-serif;
  --maxw:1200px;

  /* ---- LIGHT THEME (primary / default) ---- */
  --page:#f6f2e8;                 /* main page + .dark sections */
  --deep-grad:linear-gradient(180deg,#efe9db,#f6f2e8);   /* .deep sections */
  --section:#ffffff;              /* .light islands */
  --text:#16211f;
  --text-dim:#4f615e;
  --text-mute:#8a9a98;
  --hair:rgba(16,33,31,.13);
  --hair-2:rgba(16,33,31,.06);
  --card:#ffffff;
  --card-grad:linear-gradient(180deg,#ffffff,#f7f2e7);
  --card-feat:linear-gradient(180deg,#fffdf6,#f7efd8);
  --field-bg:#ffffff;
  --nav-solid:rgba(248,244,237,.9);
  --menu-bg:rgba(248,244,237,.98);
  --gold-ink:#0c6f6c;             /* deep turquoise text, legible on light */
  --on-light:#14201f;            /* text on .light islands (always dark) */
  --on-light-dim:#5f716f;
  --logo-solid:none;             /* natural logo on a light solid nav */
  --cs:light;                    /* color-scheme for native form controls */

  /* Back-compat aliases: old token names -> semantic tokens (resolve per theme).
     Keeps inline styles on yacht.html / experiences.html theme-aware. */
  --tx:var(--text); --tx-dim:var(--text-dim); --tx-mute:var(--text-mute);
  --line:var(--hair); --line-lo:var(--hair-2); --line-d:var(--hair);
  --black:var(--page); --ink:var(--text); --char:var(--card); --panel:var(--card);
}

/* ---- DARK THEME (secondary; reproduces the original look) ---- */
:root[data-theme="dark"]{
  --page:#0a0c0d;
  --deep-grad:linear-gradient(180deg,#0c1516,#0a0c0d);
  --section:#faf7f0;
  --text:#eef2f1;
  --text-dim:#b3c0bf;
  --text-mute:#7d8f8e;
  --hair:rgba(255,255,255,.13);
  --hair-2:rgba(255,255,255,.07);
  --card:#12191a;
  --card-grad:linear-gradient(180deg,#12191a,#0d1213);
  --card-feat:linear-gradient(180deg,#1a1710,#0f1112);
  --field-bg:#0e1416;
  --nav-solid:rgba(8,10,11,.86);
  --menu-bg:rgba(8,10,11,.97);
  --gold-ink:#5bd6d8;
  --on-light:#14201f;
  --on-light-dim:#5f716f;
  --logo-solid:brightness(0) invert(1);   /* white logo on dark solid nav */
  --cs:dark;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--serif);background:var(--page);color:var(--text);line-height:1.62;font-size:18px;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .3s,color .3s}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.04;letter-spacing:-.005em;text-wrap:balance}
.it{font-style:italic}
.eyebrow{font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:.34em;text-transform:uppercase;color:var(--gold-ink);display:inline-flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--gold)}
.btn{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:14px 26px;border-radius:6px;display:inline-flex;align-items:center;gap:9px;cursor:pointer;border:1px solid transparent;transition:.25s}
.btn.gold{background:linear-gradient(180deg,#1aa6a8,#0f807e);color:#fff}
.btn.gold:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn.ghost{border-color:rgba(255,255,255,.34);color:#fff}
.btn.ghost:hover{border-color:var(--gold-hi);color:var(--gold-hi)}
.btn.dark{border-color:var(--hair);color:var(--text)}
.btn.dark:hover{border-color:var(--gold-lo);color:var(--gold-lo)}
.morelink{font-family:var(--sans);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);display:inline-flex;align-items:center;gap:8px;transition:.2s}
.morelink:hover{gap:14px;color:var(--text)}

/* Nav */
nav{position:fixed;top:0;left:0;right:0;z-index:60;transition:background .3s,border-color .3s,padding .3s;padding:20px 0;border-bottom:1px solid transparent}
nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px}
nav .logo{width:150px;content:url(/img/logo-dark.png)}   /* white wordmark + turquoise arc (dark/transparent header) */
nav .links{display:flex;gap:34px;align-items:center}
nav .links a{font-family:var(--sans);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.82);transition:.2s;position:relative}
nav .links a:hover{color:#fff}
nav .links a.active{color:var(--gold-hi)}
nav .links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--gold)}
nav .right{display:flex;align-items:center;gap:16px}
.lang{font-family:var(--sans);font-size:11px;letter-spacing:.1em;display:flex;gap:2px;border:1px solid rgba(255,255,255,.28);border-radius:20px;overflow:hidden}
.lang button{background:none;border:none;color:rgba(255,255,255,.66);font:inherit;padding:6px 11px;cursor:pointer;letter-spacing:.1em}
.lang button.on{background:var(--gold);color:#fff}
.themetoggle{background:none;border:1px solid rgba(255,255,255,.28);color:#fff;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s;flex:none}
.themetoggle:hover{border-color:var(--gold-hi);color:var(--gold-hi)}
.themetoggle svg{width:16px;height:16px}
.themetoggle .ico-sun{display:none}
.themetoggle .ico-moon{display:block}
:root[data-theme="dark"] .themetoggle .ico-sun{display:block}
:root[data-theme="dark"] .themetoggle .ico-moon{display:none}
.navtoggle{display:none;background:none;border:none;color:#fff;font-size:22px;cursor:pointer}

/* Language + theme controls mirrored into the mobile hamburger menu (hidden on desktop) */
.menuextra{display:none}
.menuextra .lang{border-color:var(--hair)}
.menuextra .lang button{color:var(--text-mute)}
.menuextra .lang button.on{background:var(--gold);color:#fff}
.menuextra .themetoggle{border-color:var(--hair);color:var(--text-dim)}
.menuextra .themetoggle:hover{border-color:var(--gold);color:var(--gold-ink)}

/* Solid nav — when scrolled, or forced on pages without a hero (body.solid-nav) */
nav.scrolled,body.solid-nav nav{background:var(--nav-solid);backdrop-filter:blur(14px);border-bottom-color:var(--hair-2);padding:12px 0}
/* Light theme + solid: switch nav to dark-on-light controls + natural logo */
:root[data-theme="light"] nav.scrolled .logo,
:root[data-theme="light"] body.solid-nav nav .logo{content:url(/img/logo.png)}   /* natural (dark wordmark + teal arc) on light solid nav */
:root[data-theme="light"] nav.scrolled .links a,
:root[data-theme="light"] body.solid-nav nav .links a{color:var(--text-dim)}
:root[data-theme="light"] nav.scrolled .links a:hover,
:root[data-theme="light"] body.solid-nav nav .links a:hover{color:var(--text)}
:root[data-theme="light"] nav.scrolled .links a.active,
:root[data-theme="light"] body.solid-nav nav .links a.active{color:var(--gold-ink)}
:root[data-theme="light"] nav.scrolled .lang,
:root[data-theme="light"] body.solid-nav nav .lang{border-color:var(--hair)}
:root[data-theme="light"] nav.scrolled .lang button,
:root[data-theme="light"] body.solid-nav nav .lang button{color:var(--text-mute)}
:root[data-theme="light"] nav.scrolled .lang button.on,
:root[data-theme="light"] body.solid-nav nav .lang button.on{color:#fff}
:root[data-theme="light"] nav.scrolled .themetoggle,
:root[data-theme="light"] body.solid-nav nav .themetoggle{border-color:var(--hair);color:var(--text-dim)}
:root[data-theme="light"] nav.scrolled .navtoggle,
:root[data-theme="light"] body.solid-nav nav .navtoggle{color:var(--text)}

/* Hero (home) — photo + dark overlay + white text in BOTH themes */
.hero{position:relative;height:100vh;min-height:640px;display:flex;align-items:flex-end;overflow:hidden}
.hero .bg{position:absolute;inset:0;background:#000 center/cover no-repeat;background-image:url('/img/hero.jpg');animation:slowzoom 22s ease-out forwards}
@keyframes slowzoom{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,11,.5) 0%,rgba(8,10,11,.1) 30%,rgba(8,10,11,.5) 62%,rgba(8,10,11,.96) 100%)}
.hero .wrap{position:relative;z-index:2;padding-bottom:72px;width:100%}
.hero h1{font-size:clamp(50px,9vw,116px);color:#fff;font-weight:400;letter-spacing:-.02em;text-shadow:0 2px 40px rgba(0,0,0,.5);margin-top:20px}
.hero h1 .it{color:var(--gold-hi)}
.hero .sub{font-family:var(--display);font-style:italic;font-size:clamp(19px,2.4vw,26px);color:#eef2ef;max-width:42ch;margin-top:16px;text-shadow:0 1px 18px rgba(0,0,0,.6)}
.hero .cta{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}
.hero .scroll{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;font-family:var(--sans);font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.75);display:flex;flex-direction:column;align-items:center;gap:8px}
.hero .scroll::after{content:"";width:1px;height:36px;background:linear-gradient(var(--gold),transparent)}

/* Page header (sub-pages) — photo + dark overlay + white text in BOTH themes */
.pagehead{position:relative;min-height:56vh;display:flex;align-items:flex-end;overflow:hidden;padding:130px 0 56px}
.pagehead .bg{position:absolute;inset:0;background:#000 center/cover no-repeat}
.pagehead .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,11,.62) 0%,rgba(8,10,11,.25) 45%,rgba(8,10,11,.92) 100%)}
.pagehead .wrap{position:relative;z-index:2;width:100%}
.pagehead h1{font-size:clamp(40px,7.5vw,86px);color:#fff;font-weight:400;margin-top:16px;text-shadow:0 2px 30px rgba(0,0,0,.5)}
.pagehead h1 .it{color:var(--gold-hi)}
.pagehead .lead{font-family:var(--display);font-style:italic;font-size:clamp(18px,2.3vw,24px);color:#e7ece9;max-width:46ch;margin-top:14px;text-shadow:0 1px 16px rgba(0,0,0,.55)}

/* Sections */
section{padding:110px 0}
section.tight{padding:78px 0}
.dark{background:var(--page)}
.deep{background:var(--deep-grad)}
.light{background:var(--section);color:var(--on-light)}
.light .eyebrow{color:var(--teal-deep)}
.light .eyebrow::before{background:var(--gold-lo)}
.sec-head{max-width:60ch}
.sec-head h2{font-size:clamp(34px,5.6vw,58px);margin-top:18px;color:var(--text)}
.light .sec-head h2{color:var(--on-light)}
.sec-head .lead{margin-top:16px;font-size:20px;color:var(--text-dim);max-width:56ch}
.light .sec-head .lead{color:var(--on-light-dim)}
.center{text-align:center;margin:0 auto}
.center .eyebrow{justify-content:center}
.sec-foot{margin-top:48px;text-align:center}

/* Invitation */
.invite{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.invite .big{font-family:var(--display);font-size:clamp(26px,3.6vw,40px);line-height:1.24;color:var(--text);font-weight:400}
.invite .big .it{color:var(--gold-hi)}
.invite p{color:var(--text-dim);margin-top:18px;max-width:52ch}
.invite .fig{border-radius:14px;overflow:hidden;aspect-ratio:4/5}
.invite .fig img{width:100%;height:100%;object-fit:cover}

/* Experiences (cards are over images -> keep white text) */
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:52px}
.exp{position:relative;border-radius:15px;overflow:hidden;aspect-ratio:3/4;display:flex;align-items:flex-end;isolation:isolate}
.exp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .7s}
.exp::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,10,11,.15) 0%,transparent 32%,rgba(8,10,11,.9) 100%)}
.exp:hover img{transform:scale(1.05)}
.exp .b{padding:26px 24px}
.exp .es{font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi)}
.exp .b h3{font-size:28px;color:#fff;margin:4px 0 6px}
.exp .b p{font-size:15px;color:#d7e0df;line-height:1.5}

/* Aboard */
.aboard{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center}
.aboard .fig{border-radius:14px;overflow:hidden;aspect-ratio:4/5}
.aboard .fig img{width:100%;height:100%;object-fit:cover}
.dur{display:flex;gap:12px;margin:26px 0}
.dur .d{font-family:var(--display);font-size:30px;color:var(--text);border:1px solid var(--hair);border-radius:11px;padding:14px 26px;text-align:center;line-height:1}
.dur .d small{font-family:var(--sans);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);display:block;margin-top:6px}
.amen{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;margin-top:8px}
.amen li{position:relative;padding-left:24px;font-size:16.5px;color:var(--text)}
.amen li::before{content:"";position:absolute;left:0;top:11px;width:9px;height:9px;border:1px solid var(--gold-lo);border-radius:50%}
.addons{margin-top:26px;padding-top:22px;border-top:1px solid var(--hair)}
.addons .lbl{font-family:var(--sans);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mute);margin-bottom:12px}
.addons .chips{display:flex;flex-wrap:wrap;gap:9px}
.chip{font-family:var(--sans);font-size:13px;color:var(--text);border:1px solid var(--hair);border-radius:30px;padding:8px 15px}

/* Club */
.club-intro{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:14px}
.club-intro .lead{color:var(--text-dim);font-size:19px}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.tier{border:1px solid var(--hair);border-radius:16px;padding:30px 26px;background:var(--card-grad);display:flex;flex-direction:column}
.tier.feat{border-color:rgba(26,166,168,.5);background:var(--card-feat);position:relative}
.tbadge{position:absolute;top:-11px;left:26px;font-family:var(--sans);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#fff;background:var(--gold);padding:4px 12px;border-radius:20px}
.tier .nm{font-family:var(--sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink)}
.tier .price{font-family:var(--sans);font-weight:600;letter-spacing:-.02em;font-variant-numeric:lining-nums tabular-nums;font-size:40px;color:var(--text);margin:12px 0 2px;line-height:1}
.tier .price small{font-family:var(--sans);font-size:13px;letter-spacing:.04em;color:var(--text-mute)}
.tier .out{font-family:var(--display);font-style:italic;font-size:19px;color:var(--gold-ink);margin-bottom:18px}
.tier ul{list-style:none;display:flex;flex-direction:column;gap:11px;flex:1}
.tier li{position:relative;padding-left:22px;font-size:15.5px;color:var(--text-dim);line-height:1.4}
.tier li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:7px;background:var(--teal);border-radius:50%}
.tier .btn{margin-top:24px;justify-content:center}
.club-foot{text-align:center;margin-top:34px;font-family:var(--display);font-style:italic;font-size:22px;color:var(--gold-ink)}

/* Gallery */
.gallery{columns:4;column-gap:14px}
.gallery figure{break-inside:avoid;margin-bottom:14px;border-radius:11px;overflow:hidden}
.gallery img{width:100%;transition:transform .6s,filter .4s;filter:saturate(.96)}
.gallery figure:hover img{transform:scale(1.05);filter:saturate(1.05)}
.gallery.three{columns:3}

/* CTA band — over image -> white text in both themes */
.ctaband{position:relative;overflow:hidden}
.ctaband .bg{position:absolute;inset:0;background:#000 center/cover no-repeat}
.ctaband .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,11,.82),rgba(8,10,11,.92))}
.ctaband .wrap{position:relative;z-index:2}
.ctaband .box{max-width:640px;margin:0 auto;text-align:center}
.ctaband h2{color:#fff}
.ctaband .lead{color:rgba(238,242,241,.82);margin:16px auto 32px}
.ctaband .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* Reservation form */
.rwrap{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start}
.rform{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.rform .full{grid-column:1/-1}
.rform label{display:block;font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute);margin-bottom:9px}
.rform label .req{color:var(--gold)}
.rform input,.rform select,.rform textarea{width:100%;background:var(--field-bg);border:1px solid var(--hair);border-radius:9px;padding:13px 14px;color:var(--text);font-family:var(--serif);font-size:16px;color-scheme:var(--cs);transition:border-color .2s}
.rform input::placeholder,.rform textarea::placeholder{color:var(--text-mute)}
.rform input:focus,.rform select:focus,.rform textarea:focus{outline:none;border-color:var(--gold)}
.rform select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%230f807e' d='M6 8 0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;padding-right:38px}
.rform textarea{min-height:104px;resize:vertical;line-height:1.5}
.rform .submit{grid-column:1/-1;margin-top:6px}
.rform .submit .btn{width:100%;justify-content:center;font-size:13px;padding:16px}
.rform .note{grid-column:1/-1;font-family:var(--sans);font-size:12px;color:var(--text-mute);letter-spacing:.02em;text-align:center}
.rmsg{grid-column:1/-1;border:1px solid rgba(26,166,168,.4);background:rgba(26,166,168,.1);border-radius:11px;padding:18px 20px;color:var(--gold-ink);font-size:16px;display:none}
.rmsg.show{display:block}
.rside{border:1px solid var(--hair);border-radius:16px;overflow:hidden;background:var(--card-grad)}
.rside .pic{aspect-ratio:4/3;background:#000 center/cover no-repeat}
.rside .body{padding:26px 24px}
.rside h3{font-size:24px;color:var(--text);margin-bottom:6px}
.rside p{color:var(--text-dim);font-size:16px;margin-bottom:20px}
.rside .row{display:flex;align-items:center;gap:13px;padding:13px 0;border-top:1px solid var(--hair-2)}
.rside .row .ic{width:36px;height:36px;border-radius:9px;background:rgba(26,166,168,.14);display:flex;align-items:center;justify-content:center;flex:none}
.rside .row .ic svg{width:18px;height:18px;fill:var(--gold-ink)}
.rside .row>span:last-child{display:flex;flex-direction:column;gap:2px}
.rside .row .k{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute)}
.rside .row .v{display:block;color:var(--text);font-size:16px}
.rside .row a.v:hover{color:var(--gold-ink)}

/* Footer — kept dark in both themes as a grounding anchor */
footer{background:#060809;padding:60px 0 34px;border-top:1px solid rgba(255,255,255,.09)}
footer .top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;align-items:flex-start}
footer .logo{width:180px;content:url(/img/logo-dark.png);margin-bottom:16px}
footer .tag{font-family:var(--display);font-style:italic;color:var(--gold-hi);font-size:19px}
footer .cols{display:flex;gap:60px;flex-wrap:wrap}
footer .col h4{font-family:var(--sans);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#7d8f8e;margin-bottom:14px}
footer .col a,footer .col p{display:block;font-size:15px;color:#aebcba;margin-bottom:9px}
footer .col a:hover{color:var(--gold-hi)}
footer .base{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--sans);font-size:11.5px;letter-spacing:.04em;color:#7d8f8e}

/* WhatsApp float */
.wafloat{position:fixed;bottom:22px;right:22px;z-index:70;width:56px;height:56px;border-radius:50%;background:linear-gradient(180deg,#1aa6a8,#0f807e);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,0,0,.4);transition:.25s}
.wafloat:hover{transform:scale(1.07)}
.wafloat svg{width:28px;height:28px;fill:#fff}

/* reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.hero .bg{animation:none}}

@media(max-width:940px){
  .invite,.aboard,.club-intro,.rwrap{grid-template-columns:1fr;gap:34px}
  .exp-grid,.tiers,.rform{grid-template-columns:1fr}
  .gallery,.gallery.three{columns:2}
  nav .links{display:none}
  .navtoggle{display:block}
  /* Mobile top bar declutters to: bigger logo · smaller Reserve · hamburger.
     Language + theme move into the hamburger menu (see .menuextra). */
  nav{padding:14px 0}
  nav.scrolled,body.solid-nav nav{padding:10px 0}
  nav .wrap>a{flex:0 0 auto}
  nav .logo{width:178px}
  nav .right{gap:12px}
  nav .right>.lang,nav .right>.themetoggle{display:none}
  nav .right .btn.gold{padding:9px 15px;font-size:11px;letter-spacing:.1em}
  nav.open .links{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--menu-bg);backdrop-filter:blur(14px);padding:20px 32px 24px;gap:18px;border-bottom:1px solid var(--hair)}
  :root[data-theme="light"] nav.open .links a{color:var(--text-dim)}
  :root[data-theme="light"] nav.open .links a:hover{color:var(--text)}
  :root[data-theme="light"] nav.open .links a.active{color:var(--gold-ink)}
  nav.open .links .menuextra{display:flex;align-items:center;gap:18px;margin-top:6px;padding-top:18px;border-top:1px solid var(--hair);width:100%}
  .aboard .fig,.invite .fig{aspect-ratio:4/3}
  .rside{order:-1}
}
@media(max-width:560px){
  .hero h1{font-size:clamp(38px,11vw,58px)}
  .hero .cta,.ctaband .cta{width:100%}
  .hero .cta .btn,.ctaband .cta .btn{flex:1 1 auto;justify-content:center}
}

/* ===== Membership band — on every page (Daniela 2026-10-08: "should be prioritized focus").
   Fixed deep-teal colours so it reads the same in light + dark themes. ===== */
.memberband{background:radial-gradient(120% 140% at 85% 0%,#14595a 0%,#0b2f30 55%,#081f20 100%);color:#f3efe6;padding:96px 0}
.memberband .mb-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:64px;align-items:center}
.memberband .mb-fig{border-radius:16px;overflow:hidden;aspect-ratio:4/5;box-shadow:0 30px 70px rgba(0,0,0,.35)}
.memberband .mb-fig img{width:100%;height:100%;object-fit:cover}
.memberband .eyebrow{color:#7fe3e3}
.memberband .eyebrow::before{background:#7fe3e3}
.memberband h2{font-size:clamp(34px,5vw,58px);color:#fff;margin:18px 0 16px;line-height:1.05}
.memberband h2 .it{color:#7fe3e3}
.memberband p{color:rgba(243,239,230,.86);font-size:18px;line-height:1.6;max-width:52ch}
.memberband .mb-pts{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.memberband .mb-pts li{font-family:var(--sans);font-size:12.5px;letter-spacing:.06em;color:#fff;border:1px solid rgba(255,255,255,.28);border-radius:30px;padding:8px 15px}
.memberband .mb-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
@media(max-width:940px){.memberband{padding:72px 0}.memberband .mb-grid{grid-template-columns:1fr;gap:34px}.memberband .mb-fig{aspect-ratio:4/3}}
@media(max-width:560px){.memberband .mb-cta .btn{flex:1 1 auto;justify-content:center}}
/* nav "Become a Member" — outline next to Reserve (desktop); on mobile the menu's "Membership" link carries it */
.btn.member{border-color:rgba(255,255,255,.55);color:#fff}
.btn.member:hover{border-color:var(--gold-hi);color:var(--gold-hi)}
nav.scrolled .btn.member,body.solid-nav nav .btn.member{border-color:var(--gold);color:var(--gold-ink)}
@media(max-width:1100px){nav .right .btn.member{display:none}}
a.chip{transition:.2s}
a.chip:hover{border-color:var(--gold);color:var(--gold-ink)}

/* ===== /extras — add-on services with photos & details ===== */
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.svc{display:flex;flex-direction:column;border:1px solid var(--hair);border-radius:16px;overflow:hidden;background:var(--card,transparent);scroll-margin-top:110px;min-width:0}
.svc .ph{aspect-ratio:4/3;overflow:hidden}
.svc .ph img{width:100%;height:100%;object-fit:cover;display:block}
.svc .tx{padding:24px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.svc .tx h3{font-size:28px;color:var(--text);line-height:1.1}
.svc .tx .pr{font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink)}
.svc .tx p{color:var(--text-dim);font-size:16px;line-height:1.6}
.svc .tx ul{margin:2px 0 0 18px;color:var(--text-dim);font-size:15px;line-height:1.7}
.svc .tx .go{margin-top:auto;padding-top:12px;display:flex;flex-wrap:wrap;gap:10px}
@media(max-width:1000px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.svc-grid{grid-template-columns:1fr}}

/* ===== Membership "pop" (Daniela 2026-10-08) — BRAND colours only (turquoise + cream), no gold (Luis 2026-10-08) ===== */
:root{--mb-cream:#f6f2e8;--mb-teal:#1aa6a8;--mb-teal-lt:#7fe3e3}
/* nav: cream button so it stands apart from the turquoise "Reserve" */
.btn.member{background:var(--mb-cream);border-color:var(--mb-cream);color:#0c6f6c;box-shadow:0 6px 22px rgba(0,0,0,.18)}
.btn.member:hover{background:#fff;border-color:#fff;color:#0c6f6c;transform:translateY(-1px)}
nav.scrolled .btn.member,body.solid-nav nav .btn.member{background:transparent;border-color:var(--gold);color:var(--gold-ink);box-shadow:none}
/* band */
.memberband{border-top:1px solid rgba(127,227,227,.35);border-bottom:1px solid rgba(127,227,227,.35)}
.memberband .mb-fig{outline:1px solid rgba(127,227,227,.45);outline-offset:10px}
.mb-badge{display:inline-block;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#0c6f6c;background:var(--mb-cream);border-radius:30px;padding:7px 14px;margin-bottom:18px;animation:mbpulse 2.6s ease-in-out infinite}
@keyframes mbpulse{0%,100%{box-shadow:0 0 0 0 rgba(127,227,227,.55)}50%{box-shadow:0 0 0 10px rgba(127,227,227,0)}}
/* floating member pill, bottom-left on every page — turquoise like the brand arc */
.memberfloat{position:fixed;left:20px;bottom:22px;z-index:55;display:flex;align-items:center;gap:10px;padding:9px 9px 9px 16px;border-radius:40px;background:linear-gradient(180deg,#1aa6a8,#0f807e);box-shadow:0 12px 30px rgba(0,0,0,.28);transition:transform .2s}
.memberfloat:hover{transform:translateY(-2px)}
.memberfloat .star{display:none}
.memberfloat .t1{font-family:'Cormorant Garamond',serif;font-size:17px;color:#fff;white-space:nowrap}
.memberfloat .t2{font-family:var(--sans);font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#0c6f6c;background:var(--mb-cream);border-radius:20px;padding:6px 11px;white-space:nowrap}
@media(max-width:640px){.memberfloat{left:12px;bottom:16px;padding:6px}.memberfloat .t1{display:none}}
@media(prefers-reduced-motion:reduce){.mb-badge{animation:none}}

/* bright page heroes (Luis 2026-10-08): lighter overlay, dark only behind the left-aligned text */
.pagehead.bright .bg::after{background:linear-gradient(90deg,rgba(6,20,21,.62) 0%,rgba(6,20,21,.32) 45%,rgba(6,20,21,.05) 75%),linear-gradient(180deg,rgba(6,20,21,.35) 0%,transparent 30%)}
.pagehead.bright .bg::after{background:radial-gradient(70% 90% at 18% 75%,rgba(6,20,21,.66) 0%,rgba(6,20,21,.35) 55%,transparent 80%),linear-gradient(180deg,rgba(6,20,21,.35) 0%,transparent 28%)}
.pagehead.bright .eyebrow{color:#fff}
.pagehead.bright .eyebrow::before{background:#fff}
.pagehead.bright h1 .it{color:#bff3f3}
.pagehead.bright h1,.pagehead.bright .lead,.pagehead.bright .eyebrow{text-shadow:0 2px 24px rgba(0,0,0,.55)}

/* membership announcement bar on every page (Luis 2026-10-08) */
.v2-bar{position:fixed;top:0;left:0;right:0;z-index:70;height:34px;display:flex;align-items:center;justify-content:center;background:#0f807e;font-family:var(--sans);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;padding:0 12px;text-align:center}
.v2-bar a{color:#fff}
.v2-bar a:hover{text-decoration:underline}
body.has-bar nav{top:34px}
@media(max-width:940px){.v2-bar{font-size:9.5px;letter-spacing:.08em}}
body.has-bar .listing{padding-top:152px}
body.has-bar .card{top:130px}
body.has-bar .svc{scroll-margin-top:144px}

body.has-bar .pagehead{padding-top:176px}

/* request-form labels: solid text colour (black in light theme, white in dark) — Luis 2026-10-08 */
.rform label{color:var(--text);font-size:11.5px;font-weight:500}
.rform label.addon{display:flex;text-transform:none;letter-spacing:0;font-size:14.5px;font-weight:400;margin:0;color:var(--text)}
.rform label.addon input{margin-right:2px}
/* footer social links */
footer .social{display:flex;gap:10px;margin-top:14px}
footer .social a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.22);display:inline-flex;align-items:center;justify-content:center;color:#fff;transition:.2s}
footer .social a:hover{border-color:var(--gold-hi);color:var(--gold-hi)}
footer .social svg{width:18px;height:18px}
footer .col .social a{display:inline-flex;margin:0;font-size:0}
/* language + theme toggles sit at the far right corner of the nav, after the buttons (Luis 2026-10-08) */
nav .right>.btn{order:1}
nav .right>.lang{order:3}
nav .right>.themetoggle{order:4}
nav .right>.navtoggle{order:5}
