/* ============================================================
   YOS Beauty Studio — hoja de estilos
   Paleta y tipografía del estudio. Editable a mano.
   ============================================================ */

:root{
  --lino:#F6F1EA; --marfil:#FBF8F3; --arena:#EAE0D3;
  --greige:#CBBBA6; --topo:#A8977F; --roble:#D9C3A0;
  --salvia:#8B9280; --salvia-hond:#6E7563; --champan:#B99A5B;
  --espresso:#33291F; --cacao:#5B4E40; --radius:14px;
  --pad-sec:clamp(44px,6.5vh,80px) clamp(20px,5vw,64px);
  --gutter:clamp(20px,5vw,64px);
  --nav-h:90px;     /* barra en reposo, arriba del todo */
  --nav-h-min:64px; /* barra compacta (67px): 64 mete la seccion 3px por detras */
}

/* Al saltar a un ancla la barra ya esta compacta: la seccion arranca justo
   debajo, sin que asome el final de la anterior */
[id]{ scroll-margin-top:var(--nav-h-min); }

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--lino); color:var(--espresso);
  font-family:'Manrope',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{ max-width:100%; }
::selection{ background:var(--salvia); color:var(--marfil); }
a{ color:var(--espresso); text-decoration:none; }
a:hover{ color:var(--salvia-hond); }
h1,h2,h3,h4{ font-family:'Fraunces',serif; font-weight:400; letter-spacing:-.02em; margin:0; }
button{ font-family:inherit; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* ---------- Grano ---------- */
.grain{
  position:fixed; inset:0; z-index:9999; pointer-events:none;
  mix-blend-mode:multiply; opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ---------- Utilidades ---------- */
.wrap{ max-width:1240px; margin:0 auto; }
.section{ padding:var(--pad-sec); }
.bg-lino{ background:var(--lino); }
.bg-marfil{ background:var(--marfil); }
.eyebrow{
  display:flex; align-items:center; gap:12px; margin-bottom:18px;
  font-size:12px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--champan); font-weight:600;
}
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--champan); flex:none; }
.h2{ line-height:1.02; font-size:clamp(2.2rem,5vw,3.6rem); }
.h2 em, .h1 em{ font-style:italic; }
.lede{ margin:18px 0 0; font-size:1.06rem; line-height:1.6; color:var(--cacao); max-width:56ch; text-wrap:pretty; }
.rule-gold{ height:1px; background:linear-gradient(90deg,var(--champan),transparent); }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:16px 30px; border-radius:999px; font-weight:600; font-size:15px;
  letter-spacing:.01em; cursor:pointer; border:1px solid transparent;
  transition:transform .3s ease, background .3s ease, color .3s ease, border-color .3s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn--light{ background:var(--marfil); color:var(--espresso); border-color:var(--marfil); }
