/* ══════════ Pulso Gym ══════════
   Negro + un solo neón lima. Anton (títulos en mayúsculas) + Space Grotesk. */
:root {
  --negro:  #0C0C0D;
  --carbon: #151517;
  --gris-1: #1E1E21;
  --gris-2: #2A2A2E;
  --blanco: #F4F4F0;
  --gris:   #9A9A94;
  --neon:   #C8FF2E;
  --neon-2: #B3EB12;
  --linea:  rgba(244,244,240,.1);

  --disp: "Anton", "Impact", "Arial Narrow", sans-serif;
  --sans: "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease: cubic-bezier(.2,.7,.2,1);
  --r:    14px;
  --wrap: 1200px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--negro); color: #C9C9C3; font-family: var(--sans); font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; color: var(--blanco); font-weight: 400; }
h1, h2 { font-family: var(--disp); text-transform: uppercase; letter-spacing: .005em; line-height: .95; }
h1 em, h2 em { font-style: normal; color: var(--neon); }
p, ul, ol, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button, input, select { font: inherit; }
:focus-visible { outline: 3px solid var(--neon); outline-offset: 3px; }
.wrap { width: min(var(--wrap), 100% - 32px); margin-inline: auto; }

/* ── Botones ── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .95rem 1.5rem; border: 2px solid transparent; border-radius: 10px; font-weight: 700; font-size: .95rem; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s var(--ease), box-shadow .2s; }
.btn:hover { transform: translateY(-2px); }
.btn-neon { background: var(--neon); color: var(--negro); box-shadow: 0 0 0 0 rgba(200,255,46,.5); }
.btn-neon:hover { background: var(--neon-2); box-shadow: 0 10px 30px -10px rgba(200,255,46,.6); }
.btn-claro { background: rgba(244,244,240,.1); color: var(--blanco); border-color: rgba(244,244,240,.25); }
.btn-claro:hover { border-color: var(--blanco); }
.btn-linea { border-color: var(--gris-2); color: var(--blanco); }
.btn-linea:hover { border-color: var(--neon); color: var(--neon); }
.btn-sm { padding: .55rem 1rem; font-size: .82rem; }
.btn-ancho { width: 100%; }

/* ── Nav ── */
.nav { position: fixed; inset: 0 0 auto; z-index: 40; transition: background .3s, border-color .3s; border-bottom: 1px solid transparent; }
.nav.is-solid { background: rgba(12,12,13,.94); border-color: var(--linea); }
.nav-in { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 70px; }
.marca { display: inline-flex; align-items: center; gap: .5rem; font-family: var(--disp); font-size: 1.6rem; letter-spacing: .04em; color: var(--blanco); text-decoration: none; }
.marca span { color: var(--neon); }
.marca svg { width: 34px; height: 22px; fill: none; stroke: var(--neon); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.nav-links { display: flex; gap: 1.8rem; }
.nav-links a { text-decoration: none; font-weight: 600; font-size: .92rem; color: var(--blanco); }
.nav-links a:hover { color: var(--neon); }

/* ── Portada ── */
.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; padding: 110px 0 3.5rem; overflow: hidden; }
.hero-fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.15) brightness(.55); transform: scale(1.05); }
.hero-velo { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,12,13,.95) 0%, rgba(12,12,13,.7) 45%, rgba(12,12,13,.25) 100%), linear-gradient(0deg, var(--negro) 0%, transparent 35%); }
.hero-in { position: relative; }
.estado { display: inline-flex; align-items: center; gap: .5rem; padding: .4rem .85rem; border-radius: 100px; background: rgba(244,244,240,.08); border: 1px solid var(--linea); font-size: .85rem; font-weight: 600; color: var(--blanco); }
.punto { width: 9px; height: 9px; border-radius: 50%; background: var(--gris); }
.punto.is-abierto { background: var(--neon); box-shadow: 0 0 0 4px rgba(200,255,46,.2); animation: latido 1.6s ease-in-out infinite; }
@keyframes latido { 50% { box-shadow: 0 0 0 7px rgba(200,255,46,.05); } }
.hero h1 { margin-top: 1.2rem; font-size: clamp(3.4rem, 1.8rem + 8vw, 8.4rem); }
.hero-lead { margin-top: 1.4rem; max-width: 34rem; font-size: 1.12rem; color: #DADAD4; }
.hero-cta { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.hero-datos { display: flex; flex-wrap: wrap; gap: 2.4rem; margin-top: 2.6rem; padding-top: 1.4rem; border-top: 1px solid var(--linea); max-width: 36rem; }
.hero-datos li { display: grid; line-height: 1.1; }
.hero-datos b { font-family: var(--disp); font-weight: 400; font-size: 2.3rem; color: var(--neon); }
.hero-datos span { font-size: .85rem; color: var(--gris); }

/* ── Secciones ── */
.bloque { padding: clamp(4rem, 9vw, 6.5rem) 0; }
.bloque-gris { background: var(--carbon); }
.sec-head { max-width: 46rem; margin-bottom: clamp(2rem, 5vw, 3rem); }
.eyebrow { display: inline-block; font-weight: 700; font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; color: var(--neon); margin-bottom: .8rem; }
.sec-head h2, .h2-sola { font-size: clamp(2.6rem, 1.6rem + 4vw, 4.8rem); }
.sec-head p:not(.eyebrow) { margin-top: 1rem; font-size: 1.04rem; }
.sec-head b { color: var(--blanco); }

/* ── Planes ── */
.planes { display: grid; gap: 1rem; }
.plan { position: relative; display: grid; gap: .7rem; align-content: start; padding: 1.6rem 1.4rem; border-radius: var(--r); background: var(--carbon); border: 1px solid var(--linea); transition: transform .3s var(--ease), border-color .3s; }
.plan:hover { transform: translateY(-4px); border-color: var(--gris-2); }
.plan.is-dest { background: var(--gris-1); border: 2px solid var(--neon); }
.plan-tag { position: absolute; top: -12px; left: 1.2rem; padding: .2rem .7rem; border-radius: 100px; background: var(--neon); color: var(--negro); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.plan h3 { font-family: var(--sans); font-weight: 700; font-size: 1.05rem; text-transform: uppercase; letter-spacing: .1em; color: var(--gris); }
.plan-precio { display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .5rem; }
.plan-precio b { font-family: var(--disp); font-weight: 400; font-size: 3.2rem; line-height: 1; color: var(--blanco); }
.is-dest .plan-precio b { color: var(--neon); }
.plan-precio span { font-size: .9rem; color: var(--gris); white-space: nowrap; }
.plan-nota { font-size: .9rem; }
.plan-inc { display: grid; gap: .4rem; margin: .4rem 0 .8rem; }
.plan-inc li { position: relative; padding-left: 1.5rem; font-size: .9rem; }
.plan-inc li::before { content: ""; position: absolute; left: 0; top: .5em; width: 12px; height: 7px; border-left: 2px solid var(--neon); border-bottom: 2px solid var(--neon); transform: rotate(-45deg); }
.plan .btn { margin-top: auto; }

/* ── Calculadora ── */
.calc { display: grid; gap: 1.6rem; margin-top: 2.4rem; padding: clamp(1.4rem, 3vw, 2.2rem); border-radius: var(--r); background: linear-gradient(120deg, var(--gris-1), var(--carbon)); border: 1px solid var(--linea); }
.calc h3 { font-family: var(--disp); text-transform: uppercase; font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.6rem); line-height: 1; }
.calc h3 em { font-style: normal; color: var(--neon); }
.calc-txt > p { margin-top: .6rem; }
.dias-sel { display: flex; gap: .4rem; margin-top: 1.2rem; }
.dias-sel button { width: 50px; height: 50px; border-radius: 12px; border: 2px solid var(--gris-2); background: transparent; color: var(--blanco); font-family: var(--disp); font-size: 1.5rem; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.dias-sel button:hover { border-color: var(--neon); }
.dias-sel button.is-on { background: var(--neon); border-color: var(--neon); color: var(--negro); }
.dias-txt { margin-top: .6rem; font-size: .9rem; color: var(--gris); }
.calc-res { padding: 1.4rem; border-radius: 12px; background: var(--negro); border: 1px solid var(--linea); }
.cr-label { font-size: .76rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); }
.cr-plan { font-family: var(--disp); text-transform: uppercase; font-size: 2.6rem; line-height: 1.05; color: var(--neon); }
.cr-por { font-size: 1rem; }
.cr-por b { color: var(--blanco); font-size: 1.3rem; }
.cr-comp { display: grid; gap: .3rem; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--linea); }
.cr-comp li { display: flex; justify-content: space-between; gap: 1rem; font-size: .88rem; }
.cr-comp li.is-mejor { color: var(--neon); font-weight: 700; }

/* ── Clases ── */
.dias { display: grid; grid-template-columns: repeat(6, 1fr); gap: .4rem; margin-bottom: 1.2rem; }
.dia { padding: .8rem .2rem; border-radius: 10px; border: 1px solid var(--linea); background: var(--gris-1); color: var(--blanco); font-weight: 700; font-size: 1rem; cursor: pointer; text-transform: uppercase; letter-spacing: .05em; transition: background .2s, color .2s; }
.dia span { display: none; }
.dia.is-on { background: var(--neon); color: var(--negro); border-color: var(--neon); }
.dia.es-hoy:not(.is-on) { border-color: var(--neon); }
.dia-panel { display: grid; gap: .5rem; }
.dia-panel[hidden] { display: none; }
.clase { display: grid; grid-template-columns: 5.6rem 1fr auto; gap: .4rem 1rem; align-items: center; padding: 1rem 1.1rem; border-radius: 12px; background: var(--gris-1); border: 1px solid transparent; transition: border-color .2s; }
.clase:hover { border-color: var(--gris-2); }
.clase.is-ahora { border-color: var(--neon); }
.clase.ya-paso { opacity: .45; }
.cl-hora { font-family: var(--disp); font-size: 1.5rem; color: var(--blanco); }
.cl-txt h4 { font-family: var(--sans); font-weight: 700; font-size: 1.1rem; }
.cl-txt p { font-size: .85rem; color: var(--gris); }
.cl-estado { grid-column: 2; font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--neon); }
.cl-estado:empty { display: none; }
.cl-btn { grid-column: 3; grid-row: 1 / 3; padding: .55rem 1rem; border-radius: 10px; border: 2px solid var(--neon); background: transparent; color: var(--neon); font-weight: 700; font-size: .85rem; cursor: pointer; transition: background .2s, color .2s; }
.cl-btn:hover { background: var(--neon); color: var(--negro); }

