/* ==========================================================================
   Compatibilidad Bootstrap 5.3 con el maquetado hecho para Bootstrap 4.
   Se carga justo despues de bootstrap.min.css y antes de barricada.css.
   ========================================================================== */

/* Separacion entre columnas: 30px como en Bootstrap 4 (en BS5 son 24px) */
.container,.container-fluid,.row{--bs-gutter-x:30px;}

/* El contenedor no crece por encima de 1140px como antes */
@media (min-width:1400px){.container{max-width:1140px;}}

/* Columnas sueltas (sin .row): relleno lateral como en Bootstrap 4.
   (barricada.css tiene un * {padding:0}, por eso el relleno necesita especificidad normal) */
[class^="col-"],[class*=" col-"]{position:relative;padding-right:calc(var(--bs-gutter-x,30px)*.5);padding-left:calc(var(--bs-gutter-x,30px)*.5);}
/* ... y ancho 100% por defecto; con :where() la especificidad es 0 y .col-md-6, .col-lg-4... siguen mandando */
:where([class^="col-"],[class*=" col-"]){width:100%;}

/* Una .row dentro de otra .row: sin ancho forzado ni relleno (en BS5 .row>* los impone) */
.row>.row{flex-shrink:1;width:auto;max-width:none;padding-right:0;padding-left:0;}

/* Los iframes de video llenan el contenedor .ratio (antes .embed-responsive) */
.ratio iframe,.ratio embed,.ratio object,.ratio video{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}

/* Tamanos de titulo de Bootstrap 4 (BS5 los reduce en pantallas pequenas) */
h1,.h1{font-size:2.5rem;}
h2,.h2{font-size:2rem;}
h3,.h3{font-size:1.75rem;}
h4,.h4{font-size:1.5rem;}
h5,.h5{font-size:1.25rem;}
h6,.h6{font-size:1rem;}

/* Enlaces sin subrayado salvo al pasar el raton, como en Bootstrap 4 */
a{text-decoration:none;}
a:hover{text-decoration:underline;}

/* Etiquetas de formulario con la separacion de Bootstrap 4 */
label{margin-bottom:.5rem;}

/* Barra de navegacion: relleno de Bootstrap 4 */
.navbar{--bs-navbar-padding-x:1rem;--bs-navbar-padding-y:.5rem;}
@media (max-width:991.98px){.navbar-expand-lg>.container{padding-right:0;padding-left:0;}}

/* Tarjetas de entrevistas (.cardalf, no es una .card): relleno y separacion de Bootstrap 4 */
.cardalf{--bs-card-spacer-x:1.25rem;--bs-card-spacer-y:1.25rem;--bs-card-title-spacer-y:.75rem;}

/* Parrafos sueltos dentro de una .row: como en BS4 (BS5 los estira al 100% y un <p> vacio crea un hueco) */
.row>p{flex-shrink:1;width:auto;max-width:none;padding-right:0;padding-left:0;}

/* <section> dentro de .row: conserva su relleno de 20px (BS5 lo pisa con el de las columnas) */
.row>section{padding-right:20px;padding-left:20px;}