/* Diamonds Mapenzi Beach — "Tropic Luxe"
   Light & airy: cream + espresso + deep teal-green + olive, gold sparingly.
   Quiet luxury, generous air · Cormorant Garamond + Inter */
:root{
  --bg:#f6f1e7;            /* warm cream */
  --bg2:#efe7d8;          /* deeper sand band */
  --paper:#fffdf8;        /* card paper */
  --teal:#0a3d3f;         /* deep teal-green (primary ink/headlines) */
  --teal2:#1a6e6e;        /* lighter teal */
  --olive:#5c6b4a;        /* olive accent */
  --gold:#c9a24b; --gold-deep:#a9853a; --gold-lt:#d9b96e;
  --ink:#27302c;          /* body text (espresso-green) */
  --soft:#56615a;         /* secondary text */
  --muted:#8a8a7d;        /* faint labels */
  --line:rgba(10,61,63,.12);
  --line2:rgba(10,61,63,.20);
  --wa:#1eaa55; --wa-dark:#178c46;
  --radius:18px;
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Inter",system-ui,sans-serif;
  --shadow:0 24px 60px rgba(31,46,38,.12);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.65;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.06;color:var(--teal)}
h2{font-size:clamp(2.1rem,5vw,3.5rem);letter-spacing:-.005em}
::selection{background:var(--gold);color:#241a06}
.wrap{max-width:1240px;margin:0 auto;padding:0 1.6rem}
.kicker{font:600 .7rem var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:1.1rem;display:inline-flex;align-items:center;gap:.6rem}
.kicker::before{content:"";width:26px;height:1px;background:var(--gold);display:inline-block}
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;font:600 .68rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:.45rem 1rem;background:rgba(10,61,63,.32);backdrop-filter:blur(6px)}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold-lt);box-shadow:0 0 8px var(--gold-lt)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font:600 .9rem var(--sans);padding:.85rem 1.7rem;border-radius:999px;transition:transform .15s,background .2s,box-shadow .2s,color .2s,border-color .2s;white-space:nowrap;cursor:pointer;border:0;letter-spacing:.01em}
.btn:active{transform:scale(.97)}
.btn--gold{background:var(--teal);color:#f6f1e7;box-shadow:0 10px 26px rgba(10,61,63,.22)}
.btn--gold:hover{background:#0c4a4c;box-shadow:0 12px 32px rgba(10,61,63,.3)}
.btn--glass{background:transparent;color:var(--teal);border:1px solid var(--line2)}
.btn--glass:hover{border-color:var(--gold);color:var(--gold-deep)}
.btn--wa{background:var(--wa);color:#fff}.btn--wa:hover{background:var(--wa-dark)}
.btn--ghost{background:transparent;border:1px solid var(--line2);color:var(--teal)}.btn--ghost:hover{border-color:var(--gold);color:var(--gold-deep)}
.btn--block{width:100%}.btn--lg{padding:1rem 2.1rem;font-size:1rem}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;transition:background .3s,box-shadow .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(246,241,231,.86);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 6px 24px rgba(31,46,38,.06)}
.nav__in{max-width:1240px;margin:0 auto;padding:1.05rem 1.6rem;display:flex;align-items:center;gap:1.5rem}
.brand{display:flex;align-items:center}
.brand__logo{height:46px;width:auto}
.nav.scrolled .brand__logo{height:40px;transition:height .3s}
.nav__links{display:flex;gap:1.8rem;margin-left:auto;font:500 .9rem var(--sans)}
.nav__links a{color:var(--teal);opacity:.82;transition:opacity .2s,color .2s;position:relative}
.nav__links a:hover{opacity:1;color:var(--gold-deep)}
.nav:not(.scrolled) .nav__links a{color:#fff;opacity:.92;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.nav__act{display:flex;align-items:center;gap:.8rem}
.lang{display:flex;border:1px solid var(--line2);border-radius:999px;overflow:hidden;background:rgba(255,255,255,.5)}
.nav:not(.scrolled) .lang{border-color:rgba(255,255,255,.5);background:rgba(10,61,63,.25)}
.lang__btn{border:0;background:transparent;font:600 .72rem var(--sans);padding:.42rem .62rem;cursor:pointer;color:var(--soft)}
.nav:not(.scrolled) .lang__btn{color:#fff}
.lang__btn.is-active{background:var(--gold);color:#241a06}
.navtog{display:none;background:none;border:0;cursor:pointer;padding:.4rem}
.navtog span{display:block;width:22px;height:2px;background:var(--teal);margin:4.5px 0;border-radius:2px;transition:background .3s}
.nav:not(.scrolled) .navtog span{background:#fff}

/* hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;overflow:hidden}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg img{width:100%;height:100%;object-fit:cover;animation:kb 34s ease-out infinite alternate}
@keyframes kb{from{transform:scale(1.05)}to{transform:scale(1.14) translateY(-2%)}}
.hero__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(10,61,63,.34) 0%,rgba(10,61,63,.08) 30%,rgba(10,61,63,.18) 62%,rgba(246,241,231,.55) 92%,var(--bg) 100%),
  radial-gradient(120% 80% at 20% 85%,rgba(10,61,63,.4),transparent 55%)}
.hero__in{position:relative;z-index:2;width:100%;max-width:1240px;margin:0 auto;padding:0 1.6rem 4.5rem;display:grid;grid-template-columns:1.18fr .82fr;gap:3rem;align-items:end}
.hero__copy{max-width:40rem}
.hero__title{font-size:clamp(2.9rem,7.6vw,5.8rem);letter-spacing:-.01em;margin:1.3rem 0 0;color:#fff;text-shadow:0 2px 26px rgba(10,30,30,.4)}
.hero__title em{font-style:italic;color:var(--gold-lt)}
.hero__sub{margin-top:1.5rem;max-width:35rem;color:#f3eee2;font-size:1.08rem;text-shadow:0 1px 12px rgba(10,30,30,.4)}
.hero__scroll{position:absolute;left:50%;bottom:1.4rem;transform:translateX(-50%);z-index:2;color:rgba(255,255,255,.85);font:600 .66rem var(--sans);letter-spacing:.26em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:.4rem}
.hero__scroll::after{content:"";width:1px;height:30px;background:linear-gradient(var(--gold-lt),transparent);animation:sd 1.8s ease-in-out infinite}
@keyframes sd{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}

/* rate calc */
.rcalc{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.5rem;box-shadow:var(--shadow);max-height:80vh;overflow:auto}
.rcalc__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.1rem}
.rcalc__title{font:500 1.55rem var(--serif);color:var(--teal)}
.rcalc__ai{font:600 .6rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);border:1px solid var(--line2);border-radius:999px;padding:.28rem .65rem}
.rcalc label{display:block;font:600 .66rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:.7rem}
.rcalc label span{display:block;margin-bottom:.35rem}
.rcalc select,.rcalc input[type=number]{width:100%;padding:.66rem .72rem;border:1px solid var(--line2);border-radius:11px;font:500 .9rem var(--sans);color:var(--ink);background:#fffefb}
.rcalc select:focus,.rcalc input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
.rcalc__grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.rcalc__chk{display:flex!important;align-items:center;gap:.55rem;font:500 .84rem var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--soft)!important;cursor:pointer;margin-bottom:.5rem}
.rcalc__chk input{width:auto;accent-color:var(--teal)}.rcalc__chk span{margin:0!important}
.rcalc__total{display:flex;align-items:baseline;justify-content:space-between;border-top:1px solid var(--line);margin:.5rem 0 .95rem;padding-top:.85rem}
.rcalc__total span{font:600 .68rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.rcalc__total strong{font:500 2.1rem var(--serif);color:var(--teal)}
.rcalc__note{font-size:.67rem;color:var(--muted);text-align:center;margin-top:.75rem;line-height:1.45}

/* marquee */
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:.95rem 0;background:var(--teal)}
.marquee__t{display:flex;white-space:nowrap;font:500 1.4rem var(--serif);color:#eee5cf;animation:mq 42s linear infinite;gap:0}
.marquee__t span{padding:0 1.5rem}.marquee__t i{color:var(--gold-lt);font-style:normal}
@keyframes mq{to{transform:translateX(-50%)}}

/* sections */
.sec{padding:clamp(4rem,9vw,7rem) 0}
.sec__head{max-width:50rem;margin:0 auto 3.2rem;text-align:center}
.sec__head p.lead{color:var(--soft);margin-top:1rem;font-size:1.06rem}

/* intro stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;margin-top:3rem;border-top:1px solid var(--line);padding-top:2.6rem}
.stat strong{display:block;font:500 2.9rem var(--serif);color:var(--teal);line-height:1}
.stat strong small{font:500 1.05rem var(--serif);color:var(--gold-deep)}
.stat span{font:500 .82rem var(--sans);color:var(--soft);margin-top:.5rem;display:block}

/* room showcase (alternating editorial) */
.show{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:1.6rem;background:var(--paper);box-shadow:0 16px 44px rgba(31,46,38,.07)}
.show:nth-child(odd of .show){direction:rtl}.show:nth-child(odd of .show)>*{direction:ltr}
.show__media{position:relative;min-height:360px;overflow:hidden}
.show__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s ease}
.show:hover .show__media img{transform:scale(1.05)}
.show__body{padding:clamp(1.9rem,4vw,3.2rem);display:flex;flex-direction:column;justify-content:center}
.show__tag{font:600 .66rem var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:.8rem}
.show__body h3{font-size:clamp(1.9rem,3.6vw,2.7rem);margin-bottom:.8rem}
.show__body p{color:var(--soft);font-size:.99rem}
.show__foot{display:flex;align-items:center;justify-content:space-between;margin-top:1.7rem;gap:1rem;flex-wrap:wrap}
.show__price{font:500 1.75rem var(--serif);color:var(--teal)}.show__price small{font:500 .7rem var(--sans);color:var(--muted)}

/* dining */
.dining{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dining__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.dining__media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);position:relative}
.dining__media::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);border-radius:var(--radius)}
.dining__media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;transition:transform .9s ease}
.dining__media:hover img{transform:scale(1.04)}
.dining__copy h2{margin:.4rem 0 1rem}
.dining__copy .lead{color:var(--soft);font-size:1.04rem}
.dining__list{list-style:none;margin-top:1.8rem;display:flex;flex-direction:column;gap:.2rem}
.dining__list li{display:flex;flex-direction:column;gap:.15rem;padding:1rem 0;border-top:1px solid var(--line)}
.dining__list strong{font:500 1.35rem var(--serif);color:var(--teal)}
.dining__list span{color:var(--soft);font-size:.92rem}

