/* =========================================================
   MaestrePhysio — hoja de estilos única
   Identidad: carbón + granate + oro + crema
   Tipografía: Playfair Display · Barlow Condensed · Barlow
   Sin build, sin dependencias. Un solo CSS para todas las páginas.
   ========================================================= */

:root{
  /* Superficies */
  --carbon:      #14171A;
  --carbon-alto: #1B1F23;
  --panel:       #23272C;
  --linea:       #333941;
  --linea-suave: rgba(245,240,232,.10);

  /* Acentos */
  --granate:     #A8394A;
  --granate-d:   #6E1F2A;
  --cobre:         #D89578;
  --cobre-claro:   #EFC4AC;

  /* Claro */
  --crema:       #F5F0E8;
  --crema-alto:  #FBF8F3;
  --tinta:       #1A1A1A;
  --tinta-suave: #4A4F55;
  --tinta-mute:  #6B6B6B;
  --regla:       #DCD6CB;

  /* Oscuro */
  --texto:       #ECEAE7;
  --texto-suave: #B4BAC1;
  --texto-mute:  #848B94;

  --ancho:       1120px;
  --ancho-texto: 68ch;
  --radio:       2px;
}

*,*::before,*::after{box-sizing:border-box;}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{animation:none !important;transition:none !important;}
}

body{
  margin:0;
  background:var(--carbon);
  color:var(--texto);
  font-family:"Barlow","Helvetica Neue",Arial,sans-serif;
  font-size:17px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block;}
[hidden]{display:none !important;}

a{color:inherit;}

:focus-visible{
  outline:2px solid var(--cobre);
  outline-offset:3px;
}

.salta-a-contenido{
  position:absolute;left:-9999px;top:0;
  background:var(--cobre);color:var(--carbon);
  padding:10px 18px;z-index:200;font-weight:600;
}
.salta-a-contenido:focus{left:12px;top:12px;}

/* ---------------------------------------------------------
   Estructura
   --------------------------------------------------------- */

.contenedor{
  width:100%;
  max-width:var(--ancho);
  margin:0 auto;
  padding:0 clamp(20px,5vw,40px);
}

.contenedor-estrecho{
  width:100%;
  max-width:820px;
  margin:0 auto;
  padding:0 clamp(20px,5vw,40px);
}

section{padding:clamp(64px,9vw,110px) 0;}

.s-carbon{background:var(--carbon);color:var(--texto);}
.s-panel {background:var(--carbon-alto);color:var(--texto);}
.s-crema {background:var(--crema);color:var(--tinta);}
.s-crema-alto{background:var(--crema-alto);color:var(--tinta);}

.s-crema .lede,.s-crema-alto .lede{color:var(--tinta-suave);}
.s-crema p,.s-crema-alto p{color:var(--tinta-suave);}
.s-crema h2,.s-crema h3,.s-crema-alto h2,.s-crema-alto h3{color:var(--tinta);}

/* Kintsugi — la grieta dorada, firma de la marca */
.kintsugi{
  height:2px;border:0;margin:0;
  background:linear-gradient(90deg,transparent,var(--cobre) 8%,var(--cobre-claro) 22%,var(--cobre) 34%,
    transparent 40%,var(--cobre) 52%,var(--cobre-claro) 66%,var(--cobre) 78%,transparent);
  opacity:.85;
}

/* ---------------------------------------------------------
   Tipografía
   --------------------------------------------------------- */

h1,h2,h3,h4{
  font-family:"Playfair Display",Georgia,"Times New Roman",serif;
  font-weight:500;
  line-height:1.1;
  letter-spacing:-.01em;
  margin:0;
}

h1{font-size:clamp(34px,6vw,60px);}
h2{font-size:clamp(28px,4.4vw,44px);}
h3{font-size:clamp(20px,2.4vw,25px);line-height:1.22;}
h4{font-size:19px;line-height:1.3;}

p{margin:0 0 1.05em;}
p:last-child{margin-bottom:0;}

.eyebrow{
  font-family:"Barlow Condensed",sans-serif;
  font-weight:600;
  font-size:14px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--cobre);
  margin:0 0 18px;
}
.s-crema .eyebrow,.s-crema-alto .eyebrow{color:var(--granate-d);}

.lede{
  font-size:clamp(18px,2.1vw,21px);
  line-height:1.55;
  color:var(--texto-suave);
  max-width:var(--ancho-texto);
  margin:20px 0 0;
}

.texto-largo{max-width:var(--ancho-texto);}
.texto-largo p+p{margin-top:0;}

.destacado{color:var(--texto);font-weight:500;}
.s-crema .destacado,.s-crema-alto .destacado{color:var(--tinta);font-weight:600;}

.granate{color:var(--granate);}
.s-crema .granate,.s-crema-alto .granate{color:var(--granate-d);}
.oro{color:var(--cobre);}

.cabecera-seccion{max-width:var(--ancho-texto);margin-bottom:clamp(38px,5vw,58px);}

/* ---------------------------------------------------------
   Navegación
   --------------------------------------------------------- */

