/* ═══════════════════════════════════════════════════════════
   SAVIÁ SPA & WELLNESS — main.css
   Paleta sage/eucalipto · Cormorant + Parisienne + Jost
═══════════════════════════════════════════════════════════ */

:root{
  /* color */
  --ink:            #2A322A;
  --eucalyptus:     #5C7060;
  --eucalyptus-deep:#39473B;
  --sage:           #8AA081;
  --sage-soft:      #BACDB8;
  --mist:           #E8EFE4;
  --cream:          #F8F6F0;
  --white:          #FFFFFF;
  --clay:           #C2A06A;
  --line:           #E3E9DF;

  /* tipografía */
  --serif:  "Cormorant Garamond", Georgia, serif;
  --script: "Parisienne", cursive;
  --sans:   "Jost", system-ui, sans-serif;

  /* layout */
  --container: 1180px;
  --radius: 16px;
  --shadow: 0 18px 50px rgba(57,71,59,.10);
  --shadow-sm: 0 8px 24px rgba(57,71,59,.08);
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ── reset ───────────────────────────────────────────── */
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:90px; }
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--white);
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ text-decoration:none; color:inherit; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
.svg-sprite{ position:absolute; width:0; height:0; overflow:hidden; }

.container{ width:90%; max-width:var(--container); margin:0 auto; }

/* ── tipografía base ─────────────────────────────────── */
.h2{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(2rem, 4.5vw, 3.2rem);
  line-height:1.1;
  letter-spacing:.5px;
  color:var(--ink);
}
.h2--light{ color:var(--white); }
.script{
  font-family:var(--script);
  font-weight:400;
  color:var(--clay);
  letter-spacing:0;
}
.script--inline{ font-size:1.15em; line-height:1; }

