/* Start:/local/templates/ipotekatmpl/components/ipotekabank/html.content/gold-bars-hero/style.css?17864406421664*/
/* ============================================================
   Первый экран страницы «Золотые слитки»
   ============================================================ */


.gold-hero {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.gold-hero__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    text-align: center;
}

.gold-hero__title {
    margin: 0;
    font-family: var(--hero-font-family);
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 2rem;
    color: var(--on-surface);
}

.gold-hero__text {
    margin: 0;
    max-width: 44rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--on-surface-variant);
}

.gold-hero__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
}

.gold-hero__art {
    border-radius: var(--radius-24);
    overflow: hidden;
    order: -1;
}

.gold-hero__img {
    width: 100%;
    height: 20.5rem;
    object-fit: cover;
}

@media (min-width: 768px) {
    .gold-hero-section.section {
        padding-bottom: 0;
    }

    .gold-hero {
        gap: 2rem;
    }

    .gold-hero__content {
        gap: 1.25rem;
    }

    .gold-hero__title {
        font-size: 2.5rem;
        line-height: 3.3125rem;
        max-width: 53rem;
    }

    .gold-hero__text {
        font-size: 1.125rem;
        line-height: 1.5rem;
    }

    .gold-hero__actions {
        margin-top: 0.75rem;
    }

    .gold-hero__art {
        border-radius: var(--radius-32);
        order: unset;
    }

    .gold-hero__img {
        height: 37.5rem;
    }
}
/* End */


/* Start:/local/templates/ipotekatmpl/components/ipotekabank/html.content/microloan-promo-facts/style.css?17860957661674*/
/* ============================================================
   Ключевые условия (полоса фактов)
   ============================================================ */

.promo-facts {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1rem;
    border-radius: 1rem;
    background: var(--container-high);
}

.promo-facts__item {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.promo-facts__icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    margin-top: 0.25rem;
    object-fit: cover;
}