.nav-sitio{
  position:sticky;top:0;z-index:100;
  /* Lente: cristal translúcido sobre lo que pasa por debajo. */
  background:linear-gradient(180deg,rgba(26,30,34,.78),rgba(18,21,24,.68));
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
  border-bottom:1px solid rgba(216,149,120,.20);
  box-shadow:inset 0 1px 0 rgba(245,240,232,.07), 0 12px 30px rgba(0,0,0,.24);
}

/* Sin soporte de desenfoque, se cierra el cristal para no perder legibilidad. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .nav-sitio{background:rgba(20,23,26,.96);}
}

.nav-interior{
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;
  min-height:74px;
}

.marca{
  font-family:"Playfair Display",Georgia,serif;
  font-size:19px;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--texto);
  white-space:nowrap;
}
.marca b{color:var(--cobre);font-weight:500;}
.marca-texto{text-shadow:0 1px 2px rgba(0,0,0,.55);}

/* El símbolo del logo acompaña al texto; nunca lo sustituye. */
.marca{display:flex;align-items:center;gap:12px;}
.marca-logo{height:36px;width:auto;display:block;flex:none;}
@media (max-width:420px){
  .marca{gap:9px;font-size:17px;}
  .marca-logo{height:30px;}
}

.nav-enlaces{
  display:flex;align-items:center;gap:clamp(16px,2.4vw,32px);
  list-style:none;margin:0;padding:0;
}

.nav-enlaces a{
  font-family:"Barlow Condensed",sans-serif;
  font-weight:600;
  font-size:17px;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-decoration:none;
  color:#F2EFEA;
  text-shadow:0 1px 2px rgba(0,0,0,.55);
  padding:6px 0;
  border-bottom:2px solid transparent;
  transition:color .18s,border-color .18s;
}
.nav-enlaces a:hover{color:var(--cobre-claro);}
.nav-enlaces a[aria-current="page"]{color:#fff;border-bottom-color:var(--cobre);}
.nav-enlaces .boton{text-shadow:none;}

.nav-enlaces .boton{border-bottom:0;}

.nav-boton-menu{
  display:none;
  background:none;border:1px solid var(--linea);
  color:var(--texto);
  font-family:"Barlow Condensed",sans-serif;
  font-size:15px;letter-spacing:.14em;text-transform:uppercase;
  padding:9px 14px;cursor:pointer;
}

@media (max-width:900px){
  .nav-boton-menu{display:block;}
  .nav-enlaces{
    display:none;
    position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;gap:0;
    background:rgba(22,26,29,.94);
    backdrop-filter:blur(22px) saturate(150%);
    -webkit-backdrop-filter:blur(22px) saturate(150%);
    border-bottom:1px solid rgba(216,149,120,.20);
    padding:8px 0 18px;
  }
  .nav-enlaces.abierto{display:flex;}
  .nav-enlaces li{padding:0 clamp(20px,5vw,40px);}
  .nav-enlaces a{display:block;padding:14px 0;border-bottom:1px solid var(--linea-suave);}
  .nav-enlaces a[aria-current="page"]{border-bottom-color:var(--granate);}
  .nav-enlaces .boton{margin-top:16px;text-align:center;}
}

/* ---------------------------------------------------------
   Botones
   --------------------------------------------------------- */

.boton{
  display:inline-block;
  font-family:"Barlow Condensed",sans-serif;
  font-weight:600;
  font-size:16px;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-decoration:none;
  padding:14px 28px;
  border:1px solid transparent;
  cursor:pointer;
  transition:background .18s,color .18s,border-color .18s;
}

.boton-primario{
  background:var(--granate);
  color:#fff;
  border-color:var(--granate);
}
.boton-primario:hover{background:var(--granate-d);border-color:var(--granate-d);}

.boton-cobre{
  background:var(--cobre);
  color:var(--carbon);
  border-color:var(--cobre);
}
.boton-cobre:hover{background:var(--cobre-claro);border-color:var(--cobre-claro);}

.boton-linea{
  background:transparent;
  color:var(--texto);
  border-color:var(--linea);
}
.boton-linea:hover{border-color:var(--cobre);color:var(--cobre);}

.s-crema .boton-linea,.s-crema-alto .boton-linea{
  color:var(--tinta);border-color:var(--regla);
}
.s-crema .boton-linea:hover,.s-crema-alto .boton-linea:hover{
  border-color:var(--granate-d);color:var(--granate-d);
}

.grupo-botones{
  display:flex;flex-wrap:wrap;gap:14px;
  margin-top:34px;
}

.enlace-flecha{
  display:inline-block;
  font-family:"Barlow Condensed",sans-serif;
  font-weight:600;font-size:16px;
  letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;
  color:var(--cobre);
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:border-color .18s;
}
.enlace-flecha::after{content:" →";}
.enlace-flecha:hover{border-bottom-color:currentColor;}
.s-crema .enlace-flecha,.s-crema-alto .enlace-flecha{color:var(--granate-d);}

/* ---------------------------------------------------------
   Portada
   --------------------------------------------------------- */

.portada{
  position:relative;
  overflow:hidden;
  padding:clamp(72px,11vw,140px) 0 clamp(64px,9vw,110px);
  background:
    radial-gradient(circle at 78% 12%,rgba(168,57,74,.20),transparent 52%),
    radial-gradient(circle at 8% 92%,rgba(216,149,120,.10),transparent 48%),
    var(--carbon);
  border-bottom:1px solid var(--linea);
}

.portada-interior{position:relative;z-index:2;max-width:900px;}

.portada h1 em{
  font-style:italic;
  color:var(--cobre);
}

.portada .lede{max-width:60ch;}

.arco-portada{
  position:absolute;
  top:-70px;right:-90px;
  width:clamp(280px,42vw,520px);
  height:clamp(280px,42vw,520px);
  z-index:1;
  opacity:.55;
  pointer-events:none;
}

.arco-pie{
  position:absolute;
  bottom:-90px;left:-80px;
  width:clamp(200px,26vw,340px);
  height:clamp(200px,26vw,340px);
  z-index:1;
  opacity:.28;
  pointer-events:none;
}

@media (max-width:760px){
  .arco-portada{opacity:.32;top:-40px;right:-120px;}
  .arco-pie{display:none;}
}

.franja-datos{
  display:flex;flex-wrap:wrap;
  gap:clamp(20px,4vw,52px);
  margin-top:44px;padding-top:26px;
  border-top:1px solid var(--linea);
  font-family:"Barlow Condensed",sans-serif;
  font-size:15px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--texto-mute);
}
.franja-datos b{display:block;color:var(--texto);font-weight:600;letter-spacing:.06em;}

