/* Relax Massage Spa #2 — shared styles for every page (index + service pages). */
:root{
  --spruce:#17302D;
  --spruce-2:#244741;
  --brass:#B08A52;
  --brass-lt:#c49b62;
  --ivory:#FAF8F3;
  --cream:#F1EDE3;
  --stone:#DDE3DD;
  --ink:#2A3130;
  --muted:#5B6864;
  --white:#FCFDFB;
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--ivory);line-height:1.65;font-size:17px;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:3px solid var(--brass);outline-offset:3px}
img{max-width:100%}
.skip{position:absolute;left:-999px;top:0;background:var(--white);padding:.6rem 1rem;z-index:100}
.skip:focus{left:0}

/* Header */
.bar{position:absolute;inset:0 0 auto 0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem clamp(1.25rem,5vw,4rem);color:var(--white)}
.brand{font-family:var(--serif);font-size:1.65rem;text-decoration:none;letter-spacing:.01em}
.bar nav{display:flex;align-items:center;gap:1.75rem;font-size:.95rem;font-weight:500}
.bar nav a{text-decoration:none;opacity:.92}
.bar nav a:hover{opacity:1;text-decoration:underline;text-underline-offset:6px}
.bar .pill{border:1px solid rgba(252,253,251,.6);padding:.5rem 1.1rem;border-radius:999px}
.bar .pill:hover{background:var(--white);color:var(--spruce);text-decoration:none}

