/* ==========================================================================
   TÍTULOS DE SECCIÓN EN UNA SOLA LÍNEA (computadora)
   Pedido del usuario (2026-09-26): nada de títulos partidos en dos filas.
   Se quitan los anchos máximos que los partían y, si aun así un título no
   cabe, sitio_web/js/titulos.js le baja el tamaño lo justo. «contain:
   inline-size» hace que un título largo no ensanche su columna: el ancho
   lo pone el diseño y el título se ajusta a él, no al revés.
   Va la última, detrás de los estilos de cada página.
   ========================================================================== */
@media (min-width: 900px) {
    .contenido-principal h2:not([id^="titulo-modal"]):not([data-legal-titulo]) {
        max-width: none;
        white-space: nowrap;
        text-wrap: nowrap;
        contain: inline-size;
        width: 100%;
    }
    /* Si ni reduciendo cabe, titulos.js lo marca y vuelve a partir línea. */
    .contenido-principal h2.titulo-parte {
        white-space: normal;
        text-wrap: balance;
        contain: none;
    }

    /* Cabeceras que limitaban el ancho del bloque entero: el título se
       libera y el párrafo de debajo conserva una medida cómoda de lectura. */
    .fx-cabecera,
    .am-cabecera,
    .servicios-portada-cabecera,
    .ns-cabecera,
    .sol-cabecera,
    .enlaces-interes-cabecera > div:first-child,
    .redes-publicas-copy,
    .pt-cta-cabeza,
    .pt .pt-cta-cabeza {
        max-width: none;
    }
    .fx-cabecera > p,
    .am-cabecera > p,
    .servicios-portada-cabecera > p,
    .ns-cabecera > p,
    .sol-cabecera > p,
    .enlaces-interes-cabecera > div:first-child > p,
    .pt-cta-cabeza > p {
        max-width: 68ch;
    }
    .pt .pt-cta-cabeza h2,
    .pt-cta-cabeza h2 { margin-inline: auto; }
}

@media (min-width: 900px) {
    /* El bloque que contiene al título ocupa el espacio libre de su fila:
       como el título ya no empuja (contain), sin esto se quedaría angosto
       en las cabeceras que ponen algo a su lado (cifras, flechas…). */
    .contenido-principal :has(> h2:not([id^="titulo-modal"]):not([data-legal-titulo])) {
        flex-grow: 1;
        min-width: 0;
    }
}
