:root {
    --car-terms-container-padding: calc(var(--gap) * 5/2);
    --car-terms-container-promo-img-height: 600px;

    --car-terms-container-promo-value-fs: 128px;
    --car-terms-container-promo-value-fw: 100;

    --car-terms-container-promo-label-title-fs: 32px;
    --car-terms-container-promo-label-title-fw: 500;
}

.car_terms_progress {
    padding: var(--info-progress-page-block-padding);
    box-sizing: border-box;
    display: flex;
    width: 100%;
}

.car_terms_progress > .progress {
    border-top: 2px solid var(--hover-text-color-opacity-link);
    width: 100%;
}

.car_terms_promo_container {
    padding: var(--info-container-padding);
    padding-top: var(--info-container-gap);
    justify-content: center;
    box-sizing: border-box;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden;
    display: flex;
    width: 100%;
}

.car_terms_promo_container > .car_terms_promo_header {
    letter-spacing: var(--info-container-title-ls);
    font-weight: var(--info-container-title-fw);
    margin: var(--info-container-title-margin);
    font-family: "Raleway", Arial, sans-serif;
    font-size: var(--info-container-title-fs);
    color: var(--hover-text-color);
    line-height: 100%;
}

.car_terms_promo_container > .card_terms_promo_terms {
    margin: 0 0 var(--info-container-title-gap);
    justify-content: space-around;
    align-items: center;
    flex-direction: row;
    gap: var(--gap);
    display: flex;
    width: 100%;
}

.car_terms_promo_container > .card_terms_promo_terms.space-between {
    justify-content: space-between;
}

.car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term {
    gap: var(--info-container-gap);
    flex-direction: column;
    justify-content: start;
    align-items: start;
    display: flex;
}

.car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__label {
    letter-spacing: var(--h3-letter-spacing);
    font-family: "Inter", Arial, sans-serif;
    color: var(--hover-text-color);
    font-weight: 200;
    font-size: 20px;
    line-height: 30px;
}

.car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__value {
    font-weight: var(--car-terms-container-promo-value-fw);
    font-size: var(--car-terms-container-promo-value-fs);
    font-family: "Inter", Arial, sans-serif;
    color: var(--hover-text-color);
    letter-spacing: 0;
    line-height: 100%;
    margin: 0;
}

.car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__value_column {
    font-family: "Inter", Arial, sans-serif;
    color: var(--hover-text-color);
    margin: 0;
    font-size: 128px;
    font-weight: 100;
    line-height: 100%;
    letter-spacing: 0;
    display: flex;
    flex-direction: column;
}

.car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__value > .card_terms_promo_term__value_descr {
    font-family: "Inter", Arial, sans-serif;
    color: var(--hover-text-color);
    font-weight: 200;
    font-size: 24px;
    line-height: 30px;
    letter-spacing: var(--h3-letter-spacing);
}

.car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__value_column > .card_terms_promo_term__value_title {
    font-weight: var(--car-terms-container-promo-label-title-fw);
    font-size: var(--car-terms-container-promo-label-title-fs);
    text-transform: uppercase;
    white-space: normal;
}

.card_terms_promo_term__car_img {
    height: var(--car-terms-container-promo-img-height);
    position: absolute;
    bottom: 0;
}

@media only screen and (max-width: 1560px) {
    :root {
        --car-terms-container-promo-img-height: 550px;
    }
}

@media only screen and (max-width: 1440px) {
    :root {
        --car-terms-container-promo-img-height: 500px;
    }
}

@media only screen and (max-width: 1320px) {
    :root {
        --car-terms-container-promo-img-height: 400px;
    }

    .card_terms_promo_term__car_img {
        bottom: unset;
        top: 30px;
    }

    .car_terms_promo_container > .card_terms_promo_terms {
        justify-content: space-between;
    }

    .car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term.end,
    .car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__label,
    .car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__value_column > .card_terms_promo_term__value_title_descr.end {
        text-align: end;
        align-items: end;
        white-space: normal;
    }
}

@media only screen and (max-width: 1024px) {
    :root {
        --car-terms-container-promo-img-height: 350px;
    }

    .card_terms_promo_term__car_img {
        bottom: unset;
        top: 30px;
    }
}

@media only screen and (max-width: 860px) {
    :root {
        --car-terms-container-promo-value-fs: 96px;
        --car-terms-container-promo-img-height: 450px;
    }

    .card_terms_promo_term__car_img {
        bottom: unset;
        top: 10px;
    }

    .car_terms_promo_container > .card_terms_promo_terms {
        margin: 0 0 calc(var(--gap) * 10);
    }

    .car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term {
        flex-direction: column;
        justify-content: start;
        gap: calc(var(--gap));
        align-items: start;
        display: flex;
    }
}

@media only screen and (max-width: 760px) {
    :root {
        --car-terms-container-promo-label-title-fs: 26px;
    }

    .car_terms_promo_container > .card_terms_promo_terms {
        margin: 0 0 calc(var(--gap) * 3);
        justify-content: space-around;
    }


    .card_terms_promo_term__car_img {
        position: relative;
    }
}

@media only screen and (max-width: 480px) {
    :root {
        --car-terms-container-promo-label-title-fs: 32px;
        --car-terms-container-promo-img-height: 350px;
    }

    .car_terms_promo_container > .card_terms_promo_terms {
        margin: 0 0 var(--gap);
        flex-direction: column;
        justify-content: start;
        align-items: start;
    }

    .card_terms_promo_term__car_img {
        position: relative;
    }

    .car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term {
        width: 100%;
    }

    .car_terms_promo_container > .card_terms_promo_terms > .card_terms_promo_term > .card_terms_promo_term__value_column > .card_terms_promo_term__value_title_descr {
        font-weight: 100;
        font-size: 20px;
        line-height: 30px;
    }
}