/* Buttons */
.btn{display:inline-block;text-decoration:none;font-weight:600;padding:.95rem 1.7rem;border-radius:999px;background:var(--brass);color:#1a1409;transition:background .2s;border:0;cursor:pointer;font:inherit}
.btn:hover{background:var(--brass-lt)}
.btn-quiet{background:transparent;color:var(--white);border:1px solid rgba(252,253,251,.55)}
.btn-quiet:hover{background:rgba(252,253,251,.12)}
.btn-dark{background:var(--spruce);color:#fff}
.btn-dark:hover{background:var(--spruce-2)}

/* Hero (home) */
.hero{min-height:88vh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding:8rem clamp(1.25rem,5vw,4rem) 4rem;color:var(--white);
  background:
    radial-gradient(55% 70% at 12% 8%, rgba(176,138,82,.16), transparent 60%),
    radial-gradient(45% 60% at 95% 90%, rgba(116,172,156,.14), transparent 65%),
    linear-gradient(135deg,#17302D 0%,#244741 100%)}
.hero-inner{max-width:41rem}
.kicker{display:inline-flex;align-items:center;gap:.55rem;font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#e4d2b2;margin-bottom:1.25rem}
.kicker::before{content:"";width:2.1rem;height:1px;background:var(--brass)}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.9rem,7vw,5.4rem);line-height:1.02;letter-spacing:-.01em;margin-bottom:.9rem}
.hero .sub{font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,2.6vw,1.7rem);color:#cdd9d3;margin-bottom:1.4rem}
.hero p{font-size:1.1rem;max-width:34rem;opacity:.94;margin-bottom:2rem}
.actions{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;margin-bottom:2.1rem}
.contacts{display:flex;flex-wrap:wrap;gap:.65rem .85rem;font-size:.92rem;color:#cdd9d3}
.contacts a{color:var(--white);font-weight:600;text-decoration:none}
.contacts a:hover{text-decoration:underline;text-underline-offset:4px}
.contacts span{opacity:.75}
.hero figure{width:100%;max-width:30rem;justify-self:end;box-shadow:0 24px 60px rgba(0,0,0,.35)}
figure{position:relative;aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:linear-gradient(160deg,var(--cream),#c8cfc9)}
figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph{position:absolute;left:50%;top:.95rem;transform:translateX(-50%);z-index:3;white-space:nowrap;text-decoration:none;
  background:rgba(23,48,45,.92);color:#fff;font-weight:600;font-size:.98rem;letter-spacing:.02em;padding:.52rem 1.15rem;border-radius:999px;box-shadow:0 5px 16px rgba(0,0,0,.3)}
.ph::before{content:"\260E";margin-right:.5em;opacity:.95}
.ph:hover{background:var(--brass);color:#1a1409}

/* Rating */
.stars{color:var(--brass);letter-spacing:.12em}
.rating{display:inline-flex;align-items:center;gap:.5rem;font-size:.95rem;color:#e4d2b2;margin-bottom:1.2rem}

/* Sub-page hero */
.subhero{color:var(--white);padding:8.5rem clamp(1.25rem,5vw,4rem) clamp(3rem,6vw,4.5rem);
  background:
    radial-gradient(55% 70% at 12% 8%, rgba(176,138,82,.16), transparent 60%),
    radial-gradient(45% 60% at 95% 90%, rgba(116,172,156,.14), transparent 65%),
    linear-gradient(135deg,#17302D 0%,#244741 100%)}
.subhero-inner{max-width:44rem}
.crumbs{font-size:.85rem;color:#bcd0c8;margin-bottom:1rem}
.crumbs a{color:#e4d2b2;text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.subhero h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.3rem,5.5vw,4rem);line-height:1.06;margin-bottom:.8rem}
.subhero .sub{font-family:var(--serif);font-style:italic;color:#cdd9d3;font-size:clamp(1.15rem,2.4vw,1.55rem);margin-bottom:1.2rem}
.subhero p.lede{max-width:38rem;color:#d7e0db;font-size:1.08rem;margin-bottom:1.9rem}
.subhero .actions{margin-bottom:0}

/* Facts strip */
.facts{background:var(--spruce-2);color:var(--white);display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1px}
.facts div{padding:1.6rem clamp(1.25rem,5vw,4rem);border-left:1px solid rgba(252,253,251,.14)}
.facts strong{display:block;font-family:var(--serif);font-weight:400;font-size:1.5rem;letter-spacing:.01em}
.facts span{font-size:.95rem;opacity:.8}

/* Generic prose section */
.prose{padding:clamp(3.5rem,7vw,6rem) clamp(1.25rem,5vw,4rem);background:var(--ivory)}
.prose-inner{max-width:46rem;margin:0 auto}
.prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,3.8vw,2.7rem);color:var(--spruce);margin-bottom:1rem}
.prose p{color:var(--muted);margin-bottom:1.1rem}
.prose ul{margin:0 0 1.2rem 1.2rem;color:var(--muted)}
.prose li{margin-bottom:.5rem}
.prose .checks{margin-left:0}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.25rem;max-width:62rem;margin:0 auto}
.step{background:var(--white);border:1px solid var(--cream);border-radius:12px;padding:1.4rem}
.step .n{font-family:var(--serif);font-size:1.8rem;color:var(--brass);display:block;margin-bottom:.3rem}
.step h3{font-family:var(--serif);font-weight:400;color:var(--spruce);font-size:1.25rem;margin-bottom:.35rem}
.step p{font-size:.95rem;color:var(--muted)}

/* Session lengths (no prices are ever shown on this site) */
.prices{background:var(--white);padding:clamp(3.5rem,7vw,6rem) clamp(1.25rem,5vw,4rem)}
.prices-inner{max-width:44rem;margin:0 auto}
.prices h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,3.8vw,2.7rem);color:var(--spruce);margin-bottom:.5rem}
.prices .note{color:var(--muted);margin-bottom:1.6rem;font-size:.95rem}
.price-row{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--cream);font-weight:500;color:#2c3a36}
.price-row .amt{color:var(--brass);font-weight:700}

/* About */
.about{padding:clamp(4.5rem,9vw,8rem) clamp(1.25rem,5vw,4rem);background:var(--ivory)}
.about-inner{max-width:70rem;margin:0 auto;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(2rem,6vw,5.5rem);align-items:center}
.about h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.3rem,4.8vw,3.6rem);line-height:1.08;margin-bottom:1.1rem;color:var(--spruce)}
.about h2 em{font-style:italic;color:var(--brass)}
.about .lede{font-size:1.12rem;margin-bottom:1.4rem;color:#333d3a}
.about p{color:var(--muted);margin-bottom:1.1rem;max-width:34rem}
.checks{list-style:none;margin-top:1.4rem}
.checks li{padding:.7rem 0 .7rem 2.2rem;position:relative;border-top:1px solid var(--cream);font-weight:500;color:#2c3a36}
.checks li:last-child{border-bottom:1px solid var(--cream)}
.checks li::before{content:"\2713";position:absolute;left:0;top:.62rem;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--spruce);color:var(--brass-lt);font-size:.85rem;font-weight:700;display:flex;align-items:center;justify-content:center}

/* Band */
.band{position:relative;min-height:44vh;display:grid;place-items:center;text-align:center;color:var(--white);
  background:
    radial-gradient(60% 90% at 50% 0%, rgba(176,138,82,.22), transparent 60%),
    linear-gradient(135deg,#17302D 0%,#244741 100%)}
.band-inner{max-width:46rem;padding:clamp(4rem,9vw,6rem) 1.25rem}
.band h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,4.5vw,3.5rem);line-height:1.1;margin-bottom:.4rem}
.band .fine{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,3vw,1.9rem);color:#e4d2b2;margin-bottom:1.9rem}
.band .actions{justify-content:center;margin-bottom:0}

/* Services */
.services{padding:clamp(4.5rem,9vw,8rem) clamp(1.25rem,5vw,4rem);background:var(--white)}
.services-head{max-width:42rem;margin-bottom:3.4rem}
.services-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.3rem,4.8vw,3.6rem);color:var(--spruce);margin-bottom:.8rem}
.services-head p{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:1.25rem;max-width:76rem;margin:0 auto}
.card{display:block;text-decoration:none;color:inherit;background:var(--ivory);border:1px solid var(--cream);border-top:3px solid var(--brass);border-radius:12px;padding:1.5rem 1.5rem 1.6rem;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(23,48,45,.1)}
.card .num{font-size:.78rem;font-weight:600;letter-spacing:.16em;color:var(--brass);display:block;margin-bottom:.3rem}
.card h3{font-family:var(--serif);font-weight:400;font-size:1.5rem;line-height:1.12;color:var(--spruce);margin-bottom:.45rem}
.card p{font-size:.95rem;color:var(--muted)}
.card .dur{display:inline-block;margin-top:.9rem;font-size:.8rem;font-weight:600;letter-spacing:.08em;color:var(--spruce);background:var(--cream);border-radius:999px;padding:.35rem .85rem}
.card .price{display:inline-block;margin:.9rem 0 0 .4rem;font-size:.85rem;font-weight:700;color:var(--brass)}
.card .more{display:block;margin-top:.9rem;font-size:.85rem;font-weight:600;color:var(--brass)}

/* Reviews */
.reviews{padding:clamp(4.5rem,9vw,7rem) clamp(1.25rem,5vw,4rem);background:var(--cream)}
.reviews-head{max-width:42rem;margin:0 auto 2.6rem;text-align:center}
.reviews-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,4.4vw,3.2rem);color:var(--spruce);margin-bottom:.5rem}
.reviews-head p{color:var(--muted)}
.reviews .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.25rem;max-width:66rem;margin:0 auto}
.quote{background:var(--white);border:1px solid #e6e1d5;border-radius:12px;padding:1.5rem}
.quote .stars{display:block;font-size:1rem;margin-bottom:.7rem}
.quote p{color:#333d3a;margin-bottom:.9rem}
.quote cite{font-style:normal;font-weight:600;color:var(--spruce);font-size:.9rem}
.reviews-cta{max-width:66rem;margin:1.6rem auto 0;text-align:center}
.reviews-cta a{color:var(--spruce);font-weight:600}

/* FAQ */
.faq{background:var(--cream);padding:clamp(3.5rem,7vw,6rem) clamp(1.25rem,5vw,4rem)}
.faq-inner{max-width:46rem;margin:0 auto}
.faq h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,3.8vw,2.7rem);color:var(--spruce);margin-bottom:1.4rem}
.faq details{background:var(--white);border:1px solid #e6e1d5;border-radius:10px;padding:1rem 1.2rem;margin-bottom:.8rem}
.faq summary{font-weight:600;color:var(--spruce);cursor:pointer}
.faq details p{margin-top:.7rem;color:var(--muted)}

/* Booking form */
.book{padding:clamp(4.5rem,9vw,7rem) clamp(1.25rem,5vw,4rem);background:var(--ivory)}
.book-inner{max-width:48rem;margin:0 auto}
.book h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,4.4vw,3.2rem);color:var(--spruce);margin-bottom:.5rem}
.book .intro{color:var(--muted);margin-bottom:2rem;max-width:38rem}
.book form{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.book .field{display:flex;flex-direction:column}
.book .full{grid-column:1/-1}
.book label{font-size:.85rem;font-weight:600;color:var(--spruce);margin-bottom:.35rem}
.book input,.book select,.book textarea{width:100%;padding:.8rem .9rem;border:1px solid #cfd6d0;border-radius:10px;font:inherit;background:#fff;color:var(--ink)}
.book textarea{resize:vertical;min-height:5rem}
.book .btn{justify-self:start;margin-top:.4rem}
.book .note{font-size:.85rem;color:var(--muted);margin-top:.9rem}
.book .status{margin-top:1rem;font-weight:600;color:var(--spruce);min-height:1.4rem}

/* Visit */
.visit{background:
    radial-gradient(55% 80% at 85% 15%, rgba(176,138,82,.14), transparent 60%),
    linear-gradient(135deg,#17302D 0%,#244741 100%);
  color:var(--white);display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:3rem;padding:clamp(4.5rem,9vw,7rem) clamp(1.25rem,5vw,4rem)}
.visit h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,4.5vw,3.2rem);margin-bottom:.5rem}
.visit .tagline{font-family:var(--serif);font-style:italic;color:#cdd9d3;margin-bottom:2rem}
.visit address{font-style:normal;margin-bottom:1.25rem;font-size:1.05rem}
.visit .big{font-family:var(--serif);font-size:clamp(2rem,4vw,3rem);text-decoration:none;display:inline-block;margin-bottom:.5rem}
.visit .big:hover{color:#e4d2b2}
.visit .mail{display:inline-flex;align-items:center;gap:.5rem;font-size:1.02rem;font-weight:600;color:#fff;text-decoration:none;margin-bottom:1.6rem}
.visit .mail::before{content:"\2709";opacity:.9}
.visit .mail:hover{text-decoration:underline;text-underline-offset:5px}
.visit dl{display:grid;grid-template-columns:auto 1fr;gap:.45rem 1.5rem;margin-bottom:1.9rem;font-size:.98rem}
.visit dt{opacity:.7}
.visit dd{font-weight:600}
.visit .actions{margin-top:.4rem;margin-bottom:0}
footer{padding:1.6rem clamp(1.25rem,5vw,4rem);font-size:.85rem;color:var(--muted);background:var(--ivory);border-top:1px solid var(--cream)}

/* Sound toggle */
#sound{position:fixed;right:1.25rem;bottom:1.25rem;z-index:50;display:flex;align-items:center;gap:.6rem;border:0;cursor:pointer;
  background:rgba(252,253,251,.95);color:var(--spruce);font:600 .9rem var(--sans);padding:.65rem 1.1rem;border-radius:999px;box-shadow:0 4px 18px rgba(23,48,45,.25)}
#sound .dot{width:.6rem;height:.6rem;border-radius:50%;background:#9aa6a1}
#sound[aria-pressed="true"] .dot{background:var(--brass)}

/* Sticky mobile call bar */
.stickycta{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;gap:.6rem;padding:.6rem .8rem;background:rgba(23,48,45,.97);box-shadow:0 -4px 20px rgba(0,0,0,.3)}
.stickycta a{flex:1;text-align:center;text-decoration:none;font-weight:600;padding:.85rem 1rem;border-radius:10px;font-size:1rem}
.stickycta .call{background:var(--brass);color:#1a1409}
.stickycta .form{background:transparent;color:#fff;border:1px solid rgba(252,253,251,.55)}

@media (max-width:820px){
  .bar nav a:not(.pill){display:none}
  .hero{grid-template-columns:1fr;min-height:0;padding-top:6.5rem}
  .hero figure{justify-self:center}
  .about-inner{grid-template-columns:1fr}
  figure{max-width:26rem;margin:0 auto;width:100%}
  .cards,.strip{grid-template-columns:1fr;max-width:26rem}
  .stickycta{display:flex}
  body{padding-bottom:4.8rem}
  #sound{bottom:5.4rem}
}
@media (max-width:640px){
  .book form{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}