/* Capa `overrides`: la declara este mismo archivo. Antes se la asignaba el
   `@import ... layer(overrides)` de main.css; ahora cada hoja se encola por
   separado para que descarguen en paralelo. Ver inc/enqueue.php. */
@layer overrides {
/* ==========================================
   OVERRIDES (ultima capa: gana a base/components/modals/animations/shapes)
   ==========================================
   Reglas de sistema que deben imponerse incluso a los estilos de los
   componentes que declaran su propia capa (@layer components). El CSS de
   componente SIN capa sigue ganando a esta.

   Solo posicionamiento del pin: el fondo por defecto de las secciones
   post-pin vive en global.css (capa base) porque debe PERDER contra los
   modificadores de fondo (section--primary, --light...).
   ========================================== */
.section--pin {
  /* Sección fijada bajo el header: las secciones siguientes le pasan por
     encima al hacer scroll. Pensada para secciones de altura <= 100vh.
     Con varios pins se relevan: cada uno tapa al anterior al fijarse.
     --pin-offset permite fijar más abajo (apilado tipo stacked cards). */
  position: sticky;
  top: calc(var(--header-height, 0px) + var(--pin-offset, 0px));
  z-index: 0;
}
.section--pin ~ *:not(.section--pin):not(dialog) {
  /* Todas las secciones posteriores deben ser posicionadas para pintar por
     encima de las fijadas (los estáticos pintan debajo de los posicionados);
     se excluyen los pins para no machacarles el sticky, y los <dialog>
     (modales) para no romper su position:fixed → al abrirse con showModal()
     un position:relative provoca un salto de scroll al inicio. */
  position: relative;
  z-index: 1;
}
.section--pin.pin--hidden {
  /* La pone/quita critical.js cuando la sección siguiente cubre el pin:
     evita que los recortes de .shape posteriores lo sigan enseñando.
     Funciona con cualquier numero de pins y en todos los navegadores
     (la alternativa CSS pura con view-timeline soportaba un solo pin
     y requeria scroll-driven animations). */
  visibility: hidden;
}
}