/* ============================================================
   NUSA MASSAGE SPA - shared design system (draft)
   Used by all DRAFT-*.html pages. One change here = every page.
   ============================================================ */
@font-face{
  font-family:'Cormorant Garamond';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url(/fonts/cormorant-garamond-italic-400-latin.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url(/fonts/cormorant-garamond-italic-400.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url(/fonts/cormorant-garamond-normal-400-600-latin.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url(/fonts/cormorant-garamond-normal-400-600.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Jost';
  font-style:normal;
  font-weight:300 600;
  font-display:swap;
  src:url(/fonts/jost-normal-latin.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Jost';
  font-style:normal;
  font-weight:300 600;
  font-display:swap;
  src:url(/fonts/jost-normal.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root{
  --green:#8FAC1B;
  --green-dark:#7a9317;
  --green-a11y:#677C13;
  --green-a11y-dark:#5D7012;
  --green-soft:#f3f6e4;
  --ink:#4A4A4A;
  --ink-light:#7a7a7a;
  --paper:#fdfdfb;
  --card:#ffffff;
  --radius:22px;
  --shadow:0 10px 34px rgba(74,74,74,.10);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;color:var(--ink);background:var(--paper);line-height:1.65;font-weight:300}
h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;font-weight:600;line-height:1.15}
img{max-width:100%;display:block}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}

/* ===== nav ===== */
nav{position:sticky;top:0;z-index:50;background:rgba(253,253,251,.92);backdrop-filter:blur(10px);border-bottom:1px solid #ecece4;transform:translateZ(0);will-change:transform}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;position:relative}
.logo{display:flex;align-items:center;text-decoration:none;white-space:nowrap}
.logo img{height:30px;width:auto;display:block}
.nav-actions{display:flex;align-items:center;gap:16px}
.nav-links{display:flex;visibility:hidden;position:absolute;top:calc(100% + 10px);right:24px;left:auto;min-width:230px;flex-direction:column;align-items:stretch;gap:0;font-size:.92rem;letter-spacing:.04em;background:#fff;padding:8px 0 16px;border:1px solid #ecece4;border-radius:16px;box-shadow:0 18px 44px rgba(74,74,74,.18);opacity:0;transform:translateY(-18px) scaleY(.92);transform-origin:top right;pointer-events:none;transition:opacity .3s ease,transform .3s ease,visibility .3s}
.nav-links.open{visibility:visible;opacity:1;transform:translateY(0) scaleY(1);pointer-events:auto}
.nav-links > a:not(.btn){padding:8px 24px;font-size:.95rem;letter-spacing:.05em}
.nav-links > a:not(.btn):not(:first-child){border-top:1px solid #f2f2ea}
.nav-links > a:not(.btn):hover{background:var(--green-soft)}
.nav-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:34px;height:34px;background:none;border:none;cursor:pointer;padding:0;flex-shrink:0}
.nav-toggle span{display:block;width:100%;height:2px;background:var(--ink);transition:.25s;border-radius:2px}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-links a{color:var(--ink);text-decoration:none}
.nav-links a.btn{color:#fff}
.nav-links a:hover{color:var(--green-a11y)}

/* ===== language switcher ===== */
.lang-switch{display:flex;gap:6px;align-items:center;font-size:.82rem;letter-spacing:.02em}
.lang-switch a{color:var(--ink-light);text-decoration:none}
.lang-switch a.active{color:var(--green-a11y);font-weight:500}
.lang-switch a:hover{color:var(--green-a11y)}
.lang-switch .sep{color:#ddd}

/* ===== compact language menu (flag switcher, next to hamburger) ===== */
.lang-menu{position:relative}
.lang-menu-btn{display:flex;align-items:center;gap:6px;background:none;border:none;cursor:pointer;padding:6px 2px;font-family:'Jost',sans-serif;font-size:.85rem;color:var(--ink);letter-spacing:.03em}
.lang-menu-btn .flag{font-size:1.2rem;line-height:1}
.lang-menu-btn .caret{color:var(--ink-light);transition:transform .25s}
.lang-menu.open .lang-menu-btn .caret{transform:rotate(180deg)}
.lang-menu-list{display:flex;flex-direction:column;position:absolute;top:calc(100% + 10px);right:0;min-width:170px;background:#fff;border:1px solid #ecece4;border-radius:16px;box-shadow:0 18px 44px rgba(74,74,74,.18);padding:8px 0;opacity:0;visibility:hidden;transform:translateY(-14px) scaleY(.92);transform-origin:top right;pointer-events:none;transition:opacity .25s ease,transform .25s ease,visibility .25s;z-index:60}
.lang-menu-list::before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}
.lang-menu.open .lang-menu-list{opacity:1;visibility:visible;transform:translateY(0) scaleY(1);pointer-events:auto}
.lang-menu-list a{display:flex;align-items:center;gap:10px;padding:9px 20px;color:var(--ink);text-decoration:none;font-size:.9rem}
.lang-menu-list a:not(:first-child){border-top:1px solid #f2f2ea}
.lang-menu-list a:hover{background:var(--green-soft)}
.lang-menu-list a.active{color:var(--green-a11y);font-weight:500}
.lang-menu-list .flag{font-size:1.1rem}
@media(hover:hover){
  .lang-menu:hover .lang-menu-list{opacity:1;visibility:visible;transform:translateY(0) scaleY(1);pointer-events:auto}
  .lang-menu:hover .lang-menu-btn .caret{transform:rotate(180deg)}
}

/* ===== buttons ===== */
.btn{display:inline-block;background:var(--green-a11y);color:#fff;text-decoration:none;padding:13px 30px;border-radius:999px;font-weight:500;letter-spacing:.05em;transition:.25s;box-shadow:0 6px 18px rgba(143,172,27,.35);border:none;cursor:pointer;font-family:'Jost',sans-serif;font-size:1rem}
.btn:hover{background:var(--green-a11y-dark);transform:translateY(-2px)}
.btn.small{padding:9px 22px;font-size:.88rem}
.btn.ghost{background:transparent;color:var(--green-a11y);box-shadow:none;border:1.5px solid var(--green-a11y)}
.btn.ghost:hover{background:var(--green-a11y);color:#fff}
.btn.ghost.on-dark{color:#fff;border-color:#fff}
.btn.icon{display:inline-flex;align-items:center;gap:9px}
.btn.icon svg{width:18px;height:18px;flex-shrink:0}

/* ===== hero =====
   Photo hero: <header class="hero"><img class="hero-img" src="photo.jpg" alt="" fetchpriority="high">...
   Variants: .compact (lower), .plain (green gradient, no photo)          */
.hero{position:relative;min-height:78vh;display:flex;align-items:center;overflow:hidden}
.hero.compact{min-height:52vh}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;animation:heroZoom 11s ease-in-out infinite alternate;will-change:transform}
@keyframes heroZoom{from{transform:scale(1)}to{transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.hero-img{animation:none}}
/* On phones the hero is much shorter, so the slow 11s/1.12 drift reads as static.
   Shorter cycle + wider scale to make the movement noticeable. Kept behind
   no-preference so it never re-enables motion for reduced-motion users. */
@keyframes heroZoomMobile{from{transform:scale(1)}to{transform:scale(1.2)}}
@media(max-width:640px) and (prefers-reduced-motion:no-preference){
  .hero-img{animation-name:heroZoomMobile;animation-duration:7s}
}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(28,30,18,.8) 0%,rgba(28,30,18,.45) 55%,rgba(28,30,18,.15) 100%)}
.hero.plain{background:linear-gradient(120deg,#57641b,var(--green));min-height:42vh}
.hero.plain::after{display:none}
.hero .wrap{position:relative;z-index:2;padding-top:70px;padding-bottom:70px}
.hero-kicker{color:#cfe06a;letter-spacing:.35em;text-transform:uppercase;font-size:.8rem;margin-bottom:16px}
.hero h1{color:#fff;font-size:clamp(2.4rem,5.8vw,4.2rem);max-width:16ch;margin-bottom:18px}
.hero p{color:#ececec;max-width:48ch;font-size:1.12rem;margin-bottom:0}
.hero .hero-ctas{display:flex;gap:16px;flex-wrap:wrap;margin-top:34px}
.hero-meta{margin-top:34px;display:flex;gap:34px;flex-wrap:wrap;color:#d8d8d0;font-size:.9rem;letter-spacing:.05em}
.hero-meta strong{color:#fff;font-weight:500;display:block}

/* ===== section basics ===== */
section{padding:88px 0}
.kicker{color:var(--green-a11y);letter-spacing:.3em;text-transform:uppercase;font-size:.78rem;margin-bottom:12px}
.sec-title{font-size:clamp(1.9rem,3.6vw,2.8rem);margin-bottom:16px}
.sec-lead{max-width:64ch;color:var(--ink-light);font-size:1.05rem}
.center{text-align:center}
.center .sec-lead{margin:0 auto}
.tint{background:linear-gradient(180deg,#fff 0%,var(--green-soft) 100%)}

/* ===== generic icon cards ===== */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:54px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.cards.four{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border-radius:var(--radius);padding:34px 30px;box-shadow:var(--shadow);border:1px solid #f0f0e8;transition:.3s;position:relative;overflow:hidden;display:flex;flex-direction:column}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--green),#c8d96a);opacity:0;transition:.3s}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 44px rgba(74,74,74,.16)}
.card:hover::before{opacity:1}
.card img{width:74px;height:74px;margin-bottom:20px}
.card h3{font-size:1.5rem;margin-bottom:10px}
.card p{color:var(--ink-light);font-size:.98rem;flex:1}
.card a.more{margin-top:16px;color:var(--green-a11y);text-decoration:none;font-weight:500}
.card a.more:hover{text-decoration:underline}
.card.wide{grid-column:span 3;display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;background:linear-gradient(120deg,var(--green-soft),#fff)}
.card.wide img{margin:0}
.card.wide h3{margin-bottom:6px}

/* ===== photo cards ===== */
.m-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:56px}
.m-card{background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid #f0f0e8;display:flex;flex-direction:column;transition:.3s}
.m-card:hover{transform:translateY(-7px);box-shadow:0 20px 48px rgba(74,74,74,.17)}
.m-card .ph{position:relative;overflow:hidden;aspect-ratio:4/2.9}
.m-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.m-card:hover .ph img{transform:scale(1.06)}
.m-card .ph .tag{position:absolute;top:16px;left:16px;background:rgba(255,255,255,.92);color:var(--green-a11y);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;padding:6px 14px;border-radius:999px}
.m-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1}
.m-body h3{font-size:1.55rem;margin-bottom:8px}
.m-body p{color:var(--ink-light);font-size:.96rem;flex:1}
.m-meta{display:flex;align-items:baseline;gap:10px;margin-top:18px;flex-wrap:wrap}
.m-meta .m-price{font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:600;color:var(--green-a11y);line-height:1}
.m-meta .m-dur{color:var(--ink-light);font-size:.82rem;letter-spacing:.04em}
.m-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;padding-top:16px;border-top:1px solid #f0f0e8}
.m-foot .m-more{color:var(--green-a11y);text-decoration:none;font-weight:500;letter-spacing:.04em;font-size:.95rem}
.m-foot .m-more:hover{text-decoration:underline}
.m-wa{position:relative;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex-shrink:0;color:var(--green-a11y);transition:transform .2s,color .2s}
.m-wa:hover{transform:scale(1.1);color:var(--green-a11y-dark)}
.m-wa svg{width:34px;height:34px;display:block;fill:currentColor}
.m-wa::after{content:attr(aria-label);position:absolute;bottom:calc(100% + 9px);left:0;background:var(--ink);color:#fff;font-size:.72rem;letter-spacing:.02em;white-space:nowrap;padding:6px 11px;border-radius:7px;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:30;box-shadow:0 6px 16px rgba(74,74,74,.22);pointer-events:none}
.m-wa::before{content:"";position:absolute;bottom:calc(100% + 4px);left:12px;border:5px solid transparent;border-top-color:var(--ink);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:30}
.m-wa:hover::after,.m-wa:hover::before{opacity:1;visibility:visible}
.m-actions{display:flex;gap:16px;justify-content:center;margin-top:52px;flex-wrap:wrap}

/* ===== split layout ===== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split .photo img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;object-fit:cover}
.split p+p{margin-top:16px}
.cta-stack{display:flex;gap:16px;flex-wrap:wrap;margin-top:28px}

/* ===== durations ===== */
.dur-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:54px}
@media(min-width:641px){
  .dur-grid.two{max-width:620px;margin-left:auto;margin-right:auto;grid-template-columns:repeat(2,1fr)}
}
.dur{background:#fff;border-radius:var(--radius);padding:42px 34px;text-align:center;box-shadow:var(--shadow);border:1.5px solid transparent;transition:.3s}
.dur:hover{transform:translateY(-6px)}
.dur.featured{border-color:var(--green);position:relative}
.dur.featured::after{content:attr(data-badge);position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--green-a11y);color:#fff;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;padding:5px 16px;border-radius:999px;white-space:nowrap}
.dur img{width:64px;height:64px;margin:0 auto 16px}
.dur .mins{font-family:'Cormorant Garamond',serif;font-size:3.2rem;font-weight:600;color:var(--ink);line-height:1}
.dur .unit{color:var(--green-a11y);letter-spacing:.2em;text-transform:uppercase;font-size:.78rem;margin:6px 0 16px}
.dur p{color:var(--ink-light);font-size:.95rem;margin-bottom:24px}

.dur .price{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:600;color:var(--green-dark);margin:4px 0 18px}

/* ===== info note (contraindications etc.) ===== */
.note-box{max-width:820px;margin:48px auto 0;background:#fff;border-left:4px solid var(--green);border-radius:12px;box-shadow:var(--shadow);padding:24px 28px;color:var(--ink-light);font-size:.95rem}
.note-box strong{color:var(--ink);font-weight:500}

/* ===== amenities ===== */
.am-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:18px;margin-top:54px}
.am-grid.eight{grid-template-columns:repeat(4,1fr)}
.am{background:#fff;border-radius:18px;padding:22px 12px;text-align:center;box-shadow:var(--shadow);border:1px solid #f0f0e8;transition:.3s}
.am:hover{transform:translateY(-5px);border-color:#dfe8b8}
.am img{width:58px;height:58px;margin:0 auto 12px}
.am span{font-size:.83rem;color:var(--ink);display:block;line-height:1.35}

/* ===== FAQ accordion ===== */
.faq-list{max-width:800px;margin:48px auto 0}
details{background:#fff;border-radius:16px;box-shadow:var(--shadow);border:1px solid #f0f0e8;margin-bottom:14px;overflow:hidden}
summary{cursor:pointer;list-style:none;padding:20px 26px;font-weight:400;font-size:1.05rem;display:flex;justify-content:space-between;align-items:center;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:1.5rem;color:var(--green-a11y);transition:.25s;flex-shrink:0}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 26px 22px;color:var(--ink-light)}
.faq-cat{font-size:1.6rem;margin:46px 0 18px;text-align:center}
.faq-list .faq-cat:first-child{margin-top:0}

/* ===== testimonials ===== */
.q-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:56px}
.quote{background:#fff;border-radius:var(--radius);padding:34px 30px;box-shadow:var(--shadow);border:1px solid #f0f0e8;display:flex;flex-direction:column}
.quote .stars{color:var(--green-a11y);letter-spacing:.2em;margin-bottom:16px}
.quote p{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.12rem;color:var(--ink);flex:1}
.quote footer{margin-top:20px;color:var(--ink-light);font-size:.9rem}
.quote footer strong{color:var(--ink);font-weight:500}

/* ===== team ===== */
.t-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;margin-top:56px}
.t-card{text-align:center}
.t-card .avatar{width:210px;height:210px;border-radius:50%;overflow:hidden;margin:0 auto 22px;border:6px solid #fff;box-shadow:var(--shadow)}
.t-card .avatar img{width:100%;height:100%;object-fit:cover;object-position:center top}
.t-card h3{font-size:1.7rem}
.t-card span{color:var(--green-a11y);letter-spacing:.14em;text-transform:uppercase;font-size:.78rem}

/* ===== pillars (on-dark cards) ===== */
.pillars-bg{background:linear-gradient(120deg,#57641b,var(--green));color:#fff}
.pillars-bg .kicker{color:#e6efb8}
.pillars-bg .sec-title{color:#fff}
.p-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:56px}
.pillar{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);border-radius:var(--radius);padding:36px 30px;backdrop-filter:blur(4px)}
.pillar img,.pillar svg{width:56px;height:56px;margin-bottom:20px}
.pillar h3{color:#fff;font-size:1.55rem;margin-bottom:10px}
.pillar p{color:#eef3d5;font-size:.96rem}
.pillar a{display:inline-block;margin-top:18px;color:#fff;text-decoration:underline;font-size:.92rem}
.p-grid.four{grid-template-columns:repeat(4,1fr)}
.p-grid.two{grid-template-columns:repeat(2,1fr);max-width:730px;margin-left:auto;margin-right:auto}

/* ===== quick-contact cards ===== */
.qc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:-58px;position:relative;z-index:5}
.qc{background:#fff;border-radius:var(--radius);padding:30px 26px;box-shadow:var(--shadow);border:1px solid #f0f0e8;text-align:center;transition:.3s}
.qc:hover{transform:translateY(-6px)}
.qc svg,.qc img{width:46px;height:46px;margin:0 auto 14px;display:block}
.qc h3{font-size:1.3rem;margin-bottom:6px}
.qc p{color:var(--ink-light);font-size:.92rem;margin-bottom:14px}
.qc a.link{color:var(--green-a11y);text-decoration:none;font-weight:500;font-size:.95rem}
.qc a.link:hover{text-decoration:underline}

/* ===== chips ===== */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.chip{background:var(--green-soft);color:var(--green-a11y);border:1px solid #dfe8b8;padding:8px 18px;border-radius:999px;font-size:.88rem;text-decoration:none;transition:.2s;cursor:pointer}
.chip:hover{background:var(--green);color:#fff}
.chips.center{justify-content:center}

/* ===== gallery ===== */
.g-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:54px}
.g-item{border-radius:18px;overflow:hidden;box-shadow:var(--shadow);cursor:pointer;position:relative;aspect-ratio:4/5}
.g-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.g-item:hover img{transform:scale(1.06)}
.video-embed{position:relative;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);max-width:800px;margin:0 auto}
.video-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}
.video-embed video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;background:#000}
.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:1040px;margin:0 auto}
.video-grid .video-embed{max-width:none;margin:0}
@media(max-width:760px){.video-grid{grid-template-columns:1fr;gap:24px}}
.lightbox{position:fixed;inset:0;background:rgba(20,22,12,.94);display:none;align-items:center;justify-content:center;z-index:200;padding:30px}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:14px;width:auto;height:auto}
.lightbox .close{position:absolute;top:22px;right:30px;color:#fff;font-size:2.2rem;cursor:pointer;line-height:1;font-family:'Jost',sans-serif}

/* ===== map ===== */
.map-frame{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid #f0f0e8;margin-top:52px}
.map-frame iframe{display:block;width:100%;height:440px;border:0}

/* ===== forms ===== */
form.panel{max-width:720px;margin:48px auto 0;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid #f0f0e8;padding:44px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.f-group{margin-bottom:20px}
label{display:block;font-size:.88rem;letter-spacing:.06em;margin-bottom:7px;color:var(--ink);font-weight:400}
input,textarea{width:100%;padding:13px 16px;border:1.5px solid #e2e2d8;border-radius:12px;font-family:'Jost',sans-serif;font-size:1rem;color:var(--ink);background:#fdfdfb;transition:.2s}
input:focus,textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(143,172,27,.15)}
textarea{min-height:140px;resize:vertical}
.form-note{font-size:.85rem;color:var(--ink-light);margin-top:16px}

/* ===== final CTA ===== */
.cta-final{background:linear-gradient(120deg,#57641b,var(--green));border-radius:var(--radius);padding:70px 40px;text-align:center;color:#fff}
.cta-final h2{color:#fff;font-size:clamp(1.9rem,3.4vw,2.7rem);margin-bottom:14px}
.cta-final p{color:#eef3d5;max-width:54ch;margin:0 auto 32px}
.cta-final .btn{background:#fff;color:var(--green-a11y);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.cta-final .btn:hover{background:var(--green-soft)}

/* ===== footer ===== */
.site-footer{background:#3d3d3d;color:#cfcfcf;padding:60px 0 34px;margin-top:88px;font-size:.93rem}
.foot{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.site-footer h3{color:#fff;font-size:1.3rem;margin-bottom:14px;letter-spacing:.06em}
.site-footer a{color:#cfe06a;text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.copy{border-top:1px solid #565656;padding-top:22px;text-align:center;color:#9a9a9a;font-size:.85rem}
.foot-social{display:flex;flex-direction:column;gap:10px}
.foot-social a{display:flex;align-items:center;gap:10px}
.foot-social svg{width:18px;height:18px;flex-shrink:0}

.nav-section-pages{display:flex;flex-direction:column;background:#f5f5f0;margin-top:8px;border-top:1px solid #ecece4;border-bottom:1px solid #ecece4}
.nav-section-pages:first-child{margin-top:0;border-top:none}
.nav-section-pages a{padding:8px 24px;font-size:.95rem;letter-spacing:.05em;color:var(--ink);text-decoration:none}
.nav-section-pages a:not(:first-child){border-top:1px solid #eaeae4}
.nav-section-pages a:hover{background:var(--green-soft)}
.nav-links .lang-switch a{padding:2px 4px}
.nav-links .lang-switch{margin:10px 24px 4px;padding-top:14px;border-top:1px solid #ecece4;justify-content:center;gap:10px}
.nav-cta{flex-shrink:0}
.nav-links > .btn{display:none;margin:12px 20px 0;text-align:center}

/* ===== responsive ===== */
@media(max-width:640px){
  .nav-cta{display:none}
  .nav-links > .btn{display:block}
  nav .wrap{height:52px}
  .logo img{height:24px}
  .hero{min-height:auto}
  .hero .wrap{padding-top:82px;padding-bottom:74px}
  .hero .hero-ctas{gap:10px;margin-top:16px}
  .hero-meta{row-gap:12px;column-gap:34px;margin-top:16px}
  /* homepage hero on mobile: show the tagline, drop the hours/address block
     (Saldanha is already in the kicker, contact details come at booking).
     .hero-tagline exists only on the 5 homepages, so this stays scoped. */
  .hero-tagline + .hero-meta{display:none}
  .hero-ctas .btn{padding:13px 20px;font-size:.92rem}
}
@media(max-width:960px){
  .cards,.cards.four,.m-grid,.q-grid,.p-grid,.t-grid{grid-template-columns:repeat(2,1fr)}
  .p-grid.four,.qc-grid{grid-template-columns:repeat(2,1fr)}
  .qc-grid{margin-top:40px}
  .g-grid{grid-template-columns:repeat(3,1fr)}
  .am-grid,.am-grid.eight{grid-template-columns:repeat(4,1fr)}
  .card.wide{grid-column:span 2;grid-template-columns:auto 1fr}
  .split{grid-template-columns:1fr;gap:40px}
  .foot{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  section{padding:60px 0}
  .cards,.cards.two,.cards.four,.m-grid,.q-grid,.p-grid,.p-grid.four,.p-grid.two,.t-grid,.dur-grid,.qc-grid,.f-row{grid-template-columns:1fr}
  .g-grid{grid-template-columns:repeat(2,1fr)}
  .am-grid,.am-grid.eight{grid-template-columns:repeat(2,1fr)}
  .card.wide{grid-column:span 1;grid-template-columns:1fr}
  .foot{grid-template-columns:1fr}
  .t-card .avatar{width:170px;height:170px}
  form.panel{padding:30px 22px}
}

/* ===== from-price on hub cards ===== */
.card p.from{flex:0 0 auto;margin-top:14px;font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;color:var(--green-a11y)}
.card.wide p.from{margin-top:10px}

/* ===== review strip (massage pages) ===== */
.review-strip{padding:36px 0}
.review-strip .wrap{max-width:760px;text-align:center}
.review-strip .stars{color:var(--green-a11y);letter-spacing:.25em;margin-bottom:14px}
.review-strip blockquote{margin:0 0 12px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.45rem;font-weight:500;line-height:1.5;color:var(--ink)}
.review-strip footer{color:var(--ink-light);font-size:.9rem}

/* ===== blog ===== */
.post-meta{display:flex;align-items:center;gap:10px;color:var(--ink-light);font-size:.85rem;letter-spacing:.04em;margin-bottom:18px}
.post-meta .dot{width:3px;height:3px;background:var(--ink-light);border-radius:50%;flex-shrink:0}
.article{max-width:700px;margin:0 auto}
.article p{margin-bottom:22px;font-size:1.05rem;line-height:1.75;color:var(--ink)}
.article h2{margin:46px 0 16px;font-size:1.65rem}
.article h3{margin:34px 0 12px;font-size:1.28rem}
.article ul,.article ol{margin:0 0 22px 22px}
.article li{margin-bottom:8px;line-height:1.7;font-size:1.05rem}
.article img{width:100%;height:auto;border-radius:var(--radius);box-shadow:var(--shadow);margin:8px 0 36px}
.article blockquote{margin:36px 0;padding:22px 28px;border-left:3px solid var(--green-a11y);background:var(--green-soft);border-radius:0 var(--radius) var(--radius) 0}
.article blockquote p{margin:0;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.25rem;color:var(--ink)}
.article a{color:var(--green-a11y-dark);text-decoration:none;font-weight:500}
.article a:hover{text-decoration:underline}
/* sources + disclaimer block, for evidence-based posts */
.article .sources{margin:46px 0 0;padding:22px 26px;background:var(--green-soft);border-radius:var(--radius)}
.article .sources h2{margin:0 0 12px;font-size:1.08rem}
.article .sources ul{list-style:none;margin:0;padding:0}
.article .sources li{font-size:.86rem;line-height:1.55;color:var(--ink-light);margin-bottom:10px}
.article .sources li:last-child{margin-bottom:0}
.article .disclaimer{margin-top:22px;font-size:.84rem;line-height:1.6;color:var(--ink-light);font-style:italic}
.sec-lead a,.card p a,.faq-list a,.center a:not(.btn):not(.chip){color:var(--green-a11y-dark);text-decoration:none;font-weight:500}
.sec-lead a:hover,.card p a:hover,.faq-list a:hover,.center a:not(.btn):not(.chip):hover{text-decoration:underline}
.blog-card .ph .tag{text-transform:none;letter-spacing:.06em}

/* ===== massage finder quiz ===== */
.quiz{max-width:720px;margin:0 auto;background:var(--card);border-radius:var(--radius);padding:48px 44px;box-shadow:var(--shadow);border:1px solid #f0f0e8}
.quiz-progress{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--green-a11y);font-weight:600;margin-bottom:16px}
.quiz-question{font-size:1.6rem;margin-bottom:26px}
.quiz-options{display:grid;gap:14px}
.quiz-option{display:flex;align-items:center;gap:16px;text-align:left;width:100%;background:#fff;border:1.5px solid #eceee0;border-radius:16px;padding:16px 20px;cursor:pointer;transition:.2s;font-family:'Jost',sans-serif;font-size:1rem;color:var(--ink)}
.quiz-option:hover{border-color:var(--green-a11y);background:var(--green-soft)}
.quiz-option img{width:32px;height:32px;flex-shrink:0}
.quiz-back{display:inline-block;background:none;border:none;color:var(--ink-light);font-family:'Jost',sans-serif;font-size:.88rem;cursor:pointer;margin-bottom:20px;padding:0;text-decoration:underline}
.quiz-result{text-align:center}
.quiz-result img{width:60px;height:60px;margin:0 auto 18px}
.quiz-result h2{font-size:1.8rem;margin-bottom:12px}
.quiz-result p{color:var(--ink-light);margin-bottom:22px;font-size:1.02rem}
.quiz-result .quiz-note{font-size:.88rem;color:var(--ink-light);margin-top:24px}
.quiz-note a{color:var(--green-a11y-dark);font-weight:500}
.quiz-restart{display:block;margin:30px auto 0;background:none;border:none;color:var(--green-a11y-dark);font-family:'Jost',sans-serif;cursor:pointer;text-decoration:underline;font-size:.9rem}
@media(max-width:640px){.quiz{padding:34px 22px}.quiz-question{font-size:1.4rem}}

/* ===== scroll zoom-settle on service photos (phones) ===== */
@media(max-width:640px) and (prefers-reduced-motion:no-preference){
  html.zoomwatch .split .photo{overflow:hidden;border-radius:var(--radius)}
  html.zoomwatch .m-card .ph img,html.zoomwatch .split .photo img{transform:scale(1.09);transition:transform 1.1s cubic-bezier(.22,.61,.36,1)}
  html.zoomwatch .m-card .ph img.zoomed,html.zoomwatch .split .photo img.zoomed{transform:scale(1)}
}

/* ===== sticky mobile booking bar ===== */
.sticky-book{display:none}
@media(max-width:640px){
  .sticky-book{display:block;position:fixed;left:0;right:0;bottom:0;z-index:9000;background:var(--green-a11y);color:#fff;text-align:center;text-decoration:none;font-weight:500;letter-spacing:.06em;font-size:.95rem;padding:15px 16px calc(15px + env(safe-area-inset-bottom));box-shadow:0 -8px 24px rgba(74,74,74,.22);transition:transform .3s ease,opacity .3s ease}
  .sticky-book.pending{transform:translateY(100%);opacity:0;pointer-events:none}
  .sticky-book:hover{background:var(--green-a11y-dark)}
  body{padding-bottom:56px}
}

.cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:#fff;border-top:1px solid #e3e6d6;box-shadow:0 -10px 34px rgba(74,74,74,.14);padding:22px 0;display:none}
.cookie-banner.show{display:block}
.cookie-banner .wrap{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.cookie-banner p{margin:0;color:var(--ink);font-size:.92rem;line-height:1.5;max-width:640px}
.cookie-banner a{color:var(--green-a11y);text-decoration:underline}
.cookie-banner .cookie-actions{display:flex;gap:12px;flex-shrink:0;flex-wrap:wrap}
#cookieAcceptAll,#cookieRejectAll{padding:6px 16px;font-size:.8rem}
@media(max-width:640px){
  .cookie-banner .wrap{flex-direction:column;align-items:stretch;text-align:center}
  .cookie-banner .cookie-actions{justify-content:center}
}

/* ===== therapist cards link to their profile ===== */
.t-card .t-link{display:block;color:inherit;text-decoration:none}
.t-card .t-link .avatar{transition:box-shadow .3s ease,transform .3s ease}
.t-card .t-link:hover .avatar{box-shadow:0 20px 46px rgba(74,74,74,.26);transform:translateY(-3px)}
.profile{scroll-margin-top:88px}