@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA AUTH
========================================================= */

.iamaAuth2026,
.iamaAuth2026 *,
.iamaAuth2026 *::before,
.iamaAuth2026 *::after {
    box-sizing: border-box;
}


.iamaAuth2026 {

    --ia-blue: #073b91;
    --ia-blue2: #0c55be;
    --ia-yellow: #ffc12d;

    position: relative;

    width: 100%;

    min-height: 650px;

padding: 200px 0 80px;

    overflow: hidden;

    display: flex;
    align-items: center;

    isolation: isolate;

    font-family:
        "Outfit",
        sans-serif;

    color: #fff;

    background:

        radial-gradient(
            circle at 15% 16%,
            rgba(49,117,238,.36),
            transparent 31%
        ),

        radial-gradient(
            circle at 88% 82%,
            rgba(24,91,208,.23),
            transparent 32%
        ),

        linear-gradient(
            120deg,
            #07398e 0%,
            #083b8e 40%,
            #073177 67%,
            #06172f 100%
        );
}


/* =========================================================
   USE EXISTING WEBSITE .container DIRECTLY
========================================================= */

.iamaAuth2026 > .container {

    position: relative;

    z-index: 3;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(390px, 440px);

    align-items: center;

    column-gap:
        clamp(65px, 8vw, 130px);
}


/* =========================================================
   BACKGROUND
========================================================= */

.iamaAuth2026__grid {

    position: absolute;

    inset: 0;

    z-index: -5;

    opacity: .035;

    pointer-events: none;

    background-image:

        linear-gradient(
            rgba(255,255,255,.7) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.7) 1px,
            transparent 1px
        );

    background-size:
        56px 56px;
}


.iamaAuth2026__glow {

    position: absolute;

    z-index: -4;

    border-radius: 50%;

    pointer-events: none;
}


.iamaAuth2026__glow--1 {

    width: 520px;
    height: 520px;

    top: -250px;
    left: -220px;

    background:

        radial-gradient(
            circle,
            rgba(85,145,255,.24),
            transparent 68%
        );
}


.iamaAuth2026__glow--2 {

    width: 500px;
    height: 500px;

    right: -210px;
    bottom: -260px;

    background:

        radial-gradient(
            circle,
            rgba(17,87,216,.27),
            transparent 68%
        );
}


.iamaAuth2026__ring {

    position: absolute;

    z-index: -3;

    border-radius: 50%;

    pointer-events: none;
}


.iamaAuth2026__ring--1 {

    width: 390px;
    height: 390px;

    top: -190px;
    left: -155px;

    border:
        1px solid rgba(255,255,255,.065);

    box-shadow:

        0 0 0 55px
        rgba(255,255,255,.018),

        0 0 0 110px
        rgba(255,255,255,.012);
}


.iamaAuth2026__ring--2 {

    width: 330px;
    height: 330px;

    right: -150px;
    bottom: -160px;

    border:
        1px solid rgba(255,193,45,.12);

    box-shadow:

        0 0 0 50px
        rgba(255,193,45,.018),

        0 0 0 100px
        rgba(255,255,255,.01);
}


/* =========================================================
   LEFT
========================================================= */

.iamaAuth2026__intro {

    width: 100%;

    max-width: 640px;

    justify-self: start;
}


.iamaAuth2026__tag {

    width: fit-content;

    min-height: 34px;

    margin:
        0 0 22px;

    padding:
        0 15px;

    display: inline-flex;

    align-items: center;

    border:
        1px solid rgba(255,255,255,.15);

    border-radius:
        50px;

    background:
        rgba(255,255,255,.075);

    color:
        rgba(255,255,255,.9);

    font-size:
        14px;

    font-weight:
        700;

    line-height:
        1;

    letter-spacing:
        1.1px;
}


/* Heading */

.iamaAuth2026__title {

    margin: 0 !important;

    padding: 0 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(46px, 4vw, 58px) !important;

    font-weight:
        700 !important;

    line-height:
        1.02 !important;

    letter-spacing:
        -.7px !important;

    color:
        #fff !important;
}


.iamaAuth2026__title span {

    display: block;

    color:
        var(--ia-yellow) !important;

    font-weight:
        800 !important;
}


/* Description */

.iamaAuth2026__desc {

    width: 100%;

    max-width: 555px;

    margin:
        23px 0 0 !important;

    color:
        #fff !important;

    font-size:
        18px !important;

    font-weight:
        400 !important;

    line-height:
        1.65 !important;
}


/* Accent */

.iamaAuth2026__accent {

    position: relative;

    margin-top:
        34px;

    padding-left:
        18px;
}


.iamaAuth2026__accent::before {

    content: "";

    position: absolute;

    left: 0;

    top: 2px;
    bottom: 2px;

    width: 3px;

    border-radius:
        20px;

    background:
        var(--ia-yellow);
}


.iamaAuth2026__accent strong {

    display: block;

    color: #fff;

    font-size: 21px;

    font-weight: 700;

    line-height: 1.25;
}


.iamaAuth2026__accent p {

    margin:
        5px 0 0 !important;

    color:
        rgba(255,255,255,.82) !important;

    font-size:
        16px !important;

    line-height:
        1.45 !important;
}


/* =========================================================
   RIGHT SIDE
========================================================= */

.iamaAuth2026__formSide {

    width: 100%;

    display: flex;

    align-items: center;

    justify-content: flex-end;
}


/* =========================================================
   CARD
========================================================= */

.iamaAuth2026__card {

    position: relative;

    width: 100%;

    max-width: 440px;

    padding:
        36px 35px 32px;

    border:
        1px solid rgba(255,255,255,.60);

    border-radius:
        24px;

    background:

        linear-gradient(
            145deg,
            rgba(255,255,255,.995),
            rgba(245,248,253,.985)
        );

    color:
        #102551;

    box-shadow:

        0 30px 75px
        rgba(0,11,40,.30),

        0 7px 24px
        rgba(0,11,40,.14);
}


.iamaAuth2026__card::before {

    content: "";

    position: absolute;

    top: 0;

    left: 40px;
    right: 40px;

    height: 3px;

    border-radius:
        0 0 20px 20px;

    background:

        linear-gradient(
            90deg,
            transparent,
            var(--ia-yellow),
            transparent
        );
}


/* =========================================================
   CARD HEADER
========================================================= */

.iamaAuth2026__cardHead {

    margin-bottom:
        27px;
}


.iamaAuth2026__smallTitle {

    margin:
        0 0 9px;

    color:
        var(--ia-blue);

    font-size:
        14px;

    font-weight:
        800;

    line-height:
        1.2;

    letter-spacing:
        1.2px;
}


.iamaAuth2026__cardHead h2 {

    margin:
        0 !important;

    padding:
        0 !important;

    color:
        #0b2b67 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(29px, 2.3vw, 36px) !important;

    font-weight:
        700 !important;

    line-height:
        1.08 !important;

    letter-spacing:
        -.55px !important;
}


.iamaAuth2026__cardHead h2 span {

    color:
        var(--ia-blue) !important;

    font-weight:
        800 !important;
}


.iamaAuth2026__cardHead p {

    margin:
        11px 0 0 !important;

    color:
        #47546a !important;

    font-size:
        16px !important;

    line-height:
        1.5 !important;
}


/* =========================================================
   FORM
========================================================= */

.iamaAuth2026__form {

    width: 100%;
}


.iamaAuth2026__field {

    width: 100%;

    margin:
        0 0 18px;
}


.iamaAuth2026__field label {

    display: block;

    margin:
        0 0 8px !important;

    color:
        #142b57 !important;

    font-size:
        16px !important;

    line-height:
        1.25 !important;

    font-weight:
        700 !important;
}


.iamaAuth2026__fieldTop {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap:
        15px;
}


.iamaAuth2026__fieldTop a {

    margin-bottom:
        8px;

    color:
        var(--ia-blue) !important;

    font-size:
        14px !important;

    font-weight:
        700 !important;

    line-height:
        1.2 !important;

    text-decoration:
        none !important;
}


.iamaAuth2026__fieldTop a:hover {

    color:
        #e2a000 !important;
}


/* =========================================================
   INPUT
========================================================= */

.iamaAuth2026__inputBox {

    position: relative;

    width: 100%;
}


.iamaAuth2026__inputIcon {

    position: absolute;

    z-index: 2;

    top: 50%;
    left: 16px;

    transform:
        translateY(-50%);

    width: 18px;
    height: 18px;

    display: grid;

    place-items: center;

    pointer-events: none;
}


.iamaAuth2026__inputIcon svg {

    width: 17px;
    height: 17px;

    fill:
        #647fa9;
}


.iamaAuth2026__inputBox input {

    display: block;

    width: 100% !important;

    height: 55px !important;

    margin:
        0 !important;

    padding:
        0 48px !important;

    border:
        1px solid #d8e1ee !important;

    border-radius:
        12px !important;

    outline:
        none !important;

    background:
        #f5f8fc !important;

    color:
        #13294f !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        14px !important;

    font-weight:
        500 !important;

    box-shadow:
        none !important;

    transition:
        all .2s ease;
}


.iamaAuth2026__inputBox input::placeholder {

    color:
        #9aa7ba !important;

    opacity: 1;
}


.iamaAuth2026__inputBox input:focus {

    background:
        #fff !important;

    border-color:
        rgba(7,59,145,.58) !important;

    box-shadow:
        0 0 0 4px
        rgba(7,59,145,.075) !important;
}


/* =========================================================
   EYE
========================================================= */

.iamaAuth2026__eye {

    position: absolute;

    z-index: 5;

    top: 50%;
    right: 9px;

    transform:
        translateY(-50%);

    width: 36px;
    height: 36px;

    margin: 0 !important;

    padding: 0 !important;

    display: grid;

    place-items: center;

    border:
        0 !important;

    border-radius:
        9px !important;

    background:
        transparent !important;

    cursor: pointer;
}


.iamaAuth2026__eye:hover {

    background:
        #e9eff8 !important;
}


.iamaAuth2026__eye svg {

    width: 17px;
    height: 17px;

    fill:
        #7286a5;
}


/* =========================================================
   REMEMBER
========================================================= */

.iamaAuth2026__options {

    margin:
        0 0 21px;
}


.iamaAuth2026__remember {

    position: relative;

    display:
        inline-flex !important;

    align-items:
        center !important;

    gap:
        9px !important;

    margin:
        0 !important;

    color:
        #647084 !important;

    font-size:
        15px !important;

    font-weight:
        500 !important;

    cursor: pointer;
}


.iamaAuth2026__remember input {

    position: absolute !important;

    opacity: 0 !important;

    pointer-events: none !important;
}


.iamaAuth2026__check {

    width: 18px;
    height: 18px;

    flex:
        0 0 18px;

    display:
        inline-grid;

    place-items:
        center;

    border:
        1.5px solid #c8d3e2;

    border-radius:
        5px;

    background:
        #fff;
}


.iamaAuth2026__remember input:checked
+ .iamaAuth2026__check {

    background:
        var(--ia-blue);

    border-color:
        var(--ia-blue);
}


.iamaAuth2026__remember input:checked
+ .iamaAuth2026__check::after {

    content: "";

    width: 5px;
    height: 9px;

    margin-top:
        -2px;

    border-right:
        2px solid #fff;

    border-bottom:
        2px solid #fff;

    transform:
        rotate(45deg);
}


/* =========================================================
   BUTTON
========================================================= */

.iamaAuth2026__submit {

    width:
        100% !important;

    height:
        55px !important;

    margin:
        0 !important;

    padding:
        0 22px !important;

    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    gap:
        10px !important;

    border:
        0 !important;

    border-radius:
        12px !important;

    cursor:
        pointer;

    background:

        linear-gradient(
            115deg,
            #073a8f,
            #0c55bd
        ) !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        18px !important;

    font-weight:
        700 !important;

    box-shadow:

        0 13px 27px
        rgba(7,59,145,.25) !important;

    transition:
        all .2s ease;
}


.iamaAuth2026__submit:hover {

    transform:
        translateY(-2px);

    box-shadow:

        0 17px 34px
        rgba(7,59,145,.32) !important;
}


.iamaAuth2026__submit svg {

    width: 18px;
    height: 18px;

    fill:
        var(--ia-yellow);

    transition:
        transform .2s ease;
}