.btn--light:hover{ color:var(--espresso); }
.btn--dark{ background:var(--espresso); color:var(--lino); border-color:var(--espresso); }
.btn--dark:hover{ color:var(--lino); }
.btn--outline{ background:transparent; color:var(--marfil); border-color:rgba(246,241,234,.5); }
.btn--outline:hover{ color:var(--marfil); border-color:var(--marfil); background:rgba(246,241,234,.08); }
.btn--wa{ background:var(--salvia); color:#fff; border-color:var(--salvia); }
.btn--wa:hover{ background:#25D366; border-color:#25D366; color:#fff; }

/* ---------- Nav ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px var(--gutter); border-bottom:1px solid transparent;
  transition:padding .4s cubic-bezier(.4,0,.2,1), background .4s ease, box-shadow .4s ease, border-color .4s ease;
}
.nav.scrolled{
  padding:12px var(--gutter); background:rgba(40,32,24,.62);
  backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2);
  box-shadow:0 12px 34px -22px rgba(0,0,0,.6); border-bottom-color:rgba(246,241,234,.14);
}
.nav__brand{ display:flex; align-items:center; gap:12px; letter-spacing:.02em; }
.nav__brand img{ width:40px; height:40px; display:block; filter:invert(1); }
.nav__name{ display:flex; flex-direction:column; line-height:1.05; }
.nav__name b{ font-family:'Fraunces',serif; font-weight:500; font-size:19px; color:var(--marfil); }
.nav__name span{ font-size:9.5px; letter-spacing:.3em; text-transform:uppercase; color:#EADFCB; }
.nav__right{ display:flex; align-items:center; gap:clamp(18px,2.4vw,38px); }
.nav__links{ display:flex; gap:clamp(16px,2vw,32px); font-size:14px; }
.nav__links a{ color:var(--marfil); position:relative; transition:color .3s ease; }
.nav__links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-6px; height:1.5px;
  background:var(--champan); transition:right .35s cubic-bezier(.4,0,.2,1);
}
.nav__links a:hover{ color:var(--marfil); }
.nav__links a:hover::after, .nav__links a.active::after{ right:0; }
.nav__links a.active{ color:#fff; }
.nav__cta{ padding:11px 22px; font-size:13px; }
.navmenu{ display:none; position:relative; width:46px; height:46px; flex:none; }
@media (max-width:820px){
  .nav__links, .nav__cta{ display:none; }
  .navmenu{ display:block; }
}

/* ---------- Menú móvil: el propio botón se expande en menú ---------- */
.navmenu__surface{
  position:absolute; top:0; right:0;
  width:46px; max-height:46px; overflow:hidden; border-radius:23px;
  background:rgba(251,248,243,0); border:1px solid rgba(246,241,234,.4);
  box-shadow:0 0 0 rgba(51,41,31,0);
  transition:width .5s cubic-bezier(.16,1,.3,1),
             max-height .55s cubic-bezier(.16,1,.3,1),
             border-radius .5s cubic-bezier(.16,1,.3,1),
             background .3s ease, border-color .3s ease, box-shadow .5s ease;
}
.navmenu.open .navmenu__surface{
  width:250px; max-height:440px; border-radius:20px;
  background:rgba(251,248,243,.85);
  backdrop-filter:blur(12px) saturate(1.1); -webkit-backdrop-filter:blur(12px) saturate(1.1);
  border-color:var(--arena);
  box-shadow:0 26px 60px -24px rgba(51,41,31,.55);
}
.navmenu__btn{
  position:absolute; top:0; right:0; z-index:2;
  width:46px; height:46px; padding:0; border:0; background:transparent; cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:var(--marfil);
  transition:color .35s ease;
}
.navmenu.open .navmenu__btn{ color:var(--espresso); }
.navmenu__bars{ position:relative; width:20px; height:13px; }
.navmenu__bars i{
  position:absolute; left:0; right:0; height:1.6px; border-radius:2px; background:currentColor;
  transition:transform .45s cubic-bezier(.16,1,.3,1), opacity .3s ease;
}
.navmenu__bars i:nth-child(1){ top:0; }
.navmenu__bars i:nth-child(2){ top:5.5px; }
.navmenu__bars i:nth-child(3){ top:11px; }
.navmenu.open .navmenu__bars i:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
.navmenu.open .navmenu__bars i:nth-child(2){ opacity:0; }
.navmenu.open .navmenu__bars i:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }
.navmenu__links{
  margin-top:46px; padding:4px 10px 12px; display:flex; flex-direction:column; gap:2px;
  width:250px;
}
.navmenu__links a{
  font-family:'Fraunces',serif; font-size:1.2rem; color:var(--espresso);
  padding:10px 12px; border-radius:9px; letter-spacing:-.01em; white-space:nowrap;
  transition:background .2s ease, color .2s ease;
}
.navmenu__links a:hover, .navmenu__links a:active{ background:var(--lino); color:var(--salvia-hond); }
.navmenu__links a + a{ border-top:1px solid rgba(203,187,166,.3); }
.navmenu__reservar{
  margin-top:8px; border-top:0 !important; text-align:center; white-space:nowrap;
  background:var(--espresso); color:var(--lino) !important;
  font-family:'Manrope',sans-serif !important; font-size:.9rem !important; font-weight:600;
  border-radius:999px; padding:12px !important;
}
.navmenu__reservar:hover, .navmenu__reservar:active{ background:var(--cacao); color:var(--lino) !important; }

/* ---------- Hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; }
.hero__img{
  position:absolute; inset:0; transform:scale(1.08);
  background:url('assets/hero-estudio.jpg') center/cover no-repeat;
}
.hero__veil-v{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(51,41,31,.48) 0%, rgba(51,41,31,.22) 32%, rgba(51,41,31,.40) 64%, rgba(51,41,31,.85) 100%); }
.hero__veil-h{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(51,41,31,.68) 0%, rgba(51,41,31,.28) 46%, rgba(51,41,31,.10) 72%); }
.hero__inner{ position:relative; z-index:2; width:100%; max-width:1400px; margin:0 auto; padding:calc(var(--nav-h) + 18px) var(--gutter) clamp(48px,7vh,96px); }
.hero__col{ max-width:min(72ch,860px); }
.hero__eyebrow{ display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.hero__eyebrow::before{ content:""; width:26px; height:1px; background:var(--champan); }
.hero__eyebrow span{ font-size:12px; letter-spacing:.34em; text-transform:uppercase; color:#EADFCB; font-weight:600; }
.hero h1{ color:var(--marfil); line-height:.98; font-size:clamp(2.9rem,8.4vw,7rem); display:flow-root; }
/* El padding deja sitio a las colas de j, g, p; el margen negativo lo descuenta
   para que el interlineado no cambie */
.hero h1 .mask{ display:block; overflow:hidden; padding-bottom:.24em; margin-bottom:-.24em; }
.hero h1 .line{ display:block; animation:heroLine 1.05s cubic-bezier(.16,1,.3,1) both; }
.hero h1 .line--it{ font-style:italic; font-weight:300; animation-delay:.12s; }
.hero__sub{ margin:26px 0 0; max-width:52ch; font-size:clamp(1rem,1.5vw,1.22rem); line-height:1.6; color:#EDE4D6; }
.hero__cta{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:34px; }
.hero__proof{ display:flex; align-items:center; gap:18px; margin-top:30px; }
.hero__proof span{ display:inline-flex; align-items:center; gap:7px; font-size:14px; color:#EDE4D6; }
.hero__proof .star{ color:var(--champan); letter-spacing:1px; }
.hero__proof .dot{ width:4px; height:4px; border-radius:50%; background:var(--champan); }
.hero__fade{ animation:heroFade .8s ease both; }
.hero__fade--1{ animation-delay:.15s; }
.hero__fade--2{ animation-delay:.5s; }
.hero__fade--3{ animation-delay:.65s; }
.hero__fade--4{ animation-delay:.78s; }
@keyframes heroLine{ from{ transform:translateY(140%); } to{ transform:translateY(0); } }
@keyframes heroFade{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }

/* ---------- Marquee ---------- */
.marquee{ background:var(--espresso); color:var(--lino); padding:22px 0; overflow:hidden; white-space:nowrap; }
.marquee__track{ display:inline-flex; animation:marquee 34s linear infinite; will-change:transform; }
.marquee__group{ display:inline-flex; align-items:center; }
.marquee__group span{
  display:inline-flex; align-items:center; font-family:'Fraunces',serif; font-style:italic;
  font-weight:300; font-size:clamp(1.3rem,2.6vw,2.1rem); padding:0 clamp(20px,3vw,44px);
}
.marquee__group span::after{
  content:"✦"; color:var(--champan); font-style:normal; font-size:.7em;
  margin-left:clamp(20px,3vw,44px);
}
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------- Reveals ---------- */
[data-reveal]{ opacity:0; transform:translateY(26px); transition:opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1); }
[data-reveal].in{ opacity:1; transform:none; }

/* ---------- El estudio ---------- */
.estudio__grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(28px,4vw,64px); align-items:center; }
.estudio__media{ grid-column:span 12; position:relative; }
.estudio__text{ grid-column:span 12; }
@media (min-width:900px){
  .estudio__media{ grid-column:span 7; }
  .estudio__text{ grid-column:span 5; }
}
.ph{
  position:relative; overflow:hidden;
  background:repeating-linear-gradient(120deg, rgba(139,146,128,.12) 0 2px, transparent 2px 24px),
             radial-gradient(120% 100% at 30% 20%, #E7DCCB, #CBB89B);
}
.ph__label{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  text-align:center; padding:0 28px; font-family:'Manrope',monospace; font-size:11px;
  letter-spacing:.12em; text-transform:uppercase; color:rgba(51,41,31,.45); line-height:1.7;
}
.estudio__photo{ aspect-ratio:4/3; border-radius:calc(var(--radius) + 6px); }
.estudio__portrait{
  position:absolute; right:-6px; bottom:-34px; width:clamp(120px,26%,190px); aspect-ratio:3/4;
  border-radius:var(--radius); overflow:hidden; border:6px solid var(--marfil);
  box-shadow:0 22px 50px -28px rgba(51,41,31,.5);
  background:repeating-linear-gradient(120deg, rgba(185,154,91,.14) 0 2px, transparent 2px 18px),
             radial-gradient(120% 100% at 40% 20%, #DECBAF, #B89E7C);
}
.estudio__portrait .ph__label{ align-items:flex-end; padding:0 12px 14px; font-size:9px; }
.estudio h2{ line-height:1.05; font-size:clamp(2rem,4.4vw,3.2rem); }
.estudio p{ margin:20px 0 0; font-size:1.06rem; line-height:1.65; color:var(--cacao); text-wrap:pretty; }
.estudio p + p{ margin-top:16px; }
.chips{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.chip{
  display:inline-flex; align-items:center; gap:8px; padding:10px 16px;
  border:1px solid var(--arena); border-radius:999px; font-size:13px; font-weight:600;
}
.chip i{ color:var(--champan); font-style:normal; }

/* ---------- Servicios ---------- */
.svc__head{ max-width:720px; margin-bottom:clamp(36px,5vh,56px); }
.tabs{ display:flex; flex-wrap:wrap; gap:10px; border-bottom:1px solid var(--arena); margin-bottom:clamp(32px,5vh,48px); }
.tab{
  appearance:none; cursor:pointer; background:transparent; font-size:15px; font-weight:600;
  padding:12px 4px; margin-bottom:-1px; border:none; border-bottom:2px solid transparent;
  color:var(--topo); transition:color .25s ease, border-color .25s ease;
}
.tab:hover{ color:var(--cacao); }
.tab[aria-selected="true"]{ color:var(--espresso); border-bottom-color:var(--champan); }
.panel[hidden]{ display:none; }
.panel{ animation:panelIn .5s cubic-bezier(.16,1,.3,1) both; }
@keyframes panelIn{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.feat{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
  gap:clamp(14px,1.6vw,20px); margin-bottom:clamp(28px,4vh,44px);
}
.card{
  position:relative; display:flex; flex-direction:column; background:var(--marfil);
  border:1px solid var(--arena); border-radius:var(--radius); overflow:hidden;
  box-shadow:0 1px 2px rgba(51,41,31,.04);
  transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease, border-color .45s ease;
}
.card:hover{ transform:translateY(-4px); box-shadow:0 22px 48px -26px rgba(51,41,31,.45); border-color:var(--champan); }
.card__media{
  position:relative; aspect-ratio:4/3; overflow:hidden;
  background:repeating-linear-gradient(125deg, rgba(139,146,128,.12) 0 2px, transparent 2px 22px),
             radial-gradient(120% 100% at 30% 20%, #E7DCCB, #D6C7B0);
}
.card__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.card__tag{
  position:absolute; top:14px; left:14px; padding:6px 12px; border-radius:999px;
  background:var(--espresso); color:var(--lino); font-size:11px; letter-spacing:.06em; font-weight:600;
}
.card__body{ padding:16px 18px 18px; display:flex; flex-direction:column; flex:1; }
.card__top{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.card__top h3{ font-weight:500; font-size:1.12rem; letter-spacing:-.01em; }
.card__price{ font-family:'Fraunces',serif; font-weight:500; font-size:1.1rem; white-space:nowrap; }
.card .rule-gold{ margin:10px 0 12px; }
.card__pitch{ margin:0 0 14px; font-size:.88rem; line-height:1.5; color:var(--cacao); flex:1; }
.card__dur{
  display:inline-flex; align-items:center; gap:8px; font-size:12px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--salvia-hond);
}
.groups{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); gap:clamp(30px,5vw,64px); }
.group h4{ font-family:'Manrope',sans-serif; margin:0 0 6px; font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--salvia-hond); font-weight:700; }
.group__rule{ height:1px; background:var(--arena); margin-bottom:6px; }
.group ul{ list-style:none; margin:0; padding:0; }
.group li{ display:flex; align-items:baseline; gap:12px; padding:14px 0; border-bottom:1px solid var(--arena); }
.group li .nm{ font-size:1rem; font-weight:500; }
.group li .fill{ flex:1; height:1px; align-self:center; opacity:.6; background:repeating-linear-gradient(90deg, var(--greige) 0 2px, transparent 2px 6px); }
.group li .dur{ font-size:.82rem; color:var(--topo); white-space:nowrap; }
.group li .pr{ font-family:'Fraunces',serif; font-weight:500; font-size:1.02rem; white-space:nowrap; min-width:66px; text-align:right; }

.quizcta{
  margin-top:clamp(40px,6vh,64px); position:relative; overflow:hidden;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:clamp(22px,3vw,44px); padding:clamp(30px,4vw,46px) clamp(26px,3.6vw,52px);
  background:var(--espresso); color:var(--lino); border-radius:calc(var(--radius) + 4px);
}
.quizcta::after{
  content:""; position:absolute; right:-40px; top:-40px; width:200px; height:200px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(185,154,91,.35), transparent 70%);
}
.quizcta__txt{ position:relative; max-width:34ch; }
.quizcta__txt b{ display:block; font-family:'Manrope',sans-serif; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--champan); font-weight:700; margin-bottom:12px; }
.quizcta__txt p{ margin:0; font-family:'Fraunces',serif; line-height:1.1; font-size:clamp(1.5rem,3vw,2.15rem); }
.quizcta__txt em{ font-style:italic; color:var(--roble); }
.quizcta__act{ position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.quizcta__act a{
  font-size:13px; color:#EADFCB; text-decoration:underline; text-underline-offset:3px;
  text-decoration-color:rgba(234,223,203,.4);
}
.quizcta__act a:hover{ color:#EADFCB; text-decoration-color:var(--champan); }

/* ---------- Por qué ---------- */
.why__head{ max-width:680px; margin-bottom:clamp(40px,6vh,60px); }
.why__grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));
  gap:1px; background:var(--arena); border:1px solid var(--arena);
  border-radius:var(--radius); overflow:hidden;
}
.why__cell{ background:var(--marfil); padding:clamp(28px,3vw,40px); display:flex; flex-direction:column; gap:16px; transition:background .4s ease; }
.why__cell:hover{ background:var(--lino); }
.why__cell svg{ color:var(--salvia-hond); }
.why__cell h3{ font-weight:500; font-size:1.28rem; }
.why__cell p{ margin:0; font-size:.98rem; line-height:1.6; color:var(--cacao); }

/* ---------- Reseñas ---------- */
.rev__head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:clamp(40px,6vh,64px); }
.rev__score{ display:flex; align-items:center; gap:22px; padding:16px 22px; border:1px solid var(--arena); border-radius:var(--radius); background:var(--lino); }
.rev__score div{ text-align:center; }
.rev__score b{ display:block; font-family:'Fraunces',serif; font-size:1.9rem; font-weight:500; line-height:1; }
.rev__score b i{ color:var(--champan); font-size:1rem; font-style:normal; }
.rev__score small{ display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--topo); margin-top:4px; }
.rev__sep{ width:1px; height:38px; background:var(--arena); }

