:root{--bg:#f6f1f8;--ink:#3a1019;--ink-hero:#4a1622;--accent:#4a1622;--accent-text:#2f7a73;--on-accent:#fff;--accent-shadow:rgba(74,22,34,.45);--line:rgba(74,22,34,.15);--nav-bg:rgba(246,241,248,.85);
--font-display:'Marcellus SC',Georgia,serif;--font-body:'Nunito',system-ui,sans-serif;--teal:#5fa39c;--teal-d:#2f7a73;--lav:#e3d8ee;--lav-d:#c9b6dc;--maroon:#4a1622}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--maroon)}
.brand img{width:48px;height:48px;border-radius:14px;box-shadow:0 8px 20px -10px rgba(74,22,34,.5)}
.brand .t{display:flex;flex-direction:column;line-height:1}
.brand .t b{font:400 22px/1 var(--font-display)}
.brand .t i{font:700 10px/1 var(--font-body);letter-spacing:.3em;font-style:normal;margin-top:4px;color:var(--teal-d);text-transform:uppercase}
.btn.teal{--b:var(--teal);color:#08302c}
/* hero */
.hero{background:radial-gradient(900px 700px at 75% 35%,#ffffff 0%,transparent 60%),radial-gradient(800px 600px at 10% 90%,#d9ecea 0%,transparent 60%),linear-gradient(160deg,#efe6f5,#e3d8ee 60%,#d7e9e6)}
.hero .bub{border-radius:50%;border:2px solid rgba(255,255,255,.9);background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.95),rgba(255,255,255,.15) 40%,rgba(201,182,220,.15) 70%);box-shadow:inset -6px -8px 18px rgba(95,163,156,.25)}
.hero .bb1{width:120px;height:120px;left:6%;top:18%}.hero .bb2{width:60px;height:60px;left:42%;top:12%}.hero .bb3{width:200px;height:200px;right:-50px;bottom:8%}.hero .bb4{width:34px;height:34px;left:30%;bottom:16%}
.hero .giant{font:400 clamp(120px,22vw,340px)/1 var(--font-display);color:rgba(74,22,34,.05);left:-2vw;bottom:-3vw;white-space:nowrap}
.hero-content{max-width:600px;padding:60px 0}
.hero h1{font-size:clamp(46px,7.4vw,98px);color:var(--maroon);margin-bottom:20px}
.hero h1 em{font-style:normal;color:var(--teal-d)}
.hero .lede{margin-bottom:32px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px}
.hero .fallback{position:absolute;right:6vw;top:50%;width:min(36vw,440px);transform:translateY(-50%)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.chip{font-size:13.5px;font-weight:700;padding:8px 14px;border-radius:99px;background:rgba(255,255,255,.75);border:1px solid var(--line);color:var(--maroon)}
@media (max-width:760px){.hero{align-items:flex-end}.hero-content{padding:44vh 0 40px}.hero h1{font-size:clamp(42px,12vw,62px)}.hero .fallback{right:auto;left:50%;top:18vh;width:64vw;transform:translateX(-50%)}}
/* band */
.band{background:var(--maroon);color:#f6e9ee;padding:20px 0;font:400 clamp(20px,3vw,28px)/1 var(--font-display);letter-spacing:.06em}
.band .dot{color:var(--teal)}
/* spa promise */
.promise{background:var(--bg)}
.promise .big{font-size:clamp(36px,6vw,82px);line-height:1.05;max-width:15ch;color:var(--maroon);transform:perspective(1000px) rotateX(calc((1 - var(--p,1))*28deg));transform-origin:50% 100%}
.promise .big span{color:var(--teal-d)}
.p-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:56px}
.pr{background:#fff;border-radius:999px 999px 28px 28px;padding:40px 24px 30px;text-align:center;border:1px solid var(--line);box-shadow:0 30px 60px -40px rgba(74,22,34,.5)}
.pr .ic{width:70px;height:70px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,#9fd3cd,var(--teal));color:#fff;box-shadow:0 12px 24px -10px rgba(47,122,115,.8)}
.pr .ic svg{width:34px;height:34px}
.pr h3{font-size:21px;color:var(--maroon)}
.pr p{font-size:15.5px;margin:0;opacity:.8}
@media (max-width:900px){.p-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.p-grid{grid-template-columns:1fr}}
/* menu */
.menu{background:linear-gradient(180deg,#efe6f5,#dcefec);}
.m-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:50px}
.card{background:rgba(255,255,255,.82);backdrop-filter:blur(8px);border-radius:28px;padding:32px 28px;border:1px solid rgba(255,255,255,.9);box-shadow:0 30px 60px -40px rgba(74,22,34,.55);overflow:hidden}
.card .ic{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;background:var(--maroon);color:#fff;margin-bottom:20px}
.card .ic svg{width:30px;height:30px}
.card h3{font-size:24px;color:var(--maroon);margin-bottom:8px}
.card p{margin:0;opacity:.8;font-size:16px}
.card .tag{display:inline-block;margin-top:14px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-d)}
.card.feature{background:linear-gradient(150deg,#4a1622,#6b2232);color:#fff}
.card.feature h3{color:#fff}.card.feature .ic{background:var(--teal)}.card.feature .tag{color:#9fd3cd}
.card.feature .berry{position:absolute;right:-30px;bottom:-30px;width:150px;opacity:.9}
@media (max-width:900px){.m-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.m-grid{grid-template-columns:1fr}}
/* diy */
.diy{background:var(--maroon);color:#fbeff3}
.diy .eyebrow{color:#9fd3cd}
.diy .cols{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.diy h2{color:#fff}
.tub{position:relative;aspect-ratio:1/1;max-width:440px;margin-inline:auto}
.tub svg{width:100%;height:100%}
.tub .b{position:absolute;border-radius:50%;border:2px solid rgba(255,255,255,.7);background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.7),transparent 60%);animation:rise 6s linear infinite}
@keyframes rise{0%{transform:translateY(0) scale(.6);opacity:0}15%{opacity:1}100%{transform:translateY(-260px) scale(1.1);opacity:0}}
@media (max-width:860px){.diy .cols{grid-template-columns:1fr}}
/* reviews */
.rev{background:var(--bg)}
.r-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.r-grid .ph{background:#fff;min-height:170px}
@media (max-width:900px){.r-grid{grid-template-columns:1fr}}
/* visit */
.visit{background:linear-gradient(180deg,var(--bg),#e3d8ee)}
.v-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px;margin-top:40px}
.panel{background:#fff;border-radius:28px;padding:32px;border:1px solid var(--line)}
.panel h3{font-size:22px;color:var(--maroon)}
.panel a.big{font:400 clamp(26px,3.4vw,36px)/1.1 var(--font-display);text-decoration:none;color:var(--maroon)}
.note{font-size:13px;opacity:.65;margin-top:14px}
.mapcard{border-radius:28px;overflow:hidden;position:relative;min-height:320px;background:#4a1622;color:#fff;display:flex;align-items:flex-end;padding:28px;text-decoration:none}
.mapcard svg{position:absolute;inset:0;width:100%;height:100%}
.mapcard .pin{position:absolute;left:50%;top:42%;width:60px;height:60px;transform:translate(-50%,-50%);animation:bob 2.4s ease-in-out infinite}
@keyframes bob{50%{transform:translate(-50%,-62%)}}
.mapcard span{position:relative;font-weight:800;background:var(--teal);color:#08302c;padding:12px 18px;border-radius:99px}
@media (max-width:960px){.v-grid{grid-template-columns:1fr}}
.foot{background:#2a0b12;color:#f0dfe5}
.foot .brand{color:#f0dfe5}