.iamaAuth2026__submit:hover svg {

    transform:
        translateX(4px);
}


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1199px) {

    .iamaAuth2026 {

        min-height:
            610px;

        padding:
            65px 0;
    }


    .iamaAuth2026 > .container {

        grid-template-columns:
            minmax(0, 1fr)
            390px;

        column-gap:
            55px;
    }


    .iamaAuth2026__intro {

        max-width:
            550px;
    }


    .iamaAuth2026__title {

        font-size:
            46px !important;
    }


    .iamaAuth2026__card {

        max-width:
            390px;

        padding:
            31px 29px 28px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaAuth2026 {

        min-height:
            auto;

        padding:
            60px 0;
    }


    .iamaAuth2026 > .container {

        display: flex;

        flex-direction: column;

        align-items: center;

        gap:
            35px;
    }


    .iamaAuth2026__intro {

        max-width:
            600px;

        text-align:
            center;
    }


    .iamaAuth2026__tag {

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .iamaAuth2026__title span {

        display:
            inline;
    }


    .iamaAuth2026__desc {

        max-width:
            540px;

        margin-left:
            auto !important;

        margin-right:
            auto !important;
    }


    .iamaAuth2026__accent {

        display:
            none;
    }


    .iamaAuth2026__formSide {

        justify-content:
            center;
    }


    .iamaAuth2026__card {

        max-width:
            500px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaAuth2026 {

        padding:
            42px 0;
    }


    .iamaAuth2026 > .container {

        gap:
            26px;
    }


    .iamaAuth2026__tag {

        min-height:
            28px;

        padding:
            0 12px;

        margin-bottom:
            15px;

        font-size:
            10px;
    }


    .iamaAuth2026__title {

        font-size:
            35px !important;
    }


    .iamaAuth2026__desc {

        margin-top:
            16px !important;

        font-size:
            14px !important;

        line-height:
            1.55 !important;
    }


    .iamaAuth2026__card {

        max-width:
            100%;

        padding:
            28px 20px 25px;

        border-radius:
            20px;
    }


    .iamaAuth2026__cardHead {

        margin-bottom:
            23px;
    }


    .iamaAuth2026__smallTitle {

        font-size:
            11px;
    }


    .iamaAuth2026__cardHead h2 {

        font-size:
            29px !important;
    }


    .iamaAuth2026__cardHead p {

        font-size:
            14px !important;
    }


    .iamaAuth2026__field label {

        font-size:
            14px !important;
    }


    .iamaAuth2026__fieldTop a {

        font-size:
            12px !important;
    }


    .iamaAuth2026__inputBox input {

        height:
            53px !important;

        font-size:
            13px !important;
    }


    .iamaAuth2026__remember {

        font-size:
            13px !important;
    }


    .iamaAuth2026__submit {

        height:
            53px !important;

        font-size:
            16px !important;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .iamaAuth2026 {

        padding:
            34px 0;
    }


    .iamaAuth2026__title {

        font-size:
            31px !important;
    }


    .iamaAuth2026__card {

        padding:
            25px 17px 23px;
    }


    .iamaAuth2026__cardHead h2 {

        font-size:
            26px !important;
    }


    .iamaAuth2026__fieldTop {

        gap:
            8px;
    }


    .iamaAuth2026__fieldTop a {

        font-size:
            11px !important;
    }

}


.iamaAuth2026__registerCta {

    margin-top: 28px;

    display: flex;

    align-items: center;

    gap: 14px;

    flex-wrap: wrap;
}


.iamaAuth2026__registerCta > span {

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif;

    font-size: 16px;

    font-weight: 500;
}


.iamaAuth2026__registerCta a {

    min-height: 46px;

    padding:
        0 20px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    border-radius: 12px;

    border:
        1px solid rgba(255,255,255,.22);

    background:
        rgba(255,255,255,.10);

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif;

    font-size: 18px;

    font-weight: 700;

    text-decoration: none;

    backdrop-filter:
        blur(8px);

    box-shadow:
        0 10px 25px rgba(0,0,0,.10);

    transition:
        all .25s ease;
}


.iamaAuth2026__registerCta a svg {

    width: 17px;

    height: 17px;

    fill:
        var(--ia-yellow);

    transition:
        transform .25s ease;
}


.iamaAuth2026__registerCta a:hover {

    background:
        #fff;

    color:
        var(--ia-blue);

    border-color:
        #fff;

    transform:
        translateY(-2px);
}


.iamaAuth2026__registerCta a:hover svg {

    transform:
        translateX(4px);
}


@media (max-width: 991px) {

    .iamaAuth2026__registerCta {

        justify-content:
            center;
    }

}


@media (max-width: 600px) {

    .iamaAuth2026__registerCta {

        margin-top:
            22px;

        gap:
            10px;
    }


    .iamaAuth2026__registerCta > span {

        font-size:
            14px;
    }


    .iamaAuth2026__registerCta a {

        min-height:
            43px;

        padding:
            0 17px;

        font-size:
            14px;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA FORGOT PASSWORD 2026
   UNIQUE / ISOLATED CSS
========================================================= */

.iamaForgot2026,
.iamaForgot2026 *,
.iamaForgot2026 *::before,
.iamaForgot2026 *::after {
    box-sizing: border-box;
}


.iamaForgot2026 {

    --if-blue: #073b91;
    --if-blue2: #0c55be;
    --if-yellow: #ffc12d;

    position: relative;

    width: 100%;

    min-height: 620px;

    padding: 200px 0 70px;

    overflow: hidden;

    display: flex;
    align-items: center;

    isolation: isolate;

    font-family: "Outfit", sans-serif;

    background:
        radial-gradient(
            circle at 18% 18%,
            rgba(51, 120, 238, .35),
            transparent 31%
        ),
        radial-gradient(
            circle at 84% 80%,
            rgba(20, 89, 214, .22),
            transparent 32%
        ),
        linear-gradient(
            120deg,
            #07398e 0%,
            #083b8e 42%,
            #073177 68%,
            #06172f 100%
        );

    color: #fff;
}


/* =========================================================
   BACKGROUND
========================================================= */

.iamaForgot2026__grid {

    position: absolute;

    inset: 0;

    z-index: -4;

    pointer-events: none;

    opacity: .035;

    background-image:
        linear-gradient(
            rgba(255,255,255,.7) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.7) 1px,
            transparent 1px
        );

    background-size: 56px 56px;
}


.iamaForgot2026__glow {

    position: absolute;

    z-index: -3;

    border-radius: 50%;

    pointer-events: none;
}


.iamaForgot2026__glow--1 {

    width: 520px;
    height: 520px;

    top: -250px;
    left: -210px;

    background:
        radial-gradient(
            circle,
            rgba(89, 148, 255, .24),
            transparent 68%
        );
}


.iamaForgot2026__glow--2 {

    width: 470px;
    height: 470px;

    right: -210px;
    bottom: -230px;

    background:
        radial-gradient(
            circle,
            rgba(13, 86, 215, .26),
            transparent 68%
        );
}


/* =========================================================
   EXISTING WEBSITE CONTAINER
========================================================= */

.iamaForgot2026 > .container {

    position: relative;

    z-index: 2;

    display: flex;

    justify-content: center;
}


/* =========================================================
   MAIN CONTENT CARD
========================================================= */

.iamaForgot2026__content {

    position: relative;

    width: 100%;

    max-width: 560px;

    padding: 46px 44px 42px;

    border-radius: 26px;

    border:
        1px solid rgba(255,255,255,.58);

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.995),
            rgba(245,248,253,.985)
        );

    color: #102551;

    box-shadow:
        0 32px 80px rgba(0, 11, 40, .30),
        0 8px 28px rgba(0, 11, 40, .14);
}


.iamaForgot2026__content::before {

    content: "";

    position: absolute;

    top: 0;
    left: 48px;
    right: 48px;

    height: 3px;

    border-radius:
        0 0 20px 20px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--if-yellow),
            transparent
        );
}


/* =========================================================
   TAG
========================================================= */

.iamaForgot2026__tag {

    width: fit-content;

    margin:
        0 0 15px;

    color:
        var(--if-blue);

    font-size:
        13px;

    font-weight:
        800;

    line-height:
        1;

    letter-spacing:
        1.2px;
}


/* =========================================================
   HEADING
========================================================= */

.iamaForgot2026__title {

    margin: 0 !important;

    padding: 0 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(34px, 4vw, 48px) !important;

    font-weight:
        700 !important;

    line-height:
        1.02 !important;

    letter-spacing:
        -.7px !important;

    color:
        #0b2b67 !important;
}


.iamaForgot2026__title span {

    display: block;

    color:
        var(--if-blue) !important;

    font-weight:
        800 !important;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.iamaForgot2026__desc {

    max-width: 470px;

    margin:
        18px 0 30px !important;

    color:
        #5d687b !important;

    font-size:
        16px !important;

    line-height:
        1.6 !important;

    font-weight:
        400 !important;
}


/* =========================================================
   FORM
========================================================= */

.iamaForgot2026__form {

    width: 100%;
}


.iamaForgot2026__field {

    width: 100%;

    margin:
        0 0 20px;
}


.iamaForgot2026__field label {

    display: block;

    margin:
        0 0 8px !important;

    color:
        #142b57 !important;

    font-size:
        16px !important;

    line-height:
        1.2 !important;

    font-weight:
        700 !important;
}


/* =========================================================
   INPUT
========================================================= */

.iamaForgot2026__inputWrap {

    position: relative;

    width: 100%;
}


.iamaForgot2026__icon {

    position: absolute;

    z-index: 2;

    top: 50%;
    left: 17px;

    transform:
        translateY(-50%);

    width: 18px;
    height: 18px;

    display: grid;

    place-items: center;

    pointer-events: none;
}


.iamaForgot2026__icon svg {

    width: 17px;
    height: 17px;

    fill:
        #647fa9;
}


.iamaForgot2026__inputWrap input {

    display: block;

    width: 100% !important;

    height: 56px !important;

    margin: 0 !important;

    padding:
        0 18px 0 49px !important;

    border:
        1px solid #d8e1ee !important;

    border-radius:
        13px !important;

    outline:
        none !important;

    background:
        #f5f8fc !important;

    color:
        #13294f !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        14px !important;

    font-weight:
        500 !important;

    box-shadow:
        none !important;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.iamaForgot2026__inputWrap input::placeholder {

    color:
        #9aa7ba !important;

    opacity: 1;
}


.iamaForgot2026__inputWrap input:focus {

    background:
        #fff !important;

    border-color:
        rgba(7,59,145,.58) !important;

    box-shadow:
        0 0 0 4px
        rgba(7,59,145,.075) !important;
}


/* =========================================================
   BUTTON
========================================================= */

.iamaForgot2026__button {

    width: 100% !important;

    height: 56px !important;

    margin: 0 !important;

    padding:
        0 22px !important;

    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    gap:
        10px !important;

    border:
        0 !important;

    border-radius:
        13px !important;

    cursor:
        pointer;

    background:
        linear-gradient(
            115deg,
            #073a8f,
            #0c55bd
        ) !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        17px !important;

    font-weight:
        700 !important;

    line-height:
        1 !important;

    box-shadow:
        0 13px 28px
        rgba(7,59,145,.26) !important;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


.iamaForgot2026__button:hover {

    transform:
        translateY(-2px);

    box-shadow:
        0 18px 36px
        rgba(7,59,145,.32) !important;
}


.iamaForgot2026__button svg {

    width: 18px;
    height: 18px;

    fill:
        var(--if-yellow);

    transition:
        transform .2s ease;
}


.iamaForgot2026__button:hover svg {

    transform:
        translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaForgot2026 {

        min-height:
            560px;

        padding:
            65px 0;
    }


    .iamaForgot2026__content {

        max-width:
            540px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaForgot2026 {

        min-height:
            auto;

        padding:
            45px 0;
    }


    .iamaForgot2026__content {

        width: 100%;

        max-width:
            100%;

        padding:
            31px 21px 28px;

        border-radius:
            21px;
    }


    .iamaForgot2026__content::before {

        left: 35px;
        right: 35px;
    }


    .iamaForgot2026__tag {

        margin-bottom:
            12px;

        font-size:
            10px;
    }


    .iamaForgot2026__title {

        font-size:
            34px !important;
    }


    .iamaForgot2026__desc {

        margin:
            15px 0 24px !important;

        font-size:
            14px !important;

        line-height:
            1.55 !important;
    }


    .iamaForgot2026__field label {

        font-size:
            14px !important;
    }


    .iamaForgot2026__inputWrap input {

        height:
            53px !important;

        font-size:
            13px !important;
    }


    .iamaForgot2026__button {

        height:
            53px !important;

        font-size:
            16px !important;
    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .iamaForgot2026 {

        padding:
            35px 0;
    }


    .iamaForgot2026__content {

        padding:
            27px 17px 24px;
    }


    .iamaForgot2026__title {

        font-size:
            30px !important;
    }

}


@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA MY ACCOUNT - PREMIUM DARK TOP / MODERN CONTENT
========================================================= */

.iamaAccountNew,
.iamaAccountNew *,
.iamaAccountNew *::before,
.iamaAccountNew *::after {
    box-sizing: border-box;
}


.iamaAccountNew {

    --ian-blue: #0a43a1;
    --ian-blue2: #0b59c7;
    --ian-dark: #071a3d;
    --ian-dark2: #0a2356;
    --ian-yellow: #ffc12d;

    --ian-text: #122b57;
    --ian-body: #53627a;
    --ian-muted: #8793a6;
    --ian-border: #dfe6f0;

    --ian-green: #17884f;

    position: relative;

    width: 100%;

    font-family:
        "Outfit",
        sans-serif;

    color:
        var(--ian-text);

    background:
        linear-gradient(
            180deg,
            #0a1f49 0px,
            #0c2c68 250px,
            #f3f7fc 250px,
            #f8fafc 100%
        );
        padding: 180px 40px 80px;
}


/* =========================================================
   DARK TOP BACKGROUND SUPPORT
========================================================= */

.iamaAccountNew::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;
    right: 0;

    height: 330px;

    z-index: 0;

    pointer-events: none;

    background:

        radial-gradient(
            circle at 10% 0%,
            rgba(37,111,232,.26),
            transparent 32%
        ),

        radial-gradient(
            circle at 90% 10%,
            rgba(11,84,194,.25),
            transparent 34%
        ),

        linear-gradient(
            120deg,
            #07182f,
            #0b2c68 55%,
            #0a1f49
        );
}


/* =========================================================
   ACCOUNT TABS
========================================================= */

.iamaAccountNew__tabsArea {

    position: relative;

    z-index: 5;

    width: 100%;

    padding:
        22px 0 18px;
}


.iamaAccountNew__tabs {

    width: 100%;

    padding:
        8px;

    display: flex;

    align-items: center;

    gap:
        8px;

    overflow-x: auto;

    overflow-y: hidden;

    white-space: nowrap;

    border:
        1px solid rgba(255,255,255,.11);

    border-radius:
        17px;

    background:
        rgba(255,255,255,.07);

    backdrop-filter:
        blur(14px);

    box-shadow:
        0 15px 35px rgba(0,0,0,.14);

    scrollbar-width:
        none;
}


.iamaAccountNew__tabs::-webkit-scrollbar {
    display: none;
}


.iamaAccountNew__tab {

    min-height:
        49px;

    padding:
        0 23px;

    flex:
        1 0 auto;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        11px;

    color:
        rgba(255,255,255,.80);

    font-size:
        18px;

    font-weight:
        800;

    line-height:
        1;

    text-decoration:
        none;

    transition:
        all .24s ease;
}


.iamaAccountNew__tab:hover {

    color:
        #fff;

    background:
        rgba(255,255,255,.09);
}


.iamaAccountNew__tab.is-active {

    color:
        #071b3c;

    background:
        linear-gradient(
            120deg,
            #ffd15f,
            #ffc12d
        );

    box-shadow:
        0 10px 24px rgba(255,193,45,.22);
}


.iamaAccountNew__tab--logout {

    color:
        #ffb7b7;
}


.iamaAccountNew__tab--logout:hover {

    color:
        #fff;

    background:
        #a93d48;
}


/* =========================================================
   MAIN
========================================================= */

.iamaAccountNew__main {

    position: relative;

    z-index: 2;

    width: 100%;

    padding:
        18px 0 90px;
}


/* =========================================================
   WELCOME HERO
========================================================= */

.iamaAccountNew__welcome {

    position: relative;

    width: 100%;

    min-height:
        290px;

    padding:
        46px 48px;

    overflow:
        hidden;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        50px;

    border:
        1px solid rgba(255,255,255,.13);

    border-radius:
        28px;

    background:

        radial-gradient(
            circle at 90% 10%,
            rgba(86,158,255,.28),
            transparent 35%
        ),

        linear-gradient(
            120deg,
            #0a2861 0%,
            #0a439c 55%,
            #0d5fc9 100%
        );

    box-shadow:
        0 28px 65px rgba(5,25,61,.24);
}


.iamaAccountNew__welcomeDecor {

    position: absolute;

    inset: 0;

    pointer-events: none;

    opacity:
        .045;

    background-image:

        linear-gradient(
            rgba(255,255,255,.8) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.8) 1px,
            transparent 1px
        );

    background-size:
        48px 48px;
}


.iamaAccountNew__welcome::after {

    content: "";

    position: absolute;

    width:
        470px;

    height:
        470px;

    right:
        -180px;

    top:
        -285px;

    border-radius:
        50%;

    border:
        1px solid rgba(255,255,255,.11);

    box-shadow:

        0 0 0 70px
        rgba(255,255,255,.024),

        0 0 0 140px
        rgba(255,255,255,.014);
}


/* =========================================================
   WELCOME LEFT
========================================================= */

.iamaAccountNew__welcomeLeft {

    position:
        relative;

    z-index:
        2;

    min-width:
        0;

    display:
        flex;

    align-items:
        center;

    gap:
        28px;
}


.iamaAccountNew__avatar {

    width:
        96px;

    height:
        96px;

    flex:
        0 0 96px;

    display:
        grid;

    place-items:
        center;

    border:
        3px solid var(--ian-yellow);

    border-radius:
        24px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f4f7fb
        );

    color:
        var(--ian-blue);

    font-size:
        36px;

    font-weight:
        800;

    box-shadow:
        0 15px 35px rgba(0,0,0,.17);
}


.iamaAccountNew__welcomeCopy {

    max-width:
        690px;
}


.iamaAccountNew__eyebrow {

    display:
        block;

    margin-bottom:
        10px;

    color:
        var(--ian-yellow);

    font-size:
        13px;

    font-weight:
        800;

    letter-spacing:
        1.35px;
}


.iamaAccountNew__welcomeCopy h1 {

    margin:
        0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(36px, 3.4vw, 52px) !important;

    line-height:
        1.02 !important;

    letter-spacing:
        -.8px !important;

    font-weight:
        700 !important;
}


.iamaAccountNew__welcomeCopy h1 span {

    color:
        var(--ian-yellow);

    font-weight:
        800;
}


.iamaAccountNew__welcomeCopy p {

    max-width:
        610px;

    margin:
        17px 0 0 !important;

    color:
        rgba(255,255,255,.79) !important;

    font-size:
        17px !important;

    line-height:
        1.65 !important;

    font-weight:
        400 !important;
}


/* =========================================================
   WELCOME RIGHT META
========================================================= */

.iamaAccountNew__identity {

    position:
        relative;

    z-index:
        2;

    width:
        320px;

    flex:
        0 0 320px;

    padding:
        24px 24px;

    border:
        1px solid rgba(255,255,255,.16);

    border-radius:
        19px;

    background:
        rgba(255,255,255,.085);

    backdrop-filter:
        blur(12px);
}


.iamaAccountNew__identity > div + div {

    margin-top:
        18px;

    padding-top:
        18px;

    border-top:
        1px solid rgba(255,255,255,.12);
}


.iamaAccountNew__identity span {

    display:
        block;

    color:
        rgba(255,255,255,.56);

    font-size:
        13px;

    font-weight:
        500;

    line-height:
        1.3;
}


.iamaAccountNew__identity strong {

    display:
        block;

    margin-top:
        6px;

    color:
        #fff;

    font-size:
        21px;

    font-weight:
        700;

    line-height:
        1.4;

    overflow-wrap:
        anywhere;
}


/* =========================================================
   QUICK ACCOUNT STATS
========================================================= */

.iamaAccountNew__quick {

    width:
        100%;

    margin-top:
        28px;

    padding:
        12px;

    display:
        grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap:
        12px;

    border:
        1px solid #dfe6f0;

    border-radius:
        20px;

    background:
        rgba(255,255,255,.98);

    box-shadow:
        0 16px 42px rgba(20,47,90,.08);
}


.iamaAccountNew__quickItem {

    min-height:
        104px;

    padding:
        20px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    border-radius:
        15px;

    background:
        linear-gradient(
            145deg,
            #f7f9fc,
            #f1f5fb
        );
}


.iamaAccountNew__quickItem span {

    display:
        block;

    color:
        #8390a5;

    font-size:
        14px;

    font-weight:
        500;

    line-height:
        1.3;
}


.iamaAccountNew__quickItem strong {

    display:
        block;

    margin-top:
        7px;

    color:
        #17305f;

    font-size:
        20px;

    line-height:
        1.4;

    font-weight:
        700;
}


.iamaAccountNew__paid {

    width:
        fit-content;

    padding:
        5px 12px;

    border-radius:
        50px;

    background:
        #e3f7eb;

    color:
        var(--ian-green) !important;

    font-size:
        14px !important;
}


/* =========================================================
   SECTION TITLE
========================================================= */

.iamaAccountNew__heading {

    margin:
        58px 0 26px;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        30px;
}


.iamaAccountNew__headingTag {

    display:
        block;

    margin-bottom:
        8px;

    color:
        var(--ian-blue);

    font-size:
        13px;

    font-weight:
        800;

    letter-spacing:
        1.2px;
}


.iamaAccountNew__heading h2 {

    margin:
        0 !important;

    color:
        #102b5f !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(32px, 3vw, 42px) !important;

    line-height:
        1.05 !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.55px !important;
}


.iamaAccountNew__heading p {

    margin:
        0 !important;

    color:
        #6f7d93 !important;

    font-size:
        17px !important;

    line-height:
        1.5 !important;
}


/* =========================================================
   CONTENT GRID
========================================================= */

.iamaAccountNew__grid {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap:
        30px;

    align-items:
        start;
}


/* =========================================================
   CARDS
========================================================= */

.iamaAccountNew__card {

    position:
        relative;

    width:
        100%;

    overflow:
        hidden;

    border:
        1px solid #dde5ef;

    border-radius:
        24px;

    background:
        #fff;

    box-shadow:
        0 16px 42px rgba(23,49,91,.07);
}


.iamaAccountNew__card::before {

    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        0;

    width:
        100%;

    height:
        4px;

    background:
        linear-gradient(
            90deg,
            #0a43a1,
            #ffc12d
        );
}


.iamaAccountNew__cardHead {

    min-height:
        116px;

    padding:
        29px 30px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    border-bottom:
        1px solid #ebeff5;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #fbfcfe
        );
}


.iamaAccountNew__cardHead span {

    display:
        block;

    margin-bottom:
        7px;

    color:
        #8b97aa;

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        1.05px;
}


.iamaAccountNew__cardHead h3 {
    font-family: "Outfit", sans-serif !important;

    margin:
        0 !important;

    color:
        #102e64 !important;

    font-size:
        28px !important;

    line-height:
        1.1 !important;

    font-weight:
        700 !important;
}


/* =========================================================
   ACTION BUTTON
========================================================= */

.iamaAccountNew__outlineBtn {

    min-height:
        44px;

    padding:
        0 17px;

    flex:
        0 0 auto;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid #d6e0ed;

    border-radius:
        11px;

    background:
        #f3f7fc;

    color:
        var(--ian-blue);

    font-size:
        13px;

    font-weight:
        700;

    text-decoration:
        none;

    transition:
        all .23s ease;
}


.iamaAccountNew__outlineBtn:hover {

    color:
        #fff;

    border-color:
        var(--ian-blue);

    background:
        var(--ian-blue);
}


/* =========================================================
   PERSONAL DETAILS GRID
========================================================= */

.iamaAccountNew__details {

    padding:
        28px 30px 32px;

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        13px;
}


.iamaAccountNew__detail {

    min-height:
        92px;

    padding:
        18px 19px;

    border:
        1px solid #e4eaf1;

    border-radius:
        14px;

    background:
        #f8fafc;
}


.iamaAccountNew__detail--full {

    grid-column:
        1 / -1;
}


.iamaAccountNew__detail span {

    display:
        block;

    color:
        #8290a4;

    font-size:
        14px;

    font-weight:
        500;

    line-height:
        1.3;
}


.iamaAccountNew__detail strong {

    display:
        block;

    margin-top:
        8px;

    color:
        #273b59;

    font-size:
        18px;

    line-height:
        1.4;

    font-weight:
        600;

    overflow-wrap:
        anywhere;
}


/* =========================================================
   ACADEMIC DETAILS
========================================================= */

.iamaAccountNew__academic {

    padding:
        28px 30px 32px;
}


/* COURSE */

.iamaAccountNew__course {

    padding:
        24px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    border:
        1px solid #dde6f1;

    border-radius:
        17px;

    background:
        linear-gradient(
            135deg,
            #eff5ff,
            #f9fbff
        );
}


.iamaAccountNew__course span {

    display:
        block;

    color:
        #8190a4;

    font-size:
        14px;

    font-weight:
        500;
}


.iamaAccountNew__course h4 {
    font-family: "Outfit", sans-serif !important;

    margin:
        8px 0 0 !important;

    color:
        #10356f !important;

    font-size:
        23px !important;

    line-height:
        1.3 !important;

    font-weight:
        700 !important;
}


.iamaAccountNew__course p {

    margin:
        6px 0 0 !important;

    color:
        #8290a4 !important;

    font-size:
        14px !important;
}


.iamaAccountNew__online {

    padding:
        8px 14px;

    flex:
        0 0 auto;

    border-radius:
        50px;

    background:
        #dceaff;

    color:
        var(--ian-blue);

    font-size:
        13px;

    font-weight:
        700;
}


/* =========================================================
   FEE CARDS
========================================================= */

.iamaAccountNew__fees {

    margin-top:
        14px;

    display:
        grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap:
        12px;
}


.iamaAccountNew__fees > div {

    min-height:
        106px;

    padding:
        18px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    border:
        1px solid #e1e8f0;

    border-radius:
        14px;

    background:
        #fff;
}


.iamaAccountNew__fees span {

    color:
        #8592a6;

    font-size:
        13px;

    font-weight:
        500;
}


.iamaAccountNew__fees strong {

    margin-top:
        8px;

    color:
        #17386e;

    font-size:
        20px;

    font-weight:
        700;
}


/* =========================================================
   PAYMENT COMPLETE
========================================================= */

.iamaAccountNew__success {

    margin-top:
        14px;

    padding:
        20px;

    display:
        flex;

    align-items:
        center;

    gap:
        15px;

    border:
        1px solid #c7e6d4;

    border-radius:
        15px;

    background:
        linear-gradient(
            135deg,
            #effaf3,
            #f7fdf9
        );
}


.iamaAccountNew__successIcon {

    width:
        44px;

    height:
        44px;

    flex:
        0 0 44px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        var(--ian-green);

    color:
        #fff;

    font-size:
        18px;

    font-weight:
        800;
}


.iamaAccountNew__success strong {

    display:
        block;

    color:
        #17623b;

    font-size:
        21px;

    font-weight:
        700;
}


.iamaAccountNew__success p {

    margin:
        4px 0 0 !important;

    color:
        #5f7a69 !important;

    font-size:
        17px !important;

    line-height:
        1.5 !important;
}


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1199px) {

    .iamaAccountNew__welcome {

        padding:
            40px;

        gap:
            35px;
    }


    .iamaAccountNew__welcomeCopy h1 {

        font-size:
            40px !important;
    }


    .iamaAccountNew__identity {

        width:
            280px;

        flex-basis:
            280px;
    }


    .iamaAccountNew__grid {

        gap:
            22px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaAccountNew::before {

        height:
            470px;
    }


    .iamaAccountNew__tabsArea {

        padding:
            16px 0;
    }


    .iamaAccountNew__tab {

        flex:
            0 0 auto;
    }


    .iamaAccountNew__main {

        padding:
            12px 0 65px;
    }


    .iamaAccountNew__welcome {

        min-height:
            0;

        padding:
            34px;

        flex-direction:
            column;

        align-items:
            stretch;
    }


    .iamaAccountNew__identity {

        width:
            100%;

        flex:
            none;

        display:
            grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap:
            20px;
    }


    .iamaAccountNew__identity > div + div {

        margin:
            0;

        padding:
            0;

        border:
            0;
    }


    .iamaAccountNew__quick {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .iamaAccountNew__heading {

        margin-top:
            46px;
    }


    .iamaAccountNew__grid {

        grid-template-columns:
            1fr;

        gap:
            24px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaAccountNew::before {

        height:
            620px;
    }


    .iamaAccountNew__tabsArea {

        padding:
            12px 0;
    }


    .iamaAccountNew__tabs {

        padding:
            6px;

        gap:
            5px;

        border-radius:
            13px;
    }


    .iamaAccountNew__tab {

        min-height:
            42px;

        padding:
            0 15px;

        font-size:
            13px;

        border-radius:
            9px;
    }


    .iamaAccountNew__main {

        padding:
            8px 0 48px;
    }


    .iamaAccountNew__welcome {

        padding:
            27px 20px;

        gap:
            24px;

        border-radius:
            20px;
    }


    .iamaAccountNew__welcomeLeft {

        align-items:
            flex-start;

        gap:
            15px;
    }


    .iamaAccountNew__avatar {

        width:
            60px;

        height:
            60px;

        flex-basis:
            60px;

        border-width:
            2px;

        border-radius:
            15px;

        font-size:
            23px;
    }


    .iamaAccountNew__eyebrow {

        font-size:
            10px;
    }


    .iamaAccountNew__welcomeCopy h1 {

        font-size:
            29px !important;

        line-height:
            1.08 !important;
    }


    .iamaAccountNew__welcomeCopy p {

        margin-top:
            12px !important;

        font-size:
            14px !important;

        line-height:
            1.55 !important;
    }


    .iamaAccountNew__identity {

        padding:
            18px;

        grid-template-columns:
            1fr;

        gap:
            16px;
    }


    .iamaAccountNew__identity > div + div {

        padding-top:
            16px;

        border-top:
            1px solid rgba(255,255,255,.11);
    }


    .iamaAccountNew__quick {

        margin-top:
            18px;

        padding:
            8px;

        grid-template-columns:
            1fr 1fr;

        gap:
            7px;

        border-radius:
            14px;
    }


    .iamaAccountNew__quickItem {

        min-height:
            92px;

        padding:
            14px;

        border-radius:
            11px;
    }


    .iamaAccountNew__quickItem span {

        font-size:
            11px;
    }


    .iamaAccountNew__quickItem strong {

        font-size:
            13px;
    }


    .iamaAccountNew__heading {

        margin:
            35px 0 18px;

        display:
            block;
    }


    .iamaAccountNew__heading h2 {

        font-size:
            29px !important;
    }


    .iamaAccountNew__heading p {

        margin-top:
            10px !important;

        font-size:
            14px !important;
    }


    .iamaAccountNew__card {

        border-radius:
            17px;
    }


    .iamaAccountNew__cardHead {

        min-height:
            auto;

        padding:
            21px 19px;

        align-items:
            flex-start;
    }


    .iamaAccountNew__cardHead span {

        font-size:
            10px;
    }


    .iamaAccountNew__cardHead h3 {

        font-size:
            22px !important;
    }


    .iamaAccountNew__outlineBtn {

        min-height:
            37px;

        padding:
            0 11px;

        font-size:
            11px;
    }


    .iamaAccountNew__details {

        padding:
            18px;

        grid-template-columns:
            1fr;

        gap:
            8px;
    }


    .iamaAccountNew__detail {

        min-height:
            78px;

        padding:
            15px;
    }


    .iamaAccountNew__detail--full {

        grid-column:
            auto;
    }


    .iamaAccountNew__detail span {

        font-size:
            12px;
    }


    .iamaAccountNew__detail strong {

        font-size:
            15px;
    }


    .iamaAccountNew__academic {

        padding:
            18px;
    }


    .iamaAccountNew__course {

        padding:
            18px;

        flex-direction:
            column;

        align-items:
            flex-start;
    }


    .iamaAccountNew__course h4 {

        font-size:
            19px !important;
    }


    .iamaAccountNew__fees {

        grid-template-columns:
            1fr;

        gap:
            8px;
    }


    .iamaAccountNew__fees > div {

        min-height:
            78px;
    }


    .iamaAccountNew__success {

        align-items:
            flex-start;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA PROFILE EDIT
========================================================= */

.iamaProfileEdit,
.iamaProfileEdit *,
.iamaProfileEdit *::before,
.iamaProfileEdit *::after {
    box-sizing: border-box;
}


.iamaProfileEdit {

    --ipe-blue: #073c92;
    --ipe-blue2: #0b56bd;
    --ipe-dark: #071b42;
    --ipe-dark2: #09275f;
    --ipe-yellow: #ffc12d;

    --ipe-text: #112d5d;
    --ipe-body: #53637c;
    --ipe-muted: #8290a4;

    --ipe-border: #dfe6ef;
    --ipe-soft: #f4f7fb;

    position: relative;

    width: 100%;

    font-family:
        "Outfit",
        sans-serif;

    color:
        var(--ipe-text);

    background:
        linear-gradient(
            180deg,
            #071a40 0,
            #0a2b67 350px,
            #f3f7fc 350px,
            #f8fafc 100%
        );
        padding: 180px 40px 80px;
}


/* =========================================================
   NAVIGATION
========================================================= */

.iamaProfileEdit__navArea {

    position: relative;

    z-index: 10;

    width: 100%;

    padding:
        24px 0 18px;
}


.iamaProfileEdit__nav {

    width: 100%;

    padding:
        8px;

    display: flex;

    align-items: center;

    gap:
        8px;

    overflow-x: auto;

    overflow-y: hidden;

    white-space: nowrap;

    border:
        1px solid rgba(255,255,255,.11);

    border-radius:
        18px;

    background:
        rgba(255,255,255,.065);

    backdrop-filter:
        blur(15px);

    box-shadow:
        0 14px 38px
        rgba(0,0,0,.13);

    scrollbar-width:
        none;
}


.iamaProfileEdit__nav::-webkit-scrollbar {
    display: none;
}


.iamaProfileEdit__navItem {

    min-height:
        50px;

    padding:
        0 23px;

    flex:
        1 0 auto;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        11px;

    color:
        rgba(255,255,255,.81);

font-size: 18px;
    font-weight: 800;
    line-height:
        1;

    text-decoration:
        none;

    transition:
        all .22s ease;
}


.iamaProfileEdit__navItem:hover {

    color: #fff;

    background:
        rgba(255,255,255,.09);
}


.iamaProfileEdit__navItem.is-active {

    color:
        #071a3b;

    background:
        linear-gradient(
            120deg,
            #ffd35f,
            #ffc12d
        );

    box-shadow:
        0 10px 24px
        rgba(255,193,45,.22);
}


.iamaProfileEdit__navItem--logout {

    color:
        #ffc1c1;
}


.iamaProfileEdit__navItem--logout:hover {

    color: #fff;

    background:
        #a84049;
}


/* =========================================================
   BODY
========================================================= */

.iamaProfileEdit__body {

    position: relative;

    z-index: 2;

    padding:
        18px 0 90px;
}


/* =========================================================
   PROFILE HERO
========================================================= */

.iamaProfileEdit__hero {

    position: relative;

    width: 100%;

    min-height:
        270px;

    padding:
        44px 46px;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap:
        45px;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        28px;

    background:

        radial-gradient(
            circle at 88% 8%,
            rgba(83,151,255,.27),
            transparent 34%
        ),

        linear-gradient(
            120deg,
            #09265e 0%,
            #0a429a 55%,
            #0d5fc9 100%
        );

    box-shadow:
        0 26px 65px
        rgba(4,26,65,.23);
}


.iamaProfileEdit__hero::after {

    content: "";

    position: absolute;

    width:
        440px;

    height:
        440px;

    right:
        -175px;

    top:
        -260px;

    border-radius:
        50%;

    border:
        1px solid rgba(255,255,255,.11);

    box-shadow:

        0 0 0 70px
        rgba(255,255,255,.024),

        0 0 0 140px
        rgba(255,255,255,.014);
}


.iamaProfileEdit__heroPattern {

    position:
        absolute;

    inset:
        0;

    pointer-events:
        none;

    opacity:
        .04;

    background-image:

        linear-gradient(
            rgba(255,255,255,.8) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.8) 1px,
            transparent 1px
        );

    background-size:
        48px 48px;
}


/* HERO PROFILE */

.iamaProfileEdit__heroProfile {

    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    gap:
        26px;

    min-width:
        0;
}


.iamaProfileEdit__avatar {

    width:
        98px;

    height:
        98px;

    flex:
        0 0 98px;

    display:
        grid;

    place-items:
        center;

    border:
        3px solid var(--ipe-yellow);

    border-radius:
        25px;

    background:
        #fff;

    color:
        var(--ipe-blue);

    font-size:
        31px;

    font-weight:
        800;

    letter-spacing:
        -.5px;

    box-shadow:
        0 15px 35px
        rgba(0,0,0,.16);
}


.iamaProfileEdit__heroCopy {

    max-width:
        620px;
}


.iamaProfileEdit__eyebrow {

    display:
        block;

    margin-bottom:
        9px;

    color:
        var(--ipe-yellow);

    font-size:
        14px;

    font-weight:
        800;

    line-height:
        1;

    letter-spacing:
        1.3px;
}


.iamaProfileEdit__heroCopy h1 {

    margin:
        0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(38px, 3.5vw, 52px) !important;

    line-height:
        1.03 !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.8px !important;
}


.iamaProfileEdit__heroCopy h1 span {

    color:
        var(--ipe-yellow);

    font-weight:
        800;
}


.iamaProfileEdit__heroCopy p {

    max-width:
        550px;

    margin:
        16px 0 0 !important;

    color:
        rgba(255,255,255,.79) !important;

    font-size:
        17px !important;

    line-height:
        1.6 !important;
}


/* HERO META */

.iamaProfileEdit__heroMeta {

    position:
        relative;

    z-index:
        2;

    width:
        290px;

    flex:
        0 0 290px;

    padding:
        23px;

    border:
        1px solid rgba(255,255,255,.16);

    border-radius:
        18px;

    background:
        rgba(255,255,255,.09);

    backdrop-filter:
        blur(10px);
}


.iamaProfileEdit__heroMeta > div + div {

    margin-top:
        17px;

    padding-top:
        17px;

    border-top:
        1px solid rgba(255,255,255,.12);
}


.iamaProfileEdit__heroMeta span {

    display:
        block;

    color:
        rgba(255,255,255,.58);

    font-size:
        13px;

    font-weight:
        500;
}


.iamaProfileEdit__heroMeta strong {

    display:
        block;

    margin-top:
        5px;

    color:
        #fff;

    font-size:
        17px;

    font-weight:
        700;
}


/* =========================================================
   FORM
========================================================= */

.iamaProfileEdit__form {

    width: 100%;

    margin-top:
        34px;
}


/* =========================================================
   MAIN BLOCK
========================================================= */

.iamaProfileEdit__block {

    position: relative;

    width: 100%;

    margin-bottom:
        28px;

    padding:
        34px 36px 37px;

    border:
        1px solid var(--ipe-border);

    border-radius:
        24px;

    background:
        #fff;

    box-shadow:
        0 14px 42px
        rgba(21,48,91,.065);
}


.iamaProfileEdit__block::before {

    content: "";

    position: absolute;

    top: 0;

    left:
        34px;

    width:
        75px;

    height:
        4px;

    border-radius:
        0 0 8px 8px;

    background:
        linear-gradient(
            90deg,
            var(--ipe-blue),
            var(--ipe-yellow)
        );
}


/* DARK ACCOUNT BLOCK */

.iamaProfileEdit__block--account {

    border:
        1px solid rgba(20,59,116,.11);

    background:

        radial-gradient(
            circle at 100% 0,
            rgba(18,91,202,.09),
            transparent 35%
        ),

        linear-gradient(
            145deg,
            #f7faff,
            #eef4fc
        );
}


/* =========================================================
   BLOCK HEADER
========================================================= */

.iamaProfileEdit__blockHead {

    margin-bottom:
        28px;

    display:
        flex;

    align-items:
        flex-start;

    justify-content:
        space-between;

    gap:
        30px;
}


.iamaProfileEdit__blockTag {

    display:
        block;

    margin-bottom:
        7px;

    color:
        var(--ipe-blue);

    font-size:
        13px;

    font-weight:
        800;

    letter-spacing:
        1.15px;
}


.iamaProfileEdit__blockHead h2 {

    margin:
        0 !important;

    color:
        #112f64 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(27px, 2.6vw, 34px) !important;

    line-height:
        1.08 !important;

    font-weight:
        700 !important;
}


.iamaProfileEdit__blockHead p {

    max-width:
        610px;

    margin:
        9px 0 0 !important;

    color:
        #6c7a91 !important;

    font-size:
        16px !important;

    line-height:
        1.55 !important;
}


.iamaProfileEdit__secureBadge {

    min-height:
        38px;

    padding:
        0 14px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 auto;

    border:
        1px solid #d7e2f1;

    border-radius:
        50px;

    background:
        #fff;

    color:
        var(--ipe-blue);

    font-size:
        17px;

    font-weight:
        700;
}


/* =========================================================
   LOCKED CARDS
========================================================= */

.iamaProfileEdit__lockedGrid {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        16px;
}


.iamaProfileEdit__lockedCard {

    position:
        relative;

    min-height:
        132px;

    padding:
        22px;

    display:
        flex;

    align-items:
        center;

    gap:
        16px;

    overflow:
        hidden;

    border:
        1px solid #dce5f0;

    border-radius:
        16px;

    background:
        #fff;
}


.iamaProfileEdit__lockedIcon {

    width:
        52px;

    height:
        52px;

    flex:
        0 0 52px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        14px;

    background:
        #e8f0fc;

    color:
        var(--ipe-blue);

    font-size:
        17px;

    font-weight:
        800;
}


.iamaProfileEdit__lockedContent {

    min-width:
        0;

    padding-right:
        58px;
}


.iamaProfileEdit__lockedContent span {

    display:
        block;

    color:
        #7d8ba1;

    font-size:
        17px;

    font-weight:
        500;
}


.iamaProfileEdit__lockedContent strong {

    display:
        block;

    margin-top:
        5px;

    color:
        #21395e;

    font-size:
        17px;

    line-height:
        1.35;

    font-weight:
        700;

    overflow-wrap:
        anywhere;
}


.iamaProfileEdit__lockedContent small {

    display:
        block;

    margin-top:
        5px;

    color:
        #98a3b4;

    font-size:
        16px;

    line-height:
        1.4;
}


.iamaProfileEdit__lock {

    position:
        absolute;

    top:
        16px;

    right:
        16px;

    padding:
        5px 8px;

    border-radius:
        50px;

    background:
        #edf2f8;

    color:
        #75849a;

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        .7px;
}


/* =========================================================
   FORM FIELDS
========================================================= */

.iamaProfileEdit__fields {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        22px 24px;
}


.iamaProfileEdit__fields--address {

    margin-top:
        22px;
}


.iamaProfileEdit__field {

    width: 100%;
}


.iamaProfileEdit__field label {

    display:
        block;

    margin-bottom:
        9px;

    color:
        #233b61;

    font-size:
        15px;

    line-height:
        1.3;

    font-weight:
        700;
}


/* INPUTS */

.iamaProfileEdit__field input,
.iamaProfileEdit__field select,
.iamaProfileEdit__field textarea {

    width:
        100%;

    margin:
        0;

    border:
        1px solid #dbe3ed;

    border-radius:
        13px;

    outline:
        none;

    background:
        #f7f9fc;

    color:
        #243956;

    font-family:
        "Outfit",
        sans-serif;

    font-size:
        15px;

    font-weight:
        500;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.iamaProfileEdit__field input,
.iamaProfileEdit__field select {

    height:
        58px;

    padding:
        0 17px;
}


.iamaProfileEdit__field textarea {

    min-height:
        135px;

    padding:
        16px 17px;

    line-height:
        1.55;

    resize:
        vertical;
}


.iamaProfileEdit__field input:focus,
.iamaProfileEdit__field select:focus,
.iamaProfileEdit__field textarea:focus {

    border-color:
        rgba(7,60,146,.55);

    background:
        #fff;

    box-shadow:
        0 0 0 4px
        rgba(7,60,146,.075);
}


/* =========================================================
   PHONE
========================================================= */

.iamaProfileEdit__phone {

    width: 100%;

    display:
        grid;

    grid-template-columns:
        76px 1fr;
}


.iamaProfileEdit__phone > span {

    height:
        58px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid #dbe3ed;

    border-right:
        0;

    border-radius:
        13px 0 0 13px;

    background:
        #edf2f8;

    color:
        #62738b;

    font-size:
        15px;

    font-weight:
        600;
}


.iamaProfileEdit__phone input {

    border-radius:
        0 13px 13px 0;
}


/* =========================================================
   ADDRESS GRID
========================================================= */

.iamaProfileEdit__addressGrid {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        24px;
}


/* =========================================================
   UPLOADS
========================================================= */

.iamaProfileEdit__uploads {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        18px;
}


.iamaProfileEdit__upload {

    position:
        relative;

    min-height:
        165px;

    overflow:
        hidden;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        space-between;

    border:
        1px dashed #b9c7d9;

    border-radius:
        17px;

    background:
        linear-gradient(
            145deg,
            #f8fafc,
            #f2f6fb
        );

    cursor:
        pointer;

    transition:
        all .23s ease;
}


.iamaProfileEdit__upload:hover {

    border-color:
        var(--ipe-blue);

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 28px
        rgba(29,63,115,.08);
}


.iamaProfileEdit__uploadTop {

    padding:
        22px;

    display:
        flex;

    align-items:
        center;

    gap:
        16px;
}


.iamaProfileEdit__uploadIcon {

    width:
        50px;

    height:
        50px;

    flex:
        0 0 50px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        14px;

    background:
        #e6eefb;

    color:
        var(--ipe-blue);

    font-size:
        24px;

    line-height:
        1;

    font-weight:
        500;
}


.iamaProfileEdit__uploadTop strong {

    display:
        block;

    color:
        #223a60;

    font-size:
        17px;

    font-weight:
        700;
}


.iamaProfileEdit__uploadTop span {

    display:
        block;

    margin-top:
        5px;

    color:
        #8290a4;

    font-size:
        13px;

    line-height:
        1.4;
}


.iamaProfileEdit__uploadBottom {

    min-height:
        50px;

    padding:
        0 20px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        15px;

    border-top:
        1px solid #dfe6ef;

    background:
        rgba(255,255,255,.72);
}


.iamaProfileEdit__uploadBottom span {

    color:
        #8894a6;

    font-size:
        11px;

    font-weight:
        500;
}


.iamaProfileEdit__uploadBottom strong {

    color:
        var(--ipe-blue);

    font-size:
        13px;

    font-weight:
        700;
}


.iamaProfileEdit__upload input {

    position:
        absolute;

    width:
        1px;

    height:
        1px;

    opacity:
        0;
}


/* =========================================================
   ACTION BAR
========================================================= */

.iamaProfileEdit__actions {

    width:
        100%;

    padding:
        23px 25px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

    border:
        1px solid #dfe6ef;

    border-radius:
        18px;

    background:
        #fff;

    box-shadow:
        0 12px 32px
        rgba(22,49,92,.06);
}


.iamaProfileEdit__actions > div:first-child strong {

    display:
        block;

    color:
        #17335f;

    font-size:
        22px;

    font-weight:
        700;
}


.iamaProfileEdit__actions > div:first-child span {

    display:
        block;

    margin-top:
        4px;

    color:
        #8290a3;

    font-size:
        17px;
}


.iamaProfileEdit__actionBtns {

    display:
        flex;

    align-items:
        center;

    gap:
        11px;
}


/* CANCEL */

.iamaProfileEdit__cancel {

    min-height:
        53px;

    padding:
        0 21px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid #d7e0eb;

    border-radius:
        12px;

    background:
        #fff;

    color:
        #586980;

    font-size:
        14px;

    font-weight:
        700;

    text-decoration:
        none;

    transition:
        .2s ease;
}


.iamaProfileEdit__cancel:hover {

    color:
        var(--ipe-blue);

    border-color:
        var(--ipe-blue);
}


/* SAVE */

.iamaProfileEdit__save {

    min-height:
        53px;

    padding:
        0 24px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        9px;

    border:
        0;

    border-radius:
        12px;

    cursor:
        pointer;

    background:
        linear-gradient(
            120deg,
            #073b91,
            #0b59c2
        );

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif;

    font-size:
        15px;

    font-weight:
        700;

    box-shadow:
        0 12px 27px
        rgba(7,59,145,.23);

    transition:
        all .22s ease;
}


.iamaProfileEdit__save:hover {

    transform:
        translateY(-2px);

    box-shadow:
        0 17px 34px
        rgba(7,59,145,.30);
}


.iamaProfileEdit__save svg {

    width:
        17px;

    height:
        17px;

    fill:
        var(--ipe-yellow);
}


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1199px) {

    .iamaProfileEdit__hero {

        padding:
            38px;

        gap:
            30px;
    }


    .iamaProfileEdit__heroCopy h1 {

        font-size:
            42px !important;
    }


    .iamaProfileEdit__heroMeta {

        width:
            260px;

        flex-basis:
            260px;
    }


    .iamaProfileEdit__block {

        padding:
            30px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaProfileEdit {

        background:
            linear-gradient(
                180deg,
                #071a40 0,
                #0a2b67 500px,
                #f3f7fc 500px,
                #f8fafc 100%
            );
    }


    .iamaProfileEdit__navItem {

        flex:
            0 0 auto;
    }


    .iamaProfileEdit__hero {

        min-height:
            auto;

        padding:
            34px;

        flex-direction:
            column;

        align-items:
            stretch;
    }


    .iamaProfileEdit__heroMeta {

        width:
            100%;

        flex:
            none;

        display:
            grid;

        grid-template-columns:
            1fr 1fr;

        gap:
            20px;
    }


    .iamaProfileEdit__heroMeta > div + div {

        margin:
            0;

        padding:
            0;

        border:
            0;
    }


    .iamaProfileEdit__lockedGrid {

        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaProfileEdit {

        background:
            linear-gradient(
                180deg,
                #071a40 0,
                #0a2b67 630px,
                #f3f7fc 630px,
                #f8fafc 100%
            );
    }


    .iamaProfileEdit__navArea {

        padding:
            12px 0;
    }


    .iamaProfileEdit__nav {

        padding:
            6px;

        gap:
            5px;

        border-radius:
            13px;
    }


    .iamaProfileEdit__navItem {

        min-height:
            43px;

        padding:
            0 15px;

        font-size:
            13px;

        border-radius:
            9px;
    }


    .iamaProfileEdit__body {

        padding:
            10px 0 50px;
    }


    .iamaProfileEdit__hero {

        padding:
            27px 20px;

        gap:
            25px;

        border-radius:
            20px;
    }


    .iamaProfileEdit__heroProfile {

        align-items:
            flex-start;

        gap:
            14px;
    }


    .iamaProfileEdit__avatar {

        width:
            61px;

        height:
            61px;

        flex-basis:
            61px;

        border-width:
            2px;

        border-radius:
            15px;

        font-size:
            21px;
    }


    .iamaProfileEdit__eyebrow {

        font-size:
            10px;
    }


    .iamaProfileEdit__heroCopy h1 {

        font-size:
            29px !important;

        line-height:
            1.08 !important;
    }


    .iamaProfileEdit__heroCopy p {

        margin-top:
            11px !important;

        font-size:
            14px !important;

        line-height:
            1.55 !important;
    }


    .iamaProfileEdit__heroMeta {

        padding:
            17px;

        grid-template-columns:
            1fr;

        gap:
            15px;
    }


    .iamaProfileEdit__heroMeta > div + div {

        padding-top:
            15px;

        border-top:
            1px solid rgba(255,255,255,.11);
    }


    .iamaProfileEdit__form {

        margin-top:
            21px;
    }


    .iamaProfileEdit__block {

        margin-bottom:
            18px;

        padding:
            24px 18px;

        border-radius:
            18px;
    }


    .iamaProfileEdit__block::before {

        left:
            18px;
    }


    .iamaProfileEdit__blockHead {

        margin-bottom:
            21px;

        display:
            block;
    }


    .iamaProfileEdit__blockHead h2 {

        font-size:
            25px !important;
    }


    .iamaProfileEdit__blockHead p {

        font-size:
            14px !important;
    }


    .iamaProfileEdit__secureBadge {

        width:
            fit-content;

        margin-top:
            13px;
    }


    .iamaProfileEdit__lockedCard {

        min-height:
            0;

        padding:
            18px;

        align-items:
            flex-start;
    }


    .iamaProfileEdit__lockedIcon {

        width:
            43px;

        height:
            43px;

        flex-basis:
            43px;

        border-radius:
            11px;
    }


    .iamaProfileEdit__lockedContent {

        padding-right:
            0;
    }


    .iamaProfileEdit__lockedContent strong {

        font-size:
            15px;
    }


    .iamaProfileEdit__lock {

        display:
            none;
    }


    .iamaProfileEdit__fields,
    .iamaProfileEdit__addressGrid {

        grid-template-columns:
            1fr;

        gap:
            17px;
    }


    .iamaProfileEdit__fields--address {

        margin-top:
            17px;
    }


    .iamaProfileEdit__field label {

        font-size:
            14px;
    }


    .iamaProfileEdit__field input,
    .iamaProfileEdit__field select {

        height:
            54px;

        font-size:
            14px;
    }


    .iamaProfileEdit__field textarea {

        min-height:
            115px;

        font-size:
            14px;
    }


    .iamaProfileEdit__phone {

        grid-template-columns:
            68px 1fr;
    }


    .iamaProfileEdit__phone > span {

        height:
            54px;

        font-size:
            13px;
    }


    .iamaProfileEdit__uploads {

        grid-template-columns:
            1fr;
    }


    .iamaProfileEdit__upload {

        min-height:
            150px;
    }


    .iamaProfileEdit__actions {

        padding:
            18px;

        display:
            block;
    }


    .iamaProfileEdit__actions > div:first-child {

        margin-bottom:
            16px;
    }


    .iamaProfileEdit__actionBtns {

        width:
            100%;

        display:
            grid;

        grid-template-columns:
            1fr 1fr;
    }


    .iamaProfileEdit__cancel,
    .iamaProfileEdit__save {

        width:
            100%;

        min-height:
            51px;
    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .iamaProfileEdit__actionBtns {

        grid-template-columns:
            1fr;
    }


    .iamaProfileEdit__heroCopy h1 {

        font-size:
            27px !important;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA PREMIUM PAYMENT PORTAL
========================================================= */

.iamaPayPortal,
.iamaPayPortal *,
.iamaPayPortal *::before,
.iamaPayPortal *::after {
    box-sizing: border-box;
}


.iamaPayPortal {

    --ipp-bg: #06183a;
    --ipp-bg2: #08265c;
    --ipp-blue: #0c51b7;
    --ipp-blue2: #1264d5;

    --ipp-yellow: #ffc12d;
    --ipp-yellow2: #e7a51d;

    --ipp-white: #ffffff;
    --ipp-text: #f8fbff;

    --ipp-softText: #b8c8e4;
    --ipp-muted: #8096bb;

    position: relative;

    width: 100%;

    overflow: visible;

    font-family:
        "Outfit",
        sans-serif;

    color:
        #fff;

    background:

        radial-gradient(
            circle at 7% 10%,
            rgba(28,100,225,.25),
            transparent 28%
        ),

        radial-gradient(
            circle at 93% 30%,
            rgba(16,88,205,.18),
            transparent 32%
        ),

        linear-gradient(
            125deg,
            #04132e 0%,
            #071d48 45%,
            #08245a 70%,
            #04142f 100%
        );
        padding: 180px 40px 80px;
}


/* subtle grid */

.iamaPayPortal::before {

    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    opacity: .035;

    background-image:

        linear-gradient(
            rgba(255,255,255,.6) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.6) 1px,
            transparent 1px
        );

    background-size:
        55px 55px;
}


/* =========================================================
   ACCOUNT NAVIGATION
========================================================= */

.iamaPayPortal__accountBar {

    position: relative;

    z-index: 100;

    width: 100%;

    padding:
        24px 0 18px;
}


.iamaPayPortal__accountNav {

    width: 100%;

    padding: 8px;

    display: flex;

    align-items: center;

    gap: 8px;

    overflow-x: auto;

    overflow-y: hidden;

    white-space: nowrap;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        18px;

    background:
        rgba(255,255,255,.065);

    box-shadow:
        0 18px 45px rgba(0,0,0,.18);

    backdrop-filter:
        blur(18px);

    scrollbar-width:
        none;
}


.iamaPayPortal__accountNav::-webkit-scrollbar {
    display: none;
}


.iamaPayPortal__accountLink {

    min-height:
        52px;

    padding:
        0 24px;

    flex:
        1 0 auto;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        12px;

    color:
        #d6e2f6;

    font-family:
        "Outfit",
        sans-serif;

  font-size: 18px;
    font-weight: 800;

    line-height:
        1;

    text-decoration:
        none;

    transition:
        all .23s ease;
}


.iamaPayPortal__accountLink:hover {

    color:
        #fff;

    background:
        rgba(255,255,255,.09);
}


.iamaPayPortal__accountLink.is-active {

    color:
        #071936;

    background:
        linear-gradient(
            120deg,
            #ffd360,
            #ffc12d
        );

    box-shadow:
        0 11px 26px
        rgba(255,193,45,.22);
}


.iamaPayPortal__accountLink--logout {

    color:
        #ffc0c5;
}


.iamaPayPortal__accountLink--logout:hover {

    color:
        #fff;

    background:
        #a63e49;
}


/* =========================================================
   BODY
========================================================= */

.iamaPayPortal__body {

    position: relative;

    z-index: 2;

    width: 100%;

    padding:
        24px 0 100px;
}


/* =========================================================
   HERO
========================================================= */

.iamaPayPortal__hero {

    position: relative;

    min-height:
        300px;

    padding:
        48px 50px;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap:
        55px;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        30px;

    background:

        radial-gradient(
            circle at 85% 10%,
            rgba(74,144,255,.28),
            transparent 34%
        ),

        linear-gradient(
            125deg,
            rgba(8,40,96,.94),
            rgba(9,61,143,.92) 58%,
            rgba(13,87,189,.92)
        );

    box-shadow:
        0 28px 70px
        rgba(0,0,0,.22);
}


.iamaPayPortal__heroGrid {

    position: absolute;

    inset: 0;

    opacity:
        .045;

    background-image:

        linear-gradient(
            rgba(255,255,255,.7) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.7) 1px,
            transparent 1px
        );

    background-size:
        48px 48px;
}


.iamaPayPortal__heroGlow {

    position: absolute;

    width:
        480px;

    height:
        480px;

    right:
        -170px;

    top:
        -300px;

    border-radius:
        50%;

    border:
        1px solid rgba(255,255,255,.10);

    box-shadow:

        0 0 0 70px
        rgba(255,255,255,.024),

        0 0 0 145px
        rgba(255,255,255,.013);
}


/* =========================================================
   HERO COPY
========================================================= */

.iamaPayPortal__heroCopy {

    position: relative;

    z-index: 2;

    max-width:
        780px;
}


.iamaPayPortal__eyebrow {

    display: block;

    margin-bottom:
        11px;

    color:
        var(--ipp-yellow);

    font-size:
        14px;

    font-weight:
        800;

    letter-spacing:
        1.35px;
}


.iamaPayPortal__heroCopy h1 {

    margin: 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(42px,4.6vw,64px) !important;

    line-height:
        1.01 !important;

    letter-spacing:
        -1px !important;

    font-weight:
        700 !important;
}


.iamaPayPortal__heroCopy h1 span {

    display: block;

    color:
        var(--ipp-yellow);

    font-weight:
        800;
}


.iamaPayPortal__heroCopy p {

    max-width:
        690px;

    margin:
        20px 0 0 !important;

    color:
        #d1def2 !important;

    font-size:
        18px !important;

    line-height:
        1.65 !important;

    font-weight:
        500 !important;
}


/* HERO RIGHT */

.iamaPayPortal__heroSide {

    position: relative;

    z-index: 2;

    width:
        290px;

    flex:
        0 0 290px;

    padding:
        23px;

    border:
        1px solid rgba(255,255,255,.15);

    border-radius:
        18px;

    background:
        rgba(255,255,255,.08);

    backdrop-filter:
        blur(12px);
}


.iamaPayPortal__heroSide span {

    display: block;

    color:
        var(--ipp-yellow);

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        1px;
}


.iamaPayPortal__heroSide strong {

    display: block;

    margin-top:
        8px;

    color:
        #fff;

    font-size:
        18px;

    line-height:
        1.45;

    font-weight:
        700;
}


/* =========================================================
   SELECTION PANEL
========================================================= */

.iamaPayPortal__selectionCard {

    position: relative;

    z-index: 20;

    margin-top:
        32px;

    padding:
        34px;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        25px;

    background:
        rgba(255,255,255,.065);

    backdrop-filter:
        blur(14px);

    box-shadow:
        0 20px 55px rgba(0,0,0,.14);
}


.iamaPayPortal__selectionCard::before {

    content: "";

    position: absolute;

    top:
        0;

    left:
        35px;

    width:
        90px;

    height:
        4px;

    border-radius:
        0 0 10px 10px;

    background:
        linear-gradient(
            90deg,
            var(--ipp-yellow),
            #fff0a6
        );
}


/* =========================================================
   SELECTOR HEADING
========================================================= */

.iamaPayPortal__selectionHead {

    margin-bottom:
        28px;

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap:
        30px;
}


.iamaPayPortal__selectionHead > div > span,
.iamaPayPortal__paymentHead > div > span {

    display: block;

    margin-bottom:
        7px;

    color:
        var(--ipp-yellow);

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        1.2px;
}


.iamaPayPortal__selectionHead h2,
.iamaPayPortal__paymentHead h2 {

    margin:
        0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(28px,3vw,39px) !important;

    line-height:
        1.07 !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.5px !important;
}


.iamaPayPortal__selectionHead p,
.iamaPayPortal__paymentHead p {

    max-width:
        420px;

    margin:
        0 !important;

    color:
        #b9c8df !important;

    font-size:
        17px !important;

    line-height:
        1.55 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   SELECTORS
========================================================= */

.iamaPayPortal__selectors {

    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:
        22px;
}


.iamaPayPortal__field {

    position: relative;
}


.iamaPayPortal__field > label {

    display: block;

    margin-bottom:
        10px;

    color:
        #fff;

    font-size:
        15px;

    font-weight:
        700;
}


/* =========================================================
   CUSTOM DROPDOWN
========================================================= */

.iamaPayPortal__dropdown {

    position: relative;

    width: 100%;
}


.iamaPayPortal__dropdownButton {

    position: relative;

    width:
        100%;

    min-height:
        66px;

    padding:
        0 60px 0 19px;

    display:
        flex;

    align-items:
        center;

    border:
        1px solid rgba(255,255,255,.14);

    border-radius:
        15px;

    outline:
        none;

    cursor:
        pointer;

    background:
        rgba(255,255,255,.075);

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif;

    font-size:
        21px;

    font-weight:
        700;

    text-align:
        left;

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.04);

    transition:
        .22s ease;
}


.iamaPayPortal__dropdownButton:hover {

    border-color:
        rgba(255,255,255,.25);

    background:
        rgba(255,255,255,.10);
}


.iamaPayPortal__dropdown.is-open
.iamaPayPortal__dropdownButton {

    border-color:
        rgba(255,193,45,.60);

    background:
        rgba(255,255,255,.11);

    box-shadow:
        0 0 0 4px
        rgba(255,193,45,.07);
}


.iamaPayPortal__dropdownCurrent {

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;
}


/* ARROW */

.iamaPayPortal__dropdownIcon {

    position: absolute;

    top:
        50%;

    right:
        16px;

    transform:
        translateY(-50%);

    width:
        36px;

    height:
        36px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        10px;

    background:
        rgba(255,255,255,.10);

    transition:
        .22s ease;
}


.iamaPayPortal__dropdownIcon svg {

    width:
        19px;

    height:
        19px;

    fill:
        var(--ipp-yellow);
}


.iamaPayPortal__dropdown.is-open
.iamaPayPortal__dropdownIcon {

    transform:
        translateY(-50%)
        rotate(180deg);
}


/* DISABLED */

.iamaPayPortal__dropdown.is-disabled
.iamaPayPortal__dropdownButton {

    cursor:
        not-allowed;

    color:
        #7286a5;

    background:
        rgba(255,255,255,.035);
}


/* =========================================================
   DROPDOWN PANEL
========================================================= */

.iamaPayPortal__dropdownPanel {

    position: absolute;

    top:
        calc(100% + 10px);

    left:
        0;

    right:
        0;

    z-index:
        200;

    max-height:
        370px;

    padding:
        9px;

    overflow-y:
        auto;

    visibility:
        hidden;

    opacity:
        0;

    transform:
        translateY(-8px);

    border:
        1px solid #213f73;

    border-radius:
        16px;

    background:
        #0b234e;

    box-shadow:
        0 25px 65px
        rgba(0,0,0,.35);

    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}


.iamaPayPortal__dropdown.is-open
.iamaPayPortal__dropdownPanel {

    visibility:
        visible;

    opacity:
        1;

    transform:
        translateY(0);
}


/* OPTION */

.iamaPayPortal__dropdownPanel > button {

    position: relative;

    width:
        100%;

    min-height:
        72px;

    padding:
        12px 48px 12px 12px;

    display:
        flex;

    align-items:
        center;

    gap:
        13px;

    border:
        0;

    border-radius:
        11px;

    cursor:
        pointer;

    background:
        transparent;

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif;

    text-align:
        left;

    transition:
        background .17s ease;
}


.iamaPayPortal__dropdownPanel > button:hover {

    background:
        rgba(255,255,255,.075);
}


.iamaPayPortal__dropdownPanel > button.is-selected {

    background:
        rgba(255,193,45,.10);
}


.iamaPayPortal__dropdownPanel > button.is-selected::after {

    content:
        "✓";

    position:
        absolute;

    top:
        50%;

    right:
        15px;

    transform:
        translateY(-50%);

    width:
        28px;

    height:
        28px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        var(--ipp-yellow);

    color:
        #081c43;

    font-size:
        12px;

    font-weight:
        800;
}


.iamaPayPortal__optionNo {

    width:
        37px;

    height:
        37px;

    flex:
        0 0 37px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        10px;

    background:
        rgba(255,255,255,.08);

    color:
        var(--ipp-yellow);

    font-size:
        16px;

    font-weight:
        800;
}


.iamaPayPortal__optionCopy {

    min-width: 0;
}


.iamaPayPortal__optionCopy strong {

    display:
        block;

    color:
        #fff;

    font-size:
        20px;

    line-height:
        1.3;

    font-weight:
        700;
}


.iamaPayPortal__optionCopy small {

    display:
        block;

    margin-top:
        4px;

    color:
        #8fa4c6;

    font-size:
        17px;

    line-height:
        1.3;

    font-weight:
        500;
}


/* =========================================================
   RESULT
========================================================= */

#iamaPayPortalResult {

    margin-top:
        40px;
}


/* =========================================================
   PAYMENT AREA
========================================================= */

.iamaPayPortal__paymentArea {

    opacity: 0;

    transform:
        translateY(14px);

    transition:
        opacity .35s ease,
        transform .35s ease;
}


.iamaPayPortal__paymentArea.is-visible {

    opacity: 1;

    transform:
        translateY(0);
}


.iamaPayPortal__paymentHead {

    margin-bottom:
        24px;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        30px;
}


/* =========================================================
   PAYMENT GRID
========================================================= */

.iamaPayPortal__plans {

    display:
        grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:
        24px;

    align-items:
        stretch;
}


.iamaPayPortal__plans.is-single {

    grid-template-columns:
        minmax(0,700px);
}


/* =========================================================
   PAYMENT CARD
========================================================= */

.iamaPayPortal__plan {

    position:
        relative;

    padding:
        32px;

    overflow:
        hidden;

    border:
        1px solid rgba(255,255,255,.13);

    border-radius:
        24px;

    background:

        radial-gradient(
            circle at 100% 0,
            rgba(39,104,219,.13),
            transparent 35%
        ),

        rgba(255,255,255,.065);

    backdrop-filter:
        blur(12px);

    box-shadow:
        0 18px 50px
        rgba(0,0,0,.16);

    transition:
        transform .24s ease,
        border-color .24s ease;
}


.iamaPayPortal__plan:hover {

    transform:
        translateY(-4px);

    border-color:
        rgba(255,255,255,.22);
}


.iamaPayPortal__plan::before {

    content: "";

    position:
        absolute;

    top: 0;

    left: 0;

    width:
        100%;

    height:
        4px;

    background:
        linear-gradient(
            90deg,
            var(--ipp-yellow),
            #f0a61e
        );
}


.iamaPayPortal__plan--installment::before {

    background:
        linear-gradient(
            90deg,
            #2674e5,
            #58a0ff
        );
}


/* =========================================================
   PLAN TOP
========================================================= */

.iamaPayPortal__planTop {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    gap:
        20px;
}


.iamaPayPortal__planTag {

    min-height:
        34px;

    padding:
        0 13px;

    display:
        inline-flex;

    align-items:
        center;

    border-radius:
        50px;

    background:
        var(--ipp-yellow);

    color:
        #09204c;

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        .8px;
}


.iamaPayPortal__plan--installment
.iamaPayPortal__planTag {

    color:
        #dbe9ff;

    background:
        rgba(59,126,232,.20);
}


.iamaPayPortal__planNumber {

    width:
        45px;

    height:
        45px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        13px;

    background:
        rgba(255,255,255,.07);

    color:
        var(--ipp-yellow);

    font-size:
        13px;

    font-weight:
        800;
}


/* =========================================================
   PLAN TITLE
========================================================= */

.iamaPayPortal__planTitle {

    margin-top:
        28px;
}


.iamaPayPortal__planTitle > span {

    display:
        block;

    margin-bottom:
        7px;

    color:
        #8298bc;

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        .9px;
}


.iamaPayPortal__planTitle h3 {

    margin:
        0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        31px !important;

    line-height:
        1.08 !important;

    font-weight:
        700 !important;
}


.iamaPayPortal__planTitle p {

    margin:
        8px 0 0 !important;

    color:
        var(--ipp-yellow) !important;

    font-size:
        15px !important;

    line-height:
        1.4 !important;

    font-weight:
        700 !important;
}


.iamaPayPortal__planDivider {

    height:
        1px;

    margin:
        25px 0;

    background:
        rgba(255,255,255,.11);
}


/* =========================================================
   PRICE
========================================================= */

.iamaPayPortal__price > span {

    display:
        block;

    color:
        #8da0bf;

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        .9px;
}


.iamaPayPortal__price > strong {

    display:
        block;

    margin-top:
        8px;

    color:
        #fff;

    font-size:
        clamp(50px,4vw,64px);

    line-height:
        1;

    letter-spacing:
        -1.6px;

    font-weight:
        800;
}


/* =========================================================
   SAVING BOX
========================================================= */

.iamaPayPortal__saving {

    margin-top:
        22px;

    padding:
        17px 18px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    border:
        1px solid rgba(255,193,45,.19);

    border-radius:
        14px;

    background:
        rgba(255,193,45,.08);
}


.iamaPayPortal__saving div > span {

    display:
        block;

    color:
        #bfae75;

    font-size:
        9px;

    font-weight:
        800;

    letter-spacing:
        .8px;
}


.iamaPayPortal__saving div > strong {

    display:
        block;

    margin-top:
        4px;

    color:
        var(--ipp-yellow);

    font-size:
        19px;

    font-weight:
        800;
}


.iamaPayPortal__saving p {

    max-width:
        260px;

    margin:
        0 !important;

    color:
        #bdcbe0 !important;

    font-size:
        12px !important;

    line-height:
        1.45 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   INSTALLMENTS
========================================================= */

.iamaPayPortal__installments {

    display:
        grid;

    gap:
        11px;
}


.iamaPayPortal__installment {

    min-height:
        82px;

    padding:
        13px 15px;

    display:
        flex;

    align-items:
        center;

    gap:
        14px;

    border:
        1px solid rgba(255,255,255,.11);

    border-radius:
        14px;

    background:
        rgba(255,255,255,.05);
}


.iamaPayPortal__installmentNo {

    width:
        40px;

    height:
        40px;

    flex:
        0 0 40px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        11px;

    background:
        #12479a;

    color:
        #fff;

    font-size:
        11px;

    font-weight:
        800;
}


.iamaPayPortal__installment > div {

    width:
        100%;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        15px;
}


.iamaPayPortal__installment div span {

    color:
        #fff;

    font-size:
        15px;

    font-weight:
        700;
}


.iamaPayPortal__installment div strong {

    padding:
        8px 13px;

    border-radius:
        10px;

    background:
        var(--ipp-yellow);

    color:
        #09204b;

    font-size:
        18px;

    font-weight:
        800;
}


/* =========================================================
   TOTAL
========================================================= */

.iamaPayPortal__total {

    margin-top:
        12px;

    min-height:
        78px;

    padding:
        16px 18px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    border-radius:
        14px;

    background:
        linear-gradient(
            120deg,
            #0a3c8c,
            #0f5bbc
        );
}


.iamaPayPortal__total span {

    color:
        #bdd0ec;

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        .8px;
}


.iamaPayPortal__total strong {

    color:
        var(--ipp-yellow);

    font-size:
        29px;

    font-weight:
        800;
}


/* =========================================================
   CHOOSE BUTTON
========================================================= */

.iamaPayPortal__choose {

    width:
        100%;

    min-height:
        60px;

    margin-top:
        24px;

    padding:
        0 23px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        13px;

    cursor:
        pointer;

    background:
        linear-gradient(
            120deg,
            #1552ad,
            #0c65d4
        );

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif;

    font-size:
        16px;

    font-weight:
        700;

    box-shadow:
        0 13px 30px
        rgba(0,0,0,.19);

    transition:
        all .22s ease;
}


.iamaPayPortal__choose svg {

    width:
        18px;

    height:
        18px;

    fill:
        var(--ipp-yellow);

    transition:
        transform .22s ease;
}


.iamaPayPortal__choose:hover {

    transform:
        translateY(-2px);

    background:
        linear-gradient(
            120deg,
            #1761ca,
            #1474e8
        );
}


.iamaPayPortal__choose:hover svg {

    transform:
        translateX(4px);
}


.iamaPayPortal__choose--gold {

    border:
        0;

    color:
        #091c40;

    background:
        linear-gradient(
            120deg,
            #ffd051,
            #e8a820
        );

    box-shadow:
        0 13px 30px
        rgba(218,157,29,.16);
}


.iamaPayPortal__choose--gold:hover {

    background:
        linear-gradient(
            120deg,
            #ffda70,
            #f0b52d
        );
}


.iamaPayPortal__choose--gold svg {

    fill:
        #091c40;
}


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1199px) {

    .iamaPayPortal__hero {

        padding:
            42px;

        gap:
            35px;
    }


    .iamaPayPortal__heroCopy h1 {

        font-size:
            48px !important;
    }


    .iamaPayPortal__heroSide {

        width:
            260px;

        flex-basis:
            260px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaPayPortal__accountLink {

        flex:
            0 0 auto;
    }


    .iamaPayPortal__hero {

        min-height:
            0;

        padding:
            36px;

        flex-direction:
            column;

        align-items:
            stretch;
    }


    .iamaPayPortal__heroSide {

        width:
            100%;

        flex:
            none;
    }


    .iamaPayPortal__selectionHead,
    .iamaPayPortal__paymentHead {

        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            10px;
    }


    .iamaPayPortal__selectors {

        grid-template-columns:
            1fr;
    }


    .iamaPayPortal__plans {

        grid-template-columns:
            1fr;
    }


    .iamaPayPortal__plans.is-single {

        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaPayPortal__accountBar {

        padding:
            12px 0;
    }


    .iamaPayPortal__accountNav {

        padding:
            6px;

        gap:
            5px;

        border-radius:
            13px;
    }


    .iamaPayPortal__accountLink {

        min-height:
            43px;

        padding:
            0 15px;

        border-radius:
            9px;

        font-size:
            13px;
    }


    .iamaPayPortal__body {

        padding:
            10px 0 55px;
    }


    .iamaPayPortal__hero {

        padding:
            28px 20px;

        gap:
            25px;

        border-radius:
            20px;
    }


    .iamaPayPortal__eyebrow {

        font-size:
            10px;
    }


    .iamaPayPortal__heroCopy h1 {

        font-size:
            33px !important;

        line-height:
            1.06 !important;
    }


    .iamaPayPortal__heroCopy p {

        margin-top:
            14px !important;

        font-size:
            15px !important;

        line-height:
            1.55 !important;
    }


    .iamaPayPortal__heroSide {

        padding:
            18px;
    }


    .iamaPayPortal__heroSide strong {

        font-size:
            15px;
    }


    .iamaPayPortal__selectionCard {

        margin-top:
            20px;

        padding:
            23px 18px;

        border-radius:
            19px;
    }


    .iamaPayPortal__selectionCard::before {

        left:
            18px;
    }


    .iamaPayPortal__selectionHead {

        margin-bottom:
            21px;
    }


    .iamaPayPortal__selectionHead h2,
    .iamaPayPortal__paymentHead h2 {

        font-size:
            27px !important;
    }


    .iamaPayPortal__selectionHead p,
    .iamaPayPortal__paymentHead p {

        font-size:
            14px !important;
    }


    .iamaPayPortal__dropdownButton {

        min-height:
            59px;

        padding-left:
            15px;

        font-size:
            14px;
    }


    .iamaPayPortal__dropdownPanel {

        max-height:
            300px;
    }


    #iamaPayPortalResult {

        margin-top:
            32px;
    }


    .iamaPayPortal__plan {

        padding:
            24px 19px;

        border-radius:
            19px;
    }


    .iamaPayPortal__planTitle h3 {

        font-size:
            26px !important;
    }


    .iamaPayPortal__price > strong {

        font-size:
            47px;
    }


    .iamaPayPortal__saving {

        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            8px;
    }


    .iamaPayPortal__saving p {

        max-width:
            none;
    }


    .iamaPayPortal__installment {

        min-height:
            78px;
    }


    .iamaPayPortal__installment > div {

        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            7px;
    }


    .iamaPayPortal__installment div strong {

        font-size:
            16px;
    }


    .iamaPayPortal__choose {

        min-height:
            55px;

        font-size:
            14px;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA CHECKOUT DARK HERO + LIGHT CONTENT
========================================================= */

.iamaCheckoutDark26,
.iamaCheckoutDark26 *,
.iamaCheckoutDark26 *::before,
.iamaCheckoutDark26 *::after {
    box-sizing: border-box;
}


.iamaCheckoutDark26 {

    --icd-blue: #073b91;
    --icd-blue2: #0b58be;

    --icd-dark: #061731;
    --icd-dark2: #082554;

    --icd-yellow: #ffc12d;

    --icd-text: #112c5b;
    --icd-body: #53637b;
    --icd-muted: #8290a5;

    --icd-border: #dfe6ef;
    --icd-soft: #f5f8fc;

    --icd-green: #16874d;

    width: 100%;

    position: relative;

    font-family:
        "Outfit",
        sans-serif;

    color:
        var(--icd-text);
        
}


/* =========================================================
   DARK HERO
========================================================= */

.iamaCheckoutDark26__hero {

    position: relative;

    width: 100%;

    min-height: 360px;

  padding: 180px 40px 80px;

    overflow: hidden;

    display: flex;

    align-items: center;

    background:

        radial-gradient(
            circle at 10% 20%,
            rgba(40,112,235,.25),
            transparent 32%
        ),

        radial-gradient(
            circle at 88% 18%,
            rgba(13,87,205,.22),
            transparent 32%
        ),

        linear-gradient(
            120deg,
            #05152f 0%,
            #082658 50%,
            #073c8f 100%
        );
}


/* grid texture */

.iamaCheckoutDark26__heroGrid {

    position: absolute;

    inset: 0;

    opacity: .04;

    pointer-events: none;

    background-image:

        linear-gradient(
            rgba(255,255,255,.7) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.7) 1px,
            transparent 1px
        );

    background-size:
        55px 55px;
}


/* glow */

.iamaCheckoutDark26__heroGlow {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}


.iamaCheckoutDark26__heroGlow--1 {

    width: 500px;
    height: 500px;

    left: -250px;
    top: -280px;

    border:
        1px solid rgba(255,255,255,.06);

    box-shadow:

        0 0 0 70px
        rgba(255,255,255,.015),

        0 0 0 140px
        rgba(255,255,255,.008);
}


.iamaCheckoutDark26__heroGlow--2 {

    width: 430px;
    height: 430px;

    right: -190px;
    bottom: -280px;

    border:
        1px solid rgba(255,193,45,.10);

    box-shadow:

        0 0 0 65px
        rgba(255,193,45,.015),

        0 0 0 130px
        rgba(255,255,255,.008);
}


/* =========================================================
   HERO HEADING
========================================================= */

.iamaCheckoutDark26__heading {

    position: relative;

    z-index: 2;

    max-width: 850px;

    margin: 0 auto;

    text-align: center;
}


.iamaCheckoutDark26__eyebrow {

    display: inline-block;

    margin-bottom: 12px;

    color:
        var(--icd-yellow);

    font-size: 14px;

    line-height: 1;

    font-weight: 800;

    letter-spacing: 1.4px;
}


.iamaCheckoutDark26__heading h1 {

    margin: 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(48px, 5vw, 68px) !important;

    font-weight:
        700 !important;

    line-height:
        1.01 !important;

    letter-spacing:
        -1.1px !important;
}


.iamaCheckoutDark26__heading h1 span {

    color:
        var(--icd-yellow);

    font-weight:
        800;
}


.iamaCheckoutDark26__heading p {

    max-width: 760px;

    margin:
        19px auto 0 !important;

    color:
        rgba(255,255,255,.76) !important;

    font-size:
        18px !important;

    line-height:
        1.65 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   LIGHT CONTENT
========================================================= */

.iamaCheckoutDark26__content {

    position: relative;

    width: 100%;

    padding:
        65px 0 85px;

    background:

        radial-gradient(
            circle at 94% 0,
            rgba(21,87,190,.055),
            transparent 27%
        ),

        linear-gradient(
            180deg,
            #f4f7fb,
            #ffffff 520px,
            #f8fafc
        );
}


/* =========================================================
   MAIN GRID
========================================================= */

.iamaCheckoutDark26__grid {

    display: grid;

    grid-template-columns:
        minmax(0, 1.3fr)
        minmax(370px, .7fr);

    gap: 32px;

    align-items: start;
}


/* =========================================================
   LEFT
========================================================= */

.iamaCheckoutDark26__left {

    display: grid;

    gap: 25px;
}


/* =========================================================
   CARD
========================================================= */

.iamaCheckoutDark26__card {

    position: relative;

    overflow: hidden;

    border:
        1px solid var(--icd-border);

    border-radius: 24px;

    background:
        #fff;

    box-shadow:
        0 16px 46px
        rgba(18,47,92,.065);
}


.iamaCheckoutDark26__card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--icd-blue),
            var(--icd-yellow)
        );
}


/* =========================================================
   CARD HEAD
========================================================= */

.iamaCheckoutDark26__cardHead {

    min-height: 118px;

    padding:
        29px 31px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-bottom:
        1px solid #e9eef4;

    background:
        linear-gradient(
            180deg,
            #fff,
            #fbfcfe
        );
}


.iamaCheckoutDark26__cardHead > div > span {

    display: block;

    margin-bottom: 7px;

    color:
        var(--icd-blue);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.1px;
}


.iamaCheckoutDark26__cardHead h2 {

    margin: 0 !important;

    color:
        #102e63 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(27px, 2.5vw, 35px) !important;

    line-height:
        1.08 !important;

    font-weight:
        700 !important;
}


/* =========================================================
   VERIFIED
========================================================= */

.iamaCheckoutDark26__verified {

    min-height: 38px;

    padding:
        0 13px;

    flex:
        0 0 auto;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 50px;

    background:
        #e5f7ed;

    color:
        var(--icd-green);

    font-size: 17px;

    font-weight: 800;
}


/* =========================================================
   DETAILS
========================================================= */

.iamaCheckoutDark26__details {

    padding:
        29px 31px 32px;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0,1fr));

    gap: 14px;
}


.iamaCheckoutDark26__detail {

    min-height: 95px;

    padding:
        19px;

    border:
        1px solid #e3e9f1;

    border-radius: 14px;

    background:
        #f7f9fc;
}


.iamaCheckoutDark26__detail span {

    display: block;

    color:
        #8190a4;

    font-size: 14px;

    font-weight: 500;
}


.iamaCheckoutDark26__detail strong {

    display: block;

    margin-top: 8px;

    color:
        #253b59;

    font-size: 17px;

    line-height: 1.4;

    font-weight: 700;

    overflow-wrap: anywhere;
}


/* =========================================================
   COURSE HERO
========================================================= */

.iamaCheckoutDark26__courseHero {

    margin:
        29px 31px 0;

    padding:
        25px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border:
        1px solid #dce5f1;

    border-radius: 17px;

    background:
        linear-gradient(
            135deg,
            #eef4ff,
            #f9fbff
        );
}


.iamaCheckoutDark26__courseHero > div:first-child > span {

    display: block;

    color:
        #7e8ca1;

    font-size: 14px;

    font-weight: 600;
}


.iamaCheckoutDark26__courseHero h3 {
    font-family: "Outfit", sans-serif !important;

    margin:
        8px 0 0 !important;

    color:
        #10356f !important;

    font-size:
        clamp(24px,2.2vw,31px) !important;

    line-height:
        1.2 !important;

    font-weight:
        700 !important;
}


.iamaCheckoutDark26__courseHero p {

    margin:
        7px 0 0 !important;

    color:
        #7d8b9f !important;

    font-size:
        16px !important;

    font-weight:
        500 !important;
}


.iamaCheckoutDark26__planBadge {

    padding:
        8px 14px;

    flex:
        0 0 auto;

    border-radius:
        50px;

    background:
        #dce9ff;

    color:
        var(--icd-blue);

    font-size:
        17px;

    font-weight:
        800;
}


/* =========================================================
   COURSE STATS
========================================================= */

.iamaCheckoutDark26__courseStats {

    padding:
        16px 31px 32px;

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0,1fr));

    gap: 12px;
}


.iamaCheckoutDark26__courseStats > div {

    min-height: 102px;

    padding: 18px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border:
        1px solid #e2e8f0;

    border-radius: 14px;

    background:
        #fff;
}


.iamaCheckoutDark26__courseStats span {

    color:
        #8491a4;

    font-size: 13px;

    font-weight: 500;
}


.iamaCheckoutDark26__courseStats strong {

    display: block;

    margin-top: 8px;

    color:
        #19396d;

    font-size: 17px;

    line-height: 1.35;

    font-weight: 700;
}


/* =========================================================
   NOTICE
========================================================= */

.iamaCheckoutDark26__notice {

    padding:
        21px 23px;

    display: flex;

    align-items: flex-start;

    gap: 15px;

    border:
        1px solid #d7e3f2;

    border-radius: 17px;

    background:
        #f1f6fd;
}


.iamaCheckoutDark26__noticeIcon {

    width: 43px;
    height: 43px;

    flex:
        0 0 43px;

    display: grid;

    place-items: center;

    border-radius:
        50%;

    background:
        var(--icd-blue);

    color:
        #fff;

    font-size: 17px;

    font-weight: 800;
}


.iamaCheckoutDark26__notice strong {

    display: block;

    color:
        #1b3765;

    font-size: 22px;

    font-weight: 700;
}


.iamaCheckoutDark26__notice p {

    margin:
        5px 0 0 !important;

    color:
        #64758c !important;

    font-size:
        18px !important;

    line-height:
        1.55 !important;
}


/* =========================================================
   SUMMARY
========================================================= */

.iamaCheckoutDark26__summary {

    position: sticky;

    top: 30px;

    overflow: hidden;

    border-radius: 24px;

    background:
        linear-gradient(
            145deg,
            #061d4a,
            #073c91 58%,
            #0a54b7
        );

    color:
        #fff;

    box-shadow:
        0 26px 65px
        rgba(6,31,78,.22);
}


.iamaCheckoutDark26__summaryDecor {

    position: absolute;

    width: 300px;
    height: 300px;

    right: -125px;
    top: -180px;

    border-radius: 50%;

    border:
        1px solid rgba(255,255,255,.10);

    box-shadow:

        0 0 0 50px
        rgba(255,255,255,.02),

        0 0 0 100px
        rgba(255,255,255,.012);
}


/* =========================================================
   SUMMARY HEAD
========================================================= */

.iamaCheckoutDark26__summaryHead {

    position: relative;

    z-index: 2;

    padding:
        31px 29px 27px;

    border-bottom:
        1px solid rgba(255,255,255,.11);
}


.iamaCheckoutDark26__summaryHead > span {

    display: block;

    margin-bottom: 7px;

    color:
        var(--icd-yellow);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.1px;
}


.iamaCheckoutDark26__summaryHead h2 {

    margin: 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        33px !important;

    line-height:
        1.08 !important;

    font-weight:
        700 !important;
}


.iamaCheckoutDark26__summaryHead p {

    margin:
        10px 0 0 !important;

    color:
        rgba(255,255,255,.70) !important;

    font-size:
        17px !important;

    line-height:
        1.5 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   SUMMARY ROWS
========================================================= */

.iamaCheckoutDark26__summaryRows {

    position: relative;

    z-index: 2;

    padding:
        8px 29px;
}


.iamaCheckoutDark26__summaryRows > div {

    min-height: 65px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-bottom:
        1px solid rgba(255,255,255,.10);
}


.iamaCheckoutDark26__summaryRows > div:last-child {
    border-bottom: 0;
}


.iamaCheckoutDark26__summaryRows span {

    color:
        rgba(255,255,255,.67);

    font-size: 17px;

    font-weight: 500;
}


.iamaCheckoutDark26__summaryRows strong {

    color:
        #fff;

    font-size: 15px;

    font-weight: 700;

    text-align: right;
}


/* =========================================================
   AMOUNT
========================================================= */

.iamaCheckoutDark26__amount {

    position: relative;

    z-index: 2;

    margin:
        13px 20px 0;

    padding:
        22px 20px;

    border:
        1px solid rgba(255,255,255,.08);

    border-radius: 16px;

    background:
        rgba(255,255,255,.09);
}


.iamaCheckoutDark26__amount span {

    display: block;

    color:
        rgba(255,255,255,.67);

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 1px;
}


.iamaCheckoutDark26__amount strong {

    display: block;

    margin-top: 8px;

    color:
        var(--icd-yellow);

    font-size:
        clamp(36px,3.5vw,49px);

    line-height: 1;

    font-weight: 800;

    letter-spacing: -.9px;
}


/* =========================================================
   PAY BUTTON
========================================================= */

.iamaCheckoutDark26__payBtn {

    position: relative;

    z-index: 2;

    min-height: 62px;

    margin:
        18px 20px 0;

    padding:
        0 22px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    border-radius: 13px;

    background:
        linear-gradient(
            120deg,
            #ffd052,
            #e5a41d
        );

    color:
        #081d44;

    font-size: 16px;

    font-weight: 800;

    text-decoration: none;

    box-shadow:
        0 13px 30px
        rgba(0,0,0,.16);

    transition:
        .22s ease;
}


.iamaCheckoutDark26__payBtn svg {

    width: 18px;

    height: 18px;

    fill:
        #081d44;

    transition:
        transform .22s ease;
}


.iamaCheckoutDark26__payBtn:hover {

    transform:
        translateY(-2px);

    background:
        linear-gradient(
            120deg,
            #ffda72,
            #efb128
        );
}


.iamaCheckoutDark26__payBtn:hover svg {

    transform:
        translateX(4px);
}


/* =========================================================
   SECURE
========================================================= */

.iamaCheckoutDark26__secure {

    position: relative;

    z-index: 2;

    padding:
        22px 28px 27px;

    text-align: center;
}


.iamaCheckoutDark26__secure strong {

    display: block;

    color:
        #fff;

    font-size: 17px;

    font-weight: 700;
}


.iamaCheckoutDark26__secure p {

    margin:
        5px 0 0 !important;

    color:
        rgba(255,255,255,.57) !important;

    font-size:
        17px !important;

    line-height:
        1.45 !important;
}


/* =========================================================
   BACK
========================================================= */

.iamaCheckoutDark26__back {

    margin-top: 34px;

    text-align: center;
}


.iamaCheckoutDark26__back a {

    color:
        var(--icd-blue);

    font-size: 15px;

    font-weight: 700;

    text-decoration: none;
}


.iamaCheckoutDark26__back a:hover {

    text-decoration: underline;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaCheckoutDark26__hero {

        min-height: 320px;

        padding:
            65px 0 75px;
    }


    .iamaCheckoutDark26__content {

        padding:
            50px 0 65px;
    }


    .iamaCheckoutDark26__grid {

        grid-template-columns:
            1fr;
    }


    .iamaCheckoutDark26__summary {

        position: relative;

        top: auto;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaCheckoutDark26__hero {

        min-height: auto;

        padding:
            50px 0 58px;
    }


    .iamaCheckoutDark26__eyebrow {

        font-size: 10px;
    }


    .iamaCheckoutDark26__heading h1 {

        font-size:
            38px !important;
    }


    .iamaCheckoutDark26__heading p {

        margin-top:
            14px !important;

        font-size:
            16px !important;

        line-height:
            1.55 !important;
    }


    .iamaCheckoutDark26__content {

        padding:
            32px 0 48px;
    }


    .iamaCheckoutDark26__left {

        gap: 18px;
    }


    .iamaCheckoutDark26__card {

        border-radius: 18px;
    }


    .iamaCheckoutDark26__cardHead {

        min-height: auto;

        padding:
            21px 18px;

        align-items: flex-start;
    }


    .iamaCheckoutDark26__cardHead h2 {

        font-size:
            24px !important;
    }


    .iamaCheckoutDark26__verified {

        min-height: 34px;

        font-size: 10px;
    }


    .iamaCheckoutDark26__details {

        padding: 18px;

        grid-template-columns:
            1fr;

        gap: 8px;
    }


    .iamaCheckoutDark26__detail {

        min-height: 80px;

        padding: 15px;
    }


    .iamaCheckoutDark26__detail span {

        font-size: 12px;
    }


    .iamaCheckoutDark26__detail strong {

        font-size: 15px;
    }


    .iamaCheckoutDark26__courseHero {

        margin:
            18px 18px 0;

        padding: 18px;

        flex-direction: column;

        align-items: flex-start;
    }


    .iamaCheckoutDark26__courseHero h3 {

        font-size:
            22px !important;
    }


    .iamaCheckoutDark26__courseHero p {

        font-size:
            14px !important;
    }


    .iamaCheckoutDark26__courseStats {

        padding:
            10px 18px 20px;

        grid-template-columns:
            1fr;

        gap: 8px;
    }


    .iamaCheckoutDark26__courseStats > div {

        min-height: 78px;
    }


    .iamaCheckoutDark26__notice {

        padding: 17px;
    }


    .iamaCheckoutDark26__notice p {

        font-size:
            14px !important;
    }


    .iamaCheckoutDark26__summary {

        border-radius: 19px;
    }


    .iamaCheckoutDark26__summaryHead {

        padding:
            23px 20px 21px;
    }


    .iamaCheckoutDark26__summaryHead h2 {

        font-size:
            27px !important;
    }


    .iamaCheckoutDark26__summaryRows {

        padding:
            5px 20px;
    }


    .iamaCheckoutDark26__summaryRows > div {

        min-height: 59px;
    }


    .iamaCheckoutDark26__summaryRows span {

        font-size: 12px;
    }


    .iamaCheckoutDark26__summaryRows strong {

        font-size: 13px;
    }


    .iamaCheckoutDark26__amount {

        margin:
            12px 15px 0;

        padding: 18px;
    }


    .iamaCheckoutDark26__amount strong {

        font-size: 38px;
    }


    .iamaCheckoutDark26__payBtn {

        min-height: 56px;

        margin:
            15px 15px 0;

        font-size: 14px;
    }

}


@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA PAYMENT SUCCESS 2026
========================================================= */

.iamaSuccess26,
.iamaSuccess26 *,
.iamaSuccess26 *::before,
.iamaSuccess26 *::after {
    box-sizing: border-box;
}


.iamaSuccess26 {

    --is-blue: #073b91;
    --is-blue2: #0b58be;
    --is-dark: #061831;
    --is-dark2: #082654;

    --is-yellow: #ffc12d;

    --is-green: #149154;
    --is-green2: #18a863;

    --is-text: #102c5b;
    --is-body: #53637c;
    --is-muted: #8190a5;

    --is-border: #dfe6ef;
    --is-soft: #f5f8fc;

    position: relative;

    width: 100%;

    font-family:
        "Outfit",
        sans-serif;

    color:
        var(--is-text);
}


/* =========================================================
   HERO
========================================================= */

.iamaSuccess26__hero {

    position: relative;

    width: 100%;

    min-height: 400px;

padding: 180px 40px 80px;

    overflow: hidden;

    display: flex;

    align-items: center;

    background:

        radial-gradient(
            circle at 15% 20%,
            rgba(31,111,235,.25),
            transparent 31%
        ),

        radial-gradient(
            circle at 85% 15%,
            rgba(24,153,89,.16),
            transparent 26%
        ),

        linear-gradient(
            120deg,
            #05152f 0%,
            #082759 52%,
            #073b8c 100%
        );
}


/* GRID */

.iamaSuccess26__heroGrid {

    position: absolute;

    inset: 0;

    opacity: .04;

    pointer-events: none;

    background-image:

        linear-gradient(
            rgba(255,255,255,.7) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.7) 1px,
            transparent 1px
        );

    background-size:
        55px 55px;
}


/* GLOW */

.iamaSuccess26__heroGlow {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}


.iamaSuccess26__heroGlow--1 {

    width: 520px;
    height: 520px;

    top: -310px;
    left: -250px;

    border:
        1px solid rgba(255,255,255,.06);

    box-shadow:

        0 0 0 70px
        rgba(255,255,255,.014),

        0 0 0 140px
        rgba(255,255,255,.008);
}


.iamaSuccess26__heroGlow--2 {

    width: 460px;
    height: 460px;

    right: -200px;
    bottom: -290px;

    border:
        1px solid rgba(34,194,105,.11);

    box-shadow:

        0 0 0 65px
        rgba(34,194,105,.015),

        0 0 0 125px
        rgba(255,255,255,.008);
}


/* =========================================================
   HERO INNER
========================================================= */

.iamaSuccess26__heroInner {

    position: relative;

    z-index: 2;

    max-width: 880px;

    margin: 0 auto;

    text-align: center;
}


/* BIG TICK */

.iamaSuccess26__successIcon {

    width: 92px;
    height: 92px;

    margin:
        0 auto 23px;

    display: grid;

    place-items: center;

    border:
        1px solid rgba(255,255,255,.18);

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #14a65e,
            #087d45
        );

    box-shadow:

        0 18px 45px
        rgba(10,151,80,.25),

        0 0 0 13px
        rgba(40,200,111,.07);
}


.iamaSuccess26__successIcon svg {

    width: 46px;
    height: 46px;

    fill: #fff;
}


/* EYEBROW */

.iamaSuccess26__eyebrow {

    display: block;

    margin-bottom: 10px;

    color:
        #58e49a;

    font-size: 14px;

    line-height: 1;

    font-weight: 800;

    letter-spacing: 1.4px;
}


/* TITLE */

.iamaSuccess26__heroInner h1 {

    margin: 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(48px,5.2vw,70px) !important;

    line-height:
        1.01 !important;

    letter-spacing:
        -1.1px !important;

    font-weight:
        700 !important;
}


.iamaSuccess26__heroInner h1 span {

    color:
        #55e197;

    font-weight:
        800;
}


.iamaSuccess26__heroInner p {

    max-width: 760px;

    margin:
        18px auto 0 !important;

    color:
        rgba(255,255,255,.78) !important;

    font-size:
        18px !important;

    line-height:
        1.65 !important;

    font-weight:
        500 !important;
}


.iamaSuccess26__heroLine {

    width: fit-content;

    margin:
        22px auto 0;

    padding:
        9px 15px;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        50px;

    background:
        rgba(255,255,255,.07);

    color:
        #fff;

    font-size:
        18px;

    font-weight:
        700;
}


/* =========================================================
   CONTENT
========================================================= */

.iamaSuccess26__content {

    padding:
        58px 0 85px;

    background:

        radial-gradient(
            circle at 94% 0,
            rgba(19,85,190,.055),
            transparent 28%
        ),

        linear-gradient(
            180deg,
            #f3f7fc,
            #fff 650px,
            #f8fafc
        );
}


/* =========================================================
   PAYMENT REFERENCE
========================================================= */

.iamaSuccess26__reference {

    width: 100%;

    padding: 13px;

    display: grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap: 10px;

    border:
        1px solid var(--is-border);

    border-radius: 20px;

    background: #fff;

    box-shadow:
        0 14px 38px
        rgba(21,47,91,.065);
}


.iamaSuccess26__reference > div {

    min-height: 92px;

    padding:
        17px 19px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border-radius: 14px;

    background:
        #f5f8fc;
}


.iamaSuccess26__reference span {

    color:
        var(--is-muted);

    font-size: 17px;

    font-weight: 500;
}


.iamaSuccess26__reference strong {

    display: block;

    margin-top: 6px;

    color:
        #19386a;

    font-size: 19px;

    line-height: 1.35;

    font-weight: 700;

    overflow-wrap: anywhere;
}


.iamaSuccess26__paidStatus {

    width: fit-content;

    padding:
        5px 11px;

    border-radius:
        50px;

    background:
        #e3f8ec;

    color:
        var(--is-green) !important;

    font-size:
        19px !important;
}


/* =========================================================
   MAIN GRID
========================================================= */

.iamaSuccess26__mainGrid {

    margin-top: 28px;

    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 26px;
}


/* =========================================================
   CARD
========================================================= */

.iamaSuccess26__card {

    position: relative;

    overflow: hidden;

    border:
        1px solid var(--is-border);

    border-radius: 23px;

    background: #fff;

    box-shadow:
        0 15px 42px
        rgba(21,47,91,.065);
}


.iamaSuccess26__card::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--is-blue),
            #42be7c
        );
}


