/* -------- Paleta -------- */
:root{
  --primario:#6D9D8A;       /* salvia */
  --arena:#F4F1EC;          /* fondo claro */
  --oscuro:#2F2F2F;         /* texto principal */
  --gris:#A0A0A0;           /* texto secundario */
  --blanco:#FFFFFF;
  --acento:#DFA37A;         /* opcional */
}

/* Base */
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--oscuro);background:var(--arena);line-height:1.6}

/* Layout */
.container{max-width:1200px;margin:0 auto;padding:0 .75rem;display:flex;align-items:center;gap:1rem}
.site-header{position:sticky;top:0;background:var(--blanco);border-bottom:1px solid #eee;z-index:1000}
.logo img{height:90px;display:block}

/* Contacto compacto */
.header-contact{display:flex;flex-direction:column;margin-left:.25rem}
.header-contact a{color:var(--primario);font-size:.9rem;text-decoration:none;line-height:1.1}
.header-contact a:hover{color:var(--oscuro)}

/* Nav */
.main-nav ul{list-style:none;display:flex;align-items:center;gap:1.15rem;white-space:nowrap}
.main-nav a{text-decoration:none;color:var(--oscuro);font-weight:500;font-size:.98rem;transition:color .2s ease}
.main-nav a:hover{color:var(--primario)}

/* Reducimos densidad para que quepa en 1 línea */
.container{justify-content:space-between}
.site-header .container{padding:.6rem .75rem}
.main-nav ul{gap:1.1rem}
.main-nav a{font-size:.96rem}

/* Dropdown */
.has-dropdown{position:relative}
.has-dropdown .dropdown-toggle{cursor:pointer}
.has-dropdown .dropdown{
  position:absolute;top:120%;left:0;min-width:220px;
  background:var(--blanco);border:1px solid #eee;border-radius:10px;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
  display:none;flex-direction:column;padding:.5rem
}
.has-dropdown .dropdown a{padding:.5rem .75rem;display:block;font-weight:500;font-size:.95rem}
.has-dropdown .dropdown a:hover{background:#f7f7f7;color:var(--primario)}
.has-dropdown:hover .dropdown{display:flex}        /* hover desktop */
.has-dropdown.open .dropdown{display:flex}         /* click mobile */

/* Acciones */
.header-actions{display:flex;gap:.6rem;align-items:center}
.cta{background:var(--primario);color:var(--blanco);padding:.55rem 1.1rem;border-radius:999px;font-size:.9rem;text-decoration:none;transition:.2s}
.cta:hover{background:var(--oscuro)}
.btn-login{padding:.5rem 1.05rem;border:1px solid var(--primario);border-radius:999px;font-size:.9rem;color:var(--primario);text-decoration:none;transition:.2s}
.btn-login:hover{background:var(--primario);color:var(--blanco)}

/* Toggle mobile */
.menu-toggle{display:none;background:none;border:none;font-size:1.5rem;cursor:pointer}

/* Responsive */
@media (max-width:1200px){
  .main-nav ul{gap:.9rem}
}
@media (max-width:990px){
  .header-contact{display:none}
}
@media (max-width:900px){
  .menu-toggle{display:block}
  .main-nav{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--blanco);border-bottom:1px solid #eee;
    box-shadow:0 8px 18px rgba(0,0,0,.06);
  }
  .main-nav.open{display:block}
  .main-nav ul{flex-direction:column;align-items:flex-start;padding:1rem .75rem;gap:.5rem}
  .has-dropdown .dropdown{position:static;min-width:100%;box-shadow:none;border:none;padding:0;margin-left:.5rem}
  .header-actions{margin-left:auto}
}

/* Pequeños refinamientos tipográficos */
.main-nav a, .btn-login, .cta {letter-spacing:.2px}

/* Top-bar ajustes */
.top-bar {
  background: var(--primario);
  color: var(--blanco);
  font-size: 0.85rem;
}
.top-bar .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0.35rem 0.75rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.top-left { text-align: left; font-weight: 500; }
.top-center { text-align: center; font-style: italic; flex: 1; }
.top-right { text-align: right; display: flex; align-items: center; gap: .6rem; }

/* Teléfono como texto normal pero clickeable */
.top-bar .phone {
  color: var(--blanco);
  text-decoration: none;
  pointer-events: auto;
  cursor: pointer;
}
.top-bar .phone:hover { text-decoration: underline; }

/* Ícono WhatsApp */
.top-bar .wa {
  color: var(--blanco);
  display: inline-flex;
  align-items: center;
}
.top-bar .wa svg { display: block; }

/* Mobile stack */
@media (max-width: 768px) {
  .top-bar .container {
    flex-direction: column;
    gap: 0.25rem;
  }
  .top-left, .top-center, .top-right {
    text-align: center;
  }
}


.btn-primario, .btn-secundario, .btn-terciario {
  display: inline-block;
  text-decoration: none;
  border-radius: 999px;
  padding: .7rem 1.2rem;
  font-weight: 600;
  letter-spacing: .2px;
}
.btn-primario { background: var(--primario); color: var(--blanco); }
.btn-primario:hover { background: var(--oscuro); }
.btn-secundario { border: 1px solid var(--primario); color: var(--blanco); background: transparent; }
.btn-secundario:hover { background: rgba(255,255,255,.12); }
.btn-terciario { border: 1px solid var(--primario); color: var(--primario); background: transparent; }
.btn-terciario:hover {   background: var(--primario);
  color: var(--blanco);}

/* =========================
   SECCIONES GENERALES
========================= */
.section { padding: clamp(2.5rem, 6vw, 2rem) 0; }
.container-narrow { max-width: 900px; margin: 0 auto; padding: 0 .75rem; }
.section h2 {
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  margin-bottom: .6rem;
}
.section p { color: var(--oscuro); opacity: .9; }

/* Features (tarjetas de tipos de clases) */
.features .container {
  max-width: 1200px; margin: 0 auto; padding: 0 .75rem;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}
.card {
  background: var(--blanco);
  border: 1px solid #eee;
  border-radius: 14px;
  padding: 1.1rem;
}
.card h3 { margin-bottom: .35rem; font-size: 1.15rem; }
.card p { font-size: .98rem; margin-bottom: .6rem; }
.card .link { color: var(--primario); text-decoration: none; font-weight: 600; }
.card .link:hover { text-decoration: underline; }

/* Highlight (Wellness Kine) */
.highlight {
  background: #ffffff;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  text-align: center;
}
.highlight .btn-primario { margin-top: .5rem; }

/* Pricing (planes y horarios) */
.pricing .container {
  max-width: 1200px; margin: 0 auto; padding: 0 .75rem;
  display: grid; grid-template-columns: 1.2fr .8fr; gap: 1.5rem; align-items: center;
}
.pricing-copy p { margin: .5rem 0 1rem 0; }
.pricing .buttons { display: flex; gap: .75rem; }
.pricing-art img { width: 100%; height: auto; border-radius: 12px; }

/* Galería tira */
.gallery .container {
  max-width: 1200px; margin: 0 auto; padding: 0 .75rem;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem;
}
.gallery-item img {
  width: 100%; height: 100%; object-fit: cover; border-radius: 10px; display: block;
}

/* FAQ CTA */
.faq-cta { text-align: center; background-color: #FFFFFF;}
.faq-cta .buttons { margin-top: .5rem; display: inline-flex; gap: .75rem; }

/* Responsive tweaks */
@media (max-width: 1024px){
  .features .container{ grid-template-columns: repeat(2,1fr); }
  .pricing .container{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .features .container{ grid-template-columns: 1fr; }
  .gallery .container{ grid-template-columns: repeat(2,1fr); }
  .hero-cta{ flex-direction: column; align-items: stretch; width: 100%; max-width: 320px; }
}

/* Intro / Nosotros */
.intro h2 {
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  margin-top: 2rem;
  margin-bottom: .6rem;
}

.intro h3 {
  font-family: "Inter", sans-serif;
  font-size: clamp(1.2rem, 2.2vw, 1.4rem);
  font-weight: 600;
  color: var(--primario);
  margin-bottom: .6rem;
}

.intro p {
  margin-bottom: 1rem;
  font-size: 1rem;
  color: var(--oscuro);
  opacity: .9;
  line-height: 1.6;
}
.intro {
  background: #F4F1EC; /* opcional: contraste con el fondo arena */
  border-radius: 12px;
  padding: 3rem 1rem;
}
.intro .hero-cta {
  margin-top: 1.5rem;
}
/* ==== FEATURES (aislado, sin usar .container) ==== */
.features .features-grid{
  max-width:1200px;
  margin:0 auto;
  padding:0 .75rem;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;                     /* ajusta separación entre tarjetas */
}

/* Tarjeta específica de features (no afecta .card genérico) */
.feature-card{
  position:relative;
  background:var(--blanco);
  border:1px solid #eee;
  border-radius:14px;
  padding:.9rem 1rem;           /* compáctala aquí */
  min-height:260px;             /* controla alto total (ajusta) */
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:box-shadow .2s ease;
}
.feature-card:hover{ box-shadow:0 6px 18px rgba(0,0,0,.06); }

.feature-card-content{ position:relative; z-index:1; }
.feature-card-content h3{ margin-bottom:.25rem; font-size:1.15rem; }
.feature-card-content p{ margin-bottom:.45rem; font-size:.98rem; }
.feature-card .link{ color:var(--primario); text-decoration:none; font-weight:600; }
.feature-card .link:hover{ text-decoration:underline; }

/* Imagen con desplazamiento controlable */
.feature-card-img{
  --img-shift:-70px;            /* puedes sobrescribir en cada <article> */
  text-align:center;
  margin-top:var(--img-shift);  /* esto SÍ afecta el layout */
  margin-bottom:-6px;
  position:relative;
  z-index:0;                    /* imagen queda detrás del texto */
}
.feature-card-img img{
  max-height:180px;             /* sube a 200/220 si la quieres mayor */
  width:auto;
  display:inline-block;
  opacity:.95;
}

/* Hover sutil (no cambia layout) */
.feature-card:hover .feature-card-img{ transform:translateY(-3px); }

/* Responsive */
@media (max-width:1024px){
  .features .features-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .features .features-grid{ grid-template-columns:1fr; }
  .feature-card{ min-height:auto; }
  .feature-card-img{ margin-top:0; margin-bottom:0; transform:none; }
}

/* =========================
   VIDEOS EN FILA
========================= */
.container-wide {
  max-width: 1400px; /* más ancho que narrow */
  margin: 0 auto;
  padding: 0 1rem;
}

.video-row {
  margin-top: 1.5rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

.video-card {
  background: var(--blanco);
  border: 1px solid #eee;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,.04);
  transition: transform .2s ease, box-shadow .2s ease;
  display: flex;
  flex-direction: column;
}
.video-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

.video {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  background: #000; /* fallback */
}

.video-card figcaption {
  padding: .6rem .8rem;
  font-weight: 600;
  font-size: .95rem;
  text-align: center;
  color: var(--oscuro);
}

/* Responsive */
@media (max-width: 1024px) {
  .video-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .video-row { grid-template-columns: 1fr; }
}

/* =========================
   CURSOS Y PROFESORES
========================= */
.courses .courses-grid{
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 1rem;
  display: grid;
  grid-template-columns: 1.2fr 1fr;   /* cursos más ancho */
  gap: 1.5rem;
}

.courses h2{
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(1.6rem, 3.2vw, 2.2rem);
  margin-bottom: .4rem;
}
.courses p{ opacity:.9; }

.courses-figure{
  margin-top: .8rem;
  background: var(--blanco);
  border: 1px solid #eee;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,.04);
}
.courses-figure img{
  width: 100%;
  height: auto;
  display: block;
}
.courses-figure figcaption{
  font-size: .9rem;
  padding: .6rem .8rem;
  color: var(--gris);
  background: #fafafa;
  border-top: 1px solid #eee;
}

.courses-actions{
  margin-top: .9rem;
  display: flex;
  gap: .6rem;
  flex-wrap: wrap;
}

/* Profesores */
.teacher-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;      /* 1 x columna en desktop, limpio */
  gap: .75rem;
}

.teacher-card{
  background: var(--blanco);
  border: 1px solid #eee;
  border-radius: 12px;
  padding: .75rem;
  display: grid;
  grid-template-columns: 64px 1fr; /* avatar + info */
  gap: .75rem;
  align-items: center;
}
.teacher-card img{
  width: 64px; height: 64px;
  border-radius: 50%;
  object-fit: cover;
  background: #f3f3f3;
}
.teacher-info h3{
  margin: 0 0 .15rem 0;
  font-size: 1.05rem;
}
.teacher-info p{
  margin: 0 0 .35rem 0;
  font-size: .95rem;
  color: var(--oscuro);
  opacity: .9;
}
.teacher-info .link{
  color: var(--primario);
  text-decoration: none;
  font-weight: 600;
}
.teacher-info .link:hover{ text-decoration: underline; }

/* Responsive */
@media (max-width: 1100px){
  .courses .courses-grid{ grid-template-columns: 1fr; }
  .teacher-list{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px){
  .teacher-list{ grid-template-columns: 1fr; }
}

/* ===== CURSOS Y PROFESORES (texto + perfiles) ===== */
.courses .courses-grid{
  max-width:1400px;
  margin:0 auto;
  padding:0 1rem;
  display:grid;
  grid-template-columns:1.2fr 1fr;   /* cursos más ancho */
  gap:1.5rem;
}

.courses h2{
  font-family:"Playfair Display", Georgia, serif;
  font-size:clamp(1.6rem,3.2vw,2.2rem);
  margin-bottom:.4rem;
}
.courses p{ opacity:.9; }

/* Lista de cursos */
.course-list{ margin-top:.75rem; display:grid; gap:1rem; }
.course-item{
  background:var(--blanco);
  border:1px solid #eee;
  border-radius:12px;
  padding:1rem;
}
.course-item h3{ margin-bottom:.25rem; font-size:1.15rem; }
.course-item h4{ margin:.35rem 0 .2rem; font-size:1rem; color:var(--primario); }
.course-item ul{ padding-left:1.1rem; }
.course-item li{ margin:.15rem 0; }
.course-item .muted{ color:var(--gris); font-size:.9rem; }

/* Acciones */
.courses-actions{ margin-top:.9rem; display:flex; gap:.6rem; flex-wrap:wrap; }

/* Profes */
.teachers .group-title{
  margin: .25rem 0 .5rem;
  font-size:1.1rem;
  color:var(--oscuro);
  border-left:4px solid var(--primario);
  padding-left:.5rem;
}
.teacher-list{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:1fr; gap:.75rem;
}
.teacher-card{
  background:var(--blanco);
  border:1px solid #eee;
  border-radius:12px;
  padding:.75rem;
  display:grid; grid-template-columns:64px 1fr; gap:.75rem; align-items:center;
}
.teacher-card img{
  width:64px; height:64px; border-radius:50%; object-fit:cover; background:#f3f3f3;
}
.teacher-info h4{ margin:0 0 .15rem 0; font-size:1.05rem; }
.teacher-info p{ margin:0 0 .35rem 0; font-size:.95rem; color:var(--oscuro); opacity:.9; }
.teacher-info .link{ color:var(--primario); text-decoration:none; font-weight:600; }
.teacher-info .link:hover{ text-decoration:underline; }

/* Responsive */
@media (max-width:1100px){
  .courses .courses-grid{ grid-template-columns:1fr; }
  .teacher-list{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .teacher-list{ grid-template-columns:1fr; }
}

/* =========================
   SIEMPRE SE PUEDE
========================= */
.siempre .section-title{
  text-align:center;
  font-family:"Playfair Display", Georgia, serif;
  font-size:clamp(1.8rem,3vw,2.4rem);
  margin-bottom:2rem;
  color:var(--primario);
}

.siempre {
  background: #FFFFFF; /* elige tu color */
}

.siempre-grid{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:2rem;
}

.siempre-col{
  display:flex;
  flex-direction:column;
  gap:2rem;
}

.siempre-item{
  display:flex;
  align-items:flex-start;
  gap:.9rem;
}
.siempre-item h3{
  margin:0 0 .25rem;
  font-size:1.1rem;
  font-weight:600;
  color:var(--primario);
}
.siempre-item p{
  margin:0;
  font-size:.95rem;
  line-height:1.5;
}

.siempre-item .icon{
  width:40px; height:40px;
  flex-shrink:0;
  color:var(--primario);
}

.siempre-center img{
  max-width:320px;
  width:100%;
  height:auto;
  border-radius:12px;
  box-shadow:0 8px 22px rgba(0,0,0,.08);
}

/* Responsive */
@media (max-width:1024px){
  .siempre-grid{
    grid-template-columns:1fr;
    gap:1.5rem;
  }
  .siempre-center{ order:-1; text-align:center; }
  .siempre-center img{ margin:0 auto; }
}

/* ===== FOOTER ===== */
.site-footer{
  background:#1f1f1f;
  color:#fff;
  padding:2.5rem 1rem 1.5rem;
  font-size:.95rem;
}
.footer-container{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:2rem;
  align-items:flex-start;
}

/* Logo grande */
.footer-logo-large{
  max-width:300px;
  margin-bottom:1rem;
}

/* Bloques */
.footer-block h4{
  margin:1rem 0 .5rem;
  font-size:1.05rem;
  font-weight:600;
  color:var(--primario);
}
.footer-block p{ margin:.3rem 0; }
.footer-block a{ color:#fff; text-decoration:none; }
.footer-block a:hover{ color:var(--primario); }

/* Redes */
.footer-social{
  display:flex;
  gap:1rem;
  margin-top:.5rem;
}
.footer-social img{
  width:28px; height:28px;
  filter: invert(1);
  transition: filter .2s ease;
}
.footer-social a:hover img{
  filter: invert(57%) sepia(11%) saturate(493%) hue-rotate(116deg) brightness(92%) contrast(90%);
}

/* Línea inferior */
.footer-bottom{
  max-width:1200px;
  margin:2rem auto 0;
  border-top:1px solid rgba(255,255,255,.2);
  padding-top:1rem;
  text-align:center;
  display:flex;
  flex-direction:column;
  gap:.25rem;
}
.footer-bottom .credit a{ color:var(--primario); }

/* Responsive */
@media (max-width:900px){
  .footer-container{
    grid-template-columns:1fr;
    text-align:center;
  }
  .footer-social{ justify-content:center; }
}

/* ===== HERO lifestyle ===== */
.hero-home {
  position: relative;
  min-height: clamp(60vh, 80vh, 92vh);
  overflow: hidden;
  background: #000;
}
.hero-home .hero-media img{
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.hero-home::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,0) 70%);
}
/* HERO ajuste vertical */
.hero-home .hero-content {
  position: relative;
  z-index: 1;
  color: #fff;
  max-width: 900px;

  /* Espaciado */
  padding: 0 .35rem;
  margin-left: 5%;              /* más alineado a la izquierda */
  margin-top: clamp(30vh, 35vh, 40vh);  /* baja el bloque aprox. a 1/3 de la pantalla */
}

.hero-home h1{
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(2rem, 5.5vw, 3.4rem);
  line-height: 1.1; margin: 0 0 .4rem 0;
}
.hero-home .lead{ font-size: clamp(1rem, 2.2vw, 1.2rem); opacity: .95; max-width: 52ch; }
.hero-home .hero-cta{ 
  display: flex;
  flex-wrap: wrap;        /* permite que salten en mobile */
  justify-content: center; /* 👈 centra horizontalmente */
  gap: .75rem;
  margin-top: 1.5rem;
  text-align: center;      /* por si los botones cambian a inline-block */
}
@media (max-width: 640px){ .hero-home .hero-cta{ flex-direction: column; max-width: 320px; }}

/* ===== Beneficios ===== */
.benefits .benefits-grid{
  max-width: 1200px; margin: 0 auto; padding: 0 .75rem;
  display: grid; grid-template-columns: repeat(3,1fr); gap: 2rem;
}
.benefit{
  background: var(--blanco); border: 1px solid #eee; border-radius: 14px;
  padding: 1rem; text-align: center;
}
.benefit-icon{ font-size: 1.6rem; margin-bottom: .35rem; }
.benefit h3{ font-size: 1.1rem; margin-bottom: .25rem; }
.benefit p{ font-size: .98rem; opacity: .9; }
@media (max-width: 900px){ .benefits .benefits-grid{ grid-template-columns: 1fr; } }

/* ===== Rutas personalizadas ===== */
.rutas .rutas-grid{
  max-width: 1400px; margin: 0 auto; padding: 0 1rem;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; align-items: start;
}
.rutas .rutas-head{
  grid-column: 1 / -1; margin-bottom: .25rem;
}
.rutas .rutas-head h2{
  font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.6rem, 3vw, 2.2rem);
}
.ruta-card{
  position: relative; display: block; text-decoration: none; color: inherit;
  border: 1px solid #eee; border-radius: 14px; overflow: hidden; background: #fff;
  transition: transform .2s ease, box-shadow .2s ease;
}
.ruta-card img{ width: 100%; height: 260px; object-fit: cover; display: block; }
.ruta-copy{ padding: .9rem 1rem; }
.ruta-copy h3{ margin: 0 0 .2rem 0; font-size: 1.1rem; color: var(--primario); }
.ruta-card:hover{ transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0,0,0,.06); }
@media (max-width: 1024px){ .rutas .rutas-grid{ grid-template-columns: 1fr; } }

/* ===== Experiencia ===== */
.experiencia .exp-grid{
  max-width: 1400px; margin: 0 auto; padding: 0 1rem;
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 1.25rem;
}
.exp-visual{ display: grid; grid-template-columns: repeat(3,1fr); gap: .5rem; }
.exp-visual img{ width: 100%; height: 220px; object-fit: cover; border-radius: 12px; }
.exp-copy h2{
  font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.6rem, 3vw, 2.1rem);
}
.testis{ list-style: none; padding: 0; margin: .5rem 0 1rem; display: grid; gap: .6rem; }
.testis blockquote{ margin: 0; font-size: .98rem; line-height: 1.5; }
.testis cite{ font-size: .9rem; opacity: .85; }
@media (max-width: 1024px){ .experiencia .exp-grid{ grid-template-columns: 1fr; } .exp-visual img{ height: 180px; } }

/* ===== Comunidad / galería ===== */
.comunidad .gallery-6{
  margin-top: .8rem; display: grid; grid-template-columns: repeat(6, 1fr); gap: .5rem;
}
.comunidad .gallery-6 img{ width: 100%; height: 160px; object-fit: cover; border-radius: 10px; }
.center{ text-align: center; }
.mt-12{ margin-top: .8rem; }
@media (max-width: 1100px){ .comunidad .gallery-6{ grid-template-columns: repeat(3,1fr); } }
@media (max-width: 640px){ .comunidad .gallery-6{ grid-template-columns: repeat(2,1fr); } }

/* ===== CTA final ===== */
.cta-final{
  background: #f9f8f6; /* arena suave */
  border-top: 1px solid #eee; border-bottom: 1px solid #eee;
}
.cta-final__box{
  text-align: center;
}
.cta-final h2{
  font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: .35rem;
}
.cta-final p{ opacity: .9; margin-bottom: .8rem; }

/* ===== HERO Nosotros (más sobrio que home) ===== */
.hero-about {
  position: relative;
  min-height: clamp(46vh, 62vh, 72vh);
  overflow: hidden;
  background:#000;
}

.hero-about .hero-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-about::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.55) 0%,
    rgba(0,0,0,.25) 45%,
    rgba(0,0,0,0) 70%
  );
}