/* Muro de reseñas: dos filas en loop continuo (marquee) con relieve 3D.
   Fila 1 = Google · Fila 2 = Booksy */
.revwall{
  display:flex; flex-direction:column; gap:2px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
}
.revwall__row{ overflow:hidden; padding:26px 0; }
.revwall__track{ display:flex; width:max-content; animation:revscroll 78s linear infinite; will-change:transform; }
.revwall__row--reverse .revwall__track{ animation-duration:92s; animation-direction:reverse; }
.revwall:hover .revwall__track{ animation-play-state:paused; }
.revwall__group{ display:flex; gap:20px; padding-right:20px; }
@keyframes revscroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

.qcard{
  margin:0; flex:0 0 250px; width:250px; box-sizing:border-box;
  background:linear-gradient(158deg, var(--cacao) 0%, var(--espresso) 72%);
  border:1px solid rgba(255,255,255,.06); border-radius:var(--radius);
  padding:15px 17px; display:flex; flex-direction:column; color:var(--lino);
  transform:perspective(900px) rotateY(-8deg);
  box-shadow:
    0 2px 4px rgba(30,20,12,.20),
    0 12px 22px -12px rgba(30,20,12,.48),
    0 26px 44px -26px rgba(30,20,12,.42),
    inset 0 1px 0 rgba(255,255,255,.09);
  transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease;
}
.revwall__row--reverse .qcard{ transform:perspective(900px) rotateY(8deg); }
.qcard:hover{
  transform:perspective(900px) rotateY(0deg) translateY(-7px) scale(1.04);
  box-shadow:
    0 8px 14px rgba(30,20,12,.28),
    0 24px 44px -14px rgba(30,20,12,.55),
    0 44px 72px -32px rgba(30,20,12,.5),
    inset 0 1px 0 rgba(255,255,255,.14);
  z-index:3;
}
.qcard__stars{ color:var(--champan); font-size:11px; letter-spacing:2px; margin-bottom:9px; }
.qcard blockquote{ margin:0 0 13px; font-size:.8rem; line-height:1.48; flex:1; text-wrap:pretty; color:#F1E9DD;
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.qcard figcaption{ display:flex; align-items:center; gap:9px; }
.qcard__avatar{
  width:30px; height:30px; border-radius:50%; background:var(--salvia); flex:none;
  display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif;
  font-size:.85rem; color:var(--marfil);
}
.qcard__who{ font-size:11.5px; line-height:1.3; }
.qcard__who strong{ display:block; font-weight:600; color:var(--marfil); }
.qcard__who span{ color:var(--greige); }
/* Móvil: reseñas (muro en loop) y tarjetas de servicio */
@media (max-width:600px){
  /* El muro de reseñas sigue en loop; solo achicamos las tarjetas */
  .qcard{ flex:0 0 210px; width:210px; padding:13px 15px; }
  .qcard__stars{ font-size:10px; margin-bottom:8px; }
  .qcard blockquote{ font-size:.76rem; line-height:1.45; margin-bottom:11px; -webkit-line-clamp:5; }
  .qcard__avatar{ width:27px; height:27px; font-size:.8rem; }
  .revwall__track{ animation-duration:55s; }
  .revwall__row--reverse .revwall__track{ animation-duration:62s; }
  /* Tarjetas de servicio en carrusel horizontal */
  .feat{
    display:flex; justify-content:flex-start; align-items:stretch; grid-template-columns:none; gap:12px;
    overflow-x:auto; overflow-y:hidden; scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    overflow-anchor:none; padding-bottom:6px;
  }
  .feat::-webkit-scrollbar{ display:none; }
  .feat > .card{ flex:0 0 162px; width:162px; max-width:162px; scroll-snap-align:start; }
  /* Tarjetas de servicio con el mismo formato y tamaño que las reseñas */
  .feat{ margin-bottom:clamp(22px,4vh,34px); }
  .card__media{ aspect-ratio:16/10; }
  .card__tag{ top:8px; left:8px; padding:4px 9px; font-size:9.5px; }
  .card__body{ padding:10px 11px; }
  .card__top{ flex-direction:column; align-items:flex-start; gap:2px; }
  .card__top h3{ font-size:.82rem; }
  .card__price{ font-size:1rem; }
  .card .rule-gold{ margin:7px 0 8px; }
  .card__pitch{ flex:0 1 auto; font-size:.7rem; line-height:1.4; margin-bottom:8px;
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .card__dur{ font-size:10px; margin-top:auto; }
}
.link-gold{ display:inline-flex; align-items:center; gap:10px; font-size:14px; font-weight:600; border-bottom:1px solid var(--champan); padding-bottom:4px; }

/* ---------- Galería ---------- */
.gal__head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:clamp(36px,5vh,52px); }
.gal__note{ margin:0; max-width:34ch; font-size:14px; line-height:1.6; color:var(--cacao); }
/* Galería: dos filas en loop continuo (marquee), sentidos opuestos, con relieve 3D */
.galwall{
  display:flex; flex-direction:column; gap:clamp(14px,1.8vw,22px);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
}
.galwall__row{ overflow:hidden; padding:26px 0; }
.galwall__track{ display:flex; width:max-content; animation:revscroll 60s linear infinite; will-change:transform; }
.galwall__row--reverse .galwall__track{ animation-duration:72s; animation-direction:reverse; }
.galwall:hover .galwall__track{ animation-play-state:paused; }
.galwall__group{ display:flex; gap:clamp(14px,1.8vw,22px); padding-right:clamp(14px,1.8vw,22px); }

.gal__tile{
  position:relative; display:block;
  flex:0 0 clamp(150px,42vw,210px); width:clamp(150px,42vw,210px);
  aspect-ratio:4/5; cursor:pointer;
  margin:0; padding:0; border:1px solid rgba(234,224,211,.7);
  border-radius:calc(var(--radius) + 2px); overflow:hidden; background:var(--arena);
  transform:perspective(1000px) rotateY(-6deg);
  box-shadow:
    0 2px 6px rgba(74,54,38,.06),
    0 16px 30px -14px rgba(74,54,38,.28),
    0 34px 56px -30px rgba(74,54,38,.24);
  transition:transform .55s cubic-bezier(.2,.7,.2,1), box-shadow .55s ease;
}
.galwall__row--reverse .gal__tile{ transform:perspective(1000px) rotateY(6deg); }
.gal__tile img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}
.gal__tile::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(155deg, rgba(255,255,255,.22) 0%, transparent 36%, rgba(51,41,31,.12) 100%);
  opacity:.6; transition:opacity .5s ease;
}
.gal__tile:hover{
  transform:perspective(1000px) rotateY(0deg) translateY(-10px) scale(1.05);
  box-shadow:
    0 10px 18px rgba(74,54,38,.12),
    0 30px 54px -16px rgba(74,54,38,.4),
    0 60px 92px -40px rgba(74,54,38,.34);
  z-index:3;
}
.gal__tile:hover img{ transform:scale(1.09); }
.gal__tile:hover::after{ opacity:.25; }

