/* ============================================================
   Massage Poblado Medellín S&H — Shared Stylesheet
   Luxury noir + champagne gold · English landing pages · 2026
   ============================================================ */
:root{
  --ink:#14100d;
  --mocha:#231b14;
  --mocha-2:#2e241b;
  --gold:#c9a24b;
  --gold-soft:#e2c98a;
  --ivory:#f7f2e9;
  --sand:#e8dcc8;
  --muted:#a89a86;
  --wa:#25d366;
  --wa-dark:#1eb457;
  --radius-arch:180px 180px 12px 12px;
  --shadow:0 18px 50px rgba(0,0,0,.45);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Jost',sans-serif;
  background:var(--ink);
  color:var(--ivory);
  line-height:1.65;
  font-size:16.5px;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
h1,h2,h3,.serif{font-family:'Cormorant Garamond',serif;font-weight:600;line-height:1.12}
h1{font-size:clamp(2.4rem,5.2vw,4rem);letter-spacing:.01em}
h2{font-size:clamp(1.9rem,3.6vw,2.7rem);color:var(--ivory)}
h3{font-size:1.35rem;color:var(--gold-soft)}
p{color:var(--sand)}
a{color:var(--gold-soft);text-decoration:none}
.container{width:min(1160px,92%);margin:0 auto}
section{padding:84px 0}
.eyebrow{
  display:inline-block;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--gold);margin-bottom:14px;font-weight:500;
}
.eyebrow::before{content:"";display:inline-block;width:34px;height:1px;background:var(--gold);
  vertical-align:middle;margin-right:12px}
.lead{font-size:1.12rem;max-width:640px}
.gold-i{color:var(--gold-soft);font-style:italic}

/* ---------- Header ---------- */
header{
  position:sticky;top:0;z-index:1000;
  background:rgba(20,16,13,.92);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(201,162,75,.25);
}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;height:74px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:44px;height:44px;object-fit:contain;border-radius:50%;
  border:1px solid rgba(201,162,75,.5)}
.brand-name{font-family:'Cormorant Garamond',serif;font-size:1.22rem;color:var(--ivory);
  line-height:1.1}
.brand-name small{display:block;font-family:'Jost',sans-serif;font-size:.62rem;
  letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
nav.desktop{display:flex;align-items:center;gap:28px}
nav.desktop a.nav-link{font-size:.86rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--sand);transition:color .25s}
nav.desktop a.nav-link:hover{color:var(--gold-soft)}
.btn-lang{
  font-family:'Jost',sans-serif;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold-soft);background:transparent;border:1px solid rgba(201,162,75,.55);
  padding:8px 16px;border-radius:999px;cursor:pointer;transition:.25s;
}
.btn-lang:hover{background:var(--gold);color:var(--ink)}
.btn-wa{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--wa);color:#fff;font-weight:500;
  padding:12px 24px;border-radius:999px;border:none;cursor:pointer;
  font-family:'Jost',sans-serif;font-size:.95rem;letter-spacing:.03em;
  box-shadow:0 8px 24px rgba(37,211,102,.35);transition:.25s;
}
.btn-wa:hover{background:var(--wa-dark);transform:translateY(-2px)}
.btn-wa svg{width:20px;height:20px;flex:none}
.btn-wa.small{padding:10px 18px;font-size:.85rem}
.btn-gold{
  display:inline-flex;align-items:center;gap:10px;
  background:transparent;color:var(--gold-soft);border:1px solid var(--gold);
  padding:12px 26px;border-radius:999px;cursor:pointer;
  font-family:'Jost',sans-serif;font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;
  transition:.25s;
}
.btn-gold:hover{background:var(--gold);color:var(--ink)}

/* ---------- Mobile menu ---------- */
.hamburger{display:none;background:none;border:none;cursor:pointer;padding:8px;z-index:1002}
.hamburger span{display:block;width:26px;height:2px;background:var(--gold-soft);margin:6px 0;
  transition:.3s}
.overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.6);opacity:0;pointer-events:none;
  transition:opacity .3s;z-index:900;
}
.overlay.active{opacity:1;pointer-events:auto}
.mobile-menu{
  position:fixed;top:0;right:-320px;width:300px;height:100vh;height:100dvh;
  background:var(--mocha);z-index:1001;transition:right .35s ease;
  padding:90px 34px 34px;display:flex;flex-direction:column;gap:6px;
  border-left:1px solid rgba(201,162,75,.3);overflow-y:auto;
}
.mobile-menu.active{right:0}
.mobile-menu a{padding:13px 0;border-bottom:1px solid rgba(201,162,75,.15);
  color:var(--ivory);font-size:1rem;letter-spacing:.06em}
