/* =========================================================
   CAREER MAKER UNINDIA
   MAIN STYLE SHEET
   TOPBAR + NAVBAR
   Bootstrap 5 Compatible
========================================================= */


/* =========================================================
   01. ROOT VARIABLES
========================================================= */

:root {

    --cm-primary: #173da8;
    --cm-primary-hover: #12328f;
    --cm-primary-dark: #071735;

    --cm-secondary: #6334d8;

    --cm-heading: #17254c;
    --cm-text: #667085;
    --cm-muted: #8791a5;

    --cm-white: #ffffff;
    --cm-black: #000000;

    --cm-border: #e6eaf1;

    --cm-light: #f6f8fd;

    --cm-topbar: #071735;

    --cm-radius-sm: 6px;
    --cm-radius: 8px;
    --cm-radius-lg: 12px;

    --cm-shadow:
        0 8px 30px rgba(17, 38, 85, 0.08);

    --cm-shadow-hover:
        0 12px 35px rgba(17, 38, 85, 0.14);

    --cm-transition:
        all 0.3s ease;

}


/* =========================================================
   02. GLOBAL RESET
========================================================= */

*,
*::before,
*::after {

    margin: 0;
    padding: 0;

    box-sizing: border-box;

}


html {

    scroll-behavior: smooth;

    -webkit-text-size-adjust: 100%;

}


body {

    margin: 0;
    padding: 0;

    font-family:
        "Inter",
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;

    color: var(--cm-heading);

    background:
        var(--cm-white);

    overflow-x: hidden;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}


img {

    max-width: 100%;

    height: auto;

    display: block;

}


a {

    color: inherit;

    text-decoration: none;

}


button,
input,
textarea,
select {

    font-family: inherit;

}


button {

    border: 0;

    outline: 0;

}


ul,
ol {

    margin: 0;

    padding: 0;

    list-style: none;

}


::selection {

    color: var(--cm-white);

    background: var(--cm-primary);

}


/* =========================================================
   03. ACCESSIBILITY
========================================================= */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {

    outline:
        3px solid
        rgba(
            23,
            61,
            168,
            0.25
        );

    outline-offset: 3px;

}


/* =========================================================
   04. TOPBAR
========================================================= */

.topbar {

    position: relative;

    z-index: 1100;

    width: 100%;

    min-height: 38px;

    color: var(--cm-white);

    background:
        linear-gradient(
            90deg,
            #061530 0%,
            #0a1d48 50%,
            #0d2454 100%
        );

    font-size: 10px;

}


.topbar > .container {

    min-height: 38px;

}


/* =========================================================
   TOPBAR INNER
========================================================= */

.topbar-inner {

    min-height: 38px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

}


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

.topbar-left {

    display: flex;

    align-items: center;

    gap: 24px;

}


.topbar-location,
.topbar-phone {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    color:
        rgba(
            255,
            255,
            255,
            0.94
        );

    white-space: nowrap;

}


.topbar-location i,
.topbar-phone i {

    color: #8faaff;

    font-size: 10px;

}


.topbar-phone {

    transition:
        var(--cm-transition);

}


.topbar-phone:hover {

    color: #aabaff;

}


/* =========================================================
   TOPBAR RIGHT
========================================================= */

.topbar-right {

    display: flex;

    align-items: center;

    gap: 22px;

}


.topbar-right a {

    display: inline-flex;

    align-items: center;

    gap: 6px;

    color:
        rgba(
            255,
            255,
            255,
            0.94
        );

    white-space: nowrap;

    transition:
        var(--cm-transition);

}


.topbar-right a i {

    color: #8faaff;

    font-size: 11px;

}


.topbar-right a:hover {

    color: #aabaff;

}



/* =========================================================
   ACTIVE UNDERLINE
========================================================= */

.main-navbar .nav-link.active::after {

    content: "";

    position: absolute;

    left: 10px;

    right: 10px;

    bottom: 0;

    height: 3px;

    border-radius:
        4px 4px 0 0;

    background:
        linear-gradient(
            90deg,
            #1e4ed5,
            #6334d8
        );

}




