.loyalty_new {
    font-family: 'Comfortaa';
}

.loyalty_new__banner {
    min-height: 400px;
}

.loyalty_new__banner__container {
    width: 100%;
}

.loyalty_new__banner__container {
    display: grid;
    grid-template-columns: 1fr 65%;
    position: relative;
    min-height: 400px;
    overflow: hidden;
}

.loyalty_new__banner__content {
    position: relative;
    z-index: 5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 32px;
    padding: 45px 30px;
    margin-right: -125px;
    background: #FBFBFB;
}

.loyalty_new__banner__content::after {
    content: '';
    position: absolute;
    z-index: -3;
    top: -10px;
    right: -25%;
    width: 470px;
    height: 110%;
    background: url('data:image/svg+xml,<svg width="400" height="400" viewBox="0 0 400 400" fill="none" xmlns="http://www.w3.org/2000/svg"><ellipse cx="200" cy="200.606" rx="200" ry="234.5" fill="%23FBFBFB"/></svg>') no-repeat;
    background-size: contain;
}

@media (max-width:992px) {
    .loyalty_new__banner__content::after {
        right: -30%;
    }
}

.loyalty_new__banner__content p {
    font-family: 'Montserrat';
    line-height: 160%;
    color: var(--text-light);
}

.loyalty_new__title {
    font-family: 'Comfortaa';
    font-weight: 600;
    font-size: 36px;
    line-height: 120%;
    letter-spacing: 0.3px;
    text-align: center;
    text-wrap: balance;
}

.loyalty_row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
}

.loyalty_row>p {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    font-family: Comfortaa;
    font-weight: 500;
    font-size: 14px;
    text-transform: lowercase;
    border-radius: 10px;
    background: #F3EEFD;
}

.loyalty_new__banner__content .bs-btn {
    align-self: center;
}

.loyalty_new__banner__img {
    height: 100%;
}

.loyalty_new__banner__img img {
    min-width: 100%;
    height: 100%;
    object-position: right;
    object-fit: cover;
}

.loyalty_new__info,
.loyalty_new__levels,
.loyalty_new__how-to-get {
    margin-bottom: 120px;
}

.loyalty_new__levels .title_30 {
    margin-bottom: 32px;
}

.table-levels {
    margin-bottom: 32px;
}