/* Banda de datos clave — más peso que la franja normal */
.banda-clave{
  background:var(--carbon-alto);
  border-top:2px solid var(--cobre);
  border-bottom:1px solid var(--linea);
}
.banda-clave .contenedor{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
}
.banda-clave .dato{
  padding:clamp(26px,3.4vw,38px) clamp(20px,2.6vw,34px);
  border-left:1px solid var(--linea);
}
.banda-clave .dato:first-child{border-left:0;padding-left:0;}
.banda-clave .dato:last-child{padding-right:0;}

.dato-etiqueta{
  font-family:"Barlow Condensed",sans-serif;
  font-size:13.5px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--cobre);margin:0 0 10px;
}
.dato-valor{
  font-family:"Playfair Display",Georgia,serif;
  font-size:clamp(21px,2.6vw,28px);line-height:1.15;
  color:var(--texto);margin:0;
}
.dato-nota{
  font-size:15px;color:var(--texto-mute);margin:8px 0 0;
}

@media (max-width:760px){
  .banda-clave .contenedor{grid-template-columns:1fr;}
  .banda-clave .dato{
    border-left:0;border-top:1px solid var(--linea);
    padding-left:0;padding-right:0;
  }
  .banda-clave .dato:first-child{border-top:0;}
}

/* Banda de redes */
.redes-banda{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,2.6vw,32px);
  margin-top:clamp(30px,4vw,44px);
}
@media (max-width:760px){.redes-banda{grid-template-columns:1fr;}}

/* Portada corta para páginas interiores */
.portada-interior-pagina{
  position:relative;overflow:hidden;
  padding:clamp(56px,8vw,96px) 0 clamp(44px,6vw,72px);
  background:
    radial-gradient(circle at 85% 20%,rgba(168,57,74,.16),transparent 55%),
    var(--carbon);
  border-bottom:1px solid var(--linea);
}

/* ---------------------------------------------------------
   Rejillas y tarjetas
   --------------------------------------------------------- */

.rejilla-2{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3.4vw,44px);}
.rejilla-3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,36px);}
.rejilla-4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.4vw,28px);}

.rejilla-texto{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(28px,5vw,72px);
  align-items:start;
}

@media (max-width:900px){
  .rejilla-3,.rejilla-4{grid-template-columns:repeat(2,1fr);}
  .rejilla-texto{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .rejilla-2,.rejilla-3,.rejilla-4{grid-template-columns:1fr;}
}

.tarjeta{
  background:var(--panel);
  border:1px solid var(--linea);
  border-top:2px solid var(--granate);
  padding:clamp(24px,3vw,32px);
}
.tarjeta h3{margin-bottom:12px;}
.tarjeta p{color:var(--texto-suave);font-size:16px;}

.s-crema .tarjeta,.s-crema-alto .tarjeta{
  background:#fff;
  border-color:var(--regla);
  border-top-color:var(--granate-d);
}
.s-crema .tarjeta p,.s-crema-alto .tarjeta p{color:var(--tinta-suave);}

.tarjeta-cobre{border-top-color:var(--cobre);}

.tarjeta-numero{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--cobre);
  margin:0 0 12px;
}
.s-crema .tarjeta-numero,.s-crema-alto .tarjeta-numero{color:var(--granate-d);}

/* ---------------------------------------------------------
   Fases del método
   --------------------------------------------------------- */

.fases{list-style:none;margin:0;padding:0;counter-reset:fase;}

.fase{
  counter-increment:fase;
  display:grid;
  grid-template-columns:88px 1fr;
  gap:clamp(18px,3vw,40px);
  padding:clamp(26px,3.4vw,38px) 0;
  border-top:1px solid var(--regla);
}
.fase:last-child{border-bottom:1px solid var(--regla);}

.s-carbon .fase,.s-panel .fase{border-color:var(--linea);}

