/*!***************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/css/frontend/components/banner-double.css ***!
  \***************************************************************************************************************************************************************************************************/
.banner-double {
    --ratio: 1918/517;
    aspect-ratio: var(--ratio);
    background-color: var(--rb--color--almost-black);
    border-bottom: 2px solid var(--rb--color--accent);
    display: grid;
    position: relative;
    z-index: 100;
}

    @media (max-width:767px) {.banner-double {
        aspect-ratio: 16/9
        /* aspect-ratio: 21/10; */
}
    }

    .banner-double .content {
        grid-row: 1;
        grid-column: 1;
        place-self: center;
        text-align: center;
        position: relative;
        z-index: 10;
    }

    .banner-double .logo {
        grid-row: 1;
        grid-column: 1;
        align-self: end;
        justify-self: center;
        z-index: 15;
        margin-bottom: var(--rb--space--10);
    }

    @media (min-width:768px) {

    .banner-double .logo {
            margin-bottom: var(--rb--space--24)
    }
        }

    .banner-double .logo picture {
            height: clamp(62px, 5.42vw, 104px);
        }

    .banner-double .logo picture img {
                width: auto;
            }

    .banner-double h1 {
        font-weight: 500;
    }

    .banner-double .meta {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        font-size: var(--rb--font--16);
        font-weight: 400;
        letter-spacing: 0.24px;
        text-align: right;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        /* width: clamp(200px, 31.25vw, 600px); */
    }

    @media (min-width:768px) {

    .banner-double .meta {
            /* display: grid; */
            /* grid-template-columns: 1fr 1fr; */
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row
    }
            
            .banner-double .meta span {
                padding: 0 1em;
                position: relative;
            }

            .banner-double .meta > *:not(:first-child) {
                text-align: left;
            }
                
                .banner-double .meta > *:not(:first-child):before {
                    background-color: currentColor;
                    content: '';
                    height: 100%;
                    position: absolute;
                    width: 1px;
                    left: -1px;
                    top: 0;
                }
        }

    .banner-double .img-wrapper {
        grid-row: 1;
        grid-column: 1;
        width: 100%;
        height: 100%;
        position: relative;
        overflow: hidden;
        z-index: 5;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
    }

    .banner-double .img-wrapper:before {
            content: '';
            background-color: var(--rb--color--almost-black);
            opacity: .4;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 5;
        }

    .banner-double .img-wrapper picture {
            height: 100%;
            width: 100%;
            min-width: 0;
            -webkit-box-flex: 1;
                -ms-flex: 1 1 0px;
                    flex: 1 1 0;
        }

    .banner-double .img-wrapper picture img {
                aspect-ratio: var(--ratio);
                height: 100%;
            }
/*!************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./src/css/frontend/components/acf-flexible-content/banner_double.css ***!
  \************************************************************************************************************************************************************************************************************************/