/*!**************************************************************************************************************************************************************************************************!*\
  !*** 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/overlay-card.css ***!
  \**************************************************************************************************************************************************************************************************/
.overlay-card {
    --ratio: 580/351;
    aspect-ratio: var(--ratio);
    display: grid;
    overflow: hidden;
    --overlay-opacity: 0.15;
}

    @media (max-width:1199px) {.overlay-card {
        --overlay-opacity: 0.85
}

        .overlay-card.no-hover {
            --overlay-opacity: 0.15;
        }
    }

    .overlay-card.permanent-overlay {
        --overlay-opacity: 0.85;
        --element-movement: 0 !important;
        --element-opacity: 1 !important;
    }

    .overlay-card .base {
        background-color: rgba(29, 40, 43, var(--overlay-opacity));
        display: grid;
        grid-row: 1;
        grid-column: 1;
        place-items: center;
        place-content: center;
        text-align: center;
        padding: 0 clamp(30px, 3vw, 90px);
    }

    .overlay-card .base > h3 {
            font-size: var(--rb--font--30);
            font-weight: 400;
            letter-spacing: 0.45px;
            line-height: 1.3;
        }

    .overlay-card .base > span,
        .overlay-card .base > p {
            font-size: var(--rb--font--16);
        }

    .overlay-card .img-wrapper {
        aspect-ratio: var(--ratio);
        grid-row: 1;
        grid-column: 1;
    }

    .overlay-card .img-wrapper picture {
            height: 100%;
        }

    .overlay-card .btn {
        --gap: 9px;
        --padding-left: var(--rb--space--24);
        --padding-right: var(--rb--space--24);
        margin-top: var(--rb--space--26);
    }

    @media (min-width:1200px) {.overlay-card {
        --element-movement: clamp(14px,1.042vw , 20px);
        --element-opacity: 0
}

        .overlay-card .base {
            -webkit-transition: var(--rb--transition--3);
            transition: var(--rb--transition--3);
        }

            .overlay-card .base > h3,
            .overlay-card .base > span,
            .overlay-card .base > p {
                -webkit-transform: translateY( calc( var(--element-movement) * -1 ) );
                    -ms-transform: translateY( calc( var(--element-movement) * -1 ) );
                        transform: translateY( calc( var(--element-movement) * -1 ) );
                -webkit-transition: var(--rb--transition--3);
                transition: var(--rb--transition--3);
                opacity: var(--element-opacity);
            }

        .overlay-card .btn {
            -webkit-transform: translateY(var(--element-movement));
                -ms-transform: translateY(var(--element-movement));
                    transform: translateY(var(--element-movement));
            -webkit-transition: var(--rb--transition--3);
            transition: var(--rb--transition--3);
            opacity: var(--element-opacity);
        }
            .overlay-card:not(.no-hover):hover {
                --overlay-opacity: .85;
                --element-movement: 0;
                --element-opacity: 1;
            }
    }
/*!********************************************************************************************************************************************************************************************************************!*\
  !*** 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/page_grid.css ***!
  \********************************************************************************************************************************************************************************************************************/
.page-grid .top {
        margin-bottom: var(--rb--space--43);
    }

@media (min-width:768px) {

.page-grid .pages {
            --cols: repeat(2, 1fr)
    }
        }

@media (min-width:1200px) {

.page-grid .pages {
            --cols: repeat(3, 1fr)

            /* :nth-child(10n+3),
            :nth-child(10n+6){
                --ratio: unset;
                grid-row: span 2;
            } */
    }
        }

@media (min-width:1200px) {

.page-grid .pages[data-total="2"] {
                --cols: repeat(2, 1fr)
        }
            }

@media (min-width:768px) and (max-width:991px) {

                .page-grid .pages[data-total="3"] > *:last-child {
                    --ratio: 30/9;
                    grid-column: span 2;
                }
            }

@media (min-width:992px) {

.page-grid .pages[data-total="3"] {
                --cols: repeat(3, 1fr)
        }
            }

@media (min-width:1200px) {

.page-grid .pages[data-total="4"] {
                --cols: repeat(2, 1fr)
        }
            }

@media (min-width:1200px) {
                .page-grid .pages[data-total="5"] > :nth-child(3n+3){
                    --ratio: unset;
                    grid-row: span 2;
                }
            }