/* =========================================================
   10. TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .topbar-left {

        gap: 18px;

    }


    .topbar-right {

        gap: 15px;

    }


    .brand {

        margin-right: 12px;

    }


    .brand-name {

        font-size: 16px;

    }


 
}


/* =========================================================
   11. MOBILE NAVBAR
========================================================= */

@media (max-width: 991.98px) {

    /* ---------------- TOPBAR ---------------- */

    .topbar {

        min-height: auto;

        padding:
            7px 0;

    }


    .topbar > .container {

        min-height: auto;

    }


    .topbar-inner {

        min-height: auto;

        flex-direction: column;

        justify-content: center;

        gap: 7px;

    }


    .topbar-left,
    .topbar-right {

        width: 100%;

        justify-content: center;

        flex-wrap: wrap;

        gap:
            6px 15px;

    }


    .topbar-location,
    .topbar-phone,
    .topbar-right a {

        font-size: 9px;

    }

}


/* =========================================================
   12. MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .topbar-left,
    .topbar-right {

        gap:
            5px 12px;

    }


    .topbar-location {

        display: none;

    }



}


/* =========================================================
   13. SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .topbar {

        font-size: 8px;

    }


    .topbar-left,
    .topbar-right {

        gap:
            5px 10px;

    }


    .topbar-phone,
    .topbar-right a {

        font-size: 8px;

    }


    .topbar-right a i,
    .topbar-phone i {

        font-size: 9px;

    }


 

}


/* =========================================================
   14. VERY SMALL DEVICES
========================================================= */

@media (max-width: 380px) {


    .topbar-right {

        gap:
            4px 8px;

    }

}


/* =========================================================
   15. REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion: reduce
) {

    html {

        scroll-behavior: auto;

    }


    *,
    *::before,
    *::after {

        animation-duration:
            0.01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            0.01ms !important;

        scroll-behavior:
            auto !important;

    }

}


/* =========================================================
   STEP 13 — MEGA MENU
========================================================= */


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

.site-header {

    position:
        relative;

    z-index:
        1000;

}


/* =========================================================
   TOPBAR
========================================================= */

.topbar {

    min-height:
        30px;

    background:
        #071735;

    color:
        rgba(
            255,
            255,
            255,
            0.72
        );

    font-size:
        8px;

}


.topbar-inner {

    min-height:
        30px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

}


.topbar-left,
.topbar-right {

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

}


.topbar-left span {

    color:
        rgba(
            255,
            255,
            255,
            0.50
        );

}


.topbar a {

    color:
        #a9bbff;

    font-weight:
        650;

    transition:
        color 0.25s ease;

}


.topbar a:hover {

    color:
        #ffffff;

}


.topbar i {

    margin-right:
        3px;

    font-size:
        8px;

}


.topbar-divider {

    width:
        1px;

    height:
        11px;

    background:
        rgba(
            255,
            255,
            255,
            0.15
        );

}


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

.main-navbar {

    position:
        relative;

    min-height:
        67px;

    background:
        #ffffff;

    border-bottom:
        1px solid #e9edf4;

    box-shadow:
        0 3px 18px
        rgba(
            25,
            47,
            94,
            0.045
        );

}


/* =========================================================
   LOGO
========================================================= */

.cm-navbar-brand {

    display:
        inline-flex !important;

    align-items:
        center;

    gap:
        9px;

    margin-right:
        30px;

}


.cm-logo-mark {

    width:
        39px;

    height:
        39px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #3158d8,
            #6334d8
        );

    border-radius:
        9px;

    font-size:
        10px;

    font-weight:
        900;

}


.cm-logo-name {

    display:
        flex;

    flex-direction:
        column;

    color:
        #17254c;

    font-size:
        13px;

    line-height:
        1;

    font-weight:
        800;

}


.cm-logo-name strong {

    margin-top:
        3px;

    color:
        #3158d8;

    font-size:
        8px;

    letter-spacing:
        1.3px;

    text-transform:
        uppercase;

}


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

.cm-nav-list {

    align-items:
        center;

    gap:
        2px;

}


