.btn.btn-white {

    padding: 12px 32px;

}



/* banner */

.banner {

    background: url("/promos/travel-3x/_assets-custom/images/svg/main-bnr-left.svg") left top / 49% 100% no-repeat,

    url("/promos/travel-3xs/_assets-custom/images/svg/main-bnr-right.svg") right bottom / 16% auto no-repeat,

    url("/promos/travel-3x/_assets-custom/images/banner.webp") center right / 100% auto no-repeat,

    #E7EEF1;

    max-width: 1120px;

    margin: 0 auto;

    margin-top: 60px;

    border-radius: 24px;

    position: relative;

}



/* banner */

[lang="fr-CA"] .banner {
/* .banner.banner-fr { */

    background: url("/promos/travel-3x/_assets-custom/images/svg/main-bnr-left.svg") left top / 49% 100% no-repeat,

    url("/promos/travel-3x/_assets-custom/images/svg/main-bnr-right.svg") right bottom / 16% auto no-repeat,

    url("/promos/travel-3x/_assets-custom/images/banner.webp") center right / auto 100% no-repeat,

    #E7EEF1;

    max-width: 1120px;

}



.abs-positioned-3x {

    position: absolute;

    right: 20px;

    top: 20px;

}



.banner .section-inner {

    display: flex;

    align-items: center;

    gap: 65px;

    padding: 100px 37px 79px 87px !important;

    min-height: 420px;

}



.banner .left {

    max-width: 40%;

}



.banner .left p {

    color: #FFF;

    font-feature-settings: 'liga' off, 'clig' off;

    font-family: Roboto;

    font-size: 16px;

    font-style: normal;

    font-weight: 400;

    line-height: 24px; /* 150% */

}