.hero-about .hero-content {
  position: relative;
  z-index: 1;
  color: #fff;
  padding: clamp(2rem,5vw,3rem) .75rem;
  max-width: 680px;
  margin-left: 5%;
  margin-top: clamp(24vh, 36vh, 40vh); /* ↓ mueve el bloque hacia abajo */
}

.hero-about h1 {
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(1.8rem, 4.5vw, 3rem);
  line-height: 1.1;
  margin: 0 0 .4rem 0;
}

.hero-about .lead {
  max-width: 60ch;
  opacity: .95;
}

/* Ajustes responsivos */
@media (min-width:1400px){
  .hero-about .hero-content { margin-top: 38vh; }
}

@media (max-width:1024px){
  .hero-about .hero-content { margin-top: 26vh; }
}

@media (max-width:640px){
  .hero-about .hero-content {
    margin-top: 18vh;
    margin-left: 0;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* ===== Valores (Misión / Visión) ===== */
.about-values .values-grid{
  max-width:1200px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns: 1fr 1fr; gap:1rem;
}
.value-card{
  background: var(--blanco); border:1px solid #eee; border-radius:14px; padding:1.2rem;
}
.value-card h2{ color: var(--primario); margin:0 0 .35rem 0; font-size:1.25rem; }
.value-card p{ margin:0; font-size:1rem; opacity:.95; }
@media (max-width:900px){ .about-values .values-grid{ grid-template-columns:1fr; } }

/* ===== Historia ===== */
.about-history .history-grid{
  max-width:1400px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns: 1fr 1.1fr; gap:1.25rem; align-items:center;
}
.history-media img{ width:100%; height: 700px; object-fit:cover; border-radius:14px; box-shadow:0 8px 22px rgba(0,0,0,.06); }
.history-copy h2{
  font-family:"Playfair Display", Georgia, serif; font-size:clamp(1.6rem,3vw,2.1rem); margin-bottom:.35rem;
}
.history-copy p{ margin:.35rem 0; opacity:.95; }
@media (max-width:1024px){
  .about-history .history-grid{ grid-template-columns:1fr; }
  .history-media img{ height: 300px; }
}

/* ===== Equipo ===== */
.about-team .team-head{ text-align:center; max-width:800px; margin:0 auto 1rem; padding:0 1rem; }
.teacher-list--wide{
  display:grid; grid-template-columns: repeat(2, 1fr); gap:.9rem;
}
.teacher-card--xl{
  grid-template-columns: 84px 1fr; padding: 1rem;
}
.teacher-card--xl img{ width:84px; height:84px; }
.teacher-card--xl .teacher-info h4{ font-size:1.08rem; }
.teacher-card--xl .teacher-info small{ display:block; color:var(--gris); margin-top:.25rem; }
@media (max-width:900px){
  .teacher-list--wide{ grid-template-columns:1fr; }
}
.mt-20{ margin-top:1.25rem; }

/* CTA final reutiliza estilos globales .cta-final */

/* ===== HERO mini (planes) ===== */
.hero-mini{
  background: var(--arena, #f9f8f6);
  border-bottom: 1px solid #eee;
  padding: clamp(2rem, 5vw, 3.2rem) 0;
}
.hero-mini__content{
  text-align: center;
}
.hero-mini h1{
  font-family:"Playfair Display", Georgia, serif;
  font-size: clamp(1.8rem, 4.8vw, 2.6rem);
  margin: 0 0 .25rem 0;
}

/* ===== Pricing v2 ===== */
.pricing-v2__grid{
  max-width: 1200px; margin: 0 auto; padding: 0 1rem;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}
.price-card{
  background:#fff; border:1px solid #eee; border-radius:16px; padding:1.2rem;
  display:flex; flex-direction:column; gap:.75rem;
  transition: box-shadow .2s ease, transform .2s ease;
}
.price-card:hover{ box-shadow:0 16px 32px rgba(0,0,0,.06); transform: translateY(-3px); }
.price-card__head h3{ margin:0; font-size:1.25rem; }
.price-card__head .subtitle{ margin:.1rem 0 0; opacity:.8; }
.price-card__price{ display:flex; align-items:flex-end; gap:.3rem; }
.price-card .amount{ font-size:1.8rem; font-weight:700; }
.price-card .period{ opacity:.7; }
.price-card__features{ list-style:none; margin:.25rem 0 0; padding:0; display:grid; gap:.3rem; }
.price-card__cta{ display:flex; gap:.5rem; margin-top:.5rem; }
.price-card__cta .btn-primario{ flex:1; text-align:center; }
.price-card__cta .btn-terciario{ flex:1; text-align:center; }

/* Destacada */
.price-card--featured{ border-color: var(--primario); position:relative; }
.price-card__badge{
  position:absolute; top:12px; right:12px;
  background: var(--primario); color:#fff; font-size:.78rem;
  padding:.25rem .5rem; border-radius:999px;
}

/* Nota */
.pricing-v2__note{ font-size:.9rem; opacity:.85; margin-top:.6rem; }

/* Addons */
.addons__grid{
  max-width: 1000px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns: 1fr 1fr; gap:1rem;
}
.addon{
  background:#fff; border:1px solid #eee; border-radius:14px; padding:1rem;
}
.addon h3{ margin:.1rem 0 .2rem 0; }

/* FAQ (details/summary) */
.faq h2{
  text-align:center; margin-bottom:.6rem;
  font-family:"Playfair Display", Georgia, serif;
}
.faq details{
  border:1px solid #eee; border-radius:12px; background:#fff; padding:.75rem 1rem; margin:.5rem 0;
}
.faq summary{ cursor:pointer; font-weight:600; }
.faq summary::marker{ color: var(--primario); }

/* Responsive */
@media (max-width: 1024px){
  .pricing-v2__grid{ grid-template-columns: 1fr; }
  .add-ons__grid, .addons__grid{ grid-template-columns:1fr; }
}

/* ===== Horarios por sede ===== */
.horarios h2, .ubicaciones h2{
  font-family:"Playfair Display", Georgia, serif;
  font-size: clamp(1.4rem, 3vw, 2rem);
  margin-bottom: .6rem;
}

.horarios-grid{
  max-width: 1200px; margin: 0 auto; padding: 0 1rem;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}
.horario-card{
  background:#fff; border:1px solid #eee; border-radius:14px; padding:1rem;
}
.horario-card h3{ margin:.1rem 0 .25rem 0; font-size:1.05rem; }
.horario-card .tag{
  font-size:.78rem; color:#697; border:1px solid #cfd5d2; border-radius:999px; padding:.05rem .4rem; margin-left:.25rem;
}
.horario-card .address a{ color: var(--oscuro); text-decoration: none; }
.horario-card .address a:hover{ text-decoration: underline; }
.horario-card .times{ list-style: none; padding:0; margin:.5rem 0 0; display:grid; gap:.25rem; }
.horario-card .times li{ font-size:.97rem; line-height:1.4; }



/* ===== Ubicaciones ===== */
.map-list{
  max-width: 900px; margin: .4rem auto 0; padding: 0 1rem;
  list-style: none; display: grid; gap: .6rem;
}
.map-list li{ display: grid; grid-template-columns: 28px 1fr; gap:.5rem; align-items: start; background:#fff; border:1px solid #eee; border-radius:12px; padding:.75rem; }
.map-list .pin{ font-size: 1.2rem; line-height: 1.2; }
.map-list a{ color: var(--oscuro); text-decoration: none; }
.map-list a:hover{ text-decoration: underline; }

@media (max-width: 1024px){
  .horarios-grid{ grid-template-columns: 1fr; }
}

/* ===== Subnav anclas ===== */
.subnav {
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 18px;

  display: flex;
  align-items: center;
  justify-content: center;   /* CENTRA LOS PILLS */
  gap: 12px;
  flex-wrap: wrap;

  position: relative;        /* permite posicionar acciones a la derecha */
}
.subnav__list {
  display: flex;
  gap: .75rem;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
.subnav__list a {
  display: inline-block;
  padding: .5rem 1.2rem;
  border: 1px solid var(--primario);
  border-radius: 999px;
  text-decoration: none;
  font-weight: 600;
  color: var(--primario);
  background: #fff;
  transition: all .2s ease;
}
.subnav__list a:hover {
  background: var(--primario);
  color: var(--blanco);
  border-color: var(--primario);
}
.subnav__list a.active {
  background: var(--primario);
  color: var(--blanco);
}
/* Botones de la derecha */
.subnav .pill--right{
  position: absolute;
  right: 140px;   /* espacio para el botón Salir */
}

.subnav .pill--ghost:last-child{
  position: absolute;
  right: 18px;
}

/* Toggle mobile */
.subnav .menu-toggle{
  display: none;
}
.subnav{
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 18px;

  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

/* grupo central */
.subnav__center{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}

/* grupo derecha */
.subnav__right{
  position: absolute;
  right: 18px;
  display: flex;
  gap: 10px;
}

/* ===== Admin nav centrado + acciones derecha (sin solapes) ===== */
.subnav.subnav--admin{
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.subnav.subnav--admin .subnav__center{
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  min-width: 280px;
}

.subnav.subnav--admin .subnav__right{
  flex: 0 0 auto;
  display: flex;
  gap: 10px;
  margin-left: auto;
  white-space: nowrap;
}

/* opcional: si en pantallas angostas se va abajo ordenado */
@media (max-width: 820px){
  .subnav.subnav--admin{
    justify-content: center;
  }
  .subnav.subnav--admin .subnav__right{
    width: 100%;
    justify-content: center;
    margin-left: 0;
  }
}

/* ===== Tipos (layout con imagen + texto) ===== */
.tipos__stack{ display:grid; gap:1.2rem; max-width: 1200px; margin: 0 auto; padding: 0 1rem; }
.tipo{
  background:#fff; border:1px solid #eee; border-radius:16px; padding:1rem;
  display:grid; grid-template-columns: 1.1fr 1.4fr; gap:1rem; align-items:center;
}
.tipo__media img{ width:100%; height: 320px; object-fit:contain; opacity:.95; }
.tipo__copy h2{
  font-family:"Playfair Display", Georgia, serif; font-size: clamp(1.4rem, 3vw, 2rem); margin:0 0 .3rem 0;
}
.tipo__copy p{ margin:.25rem 0 .5rem 0; opacity:.95; }
.tipo .bullets{ display:grid; grid-template-columns: 1fr 1fr; gap:.75rem; margin:.5rem 0; }
.tipo .bullets h3{ font-size:1.05rem; margin:0 0 .2rem 0; color: var(--primario); }
.tipo .bullets ul{ margin:0; padding-left: 1.1rem; display:grid; gap:.25rem; }
.tipo__cta{ display:flex; gap:.5rem; margin-top:.5rem; }

@media (max-width: 1024px){
  .tipo{ grid-template-columns: 1fr; }
  .tipo__media img{ height: 260px; object-fit:contain; }
  .tipo .bullets{ grid-template-columns: 1fr; }
}

/* Reutiliza estilos de .hero-mini y .faq existentes del proyecto */

/* ===== Wellness / Kine ===== */

/* Intro */
.kine-intro__grid{
  max-width: 1200px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns: 1.2fr 1fr; gap:1.2rem; align-items:center;
}
.kine-intro__copy h2{
  font-family:"Playfair Display", Georgia, serif; font-size:clamp(1.4rem,3vw,2rem);
  margin:0 0 .35rem 0;
}
.kine-intro__copy .ticks{ margin:.5rem 0; padding-left:1.1rem; display:grid; gap:.25rem; }
.kine-intro__media img{ width:100%; height:360px; object-fit:cover; border-radius:14px; }
@media (max-width:1024px){ .kine-intro__grid{ grid-template-columns:1fr; } .kine-intro__media img{ height:260px; } }

/* Servicios */
.kine-services h2{
  text-align:center; margin-bottom:.7rem;
  font-family:"Playfair Display", Georgia, serif;
}
.cards-3{
  max-width:1200px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;
}
.card-k{
  background:#fff; border:1px solid #eee; border-radius:16px; padding:1rem; text-align:left;
  transition: box-shadow .2s ease, transform .2s ease;
}
.card-k:hover{ box-shadow:0 14px 28px rgba(0,0,0,.06); transform: translateY(-3px); }
.card-k img{ width:100%; height:180px; object-fit:cover; border-radius:12px; margin-bottom:.5rem; }
.card-k h3{ margin:.1rem 0 .25rem 0; }
@media (max-width:1024px){ .cards-3{ grid-template-columns:1fr; } }

/* Cómo funciona */
.flow-head{ text-align:center; margin-bottom:.6rem; }
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; max-width:1200px; margin:0 auto; padding:0 1rem; }
.step{
  background:#fff; border:1px solid #eee; border-radius:14px; padding:1rem; text-align:center;
}
.step .num{
  display:inline-grid; place-items:center; width:34px; height:34px; border-radius:999px;
  background:var(--primario); color:#fff; font-weight:700; margin-bottom:.4rem;
}
@media (max-width:900px){ .steps{ grid-template-columns:1fr; } }

/* Beneficios */
.benefits-grid-2{
  max-width:1200px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:center;
}
.benefits-grid-2 .ticks{ padding-left:1.1rem; display:grid; gap:.25rem; }
.benefits-img img{ width:100%; height:320px; object-fit:cover; border-radius:14px; }
@media (max-width:1024px){ .benefits-grid-2{ grid-template-columns:1fr; } .benefits-img img{ height:260px; } }

/* ===== Online / Grabadas ===== */

/* Beneficios rápidos */
.online-benefits__grid{
  max-width: 1100px; margin: 0 auto; padding: 0 1rem;
  display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem;
}
.online-benefits__grid article{
  background:#fff; border:1px solid #eee; border-radius:14px; padding:1rem;
}
.online-benefits__grid h3{ margin:.1rem 0 .25rem 0; font-size:1.1rem; color:var(--primario); }
@media (max-width: 900px){ .online-benefits__grid{ grid-template-columns:1fr; } }

/* Cómo funciona → reutiliza .steps */
.online-flow .flow-head{ text-align:center; margin-bottom:.6rem; }

/* Requisitos */
.online-reqs .reqs-grid{
  max-width: 1100px; margin: 0 auto; padding: 0 1rem;
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.online-reqs h3{ margin:0 0 .25rem 0; }
.online-reqs .ticks{ padding-left:1.1rem; display:grid; gap:.25rem; }
@media (max-width: 900px){ .online-reqs .reqs-grid{ grid-template-columns:1fr; } }

/* Parrilla de videos */
.online-videos h2{
  text-align:center; margin-bottom:.2rem;
  font-family:"Playfair Display", Georgia, serif;
}
.online-videos .sub{ text-align:center; opacity:.9; margin-bottom:.6rem; }
.videos-grid{
  max-width: 1200px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns: repeat(4, 1fr); gap:.75rem;
}
.video-card{
  background:#fff; border:1px solid #eee; border-radius:14px; overflow:hidden; text-decoration:none; color:inherit;
  transition: transform .2s ease, box-shadow .2s ease;
}
.video-card:hover{ transform: translateY(-3px); box-shadow:0 14px 28px rgba(0,0,0,.06); }
.video-card img{ width:100%; height:170px; object-fit:cover; display:block; }
.video-info{ padding:.6rem .75rem; }
.video-info h4{ margin:0 0 .15rem 0; font-size:1rem; }
.video-info small{ opacity:.8; }
@media (max-width: 1100px){ .videos-grid{ grid-template-columns: repeat(2, 1fr); } .video-card img{ height:160px; } }
@media (max-width: 640px){ .videos-grid{ grid-template-columns:1fr; } .video-card img{ height:180px; } }

/* ===== Galería ===== */
.gal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: .75rem;
}
.gal-item {
  display: block;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid #eee;
  transition: transform .2s ease, box-shadow .2s ease;
}
.gal-item:hover {
  transform: scale(1.02);
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
}
.gal-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ===== FAQ page ===== */

/* nav de categorías */
.faq-nav { padding:.6rem 0; border-bottom:1px solid #eee; background: var(--arena,#f9f8f6); }
.faq-nav__list{
  display:flex; gap:.6rem; flex-wrap:wrap; justify-content:center;
  margin:0; padding:0; list-style:none;
}
.faq-nav .pill{
  display:inline-block; padding:.45rem 1rem; border:1px solid var(--primario);
  border-radius:999px; text-decoration:none; color:var(--primario); background:#fff; font-weight:600;
  transition:all .2s ease;
}
.faq-nav .pill:hover{ background:var(--primario); color:#fff; }

/* bloques */
.faq-block h2{
  font-family:"Playfair Display", Georgia, serif;
  font-size:clamp(1.3rem, 3vw, 1.8rem);
  margin-bottom:.5rem;
}

/* details/summary (reutiliza tu estilo base .faq si ya lo tenías, aquí lo reforzamos) */
.faq-block details{
  border:1px solid #eee; border-radius:12px; background:#fff;
  padding:.75rem 1rem; margin:.5rem 0; box-shadow: 0 2px 0 rgba(0,0,0,.01);
}
.faq-block summary{
  cursor:pointer; font-weight:600; outline:none; list-style:none;
}
.faq-block summary::marker{ display:none; }  /* quita marcador en algunos navegadores */
.faq-block details[open]{ border-color:#e1e7e4; }
.faq-block details p{ margin:.45rem 0 0; opacity:.95; }

/* utilidades */
.mt-12{ margin-top:.75rem; }
.center{ text-align:center; }

/* Pequeños toques visuales para esta versión */

.kine-pilates h2 { text-align:center; margin-bottom:.7rem; font-family:"Playfair Display", Georgia, serif; }

.kine-purpose .quote-box{
  background:#fff; border:1px solid #eee; border-radius:16px;
  padding:1rem 1.2rem; text-align:center; max-width:800px; margin:0 auto;
}
.kine-purpose .quote-box h3{ margin:.1rem 0 .2rem 0; color:var(--primario); }

.kine-pilates header h2{ margin-bottom:.2rem; }
.kine-pilates .tipo{ margin-top:.6rem; }
.kine-pilates .ticks{ padding-left:1.1rem; display:grid; gap:.25rem; }

/* ===== Contacto ===== */
.contacto-grid{
  max-width:1200px; margin:0 auto; padding:0 1rem;
  display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:start;
}
.contacto-info h2, .contacto-form h2{
  font-family:"Playfair Display", Georgia, serif;
  margin-bottom:.5rem;
}
.contacto-datos{ list-style:none; padding:0; margin:.5rem 0 1rem; display:grid; gap:.3rem; }
.contacto-datos a{ color:var(--oscuro); text-decoration:none; }
.contacto-datos a:hover{ text-decoration:underline; }

.rrss a{ color:var(--primario); text-decoration:none; font-weight:600; }
.rrss a:hover{ text-decoration:underline; }

.form-row{ display:flex; flex-direction:column; margin-bottom:.75rem; }
.form-row label{ margin-bottom:.25rem; font-weight:600; font-size:.95rem; }
.form-row input, .form-row textarea{
  border:1px solid #ddd; border-radius:8px; padding:.6rem .75rem;
  font-size:1rem; background:#fff; outline:none;
  transition:border-color .2s ease;
}
.form-row input:focus, .form-row textarea:focus{ border-color:var(--primario); }

.nota{ font-size:.9rem; margin-top:.5rem; opacity:.8; }

@media (max-width:900px){
  .contacto-grid{ grid-template-columns:1fr; }
  .contacto-form{ order:-1; } /* muestra el formulario primero en móvil */
}

/* Alertas del formulario */
.alert { border-radius: 10px; padding: .8rem 1rem; margin-bottom: .9rem; font-size: .95rem; }
.alert.ok    { background: #e8f6ef; border: 1px solid #bfe6d2; color: #1c6b45; }
.alert.error { background: #fdecea; border: 1px solid #f5c2c0; color: #7a1c1a; }
.alert ul { margin: .4rem 0 0; padding-left: 1.1rem; }

/* ===== Centrado del bloque de mapa ===== */
.section.mapa {
  text-align: center;
}

.map-shell {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  margin-top: 1rem;
}

.map-shell .btn-terciario {
  display: inline-block;
  margin: 0 auto;
}

.map-shell .nota {
  font-size: .9rem;
  color: var(--gris);
  opacity: 0.8;
}

nav a.btn-primario { font-weight: 600; }
nav a { text-decoration: none; }

/* Subnav genérica */
.subnav {
  display:flex; gap:.6rem; align-items:center; flex-wrap:nowrap;
  overflow-x:auto; padding:.6rem .4rem; margin: .6rem 0 1.2rem;
  border-bottom:1px solid #e7ebe8;
}
.subnav::-webkit-scrollbar { height: 6px; }
.subnav::-webkit-scrollbar-thumb { background:#cdd7d1; border-radius:10px; }

.pill {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.55rem 1rem; border:1px solid #98b3a7; border-radius:999px;
  background:#fff; color:#2a3a33; text-decoration:none; white-space:nowrap;
  transition: transform .06s ease, background .15s ease;
}
.pill:hover { transform: translateY(-1px); }
.pill--active { background:#8aa695; color:#fff; border-color:#8aa695; }
.pill--ghost { border-color:#cfd8d3; color:#666; }
.pill--right { margin-left:auto; }
.badge {
  display:inline-block; min-width:1.4rem; padding:.05rem .45rem; text-align:center;
  border-radius:999px; background:#e7f3ed; color:#2a3a33; font-size:.8rem;
}
@media (max-width: 760px){
  .subnav { position:relative; padding-right:3.4rem; }
  .subnav .menu-toggle {
    position:absolute; right:.4rem; top:.5rem;
    border:1px solid #98b3a7; border-radius:8px; padding:.35rem .5rem; background:#fff;
  }
}

/* ============== Header responsive ============== */
.sh-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  border-bottom: 1px solid #e7ebe8;
  transition: box-shadow .2s ease, backdrop-filter .2s ease, transform .25s ease, padding .25s ease;
}

.sh-logo img {
  height: 100px;
  transition: height .25s ease;
}

.sh-nav{
  display:flex; gap:1.1rem; align-items:center;
}

/* Acciones (botones a la derecha) */
.sh-actions{ display:flex; align-items:center; gap:.6rem; }

/* Toggle (solo visible en móvil) */
.sh-nav__toggle{
  display:none; border:1px solid #98b3a7; background:#fff; border-radius:10px;
  padding:.35rem .6rem; font-size:1.05rem; line-height:1; cursor:pointer;
}

/* --------- Móvil --------- */
@media (max-width: 960px){
  .sh-header__wrap{ gap:.6rem; }
  .sh-nav__toggle{ display:inline-flex; align-items:center; justify-content:center; }

  .sh-nav{
    position:fixed; top:64px; /* aprox. alto header */
    left:0; right:0; background:#ffffff; border-top:1px solid #e7ebe8;
    display:none; flex-direction:column; gap:.8rem; padding:1rem 1.2rem;
    z-index:50;
  }
  .sh-nav.is-open{ display:flex; }

  .sh-actions{ gap:.4rem; }
  .sh-actions .btn-primario, .sh-actions .btn-secundario{
    padding:.5rem .8rem;
  }
}

/* ====== Nav principal ====== */
.sh-nav .nav-link {
  color: #2a3a33;                   /* tu color de texto */
  text-decoration: none;
  padding: .45rem .6rem;
  border-radius: 10px;
}
.sh-nav .nav-link:hover {
  background: #f2f4f3;
}
.sh-nav .nav-link:visited {         /* evita morado 'visitado' */
  color: inherit;
}

/* enlace activo */
.sh-nav .nav-link.is-active {
  background: #e7f3ed;              /* suave, en tu paleta */
  color: #2a3a33;
  font-weight: 700;
  /* si prefieres solo subrayado:
  background: transparent;
  box-shadow: inset 0 -2px 0 #8aa695;
  */
}
/* Header fijo (sticky) */
.sh-header{
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  border-bottom: 1px solid #e7ebe8;
  transition: box-shadow .18s ease, backdrop-filter .18s ease;
}
.sh-header__wrap {
  max-width: 1150px;
  margin: 0 auto;
  padding: 1.2rem 1.4rem;            /* altura normal */
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: space-between;
  transition: padding .25s ease;
}
.sh-header.is-scrolled {
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  backdrop-filter: saturate(1.2) blur(2px);
  transform: translateY(-2px);
}

.sh-header.is-scrolled .sh-header__wrap {
  padding: .6rem 1.2rem;             /* más compacto */
}
.sh-header.is-scrolled .sh-logo img {
  height: 70px;                      /* logo se achica */
}

/* por si acaso: evita que algún contenedor corte el sticky */
html, body { margin:0; }


/* ===== Ajustes visuales: Pricing Matrix más compacto + foco en Paso 1 ===== */

.pricing-matrix__controls{
  margin: 0.4rem auto 0.4rem;
}

.pricing-matrix__step{
  display: grid;
  gap: .25rem;
  justify-items: center;
  text-align: center;
  padding: 0.5rem 0.5rem 0.5rem;
  border-radius: 18px;
  background: rgba(255,255,255,.55);
  box-shadow: 0 8px 24px rgba(0,0,0,.04);
  max-width: 860px;
  margin: 0 auto 1.4rem;
}

.pricing-matrix__step-kicker{
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .78rem;
  opacity: .7;
}

.pricing-matrix__label{
  font-size: 1.1rem;
  margin: 0;
}

.pricing-matrix__pills{
  display: flex;
  gap: .55rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: .2rem;
}

.pricing-matrix__pill{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-weight: 700;
}

.pricing-matrix__hint{
  margin: .25rem 0 0;
  max-width: 720px;
  line-height: 1.35;
}

/* Grid: 4 tarjetas por fila (en desktop) */
.pricing-matrix .pricing-v2__grid{
  grid-template-columns: repeat(4, minmax(220px, 1fr));
  gap: 1rem;
  align-items: stretch;
}

/* Tarjetas más chicas (menos padding, títulos más compactos) */
.pricing-matrix .price-card{
  padding: 1.05rem 1.05rem .95rem;
  border-radius: 18px;
}

.pricing-matrix .price-card__head h3{
  font-size: 1.05rem;
  margin-bottom: .25rem;
}

.pricing-matrix .price-card__head .subtitle{
  font-size: .92rem;
  opacity: .85;
}

.pricing-matrix .price-card__price .amount{
  font-size: 2.1rem;
  line-height: 1.05;
}

.pricing-matrix .price-card__features{
  margin-top: .8rem;
  gap: .45rem;
}

.pricing-matrix .price-card__features li{
  font-size: .95rem;
}

/* CTA más compacta */
.pricing-matrix .price-card__cta{
  margin-top: 1rem;
  display: grid;
  gap: .55rem;
}

.pricing-matrix .price-card__cta a{
  padding: .85rem 1rem;
  border-radius: 999px;
}

/* Link WhatsApp menos protagonista */
.pricing-matrix .price-card__mini{
  margin-top: .5rem;
  font-size: .92rem;
  opacity: .85;
}

/* Responsive: 2 por fila */
@media (max-width: 980px){
  .pricing-matrix .pricing-v2__grid{
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}

/* Mobile: 1 por fila */
@media (max-width: 560px){
  .pricing-matrix .pricing-v2__grid{
    grid-template-columns: 1fr;
  }
}

/* ============ Pricing Matrix (CSS only) ============ */

/* Ocultar radios */
.pricing-matrix__radio{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

/* Aire y jerarquía del selector */
.pricing-matrix__controls{ margin: 1.2rem auto 1.2rem; }
.pricing-matrix__step{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.55rem;
  margin: 0 auto 1rem;
}
.pricing-matrix__step-kicker{
  display:inline-block;
  font-weight:700;
  font-size:.85rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:.25rem .6rem;
  border-radius:999px;
  background: rgba(125, 156, 142, .12);
}
.pricing-matrix__label{
  font-weight:700;
  font-size:1.05rem;
}
.pricing-matrix__hint{
  margin:.25rem 0 0;
  text-align:center;
  max-width: 720px;
  line-height:1.45;
  opacity:.92;
}

/* Pills más chicos */
.pricing-matrix__pills{
  display:flex;
  gap:.45rem;
  justify-content:center;
  flex-wrap:wrap;
}
.pricing-matrix__pill{
  cursor:pointer;
  user-select:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(125, 156, 142, .8);
  font-weight:700;
  font-size:.95rem;
  transition: transform .15s ease, background .15s ease, color .15s ease;
}
.pricing-matrix__pill:hover{ transform: translateY(-1px); }

/* Mostrar/ocultar sets (CSS puro) */
.pricing-set{ display:none; }
#wk1:checked ~ .pricing-matrix__sets #wkset1,
#wk2:checked ~ .pricing-matrix__sets #wkset2,
#wk3:checked ~ .pricing-matrix__sets #wkset3,
#wk4:checked ~ .pricing-matrix__sets #wkset4,
#wk5:checked ~ .pricing-matrix__sets #wkset5{
  display:grid;
}

/* Pill activo según radio */
#wk1:checked ~ .pricing-matrix__controls label[for="wk1"],
#wk2:checked ~ .pricing-matrix__controls label[for="wk2"],
#wk3:checked ~ .pricing-matrix__controls label[for="wk3"],
#wk4:checked ~ .pricing-matrix__controls label[for="wk4"],
#wk5:checked ~ .pricing-matrix__controls label[for="wk5"]{
  background: rgba(125, 156, 142, .95);
  color:#fff;
  border-color: rgba(125, 156, 142, .95);
}

/* Cards más compactas y 4 en fila (desktop) */
.pricing-matrix .pricing-v2__grid{
  gap: 1rem;               /* más aire entre cards */
  align-items: stretch;
  margin-top: .8rem;
}

/* Si tu grid no define columnas, forzamos aquí */
@media (min-width: 1100px){
  .pricing-matrix .pricing-v2__grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Ajustes de densidad dentro de cards */
.pricing-matrix .price-card{ padding: 1.1rem; }
.pricing-matrix .price-card__price .amount{ font-size: 2rem; }
.pricing-matrix .price-card__features{ margin:.85rem 0 0; }
.pricing-matrix .price-card__features li{ margin:.3rem 0; }

/* CTA más compacta */
.pricing-matrix .price-card__cta{
  margin-top: .9rem;
  display:flex;
  gap:.6rem;
  align-items:center;
  justify-content:space-between;
}
.pricing-matrix .price-card__cta a{
  flex:1 1 0;
  text-align:center;
  padding:.85rem .9rem;
}

/* Layout general: más ancho para el formulario, menos para centros */
.reg-wrap{
  max-width: 1180px;
  margin: 2.2rem auto;
  padding: 0 1.2rem;
  display: grid;
  grid-template-columns: 1.35fr 0.65fr; /* antes: 1.1fr .9fr */
  gap: 2.2rem;
  align-items: start;
}

/* Tarjeta del formulario: más aire */
.reg-form{
  background: #fff;
  border-radius: 18px;
  padding: 2.0rem 2.0rem;
  box-shadow: 0 8px 22px rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.06);
}

.reg-form h1{
  margin: 0 0 1.1rem 0;
  font-size: 2.2rem;
  line-height: 1.1;
}

/* Separación entre campos */
.reg-form form{
  gap: 1rem !important; /* estabas con .8rem; subimos aire */
}

/* Inputs más “pro” y full width (evita look de input chico) */
.reg-form .form-control{
  width: 100%;
  padding: .78rem .9rem;
  border-radius: 12px;
}

/* Textareas un poco más grandes */
.reg-form textarea.form-control{
  min-height: 110px;
  resize: vertical;
}

/* Hint debajo del campo, más prolijo */
.reg-form small{
  display: block;
  margin-top: .35rem;
  opacity: .75;
}

/* Aside: más compacto */
.centros-info{
  padding: 1.2rem 1.2rem;
  border-radius: 16px;
  background: rgba(255,255,255,.35);
  border: 1px solid rgba(0,0,0,.05);
}

/* Título y textos con menos aire */
.centros-info h3{
  margin: 0 0 .8rem 0;
  font-size: 1.1rem;
}

/* Cards: compactas (menos padding y menos interlineado) */
.centro-card{
  padding: .75rem .85rem;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(255,255,255,.7);
  margin-bottom: .65rem;
  cursor: pointer;
  line-height: 1.25; /* compacta direcciones */
}

.centro-card strong{
  display: block;
  margin-bottom: .25rem;
}

.centro-card p{
  margin: 0;
  opacity: .9;
  font-size: .95rem;
}

/* Estado activo */
.centro-card.active{
  border-color: rgba(120,160,140,.75);
  box-shadow: 0 6px 16px rgba(120,160,140,.18);
  background: rgba(120,160,140,.10);
}

/* Responsive */
@media (max-width: 980px){
  .reg-wrap{
    grid-template-columns: 1fr;
  }
  .centros-info{
    order: 2;
  }
}

/* =========================================
   AI CONCIERGE
========================================= */

#aiConciergeToggle{
    position:fixed;
    right:24px;
    bottom:24px;
    height:54px;
    min-width:auto;
    padding:0 18px;
    border:none;
    border-radius:999px;
    background:#6D9D8A;
    color:#fff;
    cursor:pointer;
    z-index:9999;
    box-shadow:0 10px 30px rgba(0,0,0,.18);
    transition:.25s;
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:700;
}

#aiConciergeToggle:hover{
    transform:translateY(-3px);
    background:#5f8d7c;
}

#aiConciergeToggle span{
    font-size:16px;
    line-height:1;
    white-space:nowrap;
}

#aiConciergeToggle::before{
    content:"?";
    width:26px;
    height:26px;
    border-radius:50%;
    background:rgba(255,255,255,.22);
    display:grid;
    place-items:center;
    font-size:16px;
    font-weight:800;
}

#aiOverlay{
    position:fixed;
    inset:0;
    background:rgba(20,20,20,.45);
    backdrop-filter:blur(10px);
    z-index:10000;
    display:none;
}

#aiOverlay.active{
    display:flex;
}

.aiSidebar{
    width:360px;
    background:#F4F1EC;
    padding:40px 28px;
    display:flex;
    flex-direction:column;
    border-right:1px solid rgba(0,0,0,.06);
}

.aiBrand{
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:40px;
}

.aiBrand img{
    width:150px;
    height:80px;
    object-fit:contain;
}

.aiBrand small{
    display:block;
    opacity:.6;
}

.aiBrand h2{
    margin:0;
}

.aiWelcome{
    margin-bottom:36px;
}

.aiWelcome h3{
    margin-bottom:12px;
}

.aiQuickActions{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.aiQuickBtn{
    border:none;
    border-radius:14px;
    padding:16px;
    text-align:left;
    background:#fff;
    cursor:pointer;
    transition:.2s;
    font-size:15px;
}

.aiQuickBtn:hover{
    background:#6D9D8A;
    color:#fff;
}

.aiMain{
    flex:1;
    background:#fff;
    display:flex;
    flex-direction:column;
}

.aiTopbar{
    height:82px;
    padding:0 28px;
    border-bottom:1px solid rgba(0,0,0,.06);
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.aiTopbar small{
    display:block;
    opacity:.6;
}

#aiClose{
    border:none;
    background:none;
    font-size:22px;
    cursor:pointer;
}

#aiMessages{
    flex:1;
    overflow:auto;
    padding:32px;
    display:flex;
    flex-direction:column;
    gap:18px;
}

.aiMessage{
    max-width:720px;
    padding:18px 20px;
    border-radius:22px;
    line-height:1.6;
}

.aiMessageBot{
    background:#F4F1EC;
    align-self:flex-start;
}

.aiMessageUser{
    background:#6D9D8A;
    color:#fff;
    align-self:flex-end;
}

.aiThinking{
    opacity:.55;
    font-style:italic;
}

#aiForm{
    border-top:1px solid rgba(0,0,0,.06);
    padding:22px;
    display:flex;
    gap:12px;
}

#aiInput{
    flex:1;
    border:none;
    background:#F4F1EC;
    border-radius:16px;
    padding:18px;
    font-size:16px;
    outline:none;
}

#aiForm button{
    border:none;
    background:#6D9D8A;
    color:#fff;
    border-radius:16px;
    padding:0 28px;
    cursor:pointer;
}

@media(max-width:900px){

    .aiSidebar{
        display:none;
    }

    #aiMessages{
        padding:18px;
    }

    #aiForm{
        padding:16px;
    }

}