.cm-nav-link {

    position:
        relative;

    display:
        inline-flex !important;

    align-items:
        center;

    gap:
        5px;

    padding:
        24px 12px !important;

    color:
        #4c5870 !important;

    background:
        transparent;

    border:
        0;

    font-family:
        inherit;

    font-size:
        9px;

    font-weight:
        650;

    line-height:
        1;

    white-space:
        nowrap;

    transition:
        color 0.25s ease;

}


.cm-nav-link::after {

    display:
        none !important;

}


.cm-nav-link i {

    color:
        #8b95a8;

    font-size:
        7px;

    transition:
        transform 0.25s ease;

}


.cm-nav-link:hover,
.cm-nav-link.active {

    color:
        #3158d8 !important;

}


.cm-nav-link:hover i {

    color:
        #3158d8;

}


/* =========================================================
   ACTIVE UNDERLINE
========================================================= */

.cm-nav-link.active::before {

    content:
        "";

    position:
        absolute;

    left:
        12px;

    right:
        12px;

    bottom:
        13px;

    height:
        2px;

    background:
        #3158d8;

    border-radius:
        5px;

}


/* =========================================================
   MEGA MENU BASE
========================================================= */

.cm-mega-menu {

    position:
        absolute;

    z-index:
        1100;

    top:
        100%;

    left:
        0;

    width:
        100%;

    padding:
        25px 0 28px;

    background:
        rgba(
            255,
            255,
            255,
            0.98
        );

    border-top:
        1px solid #eef1f6;

    border-bottom:
        1px solid #e5e9f1;

    box-shadow:
        0 18px 40px
        rgba(
            20,
            40,
            90,
            0.12
        );
        

    opacity:
        0;

    visibility:
        hidden;

    transform:
        translateY(8px);

    transition:
        opacity 0.22s ease,
        transform 0.22s ease,
        visibility 0.22s ease;

}
.cm-mega-item {
    position: static; /* important for full width */
}
.main-navbar {
    position: relative;
}

/* =========================================================
   OPEN STATE
========================================================= */

.cm-mega-item.mega-open
.cm-mega-menu {

    opacity:
        1;

    visibility:
        visible;

    transform:
        translateY(0);

}


.cm-mega-item.mega-open
.cm-mega-toggle i {

    transform:
        rotate(180deg);

}


/* =========================================================
   MEGA GRID
========================================================= */

.cm-mega-grid {

    display:
        grid;

    grid-template-columns:
        repeat(3, 1fr) 230px;

    gap:
        30px;

}


/* =========================================================
   MEGA COLUMN
========================================================= */

.cm-mega-column {

    min-width:
        0;

}


.cm-mega-heading {

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

    margin-bottom:
        13px;

    padding-bottom:
        11px;

    border-bottom:
        1px solid #edf0f5;

}


.cm-mega-icon {

    width:
        34px;

    height:
        34px;

    flex-shrink:
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #3158d8;

    background:
        #eef3ff;

    border-radius:
        8px;

}


.cm-mega-icon i {

    font-size:
        13px;

}


.cm-mega-heading strong {

    display:
        block;

    color:
        #17254c;

    font-size:
        10px;

    line-height:
        1.2;

    font-weight:
        800;

}


.cm-mega-heading small {

    display:
        block;

    margin-top:
        3px;

    color:
        #929bad;

    font-size:
        7px;

    line-height:
        1.2;

}


/* =========================================================
   MEGA LINKS
========================================================= */

.cm-mega-column > a {

    min-height:
        30px;

    padding:
        4px 4px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        10px;

    color:
        #59657b;

    border-radius:
        5px;

    font-size:
        8px;

    font-weight:
        550;

    transition:
        all 0.22s ease;

}


.cm-mega-column > a i {

    color:
        #a4adbc;

    font-size:
        8px;

    opacity:
        0;

    transform:
        translateX(-4px);

    transition:
        all 0.22s ease;

}


.cm-mega-column > a:hover {

    padding-left:
        9px;

    color:
        #3158d8;

    background:
        #f4f7ff;

}


.cm-mega-column > a:hover i {

    opacity:
        1;

    color:
        #3158d8;

    transform:
        translateX(0);

}


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