.muted{ color:#5d6a5c; font-weight:300; font-size:1.02rem; }

.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.72rem; font-weight:500; letter-spacing:.28em;
  text-transform:uppercase; color:var(--eucalyptus);
  margin-bottom:1rem;
}
.eyebrow__line{ width:34px; height:1px; background:var(--clay); display:inline-block; }
.eyebrow--center{ justify-content:center; }
.eyebrow--light{ color:#bccdb5; }
.eyebrow--light .eyebrow__line{ background:#bccdb5; }

/* ── botones ─────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--sans); font-weight:500; font-size:.9rem; letter-spacing:.02em;
  padding:.85rem 1.7rem; border-radius:40px;
  transition:all .35s var(--ease);
  cursor:pointer; white-space:nowrap;
}
.btn--solid{ background:var(--eucalyptus); color:var(--white); }
.btn--solid:hover{ background:var(--eucalyptus-deep); transform:translateY(-2px); box-shadow:0 12px 24px rgba(57,71,59,.25); }
.btn--outline{ border:1.5px solid var(--eucalyptus); color:var(--eucalyptus); background:transparent; }
.btn--outline:hover{ background:var(--eucalyptus); color:var(--white); }
.btn--ghost{ color:var(--eucalyptus); padding-left:.4rem; padding-right:.4rem; }
.btn--ghost:hover{ color:var(--clay); gap:.8rem; }
.btn--lg{ padding:1rem 2.1rem; font-size:.95rem; }
.btn--sm{ padding:.55rem 1.1rem; font-size:.82rem; }
.btn--block{ width:100%; }
.btn--solid i, .btn--ghost i{ font-size:.95em; }

/* ── secciones ───────────────────────────────────────── */
.section{ padding:6.5rem 0; }
.section--cream{ background:var(--cream); }
.section__head{ text-align:center; max-width:620px; margin:0 auto 3.5rem; }
.section__sub{ margin-top:.8rem; }

/* ═══════════════════════════════════════════════════════
   TOP BAR
═══════════════════════════════════════════════════════ */
.topbar{ background:var(--eucalyptus-deep); color:#dbe5d6; font-size:.8rem; }
.topbar__inner{ display:flex; justify-content:space-between; align-items:center; height:42px; }
.topbar__info{ display:flex; align-items:center; gap:1rem; }
.topbar__info i{ color:var(--clay); margin-right:.35rem; }
.topbar__sep{ width:1px; height:14px; background:rgba(255,255,255,.2); }
.topbar__social{ display:flex; gap:.4rem; }
.topbar__social a{
  width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%; font-size:.78rem; line-height:1; transition:all .3s;
}
.topbar__social a:hover{ background:var(--clay); color:var(--eucalyptus-deep); }

/* ═══════════════════════════════════════════════════════
   NAVBAR
═══════════════════════════════════════════════════════ */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:box-shadow .3s, border-color .3s;
}
.nav.scrolled{ box-shadow:0 6px 24px rgba(57,71,59,.07); border-color:var(--line); }
.nav__inner{ display:flex; align-items:center; justify-content:space-between; height:78px; }

.brand{ display:flex; align-items:center; gap:.55rem; color:var(--eucalyptus); }
.brand__mark{ width:34px; height:34px; }
.brand__name{
  font-family:var(--serif); font-weight:600; font-size:1.7rem;
  color:var(--ink); letter-spacing:.5px;
}
.brand__dot{ color:var(--clay); }
.brand--light .brand__name{ color:var(--white); }
.brand--light{ color:var(--sage-soft); }

.nav__links{ display:flex; align-items:center; gap:2.1rem; }
.nav__links a{ font-size:.92rem; font-weight:400; color:var(--ink); transition:color .25s; position:relative; }
.nav__links a:not(.nav__cta)::after{
  content:""; position:absolute; left:0; bottom:-6px; width:0; height:1.5px;
  background:var(--clay); transition:width .3s var(--ease);
}
.nav__links a:not(.nav__cta):hover{ color:var(--eucalyptus); }
.nav__links a:not(.nav__cta):hover::after{ width:100%; }
.nav__cta{ margin-left:.4rem; }

.nav__toggle{ display:none; flex-direction:column; gap:5px; padding:6px; }
.nav__toggle span{ width:24px; height:2px; background:var(--ink); border-radius:2px; transition:.3s var(--ease); }
.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); }

/* ═══════════════════════════════════════════════════════
   DECORACIONES
═══════════════════════════════════════════════════════ */
.deco{ position:absolute; pointer-events:none; z-index:1; }
.deco--leaf{ color:var(--sage); opacity:.5; }
.deco--leaf svg{ width:100%; height:100%; }
.deco--circle{ border-radius:50%; }
.deco--dots{
  width:90px; height:90px;
  background-image:radial-gradient(var(--sage-soft) 1.6px, transparent 1.6px);
  background-size:13px 13px; opacity:.7;
}
@keyframes floaty{ 0%,100%{ transform:translateY(0) rotate(var(--r,0)); } 50%{ transform:translateY(-14px) rotate(var(--r,0)); } }