/* =========================================================
   CARD HEAD
========================================================= */

.iamaSuccess26__cardHead {

    min-height: 112px;

    padding:
        27px 29px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-bottom:
        1px solid #e9edf3;
}


.iamaSuccess26__cardHead span {

    display: block;

    margin-bottom: 7px;

    color:
        var(--is-blue);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.05px;
}


.iamaSuccess26__cardHead h2 {

    margin: 0 !important;

    color:
        #102e63 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(27px,2.5vw,34px) !important;

    line-height:
        1.08 !important;

    font-weight:
        700 !important;
}


/* VERIFIED */

.iamaSuccess26__verified {

    min-height: 37px;

    padding:
        0 12px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    flex:
        0 0 auto;

    border-radius:
        50px;

    background:
        #e5f8ed;

    color:
        var(--is-green);

    font-size: 19px;

    font-weight: 800;
}


/* =========================================================
   DETAILS
========================================================= */

.iamaSuccess26__detailsGrid {

    padding:
        27px 29px 30px;

    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 12px;
}


.iamaSuccess26__detail {

    min-height: 90px;

    padding:
        17px 18px;

    border:
        1px solid #e3e9f1;

    border-radius: 14px;

    background:
        #f8fafc;
}


.iamaSuccess26__detail span {

    display: block;

    color:
        #000;

    font-size: 16px;

    font-weight: 500;
}