.ig{
  margin-top:clamp(40px,6vh,64px); padding-top:clamp(32px,5vh,48px);
  border-top:1px solid rgba(51,41,31,.12);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px;
}
.ig__txt{ max-width:52ch; }
.ig__txt h3{ line-height:1.1; font-size:clamp(1.6rem,3.4vw,2.4rem); }
.ig__txt h3 a{ font-style:italic; border-bottom:1px solid var(--champan); }
.ig__txt p{ margin:12px 0 0; font-size:1rem; line-height:1.6; color:var(--cacao); }
.ig .btn{ flex-shrink:0; padding:15px 30px; }

/* ---------- Lightbox ---------- */
.lightbox{
  position:fixed; inset:0; z-index:5000; display:none; align-items:center; justify-content:center;
  padding:24px; background:rgba(30,24,18,.86); backdrop-filter:blur(6px);
}
.lightbox.open{ display:flex; }
.lightbox__close, .quiz__close{
  position:absolute; top:24px; right:24px; width:44px; height:44px; border-radius:50%;
  background:rgba(246,241,234,.14); color:var(--lino); border:1px solid rgba(246,241,234,.3);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.lightbox figure{ margin:0; width:min(78vw,560px); max-height:82vh; }
.lightbox__frame{ aspect-ratio:3/4; max-height:74vh; border-radius:var(--radius); overflow:hidden; position:relative; background:var(--arena); }
.lightbox__frame img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* ---------- Test recomendador ---------- */
.quiz{
  position:fixed; inset:0; z-index:5200; display:none; align-items:center; justify-content:center;
  padding:20px; background:rgba(30,24,18,.72);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.quiz.open{ display:flex; }
.quiz__card{
  position:relative; width:min(94vw,560px); max-height:88vh; overflow:auto;
  overscroll-behavior:contain; background:var(--marfil); border:1px solid var(--arena);
  border-radius:calc(var(--radius) + 6px); padding:clamp(26px,4vw,42px);
  box-shadow:0 40px 90px -40px rgba(30,24,18,.65);
  animation:quizIn .5s cubic-bezier(.16,1,.3,1) both;
}
@keyframes quizIn{ from{ opacity:0; transform:translateY(24px) scale(.98); } to{ opacity:1; transform:none; } }
.quiz__bar{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px; }
.quiz__bar b{ font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--champan); font-weight:700; }
.quiz__x{
  flex:none; width:38px; height:38px; border-radius:50%; background:var(--lino);
  border:1px solid var(--arena); color:var(--cacao); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.quiz__prog{ display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.quiz__track{ flex:1; height:4px; border-radius:999px; background:var(--arena); overflow:hidden; }
.quiz__fill{ height:100%; width:33.33%; background:var(--champan); border-radius:999px; transition:width .45s cubic-bezier(.4,0,.2,1); }
.quiz__step{ font-size:12px; color:var(--topo); font-variant-numeric:tabular-nums; white-space:nowrap; }
.quiz h3{ margin:0 0 20px; font-weight:500; letter-spacing:-.01em; font-size:clamp(1.5rem,3.4vw,2rem); }
.quiz__opts{ display:flex; flex-direction:column; gap:12px; }
.opt{
  appearance:none; width:100%; text-align:left; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:18px 20px; min-height:58px; font-size:clamp(1rem,1.6vw,1.08rem); font-weight:500;
  line-height:1.35; color:var(--espresso); border-radius:var(--radius);
  background:var(--lino); border:1.5px solid var(--arena);
  transition:border-color .25s ease, background .25s ease, box-shadow .3s ease;
}
.opt:hover{ border-color:var(--champan); }
.opt.on{ background:var(--marfil); border-color:var(--champan); box-shadow:0 8px 22px -14px rgba(185,154,91,.75); }
.opt:focus-visible, .quiz__x:focus-visible, .btn:focus-visible, .gal__tile:focus-visible{ outline:2px solid var(--champan); outline-offset:3px; }
.res__kicker{ display:block; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--champan); font-weight:700; margin-bottom:10px; }
.res h3{ margin:0; font-weight:500; line-height:1.08; font-size:clamp(1.7rem,4vw,2.4rem); }
.res__meta{ display:flex; align-items:baseline; gap:12px; margin-top:12px; }
.res__price{ font-family:'Fraunces',serif; font-weight:500; font-size:1.5rem; }
.res__dur{ font-size:14px; color:var(--topo); }
.res__why{ margin:16px 0 0; font-size:1.02rem; line-height:1.65; color:var(--cacao); text-wrap:pretty; }
.res__tip{
  margin-top:16px; display:flex; align-items:flex-start; gap:11px; padding:13px 15px;
  background:rgba(185,154,91,.1); border:1px solid rgba(185,154,91,.35); border-radius:12px;
  font-size:.92rem; line-height:1.55; color:var(--cacao);
}
.res__combo{ display:flex; flex-direction:column; gap:12px; margin-top:18px; }
.res__item{ padding:16px 18px; background:var(--lino); border:1px solid var(--arena); border-radius:var(--radius); }
.res__item-top{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.res__item-top b{ font-family:'Fraunces',serif; font-weight:500; font-size:1.15rem; }
.res__item-top span{ font-family:'Fraunces',serif; font-weight:500; font-size:1.05rem; color:var(--champan); white-space:nowrap; }
.res__item-top span small{ font-family:'Manrope',sans-serif; font-size:12px; color:var(--topo); }
.res__item p{ margin:6px 0 0; font-size:.92rem; line-height:1.5; color:var(--cacao); }
.res__item p.plus{ margin-top:8px; font-size:.86rem; line-height:1.45; color:var(--salvia-hond); }
.res__acts{ display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
.res__acts .btn{ flex:1; min-width:180px; font-size:16px; padding:16px 22px; }
.linkish{
  appearance:none; cursor:pointer; background:transparent; border:none; color:var(--topo);
  font-size:13px; text-decoration:underline; text-underline-offset:3px; margin-top:26px;
}
.quiz__back{
  appearance:none; cursor:pointer; margin-top:22px; display:inline-flex; align-items:center; gap:7px;
  background:transparent; border:none; color:var(--topo); font-size:13px;
}

/* ---------- Contacto ---------- */
.ct__head{ max-width:680px; margin-bottom:clamp(40px,6vh,60px); }
.ct__grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(20px,3vw,40px); align-items:start; }
.ct__info{ grid-column:span 12; display:flex; flex-direction:column; gap:16px; }
.ct__mapcol{ grid-column:span 12; }
@media (min-width:900px){
  .ct__info{ grid-column:span 5; }
  .ct__mapcol{ grid-column:span 7; }
}
.ct__booksy{
  display:flex; flex-direction:column; align-items:flex-start; gap:16px;
  padding:24px 28px; border-radius:var(--radius); background:var(--espresso);
  color:var(--lino); border:1px solid var(--espresso);
}
.ct__booksy b{ display:block; font-family:'Fraunces',serif; font-size:1.5rem; font-weight:500; }
.ct__booksy small{ display:block; font-size:13px; color:#EADFCB; margin-top:4px; }
.ct__booksy-btn{ flex:none; }
.ct__booksy-btn .booksy-widget-button{ display:block; cursor:pointer; }
@media (max-width:560px){ .ct__booksy{ align-items:center; text-align:center; } }
/* La ventana de reserva de Booksy: por encima de todo y fija a la pantalla
   actual (Booksy la ancla al inicio del documento con position:absolute, lo
   que la desplazaba por toda la web). Se fija al viewport con scroll interno. */
.booksy-widget-overlay{ z-index:2147483040 !important; }
.booksy-widget-dialog{
  position:fixed !important;
  top:50% !important; left:50% !important;
  transform:translate(-50%,-50%) !important;
  max-height:100svh !important; max-width:100vw !important;
  z-index:2147483647 !important;
}
.booksy-widget-dialog iframe{ max-height:100svh !important; }
@media (max-width:600px){
  .booksy-widget-dialog{
    inset:0 !important; transform:none !important;
    width:100vw !important; height:100svh !important; max-height:100svh !important;
    border-radius:0 !important;
  }
  .booksy-widget-dialog iframe{ width:100% !important; height:100% !important; }
}
.ct__wa{
  display:flex; align-items:center; gap:14px; padding:20px 24px; border-radius:var(--radius);
  background:var(--marfil); border:1px solid var(--arena); transition:border-color .3s ease;
}
.ct__wa:hover{ border-color:var(--salvia); color:var(--espresso); }
.ct__wa i{
  display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
  border-radius:50%; background:var(--salvia); color:var(--marfil); flex:none;
}
.ct__wa b{ display:block; font-weight:600; font-size:1.05rem; }
.ct__wa small{ display:block; font-size:13px; color:var(--cacao); margin-top:2px; }
.map{ position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--arena); aspect-ratio:16/10; }
.map iframe{ position:absolute; inset:0; display:block; border:0; width:100%; height:100%; filter:saturate(.92); }
.map__guard{
  position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center;
  border:0; background:transparent; cursor:pointer; appearance:none;
}
.map__guard span{
  display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:999px;
  background:rgba(51,41,31,.82); color:var(--lino); font-size:12px; font-weight:600; backdrop-filter:blur(2px);
}
.map__dir{
  position:absolute; top:14px; right:14px; z-index:2; display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px; border-radius:999px; background:var(--espresso); color:var(--lino);
  font-size:12px; font-weight:600; transition:transform .3s ease;
}
.map__dir:hover{ transform:translateY(-1px); color:var(--lino); }
.ct__cells{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--arena); border:1px solid var(--arena); border-radius:var(--radius); overflow:hidden; }
.ct__cell{ background:var(--marfil); padding:20px 22px; }
.ct__cell h3{ font-family:'Manrope',sans-serif; margin:0 0 10px; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--salvia-hond); font-weight:700; }
.ct__cell p{ margin:0; font-size:14px; line-height:1.7; }
.ct__cell span{ color:var(--topo); }
@media (max-width:560px){ .ct__cells{ grid-template-columns:1fr; } }

/* ---------- FAQ ---------- */
.faq__wrap{ max-width:1080px; margin:0 auto; display:grid; grid-template-columns:1fr; gap:clamp(24px,4vw,40px); }
.faq__head{ max-width:600px; }
.faq__head b{ display:inline-block; font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:var(--champan); font-weight:700; margin-bottom:18px; }
.faq__head h2{ line-height:1.03; font-size:clamp(2.2rem,5vw,3.4rem); }
.faq__head h2 em{ font-style:italic; color:var(--champan); }
.faq__head p{ margin:18px 0 0; font-size:1.05rem; line-height:1.6; color:var(--cacao); max-width:52ch; }
.faq__list{ display:flex; flex-direction:column; gap:8px; }
.faq{ background:var(--lino); border:1px solid var(--arena); border-radius:var(--radius); overflow:hidden; }
.faq summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding:14px clamp(16px,2.2vw,20px); font-family:'Fraunces',serif; font-weight:500;
  font-size:clamp(.98rem,1.6vw,1.1rem);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq__ico{
  flex:none; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px;
  border-radius:50%; border:1px solid var(--greige); color:var(--champan);
  transition:transform .35s cubic-bezier(.4,0,.2,1);
}
.faq[open] .faq__ico{ transform:rotate(135deg); }
.faq__a{ padding:0 clamp(16px,2.2vw,20px) 16px; font-size:.94rem; line-height:1.6; color:var(--cacao); max-width:64ch; }

/* ---------- Footer ---------- */
.ft{ background:var(--espresso); color:var(--lino); padding:clamp(56px,8vh,88px) var(--gutter) 32px; }
.ft__grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(24px,3vw,48px); align-items:start; }
.ft__brand{ grid-column:span 12; }
.ft__nav{ grid-column:span 6; }
.ft__visit{ grid-column:span 6; }
@media (min-width:900px){
  .ft__brand{ grid-column:span 5; }
  .ft__nav{ grid-column:span 3; }
  .ft__visit{ grid-column:span 4; }
}
.ft__logo{ display:flex; align-items:center; gap:14px; }
.ft__logo img{ width:52px; height:52px; filter:invert(1); }
.ft__logo span{ display:flex; flex-direction:column; line-height:1.1; }
.ft__logo b{ font-family:'Fraunces',serif; font-size:22px; font-weight:500; }
.ft__logo small{ font-size:10px; letter-spacing:.3em; text-transform:uppercase; color:#EADFCB; }
.ft__brand p{ margin:20px 0 0; max-width:38ch; font-size:14px; line-height:1.7; color:#D8CBB8; }
.ft h3{ font-family:'Manrope',sans-serif; margin:0 0 16px; font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--champan); font-weight:700; }
.ft ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; font-size:14px; }
.ft a{ color:#EDE4D6; }
.ft a:hover{ color:var(--champan); }
.ft__visit p{ margin:0; font-size:14px; line-height:1.8; color:#EDE4D6; }
.ft__end{
  margin-top:clamp(40px,6vh,64px); padding-top:28px; border-top:1px solid rgba(246,241,234,.16);
  display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center;
  font-size:12px; color:#A89986;
}
.ft__end i{ color:var(--champan); font-style:normal; }
.ft__end a{ color:#C7BAAA; text-decoration:underline; text-underline-offset:2px; }
.ft__end a:hover{ color:var(--champan); }

/* ---------- Fotos de "El estudio" ---------- */
.estudio__photo img,
.estudio__portrait img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- Accesibilidad / movimiento ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .marquee__track, .revwall__track, .galwall__track, .scrollcue span, .hero h1 .line, .hero__fade, .quiz__card, .panel{ animation:none !important; }
  /* Sin animación, los muros (reseñas y galería) se ven como carrusel desplazable */
  .revwall__row, .galwall__row{ overflow-x:auto; scrollbar-width:none; }
  .revwall__row::-webkit-scrollbar, .galwall__row::-webkit-scrollbar{ display:none; }
  .revwall__group[aria-hidden="true"], .galwall__group[aria-hidden="true"]{ display:none; }
  [data-reveal]{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ---------- Cookies: banner y preferencias ---------- */
.ck-banner{
  position:fixed; left:50%; bottom:16px; transform:translateX(-50%);
  width:min(680px, calc(100% - 24px)); z-index:2147483000;
  background:var(--espresso); color:var(--lino);
  border-radius:18px; padding:20px 22px; box-shadow:0 18px 50px rgba(0,0,0,.35);
  font-family:'Manrope',sans-serif;
}
.ck-banner[hidden]{ display:none; }
.ck-banner h2{ font-family:'Fraunces',serif; font-weight:500; font-size:1.15rem; margin:0 0 6px; color:var(--lino); }
.ck-banner p{ margin:0; font-size:13.5px; line-height:1.6; color:#E6DBCB; }
.ck-banner a{ color:var(--champan); text-decoration:underline; text-underline-offset:2px; }
.ck-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:16px; }
.ck-btn{
  appearance:none; border:0; cursor:pointer; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:600; font-size:14px; padding:11px 20px; transition:filter .2s ease;
}
.ck-btn--accept{ background:var(--champan); color:var(--espresso); }
.ck-btn--reject{ background:#5A4A39; color:var(--lino); }
.ck-btn--config{ background:transparent; color:#E6DBCB; text-decoration:underline; padding:11px 6px; }
.ck-btn--accept:hover, .ck-btn--reject:hover{ filter:brightness(1.06); }
.ck-config{ margin-top:16px; border-top:1px solid rgba(255,255,255,.14); padding-top:8px; }
.ck-config[hidden]{ display:none; }
.ck-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:10px 0; }
.ck-row h3{ font-size:14px; margin:0 0 2px; color:var(--lino); font-family:'Manrope',sans-serif; font-weight:700; }
.ck-row p{ font-size:12.5px; line-height:1.5; color:#CBBEAC; }
.ck-switch{ position:relative; flex:none; width:44px; height:24px; }
.ck-switch input{ position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
.ck-track{ position:absolute; inset:0; border-radius:999px; background:#5A4A39; transition:background .2s; pointer-events:none; }
.ck-track::after{ content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:transform .2s; }
.ck-switch input:checked + .ck-track{ background:var(--champan); }
.ck-switch input:checked + .ck-track::after{ transform:translateX(20px); }
.ck-switch input:disabled + .ck-track{ opacity:.5; }
.ck-save{ margin-top:6px; }
@media (max-width:520px){
  .ck-banner{ bottom:0; left:0; transform:none; width:100%; border-radius:16px 16px 0 0; padding:18px 16px; }
  .ck-actions{ gap:8px; }
  .ck-btn--accept, .ck-btn--reject{ flex:1 1 auto; text-align:center; }
  .ck-btn--config{ flex-basis:100%; text-align:center; }
}

/* Placeholder de consentimiento del mapa (Google Maps) */
.map__consent{
  position:absolute; inset:0; z-index:3; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:12px; text-align:center;
  padding:22px; background:var(--lino);
}
.map__consent[hidden]{ display:none; }
.map__consent p{ margin:0; max-width:34ch; font-size:13px; line-height:1.6; color:var(--cacao); }
.map__consent button{
  appearance:none; border:0; cursor:pointer; border-radius:999px; background:var(--espresso);
  color:var(--lino); font-family:'Manrope',sans-serif; font-weight:600; font-size:13px; padding:10px 20px;
}
.map__consent button:hover{ filter:brightness(1.08); }
.map__consent svg{ color:var(--champan); }