.mobile-menu .btn-wa{margin-top:22px;justify-content:center}
.mobile-menu .btn-lang{margin-top:12px;text-align:center}
.close-menu{
  position:absolute;top:20px;right:22px;background:none;border:none;cursor:pointer;
  color:var(--gold-soft);font-size:1.9rem;line-height:1;
}

/* ---------- Hero ---------- */
.hero{padding:70px 0 90px;position:relative;overflow:hidden}
.hero::before{
  content:"";position:absolute;top:-180px;right:-140px;width:520px;height:520px;
  background:radial-gradient(circle,rgba(201,162,75,.16),transparent 65%);pointer-events:none;
}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:60px;align-items:center}
.hero .rating-badge{
  display:inline-flex;align-items:center;gap:10px;background:var(--mocha-2);
  border:1px solid rgba(201,162,75,.4);border-radius:999px;padding:8px 18px;
  font-size:.86rem;color:var(--sand);margin-bottom:22px;
}
.hero .rating-badge .stars{color:var(--gold);letter-spacing:2px}
.hero h1 em{font-style:italic;color:var(--gold-soft)}
.hero .lead{margin:22px 0 30px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.hero-note{margin-top:16px;font-size:.85rem;color:var(--muted)}
.hero-photo{position:relative}
.hero-photo .arch{
  border-radius:var(--radius-arch);overflow:hidden;box-shadow:var(--shadow);
  border:1px solid rgba(201,162,75,.45);
}
.hero-photo .arch img{width:100%;height:540px;object-fit:cover}
.hero-photo .caption{
  position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);
  background:var(--gold);color:var(--ink);font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;padding:10px 24px;border-radius:999px;white-space:nowrap;
  font-weight:500;
}

/* ---------- Trust bar ---------- */
.trust-bar{background:var(--mocha);border-top:1px solid rgba(201,162,75,.2);
  border-bottom:1px solid rgba(201,162,75,.2);padding:26px 0}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:center}
.trust-item strong{display:block;font-family:'Cormorant Garamond',serif;font-size:1.5rem;
  color:var(--gold-soft)}
.trust-item span{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted)}

/* ---------- Services ---------- */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:48px}
.svc-card{
  background:var(--mocha);border:1px solid rgba(201,162,75,.22);border-radius:14px;
  overflow:hidden;transition:transform .3s,border-color .3s;display:flex;flex-direction:column;
}
.svc-card:hover{transform:translateY(-6px);border-color:rgba(201,162,75,.55)}
.svc-card img{height:210px;width:100%;object-fit:cover}
.svc-body{padding:24px 24px 28px;flex:1;display:flex;flex-direction:column}
.svc-body p{font-size:.94rem;margin:10px 0 18px;flex:1}
.svc-link{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--wa);
  cursor:pointer;background:none;border:none;font-family:'Jost',sans-serif;text-align:left;
  padding:0}
.svc-link:hover{color:var(--gold-soft)}
.svc-list{margin-top:34px;display:flex;flex-wrap:wrap;gap:12px}
.svc-pill{border:1px solid rgba(201,162,75,.35);border-radius:999px;padding:9px 20px;
  font-size:.86rem;color:var(--sand)}

/* ---------- Professional / split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split .arch-sm{border-radius:var(--radius-arch);overflow:hidden;
  border:1px solid rgba(201,162,75,.4);box-shadow:var(--shadow)}
.split .arch-sm img{width:100%;height:440px;object-fit:cover}
.check-list{list-style:none;margin-top:24px}
.check-list li{padding:11px 0 11px 36px;position:relative;color:var(--sand);
  border-bottom:1px solid rgba(201,162,75,.12);font-size:1rem}
.check-list li::before{content:"✦";position:absolute;left:4px;color:var(--gold)}
.section-dark{background:var(--mocha)}

/* ---------- Testimonials ---------- */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:44px}
.testi{
  background:var(--ink);border:1px solid rgba(201,162,75,.25);border-radius:14px;
  padding:30px 28px;position:relative;
}
.testi::before{content:"“";font-family:'Cormorant Garamond',serif;font-size:4.4rem;
  color:var(--gold);position:absolute;top:6px;left:20px;opacity:.35;line-height:1}