.fase-num{
  font-family:"Playfair Display",Georgia,serif;
  font-size:clamp(34px,5vw,52px);
  line-height:1;
  color:var(--granate-d);
  opacity:.55;
}
.s-carbon .fase-num,.s-panel .fase-num{color:var(--cobre);opacity:.6;}
.fase-num::before{content:"0" counter(fase);}

.fase h3{margin-bottom:8px;}
.fase p{font-size:16px;max-width:62ch;}

.fase-salida{
  display:inline-block;
  margin-top:12px;
  font-family:"Barlow Condensed",sans-serif;
  font-size:14.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--granate-d);
  border-left:2px solid var(--cobre);
  padding-left:12px;
}
.s-carbon .fase-salida,.s-panel .fase-salida{color:var(--cobre-claro);}

@media (max-width:640px){
  .fase{grid-template-columns:1fr;gap:6px;}
}

/* ---------------------------------------------------------
   Listas
   --------------------------------------------------------- */

.lista-marcada{list-style:none;margin:16px 0 0;padding:0;}
.lista-marcada li{
  position:relative;
  padding-left:22px;
  margin-bottom:11px;
  color:var(--texto-suave);
  font-size:16.5px;
  line-height:1.5;
}
.lista-marcada li::before{
  content:"";
  position:absolute;left:0;top:.72em;
  width:11px;height:1px;
  background:var(--granate);
}
.s-crema .lista-marcada li,.s-crema-alto .lista-marcada li{color:var(--tinta-suave);}
.s-crema .lista-marcada li::before,.s-crema-alto .lista-marcada li::before{background:var(--granate-d);}

.lista-marcada strong{color:var(--texto);font-weight:600;}
.s-crema .lista-marcada strong,.s-crema-alto .lista-marcada strong{color:var(--tinta);}

/* ---------------------------------------------------------
   Bloque destacado / cita
   --------------------------------------------------------- */

.bloque-nota{
  border-left:3px solid var(--cobre);
  background:var(--panel);
  padding:clamp(20px,2.6vw,28px) clamp(20px,3vw,32px);
  margin-top:34px;
}
.bloque-nota p{color:var(--texto-suave);font-size:16.5px;}
.s-crema .bloque-nota,.s-crema-alto .bloque-nota{
  background:#fff;border-left-color:var(--granate-d);
}

.cita{
  font-family:"Playfair Display",Georgia,serif;
  font-style:italic;
  font-size:clamp(22px,3.4vw,34px);
  line-height:1.32;
  max-width:26ch;
  margin:0;
  color:var(--texto);
}
.s-crema .cita,.s-crema-alto .cita{color:var(--tinta);}
.cita-autor{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cobre);
  margin-top:20px;
}
.s-crema .cita-autor,.s-crema-alto .cita-autor{color:var(--granate-d);}

/* ---------------------------------------------------------
   Planes de servicio
   --------------------------------------------------------- */

.plan{
  background:#fff;
  border:1px solid var(--regla);
  padding:clamp(24px,3vw,32px);
  display:flex;flex-direction:column;
}
.s-carbon .plan,.s-panel .plan{background:var(--panel);border-color:var(--linea);}

.plan-destacado{
  border:1px solid var(--granate-d);
  box-shadow:0 12px 34px rgba(26,26,26,.10);
}
.s-carbon .plan-destacado,.s-panel .plan-destacado{border-color:var(--cobre);box-shadow:none;}

.plan-etiqueta{
  font-family:"Barlow Condensed",sans-serif;
  font-size:13px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--granate-d);
  margin:0 0 10px;
}
.s-carbon .plan-etiqueta,.s-panel .plan-etiqueta{color:var(--cobre);}

.plan h3{margin-bottom:10px;}
.plan .lista-marcada{flex:1;}

.plan-pie{
  margin-top:22px;padding-top:18px;
  border-top:1px solid var(--regla);
  font-family:"Barlow Condensed",sans-serif;
  font-size:15px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--tinta-mute);
}
.s-carbon .plan-pie,.s-panel .plan-pie{border-top-color:var(--linea);color:var(--texto-mute);}

/* ---------------------------------------------------------
   Tabla
   --------------------------------------------------------- */

.envoltorio-tabla{overflow-x:auto;margin-top:30px;}

table{
  width:100%;
  border-collapse:collapse;
  font-size:16px;
  min-width:520px;
}
caption{
  text-align:left;
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--tinta-mute);
  padding-bottom:12px;
}
th{
  background:var(--granate-d);
  color:#fff;
  font-family:"Barlow Condensed",sans-serif;
  font-weight:600;
  font-size:15px;letter-spacing:.1em;text-transform:uppercase;
  text-align:left;
  padding:12px 16px;
}
td{
  padding:13px 16px;
  border-bottom:1px solid var(--regla);
  color:var(--tinta-suave);
  vertical-align:top;
}
tbody tr:nth-child(odd) td{background:rgba(255,255,255,.6);}

/* ---------------------------------------------------------
   Preguntas frecuentes
   --------------------------------------------------------- */

.faq{border-top:1px solid var(--regla);}
.s-carbon .faq,.s-panel .faq{border-color:var(--linea);}