/* ═══════════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════════ */
.hero{ position:relative; background:var(--mist); overflow:hidden; }
.hero__inner{
  display:grid; grid-template-columns:1fr 1.08fr; gap:3rem; align-items:center;
  padding:5rem 0 5.5rem; position:relative; z-index:2;
}
.hero__title{
  font-family:var(--serif); font-weight:500;
  font-size:clamp(2.8rem, 6vw, 4.6rem); line-height:1.04;
  color:var(--ink); margin:.3rem 0 1.3rem; letter-spacing:.5px;
}
.hero__title .script{ font-size:1.05em; display:inline-block; margin-top:.1em; }
.hero__lead{ max-width:430px; color:#52604f; font-weight:300; font-size:1.08rem; margin-bottom:2rem; }
.hero__actions{ display:flex; gap:1rem; flex-wrap:wrap; align-items:center; margin-bottom:2.2rem; }
.hero__rating{ display:flex; align-items:center; gap:.7rem; font-size:.9rem; color:#5d6a5c; }
.hero__rating .stars{ color:var(--clay); font-size:.85rem; letter-spacing:1px; }
.hero__rating strong{ color:var(--ink); }

.hero__media{ position:relative; z-index:2; display:flex; justify-content:center; }
.hero__badge{
  position:absolute; bottom:22px; left:0;
  background:var(--white); border-radius:14px; padding:.85rem 1.2rem;
  display:flex; align-items:center; gap:.7rem; box-shadow:var(--shadow-sm);
}
.hero__badge i{ color:var(--clay); font-size:1.5rem; }
.hero__badge strong{ display:block; font-family:var(--serif); font-size:1.3rem; color:var(--ink); line-height:1; }
.hero__badge span{ font-size:.78rem; color:#6b776a; }

/* posiciones decoraciones hero */
.deco--hero-dots{ top:60px; right:46%; }
.deco--hero-leaf1{ width:54px; height:54px; top:40px; left:42%; --r:-18deg; animation:floaty 7s var(--ease) infinite; }
.deco--hero-leaf2{ width:64px; height:64px; bottom:50px; right:30px; --r:14deg; animation:floaty 8s var(--ease) infinite .5s; color:var(--clay); opacity:.45; }
.deco--hero-circle{ width:16px; height:16px; background:var(--clay); top:120px; left:36%; opacity:.5; }

/* ── marco de foto orgánico (blob) ───────────────────── */
.photo{
  position:relative; width:100%; max-width:420px; aspect-ratio:5/6;
  display:grid; place-items:center;
  background:linear-gradient(150deg, var(--sage-soft), var(--mist) 70%);
  overflow:hidden;
}
.photo--blob1{
  max-width:560px; aspect-ratio:1/1;
  border-radius:46% 54% 56% 44% / 52% 44% 56% 48%;
  transition:border-radius 1.1s var(--ease);
  background:linear-gradient(150deg,#cfdcc9,#e7efe2);
}
.photo--blob1:hover{ border-radius:62% 38% 42% 58% / 44% 58% 42% 56%; }
.photo--blob2{ border-radius:46% 54% 60% 40% / 53% 45% 55% 47%; max-width:440px; aspect-ratio:1/1; }
.photo--blob3{ border-radius:54% 46% 43% 57% / 47% 56% 44% 53%; }
.photo__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.photo.is-photo{ background:none; }
.gallery__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--ease); cursor:pointer; }
.gallery__item:hover .gallery__img{ transform:scale(1.06); }
.gallery__zoom{
  position:absolute; inset:0; z-index:2; display:grid; place-items:center;
  background:linear-gradient(to top, rgba(57,71,59,.5), rgba(57,71,59,.05));
  opacity:0; transition:opacity .4s var(--ease); pointer-events:none;
}
.gallery__item:hover .gallery__zoom{ opacity:1; }
.gallery__zoom i{
  width:48px; height:48px; border-radius:50%;
  background:rgba(248,246,240,.94); color:var(--eucalyptus);
  display:grid; place-items:center; font-size:1rem;
  transform:translateY(10px); transition:transform .4s var(--ease);
}
.gallery__item:hover .gallery__zoom i{ transform:translateY(0); }

/* ── Lightbox ──────────────────────────────────────────── */
.lightbox{
  position:fixed; inset:0; z-index:200; display:none;
  align-items:center; justify-content:center; padding:4vw;
  background:rgba(42,50,42,.93); backdrop-filter:blur(4px);
}
.lightbox.open{ display:flex; animation:lbfade .3s var(--ease); }
.lightbox__img{
  max-width:92vw; max-height:88vh; border-radius:10px; box-shadow:0 24px 70px rgba(0,0,0,.45);
  opacity:0; transform:scale(.97); transition:opacity .4s var(--ease), transform .4s var(--ease);
}
.lightbox__img.ready{ opacity:1; transform:scale(1); }
.lightbox__close{
  position:absolute; top:18px; right:28px; font-size:2.6rem; line-height:1;
  color:#fff; opacity:.85; transition:opacity .2s, transform .2s; z-index:3;
}
.lightbox__close:hover{ opacity:1; transform:scale(1.1); }
.lightbox__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:3;
  width:50px; height:50px; border-radius:50%;
  background:rgba(248,246,240,.14); color:#fff; font-size:1.05rem;
  display:grid; place-items:center; backdrop-filter:blur(4px);
  transition:background .25s, color .25s, transform .25s;
}
.lightbox__nav:hover{ background:var(--clay); color:var(--eucalyptus-deep); }
.lightbox__prev{ left:max(16px, 3vw); }
.lightbox__next{ right:max(16px, 3vw); }
.lightbox__prev:hover{ transform:translateY(-50%) translateX(-3px); }
.lightbox__next:hover{ transform:translateY(-50%) translateX(3px); }
@keyframes lbfade{ from{ opacity:0 } to{ opacity:1 } }

/* ═══════════════════════════════════════════════════════
   RELAX
═══════════════════════════════════════════════════════ */
.relax__inner{ display:grid; grid-template-columns:1fr 1.05fr; gap:4rem; align-items:center; }
.relax__media{ position:relative; display:flex; justify-content:center; }
.deco--relax-dots{ bottom:-16px; left:-10px; z-index:0; }
.relax__text .h2{ margin:.2rem 0 1rem; }
.relax__text .muted{ margin-bottom:2.2rem; }

.features{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:2rem; }
.feature{ text-align:center; }
.feature__icon{
  width:74px; height:74px; margin:0 auto .7rem; border-radius:50%;
  display:grid; place-items:center; background:var(--mist);
  color:var(--eucalyptus); transition:all .35s var(--ease);
}
.feature__icon svg{ width:38px; height:38px; }
.feature:hover .feature__icon{ background:var(--eucalyptus); color:var(--white); transform:translateY(-5px); }
.feature h3{ font-family:var(--sans); font-weight:500; font-size:.92rem; color:var(--ink); }

/* ═══════════════════════════════════════════════════════
   SERVICIOS
═══════════════════════════════════════════════════════ */
.services__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:2.4rem 2rem; text-align:center; transition:all .4s var(--ease);
}
.card__icon{
  width:80px; height:80px; margin:0 auto 1.3rem; border-radius:50%;
  display:grid; place-items:center; background:var(--mist); color:var(--eucalyptus);
  transition:all .4s var(--ease);
}
.card__icon svg{ width:42px; height:42px; }
.card h3{ font-family:var(--serif); font-weight:600; font-size:1.5rem; color:var(--ink); margin-bottom:.6rem; }
.card p{ font-size:.94rem; color:#5d6a5c; font-weight:300; margin-bottom:1.1rem; }
.card__price{ font-size:.82rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--clay); }
.card:hover{ transform:translateY(-8px); box-shadow:var(--shadow); border-color:transparent; }
.card:hover .card__icon{ background:var(--eucalyptus); color:var(--white); }