.banner h1 {

    color: var(--white, #FFF);

    /* desktop/heading-1 */

    font-family: "RBCDisplay";

    font-size: 40px;

    font-style: normal;

    font-weight: 500;

    line-height: 48px; /* 120% */

    margin-bottom: 12px;

}



h2 {

    color: #1F1F1F;

    text-align: center;

    font-feature-settings: 'liga' off, 'clig' off;



    /* desktop/heading-2 */

    font-family: "RBCDisplay";

    font-size: 36px;

    font-style: normal;

    font-weight: 500 !important;

    line-height: 44px; /* 122.222% */

}

@media  (min-width: 640px) and (max-width: 1024px) {
    .banner {
                    background: url("/promos/travel-3x/_assets-custom/images/svg/main-bnr-left.svg") left top / 49% 125% no-repeat,
    url("/promos/travel-3xs/_assets-custom/images/svg/main-bnr-right.svg") right bottom / 16% auto no-repeat,
    url("/promos/travel-3x/_assets-custom/images/banner.webp") center right / auto 100% no-repeat,
    #E7EEF1;
    }

    [lang="fr-CA"] .banner {
        background: url("/promos/travel-3x/_assets-custom/images/svg/main-bnr-left.svg") left top / 49% 150% no-repeat,
        url("/promos/travel-3x/_assets-custom/images/svg/main-bnr-right.svg") right bottom / 16% auto no-repeat,
        url("/promos/travel-3x/_assets-custom/images/banner.webp") center right / auto 100%  no-repeat,
        #E7EEF1;
    }
}


@media screen and (max-width: 639px) {



    h2 {

        color: var(--Texts-text-1-default, #1F1F1F);

        font-feature-settings: 'liga' off, 'clig' off;



        /* mobile/heading-2 */

        font-family: "RBCDisplay";

        font-size: 24px;

        font-style: normal;

        font-weight: 500 !important;

        line-height: 30px; /* 125% */

    }



    .banner {

        margin-top: 0;

        background-image: none;

    }



    .banner .section-inner {

        flex-direction: column;

        padding: 0 !important;

        gap: 0;

        height: auto;

    }



    .banner .left {

        width: 100%;

        max-width: none;

        order: 1;

        background: #0051A5;

        padding: 32px 30px 33px 30px;

        text-align: center;

    }



    .banner .left h1 {

        color: var(--white, #FFF);

        text-align: center;

        font-feature-settings: 'liga' off, 'clig' off;



        /* mobile/heading-1 */

        font-family: "RBCDisplay";

        font-size: 28px;

        font-style: normal;

        font-weight: 500;

        line-height: 35px; /* 125% */

    }



    .banner .left p {

        color: var(--white, #FFF);

        text-align: center;

        font-feature-settings: 'liga' off, 'clig' off;

        /* mobile/heading-4 */

        font-family: "RBCDisplay";

        font-size: 18px;

        font-style: normal;

        font-weight: 500;

        line-height: 24px; /* 133.333% */

    }





    .banner .right {

        background-color: #e0ebef;

        height: 220px;

        width: 100%;

    }

}



/* banner END */





.how-it-works-icons {

    .grid-one-fourth {

        display: flex;

        flex-direction: column;

        gap: 18px;



        img {

            min-width: 54px;

            max-width: 54px;

            min-height: 54px;

            max-height: 54px;

        }

    }

}



@media screen and (max-width: 639px) {

    .how-it-works-icons .grid-one-fourth {

        flex-direction: row;
        align-items: center;

    }

    .how-it-works-icons {

        display: flex;

        flex-direction: column;

        gap: 24px;

        margin-top: 0;

    }

    .mob-text-left {

        text-align: left !important;

    }

}



.book-with-us-cards {

    display: flex;

    gap: 32px;

    justify-content: center;

}



.book-with-us-card {

    display: flex;

    flex-direction: column;

    min-width: 352px;

    max-width: 352px;

    padding: 24px;

    border-radius: 12px;

    min-height: 470px;

}



.book-with-us-card.card-1 {

    background: #FFC4BB;

}



.book-with-us-card.card-2 {

    background: #B6EBF9;

}



.book-with-us-card.card-3 {

    background: #EEF3F5;

}



.book-with-us-card.card-4 {

    background: #FFE9B2;

}



.book-with-us-card-container {

    display: flex;

    align-items: center;

    justify-content: center;

    flex: 1;

}



.book-with-us-card-content {

    border-radius: 12px;

    overflow: clip;

    width: 100%;

    box-shadow: 0 54px 118px 0 rgba(37, 37, 37, 0.04), 0 12.062px 26.357px 0 rgba(37, 37, 37, 0.06), 0 3.591px 7.847px 0 rgba(37, 37, 37, 0.08);

}



.book-with-us-card-content>.top {

    display: flex;

    flex-direction: row;

    align-items: center;

    justify-content: center;

    height: 100px;

    gap: 12px;

    padding-left: 5px;

    padding-right: 5px;

}



.book-with-us-card-content>.top>.title {

    color: #1F1F1F;

    text-align: center;

    font-feature-settings: 'liga' off, 'clig' off;



    /* mobile/heading-3 */

    font-family: "RBCDisplay";

    font-size: 20px;

    font-style: normal;

    font-weight: 500;

    line-height: 25px; /* 125% */

}



.book-with-us-card .subtitle {

    font-size: 14px;

    font-weight: 400;

    line-height: 20px;

}



.book-with-us-card.card-1 .book-with-us-card-content>.bottom {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 10px 12px;

    background: white;

}



.book-with-us-card.card-1 .book-with-us-card-details {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

}



.book-with-us-card.card-1 .bottom p.text-right {

    font-size: 12px;

    font-weight: 700;

    line-height: 14px;

}



.book-with-us-card-details .small-text {

    font-size: 10px;

    font-weight: 400;

    line-height: 14px;

    margin-bottom: 4px;

}



.book-with-us-card-details .bold-text {

    font-size: 14px;

    font-weight: 700;

    line-height: 14px;

}



.card-divider {

    width: 273px;

    height: 1px;

    background: #E7EEF1;

    margin: 12px 0 10px;

}



.book-with-us-card.card-2 .book-with-us-card-content>.bottom {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 14px 18px 18px;

    background: white;

}



.book-with-us-card.card-2 .book-with-us-card-details {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 14px;

}



.book-with-us-card.card-2 input {

    padding: 10px;

    font-size: 14px;

    font-weight: 400;

    line-height: 20px;

    border-radius: 8px;

    border: 1px solid #B3B3B3;

    flex: 1;

}



@media only screen and (max-width: 639px) {



    .book-with-us-cards {

        flex-direction: column;

        gap: 12px;

        align-items: center;

    }



    .book-with-us-card-content {

        width: 236px;

    }



    .book-with-us-card-content>.top {

        height: 80px;

        gap: 10px;

        padding-left: 5px;

        padding-right: 5px;

    }



    .book-with-us-card-content>.top>.title {

        font-size: 20px;

        font-weight: 500;

        line-height: 25px;

    }



    .book-with-us-card.card-1 .top>img {

        width: 42px;

        height: 42px;

    }



    .book-with-us-card.card-1 .bottom img {

        width: 100%;

    }



    .card-divider {

        width: 218px;

        margin: 6px 0 8px;

    }



    .book-with-us-card-details .small-text {

        font-size: 8px;

        line-height: 11px;

        margin-bottom: 3px;

    }



    .book-with-us-card-details .bold-text {

        font-size: 11px;

        line-height: 11px;

    }



    .book-with-us-card.card-1 a {

        font-size: 10px;

        line-height: 11px;

    }



    .book-with-us-card.card-2 .top>img {

        width: 32px;

        height: 32px;

    }



    .book-with-us-card.card-2 input {

        font-size: 11px;

        line-height: 16px; /* 150% */

    }



    .book-with-us-card.card-2 button>img {

        width: 33px;

        height: 33px;

    }



    .book-with-us-card.card-2 .book-with-us-card-details .flex {

        gap: 10px;

    }





    .elite-only-tag {

        font-size: 8px;

        line-height: 10px;

        padding: 1.27px 3.4px;

    }

}





.flexibility-callout {

    display: flex;

    background-color: #0B3166;

    border-radius: 12px;

    padding: 48px 71px 48px 66px;

    align-items: center;

    gap: 20px;

    justify-content: space-between;



    .flexibility-text {

        max-width: 500px;

        color: var(--white, #FFF);

        font-feature-settings: 'liga' off, 'clig' off;





        p {

            /* paragraph/body-sm */

            font-family: Roboto;

            font-size: 14px;

            font-style: normal;

            font-weight: 400;

            line-height: 20px; /* 142.857% */

        }



    }

}



@media screen and (max-width: 639px) {

    .flexibility-callout {

        flex-direction: column;



        padding: 20px 20px 50px 20px;



    }

    .flexibility-image {

        width: 100%;

        img {

            width: 100%;

        }

    }

}



section.disclaimer {

    border-top: solid 1px #e0e0e0;

}



.mob-banner {

    position: relative;

    display: flex;

    flex-direction: column;

    align-items: center;



    width: 100%;

    min-height: 649px;



    background-image: url('/promos/travel-3x/_assets-custom/images/banner.webp');

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;



    overflow: hidden;

}



.img-top {

    position: absolute;

    top: 0;

    left: 50%;

    transform: translateX(-50%);

    max-width: 100%;

    height: auto;

}



.img-mid {

    position: absolute;

    top: 50%;

    right: 30px;

    max-width: 123px;

    height: auto;

}



.img-bot {

    position: absolute;

    bottom: 0;

    right: 0;

    max-width: 100%;

    height: auto;

}



.mob-banner-text {

    position: absolute;

    z-index: 1;

    padding: 20px 60px 20px 20px;



    h1 {

        max-width: 300px;

    }

}



@media screen and (min-width: 400px) and (max-width: 499px) {

    .img-top {

        top: -20vw;

    }

}



@media screen and (min-width: 500px) and (max-width: 639px) {

    .img-top {

        top: -35vw;

    }

}