/* gallery */
.gal{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:210px;gap:1rem}
.gal figure{border-radius:14px;overflow:hidden;position:relative;background:var(--bg2)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.gal figure:hover img{transform:scale(1.07)}
.gal .tall{grid-row:span 2}.gal .wide{grid-column:span 2}

/* spa + location (shared loc layout) */
.spa{background:var(--bg)}
.loc{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,3.2rem);align-items:center}
.loc--rev .loc__media{order:2}
.loc__media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.loc__media img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}
.loc__body h2{margin-bottom:1rem}.loc__body p{color:var(--soft);margin-bottom:1.6rem;max-width:32rem}
.loc__cta{display:flex;gap:.8rem;flex-wrap:wrap}
.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:1.8rem}
.chip{font:600 .72rem var(--sans);letter-spacing:.04em;color:var(--olive);background:rgba(92,107,74,.1);border:1px solid rgba(92,107,74,.22);border-radius:999px;padding:.45rem .9rem}

/* reviews */
.revs{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
.rev{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.9rem;box-shadow:0 14px 40px rgba(31,46,38,.06)}
.rev__stars{color:var(--gold);letter-spacing:.15em;margin-bottom:.9rem;font-size:.95rem}
.rev blockquote{font:500 1.22rem var(--serif);font-style:italic;color:var(--teal);line-height:1.42}
.rev figcaption{margin-top:1.2rem;font:600 .8rem var(--sans);color:var(--muted)}
.ratepill{display:inline-flex;align-items:center;gap:.6rem;background:var(--paper);border:1px solid var(--line2);border-radius:999px;padding:.5rem 1.1rem;margin-bottom:1rem}
.ratepill strong{color:var(--teal);font:500 1.15rem var(--serif)}.ratepill span{font:500 .82rem var(--sans);color:var(--soft)}

/* journey timeline */
.journey{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.jline{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;position:relative}
.jline::before{content:"";position:absolute;top:34px;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,var(--line2) 12%,var(--line2) 88%,transparent);z-index:0}
.jstep{position:relative;z-index:1;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem 1.5rem;transition:transform .25s,border-color .25s,box-shadow .25s}
.jstep:hover{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 20px 44px rgba(31,46,38,.1)}
.jstep__no{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;font:500 1.3rem var(--serif);color:var(--teal);background:var(--bg);border:1px solid var(--gold);margin-bottom:1.05rem}
.jstep h3{font-size:1.35rem;margin-bottom:.45rem}
.jstep p{color:var(--soft);font-size:.9rem}

/* faq */
.faq{background:var(--bg)}
.faq__in{max-width:900px;margin:0 auto}
.faqs{display:flex;flex-direction:column;gap:.8rem}
.faqi{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:border-color .25s,box-shadow .25s}
.faqi[open]{border-color:var(--gold);box-shadow:0 12px 32px rgba(31,46,38,.08)}
.faqi summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;list-style:none;padding:1.2rem 1.5rem;font:500 1.22rem var(--serif);color:var(--teal)}
.faqi summary::-webkit-details-marker{display:none}
.faqi summary i{position:relative;flex:none;width:16px;height:16px}
.faqi summary i::before,.faqi summary i::after{content:"";position:absolute;background:var(--gold-deep);border-radius:2px;transition:transform .25s,opacity .25s}
.faqi summary i::before{top:7px;left:0;width:16px;height:2px}
.faqi summary i::after{top:0;left:7px;width:2px;height:16px}
.faqi[open] summary i::after{transform:scaleY(0);opacity:0}
.faqi>p{padding:0 1.5rem 1.3rem;color:var(--soft);font-size:.95rem;line-height:1.65;max-width:62ch}