/* ═══════════════════════════════════════════════════════
   NOSOTROS
═══════════════════════════════════════════════════════ */
.about__inner{ display:grid; grid-template-columns:1fr 1.1fr; gap:4rem; align-items:center; }
.about__media{ position:relative; display:flex; justify-content:center; }
.deco--about-circle{ width:120px; height:120px; border:1.5px solid var(--clay); opacity:.4; top:-22px; right:6%; }
.about__text .h2{ margin:.2rem 0 1rem; }
.checklist{ margin:1.6rem 0 2rem; display:grid; gap:.8rem; }
.checklist li{ display:flex; align-items:center; gap:.7rem; font-size:.98rem; color:#3f4b3e; font-weight:300; }
.checklist i{ color:var(--eucalyptus); font-size:.85rem; }

.stats{ display:flex; gap:2.5rem; border-top:1px solid var(--line); padding-top:1.8rem; }
.stat strong{ font-family:var(--serif); font-weight:600; font-size:2.4rem; color:var(--eucalyptus); line-height:1; display:block; }
.stat span{ font-size:.82rem; color:#6b776a; }

/* ═══════════════════════════════════════════════════════
   GALERÍA
═══════════════════════════════════════════════════════ */
.gallery__grid{
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:200px; gap:1.1rem;
  grid-auto-flow:dense;
}
.gallery__item{
  border-radius:var(--radius); overflow:hidden; position:relative;
  background:linear-gradient(150deg,#cfdcc9,#e7efe2); display:grid; place-items:center;
}
.gallery__item--tall{ grid-row:span 2; }
.gallery__item--wide{ grid-column:span 2; }
.gallery__note{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  margin-top:1.8rem; font-size:.9rem; color:var(--eucalyptus); font-weight:500;
  transition:color .25s, gap .25s;
}
.gallery__note strong{ color:var(--clay); }
.gallery__note:hover{ color:var(--clay); gap:.8rem; }

/* ═══════════════════════════════════════════════════════
   TESTIMONIOS
═══════════════════════════════════════════════════════ */
.testi__viewport{ max-width:760px; margin:0 auto; overflow:hidden; }
.testi__track{ display:flex; transition:transform .5s var(--ease); }
.quote{ min-width:100%; text-align:center; padding:0 1rem; }
.quote__mark{ font-size:1.8rem; color:var(--sage-soft); margin-bottom:1rem; }
.quote blockquote{
  font-family:var(--serif); font-weight:500; font-size:clamp(1.3rem,2.5vw,1.7rem);
  line-height:1.5; color:var(--ink); margin-bottom:1.6rem; font-style:italic;
}
.quote figcaption{ display:inline-flex; align-items:center; gap:.8rem; text-align:left; }
.quote .quote__avatar{
  width:46px; height:46px; border-radius:50%; display:grid; place-items:center;
  background:var(--eucalyptus); color:var(--white); font-family:var(--serif); font-size:1.3rem;
  flex-shrink:0;
}
.quote figcaption strong{ color:var(--ink); font-weight:500; font-size:.95rem; }
.quote figcaption span{ font-size:.85rem; color:#6b776a; font-weight:300; }
.testi__dots{ display:flex; justify-content:center; gap:.6rem; margin-top:2rem; }
.testi__dots button{ width:9px; height:9px; border-radius:50%; background:var(--sage-soft); transition:all .3s; }
.testi__dots button.active{ background:var(--eucalyptus); width:26px; border-radius:5px; }

/* ═══════════════════════════════════════════════════════
   CTA
═══════════════════════════════════════════════════════ */
.cta{ position:relative; background:var(--eucalyptus-deep); color:var(--white); padding:5rem 0; overflow:hidden; text-align:center; }
.cta__inner{ position:relative; z-index:2; max-width:640px; }
.cta .h2{ margin:.2rem 0 1rem; }
.cta__lead{ color:#cdd9c8; font-weight:300; margin-bottom:2rem; }
.cta__actions{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.cta .btn--solid{ background:var(--clay); color:var(--eucalyptus-deep); }
.cta .btn--solid:hover{ background:#d4b67f; }
.deco--cta-leaf1{ width:130px; height:130px; top:-20px; left:-20px; color:var(--sage); opacity:.18; }
.deco--cta-leaf1 svg, .deco--cta-leaf2 svg{ width:100%; height:100%; }
.deco--cta-leaf2{ width:160px; height:160px; bottom:-40px; right:-30px; color:var(--sage); opacity:.18; }

/* ═══════════════════════════════════════════════════════
   CONTACTO
═══════════════════════════════════════════════════════ */
.contact__inner{ display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; margin-bottom:3rem; }
.contact__info .h2{ margin:.2rem 0 1.8rem; }
.contact__list{ display:grid; gap:1.3rem; margin-bottom:2rem; }
.contact__list li{ display:flex; gap:1rem; align-items:flex-start; }
.contact__ic{
  width:46px; height:46px; flex-shrink:0; border-radius:50%; display:grid; place-items:center;
  background:var(--white); color:var(--eucalyptus); box-shadow:var(--shadow-sm);
}
.contact__list strong{ font-weight:500; color:var(--ink); }
.contact__list div{ font-size:.95rem; color:#5d6a5c; font-weight:300; }

.hours{ width:100%; border-collapse:collapse; }
.hours td{ padding:.7rem 0; border-bottom:1px solid var(--line); font-size:.92rem; }
.hours td:first-child{ color:#5d6a5c; font-weight:300; }
.hours td:last-child{ text-align:right; color:var(--ink); font-weight:500; }
.hours tr:last-child td{ border-bottom:none; }

.contact__form{ background:var(--white); padding:2.5rem; border-radius:var(--radius); box-shadow:var(--shadow); }
.contact__form h3{ font-family:var(--serif); font-weight:600; font-size:1.7rem; color:var(--ink); margin-bottom:1.4rem; }
.field{ margin-bottom:1.1rem; }
.field label{ display:block; font-size:.82rem; font-weight:500; color:var(--ink); margin-bottom:.4rem; }
.field input, .field select, .field textarea{
  width:100%; padding:.8rem 1rem; border:1px solid var(--line); border-radius:10px;
  font-family:var(--sans); font-size:.92rem; color:var(--ink); background:var(--cream);
  transition:border-color .25s, background .25s;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--eucalyptus); background:var(--white);
}
.field textarea{ resize:vertical; }
.form__hint{ font-size:.78rem; color:#8a948a; text-align:center; margin-top:.8rem; }

.contact__map{ position:relative; border-radius:var(--radius); overflow:hidden; height:340px; box-shadow:var(--shadow-sm); }
.contact__map iframe{ width:100%; height:100%; border:0; filter:grayscale(.25) saturate(.9); }
.contact__directions{
  position:absolute; right:16px; top:16px; z-index:2;
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--white); color:var(--eucalyptus);
  padding:.62rem 1.15rem; border-radius:30px; font-size:.85rem; font-weight:500;
  box-shadow:var(--shadow-sm); transition:all .3s var(--ease);
}
.contact__directions i{ color:var(--clay); transition:color .3s; }
.contact__directions:hover{ background:var(--eucalyptus); color:var(--white); transform:translateY(-2px); }
.contact__directions:hover i{ color:var(--white); }

/* ═══════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════ */
.footer{ background:var(--eucalyptus-deep); color:#c3d0bd; }
.footer__inner{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:2.5rem; padding:4rem 0 3rem; }
.footer__brand p{ font-size:.92rem; font-weight:300; margin:1rem 0 1.3rem; max-width:280px; line-height:1.7; }
.footer__social{ display:flex; gap:.6rem; }
.footer__social a{
  width:40px; height:40px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16);
  color:#eaf1e6; font-size:1rem; line-height:1; transition:all .3s var(--ease);
}
.footer__social a i{ line-height:1; }
.footer__social a:hover{ background:var(--clay); border-color:var(--clay); color:var(--eucalyptus-deep); transform:translateY(-3px); }
.footer__col h4{ font-family:var(--sans); font-weight:500; font-size:.82rem; letter-spacing:.15em; text-transform:uppercase; color:var(--white); margin-bottom:1.2rem; }
.footer__col > a, .footer__col > p{ display:block; font-size:.9rem; font-weight:300; color:#c3d0bd; margin-bottom:.7rem; transition:color .25s; }
.footer__col > a:hover{ color:var(--clay); }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.1); }
.footer__bottom-inner{ display:flex; justify-content:space-between; align-items:center; padding:1.4rem 0; font-size:.82rem; color:#9aa896; flex-wrap:wrap; gap:.5rem; }
.footer__credit a{ color:var(--clay); }
.footer__credit a:hover{ text-decoration:underline; }

/* ═══════════════════════════════════════════════════════
   FAB / TO-TOP / COOKIES
═══════════════════════════════════════════════════════ */
.fab{
  position:fixed; bottom:24px; right:24px; z-index:90;
  width:56px; height:56px; border-radius:50%; background:#25D366; color:var(--white);
  display:grid; place-items:center; font-size:1.6rem; box-shadow:0 8px 24px rgba(37,211,102,.4);
  transition:transform .3s;
}
.fab:hover{ transform:scale(1.08); }

.totop{
  position:fixed; bottom:90px; right:28px; z-index:89;
  width:44px; height:44px; border-radius:50%; background:var(--eucalyptus); color:var(--white);
  display:grid; place-items:center; box-shadow:var(--shadow-sm);
  opacity:0; visibility:hidden; transform:translateY(10px); transition:all .3s var(--ease);
}
.totop.show{ opacity:1; visibility:visible; transform:translateY(0); }
.totop:hover{ background:var(--eucalyptus-deep); }

/* ── Sonido ambiente ──────────────────────────────────── */
.ambient{
  position:fixed; bottom:24px; left:24px; z-index:90;
  width:52px; height:52px; border-radius:50%;
  background:var(--clay); color:var(--eucalyptus-deep);
  display:grid; place-items:center;
  border:none; box-shadow:0 8px 22px rgba(194,160,106,.45);
  transition:transform .3s var(--ease), background .3s;
}
.ambient:hover{ transform:scale(1.08); background:#cdac74; }
.ambient.on{ animation:ambientPulse 2s ease-in-out infinite; }
.ambient i{ font-size:1.12rem; }
.ambient.on i{ display:none; }
.ambient__wave{ display:none; align-items:center; gap:3px; height:18px; }
.ambient.on .ambient__wave{ display:inline-flex; }
.ambient__wave span{ width:3px; height:6px; background:var(--eucalyptus-deep); border-radius:2px; animation:wave 1s ease-in-out infinite; }
.ambient__wave span:nth-child(2){ animation-delay:.2s; }
.ambient__wave span:nth-child(3){ animation-delay:.4s; }
@keyframes wave{ 0%,100%{ height:5px } 50%{ height:16px } }
@keyframes ambientPulse{
  0%{ box-shadow:0 8px 22px rgba(194,160,106,.4), 0 0 0 0 rgba(194,160,106,.55) }
  70%{ box-shadow:0 8px 22px rgba(194,160,106,.4), 0 0 0 14px rgba(194,160,106,0) }
  100%{ box-shadow:0 8px 22px rgba(194,160,106,.4), 0 0 0 0 rgba(194,160,106,0) }
}

.cookies{
  position:fixed; bottom:18px; left:50%; right:auto;
  width:calc(100% - 36px); max-width:520px; z-index:95;
  background:var(--white); border:1px solid var(--line); border-radius:14px;
  padding:1.2rem 1.4rem; box-shadow:var(--shadow);
  display:flex; align-items:center; gap:1.2rem; flex-wrap:wrap;
  transform:translate(-50%,160%); transition:transform .5s var(--ease);
}
.cookies.show{ transform:translate(-50%,0); }
.cookies p{ font-size:.84rem; color:#5d6a5c; font-weight:300; flex:1; min-width:200px; }
.cookies a{ color:var(--eucalyptus); text-decoration:underline; }
.cookies__actions{ display:flex; gap:.6rem; }

/* ═══════════════════════════════════════════════════════
   REVEAL ON SCROLL
═══════════════════════════════════════════════════════ */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* ═══════════════════════════════════════════════════════
   LEGAL PAGES
═══════════════════════════════════════════════════════ */
.legal-hero{ background:var(--mist); padding:5rem 0 3.5rem; text-align:center; }
.legal-hero h1{ font-family:var(--serif); font-weight:600; font-size:clamp(2.2rem,5vw,3.2rem); color:var(--ink); }
.legal-hero p{ color:#5d6a5c; font-weight:300; margin-top:.5rem; }
.legal{ max-width:820px; margin:0 auto; padding:4rem 0 5rem; }
.legal-section{ margin-bottom:2.5rem; }
.legal-section h2{ font-family:var(--serif); font-weight:600; font-size:1.6rem; color:var(--eucalyptus); margin-bottom:.8rem; }
.legal-section h3{ font-family:var(--sans); font-weight:500; font-size:1.05rem; color:var(--ink); margin:1.2rem 0 .5rem; }
.legal-section p, .legal-section li{ font-size:.96rem; color:#44503f; font-weight:300; line-height:1.8; }
.legal-section ul{ list-style:disc; padding-left:1.4rem; margin:.6rem 0; }
.legal-section li{ margin-bottom:.4rem; }
.legal-hl{ background:var(--cream); border-left:3px solid var(--clay); padding:1rem 1.3rem; border-radius:0 10px 10px 0; margin:1rem 0; }
.legal-hl p{ margin:0; }
.legal-table{ width:100%; border-collapse:collapse; margin:1rem 0; font-size:.9rem; }
.legal-table th, .legal-table td{ border:1px solid var(--line); padding:.7rem .9rem; text-align:left; }
.legal-table th{ background:var(--mist); font-weight:500; color:var(--ink); }
.legal-table td{ color:#44503f; font-weight:300; }
.legal-back{ display:inline-flex; align-items:center; gap:.5rem; margin-top:1rem; color:var(--eucalyptus); font-size:.9rem; font-weight:500; }
.legal-back:hover{ color:var(--clay); }
:target{ animation:flash 1.4s var(--ease); }
@keyframes flash{ 0%{ background:rgba(194,160,106,.18); } 100%{ background:transparent; } }

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════════════ */
@media (max-width:980px){
  .nav__toggle{ display:flex; }
  .nav__links{
    position:absolute; top:78px; left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:var(--white); border-bottom:1px solid var(--line);
    padding:0 5%; max-height:0; overflow:hidden; transition:max-height .4s var(--ease);
  }
  .nav__links.open{ max-height:420px; padding:1rem 5% 1.5rem; }
  .nav__links a{ width:100%; padding:.85rem 0; border-bottom:1px solid var(--line); }
  .nav__links a:last-child{ border-bottom:none; }
  .nav__cta{ margin-top:.6rem; justify-content:center; }

  .hero__inner, .relax__inner, .about__inner, .contact__inner{ grid-template-columns:1fr; gap:3rem; }
  .hero__media, .relax__media, .about__media{ order:-1; }
  .hero__lead{ max-width:none; }
  .services__grid{ grid-template-columns:repeat(2,1fr); }
  .footer__inner{ grid-template-columns:1fr 1fr; gap:2rem; }
  .gallery__grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:560px){
  .section{ padding:4.5rem 0; }
  .topbar__info span:first-child{ display:none; }
  .features{ grid-template-columns:repeat(2,1fr); gap:1.5rem; }
  .services__grid{ grid-template-columns:1fr; }
  .stats{ gap:1.5rem; }
  .stat strong{ font-size:2rem; }
  .footer__inner{ grid-template-columns:1fr; }
  .gallery__grid{ grid-template-columns:1fr; grid-auto-rows:180px; }
  .gallery__item--wide, .gallery__item--tall{ grid-column:auto; grid-row:auto; }
  .cookies{ flex-direction:column; align-items:stretch; text-align:center; }
  .cookies__actions{ justify-content:center; }
  .footer__bottom-inner{ justify-content:center; text-align:center; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}