.cm-mega-featured {

    position:
        static;

    min-height:
        205px;

    padding:
        23px;

    overflow:
        hidden;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    background:
        linear-gradient(
            145deg,
            #edf3ff,
            #f5efff
        );

    border:
        1px solid #e3e8f5;

    border-radius:
        11px;

}


.cm-mega-featured::after {

    content:
        "";

    position:
        absolute;

    width:
        140px;

    height:
        140px;

    right:
        -55px;

    bottom:
        -65px;

    background:
        rgba(
            99,
            52,
            216,
            0.10
        );

    border-radius:
        50%;

}


.featured-badge {

    width:
        fit-content;

    margin-bottom:
        9px;

    padding:
        4px 7px;

    color:
        #3158d8;

    background:
        #ffffff;

    border-radius:
        4px;

    font-size:
        6px;

    font-weight:
        800;

    letter-spacing:
        1px;

}


.cm-mega-featured h3 {

    position:
        relative;

    z-index:
        2;

    margin:
        0 0 8px;

    color:
        #17254c;

    font-size:
        17px;

    line-height:
        1.25;

    font-weight:
        800;

}


.cm-mega-featured p {

    position:
        relative;

    z-index:
        2;

    margin:
        0 0 14px;

    color:
        #748096;

    font-size:
        7.5px;

    line-height:
        1.7;

}


.cm-mega-featured > a {

    position:
        relative;

    z-index:
        2;

    width:
        fit-content;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        6px;

    padding:
        8px 11px;

    color:
        #ffffff;

    background:
        #3158d8;

    border-radius:
        5px;

    font-size:
        7px;

    font-weight:
        700;

    transition:
        all 0.25s ease;

}


.cm-mega-featured > a:hover {

    background:
        #6334d8;

    transform:
        translateY(-2px);

}


.cm-mega-featured > a i {

    transition:
        transform 0.25s ease;

}


.cm-mega-featured > a:hover i {

    transform:
        translateX(3px);

}


/* =========================================================
   MORE MENU
========================================================= */

.cm-more-menu {

    padding:
        25px 0;

}


.cm-more-grid {

    display:
        grid;

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

    gap:
        10px;

}


.cm-more-card {

    min-height:
        75px;

    padding:
        12px;

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    background:
        #f8faff;

    border:
        1px solid #edf0f5;

    border-radius:
        8px;

    transition:
        all 0.25s ease;

}


.cm-more-card > span {

    width:
        38px;

    height:
        38px;

    flex-shrink:
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #3158d8;

    background:
        #edf3ff;

    border-radius:
        8px;

}


.cm-more-card > span i {

    font-size:
        14px;

}


.cm-more-card strong {

    display:
        block;

    margin-bottom:
        3px;

    color:
        #17254c;

    font-size:
        9px;

    font-weight:
        750;

}


.cm-more-card small {

    display:
        block;

    color:
        #8993a5;

    font-size:
        7px;

    line-height:
        1.4;

}


.cm-more-card:hover {

    background:
        #ffffff;

    border-color:
        #dce4f5;

    transform:
        translateY(-3px);

    box-shadow:
        0 8px 20px
        rgba(
            25,
            47,
            94,
            0.07
        );

}


.cm-more-card:hover > span {

    color:
        #ffffff;

    background:
        #3158d8;

}


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

.cm-navbar-action {

    flex-shrink:
        0;

}


.cm-navbar-cta {

    min-height:
        35px;

    padding:
        0 13px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        6px;

    color:
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #3158d8,
            #6334d8
        );

    border-radius:
        6px;

    font-size:
        8px;

    font-weight:
        700;

    box-shadow:
        0 5px 14px
        rgba(
            49,
            88,
            216,
            0.20
        );

    transition:
        all 0.25s ease;

}


.cm-navbar-cta:hover {

    color:
        #ffffff;

    transform:
        translateY(-2px);

    box-shadow:
        0 8px 20px
        rgba(
            49,
            88,
            216,
            0.28
        );

}


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