.testi .stars{color:var(--gold);letter-spacing:3px;margin-bottom:12px}
.testi p{font-size:.95rem;font-style:italic}
.testi .who{margin-top:16px;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);font-style:normal}

/* ---------- Location ---------- */
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:stretch;margin-top:44px}
.map-frame{border-radius:14px;overflow:hidden;border:1px solid rgba(201,162,75,.35);
  min-height:380px}
.map-frame iframe{width:100%;height:100%;min-height:380px;border:0;display:block}
.loc-info{background:var(--mocha);border:1px solid rgba(201,162,75,.25);border-radius:14px;
  padding:38px 36px;display:flex;flex-direction:column;justify-content:center;gap:18px}
.loc-info .row{display:flex;gap:16px;align-items:flex-start}
.loc-info .row .ic{color:var(--gold);font-size:1.2rem;flex:none;margin-top:2px}
.loc-info .row p{font-size:.98rem}
.loc-info .row strong{color:var(--ivory);display:block;font-family:'Jost',sans-serif;
  font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:2px;
  color:var(--gold-soft)}

/* ---------- FAQ ---------- */
.faq{max-width:820px;margin:40px auto 0}
.faq details{
  background:var(--mocha);border:1px solid rgba(201,162,75,.25);border-radius:12px;
  margin-bottom:14px;overflow:hidden;
}
.faq summary{
  cursor:pointer;padding:20px 26px;font-family:'Cormorant Garamond',serif;
  font-size:1.18rem;color:var(--ivory);list-style:none;position:relative;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:24px;top:50%;
  transform:translateY(-50%);color:var(--gold);font-size:1.5rem;font-family:'Jost',sans-serif}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 26px 22px;font-size:.96rem}

/* ---------- Final CTA ---------- */
.final-cta{text-align:center;background:
  linear-gradient(rgba(20,16,13,.55),rgba(20,16,13,.88)),var(--mocha-2);
  border-top:1px solid rgba(201,162,75,.3)}
.final-cta h2{max-width:760px;margin:0 auto 18px}
.final-cta p{max-width:560px;margin:0 auto 32px}

/* ---------- Footer ---------- */
footer{background:#0d0a08;border-top:1px solid rgba(201,162,75,.2);padding:44px 0 30px}
.footer-grid{display:flex;justify-content:space-between;align-items:center;gap:26px;
  flex-wrap:wrap}
.footer-grid .brand img{width:38px;height:38px}
footer p{font-size:.82rem;color:var(--muted)}

/* ---------- Floating WhatsApp ---------- */
.wa-float{
  position:fixed;bottom:24px;right:22px;z-index:1100;
  display:flex;align-items:center;gap:10px;
  background:var(--wa);color:#fff;border:none;cursor:pointer;
  padding:15px 22px;border-radius:999px;font-family:'Jost',sans-serif;
  font-size:.95rem;font-weight:500;box-shadow:0 10px 30px rgba(37,211,102,.5);
  animation:waPulse 2.4s infinite;
}
.wa-float svg{width:24px;height:24px}
@keyframes waPulse{
  0%,100%{box-shadow:0 10px 30px rgba(37,211,102,.5)}
  50%{box-shadow:0 10px 38px rgba(37,211,102,.85)}
}
@media (prefers-reduced-motion:reduce){
  .wa-float{animation:none}
  *{transition:none!important;scroll-behavior:auto}
}

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
  .hero-grid,.split,.loc-grid{grid-template-columns:1fr;gap:44px}
  .services-grid,.testi-grid{grid-template-columns:1fr 1fr}
  .hero-photo .arch img{height:440px}
  nav.desktop .nav-link{display:none}
}
@media (max-width:700px){
  section{padding:60px 0}
  body{font-size:15.5px}
  nav.desktop{display:none}
  .hamburger{display:block}
  .services-grid,.testi-grid{grid-template-columns:1fr}
  .trust-grid{grid-template-columns:1fr 1fr;gap:18px}
  .hero{padding:44px 0 70px}
  .hero-photo .arch img{height:380px}
  .hero-ctas .btn-wa,.hero-ctas .btn-gold{width:100%;justify-content:center}
  .wa-float span{display:none}
  .wa-float{padding:16px;border-radius:50%}
  .split .arch-sm img{height:340px}
  .footer-grid{flex-direction:column;text-align:center}
}