.iamaSuccess26__detail strong {

    display: block;

    margin-top: 7px;

    color:
        #263a58;

    font-size: 19px;

    line-height: 1.4;

    font-weight: 700;

    overflow-wrap: anywhere;
}


/* =========================================================
   COURSE
========================================================= */

.iamaSuccess26__courseBox {

    margin:
        27px 29px 0;

    padding:
        23px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border:
        1px solid #dce6f2;

    border-radius: 17px;

    background:
        linear-gradient(
            135deg,
            #eef5ff,
            #f9fbff
        );
}


.iamaSuccess26__courseBox span {

    display: block;

    color:
        #7f8da1;

    font-size: 16px;

    font-weight: 600;
}


.iamaSuccess26__courseBox h3 {
    font-family: "Outfit", sans-serif !important;

    margin:
        8px 0 0 !important;

    color:
        #10366f !important;

    font-size:
        25px !important;

    line-height:
        1.2 !important;

    font-weight:
        700 !important;
}


.iamaSuccess26__courseBox p {

    margin:
        6px 0 0 !important;

    color:
        #7d8b9f !important;

    font-size:
        15px !important;

    font-weight:
        500 !important;
}


.iamaSuccess26__courseBadge {

    padding:
        8px 13px;

    flex:
        0 0 auto;

    border-radius:
        50px;

    background:
        #e2f6ea;

    color:
        var(--is-green);

    font-size:
        19px;

    font-weight:
        800;
}


/* META */

.iamaSuccess26__courseMeta {

    padding:
        14px 29px 30px;

    display: grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap: 10px;
}


.iamaSuccess26__courseMeta > div {

    min-height: 92px;

    padding:
        16px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border:
        1px solid #e3e9f1;

    border-radius: 13px;

    background: #fff;
}


.iamaSuccess26__courseMeta span {

    color:
        #8491a4;

    font-size: 12px;

    font-weight: 500;
}


.iamaSuccess26__courseMeta strong {

    margin-top: 7px;

    color:
        #18396d;

    font-size: 19px;

    line-height: 1.35;

    font-weight: 700;
}


/* =========================================================
   SECTION TITLE
========================================================= */

.iamaSuccess26__sectionTitle {

    margin:
        52px 0 23px;

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 30px;
}


.iamaSuccess26__sectionTitle span {

    display: block;

    margin-bottom: 7px;

    color:
        var(--is-blue);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.1px;
}


.iamaSuccess26__sectionTitle h2 {

    margin: 0 !important;

    color:
        #102e63 !important;

    font-size:
        clamp(31px,3vw,41px) !important;

    line-height:
        1.05 !important;

    font-weight:
        700 !important;
}


.iamaSuccess26__sectionTitle p {

    margin: 0 !important;

    color:
        #6d7b90 !important;

    font-size:
        16px !important;

    line-height:
        1.5 !important;
}


/* =========================================================
   PAYMENT BLOCK
========================================================= */

.iamaSuccess26__paymentBlock {

    position: relative;

    margin-bottom: 26px;

    padding: 30px;

    border:
        1px solid var(--is-border);

    border-radius: 24px;

    background: #fff;

    box-shadow:
        0 15px 42px
        rgba(21,47,91,.06);
}


.iamaSuccess26__paymentLabel {

    width: fit-content;

    margin-bottom: 19px;

    padding:
        7px 12px;

    border-radius:
        50px;

    background:
        #eaf1fc;

    color:
        var(--is-blue);

    font-size: 11px;

    font-weight: 800;

    letter-spacing: .8px;
}


/* PAYMENT GRID */

.iamaSuccess26__paymentGrid {

    display: grid;

    grid-template-columns:
        minmax(0,1.05fr)
        minmax(0,.95fr);

    gap: 20px;
}


.iamaSuccess26__paymentGrid--single {

    grid-template-columns:
        1fr;
}


/* =========================================================
   MAIN PAYMENT PANEL
========================================================= */

.iamaSuccess26__paymentMain {

    padding: 25px;

    border:
        1px solid #dfe7f0;

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #f8fafc,
            #f2f6fb
        );
}


.iamaSuccess26__paymentMainTop {

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    gap: 20px;
}


.iamaSuccess26__paymentMainTop > div:first-child > span {

    display: block;

    color:
        #8794a7;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: .9px;
}


.iamaSuccess26__paymentMainTop h3 {
    font-family: "Outfit", sans-serif !important;

    margin:
        7px 0 0 !important;

    color:
        #123363 !important;

    font-size:
        28px !important;

    line-height:
        1.1 !important;

    font-weight:
        700 !important;
}


.iamaSuccess26__paymentMainTop p {

    max-width: 520px;

    margin:
        8px 0 0 !important;

    color:
        #68778d !important;

    font-size:
        15px !important;

    line-height:
        1.5 !important;
}


.iamaSuccess26__completeMark {

    width: 48px;
    height: 48px;

    flex:
        0 0 48px;

    display: grid;

    place-items: center;

    border-radius: 13px;

    background:
        #e3f8ec;

    color:
        var(--is-green);

    font-size: 18px;

    font-weight: 800;
}


/* STATS */

.iamaSuccess26__paymentStats {

    margin-top: 23px;

    display: grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap: 10px;
}


.iamaSuccess26__paymentStats > div {

    min-height: 94px;

    padding: 16px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border:
        1px solid #e1e7ef;

    border-radius: 13px;

    background: #fff;
}


.iamaSuccess26__paymentStats span {

    color:
        #8390a3;

    font-size: 18px;

    font-weight: 500;
}


.iamaSuccess26__paymentStats strong {

    margin-top: 7px;

    color:
        #18386b;

    font-size: 18px;

    font-weight: 700;
}


.iamaSuccess26__greenText {

    color:
        var(--is-green) !important;
}


/* COMPLETE NOTICE */

.iamaSuccess26__completeNotice {

    margin-top: 12px;

    padding: 16px;

    display: flex;

    align-items: center;

    gap: 13px;

    border:
        1px solid #c8e8d5;

    border-radius: 14px;

    background:
        #effaf3;
}


.iamaSuccess26__miniTick {

    width: 38px;
    height: 38px;

    flex:
        0 0 38px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background:
        var(--is-green);

    color: #fff;

    font-size: 14px;

    font-weight: 800;
}


.iamaSuccess26__completeNotice strong {

    display: block;

    color:
        #17623b;

    font-size: 21px;

    font-weight: 700;
}


.iamaSuccess26__completeNotice p {

    margin:
        3px 0 0 !important;

    color:
        #607b69 !important;

    font-size:
        18px !important;

    line-height:
        1.45 !important;
}


/* =========================================================
   INSTALLMENT SCHEDULE
========================================================= */

.iamaSuccess26__schedule {

    padding: 25px;

    border:
        1px solid #dfe7f0;

    border-radius: 18px;

    background:
        #fff;
}


.iamaSuccess26__scheduleHead {

    margin-bottom: 18px;
}


.iamaSuccess26__scheduleHead span {

    display: block;

    color:
        var(--is-blue);

    font-size: 11px;

    font-weight: 800;

    letter-spacing: .9px;
}


.iamaSuccess26__scheduleHead h3 {

    font-family: "Outfit", sans-serif !important;
    margin:
        6px 0 0 !important;

    color:
        #123363 !important;

    font-size:
        25px !important;

    line-height:
        1.1 !important;

    font-weight:
        700 !important;
}


.iamaSuccess26__installment {

    min-height: 79px;

    padding:
        13px 14px;

    display: flex;

    align-items: center;

    gap: 13px;

    border:
        1px solid #e1e7ef;

    border-radius: 13px;

    background:
        #f8fafc;
}


.iamaSuccess26__installment + .iamaSuccess26__installment {

    margin-top: 9px;
}


.iamaSuccess26__installment.is-paid {

    border-color:
        #cce8d7;

    background:
        #f1faf5;
}


.iamaSuccess26__installmentNo {

    width: 39px;
    height: 39px;

    flex:
        0 0 39px;

    display: grid;

    place-items: center;

    border-radius: 11px;

    background:
        #e7eef9;

    color:
        var(--is-blue);

    font-size: 11px;

    font-weight: 800;
}


.iamaSuccess26__installmentInfo {

    flex: 1;
}


.iamaSuccess26__installmentInfo span {

    display: block;

    color:
        #718098;

    font-size: 12px;

    font-weight: 500;
}


.iamaSuccess26__installmentInfo strong {

    display: block;

    margin-top: 4px;

    color:
        #17396d;

    font-size: 16px;

    font-weight: 700;
}


.iamaSuccess26__installmentStatus {

    padding:
        6px 10px;

    border-radius:
        50px;

    background:
        #e0f7e9;

    color:
        var(--is-green);

    font-size: 17px;

    font-weight: 800;
}


.iamaSuccess26__installmentStatus--pending {

    background:
        #fff2c9;

    color:
        #836006;
}


/* TOTAL */

.iamaSuccess26__scheduleTotal {

    margin-top: 13px;

    padding:
        17px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-radius: 13px;

    background:
        linear-gradient(
            120deg,
            #082d6d,
            #0a4fae
        );
}