.cm-navbar-toggler {

    width:
        38px;

    height:
        35px;

    padding:
        7px;

    border:
        1px solid #e2e7f0 !important;

    border-radius:
        6px;

    box-shadow:
        none !important;

}


.cm-navbar-toggler span {

    display:
        block;

    width:
        20px;

    height:
        2px;

    margin:
        4px auto;

    background:
        #3158d8;

    border-radius:
        4px;

}


/* =========================================================
   LARGE TABLET / DESKTOP
========================================================= */

@media (max-width: 1199.98px) {

    .cm-navbar-brand {

        margin-right:
            15px;

    }


    .cm-nav-link {

        padding-left:
            8px !important;

        padding-right:
            8px !important;

    }


    .cm-mega-grid {

        gap:
            18px;

    }


    .cm-mega-featured {

        padding:
            18px;

    }


    .cm-navbar-cta {

        padding:
            0 9px;

    }

}


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

@media (max-width: 991.98px) {

    .topbar {

        display:
            none;

    }


    .main-navbar {

        min-height:
            62px;

    }


    .cm-navbar-brand {

        margin-right:
            auto;

    }


    .navbar-collapse {

        max-height:
            calc(
                100vh - 62px
            );

        overflow-y:
            auto;

        padding:
            8px 0 18px;

    }


    .cm-nav-list {

        display:
            flex;

        align-items:
            stretch;

        gap:
            0;

    }


    .cm-nav-list .nav-item {

        width:
            100%;

        border-bottom:
            1px solid #edf0f5;

    }


    .cm-nav-link {

        width:
            100%;

        min-height:
            48px;

        padding:
            14px 5px !important;

        justify-content:
            space-between;

        font-size:
            10px;

    }


    .cm-nav-link.active::before {

        display:
            none;

    }


    /* =============================================
       MOBILE MEGA MENU
    ============================================= */

    .cm-mega-menu {

        position:
            static;

        width:
            100%;

        padding:
            0;

        background:
            #f8faff;

        border:
            0;

        box-shadow:
            none;

        opacity:
            1;

        visibility:
            visible;

        transform:
            none;

        display:
            none;

    }


    .cm-mega-item.mega-open
    .cm-mega-menu {

        display:
            block;

    }


    .cm-mega-menu > .container {

        padding:
            0;

    }


    .cm-mega-grid {

        display:
            block;

        padding:
            8px 10px 15px;

    }


    .cm-mega-column {

        margin-bottom:
            10px;

        padding:
            8px;

        background:
            #ffffff;

        border:
            1px solid #e8edf5;

        border-radius:
            8px;

    }


    .cm-mega-column:last-of-type {

        margin-bottom:
            10px;

    }


    .cm-mega-heading {

        margin-bottom:
            7px;

        padding-bottom:
            8px;

    }


    .cm-mega-column > a {

        min-height:
            36px;

        padding:
            6px 5px;

        font-size:
            8.5px;

    }


    .cm-mega-column > a i {

        opacity:
            1;

        transform:
            none;

    }


    .cm-mega-featured {

        min-height:
            160px;

        margin-top:
            10px;

    }


    .cm-more-grid {

        grid-template-columns:
            1fr;

        padding:
            10px;

    }


    .cm-more-card {

        min-height:
            65px;

    }


    .cm-navbar-action {

        width:
            100%;

        padding:
            10px 5px 0;

    }


    .cm-navbar-cta {

        width:
            100%;

        min-height:
            42px;

    }

}


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

@media (max-width: 575.98px) {

    .cm-logo-mark {

        width:
            36px;

        height:
            36px;

    }


    .cm-logo-name {

        font-size:
            12px;

    }


    .cm-logo-name strong {

        font-size:
            7px;

    }


    .cm-mega-heading strong {

        font-size:
            9px;

    }


    .cm-mega-heading small {

        font-size:
            6.5px;

    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .cm-mega-menu,
    .cm-mega-column > a,
    .cm-more-card,
    .cm-navbar-cta {

        transition:
            none;

    }

}

/* =========================================================
   STEP 11 — FOOTER
========================================================= */

.site-footer {

    position:
        relative;

    color:
        rgba(
            255,
            255,
            255,
            0.70
        );

    background:
        #071735;

    overflow:
        hidden;

}


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

.footer-main {

    padding:
        65px 0 45px;

}


/* =========================================================
   BRAND
========================================================= */

.footer-brand {

    max-width:
        340px;

}


.footer-logo {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        10px;

    margin-bottom:
        18px;

}


.footer-logo-mark {

    width:
        42px;

    height:
        42px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #3158d8,
            #6334d8
        );

    border-radius:
        10px;

    font-size:
        12px;

    font-weight:
        900;

    letter-spacing:
        -0.5px;

}