.faq details{
  border-bottom:1px solid var(--regla);
  padding:20px 0;
}
.s-carbon .faq details,.s-panel .faq details{border-color:var(--linea);}

.faq summary{
  cursor:pointer;
  list-style:none;
  font-family:"Playfair Display",Georgia,serif;
  font-size:clamp(18px,2.1vw,21px);
  line-height:1.3;
  display:flex;justify-content:space-between;gap:20px;align-items:baseline;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{
  content:"+";
  color:var(--granate-d);
  font-family:"Barlow",sans-serif;
  font-size:24px;line-height:1;
  flex:none;
}
.s-carbon .faq summary::after,.s-panel .faq summary::after{color:var(--cobre);}
.faq details[open] summary::after{content:"–";}
.faq details p{margin-top:14px;max-width:70ch;font-size:16.5px;}

/* ---------------------------------------------------------
   Formulario
   --------------------------------------------------------- */

.formulario{margin-top:34px;}

.campo{margin-bottom:22px;}

.campo label{
  display:block;
  font-family:"Barlow Condensed",sans-serif;
  font-size:15px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--texto-suave);
  margin-bottom:8px;
}
.s-crema .campo label,.s-crema-alto .campo label{color:var(--tinta-suave);}

.campo input,
.campo select,
.campo textarea{
  width:100%;
  font-family:inherit;
  font-size:16.5px;
  color:var(--texto);
  background:var(--panel);
  border:1px solid var(--linea);
  border-radius:var(--radio);
  padding:13px 15px;
}
.campo textarea{min-height:150px;resize:vertical;}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  border-color:var(--cobre);outline:none;
}

.campo-nota{
  font-size:14.5px;
  color:var(--texto-mute);
  margin:8px 0 0;
}

.consentimiento{
  display:flex;gap:12px;align-items:flex-start;
  font-size:15.5px;color:var(--texto-suave);
  margin:26px 0 8px;
}
.consentimiento input{width:18px;height:18px;margin-top:4px;flex:none;}

/* ---------------------------------------------------------
   Canales de contacto
   --------------------------------------------------------- */

.canal{
  display:block;
  text-decoration:none;
  background:var(--panel);
  border:1px solid var(--linea);
  padding:22px 24px;
  transition:border-color .18s;
}
.canal:hover{border-color:var(--cobre);}
.canal-titulo{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cobre);margin:0 0 8px;
}
.canal-valor{
  font-family:"Playfair Display",Georgia,serif;
  font-size:19px;color:var(--texto);margin:0;word-break:break-word;
}

/* ---------------------------------------------------------
   Llamada final
   --------------------------------------------------------- */

.cta-final{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 20% 0%,rgba(168,57,74,.24),transparent 58%),
    var(--carbon-alto);
  border-top:1px solid var(--linea);
  text-align:center;
}
.cta-final .contenedor-estrecho{position:relative;z-index:2;}
.cta-final h2{margin-bottom:18px;}
.cta-final .lede{margin-left:auto;margin-right:auto;}
.cta-final .grupo-botones{justify-content:center;}

/* ---------------------------------------------------------
   Pie
   --------------------------------------------------------- */

.pie{
  background:var(--carbon);
  border-top:1px solid var(--linea);
  padding:clamp(48px,6vw,72px) 0 32px;
  font-size:15.5px;
  color:var(--texto-mute);
}

.pie-rejilla{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:clamp(28px,4vw,52px);
}
@media (max-width:760px){.pie-rejilla{grid-template-columns:1fr;}}

.pie h4{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cobre);
  margin:0 0 14px;
}

.pie ul{list-style:none;margin:0;padding:0;}
.pie li{margin-bottom:9px;}
.pie a{text-decoration:none;color:var(--texto-suave);}
.pie a:hover{color:var(--cobre);}

.pie-firma{
  font-family:"Playfair Display",Georgia,serif;
  font-size:20px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--texto);margin:0 0 12px;
}
.pie-firma b{color:var(--cobre);font-weight:500;}

.pie-lema{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--texto-mute);
}

.pie-legal{
  margin-top:clamp(34px,4vw,48px);
  padding-top:22px;
  border-top:1px solid var(--linea);
  display:flex;flex-wrap:wrap;gap:12px 28px;
  justify-content:space-between;align-items:center;
  font-size:14px;
}
.pie-legal p{margin:0;}

.aviso-sanitario{
  max-width:70ch;
  font-size:14px;
  line-height:1.5;
  color:var(--texto-mute);
  margin-top:20px;
}

/* ---------------------------------------------------------
   Pilares anatómicos — el logo desplegado en tres
   --------------------------------------------------------- */

.pilares{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  border-top:1px solid var(--regla);
  border-bottom:1px solid var(--regla);
}
.s-carbon .pilares,.s-panel .pilares{border-color:var(--linea);}

.pilar{
  padding:clamp(32px,4.4vw,52px) clamp(18px,2.6vw,34px);
  border-left:1px solid var(--regla);
  text-align:center;
}
.pilar:first-child{border-left:0;}
.s-carbon .pilar,.s-panel .pilar{border-color:var(--linea);}

.pilar-figura{
  height:clamp(116px,14vw,158px);
  margin:0 auto clamp(20px,2.6vw,28px);
  display:block;
  color:var(--granate-d);
}
.s-carbon .pilar-figura,.s-panel .pilar-figura{color:var(--cobre);}

