/* ==========================================================
   AMAR — imagen de fondo de portada
   ========================================================== */

body .bg-breadcrumb {
    position: relative;

    background:
        linear-gradient(
            rgba(8, 35, 66, .52),
            rgba(8, 35, 66, .42)
        ),
        url("../../img/amar-1.webp")
        center center / cover
        no-repeat !important;

    min-height:
        clamp(
            330px,
            38vw,
            500px
        );

    display: flex;
    align-items: center;

    overflow: hidden;
}


/* Contenido siempre encima */
body .bg-breadcrumb > .container {
    position: relative;
    z-index: 2;
}


/* Título y breadcrumb legibles */
body .bg-breadcrumb h1 {
    color: #ffffff !important;

    text-shadow:
        0 3px 14px
        rgba(0,0,0,.22);
}

body .bg-breadcrumb .breadcrumb-item,
body .bg-breadcrumb .breadcrumb-item a {
    color:
        rgba(
            255,
            255,
            255,
            .95
        ) !important;
}


/* PC */
@media (min-width: 1200px) {

    body .bg-breadcrumb {
        background-position:
            center 45% !important;
    }
}


/* Tablet */
@media (max-width: 991.98px) {

    body .bg-breadcrumb {
        min-height: 390px;

        background-position:
            center center !important;
    }
}


/* Móvil */
@media (max-width: 575.98px) {

    body .bg-breadcrumb {
        min-height: 400px;

        background-position:
            center center !important;
    }

    body .bg-breadcrumb h1 {
        font-size:
            clamp(
                2rem,
                9vw,
                2.8rem
            ) !important;

        line-height: 1.08;
    }
}


/* Móvil pequeño */
@media (max-width: 359.98px) {

    body .bg-breadcrumb {
        min-height: 370px;
    }
}