/* =========================================================================
   VÉRTICE FITNESS CENTER — hoja única
   Base: plantilla «impacto» (Box Espuña), rehecha para Vértice.
   Marca: negro y acero del logo; acento violeta de los LED de la sala
   (muestreado del neón de la Booty Area); colores de clase, los de su
   cartel de horario. La sala de Reformer, en crema, como es de verdad.
   ========================================================================= */

@import url('fuentes.css');

:root{
  --paper:      #EDEDEF;   /* acero claro */
  --crema:      #F3EEE7;   /* sala de Reformer */
  --ink:        #111113;
  --accent:     #7C4DFF;   /* violeta de los LED */
  --accent-ink: #FFFFFF;
  --accent-text:#6A3CF0;   /* violeta para texto sobre claro */
  --accent-soft:#B9A2FF;   /* violeta para texto sobre oscuro */
  --accent-hover: color-mix(in srgb, var(--accent) 85%, #000);
  --dark:       #111113;
  --darker:     #0A0A0B;

  --on-dark-muted:    color-mix(in srgb, var(--paper) 64%, transparent);
  --on-dark-hairline: color-mix(in srgb, var(--paper) 13%, transparent);
  --on-light-muted:    color-mix(in srgb, var(--ink) 64%, transparent);
  --on-light-hairline: color-mix(in srgb, var(--ink) 15%, transparent);
  /* por defecto la web es oscura; las secciones claras los redefinen */
  --muted: var(--on-dark-muted);
  --hairline: var(--on-dark-hairline);

  /* clases: los tonos de su cartel de horario */
  --c-func:   #3B82F6;
  --c-sals:   #E9E9EC;
  --c-step:   #22C55E;
  --c-barre:  #F5B98A;
  --c-teen:   #A78BFA;

  --font-display: "Bebas Neue", "Arial Narrow", Impact, sans-serif;
  --font-body:    "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;

  --wrap: 1280px;
  --gut: clamp(1.25rem, 4vw, 3rem);
  --section-y: clamp(4.5rem, 10vw, 8.5rem);
  --radius: 8px;
  --nav-h: 76px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

*, *::before, *::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top: calc(var(--nav-h) + 16px); overflow-x:clip; background:var(--darker); }
@media (max-width:960px){ :root{ --nav-h: 64px; } }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; background:var(--dark); color:var(--paper);
  font-family:var(--font-body); font-size:clamp(1rem, .96rem + .2vw, 1.0625rem); line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:clip;                    /* clip, no hidden: hidden rompe position:sticky */
}
img, video{ max-width:100%; height:auto; display:block; }
a{ color:inherit; }
figure{ margin:0; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }

.saltar{ position:absolute; left:1rem; top:-4rem; z-index:100; background:var(--accent); color:#fff; padding:.6rem 1rem; }
.saltar:focus{ top:1rem; }

.envoltorio{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut); }

/* ----------------------------------------------------------- tipografía */
.display{
  font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  line-height:.88; letter-spacing:.01em; margin:0;
  font-size:clamp(3rem, 7.5vw, 6.25rem);
}
.display--m { font-size:clamp(2.25rem, 5vw, 4rem); }