.pilar-etiqueta{
  font-family:"Barlow Condensed",sans-serif;
  font-size:13.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--cobre);margin:0 0 10px;
}
.s-crema .pilar-etiqueta,.s-crema-alto .pilar-etiqueta{color:var(--granate-d);}

.pilar h3{margin-bottom:12px;}
.pilar p{font-size:16px;max-width:34ch;margin-left:auto;margin-right:auto;}

.pilar-remate{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--granate-d);
  border-top:1px solid var(--regla);
  margin-top:20px;padding-top:16px;display:block;
}
.s-carbon .pilar-remate,.s-panel .pilar-remate{color:var(--cobre-claro);border-color:var(--linea);}

@media (max-width:860px){
  .pilares{grid-template-columns:1fr;}
  .pilar{border-left:0;border-top:1px solid var(--regla);}
  .pilar:first-child{border-top:0;}
  .s-carbon .pilar,.s-panel .pilar{border-color:var(--linea);}
  .pilar-figura{height:104px;}
}

/* ---------------------------------------------------------
   Cristal — superficies translúcidas sobre fondo oscuro
   --------------------------------------------------------- */

.s-cristal{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 84% 8%,rgba(168,57,74,.20),transparent 55%),
    radial-gradient(circle at 6% 96%,rgba(216,149,120,.12),transparent 50%),
    var(--carbon);
  color:var(--texto);
}
.s-cristal .contenedor{position:relative;z-index:2;}

.panel-cristal{
  background:rgba(245,240,232,.045);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(245,240,232,.11);
  border-top-color:rgba(216,149,120,.36);
  padding:clamp(8px,2.4vw,26px) clamp(20px,3.4vw,44px);
  box-shadow:0 24px 60px rgba(0,0,0,.30);
}
.panel-cristal .fase{border-color:rgba(245,240,232,.10);}
.panel-cristal .fase:last-child{border-bottom:0;}
.panel-cristal .fase-num{color:var(--cobre);opacity:.62;}
.panel-cristal .fase-salida{color:var(--cobre-claro);}
.panel-cristal h3{color:var(--texto);}
.panel-cristal p{color:var(--texto-suave);}

/* ---------------------------------------------------------
   Planes — comparativa seria
   --------------------------------------------------------- */

.planes{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,2.4vw,28px);
  align-items:stretch;
}
@media (max-width:980px){.planes{grid-template-columns:1fr;}}

.plan{
  position:relative;
  background:#fff;
  border:1px solid var(--regla);
  padding:0;
  display:flex;flex-direction:column;
}

.plan-cabecera{
  padding:clamp(26px,3vw,34px) clamp(22px,2.6vw,30px) clamp(20px,2.4vw,26px);
  border-bottom:1px solid var(--regla);
}
.plan-cuerpo{
  padding:clamp(22px,2.6vw,30px);
  display:flex;flex-direction:column;flex:1;
}

.plan-duracion{
  display:inline-block;
  font-family:"Barlow Condensed",sans-serif;
  font-size:13px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--granate-d);
  border:1px solid var(--regla);
  padding:5px 12px;margin:0 0 16px;
}
.plan h3{font-size:clamp(26px,3.2vw,34px);margin:0 0 10px;}
.plan-frase{font-size:16.5px;color:var(--tinta-suave);margin:0;}

.plan-para{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--tinta-mute);
  margin:0 0 16px;
}

.plan .lista-marcada{flex:1;margin-top:0;}
.plan .lista-marcada li{font-size:16px;}

.plan-pie{
  margin-top:22px;padding-top:18px;
  border-top:1px solid var(--regla);
}
.plan-pie .boton{display:block;text-align:center;}