/* ── Ocupación ── */
.ocup-in { display: grid; gap: 2rem; align-items: end; }
.ocup-txt { margin-top: 1rem; }
.ocup-ahora { margin-top: 1rem; display: inline-block; padding: .4rem .8rem; border-radius: 100px; background: var(--gris-1); color: var(--blanco); font-weight: 600; font-size: .9rem; }
.ocup-ahora:empty { display: none; }
.ocup { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; align-items: end; height: 220px; padding-bottom: 1.6rem; position: relative; }
.barra { position: relative; border-radius: 6px 6px 2px 2px; background: var(--gris-2); min-height: 6px; transition: height .8s var(--ease); }
.barra.is-alta { background: #5A5A55; }
.barra.is-ahora { background: var(--neon); }
.barra small { position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); font-size: .7rem; color: var(--gris); white-space: nowrap; }

/* ── Áreas ── */
.areas { display: grid; gap: 1rem; }
.area { position: relative; overflow: hidden; border-radius: var(--r); background: var(--gris-1); min-height: 260px; display: flex; align-items: flex-end; }
.area img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.6) brightness(.6); transition: filter .5s, transform .8s var(--ease); }
.area:hover img { filter: grayscale(0) brightness(.75); transform: scale(1.05); }
.area div { position: relative; padding: 1.3rem; background: linear-gradient(0deg, rgba(12,12,13,.9), transparent); width: 100%; }
.area h3 { font-family: var(--disp); text-transform: uppercase; font-size: 1.7rem; line-height: 1.05; }
.area p { font-size: .9rem; color: #D2D2CC; }

/* ── Prueba ── */
.prueba { background: radial-gradient(circle at 15% 30%, rgba(200,255,46,.12), transparent 50%), var(--negro); }
.prueba-in { display: grid; gap: 2rem; align-items: center; }
.prueba-txt { margin-top: 1rem; font-size: 1.05rem; max-width: 30rem; }
.form { display: grid; gap: 1rem; padding: 1.4rem; border-radius: var(--r); background: var(--carbon); border: 1px solid var(--linea); }
.campo { display: grid; gap: .35rem; }
.campo label { font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gris); }
.campo input, .campo select { width: 100%; padding: .85rem .95rem; border-radius: 10px; border: 2px solid var(--gris-2); background: var(--negro); color: var(--blanco); font-size: 1rem; color-scheme: dark; }
.campo input:focus, .campo select:focus { outline: none; border-color: var(--neon); }
.campo.is-error input { border-color: #FF6B4A; }
.aviso { color: #FF8A6B; font-weight: 600; }

/* ── Ubicación ── */
.ubic-in { display: grid; gap: 2rem; }
.datos { display: grid; gap: 1rem; margin-top: 1.6rem; }
.datos dt { font-size: .76rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--neon); }
.datos dd { color: var(--blanco); }
.faq { margin-top: 1.8rem; border-top: 1px solid var(--linea); }
.faq details { border-bottom: 1px solid var(--linea); }
.faq summary { cursor: pointer; list-style: none; padding: 1rem 2rem 1rem 0; position: relative; font-weight: 700; color: var(--blanco); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: .2rem; top: 50%; transform: translateY(-50%); color: var(--neon); font-size: 1.4rem; transition: transform .2s; }
.faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq details p { padding-bottom: 1rem; font-size: .94rem; }
.mapa { border-radius: var(--r); overflow: hidden; min-height: 320px; border: 1px solid var(--linea); }
.mapa iframe { width: 100%; height: 100%; min-height: 320px; border: 0; filter: grayscale(1) invert(.9) contrast(.9); }

/* ── Pie ── */
.pie { padding: 2.6rem 0 6rem; border-top: 1px solid var(--linea); }
.pie-in { display: grid; gap: .4rem; justify-items: center; text-align: center; font-size: .9rem; color: var(--gris); }
.pie .marca { font-size: 2rem; }
.pie a { color: var(--neon); }
.pie-mini { font-size: .8rem; }

.wa-flota { position: fixed; right: 16px; bottom: 16px; z-index: 50; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #25D366; color: #fff; box-shadow: 0 12px 26px -10px rgba(0,0,0,.7); transition: transform .25s var(--ease); }
.wa-flota:hover { transform: scale(1.08); }

/* ── Créditos ── */
.creditos { max-width: 760px; padding: 3rem 0 4rem; }
.volver { color: var(--neon); font-weight: 700; text-decoration: none; }
.creditos h1 { margin: 1.2rem 0 .8rem; font-size: clamp(2.4rem, 1.6rem + 3vw, 3.8rem); }
.creditos > p a { color: var(--neon); }
.cred-lista { display: grid; gap: .6rem; margin-top: 1.8rem; }
.cred-lista li { display: grid; grid-template-columns: 96px 1fr; gap: 1rem; align-items: center; padding: .7rem; border-radius: 12px; background: var(--carbon); }
.cred-lista img { width: 96px; height: 72px; object-fit: cover; border-radius: 8px; }
.cred-lista div { display: grid; font-size: .88rem; line-height: 1.4; }
.cred-lista b { color: var(--blanco); }
.cred-lista span { color: var(--gris); }
.cred-lista a { color: var(--neon); font-weight: 700; }

/* ── Tamaños ── */
@media (min-width: 640px) {
  .planes { grid-template-columns: repeat(2, 1fr); }
  .areas { grid-template-columns: repeat(2, 1fr); }
  .dia { font-size: .9rem; }
  .dia span { display: none; }
}
@media (min-width: 980px) {
  .planes { grid-template-columns: repeat(5, 1fr); align-items: stretch; }
  .plan.is-dest { transform: translateY(-10px); }
  .plan.is-dest:hover { transform: translateY(-14px); }
  .calc { grid-template-columns: 1.2fr 1fr; align-items: center; gap: 2.4rem; }
  .areas { grid-template-columns: repeat(3, 1fr); }
  .ocup-in { grid-template-columns: .8fr 1.2fr; gap: 3rem; }
  .prueba-in { grid-template-columns: 1fr 1fr; gap: 4rem; }
  .ubic-in { grid-template-columns: 1fr 1.1fr; gap: 3rem; }
}
@media (max-width: 860px) {
  .nav-links { display: none; }
}
@media (max-width: 520px) {
  .hero-datos { gap: 1.6rem; }
  .hero-datos b { font-size: 1.9rem; }
  .clase { grid-template-columns: 4.4rem 1fr auto; padding: .9rem; gap: .3rem .7rem; }
  .cl-hora { font-size: 1.2rem; }
  .ocup { height: 170px; gap: 2px; }
  .barra small { font-size: .6rem; }
  .dias-sel button { width: 44px; height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .punto.is-abierto { animation: none; }
  html { scroll-behavior: auto; }
}

/* ── Sucursales ── */
.pase { display: flex; justify-content: center; margin: 0 0 2rem; }
.pase-tarjeta { width: min(380px, 100%); padding: 1.2rem 1.4rem; border-radius: 16px; background: linear-gradient(135deg, #1E1E21, #0C0C0D 60%), var(--negro); border: 1px solid rgba(200,255,46,.4); box-shadow: 0 20px 40px -20px rgba(200,255,46,.35); transform: rotate(-2deg); }
.pase-marca { font-family: var(--disp); font-size: 1.5rem; letter-spacing: .04em; color: var(--blanco); }
.pase-marca span { color: var(--neon); }
.pase-tit { font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); margin-top: .1rem; }
.pase-sucs { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .9rem; }
.pase-sucs li { padding: .25rem .7rem; border-radius: 100px; background: rgba(200,255,46,.12); color: var(--neon); font-size: .8rem; font-weight: 700; }
.pase-sucs li::before { content: "✓ "; }
.suc-in { display: grid; gap: 1.2rem; }
.suc-lista { display: grid; gap: .7rem; }
.suc { display: flex; gap: .9rem; width: 100%; padding: 1.1rem 1.2rem; border-radius: 14px; border: 1px solid var(--linea); background: var(--gris-1); color: inherit; text-align: left; cursor: pointer; transition: border-color .2s, background .2s; font: inherit; }
.suc:hover { border-color: var(--gris-2); }
.suc.is-on { border-color: var(--neon); background: #1D2216; }
.suc-pin { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--negro); }
.suc-pin svg { width: 20px; height: 20px; fill: none; stroke: var(--neon); stroke-width: 2; }
.suc-txt { display: grid; gap: .2rem; min-width: 0; }
.suc-top { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .6rem; }
.suc-top b { font-family: var(--disp); font-weight: 400; font-size: 1.45rem; text-transform: uppercase; color: var(--blanco); }
.suc-top em { font-style: normal; padding: .1rem .55rem; border-radius: 100px; background: var(--neon); color: var(--negro); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.suc-dir { color: var(--blanco); font-size: .92rem; }
.suc-hor { color: var(--gris); font-size: .84rem; }
.suc-estado { font-size: .8rem; font-weight: 700; color: #FF8A6B; }
.suc-estado.is-abierta { color: var(--neon); }
.suc-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .35rem; }
.suc-chips li { padding: .15rem .55rem; border-radius: 100px; border: 1px solid var(--gris-2); font-size: .74rem; color: #D4D4CE; }
.suc-mapa-caja { display: grid; gap: .8rem; }
.suc-mapa { height: 380px; border-radius: 14px; overflow: hidden; border: 1px solid var(--linea); background: var(--gris-1); z-index: 0; }
.pin-gym span { display: block; width: 26px; height: 26px; border-radius: 50%; background: var(--negro); border: 3px solid var(--neon); box-shadow: 0 0 0 4px rgba(200,255,46,.2); transition: transform .2s; }
.pin-gym.is-on span { background: var(--neon); transform: scale(1.25); box-shadow: 0 0 0 6px rgba(200,255,46,.25), 0 0 18px rgba(200,255,46,.7); }
.faq-suc { margin-top: 2rem; }
@media (min-width: 980px) {
  .suc-in { grid-template-columns: 1fr 1.15fr; gap: 1.6rem; align-items: start; }
  .suc-mapa { height: 470px; }
  .faq-suc { display: grid; grid-template-columns: 1fr 1fr; column-gap: 2.4rem; border-top: 0; }
  .faq-suc details:nth-child(1), .faq-suc details:nth-child(2) { border-top: 1px solid var(--linea); }
}
.suc-mapa .teselas-oscuras { filter: invert(1) hue-rotate(180deg) brightness(.9) contrast(.9) saturate(.3); }