.notes {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.notes__item {
    display: flex;
    align-items: center;
}

.notes__item__icon {
    display: flex;
    align-items: center;
    gap: 4px;
}

.notes__item__icon .fz-40 {
    margin-bottom: -22px;
}

.notes__item__icon *::before {
    color: var(--text-color);
}

@media (max-width:768px) {
    .notes {
        font-size: 12px;
    }

    .notes__item__icon .fz-40 {
        margin-bottom: 0;
    }
}

.loyalty_new__info__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.info_2 .loyalty_new__info__content {
    grid-template-columns: 1fr 32%;
    gap: 80px;
    align-items: center;
}

.loyalty_new__info__content__text {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.loyalty_new .title_30 {
    font-weight: 400;
    line-height: 130%;
    text-align: center;
    text-wrap: balance;
}

.loyalty_new__info .title_30 {
    margin-bottom: 40px;
}

.info_2.loyalty_new__info .title_30 {
    margin-bottom: 0;
    text-align: left;
    text-wrap: balance;
}

.info__tooltip {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 14px;
    padding: 16px;
    color: var(--text-color);
    border-radius: 16px;
    background: #FBFBFB;
}

.loyalty_new__list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.loyalty_new__list li {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 16px;
    background: #F6FCD4;
    border-radius: 16px;
}

.loyalty_new__list li>.icon {
    flex: 1 0 40px;
    max-width: 40px;
    height: 40px;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    border-radius: 50%;
    background: var(--accent-yellow);
}

.loyalty_new__list li .icon.vip {
    flex: 1 0 130px;
    max-width: 130px;
    max-height: 40px;
    justify-content: space-between;
    border-radius: 100px;
}

.loyalty_new__list li .icon.vip .vip-icon {
    display: flex;
    align-items: center;
    gap: 6px;
    max-height: 28px;
    font-size: 14px;
    padding: 7px 14px;
    border-radius: 100px;
    background: #FFFFFF;
}

.loyalty_new__list li .icon.vip .vip-icon .icon {
    flex: 1 0 14px;
    max-width: 14px;
    height: 14px;
    padding: 0;
    background: transparent;
}

.loyalty_new__list li .icon.vip .vip-icon .icon::before {
    color: var(--text-color);
}

.loyalty_new__list__text h4 {
    font-family: 'Comfortaa';
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 12px;
}

.loyalty_new__list__text p {
    color: var(--text-light);
    font-size: 14px;
}

.tooltip_block {
    width: 100%;
    display: flex;
    gap: 32px;
    margin-top: 12px;
}

.tooltip_block_item {
    width: 100%;
    display: flex;
    flex-direction: column;
    row-gap: 20px;
}

.tooltip_block_item__title {
    display: flex;
    column-gap: 8px;
    align-items: center;
}

.loyalty_new__list li .tooltip_block_item .icon {
    height: 16px;
    padding: 0;
    color: var(--accent);
    background: transparent;
}

.tooltip_block_item h5 {
    font-family: 'Comfortaa';
    font-weight: 700;
    font-size: 16px;
}

.loyalty_new__list__text .tooltip_block_item p {
    display: flex;
    gap: 10px;
    padding: 10px 16px;
    font-size: 14px;
    color: var(--text-color);
    border-radius: 10px;
    background: #ffffff;
}

.loyalty_new__info__content__img {
    height: 100%;
    max-height: 1140px;
}

.info_2 .loyalty_new__info__content__img {
    height: 100%;
    max-height: 600px;
}

.loyalty_new__info__content__img img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.loyalty_new__info__content__img .mobile-only,
.loyalty_new__info__content__img.mobile-only,
.loyalty_new__banner__img .tablet-only,
.loyalty_new__banner__img .mobile-only {
    display: none;
}

/* @media (max-width: 1400px) {
    .loyalty_new__banner__img .desktop-only {
        display: none !important;
    }

    .loyalty_new__banner__img .tablet-only {
        display: block !important;
    }
} */


@media (max-width: 768px) {

    .loyalty_new__info__content__img .desktop-only,
    .loyalty_new__info__content__img.desktop-only,
    .loyalty_new__banner__img .desktop-only,
    .loyalty_new__banner__img .tablet-only {
        display: none !important;
    }

    .loyalty_new__info__content__img .mobile-only,
    .loyalty_new__info__content__img.mobile-only,
    .loyalty_new__banner__img .mobile-only {
        display: block !important;
    }

    .loyalty_new__banner__img img {
        max-height: 400px;
        width: 100%;
        object-position: bottom;
    }
}

.loyalty_new .bonus__card-title {
    font-weight: 700;
    margin-bottom: 5px;
}

.loyalty_new .bonus__card.resident {
    border: 2px solid #ecd48a;
}

.loyalty_new .bonus__card.vip {
    color: #ffffff;
    border: 2px solid #ecd48a;
    background: url('./images/card_vip_bg.webp') no-repeat;
    background-size: cover;
}

.loyalty_new .bonus__card.vip .bonus__card__top {
    color: rgba(208, 177, 92, 1);
    border: 1px solid transparent;
}

.loyalty_new .bonus__card__label.vip_label {
    color: rgba(208, 177, 92, 1);
    border: 1px solid rgba(208, 177, 92, 1);
}

.bonus__card-percent {
    text-transform: none;
    font-weight: 500;
}

.loyalty_new .vip .bonus__card-status {
    color: rgba(208, 177, 92, 1);
}

.loyalty_new .bonus__card.vip li.available::before,
.bonus__card.pro li.available::before {
    height: 16px;
    background: url('data:image/svg+xml,<svg width="15" height="16" viewBox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23clip0_2140_42134)"><path d="M11.3838 6.5798C11.6256 6.82605 11.6219 7.22168 11.375 7.46355L8.60875 10.1792C8.11938 10.6592 7.48938 10.8986 6.85875 10.8986C6.235 10.8986 5.61125 10.6636 5.12375 10.1929L3.93687 9.02605C3.69062 8.78418 3.6875 8.38855 3.92938 8.1423C4.17063 7.89543 4.5675 7.8923 4.81313 8.1348L5.99625 9.29793C6.48125 9.76668 7.24687 9.76418 7.73438 9.28668L10.5 6.57168C10.7456 6.32918 11.14 6.33355 11.3838 6.5798ZM15 8.39355C15 12.5292 11.6356 15.8936 7.5 15.8936C3.36437 15.8936 0 12.5292 0 8.39355C0 4.25793 3.36437 0.893555 7.5 0.893555C11.6356 0.893555 15 4.25793 15 8.39355ZM13.75 8.39355C13.75 4.9473 10.9462 2.14355 7.5 2.14355C4.05375 2.14355 1.25 4.9473 1.25 8.39355C1.25 11.8398 4.05375 14.6436 7.5 14.6436C10.9462 14.6436 13.75 11.8398 13.75 8.39355Z" fill="%23F4F5F7"/></g><defs><clipPath id="clip0_2140_42134"><rect width="15" height="15" fill="white" transform="translate(0 0.893555)"/></clipPath></defs></svg>');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.loyalty_new .bonus__card.vip .bonus__card-item {
    color: #1B1B1D;
    background: url('../images/gold_btn_bg.webp') no-repeat;
    background-size: cover;
}

.loyalty_new .bonus__card .bonus__card-item .icon {
    color: rgba(208, 177, 92, 1);
    padding: 7px;
}

.loyalty_new__how-to-get .title_30 {
    margin-bottom: 40px;
}

.loyalty_new__info__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.loyalty_new__info__row .bonus__card-item {
    border-radius: 16px;
}

.loyalty_new__info__row .bonus__card-item {
    margin-bottom: 0;
}

.loyalty_new__info__row .item-gold {
    background: #F6FCD4;
    /* background-image: linear-gradient(white, white), linear-gradient(to left, rgba(208, 177, 92, 1), rgba(250, 233, 166, 1)); */
}

.loyalty_new__info__row .bonus__card-item__content {
    align-items: flex-start;
}

.loyalty_new__info__row .bonus__card-item.black {
    background: var(--text-color);
    border: 1px solid #1B1B1D;
}

.loyalty_new__info__row .bonus__card-item.black .step__label {
    color: #FFFFFF;
}

.how-to-get__box {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
}

.loyalty_new__how-to-get__item {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 16px;
    text-align: center;
}

.loyalty_new__how-to-get__item img {
    margin: 0 auto;
}

.loyalty_new__how-to-get__item .item_title {
    font-weight: 700;
    font-size: 18px;
    line-height: 140%;
    letter-spacing: 0;
    text-transform: uppercase;
}

.loyalty_new__how-to-get__item .item_description {
    font-weight: 400;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: 0;
}

.loyalty_new__how-to-get__item .item_label {
    margin-top: auto;
    padding: 12px 20px;
    border-radius: 8px;
    background: #F4F5F7;
}

.loyalty_new__block ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
    color: var(--text-light);
}

.loyalty_new__block ul li {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    text-align: left;
    color: var(--text-color);
    border-radius: 16px;
    background: #FBFBFB;
}

.loyalty_new__block ul li .icon {
    flex: 1 0 28px;
    width: 28px;
    max-width: 28px;
    height: 28px;
    padding: 0;
    color: #FFFFFF;
    background: #D01D20;
    border-radius: 50%;
}

@media (max-width:768px) {
    .loyalty_new__block ul li {
        /* flex-direction: column; */
        align-items: flex-start;
    }
}

.loyalty_new__block__top {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    text-align: center;
}

.loyalty_new__block__top p {
    color: var(--text-light);
    margin-bottom: 10px;
}

@media (max-width: 768px) {

    .loyalty_new__banner__container {
        grid-template-columns: 1fr;
    }

    .loyalty_video__banner__container {
        padding: 0;
    }

    .loyalty_new__banner {
        height: calc(100vh - 95px);
    }

    .loyalty_banner_video {
        position: absolute;
        inset: 0;
        width: 100%;
        min-height: 100%;
        object-fit: cover;
    }

    .loyalty_new__banner__content {
        justify-content: flex-end;
        margin: 0;
        padding: 24px 16px;
    }

    .loyalty_new__title {
        position: relative;
        z-index: 5;
        font-weight: 700;
        font-size: 24px;
        line-height: 120%;
        text-align: center;
        text-transform: uppercase;
        color: var(--accent-yellow);
    }

    .loyalty_new__banner__content .bs-btn {
        width: 100%;
    }

    .loyalty_new__info .title_30 {
        margin-bottom: 32px;
    }

    .loyalty_new__info,
    .loyalty_new__levels,
    .loyalty_new__how-to-get {
        margin-bottom: 80px;
    }

    .loyalty_new__levels .title_30 {
        margin-bottom: 24px;
        text-align: start;
    }

    .loyalty_new__info__content {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .loyalty_new__info__content__text {
        gap: 24px;
    }

    .loyalty_new__info__content__img,
    .loyalty_new__info__content__img img {
        max-height: 260px;
        object-fit: cover;
        border-radius: 15px;
    }

    .loyalty_new__levels .bonus__card-status {
        height: auto;
        margin-bottom: 16px;
    }

    .loyalty_new__how-to-get .title_30 {
        margin-bottom: 32px;
    }

    .loyalty_new__info__row {
        grid-template-columns: 1fr;
        font-size: 14px;
    }

    .loyalty_new__block .title_30 {
        text-align: start;
    }

    .loyalty_new__block__top {
        align-items: flex-start;
        text-align: start;
    }

    .loyalty_new__block__top.top_2 .title_30 {
        align-self: center;
    }

    .loyalty_new__block__top .bs-btn {
        align-self: stretch;
        width: 100%;
    }

    .info__tooltip {
        margin-bottom: 20px;
    }
    .loyalty_new__list__text h4 {
        font-size: 16px;
    }

    .loyalty_new__list__text p {
        color: var(--text-color);
    }

    .loyalty_new__list li.loyalty_new__info__content__img {
        padding: 0;
    }

    .info_2 .loyalty_new__info__content {
        grid-template-columns: 1fr;
        gap: 80px;
        align-items: center;
    }

}