.footer-logo-text {

    display:
        flex;

    flex-direction:
        column;

    color:
        #ffffff;

    font-size:
        15px;

    line-height:
        1;

    font-weight:
        700;

}


.footer-logo-text strong {

    margin-top:
        3px;

    color:
        #8faaff;

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        1.4px;

    text-transform:
        uppercase;

}


.footer-description {

    margin:
        0 0 20px;

    color:
        rgba(
            255,
            255,
            255,
            0.57
        );

    font-size:
        9px;

    line-height:
        1.8;

}


/* =========================================================
   SOCIAL LINKS
========================================================= */

.footer-socials {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

}


.footer-socials a {

    width:
        32px;

    height:
        32px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        rgba(
            255,
            255,
            255,
            0.65
        );

    background:
        rgba(
            255,
            255,
            255,
            0.07
        );

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.10
        );

    border-radius:
        7px;

    transition:
        all 0.3s ease;

}


.footer-socials a:hover {

    color:
        #ffffff;

    background:
        #3158d8;

    border-color:
        #3158d8;

    transform:
        translateY(-3px);

}


.footer-socials i {

    font-size:
        12px;

}


/* =========================================================
   FOOTER COLUMNS
========================================================= */

.footer-column {

    padding-top:
        4px;

}


.footer-column h3 {

    margin:
        0 0 19px;

    color:
        #ffffff;

    font-size:
        11px;

    line-height:
        1.3;

    font-weight:
        750;

}


.footer-column ul {

    margin:
        0;

    padding:
        0;

    list-style:
        none;

}


.footer-column li {

    margin-bottom:
        10px;

}


.footer-column li:last-child {

    margin-bottom:
        0;

}


.footer-column li a {

    position:
        relative;

    color:
        rgba(
            255,
            255,
            255,
            0.54
        );

    font-size:
        8.5px;

    line-height:
        1.4;

    transition:
        all 0.25s ease;

}


.footer-column li a::before {

    content:
        "";

    position:
        absolute;

    left:
        -9px;

    top:
        50%;

    width:
        3px;

    height:
        3px;

    background:
        #7190eb;

    border-radius:
        50%;

    opacity:
        0;

    transform:
        translateY(-50%);

    transition:
        opacity 0.25s ease;

}


.footer-column li a:hover {

    color:
        #9eb5ff;

    padding-left:
        5px;

}


.footer-column li a:hover::before {

    opacity:
        1;

}


/* =========================================================
   CONTACT
========================================================= */

.footer-contact-column {

    max-width:
        230px;

}


.footer-contact-item {

    display:
        flex;

    align-items:
        flex-start;

    gap:
        9px;

    margin-bottom:
        14px;

}


.footer-contact-item:last-child {

    margin-bottom:
        0;

}


.footer-contact-icon {

    width:
        27px;

    height:
        27px;

    flex-shrink:
        0;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #8faaff;

    background:
        rgba(
            255,
            255,
            255,
            0.07
        );

    border-radius:
        6px;

}


.footer-contact-icon i {

    font-size:
        10px;

}


.footer-contact-item div {

    min-width:
        0;

}


.footer-contact-item strong {

    display:
        block;

    margin-bottom:
        3px;

    color:
        rgba(
            255,
            255,
            255,
            0.78
        );

    font-size:
        7.5px;

    font-weight:
        700;

}