/* acero cepillado, como la V del logo */
.metal{
  background: linear-gradient(176deg, #FFFFFF 0%, #D9DCE0 30%, #9DA3AA 48%, #5E646B 53%, #C9CDD2 70%, #F4F5F7 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

.cabecera{ display:grid; gap:1.25rem 4rem; align-items:end; margin-bottom:clamp(2.25rem, 5vw, 4rem); }
.cabecera__texto{ margin:0; max-width:44ch; color:var(--muted); font-size:1.075rem; }
@media (min-width:900px){ .cabecera{ grid-template-columns: 1fr minmax(0, 30rem); } .cabecera__texto{ padding-bottom:.5rem; } }

.antetitulo{
  display:flex; align-items:center; gap:.9rem; margin:0 0 1.25rem;
  font-weight:600; font-size:.82rem; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(255,255,255,.82);
}
.antetitulo::before{ content:""; width:2.25rem; height:2px; background:var(--accent); flex:none; }
.antetitulo--oscuro{ color:var(--on-light-muted); }
@media (max-width:540px){ .antetitulo{ font-size:.72rem; letter-spacing:.16em; } .antetitulo::before{ width:1.5rem; } }

/* --------------------------------------------------------------- botones */
.botones{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2.25rem; }
.boton{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  font-family:var(--font-display); font-size:1.3rem; letter-spacing:.05em; line-height:1;
  background:var(--accent); color:var(--accent-ink);
  padding:1rem 1.75rem .9rem; border-radius:999px; text-decoration:none;
  transition: background .2s, color .2s, box-shadow .2s;
  box-shadow: 0 8px 28px color-mix(in srgb, var(--accent) 35%, transparent);
}
.boton:hover{ background:var(--accent-hover); }
.boton svg{ transition:transform .2s var(--ease); margin-top:-.1rem; }
.boton:hover svg{ transform:translateX(4px); }
.boton--linea{ background:transparent; color:inherit; box-shadow:inset 0 0 0 2px currentColor; }
.boton--linea:hover{ background:transparent; box-shadow:inset 0 0 0 2px var(--accent); color:var(--accent-soft); }
.boton--blanco{ background:#fff; color:var(--ink); box-shadow:none; }
.boton--blanco:hover{ background:var(--ink); color:#fff; }

/* ------------------------------------------------------------------- nav */
/* A lo ancho, transparente sobre el vídeo y negra translúcida al bajar:
   la marca es negra y acero, así que la nav no cambia a clara. */
.nav{
  position:fixed; z-index:60; top:0; left:0; right:0; height:var(--nav-h);
  display:flex; align-items:center; gap:clamp(1rem, 2.5vw, 2.5rem);
  padding-inline: max(var(--gut), calc((100vw - var(--wrap)) / 2 + var(--gut)));
  color:#fff; background: color-mix(in srgb, var(--darker) 86%, transparent);
  box-shadow: 0 1px 0 var(--on-dark-hairline);
  -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2);
  transition: transform .35s var(--ease), background .35s, box-shadow .35s;
}
.js-listo .nav:not(.is-solida){ background:transparent; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
.nav.is-oculta{ transform: translateY(-100%); }
.nav.en-cima{ position:absolute; }
.nav__marca{ display:block; flex:none; }
.nav__marca img{ height:44px; width:auto; }
.nav__enlaces{ display:flex; gap:clamp(1.1rem, 2.2vw, 2.25rem); list-style:none; margin:0 0 0 auto; padding:0; }
.nav__enlaces a{
  position:relative; font-family:var(--font-display); font-size:1.2rem; letter-spacing:.08em; text-decoration:none;
  opacity:.8; transition:opacity .2s;
}
.nav__enlaces a::after{ content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--accent); transform:scaleX(0); transition:transform .25s var(--ease); }
.nav__enlaces a:hover{ opacity:1; }
.nav__enlaces a:hover::after{ transform:scaleX(1); }
.nav__boton{ display:none; background:none; border:0; padding:.5rem; margin-right:-.5rem; cursor:pointer; color:inherit; }
.nav__boton span{ display:block; width:24px; height:2px; background:currentColor; margin:5px 0; transition:transform .3s var(--ease), opacity .3s; }
.nav.is-abierta .nav__boton span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav.is-abierta .nav__boton span:nth-child(2){ opacity:0; }
.nav.is-abierta .nav__boton span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

@media (max-width: 960px){
  .nav{ gap:.9rem; }
  .nav__marca img{ height:36px; }
  .nav__boton{ display:block; position:relative; z-index:2; margin-left:auto; }
  .nav__enlaces{
    position:fixed; inset:0; z-index:1; margin:0;
    flex-direction:column; justify-content:center; align-items:flex-start; gap:.35rem;
    padding: 0 var(--gut); background:var(--darker); color:#fff;
    opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s;
  }
  .nav.is-abierta .nav__enlaces{ opacity:1; visibility:visible; }
  .nav__enlaces a{ font-size:clamp(2.5rem, 11vw, 3.5rem); opacity:1; }
  /* con el menú abierto la nav no puede llevar transform ni filtro: los dos
     convierten a la nav en bloque contenedor del panel fijo y lo encierran */
  .nav.is-abierta{ transform:none !important; transition:none; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
}

/* ------------------------------------------------------------------ hero */
.hero{
  position:relative; min-height:100svh; background:var(--darker); color:#fff;
  display:flex; align-items:flex-end; overflow:hidden;
  padding: calc(var(--nav-h) + 4rem) 0 clamp(3rem, 7vw, 5.5rem);
}
.hero__fondo{ position:absolute; inset:0; }
.hero__fondo img, .hero__video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero__video{ opacity:0; transition:opacity 1s var(--ease); }
.hero__video.is-lista{ opacity:1; }
/* fondo desenfocado para que el texto destaque; se agranda para que el borde difuminado quede fuera */
.hero__fondo img, .hero__video{ filter:blur(1.5px); inset:-8px; width:calc(100% + 16px); max-width:none; height:calc(100% + 16px); }
.hero__fondo::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(10,10,11,.94) 0%, rgba(10,10,11,.6) 34%, rgba(10,10,11,.12) 66%, rgba(10,10,11,.5) 100%),
    linear-gradient(90deg, rgba(10,10,11,.6) 0%, rgba(10,10,11,0) 62%);
}
.hero__contenido{ position:relative; z-index:1; }
/* la tilde de la É sube casi hasta esta línea: hueco propio y sombra para que no se pierda con el neón del fondo */
.hero .antetitulo{ position:relative; z-index:2; margin-bottom:clamp(1.75rem, 3.2vw, 2.75rem); color:#fff; text-shadow:0 1px 12px rgba(0,0,0,.85), 0 0 3px rgba(0,0,0,.6); }
.hero__titulo{ margin:0; font-weight:400; }
.hero__titulo .metal{
  display:block; font-family:var(--font-display); text-transform:uppercase;
  font-size:clamp(5rem, 17vw, 13.5rem); line-height:.8; letter-spacing:.04em;
  /* la tilde de la É queda por encima de la caja: sin este hueco, el degradado
     recortado al texto no la pinta */
  padding-top:.14em; margin-top:-.14em;
  filter: drop-shadow(0 6px 30px rgba(0,0,0,.45));
}
.hero__titulo small{
  display:flex; align-items:center; gap:1rem; margin-top:.9rem;
  font-family:var(--font-body); font-weight:500; font-size:clamp(.85rem, .7rem + .7vw, 1.2rem);
  letter-spacing:.62em; text-transform:uppercase; color:rgba(255,255,255,.78);
}
.hero__titulo small::after{ content:""; width:clamp(2rem, 6vw, 5rem); height:1px; background:rgba(255,255,255,.4); }
.hero__texto{ margin:1.6rem 0 0; max-width:36ch; font-size:clamp(1.1rem, 1rem + .5vw, 1.4rem); line-height:1.45; color:rgba(255,255,255,.88); }
.hero .boton--linea{ color:#fff; }

/* ---------------------------------------------------------------- cifras */
.cifras{ background:var(--darker); border-bottom:1px solid var(--on-dark-hairline); }
.cifras__lista{ list-style:none; margin-block:0; display:grid; grid-template-columns:repeat(4, 1fr); }
.cifras li{ padding:clamp(1.5rem, 3vw, 2.25rem) 1.25rem; border-left:1px solid var(--on-dark-hairline); display:grid; gap:.3rem; }
.cifras li:first-child{ border-left:0; padding-left:0; }
.cifras b{ font-family:var(--font-display); font-weight:400; font-size:clamp(2.2rem, 3.8vw, 3.4rem); line-height:.9; letter-spacing:.02em; }
.cifras li:first-child b{ color:var(--accent-soft); }
.cifras span{ font-size:.9rem; color:var(--on-dark-muted); }
@media (max-width:860px){
  .cifras__lista{ grid-template-columns:1fr 1fr; }
  .cifras li:nth-child(odd){ border-left:0; padding-left:0; }
  .cifras li:nth-child(n+3){ border-top:1px solid var(--on-dark-hairline); }
}

/* -------------------------------------------------------------- secciones */
.sec{ padding-block:var(--section-y); }
.sec--negra{ background:var(--darker); }
.sec--acero, .sec--crema{
  color:var(--ink);
  --muted: var(--on-light-muted); --hairline: var(--on-light-hairline);
}
.sec--acero{ background:var(--paper); }
.sec--crema{
  background:var(--crema);
  --accent:#23201C; --accent-hover:#000; --accent-text:#8A5A2B; --accent-soft:#8A5A2B;
}

/* ---------------------------------------------------------------- zonas */
.zonas{ display:grid; grid-template-columns:repeat(4, 1fr); gap:clamp(2rem, 3vw, 2.75rem) clamp(1rem, 2vw, 1.5rem); }
@media (max-width:1000px){ .zonas{ grid-template-columns:repeat(2, 1fr); } }
/* móvil: carrusel que se desliza con el dedo, asomando la siguiente tarjeta */
@media (max-width:600px){
  .zonas{
    grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:78%;
    gap:1rem; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory;
    margin-inline:calc(var(--gut) * -1); padding-inline:var(--gut); scroll-padding-inline:var(--gut);
    scrollbar-width:none;
  }
  .zonas::-webkit-scrollbar{ display:none; }
  .zona{ scroll-snap-align:start; }
}
.zona{ overflow:hidden; }
.zona img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--radius); transition:transform .8s var(--ease); }
.zona:hover img{ transform:scale(1.02); }
.zona h3{
  display:flex; align-items:center; gap:.7rem; margin:1.1rem 0 .3rem;
  font-family:var(--font-display); font-weight:400; font-size:2rem; letter-spacing:.03em; line-height:1; text-transform:uppercase;
}
.zona h3::before{ content:""; width:.7rem; height:.7rem; background:var(--accent); transform:rotate(45deg) scale(.8); flex:none; margin-top:-.2rem; }
.zona p{ margin:0; color:var(--muted); max-width:40ch; }
.zonas__mas{ margin:clamp(2rem, 4vw, 3rem) 0 0; color:var(--muted); }
.zonas__mas a{ color:var(--paper); font-weight:600; text-decoration-color:var(--accent); text-underline-offset:4px; }
.zonas__mas a:hover{ color:var(--accent-soft); }

/* ------------------------------------------------------------ booty area */
.booty{ position:relative; min-height:min(88vh, 760px); display:flex; align-items:flex-end; overflow:hidden; background:var(--darker); }
.booty__foto{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.booty::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(0deg, rgba(10,10,11,.92) 0%, rgba(10,10,11,.35) 45%, rgba(10,10,11,0) 70%),
              linear-gradient(90deg, rgba(10,10,11,.7) 0%, rgba(10,10,11,0) 55%);
}
.booty__dentro{ position:relative; z-index:1; padding-block:clamp(3rem, 7vw, 5.5rem); }
.booty .display{ font-size:clamp(3.5rem, 10vw, 8rem); text-shadow:0 0 38px color-mix(in srgb, #E0339A 45%, transparent); }
.booty__texto{ margin:1.1rem 0 0; max-width:42ch; font-size:1.15rem; color:rgba(255,255,255,.88); }
.booty__lista{ list-style:none; margin:1.5rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem; }
@media (max-width:760px){
  .booty{ display:block; min-height:0; }
  .booty__foto{ position:relative; inset:auto; height:auto; aspect-ratio:4/3; object-position:52% 40%; }
  .booty::after{ inset:0 0 auto 0; aspect-ratio:4/3; height:auto; background:linear-gradient(0deg, var(--darker) 0%, rgba(10,10,11,0) 38%); }
  .booty__dentro{ padding-block:.5rem 3.5rem; }
}
.booty__lista li{
  font-size:.82rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  padding:.5rem .95rem; border-radius:999px; background:rgba(255,255,255,.08);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}

/* --------------------------------------------------------------- horario */
.semana{ display:grid; gap:4px; }
.semana__fila{ display:grid; grid-template-columns: 4.5rem repeat(5, 1fr); gap:4px; }
@media (max-width:1000px){ .semana__fila{ grid-template-columns: 3.5rem repeat(5, 1fr); } .bloque{ padding:.4rem .5rem; } .bloque b{ font-size:1rem; } .semana__cab span{ font-size:1.1rem; } }
.semana__cab span{
  font-family:var(--font-display); font-size:1.35rem; letter-spacing:.06em; text-align:center;
  padding-bottom:.6rem; color:var(--on-dark-muted);
}
.semana__cab span.is-hoy{ color:#fff; box-shadow: inset 0 -2px 0 var(--accent); }
.semana time{ font-family:var(--font-display); font-size:1.5rem; letter-spacing:.02em; align-self:center; }
.semana__fila > span{ min-height:3rem; background: color-mix(in srgb, var(--paper) 3%, transparent); border-radius:3px; }
.semana__cab > span{ min-height:0; background:none; }
.semana__corte{
  margin:1rem 0 .4rem; font-size:.75rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--on-dark-muted); display:flex; align-items:center; gap:1rem;
}
.semana__corte::after{ content:""; flex:1; height:1px; background:var(--on-dark-hairline); }
/* cada clase con el filete de su color del cartel; las de cuota aparte, con contorno */
.bloque{
  display:flex; align-items:center; height:100%; border-radius:3px;
  padding:.45rem .8rem; border-left:4px solid var(--c);
  background: color-mix(in srgb, var(--c) 16%, transparent); color:var(--paper);
}
.bloque b{ font-family:var(--font-display); font-weight:400; font-size:1.2rem; letter-spacing:.05em; line-height:1.05; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (min-width:761px) and (max-width:1000px){ .bloque b{ font-size:.95rem; letter-spacing:.03em; } .bloque{ padding:.4rem .45rem; border-left-width:3px; } }
.bloque--aparte{ background:transparent; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 55%, transparent); }

.horario-movil{ display:none; }
@media (max-width:760px){
  .semana{ display:none; }
  .horario-movil{ display:block; }
}
.tabs{
  position:sticky; top:0; z-index:40;
  transform: translateY(var(--desp, 0px));
  display:grid; grid-template-columns:repeat(5, 1fr); gap:4px;
  background:var(--darker); padding:.6rem 0;
}
.animando .tabs{ transition: transform .35s var(--ease); }
.tabs-centinela{ height:0; }
.tabs button{
  font-family:var(--font-display); font-size:1.4rem; letter-spacing:.04em; line-height:1;
  background: color-mix(in srgb, var(--paper) 7%, transparent); color:var(--paper);
  border:0; padding:.7rem 0 .6rem; border-radius:var(--radius); cursor:pointer;
  transition: background .2s, color .2s;
}
.tabs button.is-activa{ background:var(--accent); color:var(--accent-ink); }
.js-listo .panel{ display:none; }
.js-listo .panel.is-activo{ display:block; }
.dia{ list-style:none; margin:.5rem 0 0; padding:0; display:grid; gap:4px; }
.dia li{ display:grid; grid-template-columns:4.25rem 1fr; gap:4px; min-height:3.2rem; }
.dia time{ font-family:var(--font-display); font-size:1.5rem; align-self:center; }
.dia .corte{ display:block; min-height:0; margin:.9rem 0 .3rem; font-size:.75rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--on-dark-muted); }

.horario-pie{ margin-top:2rem; display:flex; flex-wrap:wrap; gap:1rem 2.5rem; align-items:center; justify-content:space-between; }
.leyenda{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem 1.4rem; font-size:.9rem; }
.leyenda i{ display:inline-block; width:.8rem; height:.8rem; background:var(--c); margin-right:.5rem; vertical-align:-.05rem; border-radius:2px; }
.nota{ margin:0; font-size:.88rem; color:var(--muted); max-width:52ch; }

/* las clases, en texto: dos columnas de filas */
.clases{
  margin-top:clamp(3rem, 6vw, 4.5rem); display:grid; grid-template-columns:repeat(3, 1fr);
  gap:0 clamp(1.5rem, 3vw, 3rem); border-top:1px solid var(--on-dark-hairline);
}
@media (max-width:900px){ .clases{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .clases{ grid-template-columns:1fr; } }
.clase{ padding:1.5rem 0; border-bottom:1px solid var(--on-dark-hairline); }
.clase h3{
  display:flex; align-items:center; gap:.7rem; margin:0 0 .4rem;
  font-family:var(--font-display); font-weight:400; font-size:1.75rem; letter-spacing:.03em; line-height:1; text-transform:uppercase;
}
.clase h3::before{ content:""; width:.75rem; height:.75rem; background:var(--c); flex:none; margin-top:-.2rem; border-radius:2px; }
.clase p{ margin:0; color:var(--on-dark-muted); max-width:40ch; }

/* -------------------------------------------------------------- reformer */
.reformer{ display:grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap:clamp(2.5rem, 6vw, 6rem); align-items:center; }
@media (max-width:900px){ .reformer{ grid-template-columns:minmax(0, 4fr) minmax(0, 6fr); gap:2.5rem; align-items:start; } }
@media (max-width:680px){ .reformer{ grid-template-columns:1fr; } }
.reformer__media{ position:relative; }
.reformer__video{
  width:100%; aspect-ratio:9/16; max-height:82vh; object-fit:cover;
  /* el arco de sus espejos: semicírculo exacto (radio horizontal 50 %, vertical = ancho/2) */
  border-radius:50% 50% var(--radius) var(--radius) / 28.1% 28.1% var(--radius) var(--radius);
  background:#2a241d;
}
@media (max-width:900px){ .reformer__media{ position:sticky; top:calc(var(--nav-h) + 1.5rem); } }
@media (max-width:680px){
  .reformer__media{ position:static; max-width:360px; margin-inline:auto; width:100%; }
  .reformer__video{ aspect-ratio:4/5; border-radius:50% 50% var(--radius) var(--radius) / 40% 40% var(--radius) var(--radius); }
}
.reformer__texto > p{ margin:1.1rem 0 0; color:var(--muted); max-width:52ch; }
.reformer__texto .display{ color:var(--ink); }
.reformer__horas{ margin:2rem 0 0; display:grid; gap:.9rem; padding-top:1.5rem; border-top:1px solid var(--hairline); }
.reformer__horas div{ display:grid; grid-template-columns: minmax(0, 15rem) 1fr; gap:.25rem 1.5rem; }
@media (max-width:1100px){ .reformer__horas div{ grid-template-columns:1fr; } }
.reformer__horas dt{ font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); align-self:center; }
.reformer__horas dd{ margin:0; font-family:var(--font-display); font-size:1.5rem; letter-spacing:.03em; line-height:1.1; }
.reformer__precios{ list-style:none; margin:2rem 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.reformer__precios li{ padding:1.1rem 1.25rem; border-radius:var(--radius); background:#fff; box-shadow:0 1px 0 var(--hairline); display:grid; gap:.4rem; }
.reformer__precios b{ font-family:var(--font-display); font-weight:400; font-size:2.8rem; line-height:.9; color:var(--accent-text); }
.reformer__precios small{ font-family:var(--font-body); font-size:.9rem; font-weight:500; color:var(--muted); margin-left:.2rem; }
.reformer__precios span{ font-size:.92rem; color:var(--muted); line-height:1.45; }
@media (max-width:420px){ .reformer__precios{ grid-template-columns:1fr; } }
.reformer__nota{ font-size:.95rem; }
.reformer__nota a{ color:var(--ink); text-decoration-color:var(--accent); text-underline-offset:3px; }

/* --------------------------------------------------------------- tarifas */
.planes{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(4, 1fr);
  border-top:2px solid var(--ink);
}
.plan{ padding:1.5rem 1.25rem 1.75rem; border-right:1px solid var(--hairline); display:flex; flex-direction:column; }
.plan:first-child{ padding-left:0; }
.plan:last-child{ border-right:0; }
.plan h3{ margin:0; font-family:var(--font-display); font-weight:400; font-size:1.75rem; letter-spacing:.03em; line-height:1; text-transform:uppercase; }
.plan__precio{ order:2; margin:1.5rem 0 0; font-family:var(--font-display); font-size:clamp(3rem, 5vw, 4.25rem); line-height:.9; color:var(--ink); white-space:nowrap; }
.plan__precio small{ font-family:var(--font-body); font-size:.95rem; font-weight:500; color:var(--muted); margin-left:.2rem; }
.plan__incluye{ order:1; margin:.5rem 0 0; color:var(--muted); font-size:.95rem; max-width:28ch; }
.plan--destacado{
  background:#fff; border-radius:0 0 var(--radius) var(--radius);
  box-shadow: inset 0 3px 0 var(--accent), 0 10px 30px rgba(17,17,19,.07);
  padding-left:1.25rem !important; margin-top:-2px; border-right:0;
}
.plan--destacado .plan__precio{ color:var(--accent-text); }
.plan--destacado h3{ color:var(--accent-text); }
@media (max-width:980px){
  .planes{ grid-template-columns:1fr; }
  .plan{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:0 1rem; padding:1.1rem 0; border-right:0; border-bottom:1px solid var(--hairline); }
  .plan h3{ grid-column:1; grid-row:1; }
  .plan__incluye{ grid-column:1; grid-row:2; }
  .plan__precio{ grid-column:2; grid-row:1 / span 2; margin:0; text-align:right; font-size:2.75rem; }
  .plan--destacado{ padding:1.25rem 1rem !important; margin-top:0; border-radius:var(--radius); border-bottom:0; margin-block:.75rem; }
}
.extras{ margin-top:1.75rem; display:grid; gap:.35rem; color:var(--muted); }
.extras p{ margin:0; }
.extras strong{ color:var(--ink); font-weight:600; }
.prueba{
  margin-top:clamp(2.5rem, 5vw, 3.5rem);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.25rem 2rem;
  padding:clamp(1.5rem, 3vw, 2rem) clamp(1.5rem, 3vw, 2.5rem);
  background:var(--ink); color:var(--paper); border-radius:var(--radius);
}
.prueba p{ margin:0; font-size:1.1rem; max-width:50ch; color:var(--on-dark-muted); }
.prueba strong{ color:#fff; font-weight:600; }

/* ---------------------------------------------------------------- equipo */
.equipo{ display:grid; grid-template-columns:repeat(4, 1fr); gap:clamp(1.25rem, 2vw, 1.75rem); }
@media (max-width:980px){ .equipo{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:480px){ .equipo{ gap:1.25rem .75rem; } }
.persona img{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:var(--radius); filter:grayscale(.15) contrast(1.03); }
.persona h3{ margin:1rem 0 0; font-family:var(--font-display); font-weight:400; font-size:2rem; letter-spacing:.03em; line-height:1; text-transform:uppercase; }
.persona__rol{ margin:.3rem 0 0 !important; font-size:.8rem !important; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-soft) !important; }
.persona p{ margin:.6rem 0 0; font-size:.95rem; color:var(--muted); }
@media (max-width:480px){ .persona h3{ font-size:1.6rem; } .persona p:not(.persona__rol){ font-size:.88rem; } }

/* -------------------------------------------------------------- fundador */
.fundador{ display:grid; grid-template-columns:minmax(0, 5fr) minmax(0, 7fr); gap:clamp(2.5rem, 6vw, 6rem); align-items:center; }
@media (max-width:860px){ .fundador{ grid-template-columns:1fr; } .fundador .fundador__foto{ width:100%; max-width:440px; margin-inline:auto; } }
.fundador__foto{ margin:0; }
.fundador__foto img{ display:block; width:100%; aspect-ratio:3/4; object-fit:cover; object-position:50% 30%; border-radius:var(--radius); }
.fundador__cita{ margin:0; border-left:3px solid var(--accent); padding-left:clamp(1.25rem, 2.5vw, 2rem); }
.fundador__cita blockquote{
  margin:0; font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  font-size:clamp(2.6rem, 1.6rem + 3.6vw, 5rem); line-height:.98; letter-spacing:.02em; color:#fff; text-wrap:balance;
}
.fundador__cita figcaption{ margin-top:1.5rem; }
.fundador__cita figcaption b{ display:block; font-family:var(--font-display); font-weight:400; font-size:1.9rem; letter-spacing:.04em; line-height:1; text-transform:uppercase; color:#fff; }
.fundador__cita figcaption span{ display:block; margin-top:.45rem; font-size:.8rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-soft); }

/* -------------------------------------------------------------- contacto */
.contacto{ display:grid; gap:clamp(2.5rem, 5vw, 5rem); grid-template-columns:1fr 1fr; align-items:center; }
@media (max-width:900px){ .contacto{ grid-template-columns:1fr; } }
.ficha{ margin:2.25rem 0 0; display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:1.75rem 2rem; }
.ficha dt{ font-size:.75rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--on-dark-muted); }
.ficha dd{ margin:.4rem 0 0; font-size:1.05rem; line-height:1.5; overflow-wrap:anywhere; }
.ficha a{ color:var(--paper); text-decoration-color:var(--accent); text-underline-offset:3px; }
@media (max-width:420px){ .ficha{ grid-template-columns:1fr; } }
.mapa a{ position:relative; display:block; border-radius:var(--radius); overflow:hidden; box-shadow:0 0 0 1px var(--on-dark-hairline); }
.mapa img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .8s var(--ease); }
.mapa a:hover img{ transform:scale(1.02); }
.mapa__boton{
  position:absolute; left:1rem; bottom:1rem; padding:.55rem 1rem; border-radius:999px;
  font-size:.85rem; font-weight:600; letter-spacing:.04em; color:#fff;
  background:rgba(10,10,11,.78); box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.mapa figcaption{ margin-top:.5rem; font-size:.75rem; color:var(--on-dark-muted); text-align:right; }

/* ---------------------------------------------------------------- cierre */
.cierre{
  position:relative; overflow:hidden; color:#fff; padding-block:clamp(4.5rem, 10vw, 8rem);
  background: radial-gradient(120% 140% at 85% 20%, #9B6BFF 0%, var(--accent) 38%, #4B22C9 100%);
}
.cierre::after{   /* la V del logo, enorme y apenas visible */
  content:""; position:absolute; right:-4%; top:50%; width:min(46vw, 560px); aspect-ratio:160/182; transform:translateY(-50%);
  background:url('../img/logo-v.png') center / contain no-repeat; opacity:.14; mix-blend-mode:screen; pointer-events:none;
}
.cierre__dentro{ position:relative; z-index:1; display:grid; gap:1.25rem; justify-items:start; }
.cierre p{ margin:0; font-size:1.15rem; max-width:44ch; color:rgba(255,255,255,.9); }
.cierre .boton{ margin-top:.75rem; }

/* ------------------------------------------------------------------- pie */
.pie{ background:var(--darker); color:var(--on-dark-muted); padding-block:3rem; font-size:.9rem; }
.pie__dentro{ display:grid; grid-template-columns:auto 1fr; gap:1.5rem 2rem; align-items:center; }
.pie img{ width:64px; }
.pie p{ margin:0; }
.pie p + p{ margin-top:.4rem; }
.pie strong{ color:var(--paper); font-weight:600; }
.pie a{ color:var(--paper); text-decoration:none; }
.pie a:hover{ color:#fff; text-decoration:underline; text-decoration-color:var(--accent); }
.pie__legal{ font-size:.82rem; }
.pie__credito{ grid-column:1 / -1; padding-top:1.5rem; border-top:1px solid var(--on-dark-hairline); font-size:.8rem; }

/* ------------------------------------------------------ volver arriba (JS) */
.to-top{
  position:fixed; right:18px; bottom:18px; z-index:50;
  width:46px; height:46px; border-radius:50%; border:0; cursor:pointer;
  background:var(--accent); color:#fff; display:grid; place-items:center;
  box-shadow:0 4px 18px rgba(0,0,0,.35);
  opacity:0; visibility:hidden;
  transition:opacity .3s var(--ease), visibility .3s, background .2s;
}
.to-top.is-visible{ opacity:1; visibility:visible; }
.to-top:hover{ background:var(--accent-hover); }

/* ------------------------------------------------------ entrada del hero */
.js-listo .hero__fondo{ clip-path: inset(40% 42% 40% 42%); transition: clip-path 1.4s cubic-bezier(.66,0,.2,1); }
.entrada .hero__fondo{ clip-path: inset(0); }
.js-listo .hero__fondo::after{ opacity:0; transition:opacity .9s var(--ease) .7s; }
.entrada .hero__fondo::after{ opacity:1; }
.js-listo .hero__fondo img{ transform:scale(1.12); transition:transform 2.4s cubic-bezier(.16,.72,.28,1); }
.entrada .hero__fondo img{ transform:none; }
.js-listo .nav:not(.is-abierta){ opacity:0; transition:opacity .6s var(--ease) 1.1s, transform .35s var(--ease), background .35s, box-shadow .35s; }
.entrada .nav{ opacity:1 !important; }
.js-listo .hero__contenido > *{
  opacity:0; transform:translateY(var(--dy, 60px));
  transition:opacity .8s var(--ease), transform 1s cubic-bezier(.16,.72,.28,1);
  transition-delay:calc(1.05s + var(--i, 0) * 90ms);
}
.entrada .hero__contenido > *{ opacity:1; transform:none; }

.js-listo .revela{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.js-listo .revela.visto{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .js-listo .hero__fondo, .js-listo .hero__fondo img, .js-listo .nav, .js-listo .hero__contenido > *, .js-listo .revela{
    opacity:1 !important; transform:none !important; clip-path:none !important; transition:none !important;
  }
}

/* ------------------------------------------------------------ página legal */
.pagina-legal .nav{ position:sticky; }
.legal__volver{ margin-left:auto; font-size:.95rem; text-decoration:none; opacity:.8; }
.legal__volver:hover{ opacity:1; color:var(--accent-soft); }
.legal__dentro{ max-width:780px; }
.legal .display{ font-size:clamp(2.75rem, 7vw, 4.5rem); }
.legal__indice{ margin:1.25rem 0 0; color:var(--muted); }
.legal__indice a{ color:var(--paper); text-decoration-color:var(--accent); text-underline-offset:3px; }
.legal__pendiente{ margin:1.5rem 0 0; padding:.9rem 1.1rem; border-radius:var(--radius); font-size:.9rem; color:#F5D38A; background:rgba(245,185,60,.1); box-shadow:inset 0 0 0 1px rgba(245,185,60,.3); }
.legal section{ margin-top:clamp(3rem, 6vw, 4.5rem); scroll-margin-top:calc(var(--nav-h) + 1rem); }
.legal h2{ margin:0 0 1rem; font-family:var(--font-display); font-weight:400; font-size:2.4rem; letter-spacing:.03em; text-transform:uppercase; line-height:1; }
.legal h3{ margin:1.75rem 0 .4rem; font-size:1.05rem; font-weight:600; }
.legal p, .legal li{ color:var(--on-dark-muted); }
.legal strong{ color:var(--paper); font-weight:600; }
.legal a{ color:var(--paper); text-decoration-color:var(--accent); text-underline-offset:3px; }
.legal ul{ padding-left:1.2rem; display:grid; gap:.5rem; }
.legal__datos{ margin:1.25rem 0; display:grid; gap:.9rem; padding:1.25rem 1.4rem; border-radius:var(--radius); background:color-mix(in srgb, var(--paper) 4%, transparent); }
.legal__datos div{ display:grid; grid-template-columns:7rem 1fr; gap:1rem; }
.legal__datos dt{ font-size:.75rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--on-dark-muted); padding-top:.2rem; }
.legal__datos dd{ margin:0; overflow-wrap:anywhere; }
@media (max-width:480px){ .legal__datos div{ grid-template-columns:1fr; gap:.2rem; } }
/* en el carrusel móvil las tarjetas entran de lado: sin animación de aparición */
@media (max-width:600px){ .js-listo .zonas .revela{ opacity:1; transform:none; transition:none; } }
.legal a[href^="tel:"], .ficha a[href^="tel:"]{ white-space:nowrap; }

/* ---------------------------------------------------------------- galería de la sala */
.sala{ display:grid; grid-template-columns:repeat(3, 1fr); gap:clamp(.75rem, 1.5vw, 1.25rem); margin:clamp(2.5rem, 5vw, 4rem) 0 0; }
.sala figure{ margin:0; overflow:hidden; border-radius:var(--radius); }
.sala img{ display:block; width:100%; aspect-ratio:3/4; object-fit:cover; transition:transform .8s var(--ease); }
.sala figure:hover img{ transform:scale(1.02); }
@media (max-width:600px){ .sala{ grid-template-columns:1fr; } }
.sala__nota{ margin:clamp(1.5rem, 3vw, 2.25rem) 0 0; padding-left:1rem; border-left:3px solid var(--accent); color:var(--muted); max-width:60ch; }
.sala__nota b{ color:var(--paper); font-weight:600; }