/* Hero: el bloque de texto baja 60px para dejar ver más fondo. */
.col-titulo { font-family:var(--title); font-size:1.5rem; font-weight:400; color:var(--text); margin-bottom:2rem; }
.col-titulo + .content-list { margin-top:0; }
/* La entradilla es más larga que la del resto de heros: se ensancha para que entre en 4 líneas. */
.hero-sub { max-width:780px; }

/* Las descripciones que siguen a un título centrado van centradas. Se seleccionan solo
   los párrafos que cuelgan directamente del contenedor, así que las listas, las notas
   y el texto de las tarjetas se quedan alineados a la izquierda. */
.container > .body-text { text-align:center; max-width:780px; margin-left:auto; margin-right:auto; }

.related-tca { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2rem; }
/* La tarjeta entera sigue siendo clicable: el enlace "Saber más" se estira sobre ella. */
.related-tca .tca-card { position:relative; display:flex; flex-direction:column; }
.related-tca .tca-card .cta-link { margin-top:auto; padding-top:1.25rem; }
.related-tca .tca-card .cta-link::after { content:''; position:absolute; inset:0; }
@media(max-width:900px){ .related-tca { grid-template-columns:1fr; } }
/* 32px menos de padding superior en todas las secciones de la pagina */


/* ── Portátiles (≤1440px) ── */
@media(min-width:901px) and (max-width:1440px){
  #content .stat-num { font-size:clamp(2rem,3.5vw,4rem); }
  #content .col-titulo { font-size:clamp(1.15rem,1.7vw,1.5rem); margin-bottom:1.25rem; }
  #content .related-tca .tca-card { padding:14px; }
  #content .related-tca .tca-card p, #content .related-tca .tca-card h3 { font-size:clamp(.9rem,1.27vw,1rem); }
  #content .related-tca .tca-card h3 { font-size:clamp(1rem,1.06vw,1.15rem); }
}

@media(min-width:901px) and (max-width:1440px){
  #content .related-tca .tca-card { padding:28px; }   /* mismo que las de tratamiento */
  #content > section:not(#hero):not(.vista-fondo).seccion-que-es, #content > section:not(#hero):not(.vista-fondo).seccion-tratamiento { padding-top:20px !important; }
  #content .boton-contacto { margin-top:124px !important; }
  #content > section:not(#hero):not(.vista-fondo).seccion-tratamiento { padding-bottom:36px !important; }
}
