/* Envoltura común de las secciones (.seccion y sus encabezados).
   Parte de styles/ — se cargan en orden desde index.html. */

.seccion {
  position: relative;
  padding: clamp(5rem, 12vh, 9rem) var(--bleed);
  max-width: var(--maxw); margin-inline: auto;
}

/* NO usar content-visibility: auto en estas secciones.
   Se probó (daba ~5 % de mejora) y rompe los revelados: mientras la sección
   está fuera de pantalla no se renderiza, ScrollTrigger.batch la da por
   entrada con `once: true` y el párrafo se queda en opacity 0 para siempre.
   Pasó de verdad con el texto de Heredia. No vale la pena. */
.seccion__head { margin-bottom: clamp(2.5rem, 6vw, 4rem); }
.seccion__kicker {
  margin: 0 0 .8rem; font-family: var(--mono); font-size: .72rem;
  letter-spacing: .26em; text-transform: uppercase; color: var(--oro);
}
.seccion__titulo {
  margin: 0;
  font-family: var(--display); font-variation-settings: 'wdth' 122;
  font-weight: 900; font-size: clamp(2.1rem, 7vw, 5rem);
  line-height: .95; letter-spacing: -.025em; text-transform: uppercase;
}
.seccion__texto { max-width: 46ch; margin: 1.4rem 0 0; color: var(--hueso-70); text-wrap: pretty; }
.seccion__nota { margin: 1rem 0 0; font-family: var(--mono); font-size: .76rem; color: var(--hueso-45); }