.iamaSuccess26__scheduleTotal span {

    color:
        rgba(255,255,255,.68);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .8px;
}


.iamaSuccess26__scheduleTotal strong {

    color:
        var(--is-yellow);

    font-size: 23px;

    font-weight: 800;
}


/* =========================================================
   THANK YOU
========================================================= */

.iamaSuccess26__thankyou {

    margin-top: 40px;

    padding:
        32px;

    display: flex;

    align-items: center;

    gap: 22px;

    border:
        1px solid rgba(255,255,255,.10);

    border-radius: 24px;

    background:

        radial-gradient(
            circle at 95% 0,
            rgba(37,159,91,.14),
            transparent 30%
        ),

        linear-gradient(
            120deg,
            #071d47,
            #073a89
        );

    box-shadow:
        0 18px 50px
        rgba(9,39,94,.16);
}


.iamaSuccess26__thankIcon {

    width: 68px;
    height: 68px;

    flex:
        0 0 68px;

    display: grid;

    place-items: center;

    border-radius: 18px;

    background:
        #17a15b;

    color:
        #fff;

    font-size: 25px;

    font-weight: 800;
}


.iamaSuccess26__thankyou > div:nth-child(2) {

    flex: 1;
}


.iamaSuccess26__thankyou span {

    display: block;

    color:
        #55df96;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 1px;
}


.iamaSuccess26__thankyou h2 {

    margin:
        7px 0 0 !important;

    color:
        #fff !important;

    font-size:
        clamp(26px,2.8vw,36px) !important;

    line-height:
        1.1 !important;

    font-weight:
        700 !important;
}


.iamaSuccess26__thankyou p {

    max-width: 680px;

    margin:
        8px 0 0 !important;

    color:
        rgba(255,255,255,.72) !important;

    font-size:
        15px !important;

    line-height:
        1.55 !important;
}


/* BUTTON */

.iamaSuccess26__accountBtn {

    min-height: 54px;

    padding:
        0 20px;

    flex:
        0 0 auto;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    border-radius: 12px;

    background:
        linear-gradient(
            120deg,
            #ffd052,
            #e7a51d
        );

    color:
        #091f49;

    font-size: 14px;

    font-weight: 800;

    text-decoration: none;

    box-shadow:
        0 11px 25px
        rgba(0,0,0,.16);

    transition:
        .22s ease;
}


.iamaSuccess26__accountBtn svg {

    width: 17px;
    height: 17px;

    fill:
        #091f49;

    transition:
        transform .22s ease;
}


.iamaSuccess26__accountBtn:hover {

    transform:
        translateY(-2px);
}