.footer-contact-item address,
.footer-contact-item a {

    display:
        block;

    margin:
        0;

    color:
        rgba(
            255,
            255,
            255,
            0.50
        );

    font-size:
        7.5px;

    line-height:
        1.5;

    font-style:
        normal;

    word-break:
        break-word;

    transition:
        color 0.25s ease;

}


.footer-contact-item a:hover {

    color:
        #9eb5ff;

}


/* =========================================================
   FOOTER CTA
========================================================= */

.footer-cta-wrapper {

    padding:
        0 0 38px;

}


.footer-cta {

    min-height:
        78px;

    padding:
        15px 20px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    background:
        linear-gradient(
            105deg,
            rgba(
                49,
                88,
                216,
                0.20
            ),
            rgba(
                99,
                52,
                216,
                0.20
            )
        );

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.10
        );

    border-radius:
        10px;

}


.footer-cta-content {

    display:
        flex;

    flex-direction:
        column;

    gap:
        5px;

}


.footer-cta-content span {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        5px;

    color:
        #9eb5ff;

    font-size:
        7.5px;

    font-weight:
        700;

}


.footer-cta-content span i {

    font-size:
        9px;

}


.footer-cta-content strong {

    color:
        #ffffff;

    font-size:
        13px;

    font-weight:
        750;

}


.footer-cta-button {

    min-height:
        39px;

    padding:
        0 15px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        7px;

    flex-shrink:
        0;

    color:
        #17254c;

    background:
        #ffffff;

    border-radius:
        7px;

    font-size:
        8px;

    font-weight:
        750;

    transition:
        all 0.3s ease;

}


.footer-cta-button:hover {

    color:
        #17254c;

    transform:
        translateY(-2px);

    box-shadow:
        0 8px 20px
        rgba(
            0,
            0,
            0,
            0.18
        );

}


.footer-cta-button i {

    transition:
        transform 0.3s ease;

}


.footer-cta-button:hover i {

    transform:
        translateX(3px);

}


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

.footer-bottom {

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            0.08
        );

}


.footer-bottom-inner {

    min-height:
        60px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

}


.footer-copyright {

    margin:
        0;

    color:
        rgba(
            255,
            255,
            255,
            0.40
        );

    font-size:
        7px;

    line-height:
        1.5;

}


.footer-legal-links {

    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    justify-content:
        flex-end;

    gap:
        5px 16px;

}


.footer-legal-links a {

    color:
        rgba(
            255,
            255,
            255,
            0.40
        );

    font-size:
        7px;

    transition:
        color 0.25s ease;

}


.footer-legal-links a:hover {

    color:
        #9eb5ff;

}


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

@media (max-width: 991.98px) {

    .footer-main {

        padding:
            55px 0 40px;

    }


    .footer-brand {

        max-width:
            400px;

    }


    .footer-contact-column {

        max-width:
            260px;

    }


    .footer-cta {

        padding:
            15px 18px;

    }

}


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

@media (max-width: 767.98px) {

    .footer-main {

        padding:
            50px 0 35px;

    }


    .footer-brand {

        max-width:
            100%;

        margin-bottom:
            15px;

    }


    .footer-column h3 {

        margin-bottom:
            15px;

    }


    .footer-cta {

        flex-direction:
            column;

        align-items:
            flex-start;

        padding:
            18px;

    }


    .footer-cta-button {

        width:
            100%;

    }


    .footer-bottom-inner {

        min-height:
            auto;

        padding:
            18px 0;

        flex-direction:
            column;

        align-items:
            center;

        text-align:
            center;

    }


    .footer-legal-links {

        justify-content:
            center;

    }

}


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

@media (max-width: 575.98px) {

    .footer-main {

        padding:
            45px 0 30px;

    }


    .footer-description {

        font-size:
            8px;

    }


    .footer-column h3 {

        font-size:
            10px;

    }


    .footer-column li a {

        font-size:
            8px;

    }


    .footer-contact-column {

        max-width:
            100%;

    }


    .footer-contact-item {

        margin-bottom:
            12px;

    }


    .footer-cta-content strong {

        font-size:
            12px;

    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .footer-socials a,
    .footer-column li a,
    .footer-cta-button {

        transition:
            none;

    }

}