@font-face {
    font-family: 'Rubik';
    src: url('../fonts/Rubik-Variable/Rubik-Variable.woff2') format('woff2');
    font-weight: 100 1000;
    font-optical-sizing: auto;
    font-stretch: 0% 200%;
    font-style: normal;
    font-display: swap;
}

.business-deposits-multibanner__container-wrapper {
    --font-family-rubik: 'Rubik', sans-serif;
    --business-deposits-multibanner__container-max-width: 1165px;
    --business-deposits-multibanner__max-width: 1165px;
    --business-deposits-multibanner__font-color-white: #ffffff;
    --business-deposits-multibanner__font-color-black: #000000;
    --business-deposits-multibanner__font-color-transparent-black: #00000099;
    --business-deposits-multibanner__font-color-blue-1: #00b0ff;
    --business-deposits-multibanner__font-color-blue-2: #b5e2fd;
    --business-deposits-multibanner__cell-box-shadow-color: #00b0ff;
    font-family: var(--font-family-rubik);
    margin: 0 auto;
    max-width: var(--business-deposits-multibanner__container-max-width);
    width: 100%;
    box-sizing: border-box;
    padding: 20px 20px;
    border-radius: 30px;
}

.business-deposits-multibanner__container--background {
    background-image: url("../images/background-gradient.svg");
    background-position: center;
    background-size: 110% auto;
    box-sizing: border-box;
}

.business-deposits-multibanner__container {
    display: grid;
    grid-template-columns: 573px 400px;
    grid-template-areas: "business-deposits-multibanner__col-1 business-deposits-multibanner__col-2";
    gap: 30px;
    max-width: var(--business-deposits-multibanner__max-width);
    margin: 0 auto;
    box-sizing: border-box;
    justify-content: center;
}

.business-deposits-multibanner__col-1 {
    --business-deposits-multibanner__col-1--max-width: 573px;
    grid-area: business-deposits-multibanner__col-1;
    display: flex;
    gap: 30px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
}

.business-deposits-multibanner__col-1 img {
    width: 100%;
}

.business-deposits-multibanner__col-2 {
    --business-deposits-multibanner__col-2--max-width: 400px;
    grid-area: business-deposits-multibanner__col-2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.business-deposits-multibanner__col-2 img {
    width: 100%;
}

/* .business-deposits-multibanner__col-3 {
    --business-deposits-multibanner__col-3--max-width: 350px;
    grid-area: business-deposits-multibanner__col-3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.business-deposits-multibanner__col-3 img {
    width: 100%;
} */

.business-deposits-multibanner__item {
    display: flex;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    transition: 0.2s all linear;
    position: relative;
}

.business-deposits-multibanner__item:hover {
    transform: scale(1.05);
}


/* медиа запросы начало */

@media (max-width: 1200px) {
    .business-deposits-multibanner__container {
        grid-template-columns: 478px 340px;
    }
}

@media (max-width: 940px) {
    .business-deposits-multibanner__container {
        grid-template-columns: 400px 300px;
    }
}

@media (max-width: 800px) {
    .business-deposits-multibanner__container {
        grid-template-columns: minmax(300px, 350px) minmax(220px, 280px);
        /* grid-template-areas:
            "business-deposits-multibanner__col-2 business-deposits-multibanner__col-2"
            "business-deposits-multibanner__col-1 business-deposits-multibanner__col-1"; */
    }

    .business-deposits-multibanner__col-2 {
        flex-direction: row;
        column-gap: 20px;
    }
}

@media (max-width: 580px) {
    .business-deposits-multibanner__container {
        grid-template-columns: 1fr;
        grid-template-areas:
            "business-deposits-multibanner__col-2"
            "business-deposits-multibanner__col-1";
    }

    .business-deposits-multibanner__col-2 {
        flex-direction: column;
        row-gap: 20px;
    }
}

/* медиа запросы конец */