.iamaSuccess26__accountBtn:hover svg {

    transform:
        translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaSuccess26__hero {

        min-height: 360px;

        padding:
            60px 0 70px;
    }


    .iamaSuccess26__reference {

        grid-template-columns:
            1fr 1fr;
    }


    .iamaSuccess26__reference > div:last-child {

        grid-column:
            1 / -1;
    }


    .iamaSuccess26__mainGrid {

        grid-template-columns:
            1fr;
    }


    .iamaSuccess26__paymentGrid {

        grid-template-columns:
            1fr;
    }


    .iamaSuccess26__thankyou {

        align-items:
            flex-start;

        flex-wrap:
            wrap;
    }


    .iamaSuccess26__accountBtn {

        margin-left:
            90px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaSuccess26__hero {

        min-height: auto;

        padding:
            48px 0 55px;
    }


    .iamaSuccess26__successIcon {

        width: 74px;
        height: 74px;

        margin-bottom: 19px;
    }


    .iamaSuccess26__successIcon svg {

        width: 36px;
        height: 36px;
    }


    .iamaSuccess26__eyebrow {

        font-size: 10px;
    }


    .iamaSuccess26__heroInner h1 {

        font-size:
            38px !important;
    }


    .iamaSuccess26__heroInner p {

        margin-top:
            14px !important;

        font-size:
            16px !important;

        line-height:
            1.55 !important;
    }


    .iamaSuccess26__heroLine {

        font-size: 12px;
    }


    .iamaSuccess26__content {

        padding:
            32px 0 48px;
    }


    .iamaSuccess26__reference {

        padding: 8px;

        grid-template-columns:
            1fr;

        gap: 7px;

        border-radius: 15px;
    }


    .iamaSuccess26__reference > div:last-child {

        grid-column:
            auto;
    }


    .iamaSuccess26__reference > div {

        min-height: 78px;

        padding: 14px;

        border-radius: 11px;
    }


    .iamaSuccess26__mainGrid {

        margin-top: 18px;

        gap: 18px;
    }


    .iamaSuccess26__card {

        border-radius: 18px;
    }


    .iamaSuccess26__cardHead {

        min-height: auto;

        padding:
            21px 18px;

        align-items:
            flex-start;
    }


    .iamaSuccess26__cardHead h2 {

        font-size:
            24px !important;
    }


    .iamaSuccess26__verified {

        min-height: 33px;

        font-size: 9px;
    }


    .iamaSuccess26__detailsGrid {

        padding: 18px;

        grid-template-columns:
            1fr;

        gap: 8px;
    }


    .iamaSuccess26__detail {

        min-height: 77px;

        padding: 14px;
    }


    .iamaSuccess26__courseBox {

        margin:
            18px 18px 0;

        padding: 18px;

        flex-direction: column;

        align-items: flex-start;
    }


    .iamaSuccess26__courseBox h3 {

        font-size:
            21px !important;
    }


    .iamaSuccess26__courseMeta {

        padding:
            10px 18px 20px;

        grid-template-columns:
            1fr;

        gap: 8px;
    }


    .iamaSuccess26__courseMeta > div {

        min-height: 76px;
    }


    .iamaSuccess26__sectionTitle {

        margin:
            34px 0 17px;

        display: block;
    }


    .iamaSuccess26__sectionTitle h2 {

        font-size:
            28px !important;
    }


    .iamaSuccess26__sectionTitle p {

        margin-top:
            9px !important;

        font-size:
            14px !important;
    }


    .iamaSuccess26__paymentBlock {

        padding: 18px;

        border-radius: 18px;
    }


    .iamaSuccess26__paymentMain,
    .iamaSuccess26__schedule {

        padding: 18px;

        border-radius: 15px;
    }


    .iamaSuccess26__paymentMainTop h3 {

        font-size:
            23px !important;
    }


    .iamaSuccess26__paymentStats {

        grid-template-columns:
            1fr;

        gap: 8px;
    }


    .iamaSuccess26__paymentStats > div {

        min-height: 76px;
    }


    .iamaSuccess26__scheduleHead h3 {

        font-size:
            22px !important;
    }


    .iamaSuccess26__installment {

        align-items:
            flex-start;

        flex-wrap:
            wrap;
    }


    .iamaSuccess26__installmentStatus {

        margin-left:
            52px;
    }


    .iamaSuccess26__thankyou {

        margin-top: 28px;

        padding: 21px 18px;

        display: block;

        border-radius: 18px;
    }


    .iamaSuccess26__thankIcon {

        width: 52px;
        height: 52px;

        margin-bottom: 16px;

        border-radius: 13px;

        font-size: 20px;
    }


    .iamaSuccess26__thankyou h2 {

        font-size:
            25px !important;
    }


    .iamaSuccess26__thankyou p {

        font-size:
            14px !important;
    }


    .iamaSuccess26__accountBtn {

        width: 100%;

        min-height: 52px;

        margin:
            18px 0 0;

        font-size: 13px;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA SPLIT LOGIN
========================================================= */

.iamaSplitLogin,
.iamaSplitLogin *,
.iamaSplitLogin *::before,
.iamaSplitLogin *::after {
    box-sizing: border-box;
}


.iamaSplitLogin {

    --isl-blue: #0a49a9;
    --isl-blue2: #0d66d4;
    --isl-dark: #061831;
    --isl-yellow: #ffc12d;

    position: relative;

    width: 100%;
    min-height: 100vh;

    padding: 200px 0 70px 0;

    overflow: hidden;

    display: flex;
    align-items: center;

    font-family: "Outfit", sans-serif;

    background:
        radial-gradient(
            circle at 12% 18%,
            rgba(44,126,245,.23),
            transparent 28%
        ),
        radial-gradient(
            circle at 90% 85%,
            rgba(4,24,65,.28),
            transparent 31%
        ),
        linear-gradient(
            120deg,
            #06172f 0%,
            #092e6a 50%,
            #0a56b9 100%
        );
}


/* =========================================================
   BG GLOW
========================================================= */

.iamaSplitLogin__glow {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}


.iamaSplitLogin__glow--1 {

    width: 400px;
    height: 400px;

    top: -150px;
    left: -140px;

    background:
        rgba(47,136,255,.10);
}


.iamaSplitLogin__glow--2 {

    width: 420px;
    height: 420px;

    right: -160px;
    bottom: -160px;

    background:
        rgba(0,18,50,.30);
}


/* =========================================================
   MAIN SHELL
========================================================= */

.iamaSplitLogin__shell {

    position: relative;

    z-index: 2;

    width: 100%;

    min-height: 620px;

    display: grid;

     grid-template-columns:
        minmax(0, 0.95fr)
        minmax(460px, 540px);
    overflow: hidden;

    border-radius: 30px;

    background:
        #fff;

    box-shadow:
        0 34px 80px
        rgba(0,0,0,.21);
}


/* =========================================================
   VISUAL
========================================================= */

.iamaSplitLogin__visual {

    position: relative;

    min-height: 620px;

    overflow: hidden;

    background:
        #0a469f;
}


.iamaSplitLogin__image {

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


.iamaSplitLogin__overlay {

    position: absolute;

    inset: 0;

   background: linear-gradient( 135deg, rgba(5,20,53,.70) 0%, rgba(7,57,130,.87) 95%, rgba(7,82,176,.67) 100% );
}


/* =========================================================
   VISUAL CONTENT
========================================================= */

.iamaSplitLogin__visualContent {

    position: relative;

    z-index: 2;

    height: 100%;

    padding:
        60px 56px;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;
}


.iamaSplitLogin__tag {

    width: fit-content;

    min-height: 34px;

    padding:
        0 14px;

    display: inline-flex;

    align-items: center;

    border:
        1px solid rgba(255,255,255,.16);

    border-radius: 50px;

    background:
        rgba(255,255,255,.08);

    color:
        #edf4ff;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1px;
}


.iamaSplitLogin__visualContent h1 {

    max-width: 560px;

    margin:
        18px 0 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(30px, 4vw, 48px) !important;

    line-height:
        1.02 !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.6px !important;
}


.iamaSplitLogin__visualContent h1 span {

    display: block;

    color:
        var(--isl-yellow);

    font-weight:
        800;
}


.iamaSplitLogin__visualContent p {

    max-width:
        540px;

    margin:
        18px 0 0 !important;

    color:
        rgba(255,255,255,.82) !important;

    font-size:
        18px !important;

    line-height:
        1.65 !important;

    font-weight:
        500 !important;
}


.iamaSplitLogin__line {

    width: fit-content;

    margin-top:
        24px;

    padding:
        9px 15px;

    border:
        1px solid rgba(255,255,255,.14);

    border-radius:
        50px;

    background:
        rgba(255,255,255,.08);

    color:
        #fff;

    font-size:
        14px;

    font-weight:
        700;
}


/* =========================================================
   FORM PANEL
========================================================= */

.iamaSplitLogin__panel {

   padding: 55px 10px 55px 50px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    background:
        linear-gradient(
            180deg,
            #fff 0%,
            #f8fbff 100%
        );
}


.iamaSplitLogin__smallTitle {

    display: block;

    margin-bottom:
        8px;

    color:
        var(--isl-blue);

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        1.05px;
}


.iamaSplitLogin__head h2 {

    margin:
        0 !important;

    color:
        #102d61 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(30px, 2.7vw, 38px) !important;

    line-height:
        1.03 !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.45px !important;
}


.iamaSplitLogin__head h2 span {

    color:
        var(--isl-blue);

    font-weight:
        800;
}


.iamaSplitLogin__head p {

    margin:
        10px 0 0 !important;

    color:
        #718098 !important;

    font-size:
        14px !important;

    line-height:
        1.5 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   FORM
========================================================= */

.iamaSplitLogin__form {

    margin-top:
        27px;
}


.iamaSplitLogin__field +
.iamaSplitLogin__field {

    margin-top:
        19px;
}


.iamaSplitLogin__field > label,
.iamaSplitLogin__fieldTop label {

    color:
        #243a60;

    font-size:
        14px;

    font-weight:
        700;
}


.iamaSplitLogin__field > label {

    display: block;

    margin-bottom:
        8px;
}


.iamaSplitLogin__fieldTop {

    margin-bottom:
        8px;

    display: flex;

    align-items: center;

    justify-content:
        space-between;

    gap:
        15px;
}


.iamaSplitLogin__fieldTop a {

    color:
        var(--isl-blue);

    font-size:
        16px;

    font-weight:
        700;

    text-decoration:
        none;
}


.iamaSplitLogin__fieldTop a:hover {

    text-decoration:
        underline;
}


/* =========================================================
   INPUT
========================================================= */

.iamaSplitLogin__inputWrap {

    position: relative;
}


.iamaSplitLogin__inputWrap input {

    width:
        100%;

    height:
        56px;

    padding:
        0 48px 0 46px;

    border:
        1px solid #dce5ef;

    border-radius:
        12px;

    outline:
        none;

    background:
        #f5f8fc;

    color:
        #243a59;

    font-family:
        "Outfit",
        sans-serif;

    font-size:
        14px;

    font-weight:
        600;

    transition:
        .2s ease;
}


.iamaSplitLogin__inputWrap input::placeholder {

    color:
        #9ba7b8;
}


.iamaSplitLogin__inputWrap input:focus {

    background:
        #fff;

    border-color:
        rgba(10,73,169,.52);

    box-shadow:
        0 0 0 4px
        rgba(10,73,169,.07);
}


/* ICON */

.iamaSplitLogin__icon {

    position: absolute;

    z-index: 2;

    left:
        15px;

    top:
        50%;

    transform:
        translateY(-50%);

    width:
        20px;

    height:
        20px;

    display:
        grid;

    place-items:
        center;
}


.iamaSplitLogin__icon svg {

    width:
        16px;

    height:
        16px;

    fill:
        #7790b3;
}


/* =========================================================
   EYE
========================================================= */

.iamaSplitLogin__eye {

    position: absolute;

    right:
        10px;

    top:
        50%;

    transform:
        translateY(-50%);

    width:
        34px;

    height:
        34px;

    padding:
        0;

    display:
        grid;

    place-items:
        center;

    border:
        0;

    border-radius:
        8px;

    background:
        transparent;

    cursor:
        pointer;
}


.iamaSplitLogin__eye:hover {

    background:
        #eaf0f8;
}


.iamaSplitLogin__eye svg {

    width:
        17px;

    height:
        17px;

    fill:
        #7087aa;
}


/* =========================================================
   SUBMIT
========================================================= */

.iamaSplitLogin__submit {

    width:
        100%;

    min-height:
        58px;

    margin-top:
        24px;

    padding:
        0 20px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        9px;

    border-radius:
        12px;

    background:
        linear-gradient(
            120deg,
            #0844a0,
            #0d66d4
        );

    color:
        #fff;

    font-size:
        15px;

    font-weight:
        700;

    text-decoration:
        none !important;

    box-shadow:
        0 14px 31px
        rgba(8,68,160,.23);

    transition:
        .22s ease;
}


.iamaSplitLogin__submit svg {

    width:
        17px;

    height:
        17px;

    fill:
        var(--isl-yellow);

    transition:
        transform .22s ease;
}


.iamaSplitLogin__submit:hover {

    color:#ffc63b;

    transform:
        translateY(-2px);

    box-shadow:
        0 18px 38px
        rgba(8,68,160,.30);
}


.iamaSplitLogin__submit:hover svg {

    transform:
        translateX(4px);
}


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1199px) {

    .iamaSplitLogin__shell {

        min-height:
            570px;

        grid-template-columns:
            minmax(0,1fr)
            minmax(350px,410px);
    }


    .iamaSplitLogin__visual {

        min-height:
            570px;
    }


    .iamaSplitLogin__visualContent {

        padding:
            48px 40px;
    }


    .iamaSplitLogin__panel {

        padding:
            45px 31px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaSplitLogin {

        min-height:
            auto;

        padding:
            28px 0 38px;
    }


    .iamaSplitLogin__shell {

        min-height:
            0;

        grid-template-columns:
            1fr;
    }


    .iamaSplitLogin__visual {

        min-height:
            350px;
    }


    .iamaSplitLogin__visualContent {

        min-height:
            350px;

        padding:
            34px 28px;
    }


    .iamaSplitLogin__panel {

        padding:
            34px 30px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaSplitLogin {

        padding:
            16px 0 24px;
    }


    .iamaSplitLogin__shell {

        border-radius:
            20px;
    }


    .iamaSplitLogin__visual {

        min-height:
            290px;
    }


    .iamaSplitLogin__visualContent {

        min-height:
            290px;

        padding:
            23px 18px;
    }


    .iamaSplitLogin__tag {

        min-height:
            30px;

        padding:
            0 11px;

        font-size:
            10px;
    }


    .iamaSplitLogin__visualContent h1 {

        margin-top:
            14px !important;

        font-size:
            34px !important;

        line-height:
            1.06 !important;
    }


    .iamaSplitLogin__visualContent p {

        margin-top:
            12px !important;

        font-size:
            15px !important;

        line-height:
            1.55 !important;
    }


    .iamaSplitLogin__line {

        margin-top:
            17px;

        font-size:
            12px;
    }


    .iamaSplitLogin__panel {

        padding:
            27px 18px 24px;
    }


    .iamaSplitLogin__head h2 {

        font-size:
            29px !important;
    }


    .iamaSplitLogin__head p {

        font-size:
            13px !important;
    }


    .iamaSplitLogin__form {

        margin-top:
            22px;
    }


    .iamaSplitLogin__inputWrap input {

        height:
            53px;

        font-size:
            13px;
    }


    .iamaSplitLogin__submit {

        min-height:
            53px;

        margin-top:
            20px;

        font-size:
            14px;
    }

}

.iamaSplitLogin__signupLine {
    margin-top: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
    text-align: center;
}

.iamaSplitLogin__signupLine span {
    color: #7d8ba0;
    font-size: 17px;
    font-weight: 500;
}

.iamaSplitLogin__signupLine a {
    color: var(--isl-blue);
    font-size: 17px;
    font-weight: 800;
    text-decoration: none;
    transition: .2s ease;
}

.iamaSplitLogin__signupLine a:hover {
    text-decoration: underline;
}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   ROOT
========================================================= */

.iamaPayVault26,
.iamaPayVault26 *,
.iamaPayVault26 *::before,
.iamaPayVault26 *::after {
    box-sizing: border-box;
}


.iamaPayVault26 {

    --ipv-navy: #061735;
    --ipv-navy2: #08285d;
    --ipv-blue: #0a4dad;
    --ipv-blue2: #0d64d2;
    --ipv-yellow: #ffc12d;
    --ipv-green: #148a4f;

    --ipv-black: #000000;
    --ipv-text: #101f3f;
    --ipv-muted: #6f7f97;

    --ipv-border: #dfe5ee;
    --ipv-soft: #f4f7fb;

    width: 100%;

    position: relative;

    font-family:
        "Outfit",
        sans-serif;

    color:
        var(--ipv-text);

    background:
        linear-gradient(
            180deg,
            #061735 0,
            #08295e 300px,
            #eef3f9 300px,
            #f7f9fc 100%
        );
        padding: 180px 40px 80px;
}


/* =========================================================
   NAV
========================================================= */

.iamaPayVault26__navArea {

    position: relative;

    z-index: 20;

    padding:
        18px 0 14px;
}


.iamaPayVault26__nav {

    width: 100%;

    padding:
        7px;

    display: flex;

    gap:
        7px;

    align-items: center;

    overflow-x:
        auto;

    border:
        1px solid rgba(255,255,255,.10);

    border-radius:
        16px;

    background:
        rgba(255,255,255,.06);

    backdrop-filter:
        blur(14px);

    scrollbar-width:
        none;
}


.iamaPayVault26__nav::-webkit-scrollbar {
    display: none;
}


.iamaPayVault26__navItem {

    min-height:
        48px;

    padding:
        0 22px;

    flex:
        1 0 auto;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        10px;

    color:
        #dce6f6;

   font-size: 18px;

    font-weight:
        800;

    text-decoration:
        none;

    transition:
        .2s ease;
}


.iamaPayVault26__navItem:hover {

    color: #fff;

    background:
        rgba(255,255,255,.08);
}


.iamaPayVault26__navItem.is-active {

    color:
        #071936;

    background:
        linear-gradient(
            120deg,
            #ffd35d,
            #ffc12d
        );

    box-shadow:
        0 10px 22px
        rgba(255,193,45,.17);
}


.iamaPayVault26__navItem--logout {

    color:
        #ffc3c8;
}


/* =========================================================
   BODY
========================================================= */

.iamaPayVault26__body {

    padding:
        8px 0 70px;
}


/* =========================================================
   HERO
========================================================= */

.iamaPayVault26__hero {

    position: relative;

    min-height:
        220px;

    padding:
        36px 38px;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content:
        space-between;

    gap:
        35px;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        24px;

    background:

        radial-gradient(
            circle at 90% 10%,
            rgba(34,120,245,.24),
            transparent 32%
        ),

        linear-gradient(
            120deg,
            #071d48,
            #0a3c8e 58%,
            #0d59bd
        );

    box-shadow:
        0 24px 60px
        rgba(0,0,0,.19);
}


.iamaPayVault26__heroGrid {

    position: absolute;

    inset: 0;

    opacity:
        .035;

    background-image:

        linear-gradient(
            rgba(255,255,255,.6) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.6) 1px,
            transparent 1px
        );

    background-size:
        50px 50px;
}


.iamaPayVault26__heroCopy,
.iamaPayVault26__heroAmount {

    position:
        relative;

    z-index:
        2;
}


.iamaPayVault26__eyebrow {

    display:
        block;

    margin-bottom:
        8px;

    color:
        var(--ipv-yellow);

    font-size:
        13px;

    font-weight:
        800;

    letter-spacing:
        1.1px;
}


.iamaPayVault26__hero h1 {

    margin:
        0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(40px,4vw,56px) !important;

    line-height:
        1.02 !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.8px !important;
}


.iamaPayVault26__hero h1 span {

    color:
        var(--ipv-yellow);

    font-weight:
        800;
}


.iamaPayVault26__hero p {

    max-width:
        660px;

    margin:
        14px 0 0 !important;

    color:
        rgba(255,255,255,.82) !important;

    font-size:
        18px !important;

    line-height:
        1.6 !important;

    font-weight:
        500 !important;
}


/* TOTAL PAID */

.iamaPayVault26__heroAmount {

    min-width:
        245px;

    padding:
        24px;

    border:
        1px solid rgba(255,255,255,.15);

    border-radius:
        18px;

    background:
        rgba(255,255,255,.08);
}


.iamaPayVault26__heroAmount span {

    display:
        block;

    color:
        rgba(255,255,255,.67);

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        .8px;
}


.iamaPayVault26__heroAmount strong {

    display:
        block;

    margin-top:
        7px;

    color:
        #fff;

    font-size:
        34px;

    line-height:
        1;

    font-weight:
        800;
}


.iamaPayVault26__heroAmount small {

    display:
        block;

    margin-top:
        7px;

    color:
        rgba(255,255,255,.56);

    font-size:
        12px;

    font-weight:
        500;
}


/* =========================================================
   STATS
========================================================= */

.iamaPayVault26__stats {

    margin-top:
        20px;

    padding:
        10px;

    display:
        grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:
        10px;

    border:
        1px solid var(--ipv-border);

    border-radius:
        18px;

    background:
        #fff;

    box-shadow:
        0 14px 38px
        rgba(18,45,88,.065);
}


.iamaPayVault26__stat {

    min-height:
        100px;

    padding:
        18px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    border-radius:
        13px;

    background:
        #f4f7fb;
}


.iamaPayVault26__stat span {

    color:
        #66768e;

    font-size:
        15px;

    font-weight:
        600;
}


.iamaPayVault26__stat strong {

    display:
        block;

    margin-top:
        7px;

    color:
        #000;

    font-size:
        26px;

    line-height:
        1.15;

    font-weight:
        800;
}


.iamaPayVault26__stat--balance {

    background:
        #fff5d9;
}


.iamaPayVault26__stat--balance strong {

    color:
        #7a5600;
}


/* =========================================================
   SECTION HEAD
========================================================= */

.iamaPayVault26__sectionHead {

    margin:
        42px 0 20px;

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        30px;
}


.iamaPayVault26__sectionHead span {

    display:
        block;

    margin-bottom:
        7px;

    color:
        var(--ipv-blue);

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        1px;
}


.iamaPayVault26__sectionHead h2 {

    margin:
        0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(32px,3vw,42px) !important;

    line-height:
        1.05 !important;

    font-weight:
        800 !important;
}


.iamaPayVault26__sectionHead p {

    margin:
        0 !important;

    color:
        #4d5f79 !important;

    font-size:
        17px !important;

    line-height:
        1.5 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   PAYMENT CARD
========================================================= */

.iamaPayVault26__card {

    position:
        relative;

    margin-bottom:
        22px;

    overflow:
        hidden;

    border:
        1px solid #dce3ec;

    border-radius:
        22px;

    background:
        #fff;

    box-shadow:
        0 16px 44px
        rgba(18,45,88,.07);
}


.iamaPayVault26__card::before {

    content:
        "";

    position:
        absolute;

    top: 0;
    left: 0;

    width:
        100%;

    height:
        5px;

    background:
        linear-gradient(
            90deg,
            var(--ipv-yellow),
            #e8a420
        );
}


.iamaPayVault26__card--emi::before {

    background:
        linear-gradient(
            90deg,
            var(--ipv-blue),
            #3c8bea
        );
}


/* =========================================================
   CARD TOP
========================================================= */

.iamaPayVault26__cardTop {

    padding:
        25px 28px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        25px;

    border-bottom:
        1px solid #e8edf3;
}


.iamaPayVault26__titleGroup {

    display:
        flex;

    align-items:
        center;

    gap:
        16px;
}


.iamaPayVault26__number {

    width:
        52px;

    height:
        52px;

    flex:
        0 0 52px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        14px;

    background:
        #eaf1fb;

    color:
        var(--ipv-blue);

    font-size:
        13px;

    font-weight:
        800;
}


.iamaPayVault26__titleGroup > div:last-child > span {

    display:
        block;

    margin-bottom:
        5px;

    color:
        #66778f;

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        .9px;
}


.iamaPayVault26__titleGroup h3 {

    margin:
        0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        28px !important;

    line-height:
        1.1 !important;

    font-weight:
        800 !important;
}


.iamaPayVault26__titleGroup p {

    margin:
        6px 0 0 !important;

    color:
        #3e506a !important;

    font-size:
        17px !important;

    line-height:
        1.4 !important;

    font-weight:
        600 !important;
}


.iamaPayVault26__paid {

    min-height:
        40px;

    padding:
        0 14px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        50px;

    background:
        #e2f7ea;

    color:
        var(--ipv-green);

    font-size:
        13px;

    font-weight:
        800;
}


/* =========================================================
   DETAILS GRID
========================================================= */

.iamaPayVault26__detailsGrid {

    padding:
        20px 28px;

    display:
        grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:
        14px;
}


.iamaPayVault26__detail {

    min-height:
        112px;

    padding:
        18px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    border:
        1px solid #e0e6ee;

    border-radius:
        14px;

    background:
        #f5f7fa;
}


.iamaPayVault26__detail span {

    display:
        block;

    color:
        #66758b;

    font-size:
        15px;

    line-height:
        1.3;

    font-weight:
        600;
}


.iamaPayVault26__detail strong {

    display:
        block;

    margin-top:
        9px;

    color:
        #000;

    font-size:
        18px;

    line-height:
        1.4;

    font-weight:
        800;

    overflow-wrap:
        anywhere;
}


.iamaPayVault26__amountText {

    color:
        var(--ipv-green) !important;

    font-size:
        22px !important;
}


/* =========================================================
   EMI PANEL
========================================================= */

.iamaPayVault26__emiPanel {

    margin:
        0 28px 20px;

    padding:
        14px;

    display:
        grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        10px;

    border:
        1px solid #d7e3f2;

    border-radius:
        15px;

    background:
        #eef4fc;
}


.iamaPayVault26__emiPanel > div {

    min-height:
        84px;

    padding:
        14px 16px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    border-radius:
        11px;

    background:
        #fff;
}


.iamaPayVault26__emiPanel span {

    color:
        #65758d;

    font-size:
        14px;

    font-weight:
        600;
}


.iamaPayVault26__emiPanel strong {

    display:
        block;

    margin-top:
        6px;

    color:
        #000;

    font-size:
        20px;

    font-weight:
        800;
}


/* =========================================================
   BOTTOM
========================================================= */

.iamaPayVault26__bottom {

    padding:
        18px 28px;

    display:
        grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr))
        auto;

    gap:
        18px;

    align-items:
        center;

    border-top:
        1px solid #e9edf3;

    background:
        #fbfcfe;
}


.iamaPayVault26__bottom span {

    display:
        block;

    color:
        #75839a;

    font-size:
        13px;

    font-weight:
        600;
}


.iamaPayVault26__bottom strong {

    display:
        block;

    margin-top:
        5px;

    color:
        #000;

    font-size:
        18px;

    line-height:
        1.35;

    font-weight:
        800;
}


.iamaPayVault26__receipt {

    min-height:
        46px;

    padding:
        0 16px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        6px;

    border:
        1px solid #cdd9e7;

    border-radius:
        11px;

    background:
        #fff;

    color:
        var(--ipv-blue);

    font-size:
        14px;

    font-weight:
        800;

    text-decoration:
        none;

    transition:
        .2s ease;
}


.iamaPayVault26__receipt:hover {

    color:
        #fff;

    border-color:
        var(--ipv-blue);

    background:
        var(--ipv-blue);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaPayVault26__navItem {
        flex:
            0 0 auto;
    }


    .iamaPayVault26__hero {

        flex-direction:
            column;

        align-items:
            stretch;
    }


    .iamaPayVault26__heroAmount {

        min-width:
            0;
    }


    .iamaPayVault26__stats {

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .iamaPayVault26__detailsGrid {

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .iamaPayVault26__bottom {

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .iamaPayVault26__receipt {

        width:
            fit-content;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaPayVault26 {

        background:
            linear-gradient(
                180deg,
                #061735 0,
                #08295e 430px,
                #eef3f9 430px,
                #f7f9fc 100%
            );
    }


    .iamaPayVault26__navArea {

        padding:
            12px 0;
    }


    .iamaPayVault26__nav {

        padding:
            6px;
    }


    .iamaPayVault26__navItem {

        min-height:
            42px;

        padding:
            0 14px;

        font-size:
            12px;
    }


    .iamaPayVault26__body {

        padding:
            6px 0 45px;
    }


    .iamaPayVault26__hero {

        min-height:
            0;

        padding:
            25px 19px;

        border-radius:
            18px;
    }


    .iamaPayVault26__hero h1 {

        font-size:
            34px !important;
    }


    .iamaPayVault26__hero p {

        font-size:
            16px !important;

        line-height:
            1.5 !important;
    }


    .iamaPayVault26__heroAmount {

        padding:
            18px;
    }


    .iamaPayVault26__heroAmount strong {

        font-size:
            28px;
    }


    .iamaPayVault26__stats {

        grid-template-columns:
            1fr 1fr;
    }


    .iamaPayVault26__stat {

        min-height:
            88px;

        padding:
            14px;
    }


    .iamaPayVault26__stat span {

        font-size:
            13px;
    }


    .iamaPayVault26__stat strong {

        font-size:
            21px;
    }


    .iamaPayVault26__sectionHead {

        margin:
            32px 0 15px;

        display:
            block;
    }


    .iamaPayVault26__sectionHead h2 {

        font-size:
            30px !important;
    }


    .iamaPayVault26__sectionHead p {

        margin-top:
            8px !important;

        font-size:
            15px !important;
    }


    .iamaPayVault26__card {

        border-radius:
            18px;
    }


    .iamaPayVault26__cardTop {

        padding:
            19px 16px;

        align-items:
            flex-start;
    }


    .iamaPayVault26__number {

        width:
            44px;

        height:
            44px;

        flex-basis:
            44px;

        border-radius:
            11px;
    }


    .iamaPayVault26__titleGroup {

        gap:
            11px;
    }


    .iamaPayVault26__titleGroup h3 {

        font-size:
            21px !important;
    }


    .iamaPayVault26__titleGroup p {

        font-size:
            15px !important;
    }


    .iamaPayVault26__paid {

        min-height:
            34px;

        padding:
            0 10px;

        font-size:
            10px;
    }


    .iamaPayVault26__detailsGrid {

        padding:
            14px 16px;

        grid-template-columns:
            1fr;

        gap:
            9px;
    }


    .iamaPayVault26__detail {

        min-height:
            92px;

        padding:
            15px;
    }


    .iamaPayVault26__detail span {

        font-size:
            14px;
    }


    .iamaPayVault26__detail strong {

        font-size:
            17px;
    }


    .iamaPayVault26__amountText {

        font-size:
            20px !important;
    }


    .iamaPayVault26__emiPanel {

        margin:
            0 16px 14px;

        grid-template-columns:
            1fr;

        gap:
            8px;
    }


    .iamaPayVault26__emiPanel > div {

        min-height:
            74px;
    }


    .iamaPayVault26__emiPanel strong {

        font-size:
            18px;
    }


    .iamaPayVault26__bottom {

        padding:
            15px 16px;

        grid-template-columns:
            1fr;

        gap:
            14px;
    }


    .iamaPayVault26__bottom strong {

        font-size:
            17px;
    }


    .iamaPayVault26__receipt {

        width:
            100%;

        min-height:
            45px;
    }

}


@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   IAMA ACCOUNT PRO
========================================================= */

.iamaAccountPro26,
.iamaAccountPro26 *,
.iamaAccountPro26 *::before,
.iamaAccountPro26 *::after {
    box-sizing: border-box;
}


.iamaAccountPro26 {

    --iap-blue: #083d92;
    --iap-blue2: #0d5dca;
    --iap-dark: #06172f;
    --iap-dark2: #08295f;

    --iap-yellow: #ffc12d;
    --iap-green: #168a4e;

    --iap-text: #0e2854;
    --iap-body: #66758b;
    --iap-muted: #8390a3;

    --iap-border: #dfe6ef;
    --iap-soft: #f5f8fc;

    width: 100%;

    font-family:
        "Outfit",
        sans-serif;

    color:
        var(--iap-text);
}


/* =========================================================
   DARK HEADER
========================================================= */

.iamaAccountPro26__top {

    position: relative;

   padding: 230px 40px 30px;

    background:

        radial-gradient(
            circle at 85% 10%,
            rgba(28,100,220,.22),
            transparent 30%
        ),

        linear-gradient(
            115deg,
            #06172f 0%,
            #082a60 55%,
            #093f8f 100%
        );
}


/* =========================================================
   PAGE HEADING
========================================================= */

.iamaAccountPro26__pageHead {

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 35px;

    margin-bottom: 26px;
}


.iamaAccountPro26__pageHead span {

    display: block;

    margin-bottom: 7px;

    color:
        var(--iap-yellow);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.2px;
}


.iamaAccountPro26__pageHead h1 {

    margin: 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(38px, 4vw, 54px) !important;

    line-height:
        1.02 !important;

    letter-spacing:
        -.8px !important;

    font-weight:
        700 !important;
}


.iamaAccountPro26__pageHead h1 strong {

    color:
        var(--iap-yellow);

    font-weight:
        800;
}


.iamaAccountPro26__pageHead p {

    max-width: 420px;

    margin:
        0 0 4px !important;

    color:
        rgba(255,255,255,.72) !important;

    font-size:
        16px !important;

    line-height:
        1.5 !important;

    font-weight:
        500 !important;

    text-align:
        right;
}


/* =========================================================
   TABS
========================================================= */

.iamaAccountPro26__tabs {

    width: 100%;

    padding: 7px;

    display: flex;

    align-items: center;

    gap: 7px;

    overflow-x: auto;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        16px;

    background:
        rgba(255,255,255,.07);

    backdrop-filter:
        blur(15px);

    scrollbar-width: none;
}


.iamaAccountPro26__tabs::-webkit-scrollbar {
    display: none;
}


.iamaAccountPro26__tab {

    min-height: 48px;

    padding:
        0 22px;

    flex:
        1 0 auto;

    display:
        inline-flex;

    align-items: center;

    justify-content: center;

    border-radius:
        10px;

    color:
        #dce6f6;

    font-size:
        20px;

    font-weight:
        700;

    white-space: nowrap;

    text-decoration:
        none;

    transition:
        .2s ease;
}


.iamaAccountPro26__tab:hover {

    color:
        #fff;

    background:
        rgba(255,255,255,.08);
}


.iamaAccountPro26__tab.is-active {

    color:
        #071935;

    background:
        linear-gradient(
            120deg,
            #ffd25c,
            #ffc12d
        );

    box-shadow:
        0 10px 25px
        rgba(255,193,45,.18);
}


.iamaAccountPro26__tab--logout {

    color:
        #ffb5bc;
}


/* =========================================================
   BODY
========================================================= */

.iamaAccountPro26__body {

    padding:
        28px 0 55px;

    background:

        radial-gradient(
            circle at 95% 0,
            rgba(20,84,180,.05),
            transparent 27%
        ),

        linear-gradient(
            180deg,
            #f1f5fa,
            #ffffff
        );
}


/* =========================================================
   WELCOME
========================================================= */

.iamaAccountPro26__welcome {

    min-height: 150px;

    padding:
        24px 28px;

    display: grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(450px,.85fr);

    align-items: center;

    gap: 30px;

    border-radius:
        22px;

    background:

        radial-gradient(
            circle at 95% 20%,
            rgba(49,134,255,.27),
            transparent 35%
        ),

        linear-gradient(
            120deg,
            #08265c,
            #0948a2 62%,
            #0b62cc
        );

    box-shadow:
        0 18px 48px
        rgba(10,48,106,.16);
}


.iamaAccountPro26__welcomeMain {

    display: flex;

    align-items: center;

    gap: 18px;
}


.iamaAccountPro26__avatar {

    width: 62px;

    height: 62px;

    flex:
        0 0 62px;

    display: grid;

    place-items: center;

    border:
        3px solid var(--iap-yellow);

    border-radius:
        17px;

    background:
        #fff;

    color:
        var(--iap-blue);

    font-size:
        23px;

    font-weight:
        800;
}


.iamaAccountPro26__welcomeText > span {

    display: block;

    margin-bottom: 4px;

    color:
        var(--iap-yellow);

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        1px;
}


.iamaAccountPro26__welcomeText h2 {

    margin: 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(26px, 2.6vw, 36px) !important;

    line-height:
        1.08 !important;

    font-weight:
        700 !important;
}


.iamaAccountPro26__welcomeText p {

    margin:
        6px 0 0 !important;

    color:
        rgba(255,255,255,.66) !important;

    font-size:
        16px !important;

    line-height:
        1.4 !important;
}


.iamaAccountPro26__welcomeText p strong {

    color:
        #fff;
}


/* META */

.iamaAccountPro26__welcomeMeta {

    display: grid;

    grid-template-columns:
        1.5fr .7fr .7fr;

    gap: 9px;
}


.iamaAccountPro26__welcomeMeta > div {

    min-height: 76px;

    padding:
        13px 14px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border:
        1px solid rgba(255,255,255,.12);

    border-radius:
        12px;

    background:
        rgba(255,255,255,.08);
}


.iamaAccountPro26__welcomeMeta span {

    color:
        rgba(255,255,255,.57);

    font-size:
        14px;

    font-weight:
        500;
}


.iamaAccountPro26__welcomeMeta strong {

    display: block;

    margin-top: 5px;

    color:
        #fff;

    font-size:
        18px;

    line-height:
        1.35;

    font-weight:
        700;

    overflow-wrap:
        anywhere;
}


.iamaAccountPro26__paid {

    width: fit-content;

    padding:
        4px 9px;

    border-radius:
        50px;

    background:
        #dff7e9;

    color:
        var(--iap-green) !important;

    font-size:
        15px !important;
}


/* =========================================================
   MAIN GRID
========================================================= */

.iamaAccountPro26__grid {

    margin-top: 22px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(0, .92fr);

    gap: 22px;

    align-items: start;
}


/* =========================================================
   CARD
========================================================= */

.iamaAccountPro26__card {

    overflow: hidden;

    border:
        1px solid var(--iap-border);

    border-radius:
        20px;

    background:
        #fff;

    box-shadow:
        0 13px 38px
        rgba(18,44,84,.055);
}


/* =========================================================
   CARD HEAD
========================================================= */

.iamaAccountPro26__cardHead {

    min-height: 86px;

    padding:
        20px 22px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 18px;

    border-bottom:
        1px solid #e9edf3;
}


.iamaAccountPro26__cardHead span {

    display: block;

    margin-bottom: 4px;

    color:
        var(--iap-blue);

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        .9px;
}


.iamaAccountPro26__cardHead h3 {

    margin: 0 !important;

    color:
        #0d2857 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        25px !important;

    line-height:
        1.08 !important;

    font-weight:
        700 !important;
}


.iamaAccountPro26__action {

    min-height: 38px;

    padding:
        0 13px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 auto;

    border:
        1px solid #d6e0ed;

    border-radius:
        9px;

    background:
        #f6f9fd;

    color:
        var(--iap-blue);

    font-size:
        15px;

    font-weight:
        700;

    text-decoration:
        none;

    transition:
        .2s ease;
}


.iamaAccountPro26__action:hover {

    color:
        #fff;

    border-color:
        var(--iap-blue);

    background:
        var(--iap-blue);
}


/* =========================================================
   PERSONAL INFO GRID
========================================================= */

.iamaAccountPro26__infoGrid {

    padding:
        18px 22px 22px;

    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 9px;
}


.iamaAccountPro26__infoGrid > div {

    min-height: 69px;

    padding:
        12px 14px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border:
        1px solid #e4e9f0;

    border-radius:
        11px;

    background:
        #f7f9fc;
}


.iamaAccountPro26__infoGrid span {

    color:
        #78869a;

    font-size:
        14px;

    font-weight:
        500;
}


.iamaAccountPro26__infoGrid strong {

    display: block;

    margin-top: 5px;

    color:
        #111;

    font-size:
        17px;

    line-height:
        1.35;

    font-weight:
        700;
}


.iamaAccountPro26__wide {

    grid-column:
        1 / -1;
}


/* =========================================================
   COURSE
========================================================= */

.iamaAccountPro26__course {

    margin:
        18px 22px 0;

    padding:
        18px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 18px;

    border:
        1px solid #dbe5f1;

    border-radius:
        14px;

    background:
        linear-gradient(
            135deg,
            #eef4fd,
            #f9fbfe
        );
}


.iamaAccountPro26__course span {

    display: block;

    color:
        #718097;

    font-size:
        16px;

    font-weight:
        500;
}


.iamaAccountPro26__course h4 {

    margin:
        6px 0 0 !important;

    color:
        #0b3472 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        21px !important;

    line-height:
        1.2 !important;

    font-weight:
        700 !important;
}


.iamaAccountPro26__course p {

    margin:
        4px 0 0 !important;

    color:
        #78869a !important;

    font-size:
        16px !important;
}


.iamaAccountPro26__online {

    padding:
        6px 10px;

    border-radius:
        50px;

    background:
        #dce9ff;

    color:
        var(--iap-blue);

    font-size:
        17px;

    font-weight:
        800;
}


/* =========================================================
   MONEY GRID
========================================================= */

.iamaAccountPro26__moneyGrid {

    padding:
        10px 22px 0;

    display: grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap: 8px;
}


.iamaAccountPro26__moneyGrid > div {

    min-height: 77px;

    padding:
        12px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border:
        1px solid #e3e9f0;

    border-radius:
        11px;

    background:
        #fff;
}


.iamaAccountPro26__moneyGrid span {

    color:
        #78869a;

    font-size:
        17px;

    font-weight:
        500;
}


.iamaAccountPro26__moneyGrid strong {

    display: block;

    margin-top: 5px;

    color:
        #111;

    font-size:
        22px;

    font-weight:
        800;
}


.iamaAccountPro26__moneyGrid .is-green {

    color:
        var(--iap-green);
}


/* =========================================================
   STATUS
========================================================= */

.iamaAccountPro26__status {

    margin:
        10px 22px 22px;

    padding:
        13px 14px;

    display: flex;

    align-items: center;

    gap: 11px;

    border:
        1px solid #cde8d8;

    border-radius:
        12px;

    background:
        #effaf3;
}


.iamaAccountPro26__statusIcon {

    width: 36px;

    height: 36px;

    flex:
        0 0 36px;

    display: grid;

    place-items: center;

    border-radius:
        50%;

    background:
        var(--iap-green);

    color:
        #fff;

    font-size:
        13px;

    font-weight:
        800;
}


.iamaAccountPro26__status strong {

    display: block;

    color:
        #16613a;

    font-size:
        20px;

    font-weight:
        700;
}


.iamaAccountPro26__status p {

    margin:
        2px 0 0 !important;

    color:
        #617669 !important;

    font-size:
        17px !important;

    line-height:
        1.4 !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaAccountPro26__pageHead {

        align-items:
            flex-start;

        flex-direction:
            column;

        gap: 9px;
    }


    .iamaAccountPro26__pageHead p {

        text-align:
            left;
    }


    .iamaAccountPro26__tab {

        flex:
            0 0 auto;
    }


    .iamaAccountPro26__welcome {

        grid-template-columns:
            1fr;
    }


    .iamaAccountPro26__welcomeMeta {

        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }


    .iamaAccountPro26__grid {

        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaAccountPro26__top {

        padding:
            28px 0 15px;
    }


    .iamaAccountPro26__pageHead {

        margin-bottom:
            18px;
    }


    .iamaAccountPro26__pageHead h1 {

        font-size:
            35px !important;
    }


    .iamaAccountPro26__pageHead p {

        font-size:
            14px !important;
    }


    .iamaAccountPro26__tabs {

        padding:
            5px;

        gap:
            5px;

        border-radius:
            12px;
    }


    .iamaAccountPro26__tab {

        min-height:
            41px;

        padding:
            0 14px;

        font-size:
            12px;

        border-radius:
            8px;
    }


    .iamaAccountPro26__body {

        padding:
            18px 0 38px;
    }


    .iamaAccountPro26__welcome {

        min-height:
            auto;

        padding:
            20px 17px;

        gap:
            20px;

        border-radius:
            17px;
    }


    .iamaAccountPro26__welcomeMain {

        align-items:
            flex-start;
    }


    .iamaAccountPro26__avatar {

        width:
            52px;

        height:
            52px;

        flex-basis:
            52px;

        border-radius:
            13px;

        font-size:
            19px;
    }


    .iamaAccountPro26__welcomeText h2 {

        font-size:
            24px !important;
    }


    .iamaAccountPro26__welcomeMeta {

        grid-template-columns:
            1fr;
    }


    .iamaAccountPro26__welcomeMeta > div {

        min-height:
            66px;
    }


    .iamaAccountPro26__grid {

        margin-top:
            16px;

        gap:
            16px;
    }


    .iamaAccountPro26__card {

        border-radius:
            16px;
    }


    .iamaAccountPro26__cardHead {

        min-height:
            auto;

        padding:
            17px 15px;
    }


    .iamaAccountPro26__cardHead h3 {

        font-size:
            21px !important;
    }


    .iamaAccountPro26__action {

        min-height:
            34px;

        padding:
            0 10px;

        font-size:
            10px;
    }


    .iamaAccountPro26__infoGrid {

        padding:
            14px 15px 17px;

        grid-template-columns:
            1fr;

        gap:
            7px;
    }


    .iamaAccountPro26__wide {

        grid-column:
            auto;
    }


    .iamaAccountPro26__infoGrid > div {

        min-height:
            62px;

        padding:
            11px 12px;
    }


    .iamaAccountPro26__infoGrid strong {

        font-size:
            14px;
    }


    .iamaAccountPro26__course {

        margin:
            14px 15px 0;

        padding:
            15px;

        align-items:
            flex-start;

        flex-direction:
            column;
    }


    .iamaAccountPro26__course h4 {

        font-size:
            19px !important;
    }


    .iamaAccountPro26__moneyGrid {

        padding:
            8px 15px 0;

        grid-template-columns:
            1fr;

        gap:
            7px;
    }


    .iamaAccountPro26__moneyGrid > div {

        min-height:
            65px;
    }


    .iamaAccountPro26__status {

        margin:
            9px 15px 17px;
    }

}

/* =========================================================
   IAMA PAYMENT LITE 2026
   BIGGER FONTS / DARKER TEXT / COMPACT LAYOUT
========================================================= */

.iamaPaymentLite26,
.iamaPaymentLite26 *,
.iamaPaymentLite26 *::before,
.iamaPaymentLite26 *::after {
    box-sizing: border-box;
}


.iamaPaymentLite26 {

    --ipl-blue: #083d92;
    --ipl-blue2: #0d5fcb;
    --ipl-yellow: #ffc12d;
    --ipl-green: #168a4e;

    --ipl-black: #000000;
    --ipl-text: #102b59;
    --ipl-muted: #4f5f75;

    --ipl-border: #dfe6ef;
    --ipl-soft: #f5f8fc;

    width: 100%;

    padding:
        24px 0 50px;

    font-family:
        "Outfit",
        sans-serif;

    color:
        var(--ipl-black);

    background:
        linear-gradient(
            180deg,
            #f0f5fb,
            #ffffff
        );
}


/* =========================================================
   CONTEXT STRIP
========================================================= */

.iamaPaymentLite26__context {

    padding:
        16px;

    display: grid;

    grid-template-columns:
        minmax(300px,.78fr)
        minmax(0,1.22fr);

    align-items: center;

    gap:
        15px;

    border:
        1px solid var(--ipl-border);

    border-radius:
        18px;

    background:
        #fff;

    box-shadow:
        0 12px 34px
        rgba(18,45,88,.055);
}


/* =========================================================
   STUDENT
========================================================= */

.iamaPaymentLite26__student {

    min-height:
        96px;

    padding:
        16px 17px;

    display: flex;

    align-items: center;

    gap:
        15px;

    border-radius:
        13px;

    background:
        linear-gradient(
            120deg,
            #09285f,
            #0a4ca9
        );
}


.iamaPaymentLite26__avatar {

    width:
        52px;

    height:
        52px;

    flex:
        0 0 52px;

    display: grid;

    place-items: center;

    border:
        2px solid var(--ipl-yellow);

    border-radius:
        12px;

    background:
        #fff;

    color:
        var(--ipl-blue);

    font-size:
        21px;

    font-weight:
        800;
}


.iamaPaymentLite26__student span {

    display:
        block;

    color:
        var(--ipl-yellow);

    font-size:
        13px;

    line-height:
        1.2;

    font-weight:
        800;

    letter-spacing:
        .7px;
}


.iamaPaymentLite26__student h2 {
    font-family: "Outfit", sans-serif !important;

    margin:
        4px 0 0 !important;

    color:
        #fff !important;

    font-size:
        24px !important;

    line-height:
        1.1 !important;

    font-weight:
        800 !important;
}


.iamaPaymentLite26__student p {

    margin:
        6px 0 0 !important;

    color:
        #fff !important;

    font-size:
        16px !important;

    line-height:
        1.4 !important;

    font-weight:
        500 !important;
}


.iamaPaymentLite26__student p strong {

    color:
        #fff;

    font-weight:
        800;
}


/* =========================================================
   CONTEXT INFO
========================================================= */

.iamaPaymentLite26__contextInfo {

    display: grid;

    grid-template-columns:
        1.35fr 1fr .82fr .82fr;

    gap:
        8px;
}


.iamaPaymentLite26__contextInfo > div {

    min-height:
        80px;

    padding:
        13px 14px;

    display: flex;

    flex-direction:
        column;

    justify-content: center;

    border:
        1px solid #e3e9f0;

    border-radius:
        11px;

    background:
        #f7f9fc;
}


.iamaPaymentLite26__contextInfo span {

    color:
        #38475c;

    font-size:
        14px;

    line-height:
        1.3;

    font-weight:
        600;
}


.iamaPaymentLite26__contextInfo strong {

    display:
        block;

    margin-top:
        6px;

    color:
        #000;

    font-size:
        19px;

    line-height:
        1.3;

    font-weight:
        800;
}


.iamaPaymentLite26__contextInfo .is-green {

    color:
        var(--ipl-green);

    font-size:
        20px;

    font-weight:
        800;
}


/* =========================================================
   PAGE SECTION HEAD
========================================================= */

.iamaPaymentLite26__heading {

    margin:
        30px 0 16px;

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap:
        20px;
}


.iamaPaymentLite26__heading span {
    

    display:
        block;

    margin-bottom:
        5px;

    color:
        var(--ipl-blue);

    font-size:
        14px;

    font-weight:
        800;

    letter-spacing:
        .8px;
}


.iamaPaymentLite26__heading h2 {
    font-family: "Outfit", sans-serif !important;

    margin: 0 !important;

    color:
        #000 !important;

    font-size:
        clamp(32px,2.8vw,40px) !important;

    line-height:
        1.04 !important;

    font-weight:
        800 !important;
}


.iamaPaymentLite26__heading p {

    margin:
        0 0 3px !important;

    color:
        #111 !important;

    font-size:
        17px !important;

    line-height:
        1.45 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   LIST
========================================================= */

.iamaPaymentLite26__list {

    display:
        grid;

    gap:
        15px;
}


/* =========================================================
   PAYMENT ROW
========================================================= */

.iamaPaymentLite26__row {

    position: relative;

    overflow: hidden;

    border:
        1px solid var(--ipl-border);

    border-radius:
        17px;

    background:
        #fff;

    box-shadow:
        0 10px 30px
        rgba(18,45,88,.045);
}


.iamaPaymentLite26__row::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;

    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--ipl-yellow),
            #eaa61c
        );
}


.iamaPaymentLite26__row--emi::before {

    background:
        linear-gradient(
            90deg,
            var(--ipl-blue),
            #3e8bea
        );
}


/* =========================================================
   ROW HEAD
========================================================= */

.iamaPaymentLite26__rowHead {

    padding:
        18px 20px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap:
        18px;

    border-bottom:
        1px solid #edf1f5;
}


.iamaPaymentLite26__title {

    display: flex;

    align-items: center;

    gap:
        13px;
}


.iamaPaymentLite26__index {

    width:
        46px;

    height:
        46px;

    flex:
        0 0 46px;

    display: grid;

    place-items: center;

    border-radius:
        11px;

    background:
        #eaf1fb;

    color:
        var(--ipl-blue);

    font-size:
        14px;

    font-weight:
        800;
}


.iamaPaymentLite26__title > div:last-child > span {

    display:
        block;

    color:
        #243750;

    font-size:
        13px;

    line-height:
        1.2;

    font-weight:
        800;

    letter-spacing:
        .7px;
}


.iamaPaymentLite26__title h3 {
    font-family: "Outfit", sans-serif !important;

    margin:
        4px 0 0 !important;

    color:
        #000 !important;

    font-size:
        24px !important;

    line-height:
        1.1 !important;

    font-weight:
        800 !important;
}


.iamaPaymentLite26__title p {

    margin:
        5px 0 0 !important;

    color:
        #111 !important;

    font-size:
        16px !important;

    line-height:
        1.35 !important;

    font-weight:
        600 !important;
}


.iamaPaymentLite26__paid {

    min-height:
        36px;

    padding:
        0 13px;

    display:
        inline-flex;

    align-items:
        center;

    border-radius:
        50px;

    background:
        #e2f7ea;

    color:
        var(--ipl-green);

    font-size:
        19px;

    font-weight:
        800;
}


/* =========================================================
   DATA
========================================================= */

.iamaPaymentLite26__data {

    padding:
        13px 20px;

    display: grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:
        9px;
}


.iamaPaymentLite26__data > div {

    min-height:
        82px;

    padding:
        12px 14px;

    display: flex;

    flex-direction:
        column;

    justify-content: center;

    border:
        1px solid #e4e9f0;

    border-radius:
        10px;

    background:
        #f7f9fc;
}


.iamaPaymentLite26__data span {

    color:
        #35445a;

    font-size:
        14px;

    line-height:
        1.3;

    font-weight:
        600;
}


.iamaPaymentLite26__data strong {

    display:
        block;

    margin-top:
        6px;

    color:
        #000;

    font-size:
        18px;

    line-height:
        1.3;

    font-weight:
        800;

    overflow-wrap:
        anywhere;
}


.iamaPaymentLite26__data .is-green {

    color:
        var(--ipl-green);

    font-size:
        22px;

    font-weight:
        800;
}


/* =========================================================
   EMI
========================================================= */

.iamaPaymentLite26__emi {

    margin:
        0 20px 12px;

    padding:
        9px;

    display: grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:
        8px;

    border:
        1px solid #d8e4f2;

    border-radius:
        11px;

    background:
        #eef4fc;
}


.iamaPaymentLite26__emi > div {

    min-height:
        68px;

    padding:
        10px 12px;

    display: flex;

    flex-direction:
        column;

    justify-content: center;

    border-radius:
        8px;

    background:
        #fff;
}


.iamaPaymentLite26__emi span {

    color:
        #37475d;

    font-size:
        14px;

    font-weight:
        600;
}


.iamaPaymentLite26__emi strong {

    display:
        block;

    margin-top:
        5px;

    color:
        #000;

    font-size:
        18px;

    font-weight:
        800;
}


/* =========================================================
   FOOT
========================================================= */

.iamaPaymentLite26__rowFoot {

    min-height:
        52px;

    padding:
        11px 20px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap:
        15px;

    border-top:
        1px solid #edf1f5;

    background:
        #fbfcfe;
}


.iamaPaymentLite26__rowFoot > span {

    color:
        #111;

    font-size:
        15px;

    font-weight:
        500;
}


.iamaPaymentLite26__rowFoot a {

    color:
        var(--ipl-blue);

    font-size:
        19px;

    font-weight:
        800;

    text-decoration:
        none;
}


.iamaPaymentLite26__rowFoot a:hover {

    text-decoration:
        underline;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaPaymentLite26__context {

        grid-template-columns:
            1fr;
    }


    .iamaPaymentLite26__contextInfo {

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .iamaPaymentLite26__data {

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .iamaPaymentLite26__heading {

        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            7px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaPaymentLite26 {

        padding:
            17px 0 35px;
    }


    .iamaPaymentLite26__context {

        padding:
            10px;

        gap:
            9px;

        border-radius:
            14px;
    }


    .iamaPaymentLite26__student {

        min-height:
            84px;

        padding:
            13px;

        border-radius:
            11px;
    }


    .iamaPaymentLite26__avatar {

        width:
            46px;

        height:
            46px;

        flex-basis:
            46px;

        border-radius:
            10px;

        font-size:
            18px;
    }


    .iamaPaymentLite26__student span {

        font-size:
            11px;
    }


    .iamaPaymentLite26__student h2 {

        font-size:
            20px !important;
    }


    .iamaPaymentLite26__student p {

        font-size:
            14px !important;
    }


    .iamaPaymentLite26__contextInfo {

        grid-template-columns:
            1fr 1fr;

        gap:
            6px;
    }


    .iamaPaymentLite26__contextInfo > div {

        min-height:
            72px;

        padding:
            10px;
    }


    .iamaPaymentLite26__contextInfo span {

        font-size:
            12px;
    }


    .iamaPaymentLite26__contextInfo strong {

        font-size:
            14px;
    }


    .iamaPaymentLite26__contextInfo .is-green {

        font-size:
            17px;
    }


    .iamaPaymentLite26__heading {

        margin:
            24px 0 12px;
    }


    .iamaPaymentLite26__heading span {

        font-size:
            12px;
    }


    .iamaPaymentLite26__heading h2 {

        font-size:
            29px !important;
    }


    .iamaPaymentLite26__heading p {

        font-size:
            15px !important;
    }


    .iamaPaymentLite26__list {

        gap:
            11px;
    }


    .iamaPaymentLite26__row {

        border-radius:
            14px;
    }


    .iamaPaymentLite26__rowHead {

        padding:
            14px 12px;

        align-items:
            flex-start;
    }


    .iamaPaymentLite26__index {

        width:
            40px;

        height:
            40px;

        flex-basis:
            40px;

        border-radius:
            9px;

        font-size:
            12px;
    }


    .iamaPaymentLite26__title {

        gap:
            10px;
    }


    .iamaPaymentLite26__title > div:last-child > span {

        font-size:
            11px;
    }


    .iamaPaymentLite26__title h3 {

        font-size:
            20px !important;
    }


    .iamaPaymentLite26__title p {

        font-size:
            14px !important;
    }


    .iamaPaymentLite26__paid {

        min-height:
            30px;

        padding:
            0 9px;

        font-size:
            10px;
    }


    .iamaPaymentLite26__data {

        padding:
            10px 12px;

        grid-template-columns:
            1fr;

        gap:
            7px;
    }


    .iamaPaymentLite26__data > div {

        min-height:
            68px;

        padding:
            10px 11px;
    }


    .iamaPaymentLite26__data span {

        font-size:
            13px;
    }


    .iamaPaymentLite26__data strong {

        font-size:
            16px;
    }


    .iamaPaymentLite26__data .is-green {

        font-size:
            19px;
    }


    .iamaPaymentLite26__emi {

        margin:
            0 12px 10px;

        grid-template-columns:
            repeat(3,minmax(0,1fr));

        padding:
            6px;

        gap:
            5px;
    }


    .iamaPaymentLite26__emi > div {

        min-height:
            62px;

        padding:
            8px;
    }


    .iamaPaymentLite26__emi span {

        font-size:
            11px;
    }


    .iamaPaymentLite26__emi strong {

        font-size:
            14px;
    }


    .iamaPaymentLite26__rowFoot {

        min-height:
            48px;

        padding:
            10px 12px;

        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            5px;
    }


    .iamaPaymentLite26__rowFoot > span {

        font-size:
            14px;
    }


    .iamaPaymentLite26__rowFoot a {

        font-size:
            14px;
    }

}


@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   COURSE SELECT 28
   TOP iamaAccountPro26 CSS NOT TOUCHED
========================================================= */

.iamaCourseSelect28,
.iamaCourseSelect28 *,
.iamaCourseSelect28 *::before,
.iamaCourseSelect28 *::after {
    box-sizing: border-box;
}


.iamaCourseSelect28 {

    --ics-blue: #083d92;
    --ics-blue2: #0d60cb;
    --ics-navy: #071d46;

    --ics-yellow: #ffc12d;
    --ics-green: #168a4e;

    --ics-black: #000;
    --ics-border: #dfe6ef;
    --ics-soft: #f5f8fc;

    width: 100%;

    padding:
        28px 0 55px;

    font-family:
        "Outfit",
        sans-serif !important;

    background:
        linear-gradient(
            180deg,
            #f0f5fa,
            #ffffff
        );
}


/* =========================================================
   INTRO
========================================================= */

.iamaCourseSelect28__intro {

    margin-bottom: 18px;

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 35px;
}


.iamaCourseSelect28__intro > div > span {

    display: block;

    margin-bottom: 6px;

    color:
        var(--ics-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: .8px;
}


.iamaCourseSelect28__intro h2 {

    margin: 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(32px,3vw,43px) !important;

    line-height:
        1.04 !important;

    font-weight:
        800 !important;

    letter-spacing:
        -.6px !important;
}


.iamaCourseSelect28__intro h2 strong {

    color:
        var(--ics-blue);

    font-weight:
        800;
}


.iamaCourseSelect28__intro > p {

    max-width: 520px;

    margin:
        0 0 3px !important;

    color:
        #111 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        17px !important;

    line-height:
        1.5 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   PANEL
========================================================= */

.iamaCourseSelect28__panel {

    position: relative;

    z-index: 30;

    padding: 19px;

    display: grid;

    grid-template-columns:
        270px minmax(0,1fr);

    align-items: center;

    gap: 20px;

    border:
        1px solid var(--ics-border);

    border-radius: 20px;

    background: #fff;

    box-shadow:
        0 15px 40px
        rgba(18,45,88,.065);
}


/* =========================================================
   PANEL TITLE
========================================================= */

.iamaCourseSelect28__panelTitle {

    min-height: 110px;

    padding: 18px;

    display: flex;

    align-items: center;

    gap: 14px;

    border-radius: 14px;

    background:
        linear-gradient(
            125deg,
            #08265c,
            #0a51af
        );
}


.iamaCourseSelect28__step {

    width: 50px;

    height: 50px;

    flex:
        0 0 50px;

    display: grid;

    place-items: center;

    border-radius: 12px;

    background:
        var(--ics-yellow);

    color:
        #071c43;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 17px;

    font-weight: 800;
}


.iamaCourseSelect28__panelTitle span {

    display: block;

    color:
        var(--ics-yellow);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 13px;

    font-weight: 800;
}


.iamaCourseSelect28__panelTitle h3 {

    margin:
        5px 0 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        21px !important;

    line-height:
        1.15 !important;

    font-weight:
        700 !important;
}


/* =========================================================
   CONTROLS
========================================================= */

.iamaCourseSelect28__controls {

    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 14px;
}


.iamaCourseSelect28__field {

    position: relative;
}


.iamaCourseSelect28__field > label {

    display: block;

    margin-bottom: 8px;

    color: #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 16px;

    font-weight: 700;
}


/* =========================================================
   CUSTOM DROPDOWN
========================================================= */

.iamaCourseSelect28__dropdown {

    position: relative;

    width: 100%;
}


.iamaCourseSelect28__trigger {

    width: 100%;

    min-height: 60px;

    padding:
        0 14px 0 17px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 14px;

    border:
        1px solid #d7e0eb;

    border-radius: 12px;

    outline: none;

    background:
        #f6f8fb;

    cursor: pointer;

    font-family:
        "Outfit",
        sans-serif !important;

    transition:
        border-color .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}


.iamaCourseSelect28__trigger:hover {

    border-color:
        #b8c7da;

    background:
        #fff;
}


.iamaCourseSelect28__current {

    min-width: 0;

    overflow: hidden;

    white-space: nowrap;

    text-overflow: ellipsis;

    color:
        #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 21px;

    line-height: 1.3;

    font-weight: 700;

    text-align: left;
}


.iamaCourseSelect28__chevron {

    width: 34px;

    height: 34px;

    flex:
        0 0 34px;

    display: grid;

    place-items: center;

    border-radius: 9px;

    background:
        #e7eef8;
}


.iamaCourseSelect28__chevron svg {

    width: 18px;

    height: 18px;

    fill:
        var(--ics-blue);

    transition:
        transform .2s ease;
}


.iamaCourseSelect28__dropdown.is-open
.iamaCourseSelect28__trigger {

    border-color:
        var(--ics-blue);

    background: #fff;

    box-shadow:
        0 0 0 4px
        rgba(8,61,146,.07);
}


.iamaCourseSelect28__dropdown.is-open
.iamaCourseSelect28__chevron svg {

    transform:
        rotate(180deg);
}


/* DISABLED */

.iamaCourseSelect28__dropdown.is-disabled
.iamaCourseSelect28__trigger {

    cursor:
        not-allowed;

    background:
        #edf1f5;

    opacity:
        .65;
}


/* =========================================================
   MENU
========================================================= */

.iamaCourseSelect28__menu {

    position: absolute;

    top:
        calc(100% + 8px);

    left: 0;

    z-index: 300;

    width: 100%;

    max-height: 340px;

    padding: 7px;

    overflow-y: auto;

    visibility: hidden;

    opacity: 0;

    transform:
        translateY(-7px);

    pointer-events: none;

    border:
        1px solid #dce4ee;

    border-radius: 13px;

    background: #fff;

    box-shadow:
        0 20px 50px
        rgba(15,39,78,.18);

    transition:
        opacity .18s ease,
        transform .18s ease,
        visibility .18s ease;
}


.iamaCourseSelect28__dropdown.is-open
.iamaCourseSelect28__menu {

    visibility: visible;

    opacity: 1;

    transform:
        translateY(0);

    pointer-events: auto;
}


/* MENU ITEM */

.iamaCourseSelect28__menu > button {

    position: relative;

    width: 100%;

    min-height: 65px;

    padding:
        10px 12px;

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    justify-content: center;

    border: 0;

    border-radius: 9px;

    background:
        transparent;

    cursor: pointer;

    text-align: left;

    font-family:
        "Outfit",
        sans-serif !important;

    transition:
        .16s ease;
}


.iamaCourseSelect28__menu > button:hover {

    background:
        #f0f5fc;
}


.iamaCourseSelect28__menu > button.is-selected {

    padding-right:
        42px;

    background:
        #e9f2fd;
}


.iamaCourseSelect28__menu > button.is-selected::after {

    content:
        "✓";

    position: absolute;

    right: 13px;

    top: 50%;

    transform:
        translateY(-50%);

    width: 25px;

    height: 25px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background:
        var(--ics-blue);

    color:
        #fff;

    font-size: 11px;

    font-weight: 800;
}


.iamaCourseSelect28__menu > button strong {

    display: block;

    color: #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 18px;

    line-height: 1.3;

    font-weight: 800;
}


.iamaCourseSelect28__menu > button span {

    display: block;

    margin-top: 3px;

    color:
        #3f5068;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 16px;

    line-height: 1.3;

    font-weight: 500;
}


/* =========================================================
   RESULT
========================================================= */

.iamaCourseSelect28__result {

    margin-top: 20px;

    padding: 20px;

    border:
        1px solid var(--ics-border);

    border-radius: 20px;

    background:
        #fff;

    box-shadow:
        0 14px 40px
        rgba(18,45,88,.055);
}


/* =========================================================
   SELECTED COURSE
========================================================= */

.iamaCourseSelect28__selected {

    padding: 19px 20px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    border:
        1px solid #d7e3f1;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            #edf4ff,
            #fbfcff
        );
}


.iamaCourseSelect28__selected > div:first-child > span {

    display: block;

    color:
        var(--ics-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 13px;

    font-weight: 800;
}


.iamaCourseSelect28__selected h3 {

    margin:
        6px 0 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(27px,2.5vw,34px) !important;

    line-height:
        1.1 !important;

    font-weight:
        800 !important;
}


.iamaCourseSelect28__selected p {

    margin:
        6px 0 0 !important;

    color:
        #111 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 16px !important;

    font-weight: 600 !important;
}


/* COURSE FEE */

.iamaCourseSelect28__courseFee {

    min-width: 185px;

    padding:
        15px 17px;

    flex:
        0 0 auto;

    border-radius: 12px;

    background:
        #082f70;
}


.iamaCourseSelect28__courseFee span {

    display: block;

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 14px;

    font-weight: 600;
}


.iamaCourseSelect28__courseFee strong {

    display: block;

    margin-top: 5px;

    color:
        var(--ics-yellow);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 30px;

    line-height: 1;

    font-weight: 800;
}


/* =========================================================
   PAYMENT HEAD
========================================================= */

.iamaCourseSelect28__payHead {

    margin:
        25px 0 13px;

    display: flex;

    align-items: flex-end;

    justify-content: space-between;

    gap: 25px;
}


.iamaCourseSelect28__payHead span {

    display: block;

    margin-bottom: 4px;

    color:
        var(--ics-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 13px;

    font-weight: 800;
}


.iamaCourseSelect28__payHead h3 {

    margin: 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 29px !important;

    line-height:
        1.08 !important;

    font-weight:
        800 !important;
}


.iamaCourseSelect28__payHead > p {

    max-width: 430px;

    margin:
        0 0 3px !important;

    color:
        #111 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 16px !important;

    line-height:
        1.45 !important;

    font-weight: 500 !important;
}


/* =========================================================
   PAYMENT GRID
========================================================= */

.iamaCourseSelect28__paymentGrid {

    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 15px;
}


.iamaCourseSelect28__paymentGrid.is-single {

    grid-template-columns:
        minmax(0,650px);
}


/* =========================================================
   PLAN
========================================================= */

.iamaCourseSelect28__plan {

    position: relative;

    padding: 21px;

    overflow: hidden;

    border:
        1px solid #dfe6ef;

    border-radius: 17px;

    background:
        #fff;

    box-shadow:
        0 8px 24px
        rgba(18,45,88,.045);
}


.iamaCourseSelect28__plan::before {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 4px;

    background:
        var(--ics-blue);
}


.iamaCourseSelect28__plan--emi::before {

    background:
        var(--ics-yellow);
}


.iamaCourseSelect28__planTop {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;
}


.iamaCourseSelect28__planTop > span {

    color:
        var(--ics-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 14px;

    font-weight: 800;
}


.iamaCourseSelect28__planTop > strong {

    padding:
        6px 10px;

    border-radius:
        50px;

    background:
        #e5eefb;

    color:
        var(--ics-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 12px;

    font-weight: 800;
}


.iamaCourseSelect28__plan--emi
.iamaCourseSelect28__planTop > strong {

    background:
        #fff0bd;

    color:
        #725100;
}


.iamaCourseSelect28__plan h4 {

    margin:
        16px 0 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 27px !important;

    line-height:
        1.1 !important;

    font-weight:
        800 !important;
}


.iamaCourseSelect28__plan > p {

    margin:
        9px 0 0 !important;

    color:
        #111 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 16px !important;

    line-height:
        1.45 !important;

    font-weight: 500 !important;
}


/* PRICE */

.iamaCourseSelect28__price {

    margin-top: 18px;

    color:
        var(--ics-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(40px,4vw,52px);

    line-height: 1;

    font-weight: 800;

    letter-spacing: -1px;
}


/* SAVING */

.iamaCourseSelect28__saving {

    margin-top: 16px;

    padding:
        12px 13px;

    border-radius: 10px;

    background:
        #fff3ca;

    color:
        #3d2d00;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 15px;

    line-height: 1.4;

    font-weight: 700;
}


/* =========================================================
   INSTALLMENT
========================================================= */

.iamaCourseSelect28__installment {

    margin-top: 17px;

    display: grid;

    gap: 8px;
}


.iamaCourseSelect28__installment > div {

    min-height: 66px;

    padding:
        11px 13px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    border:
        1px solid #e1e7ef;

    border-radius: 10px;

    background:
        #f7f9fc;
}


.iamaCourseSelect28__installment span {

    color:
        #111;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 15px;

    font-weight: 600;
}


.iamaCourseSelect28__installment strong {

    color:
        #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 21px;

    font-weight: 800;
}


.iamaCourseSelect28__total {

    margin-top: 8px;

    padding:
        13px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    border-radius: 10px;

    background:
        #082c68;
}


.iamaCourseSelect28__total span {

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 15px;

    font-weight: 600;
}


.iamaCourseSelect28__total strong {

    color:
        var(--ics-yellow);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 24px;

    font-weight: 800;
}


/* =========================================================
   BUTTON
========================================================= */

.iamaCourseSelect28__payBtn {

    width: 100%;

    min-height: 54px;

    margin-top: 18px;

    padding:
        0 17px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    border-radius: 10px;

    background:
        linear-gradient(
            120deg,
            #083d92,
            #0d64d1
        );

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 16px;

    font-weight: 800;

    text-decoration: none !important;

    transition:
        .2s ease;
}


.iamaCourseSelect28__payBtn > span {

    color:
        var(--ics-yellow);

    font-size: 20px;

    font-weight: 800;
}


.iamaCourseSelect28__payBtn:hover {
    color:#ffc12d;

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 28px
        rgba(8,61,146,.20);
}


.iamaCourseSelect28__payBtn--gold {

    color:
        #071c43;

    background:
        linear-gradient(
            120deg,
            #ffd35e,
            #e8a71d
        );
}


.iamaCourseSelect28__payBtn--gold > span {

    color:
        #071c43;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaCourseSelect28__intro {

        align-items:
            flex-start;

        flex-direction:
            column;

        gap: 7px;
    }


    .iamaCourseSelect28__panel {

        grid-template-columns:
            1fr;
    }


    .iamaCourseSelect28__panelTitle {

        min-height:
            auto;
    }


    .iamaCourseSelect28__paymentGrid {

        grid-template-columns:
            1fr;
    }


    .iamaCourseSelect28__paymentGrid.is-single {

        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaCourseSelect28 {

        padding:
            18px 0 38px;
    }


    .iamaCourseSelect28__intro {

        margin-bottom:
            13px;
    }


    .iamaCourseSelect28__intro > div > span {

        font-size:
            12px;
    }


    .iamaCourseSelect28__intro h2 {

        font-size:
            29px !important;
    }


    .iamaCourseSelect28__intro > p {

        font-size:
            15px !important;
    }


    .iamaCourseSelect28__panel {

        padding:
            12px;

        gap:
            14px;

        border-radius:
            15px;
    }


    .iamaCourseSelect28__panelTitle {

        padding:
            14px;

        border-radius:
            11px;
    }


    .iamaCourseSelect28__step {

        width:
            44px;

        height:
            44px;

        flex-basis:
            44px;

        font-size:
            15px;
    }


    .iamaCourseSelect28__panelTitle span {

        font-size:
            11px;
    }


    .iamaCourseSelect28__panelTitle h3 {

        font-size:
            18px !important;
    }


    .iamaCourseSelect28__controls {

        grid-template-columns:
            1fr;

        gap:
            11px;
    }


    .iamaCourseSelect28__field > label {

        font-size:
            14px;
    }


    .iamaCourseSelect28__trigger {

        min-height:
            55px;

        padding:
            0 11px 0 13px;
    }


    .iamaCourseSelect28__current {

        font-size:
            15px;
    }


    .iamaCourseSelect28__menu {

        max-height:
            290px;
    }


    .iamaCourseSelect28__menu > button {

        min-height:
            61px;

        padding:
            9px 10px;
    }


    .iamaCourseSelect28__menu > button strong {

        font-size:
            14px;
    }


    .iamaCourseSelect28__menu > button span {

        font-size:
            12px;
    }


    .iamaCourseSelect28__result {

        margin-top:
            15px;

        padding:
            12px;

        border-radius:
            15px;
    }


    .iamaCourseSelect28__selected {

        padding:
            15px;

        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            13px;
    }


    .iamaCourseSelect28__selected h3 {

        font-size:
            23px !important;
    }


    .iamaCourseSelect28__selected p {

        font-size:
            14px !important;
    }


    .iamaCourseSelect28__courseFee {

        width:
            100%;

        min-width:
            0;
    }


    .iamaCourseSelect28__courseFee strong {

        font-size:
            27px;
    }


    .iamaCourseSelect28__payHead {

        margin:
            19px 0 10px;

        display:
            block;
    }


    .iamaCourseSelect28__payHead h3 {

        font-size:
            23px !important;
    }


    .iamaCourseSelect28__payHead > p {

        margin-top:
            6px !important;

        font-size:
            14px !important;
    }


    .iamaCourseSelect28__paymentGrid {

        gap:
            11px;
    }


    .iamaCourseSelect28__plan {

        padding:
            16px;

        border-radius:
            14px;
    }


    .iamaCourseSelect28__plan h4 {

        font-size:
            23px !important;
    }


    .iamaCourseSelect28__plan > p {

        font-size:
            15px !important;
    }


    .iamaCourseSelect28__price {

        font-size:
            38px;
    }


    .iamaCourseSelect28__installment span {

        font-size:
            14px;
    }


    .iamaCourseSelect28__installment strong {

        font-size:
            18px;
    }


    .iamaCourseSelect28__payBtn {

        min-height:
            52px;

        font-size:
            14px;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   COMPACT CHECKOUT CONTENT
   DOES NOT TOUCH YOUR EXISTING HERO CSS
========================================================= */

.iamaCheckoutCompact26,
.iamaCheckoutCompact26 *,
.iamaCheckoutCompact26 *::before,
.iamaCheckoutCompact26 *::after {
    box-sizing: border-box;
}


.iamaCheckoutCompact26 {

    --icc-blue: #083d92;
    --icc-blue2: #0d62cf;
    --icc-navy: #071d46;
    --icc-yellow: #ffc12d;
    --icc-green: #168a4e;

    --icc-black: #000;
    --icc-border: #dfe6ef;

    width: 100%;

    padding:
        24px 0 40px;

    font-family:
        "Outfit",
        sans-serif !important;

    background:
        linear-gradient(
            180deg,
            #eff4fa,
            #ffffff
        );
}


/* =========================================================
   MAIN GRID
========================================================= */

.iamaCheckoutCompact26__grid {

    display: grid;

    grid-template-columns:
        minmax(0,1.45fr)
        minmax(330px,.55fr);

    gap:
        18px;

    align-items: start;
}


/* =========================================================
   MAIN CARD
========================================================= */

.iamaCheckoutCompact26__mainCard {

    overflow: hidden;

    border:
        1px solid var(--icc-border);

    border-radius:
        18px;

    background:
        #fff;

    box-shadow:
        0 14px 38px
        rgba(18,45,88,.055);
}


/* =========================================================
   SECTION HEAD
========================================================= */

.iamaCheckoutCompact26__sectionHead {

    min-height:
        78px;

    padding:
        17px 20px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap:
        20px;

    border-bottom:
        1px solid #e7ecf2;
}


.iamaCheckoutCompact26__sectionHead span {

    display: block;

    color:
        var(--icc-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        13px;

    line-height:
        1.2;

    font-weight:
        800;

    letter-spacing:
        .7px;
}


.iamaCheckoutCompact26__sectionHead h2 {

    margin:
        4px 0 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        27px !important;

    line-height:
        1.1 !important;

    font-weight:
        800 !important;
}


.iamaCheckoutCompact26__verified {

    padding:
        7px 12px;

    border-radius:
        50px;

    background:
        #e2f7ea;

    color:
        var(--icc-green) !important;

    font-size:
        13px !important;

    font-weight:
        800 !important;

    letter-spacing:
        0 !important;
}


/* =========================================================
   STUDENT ROW
========================================================= */

.iamaCheckoutCompact26__studentRow {

    padding:
        16px 20px;

    display: grid;

    grid-template-columns:
        auto minmax(180px,.8fr) minmax(0,1.2fr);

    align-items: center;

    gap:
        15px;

    border-bottom:
        1px solid #edf1f5;
}


.iamaCheckoutCompact26__avatar {

    width:
        50px;

    height:
        50px;

    display: grid;

    place-items: center;

    border-radius:
        13px;

    background:
        linear-gradient(
            135deg,
            #083d92,
            #0c62cf
        );

    color:
        #fff;

    font-size:
        20px;

    font-weight:
        800;
}


.iamaCheckoutCompact26__studentMain > span,
.iamaCheckoutCompact26__studentMeta span {

    display: block;

    color:
        #3e4e64;

    font-size:
        14px;

    line-height:
        1.25;

    font-weight:
        600;
}


.iamaCheckoutCompact26__studentMain > strong {

    display: block;

    margin-top:
        4px;

    color:
        #000;

    font-size:
        20px;

    line-height:
        1.2;

    font-weight:
        800;
}


.iamaCheckoutCompact26__studentMain p {

    margin:
        3px 0 0 !important;

    color:
        #111 !important;

    font-size:
        15px !important;

    line-height:
        1.3 !important;

    font-weight:
        600 !important;
}


.iamaCheckoutCompact26__studentMeta {

    display: grid;

    grid-template-columns:
        1.2fr .8fr;

    gap:
        8px;
}


.iamaCheckoutCompact26__studentMeta > div {

    padding:
        11px 12px;

    border-radius:
        10px;

    background:
        #f6f8fb;
}


.iamaCheckoutCompact26__studentMeta strong {

    display: block;

    margin-top:
        4px;

    color:
        #000;

    font-size:
        16px;

    line-height:
        1.3;

    font-weight:
        700;

    overflow-wrap:
        anywhere;
}


/* =========================================================
   COURSE ROW
========================================================= */

.iamaCheckoutCompact26__courseRow {

    padding:
        18px 20px;

    display: grid;

    grid-template-columns:
        minmax(0,1.2fr)
        minmax(300px,.8fr);

    align-items: center;

    gap:
        18px;
}


.iamaCheckoutCompact26__courseMain {

    padding:
        15px 16px;

    border:
        1px solid #dbe5f2;

    border-radius:
        12px;

    background:
        linear-gradient(
            135deg,
            #edf4ff,
            #fafcff
        );
}


.iamaCheckoutCompact26__courseMain > span {

    display: block;

    color:
        var(--icc-blue);

    font-size:
        14px;

    font-weight:
        800;
}


.iamaCheckoutCompact26__courseMain h3 {

    margin:
        5px 0 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        24px !important;

    line-height:
        1.15 !important;

    font-weight:
        800 !important;
}


.iamaCheckoutCompact26__courseMain p {

    margin:
        5px 0 0 !important;

    color:
        #111 !important;

    font-size:
        16px !important;

    font-weight:
        600 !important;
}


/* COURSE SIDE */

.iamaCheckoutCompact26__courseSide {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap:
        8px;
}


.iamaCheckoutCompact26__courseSide > div {

    min-height:
        82px;

    padding:
        12px 13px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border:
        1px solid #e1e7ef;

    border-radius:
        10px;

    background:
        #f7f9fc;
}


.iamaCheckoutCompact26__courseSide span {

    color:
        #39495f;

    font-size:
        14px;

    font-weight:
        600;
}


.iamaCheckoutCompact26__courseSide strong {

    display: block;

    margin-top:
        5px;

    color:
        #000;

    font-size:
        17px;

    line-height:
        1.25;

    font-weight:
        800;
}


.iamaCheckoutCompact26__courseSide .is-price {

    color:
        var(--icc-blue);

    font-size:
        22px;
}


/* =========================================================
   NOTE
========================================================= */

.iamaCheckoutCompact26__note {

    margin:
        0 20px 18px;

    padding:
        11px 13px;

    display: flex;

    align-items: center;

    gap:
        10px;

    border:
        1px solid #d8e3f0;

    border-radius:
        10px;

    background:
        #f3f7fc;
}


.iamaCheckoutCompact26__note > span {

    width:
        28px;

    height:
        28px;

    flex:
        0 0 28px;

    display: grid;

    place-items: center;

    border-radius:
        50%;

    background:
        var(--icc-blue);

    color:
        #fff;

    font-size:
        13px;

    font-weight:
        800;
}


.iamaCheckoutCompact26__note p {

    margin:
        0 !important;

    color:
        #111 !important;

    font-size:
        15px !important;

    line-height:
        1.4 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   PAYMENT SUMMARY
========================================================= */

.iamaCheckoutCompact26__summary {

    position:
        sticky;

    top:
        20px;

    padding:
        22px;

    overflow: hidden;

    border-radius:
        18px;

    background:

        radial-gradient(
            circle at 90% 0,
            rgba(40,120,255,.25),
            transparent 30%
        ),

        linear-gradient(
            135deg,
            #071a3d,
            #082d6a
        );

    box-shadow:
        0 18px 45px
        rgba(5,25,60,.18);
}


.iamaCheckoutCompact26__summaryEyebrow {

    display: block;

    color:
        var(--icc-yellow);

    font-size:
        13px;

    font-weight:
        800;

    letter-spacing:
        .8px;
}


.iamaCheckoutCompact26__summary h2 {

    margin:
        5px 0 0 !important;

    color:
        #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        29px !important;

    line-height:
        1.1 !important;

    font-weight:
        800 !important;
}


/* SUMMARY LIST */

.iamaCheckoutCompact26__summaryList {

    margin-top:
        18px;

    display: grid;

    gap:
        0;
}


.iamaCheckoutCompact26__summaryList > div {

    min-height:
        49px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap:
        15px;

    border-bottom:
        1px solid rgba(255,255,255,.11);
}


.iamaCheckoutCompact26__summaryList span {

    color:
        rgba(255,255,255,.83);

    font-size:
        15px;

    font-weight:
        500;
}


.iamaCheckoutCompact26__summaryList strong {

    color:
        #fff;

    font-size:
        17px;

    font-weight:
        700;
}


/* =========================================================
   PAY AMOUNT
========================================================= */

.iamaCheckoutCompact26__payAmount {

    margin-top:
        18px;

    padding:
        15px;

    border:
        1px solid rgba(255,255,255,.11);

    border-radius:
        12px;

    background:
        rgba(255,255,255,.08);
}


.iamaCheckoutCompact26__payAmount span {

    display: block;

    color:
        rgba(255,255,255,.78);

    font-size:
        14px;

    font-weight:
        600;
}


.iamaCheckoutCompact26__payAmount strong {

    display: block;

    margin-top:
        5px;

    color:
        var(--icc-yellow);

    font-size:
        36px;

    line-height:
        1;

    font-weight:
        800;

    letter-spacing:
        -.7px;
}


/* =========================================================
   PAY BUTTON
========================================================= */

.iamaCheckoutCompact26__payBtn {

    width:
        100%;

    min-height:
        54px;

    margin-top:
        14px;

    padding:
        0 17px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap:
        8px;

    border-radius:
        10px;

    background:
        linear-gradient(
            120deg,
            #ffd35d,
            #e6a41c
        );

    color:
        #071a3d;

    font-size:
        16px;

    font-weight:
        800;

    text-decoration:
        none !important;

    transition:
        .2s ease;
}


.iamaCheckoutCompact26__payBtn span {

    font-size:
        20px;
}


.iamaCheckoutCompact26__payBtn:hover {

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 25px
        rgba(255,193,45,.18);
}


.iamaCheckoutCompact26__secure {

    margin:
        10px 0 0 !important;

    color:
        rgba(255,255,255,.73) !important;

    font-size:
        14px !important;

    text-align:
        center;

    font-weight:
        500 !important;
}


/* =========================================================
   BACK
========================================================= */

.iamaCheckoutCompact26__back {

    margin-top:
        15px;
}


.iamaCheckoutCompact26__back a {

    color:
        var(--icc-blue);

    font-size:
        15px;

    font-weight:
        700;

    text-decoration:
        none;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaCheckoutCompact26__grid {

        grid-template-columns:
            1fr;
    }


    .iamaCheckoutCompact26__summary {

        position:
            static;
    }


    .iamaCheckoutCompact26__studentRow {

        grid-template-columns:
            auto 1fr;
    }


    .iamaCheckoutCompact26__studentMeta {

        grid-column:
            1 / -1;

        grid-template-columns:
            1fr 1fr;
    }


    .iamaCheckoutCompact26__courseRow {

        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaCheckoutCompact26 {

        padding:
            16px 0 32px;
    }


    .iamaCheckoutCompact26__grid {

        gap:
            12px;
    }


    .iamaCheckoutCompact26__mainCard,
    .iamaCheckoutCompact26__summary {

        border-radius:
            14px;
    }


    .iamaCheckoutCompact26__sectionHead {

        min-height:
            auto;

        padding:
            15px;

        align-items:
            flex-start;
    }


    .iamaCheckoutCompact26__sectionHead h2 {

        font-size:
            22px !important;
    }


    .iamaCheckoutCompact26__verified {

        padding:
            6px 9px;

        font-size:
            11px !important;
    }


    .iamaCheckoutCompact26__studentRow {

        padding:
            14px 15px;

        grid-template-columns:
            auto 1fr;

        gap:
            11px;
    }


    .iamaCheckoutCompact26__avatar {

        width:
            44px;

        height:
            44px;

        font-size:
            17px;
    }


    .iamaCheckoutCompact26__studentMain > strong {

        font-size:
            18px;
    }


    .iamaCheckoutCompact26__studentMeta {

        grid-template-columns:
            1fr;

        gap:
            6px;
    }


    .iamaCheckoutCompact26__studentMeta > div {

        padding:
            10px;
    }


    .iamaCheckoutCompact26__studentMeta strong {

        font-size:
            15px;
    }


    .iamaCheckoutCompact26__courseRow {

        padding:
            14px 15px;

        gap:
            9px;
    }


    .iamaCheckoutCompact26__courseMain {

        padding:
            13px;
    }


    .iamaCheckoutCompact26__courseMain h3 {

        font-size:
            21px !important;
    }


    .iamaCheckoutCompact26__courseMain p {

        font-size:
            14px !important;
    }


    .iamaCheckoutCompact26__courseSide {

        grid-template-columns:
            1fr 1fr;

        gap:
            6px;
    }


    .iamaCheckoutCompact26__courseSide > div {

        min-height:
            70px;

        padding:
            10px;
    }


    .iamaCheckoutCompact26__courseSide span {

        font-size:
            12px;
    }


    .iamaCheckoutCompact26__courseSide strong {

        font-size:
            15px;
    }


    .iamaCheckoutCompact26__courseSide .is-price {

        font-size:
            18px;
    }


    .iamaCheckoutCompact26__note {

        margin:
            0 15px 14px;

        padding:
            10px;
    }


    .iamaCheckoutCompact26__note p {

        font-size:
            13px !important;
    }


    .iamaCheckoutCompact26__summary {

        padding:
            18px 16px;
    }


    .iamaCheckoutCompact26__summary h2 {

        font-size:
            25px !important;
    }


    .iamaCheckoutCompact26__summaryList span {

        font-size:
            14px;
    }


    .iamaCheckoutCompact26__summaryList strong {

        font-size:
            15px;
    }


    .iamaCheckoutCompact26__payAmount strong {

        font-size:
            31px;
    }


    .iamaCheckoutCompact26__payBtn {

        min-height:
            51px;

        font-size:
            15px;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   PAYMENT DONE 27
========================================================= */

.iamaPaymentDone27,
.iamaPaymentDone27 *,
.iamaPaymentDone27 *::before,
.iamaPaymentDone27 *::after {
    box-sizing: border-box;
}


.iamaPaymentDone27 {

    --ipd-blue: #083d92;
    --ipd-blue2: #0d62cf;

    --ipd-navy: #061831;
    --ipd-navy2: #082a61;

    --ipd-yellow: #ffc12d;
    --ipd-green: #168a4e;

    --ipd-black: #000;
    --ipd-text: #111;
    --ipd-border: #dfe6ee;

    width: 100%;

    font-family: "Outfit", sans-serif !important;

    color: #000;
}


/* =========================================================
   HERO
========================================================= */

.iamaPaymentDone27__hero {

    position: relative;

    overflow: hidden;

    padding:
        200px 0 32px;

    background:
        radial-gradient(
            circle at 50% -20%,
            rgba(48,127,255,.26),
            transparent 42%
        ),
        linear-gradient(
            120deg,
            #061831 0%,
            #082b62 56%,
            #0a438e 100%
        );
}


.iamaPaymentDone27__heroGlow {

    position: absolute;

    top: -240px;
    left: 50%;

    width: 470px;
    height: 470px;

    transform: translateX(-50%);

    border-radius: 50%;

    background:
        rgba(49,128,255,.11);

    filter: blur(15px);
}


.iamaPaymentDone27__heroInner {

    position: relative;

    z-index: 2;

    max-width: 720px;

    margin: 0 auto;

    text-align: center;
}


/* TICK */

.iamaPaymentDone27__tick {

    width: 58px;
    height: 58px;

    margin:
        0 auto 11px;

    display: grid;

    place-items: center;

    border:
        5px solid rgba(255,255,255,.15);

    border-radius: 50%;

    background:
        #1a9655;

    box-shadow:
        0 12px 32px
        rgba(12,115,62,.28);
}


.iamaPaymentDone27__tick svg {

    width: 28px;
    height: 28px;

    fill: #fff;
}


.iamaPaymentDone27__eyebrow {

    display: block;

    color:
        var(--ipd-yellow);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 13px;

    line-height: 1.2;

    font-weight: 800;

    letter-spacing: 1px;
}


.iamaPaymentDone27__hero h1 {

    margin:
        7px 0 0 !important;

    color: #fff !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(38px,4vw,52px) !important;

    line-height:
        1.02 !important;

    font-weight:
        700 !important;

    letter-spacing:
        -.8px !important;
}


.iamaPaymentDone27__hero h1 strong {

    color:
        var(--ipd-yellow);

    font-weight: 800;
}


.iamaPaymentDone27__hero p {

    max-width: 620px;

    margin:
        10px auto 0 !important;

    color:
        rgba(255,255,255,.88) !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        17px !important;

    line-height:
        1.5 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   BODY
========================================================= */

.iamaPaymentDone27__body {

    padding:
        22px 0 42px;

    background:
        linear-gradient(
            180deg,
            #eef3f9 0%,
            #ffffff 100%
        );
}


/* =========================================================
   RECEIPT
========================================================= */

.iamaPaymentDone27__receipt {

    overflow: hidden;

    border:
        1px solid var(--ipd-border);

    border-radius:
        20px;

    background:
        #fff;

    box-shadow:
        0 16px 45px
        rgba(18,45,88,.07);
}


/* =========================================================
   RECEIPT TOP
========================================================= */

.iamaPaymentDone27__receiptTop {

    min-height: 86px;

    padding:
        18px 22px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-bottom:
        1px solid #e8edf3;
}


.iamaPaymentDone27__receiptTop > div:first-child > span {

    display: block;

    margin-bottom: 4px;

    color:
        var(--ipd-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: .9px;
}


.iamaPaymentDone27__receiptTop h2 {

    margin: 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        28px !important;

    line-height:
        1.08 !important;

    font-weight:
        800 !important;
}


/* PAID BADGE */

.iamaPaymentDone27__paidBadge {

    min-height: 38px;

    padding:
        0 13px;

    display: inline-flex;

    align-items: center;

    gap: 6px;

    border-radius: 50px;

    background:
        #e1f6e9;

    color:
        var(--ipd-green);

    font-size: 18px;

    font-weight: 800;
}


.iamaPaymentDone27__paidBadge span {

    width: 20px;
    height: 20px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background:
        var(--ipd-green);

    color: #fff;

    font-size: 10px;
}


/* =========================================================
   MAIN GRID
========================================================= */

.iamaPaymentDone27__grid {

    display: grid;

    grid-template-columns:
        minmax(0,1.25fr)
        minmax(330px,.75fr);

    align-items: stretch;
}


/* =========================================================
   LEFT SIDE
========================================================= */

.iamaPaymentDone27__left {

    padding: 20px 22px;

    border-right:
        1px solid #e8edf3;
}


/* =========================================================
   STUDENT
========================================================= */

.iamaPaymentDone27__student {

    display: flex;

    align-items: center;

    gap: 14px;
}


.iamaPaymentDone27__avatar {

    width: 52px;
    height: 52px;

    flex:
        0 0 52px;

    display: grid;

    place-items: center;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            var(--ipd-blue),
            var(--ipd-blue2)
        );

    color: #fff;

    font-size: 20px;

    font-weight: 800;
}


.iamaPaymentDone27__studentCopy > span {

    display: block;

    color:
        #40516a;

    font-size: 14px;

    font-weight: 600;
}


.iamaPaymentDone27__studentCopy h3 {

    margin:
        3px 0 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        22px !important;

    line-height:
        1.15 !important;

    font-weight:
        800 !important;
}


.iamaPaymentDone27__studentCopy p {

    margin:
        4px 0 0 !important;

    color:
        #111 !important;

    font-size:
        15px !important;

    line-height:
        1.35 !important;

    font-weight:
        500 !important;
}


.iamaPaymentDone27__studentCopy p strong {

    color: #000;

    font-weight: 800;
}


/* =========================================================
   CONTACT
========================================================= */

.iamaPaymentDone27__contact {

    margin-top: 16px;

    padding:
        9px;

    display: grid;

    grid-template-columns:
        1.25fr .75fr;

    gap: 8px;

    border:
        1px solid #e1e7ef;

    border-radius: 12px;

    background:
        #f5f8fc;
}


.iamaPaymentDone27__contact > div {

    min-height: 63px;

    padding:
        9px 11px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border-radius: 9px;

    background:
        #fff;
}


.iamaPaymentDone27__contact span {

    color:
        #40516a;

    font-size: 14px;

    line-height: 1.25;

    font-weight: 600;
}


.iamaPaymentDone27__contact strong {

    display: block;

    margin-top: 4px;

    color: #000;

    font-size: 16px;

    line-height: 1.3;

    font-weight: 700;

    overflow-wrap: anywhere;
}


/* =========================================================
   COURSE
========================================================= */

.iamaPaymentDone27__course {

    margin-top: 13px;

    padding:
        15px 16px;

    border:
        1px solid #d9e4f1;

    border-radius: 12px;

    background:
        linear-gradient(
            135deg,
            #eef5ff,
            #fafcff
        );
}


.iamaPaymentDone27__course > span {

    display: block;

    color:
        var(--ipd-blue);

    font-size: 14px;

    font-weight: 700;
}


.iamaPaymentDone27__course h3 {

    margin:
        5px 0 0 !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        24px !important;

    line-height:
        1.15 !important;

    font-weight:
        800 !important;
}


.iamaPaymentDone27__courseMeta {

    margin-top: 7px;

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;
}


.iamaPaymentDone27__courseMeta strong {

    color:
        #222;

    font-size: 15px;

    font-weight: 600;
}


.iamaPaymentDone27__courseMeta i {

    width: 4px;
    height: 4px;

    border-radius: 50%;

    background:
        #8d99aa;
}


/* =========================================================
   PAYMENT SIDE
========================================================= */

.iamaPaymentDone27__payment {
border-radius: 18px;
    padding: 22px;

    background:
        linear-gradient(
            145deg,
            #071b40,
            #082f70
        );
}


.iamaPaymentDone27__paymentLabel {

    display: block;

    color:
        rgba(255,255,255,.75);

    font-size: 14px;

    font-weight: 700;

    letter-spacing: .6px;
}


.iamaPaymentDone27__amount {

    display: block;

    margin-top: 5px;

    color:
        var(--ipd-yellow);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        clamp(36px,4vw,44px);

    line-height: 1;

    font-weight: 800;

    letter-spacing: -1px;
}


.iamaPaymentDone27__payment > p {

    margin:
        9px 0 0 !important;

    color:
        rgba(255,255,255,.84) !important;

    font-size:
        16px !important;

    line-height:
        1.4 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   PAYMENT INFO
========================================================= */

.iamaPaymentDone27__paymentInfo {

    margin-top: 19px;

    border-top:
        1px solid rgba(255,255,255,.12);
}


.iamaPaymentDone27__paymentInfo > div {

    min-height: 57px;

    padding:
        9px 0;

    display: flex;

    flex-direction: column;

    justify-content: center;

    border-bottom:
        1px solid rgba(255,255,255,.10);
}


.iamaPaymentDone27__paymentInfo span {

    color:
        rgba(255,255,255,.66);

    font-size: 14px;

    font-weight: 500;
}


.iamaPaymentDone27__paymentInfo strong {

    display: block;

    margin-top: 3px;

    color: #fff;

    font-size: 17px;

    line-height: 1.3;

    font-weight: 700;

    overflow-wrap: anywhere;
}


.iamaPaymentDone27__paymentInfo .is-zero {

    color:
        #72e39e;
}


/* =========================================================
   COMPLETE NOTE
========================================================= */

.iamaPaymentDone27__completeNote {

    margin-top: 16px;

    padding:
        11px 12px;

    display: flex;

    align-items: center;

    gap: 10px;

    border:
        1px solid rgba(104,222,146,.25);

    border-radius: 10px;

    background:
        rgba(72,196,116,.10);
}


.iamaPaymentDone27__completeNote > span {

    width: 30px;
    height: 30px;

    flex:
        0 0 30px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background:
        #1b9555;

    color: #fff;

    font-size: 12px;

    font-weight: 800;
}


.iamaPaymentDone27__completeNote strong {

    display: block;

    color: #fff;

    font-size: 15px;

    font-weight: 700;
}


.iamaPaymentDone27__completeNote p {

    margin:
        2px 0 0 !important;

    color:
        rgba(255,255,255,.72) !important;

    font-size:
        13px !important;

    line-height:
        1.3 !important;
}


/* =========================================================
   BOTTOM
========================================================= */

.iamaPaymentDone27__bottom {

    min-height: 78px;

    padding:
        14px 22px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    border-top:
        1px solid #e6ebf1;

    background:
        #fbfcfe;
}


.iamaPaymentDone27__bottom p {

    max-width: 650px;

    margin: 0 !important;

    color:
        #111 !important;

    font-size:
        16px !important;

    line-height:
        1.45 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   ACCOUNT BUTTON
========================================================= */

.iamaPaymentDone27__accountBtn {

    min-height: 49px;

    padding:
        0 18px;

    flex:
        0 0 auto;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    border-radius: 10px;

    background:
        linear-gradient(
            120deg,
            var(--ipd-blue),
            var(--ipd-blue2)
        );

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 15px;

    font-weight: 800;

    text-decoration:
        none !important;

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


.iamaPaymentDone27__accountBtn span {

    color:
        var(--ipd-yellow);

    font-size: 19px;
}


.iamaPaymentDone27__accountBtn:hover {
    color:#ffc63b;

    transform:
        translateY(-2px);

    box-shadow:
        0 11px 25px
        rgba(8,61,146,.18);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .iamaPaymentDone27__grid {

        grid-template-columns:
            1fr;
    }


    .iamaPaymentDone27__left {

        border-right: 0;

        border-bottom:
            1px solid #e8edf3;
    }


    .iamaPaymentDone27__payment {

        border-radius: 0;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaPaymentDone27__hero {

        padding:
            27px 0 25px;
    }


    .iamaPaymentDone27__tick {

        width: 52px;
        height: 52px;

        margin-bottom: 9px;
    }


    .iamaPaymentDone27__tick svg {

        width: 25px;
        height: 25px;
    }


    .iamaPaymentDone27__eyebrow {

        font-size: 11px;
    }


    .iamaPaymentDone27__hero h1 {

        font-size:
            33px !important;
    }


    .iamaPaymentDone27__hero p {

        padding:
            0 7px;

        font-size:
            15px !important;
    }


    .iamaPaymentDone27__body {

        padding:
            14px 0 30px;
    }


    .iamaPaymentDone27__receipt {

        border-radius: 14px;
    }


    .iamaPaymentDone27__receiptTop {

        min-height: auto;

        padding:
            14px;

        align-items:
            flex-start;

        gap: 10px;
    }


    .iamaPaymentDone27__receiptTop > div:first-child > span {

        font-size: 11px;
    }


    .iamaPaymentDone27__receiptTop h2 {

        font-size:
            21px !important;
    }


    .iamaPaymentDone27__paidBadge {

        min-height: 32px;

        padding:
            0 9px;

        font-size: 11px;
    }


    .iamaPaymentDone27__left {

        padding:
            14px;
    }


    .iamaPaymentDone27__student {

        gap: 10px;
    }


    .iamaPaymentDone27__avatar {

        width: 45px;
        height: 45px;

        flex-basis: 45px;

        border-radius: 11px;

        font-size: 17px;
    }


    .iamaPaymentDone27__studentCopy > span {

        font-size: 12px;
    }


    .iamaPaymentDone27__studentCopy h3 {

        font-size:
            19px !important;
    }


    .iamaPaymentDone27__studentCopy p {

        font-size:
            13px !important;
    }


    .iamaPaymentDone27__contact {

        margin-top: 12px;

        grid-template-columns:
            1fr;

        gap: 6px;
    }


    .iamaPaymentDone27__contact > div {

        min-height: 56px;
    }


    .iamaPaymentDone27__contact span {

        font-size: 12px;
    }


    .iamaPaymentDone27__contact strong {

        font-size: 15px;
    }


    .iamaPaymentDone27__course {

        margin-top: 10px;

        padding: 13px;
    }


    .iamaPaymentDone27__course > span {

        font-size: 12px;
    }


    .iamaPaymentDone27__course h3 {

        font-size:
            21px !important;
    }


    .iamaPaymentDone27__courseMeta {

        gap: 6px;
    }


    .iamaPaymentDone27__courseMeta strong {

        font-size: 13px;
    }


    .iamaPaymentDone27__payment {

        padding:
            17px 15px;
    }


    .iamaPaymentDone27__paymentLabel {

        font-size: 12px;
    }


    .iamaPaymentDone27__amount {

        font-size: 34px;
    }


    .iamaPaymentDone27__payment > p {

        font-size:
            14px !important;
    }


    .iamaPaymentDone27__paymentInfo {

        margin-top: 14px;
    }


    .iamaPaymentDone27__paymentInfo > div {

        min-height: 53px;
    }


    .iamaPaymentDone27__paymentInfo span {

        font-size: 12px;
    }


    .iamaPaymentDone27__paymentInfo strong {

        font-size: 15px;
    }


    .iamaPaymentDone27__bottom {

        min-height: auto;

        padding:
            14px;

        align-items:
            flex-start;

        flex-direction:
            column;

        gap: 12px;
    }


    .iamaPaymentDone27__bottom p {

        font-size:
            14px !important;
    }


    .iamaPaymentDone27__accountBtn {

        width: 100%;

        min-height: 48px;
    }

}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');


/* =========================================================
   FINAL EDIT PROFILE
   IMPORTANT:
   iamaAccountPro26 CSS IS NOT TOUCHED
========================================================= */

.iamaEditFinal26,
.iamaEditFinal26 *,
.iamaEditFinal26 *::before,
.iamaEditFinal26 *::after {
    box-sizing: border-box;
}


.iamaEditFinal26 {

    --ief-blue: #083d92;
    --ief-blue2: #0d62cf;
    --ief-yellow: #ffc12d;

    --ief-black: #000;
    --ief-border: #d6e0eb;
    --ief-input: #f5f8fc;

    width: 100%;

    padding: 22px 0 38px;

    font-family: "Outfit", sans-serif !important;

    background:
        linear-gradient(
            180deg,
            #f0f5fa 0%,
            #ffffff 100%
        );
}


/* =========================================================
   FORM
========================================================= */

.iamaEditFinal26__form {

    width: 100%;

    overflow: hidden;

    border:
        1px solid #dce4ed;

    border-radius: 18px;

    background: #fff;

    box-shadow:
        0 14px 38px
        rgba(18,45,88,.055);
}


/* =========================================================
   FORM HEADER
========================================================= */

.iamaEditFinal26__head {

    min-height: 82px;

    padding:
        17px 22px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    border-bottom:
        1px solid #e5ebf2;
}


.iamaEditFinal26__head span {

    display: block;

    margin-bottom: 5px;

    color:
        var(--ief-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 14px;

    line-height: 1.2;

    font-weight: 800;

    letter-spacing: .7px;
}


.iamaEditFinal26__head h2 {

    margin: 0 !important;

    color: #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 30px !important;

    line-height: 1.05 !important;

    letter-spacing: -.4px !important;

    font-weight: 800 !important;
}


.iamaEditFinal26__head p {

    margin: 0 !important;

    color: #111 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 17px !important;

    line-height: 1.4 !important;

    font-weight: 500 !important;
}


/* =========================================================
   ONE MASTER GRID
========================================================= */

.iamaEditFinal26__grid {

    width: 100%;

    padding:
        20px 22px;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    column-gap: 14px;

    row-gap: 16px;

    align-items: end;
}


/* 50% WIDTH ADDRESS */

.iamaEditFinal26__field--half {

    grid-column:
        span 2;
}


/* =========================================================
   EVERY FIELD
========================================================= */

.iamaEditFinal26__field {

    min-width: 0;

    width: 100%;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;
}


.iamaEditFinal26__field label {

    display: block;

    min-height: 20px;

    margin:
        0 0 7px;

    color: #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 16px;

    line-height: 20px;

    font-weight: 700;
}


/* =========================================================
   ALL STANDARD INPUTS
========================================================= */

.iamaEditFinal26__field input:not([type="file"]) {

    display: block !important;

    width: 100% !important;

    height: 54px !important;

    min-height: 54px !important;

    margin: 0 !important;

    padding:
        0 15px !important;

    border:
        1px solid var(--ief-border) !important;

    border-radius:
        10px !important;

    outline:
        none !important;

    background:
        var(--ief-input) !important;

    color:
        #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        17px !important;

    line-height:
        1.3 !important;

    font-weight:
        600 !important;

    box-shadow:
        none !important;

    transition:
        .2s ease;
}


.iamaEditFinal26__field
input:not([type="file"])::placeholder {

    color:
        #748296 !important;

    opacity:
        1;
}


/* HOVER */

.iamaEditFinal26__field
input:not([type="file"]):hover {

    border-color:
        #b9c7d8 !important;

    background:
        #fff !important;
}


/* FOCUS */

.iamaEditFinal26__field
input:not([type="file"]):focus {

    border-color:
        var(--ief-blue) !important;

    background:
        #fff !important;

    box-shadow:
        0 0 0 4px
        rgba(8,61,146,.07) !important;
}


/* =========================================================
   DATALIST INPUTS
   Gender / Country / State
========================================================= */

.iamaEditFinal26__field input[list] {

    padding-right:
        40px !important;

    cursor: pointer;
}


/* remove weird browser appearance where possible */

.iamaEditFinal26__field input::-webkit-calendar-picker-indicator {

    cursor: pointer;
}


/* DATE */

.iamaEditFinal26__field input[type="date"] {

    color-scheme: light;

    cursor: pointer;
}


/* =========================================================
   FILE INPUTS
========================================================= */

.iamaEditFinal26__field input[type="file"] {

    display: block !important;

    width: 100% !important;

    height: 54px !important;

    min-height: 54px !important;

    margin: 0 !important;

    padding:
        8px 10px !important;

    border:
        1px solid var(--ief-border) !important;

    border-radius:
        10px !important;

    outline:
        none !important;

    background:
        var(--ief-input) !important;

    color: #000 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        15px !important;

    line-height:
        36px !important;

    font-weight:
        600 !important;

    cursor: pointer;
}


.iamaEditFinal26__field
input[type="file"]::file-selector-button {

    height: 36px;

    margin:
        0 12px 0 0;

    padding:
        0 14px;

    border: 0;

    border-radius: 7px;

    background:
        #e4edf9;

    color:
        var(--ief-blue);

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 13px;

    font-weight: 800;

    cursor: pointer;
}


/* =========================================================
   ACTION BAR
========================================================= */

.iamaEditFinal26__actions {

    min-height: 68px;

    padding:
        10px 22px;

    display: flex;

    align-items: center;

    justify-content: flex-end;

    gap: 9px;

    border-top:
        1px solid #e5ebf2;

    background:
        #f8fafc;
}


/* CANCEL */

.iamaEditFinal26__cancel {

    min-width: 105px;

    height: 47px;

    padding:
        0 18px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border:
        1px solid #d5dfeb;

    border-radius: 9px;

    background: #fff;

    color: #111;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none !important;

    transition: .2s ease;
}


.iamaEditFinal26__cancel:hover {

    border-color:
        #b9c7d8;

    background:
        #f7f9fc;
}


/* SAVE */

.iamaEditFinal26__save {

    min-width: 155px;

    height: 47px;

    padding:
        0 18px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    border: 0;

    border-radius: 9px;

    background:
        linear-gradient(
            120deg,
            var(--ief-blue),
            var(--ief-blue2)
        );

    color: #fff;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size: 15px;

    font-weight: 800;

    cursor: pointer;

    transition: .2s ease;
}


.iamaEditFinal26__save span {

    color:
        var(--ief-yellow);

    font-size: 19px;

    line-height: 1;

    font-weight: 800;
}


.iamaEditFinal26__save:hover {

    transform:
        translateY(-1px);

    box-shadow:
        0 10px 24px
        rgba(8,61,146,.18);
}


/* =========================================================
   MEDIUM DESKTOP
========================================================= */

@media (max-width: 1100px) {

    .iamaEditFinal26__grid {

        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }


    .iamaEditFinal26__field--half {

        grid-column:
            span 1;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 800px) {

    .iamaEditFinal26__head {

        min-height: auto;

        align-items: flex-start;

        flex-direction: column;

        gap: 5px;
    }


    .iamaEditFinal26__grid {

        padding:
            17px;

        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:
            14px 12px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaEditFinal26 {

        padding:
            15px 0 30px;
    }


    .iamaEditFinal26__form {

        border-radius:
            14px;
    }


    .iamaEditFinal26__head {

        padding:
            14px;
    }


    .iamaEditFinal26__head span {

        margin-bottom:
            4px;

        font-size:
            11px;
    }


    .iamaEditFinal26__head h2 {

        font-size:
            23px !important;
    }


    .iamaEditFinal26__head p {

        font-size:
            14px !important;
    }


    .iamaEditFinal26__grid {

        padding:
            14px;

        grid-template-columns:
            1fr;

        row-gap:
            11px;

        column-gap:
            0;
    }


    .iamaEditFinal26__field--half {

        grid-column:
            auto;
    }


    .iamaEditFinal26__field label {

        min-height:
            auto;

        margin-bottom:
            6px;

        font-size:
            14px;

        line-height:
            1.3;
    }


    .iamaEditFinal26__field
    input:not([type="file"]) {

        height:
            50px !important;

        min-height:
            50px !important;

        padding:
            0 12px !important;

        font-size:
            15px !important;
    }


    .iamaEditFinal26__field input[type="file"] {

        height:
            51px !important;

        min-height:
            51px !important;

        padding:
            7px 8px !important;

        font-size:
            14px !important;
    }


    .iamaEditFinal26__actions {

        min-height:
            auto;

        padding:
            11px 14px;

        display: grid;

        grid-template-columns:
            1fr 1fr;

        gap:
            8px;
    }


    .iamaEditFinal26__cancel,
    .iamaEditFinal26__save {

        width: 100%;

        min-width: 0;

        height: 46px;

        font-size: 14px;
    }

}

/* =========================================================
   INSTALLMENT LIST
========================================================= */

.iamaPaymentLite26__installmentList {

    margin:
        0 20px 14px;

    overflow:
        hidden;

    border:
        1px solid #d8e3ef;

    border-radius:
        14px;

    background:
        #fff;
}


/* =========================================================
   INSTALLMENT ROW
========================================================= */

.iamaPaymentLite26__installmentItem {

    width: 100%;

    min-height:
        102px;

    padding:
        16px 18px;

    display: grid;

    grid-template-columns:
        54px
        minmax(320px,1fr)
        180px
        115px
        130px;

    align-items:
        center;

    column-gap:
        18px;

    border-bottom:
        1px solid #e5ebf2;

    background:
        #fff;
}


.iamaPaymentLite26__installmentItem:last-child {
    border-bottom: 0;
}


.iamaPaymentLite26__installmentItem.is-pending {

    background:
        #fbfcfe;
}


/* =========================================================
   INSTALLMENT 1
   No action button = let status use final column cleanly
========================================================= */

.iamaPaymentLite26__installmentItem.is-paid {

    grid-template-columns:
        54px
        minmax(320px,1fr)
        180px
        130px;
}


.iamaPaymentLite26__installmentItem.is-paid
.iamaPaymentLite26__installmentStatus {

    justify-self:
        end;
}


/* =========================================================
   NUMBER
========================================================= */

.iamaPaymentLite26__installmentNo {

    width:
        52px;

    height:
        52px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        12px;

    background:
        #e8f1fc;

    color:
        #083d92;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        15px;

    line-height:
        1;

    font-weight:
        800;
}


/* =========================================================
   MAIN INFO
========================================================= */

.iamaPaymentLite26__installmentMain {

    min-width:
        0;
}


.iamaPaymentLite26__installmentMain > span {

    display:
        block;

    margin-bottom:
        4px;

    color:
        #083d92;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        13px;

    line-height:
        1.2;

    font-weight:
        800;

    letter-spacing:
        .6px;
}


.iamaPaymentLite26__installmentMain > strong {

    display:
        block;

    color:
        #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        22px;

    line-height:
        1.15;

    font-weight:
        800;
}


.iamaPaymentLite26__installmentMain p {

    margin:
        6px 0 0 !important;

    color:
        #111 !important;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        16px !important;

    line-height:
        1.35 !important;

    font-weight:
        500 !important;
}


/* =========================================================
   AMOUNT
========================================================= */

.iamaPaymentLite26__installmentMeta {

    width: 100%;

    min-width: 0;
}


.iamaPaymentLite26__installmentMeta span {

    display:
        block;

    margin-bottom:
        5px;

    color:
        #40516a;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        14px;

    line-height:
        1.2;

    font-weight:
        600;
}


.iamaPaymentLite26__installmentMeta strong {

    display:
        block;

    color:
        #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        22px;

    line-height:
        1.1;

    font-weight:
        800;

    white-space:
        nowrap;
}


/* =========================================================
   STATUS
========================================================= */

.iamaPaymentLite26__installmentStatus {

    width:
        115px;

    min-height:
        40px;

    padding:
        0 13px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    justify-self:
        center;

    border-radius:
        50px;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        15px;

    line-height:
        1;

    font-weight:
        800;

    white-space:
        nowrap;
}


.iamaPaymentLite26__installmentStatus.is-paid {

    color:
        #168a4e;

    background:
        #e0f7e8;
}


.iamaPaymentLite26__installmentStatus.is-pending {

    color:
        #8c6200;

    background:
        #fff0bf;
}


/* =========================================================
   PAY NOW
========================================================= */

.iamaPaymentLite26__payNow {

    width:
        130px;

    min-height:
        46px;

    padding:
        0 15px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    justify-self:
        end;

    gap:
        7px;

    border-radius:
        9px;

    background:
        linear-gradient(
            120deg,
            #083d92,
            #0d63d2
        );

    color:
        #fff;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        16px;

    line-height:
        1;

    font-weight:
        800;

    text-decoration:
        none !important;

    white-space:
        nowrap;

    transition:
        .2s ease;
}


.iamaPaymentLite26__payNow span {

    color:
        #ffc12d;

    font-size:
        20px;

    line-height:
        1;
}


.iamaPaymentLite26__payNow:hover {

    transform:
        translateY(-1px);

    box-shadow:
        0 9px 22px
        rgba(8,61,146,.20);
}


/* =========================================================
   FOOT
========================================================= */

.iamaPaymentLite26__remainingText {

    color:
        #000;

    font-family:
        "Outfit",
        sans-serif !important;

    font-size:
        16px;

    line-height:
        1.2;

    font-weight:
        800;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .iamaPaymentLite26__installmentItem {

        grid-template-columns:
            50px
            minmax(250px,1fr)
            150px
            100px
            115px;

        column-gap:
            12px;
    }


    .iamaPaymentLite26__installmentItem.is-paid {

        grid-template-columns:
            50px
            minmax(250px,1fr)
            150px
            100px;
    }


    .iamaPaymentLite26__installmentMain > strong {

        font-size:
            20px;
    }


    .iamaPaymentLite26__installmentMeta strong {

        font-size:
            20px;
    }


    .iamaPaymentLite26__installmentStatus {

        width:
            100px;

        font-size:
            13px;
    }


    .iamaPaymentLite26__payNow {

        width:
            115px;

        font-size:
            14px;
    }

}


/* =========================================================
   TABLET STACK
========================================================= */

@media (max-width: 900px) {

    .iamaPaymentLite26__installmentItem,
    .iamaPaymentLite26__installmentItem.is-paid {

        grid-template-columns:
            48px minmax(0,1fr) auto;

        grid-template-areas:
            "no main status"
            "no amount action";

        row-gap:
            10px;

        column-gap:
            12px;

        align-items:
            center;
    }


    .iamaPaymentLite26__installmentNo {

        grid-area:
            no;

        align-self:
            start;
    }


    .iamaPaymentLite26__installmentMain {

        grid-area:
            main;
    }


    .iamaPaymentLite26__installmentMeta {

        grid-area:
            amount;
    }


    .iamaPaymentLite26__installmentStatus {

        grid-area:
            status;

        justify-self:
            end;
    }


    .iamaPaymentLite26__payNow {

        grid-area:
            action;

        width:
            120px;

        justify-self:
            end;
    }


    /* Installment 1 has no button */
    .iamaPaymentLite26__installmentItem.is-paid
    .iamaPaymentLite26__installmentMeta {

        grid-column:
            2 / 3;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .iamaPaymentLite26__installmentList {

        margin:
            0 12px 10px;

        border-radius:
            11px;
    }


    .iamaPaymentLite26__installmentItem,
    .iamaPaymentLite26__installmentItem.is-paid {

        min-height:
            auto;

        padding:
            13px;

        grid-template-columns:
            42px minmax(0,1fr);

        grid-template-areas:
            "no main"
            "no amount"
            "no status"
            "no action";

        row-gap:
            8px;

        column-gap:
            10px;

        align-items:
            start;
    }


    .iamaPaymentLite26__installmentNo {

        width:
            42px;

        height:
            42px;

        font-size:
            12px;
    }


    .iamaPaymentLite26__installmentMain > span {

        font-size:
            11px;
    }


    .iamaPaymentLite26__installmentMain > strong {

        font-size:
            18px;
    }


    .iamaPaymentLite26__installmentMain p {

        margin-top:
            4px !important;

        font-size:
            14px !important;
    }


    .iamaPaymentLite26__installmentMeta span {

        margin-bottom:
            3px;

        font-size:
            12px;
    }


    .iamaPaymentLite26__installmentMeta strong {

        font-size:
            19px;
    }


    .iamaPaymentLite26__installmentStatus {

        width:
            fit-content;

        min-height:
            31px;

        padding:
            0 10px;

        justify-self:
            start;

        font-size:
            11px;
    }


    .iamaPaymentLite26__payNow {

        width:
            100%;

        min-height:
            43px;

        justify-self:
            stretch;

        font-size:
            14px;
    }

}