.plan-destacado{
  border:1px solid var(--granate-d);
  box-shadow:0 18px 46px rgba(26,26,26,.13);
}
.plan-destacado .plan-cabecera{
  background:var(--granate-d);
  border-bottom-color:var(--granate-d);
}
.plan-destacado .plan-cabecera h3{color:#fff;}
.plan-destacado .plan-frase{color:rgba(255,255,255,.86);}
.plan-destacado .plan-duracion{color:var(--cobre-claro);border-color:rgba(239,196,172,.5);}

.plan-cinta{
  position:absolute;top:0;right:0;
  background:var(--cobre);color:var(--carbon);
  font-family:"Barlow Condensed",sans-serif;
  font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  padding:6px 14px;
}

/* ---------------------------------------------------------
   Circuito — franja de rendimiento
   --------------------------------------------------------- */

.s-circuito{
  position:relative;overflow:hidden;
  background:
    linear-gradient(180deg,rgba(20,23,26,.86),rgba(20,23,26,.94)),
    radial-gradient(circle at 70% 30%,rgba(168,57,74,.30),transparent 60%),
    var(--carbon);
  color:var(--texto);
}
.s-circuito .contenedor{position:relative;z-index:2;}

.trazado{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:1;opacity:.30;pointer-events:none;
}

.meta-cuadros{
  height:14px;border:0;margin:0;
  background:
    repeating-conic-gradient(var(--texto) 0% 25%, transparent 0% 50%) 0 0/14px 14px;
  opacity:.22;
}

/* ---------------------------------------------------------
   Progreso — recorrido en curso
   --------------------------------------------------------- */

.carga{
  border:1px solid var(--linea);
  background:var(--panel);
  padding:clamp(20px,2.6vw,26px);
}
.s-crema .carga,.s-crema-alto .carga{background:#fff;border-color:var(--regla);}

.carga + .carga{margin-top:16px;}

.carga-fila{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--texto-mute);
  margin-bottom:10px;
}
.s-crema .carga-fila,.s-crema-alto .carga-fila{color:var(--tinta-mute);}
.carga-fila b{color:var(--cobre);font-weight:600;font-variant-numeric:tabular-nums;}
.s-crema .carga-fila b,.s-crema-alto .carga-fila b{color:var(--granate-d);}

.carga h4{margin:0 0 4px;}
.carga-meta{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14.5px;letter-spacing:.08em;
  color:var(--cobre-claro);margin:0 0 12px;
}
.s-crema .carga-meta,.s-crema-alto .carga-meta{color:var(--granate-d);}
.carga p{font-size:15.5px;margin:0;}

.carga-barra{
  height:7px;
  background:rgba(245,240,232,.10);
  border:1px solid var(--linea);
  margin-top:16px;
  overflow:hidden;
}
.s-crema .carga-barra,.s-crema-alto .carga-barra{background:var(--regla);border-color:var(--regla);}

.carga-relleno{
  display:block;height:100%;
  background:
    repeating-linear-gradient(115deg,transparent 0 6px,rgba(20,23,26,.22) 6px 12px),
    linear-gradient(90deg,var(--granate),var(--cobre));
}

/* ---------------------------------------------------------
   Migas de pan
   --------------------------------------------------------- */

.migas{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--texto-mute);
  padding:18px 0 0;
}
.migas ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 10px;}
.migas li::after{content:"/";margin-left:10px;color:var(--linea);}
.migas li:last-child::after{content:"";}
.migas a{color:var(--texto-suave);text-decoration:none;}
.migas a:hover{color:var(--cobre);}
.migas [aria-current="page"]{color:var(--cobre);}

/* ---------------------------------------------------------
   Microcopy bajo los CTA
   --------------------------------------------------------- */

.cta-nota{
  font-family:"Barlow Condensed",sans-serif;
  font-size:15px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--texto-mute);
  margin:16px 0 0;
}
.cta-nota b{color:var(--cobre-claro);font-weight:600;}
.s-crema .cta-nota,.s-crema-alto .cta-nota{color:var(--tinta-mute);}
.s-crema .cta-nota b,.s-crema-alto .cta-nota b{color:var(--granate-d);}

/* ---------------------------------------------------------
   Retrato
   --------------------------------------------------------- */

/* Fotografía a todo el ancho de una sección */
.foto-ancha{
  width:100%;
  aspect-ratio:21/9;
  object-fit:cover;
  border-bottom:3px solid var(--granate);
}
@media (max-width:700px){.foto-ancha{aspect-ratio:4/3;}}

.retrato{
  width:100%;max-width:360px;aspect-ratio:4/5;object-fit:cover;
  filter:grayscale(30%) contrast(1.04);
  border-bottom:3px solid var(--granate);
  background:var(--panel);
}
.retrato-hueco{
  width:100%;max-width:340px;aspect-ratio:4/5;
  background:var(--panel);border:1px solid var(--linea);
  border-bottom:3px solid var(--granate);
  display:flex;align-items:center;justify-content:center;text-align:center;
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--texto-mute);padding:20px;
}
.s-crema .retrato-hueco,.s-crema-alto .retrato-hueco{
  background:#fff;border-color:var(--regla);border-bottom-color:var(--granate-d);color:var(--tinta-mute);
}

/* ---------------------------------------------------------
   Testimonios
   --------------------------------------------------------- */

.testimonio{
  background:#fff;border:1px solid var(--regla);
  border-left:3px solid var(--granate-d);
  padding:clamp(24px,3vw,32px);
}
.s-carbon .testimonio,.s-panel .testimonio{
  background:var(--panel);border-color:var(--linea);border-left-color:var(--cobre);
}
.testimonio blockquote{
  margin:0;font-family:"Playfair Display",Georgia,serif;
  font-size:clamp(18px,2.1vw,21px);line-height:1.4;color:var(--tinta);
}
.s-carbon .testimonio blockquote,.s-panel .testimonio blockquote{color:var(--texto);}
.testimonio figcaption{
  margin-top:18px;
  font-family:"Barlow Condensed",sans-serif;
  font-size:14.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-mute);
}
.s-carbon .testimonio figcaption,.s-panel .testimonio figcaption{color:var(--texto-mute);}

/* ---------------------------------------------------------
   Reseñas — mensajes reales de pacientes
   --------------------------------------------------------- */

.resenas{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(20px,2.6vw,32px);
  align-items:stretch;
}
@media (max-width:860px){.resenas{grid-template-columns:1fr;}}

