/* STELLA web v2: diagramación común.
   Se carga al final para unificar cabeceras de sección y ritmo vertical.
   Sistema: filete superior a todo el ancho con tramo dorado (el mismo lenguaje de las
   pestañas de Residencias), y debajo, apilados: eyebrow, título y bajada.
   Nunca título de un lado y párrafo suelto del otro. */

:root{--cab-gap:clamp(36px,5vw,64px)}

/* ---------- Cabecera de sección */
.cab,.giro-cab,.res-cab,.ct-cab,.ct-resp-txt,.ct-con-aside{position:relative;border-top:1px solid var(--line);padding-top:24px}
.cab::before,.giro-cab::before,.res-cab::before,.ct-cab::before,.ct-resp-txt::before,.ct-con-aside::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:2px;background:var(--gold)}
.giro-cab,.ct-resp-txt{border-top-color:rgba(255,255,255,.16)}

.proyecto-grid,.giro-cab,.res-cab,.ct-cab{display:block;margin-bottom:var(--cab-gap)}
.res-cab > div,.ct-cab > div{display:contents}
.cab .eyebrow,.giro-cab .eyebrow,.res-cab .eyebrow,.ct-cab .eyebrow,.ct-resp-txt .eyebrow,.ct-con-aside .eyebrow{margin-bottom:clamp(22px,3vw,34px)}
.cab .titulo,.giro-cab .titulo,.res-cab .titulo,.ct-cab .titulo,.ct-resp-txt .titulo,.ct-con-aside .titulo{max-width:13.5em;margin:0 0 clamp(18px,2.2vw,28px);text-wrap:balance}
.cab .lead,.giro-cab .lead,.res-cab .lead,.ct-cab .lead,.ct-resp-txt .lead,.ct-con-aside .lead{max-width:54ch;padding:0;text-wrap:pretty}
.ct-cab .ct-dir{margin-top:18px}

/* Proyecto: la bajada y las cifras comparten la misma columna izquierda */
.proyecto .cifras{margin-top:0}

/* El giro: la cabecera respira sobre el lienzo, sin quedar pegada */
.giro-sec .giro-cab{margin-bottom:clamp(28px,3.5vw,44px)}

/* Respaldo: dos columnas con filetes alineados arriba (texto y logos) */
.ct-resp-logos{margin-top:0}
.ct-resp-logos li{padding-top:24px}

/* Contacto: la tarjeta arranca a la altura del filete de la columna izquierda */
@media (min-width:1000px){.ct-con-card{margin-top:0}}

/* Pie: ritmo y alineación */
.pie-respaldo .eyebrow{margin-bottom:16px}

/* Apertura: los enlaces con filete en fila, del mismo ancho */
.apertura-cta{gap:8px 40px;align-items:flex-end}
.apertura-cta .trazo{min-width:220px;text-shadow:0 1px 14px rgba(0,0,0,.35)}
.apertura-cta .trazo::after{opacity:.6}
@media (max-width:767px){.apertura-cta{flex-direction:column;align-items:stretch;gap:4px}.apertura-cta .trazo{min-width:0;width:100%}}

/* Navegación: el enlace de cita adopta el color de la barra */
.nav .trazo::after{opacity:.4}

@media (min-width:1100px){
  /* Ritmo: mismas separaciones verticales en toda la página */
  .seccion{padding:clamp(110px,10vw,150px) 0}
}