.promo-facts__body {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.promo-facts__value {
    font-family: var(--hero-font-family);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.33;
}

.promo-facts__label {
    font-size: 0.875rem;
    line-height: 1.28;
    color: var(--on-surface-variant);
}

@media (min-width: 768px) {
    .promo-facts {
        flex-direction: row;
        justify-content: space-between;
        gap: 0;
        padding: 1rem 0;
        background: none;
        border-radius: 0;
    }

    .promo-facts__item {
        flex: 1 0 0;
        min-width: 0;
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
        text-align: center;
    }

    .promo-facts__icon {
        width: 32px;
        height: 32px;
        margin-top: 0;
    }

    .promo-facts__body {
        align-items: center;
    }

    .promo-facts__value {
        font-size: 1.5rem;
        line-height: 1.17;
    }

    .promo-facts__label {
        font-size: 1rem;
        padding: 0 2rem;
    }
}
/* End */


/* Start:/local/templates/ipotekatmpl/components/ipotekabank/html.content/deposit-boxes-rent/style.css?1786526431754*/
/* ============================================================
   Как арендовать ячейку — карточка требований + два списка
   Figma: 1:1262 (desktop), 1:1645 (mobile)
   Сама карточка живёт в компоненте deposit-boxes-requirements
   ============================================================ */

.deposit-rent__requirements {
    margin-bottom: 1rem;
}

.deposit-rent__lists {
    --bs-gutter-x: 0.75rem;
}

.deposit-rent__lists-col {
    display: flex;
}

.deposit-rent__lists-col > * {
    flex: 1 1 auto;
}

@media (min-width: 768px) {
    .deposit-rent__requirements {
        margin-bottom: 2rem;
    }

    .deposit-rent__lists {
        --bs-gutter-x: 1.5rem;
    }
}

/* End */


/* Start:/local/templates/ipotekatmpl/components/ipotekabank/html.content/deposit-boxes-requirements/style.css?17865285752056*/
/* ============================================================
   Карточка «Что необходимо для оформления»
   Figma: 1:1266 (desktop), 1:1649 (mobile)
   ============================================================ */

.deposit-req {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    border-radius: var(--radius-16);
    background: var(--container-high);
}

.deposit-req__body {
    flex: 1 1 auto;
    min-width: 0;
}

.deposit-req__body p,
.deposit-req__body span {
    font: inherit;
    color: inherit;
}

.deposit-req__title {
    margin: 0 0 0.5rem;
    font-family: var(--hero-font-family);
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.5rem;
    color: var(--on-surface);
}

.deposit-req__text {
    margin: 0;
    font-size: 1rem;
    line-height: 1.375rem;
    color: var(--on-surface-variant);
}

.deposit-req__list {
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.deposit-req__list-item {
    position: relative;
    margin: 0;
    padding-left: 1.0625rem;
    font-size: 1rem;
    line-height: 1.5rem;
    color: var(--on-surface);
}

.deposit-req__list-item+.deposit-req__list-item {
    margin-top: 0.5rem;
}

.deposit-req__list-item::before {
    content: "";
    position: absolute;
    top: 0.625rem;
    left: 0;
    width: 0.3125rem;
    height: 0.3125rem;
    border-radius: 50%;
    background: var(--primary);
}

/* Иллюстрация — только на десктопе */
.deposit-req__art {
    display: none;
}

@media (min-width: 768px) {
    .deposit-req {
        align-items: center;
        gap: 2rem;
        padding: 2rem;
        border-radius: var(--radius-32);
    }

    .deposit-req__title {
        font-size: 1.5rem;
        line-height: 1.75rem;
    }

    .deposit-req__text {
        line-height: 1.5rem;
    }

    .deposit-req__art {
        display: block;
        flex-shrink: 0;
        width: 14.8125rem;
    }

    .deposit-req__img {
        width: 100%;
        height: 9.25rem;
        object-fit: contain;
    }
}
/* End */


/* Start:/local/templates/ipotekatmpl/components/ipotekabank/html.content/microloan-promo-icon-list/style.css?17865286331578*/
/* ============================================================
   Список с иконкой-маркером (независимый компонент)
   ============================================================ */

.icon-list {
    order: 2;
    padding: 1rem;
    border-radius: 1rem;
    background: var(--bg);
}

.icon-list--success {
    --bg: #ecf8e7;
    --point-bg: #d7efc9;
    --point-color: #1f7a40;
}

.icon-list--error {
    --bg: #fff0f2;
    --point-bg: #ffe0e4;
    --point-color: #e0334f;
}

.icon-list__title {
    margin: 0 0 1rem;
    font-family: var(--promo-font-head);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.17;
    color: var(--promo-text);
}

.icon-list__list {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.icon-list__item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 1rem;
    line-height: 1.37;
    color: var(--promo-text);
    margin: 0;
}

.icon-list__point {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    margin-top: 0.0625rem;
    border-radius: 0.75rem;
    background: var(--point-bg);
    color: var(--point-color);
}

.icon-list__point img {
    width: 12px;
    height: 12px;
}

@media (min-width: 768px) {
    .icon-list {
        order: 1;
        flex: 1 1 0;
        min-width: 0;
        padding: 2rem;
        border-radius: 2rem;
    }

    .icon-list__title {
        font-size: 1.5rem;
    }
}
/* End */


/* Start:/local/templates/ipotekatmpl/components/ipotekabank/html.content/deposit-boxes-security/style.css?17865283383168*/
/* ============================================================
   Надёжное хранение ваших ценностей
   Figma: 1:1405 (desktop), 1:1788 (mobile)
   ============================================================ */

.deposit-security {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    border-radius: var(--radius-32);
    background: var(--container-high);
}

.deposit-security__art {
    display: flex;
    justify-content: center;
}

.deposit-security__img {
    width: 11.25rem;
    height: 11.25rem;
    object-fit: contain;
}

.deposit-security__title {
    margin: 0 0 0.75rem;
    font-family: var(--hero-font-family);
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.5rem;
    color: var(--on-surface);
}

.deposit-security__text {
    margin: 0;
    font-size: 1rem;
    line-height: 1.375rem;
    color: var(--on-surface-variant);
}

.deposit-security__branch-block {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--outline-variant);
}

.deposit-security__branch-label {
    font-size: 0.875rem;
    line-height: 1.125rem;
    color: var(--on-surface-variant);
}

.deposit-security__branches {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.deposit-security__branch {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1 1 15rem;
    min-width: 0;
    max-width: 20rem;
    padding: 0.5625rem;
    border-radius: var(--radius-12);
    background: var(--color-bg-5);
    color: var(--on-surface);
    text-decoration: none;
}

.deposit-security__branch-icon {
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
}

.deposit-security__branch-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
}

.deposit-security__branch-name {
    font-size: 1rem;
    line-height: 1.375rem;
    font-weight: 400;
    color: var(--on-surface);
}

.deposit-security__branch-note {
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 400;
    color: var(--on-surface-variant);
}

.deposit-security__branch-chevron {
    flex-shrink: 0;
    color: var(--color-special-border);
}

.deposit-security__body p {
    color: inherit;
}

@media (min-width: 768px) {
    .deposit-security {
        flex-direction: row;
        align-items: center;
        gap: 2rem;
        padding: 2.5rem;
    }

    .deposit-security__art {
        order: 2;
        flex-shrink: 0;
    }

    .deposit-security__img {
        width: 14.8125rem;
        height: 14.8125rem;
    }

    .deposit-security__body {
        flex: 1 1 auto;
        min-width: 0;
    }

    .deposit-security__title {
        margin-bottom: 0.5rem;
        font-size: 1.875rem;
        line-height: 2.25rem;
    }

    .deposit-security__text {
        font-size: 1.125rem;
        line-height: 1.5rem;
    }

    .deposit-security__branch-block {
        gap: 0.5rem;
        margin-top: 1.5rem;
        padding-top: 0;
        border-top: 0;
    }

    .deposit-security__branch-label {
        font-size: 1rem;
        line-height: 1.5rem;
    }
}
/* End */
/* /local/templates/ipotekatmpl/components/ipotekabank/html.content/gold-bars-hero/style.css?17864406421664 */
/* /local/templates/ipotekatmpl/components/ipotekabank/html.content/microloan-promo-facts/style.css?17860957661674 */
/* /local/templates/ipotekatmpl/components/ipotekabank/html.content/deposit-boxes-rent/style.css?1786526431754 */
/* /local/templates/ipotekatmpl/components/ipotekabank/html.content/deposit-boxes-requirements/style.css?17865285752056 */
/* /local/templates/ipotekatmpl/components/ipotekabank/html.content/microloan-promo-icon-list/style.css?17865286331578 */
/* /local/templates/ipotekatmpl/components/ipotekabank/html.content/deposit-boxes-security/style.css?17865283383168 */