.resena{
  background:#fff;
  border:1px solid var(--regla);
  border-top:2px solid var(--granate-d);
  padding:clamp(24px,3vw,34px);
  display:flex;flex-direction:column;
}
.s-carbon .resena,.s-panel .resena,.s-cristal .resena{
  background:var(--panel);border-color:var(--linea);border-top-color:var(--cobre);
}

.resena-cabecera{display:flex;align-items:center;gap:15px;margin-bottom:20px;}

.resena-marca{
  width:48px;height:48px;flex:none;border-radius:50%;
  background:var(--granate-d);
  display:flex;align-items:center;justify-content:center;
}
.resena-marca svg{width:24px;height:24px;color:var(--cobre-claro);}

.resena-quien{
  font-family:"Barlow Condensed",sans-serif;
  font-size:16.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--tinta);margin:0;
}
.s-carbon .resena-quien,.s-panel .resena-quien{color:var(--texto);}

.resena-contexto{font-size:14.5px;color:var(--tinta-mute);margin:2px 0 0;}
.s-carbon .resena-contexto,.s-panel .resena-contexto{color:var(--texto-mute);}

.resena-texto{
  position:relative;
  font-size:17px;line-height:1.58;
  color:var(--tinta-suave);
  margin:0;flex:1;
  padding-left:26px;
}
.s-carbon .resena-texto,.s-panel .resena-texto{color:var(--texto-suave);}
.resena-texto::before{
  content:"\201C";
  position:absolute;left:-2px;top:-12px;
  font-family:"Playfair Display",Georgia,serif;
  font-size:52px;line-height:1;
  color:var(--granate-d);opacity:.34;
}
.s-carbon .resena-texto::before,.s-panel .resena-texto::before{color:var(--cobre);opacity:.5;}

.resena-via{
  margin-top:22px;padding-top:16px;
  border-top:1px solid var(--regla);
  font-family:"Barlow Condensed",sans-serif;
  font-size:14px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--tinta-mute);
}
.s-carbon .resena-via,.s-panel .resena-via{border-top-color:var(--linea);color:var(--texto-mute);}

/* Aviso de bloque sin contenido real todavía */
.pendiente-contenido{
  border:1px dashed var(--cobre);
  padding:clamp(22px,3vw,30px);
  color:var(--texto-mute);
  font-family:"Barlow Condensed",sans-serif;
  font-size:15.5px;letter-spacing:.06em;line-height:1.6;
}
.s-crema .pendiente-contenido,.s-crema-alto .pendiente-contenido{color:var(--tinta-mute);border-color:var(--granate-d);}

/* ---------------------------------------------------------
   CTA fijo en móvil
   --------------------------------------------------------- */

.cta-movil{display:none;}

@media (max-width:900px){
  .cta-movil{
    display:block;
    position:fixed;left:0;right:0;bottom:0;z-index:120;
    background:rgba(20,23,26,.97);
    backdrop-filter:blur(10px);
    border-top:1px solid var(--linea);
    padding:12px clamp(16px,4vw,24px);
    padding-bottom:calc(12px + env(safe-area-inset-bottom));
  }
  .cta-movil .boton{display:block;width:100%;text-align:center;padding:15px 20px;}
  .cta-movil .cta-nota{margin-top:8px;text-align:center;font-size:13px;}
  /* Solo se deja hueco en las páginas que llevan barra fija.
     Contacto no la lleva, y si no, quedaba un vacío al final. */
  body:has(.cta-movil){padding-bottom:104px;}
}

/* ---------------------------------------------------------
   Página 404
   --------------------------------------------------------- */

.error-404{
  position:relative;overflow:hidden;min-height:76vh;
  display:flex;align-items:center;
  background:
    radial-gradient(circle at 72% 24%,rgba(168,57,74,.22),transparent 56%),
    var(--carbon);
}
.error-404 .contenedor{position:relative;z-index:2;}

.error-cifra{
  font-family:"Barlow Condensed",sans-serif;
  font-weight:600;
  font-size:clamp(96px,22vw,240px);
  line-height:.82;
  letter-spacing:-.02em;
  color:transparent;
  -webkit-text-stroke:2px var(--cobre);
  margin:0 0 4px;
  font-variant-numeric:tabular-nums;
}
.error-regla{
  height:1px;border:0;margin:26px 0;
  background:linear-gradient(90deg,var(--granate),var(--cobre) 40%,transparent);
}
.error-kicker{
  font-family:"Barlow Condensed",sans-serif;
  font-size:15px;letter-spacing:.34em;text-transform:uppercase;
  color:var(--granate);margin:0 0 20px;
}
.error-404 .arco-portada{opacity:.45;}

/* ---------------------------------------------------------
   Utilidades
   --------------------------------------------------------- */

.solo-lectores{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

.centrado{text-align:center;}
.mt-0{margin-top:0;}
.mt-2{margin-top:22px;}
.mt-3{margin-top:34px;}

.etiquetas{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.etiquetas span{
  font-family:"Barlow Condensed",sans-serif;
  font-size:14.5px;letter-spacing:.08em;
  color:var(--texto-suave);
  background:var(--panel);
  border:1px solid var(--linea);
  padding:5px 12px;
}
.s-crema .etiquetas span,.s-crema-alto .etiquetas span{
  background:#fff;border-color:var(--regla);color:var(--tinta-suave);
}