/* cta band */
.cta{position:relative;text-align:center;padding:clamp(4.5rem,9vw,7rem) 1.5rem;background:
  linear-gradient(135deg,rgba(10,61,63,.96),rgba(26,110,110,.92)),var(--teal);overflow:hidden}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 80% 20%,rgba(201,162,75,.22),transparent 60%);pointer-events:none}
.cta h2{color:#fff;position:relative}.cta p{color:#e7e0d2;margin:.8rem auto 1.9rem;position:relative;max-width:38rem}
.cta .btn{position:relative}
.cta .btn--gold{background:var(--gold);color:#241a06}.cta .btn--gold:hover{background:var(--gold-lt)}

/* footer */
.footer{background:#08322f;color:#bcd0cc;font-size:.9rem}
.footer__in{max-width:1240px;margin:0 auto;padding:3.4rem 1.6rem 2rem;display:grid;grid-template-columns:1.6fr 1.1fr 1fr;gap:2rem}
.footer__logo{height:46px;width:auto;filter:brightness(0) invert(1);opacity:.92;margin-bottom:1.1rem}
.footer p{max-width:30rem;line-height:1.6}
.footer h4{color:#fff;font:600 .76rem var(--sans);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.85rem}
.footer a:hover{color:var(--gold-lt)}
.footer__legal{border-top:1px solid rgba(255,255,255,.12);max-width:1240px;margin:0 auto;padding:1.3rem 1.6rem 1.7rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.76rem;color:#7fa19b}
.footer__demo{font-style:italic}

/* wa fab */
.fab{position:fixed;right:1.2rem;bottom:1.2rem;z-index:60;width:56px;height:56px;border-radius:50%;background:var(--wa);color:#fff;display:none;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(8,50,47,.35)}

/* wow */
.prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:70;background:linear-gradient(90deg,var(--gold),var(--gold-deep));transition:width .1s linear}
.rev-in{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.rev-in.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}
.hero__title em{background:linear-gradient(100deg,var(--gold-lt) 20%,#fffaf0 50%,var(--gold-lt) 80%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:sh 6.5s linear infinite}
@keyframes sh{to{background-position:-220% 0}}
.stats.in .stat strong{animation:pop .7s ease}@keyframes pop{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
/* light-sweep across hero overlay (Tropic Luxe extra) */
.hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,247,224,.1) 48%,rgba(255,247,224,.18) 50%,rgba(255,247,224,.1) 52%,transparent 65%);
  background-size:280% 100%;animation:sweep 9s ease-in-out infinite}
@keyframes sweep{0%{background-position:140% 0}55%,100%{background-position:-60% 0}}

/* responsive */
@media(max-width:980px){
  .jline{grid-template-columns:1fr 1fr}.jline::before{display:none}
  .hero__in,.loc,.dining__grid{grid-template-columns:1fr;gap:2rem}
  .loc--rev .loc__media{order:0}
  .hero{align-items:center;min-height:auto;padding-top:7rem}
  .hero__in{padding-bottom:3rem}.hero__scroll{display:none}
  .stats{grid-template-columns:1fr 1fr;gap:1.6rem}.revs{grid-template-columns:1fr}
  .show,.show:nth-child(odd of .show){grid-template-columns:1fr;direction:ltr}.show__media{min-height:280px}
  .gal{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.gal .wide{grid-column:span 2}.gal .tall{grid-row:auto}
}
@media(max-width:680px){
  .nav__links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:rgba(246,241,231,.98);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 12px 30px rgba(31,46,38,.1)}
  .nav__links.open{display:flex}.nav__links a{padding:.95rem 1.6rem;border-top:1px solid var(--line);color:var(--teal)!important;opacity:1!important;text-shadow:none!important}
  .navtog{display:block}.nav__act .btn--gold{display:none}
  .fab{display:flex}.gal{grid-template-columns:1fr;grid-auto-rows:200px}.gal .wide{grid-column:auto}
  .jline{grid-template-columns:1fr}
  .footer__in{grid-template-columns:1fr}
  .hero__title{font-size:clamp(2.6rem,11vw,4rem)}
}
@media(prefers-reduced-motion:reduce){
  .hero__bg img{animation:none}.hero__title em{animation:none;-webkit-text-fill-color:var(--gold-deep)}
  .hero::before{animation:none;display:none}
  .rev-in{opacity:1;transform:none;transition:none}.hero__scroll::after{animation:none}.marquee__t{animation:none}
  .stats.in .stat strong{animation:none}
}
.save-data .hero__bg img,.save-data .marquee__t,.save-data .hero::before{animation:none}