*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

html,
body {
    font-size: 62.5%;
}

body {
    font-family: "Inter", sans-serif;
    font-size: 1.4rem;
    line-height: 1.2;
    color: #0a1628;
    background: #fff;
    overflow-x: hidden;
}

a {
    text-decoration: none;
    color: inherit;
}

img {
    display: block;
    max-width: 100%;
}

/* ── CSS VARIABLES ── */
:root {
    --red: #D80000;
    --navy: #00015E;
    --blue: #00015E;
    --mid-blue: #1565c0;
    --light-blue: #e8eaf6;
    --lavender: #E7EBFF;
    --pale: #f5f6ff;
    --green: #00c853;
    --text: #0a1628;
    --muted: #606060;
    --border: #e0e4f0;
}

/* ════════════════════════════════
   HEADER
════════════════════════════════ */
.site-header {
    background: var(--navy);
    position: sticky;
    top: 0;
    z-index: 1000;
    border-bottom: .1rem solid #FFFFFF40;
}

.container {
    max-width: 130rem;
    margin: 0 auto;
    padding: 0 3.2rem;
}

/* Top bar: logo + ticker + actions */
.header-top {
    display: flex;
    align-items: center;
    padding: 2.9rem 0 2rem 0;
    gap: 2.4rem;
}

.h-logo {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

    .h-logo img {
        width: 16rem;
        height: auto;
    }

/* Ticker between logo and actions */
.header-ticker {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.8rem;
    font-size: 1.4rem;
    color: #fff;
}

.ticker-item {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    white-space: nowrap;
}

    .ticker-item svg {
        width: 2.4rem;
        height: auto;
    }

        .ticker-item svg.down {
            transform: rotate(180deg);
        }

            .ticker-item svg.down path {
                fill: #D80000;
            }

.t-divider {
    width: .1rem;
    height: 1.6rem;
    background: #fff;
}

/* Actions */
.header-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

.btn-open-acct {
    background: var(--red);
    color: #fff;
    border: none;
    border-radius: 3rem;
    padding: 1.1rem 2.1rem;
    font-size: 1.8rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    min-width: 10.8rem;
    transition: background 0.2s;
}

    .btn-open-acct:hover {
        background: #c01230;
    }

.btn-login {
    background: transparent;
    color: #fff;
    border: none;
    padding: 1.1rem 2.1rem;
    font-size: 1.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: color 0.2s;
}

    .btn-login:hover {
        color: #a0b4ff;
    }

/* Nav bar */
.header-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.8rem;
    padding-bottom: 2.4rem;
}

.nav-dd {
    position: relative;
}

.nav-dd-btn {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 1.8rem;
    font-weight: 500;
    color: #fff;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
    white-space: nowrap;
    background: none;
    border: none;
}

    .nav-dd-btn:hover,
    .nav-dd:hover .nav-dd-btn {
        color: #fff;
    }

    .nav-dd-btn i {
        font-size: 1.2rem;
        transition: transform 0.25s ease;
    }

.nav-dd:hover .nav-dd-btn i {
    transform: rotate(180deg);
}

/* ── Mega Dropdown ── */
.mega-dropdown {
    position: fixed;
    top: auto;
    left: 0;
    right: 0;
    width: 100vw;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(.8rem);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
    pointer-events: none;
}

.nav-dd:hover .mega-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

/* Inner container for mega columns */
.mega-inner {
    max-width: 145rem;
    margin: 3.6rem auto;
    padding: 3.8rem 4.8rem;
    display: flex;
    gap: 4.8rem;
    flex-wrap: wrap;
    background: #00015E;
    box-shadow: 0 2rem 6rem rgba(0, 0, 0, 0.5);
}

.mega-inner-extra {
    margin-top: 3.2rem;
    padding-top: 2.4rem;
    border-top: .1rem solid rgba(255, 255, 255, 0.08);
}

/* Each column */
.mega-col {
    min-width: 14rem;
    flex: 0 0 auto;
}

/* Category heading */
.mega-heading {
    font-size: 1.8rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 2.4rem;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Sub links */
.mega-col a {
    display: block;
    font-size: 1.8rem;
    font-weight: 400;
    color: #fff;
    padding: .6rem 0;
    transition: color 0.18s ease, padding-left 0.18s ease;
    white-space: nowrap;
    line-height: 1.3;
}

    .mega-col a:hover {
        color: #fff;
        padding-left: .4rem;
    }

/* Search bar in header nav (right side) */
.nav-search {
    width: 100%;
    max-width: 42rem;
    position: relative;
    display: flex;
    align-items: center;
}

    .nav-search input {
        background: transparent;
        border: .1rem solid #FFFFFF;
        border-radius: 2.5rem;
        padding: 1.07rem 1.4rem 1.07rem 6rem;
        font-size: 1.8rem;
        color: #FFFFFF80;
        outline: none;
        width: 100%;
        transition: border-color 0.2s;
    }

        .nav-search input::placeholder {
            color: rgba(255, 255, 255, 0.4);
        }

        .nav-search input:focus {
            border-color: rgba(255, 255, 255, 0.4);
        }

    .nav-search .si {
        position: absolute;
        left: 2.1rem;
        color: #ffffff61;
        font-size: 2.2rem;
    }

/* ════════════════════════════════
   HERO SLIDER
════════════════════════════════ */

/* Wrapper */
.hero-wrapper {
    position: relative;
}

/* Hide slick defaults */
.hero-slider .slick-dots,
.hero-slider .slick-prev,
.hero-slider .slick-next {
    display: none !important;
}

/* Each slide */
.hero-slide {
    position: relative;
    overflow: hidden;
    height: 80rem;
    display: flex !important;
    flex-direction: column;
}

/* BG image layer */
.hs-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 0;
}

/* Overlay */
.hs-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* Content */
.hs-content {
    position: relative;
    z-index: 2;
    flex: 1;
    display: flex;
    /* align-items: center; */
}

/* Tag pill */
.hero-tag {
    display: inline-block;
    border-radius: .8rem;
    padding: 1.3rem 2.2rem;
    font-size: 1.6rem;
    margin-bottom: 2.8rem;
    color: #fff;
    background: #2A31CE26;
}

.hero-tag-dark {
    background: rgb(255 255 255 / 13%);
    border: .1rem solid rgba(255, 255, 255, 0.35);
    color: rgba(255, 255, 255, 0.9);
}

.hero-tag-light {
    background: rgba(255, 255, 255, 0.15);
    border: .1rem solid rgba(255, 255, 255, 0.35);
    color: rgba(255, 255, 255, 0.9);
}

/* H1 */
.hs-h1 {
    font-size: 5.4rem;
    font-weight: 600;
    line-height: 1.1;
    color: #fff;
    margin-bottom: .8rem;
}

    .hs-h1 em {
        font-style: italic;
        font-weight: 300;
        padding-top: 1.6rem;
        display: block;
    }

/* Sub-heading (slide 4) */
.hs-h1-sub {
    font-size: 3.2rem;
    font-weight: 300;
    color: #fff;
    margin: 1.6rem 0;
}

/* Body text */
.hs-sub {
    font-size: 1.8rem;
    margin-bottom: 2.8rem;
    color: #FFFFFF80;
}

    .hs-sub .accent {
        font-weight: 700;
        color: #00FF62BF;
    }

/* Buttons */
.hs-btns {
    display: flex;
    align-items: center;
    gap: 1.4rem;
    flex-wrap: wrap;
}

.btn-hs-white {
    background: #fff;
    color: var(--navy);
    border: none;
    border-radius: 5rem;
    padding: 1.4rem 2.8rem;
    font-size: 1.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s;
    white-space: nowrap;
    font-family: "Inter", sans-serif;
}

    .btn-hs-white:hover {
        background: #e8eaf6;
        transform: translateY(-.1rem);
    }

.btn-hs-outline {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border: .15rem solid rgba(255, 255, 255, 0.5);
    border-radius: 5rem;
    padding: 1.4rem 2.8rem;
    font-size: 1.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s;
    white-space: nowrap;
    font-family: "Inter", sans-serif;
}

    .btn-hs-outline:hover {
        background: rgba(255, 255, 255, 0.25);
        transform: translateY(-.1rem);
    }

/* ════ SLIDE 1 — Blue grid ════ */
.slide-1 .hs-bg {
    background: linear-gradient(155deg, #0b1d6a 0%, #1638b8 40%, #1e55cc 70%, #1565c0 100%);
}

    .slide-1 .hs-bg::after {
        content: '';
        position: absolute;
        inset: 0;
        background-image: linear-gradient(rgba(255, 255, 255, 0.04) .1rem, transparent .1rem), linear-gradient(90deg, rgba(255, 255, 255, 0.04) .1rem, transparent .1rem);
        background-size: 5.2rem 5.2rem;
        pointer-events: none;
    }

/* Slide 1 centered layout */
.slide-1 .hs-content {
    align-items: flex-start;
    padding: 3.8rem 0 0;
}

.slide-1 .hero-tag,
.slide-1 .hs-h1,
.slide-1 .hs-sub {
    text-align: center;
}

.slide-1 .hs-h1 {
    width: 100%;
}

.slide-1 .hs-sub {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.slide-1 .hs-btns {
    justify-content: center;
    margin-bottom: 3.6rem;
}

.slide-1 .slide-1-top {
    text-align: center;
}

/* Widget row */
.s1-widgets {
    display: flex;
    gap: 1.4rem;
    justify-content: center;
    padding-bottom: 0;
}

.s1-card-left {
    background: rgba(255, 255, 255, 0.1);
    border: .1rem solid rgba(255, 255, 255, 0.18);
    border-radius: 1.6rem;
    padding: 1.8rem;
    width: 23rem;
    flex-shrink: 0;
}

.s1-card-center {
    background: rgba(255, 255, 255, 0.1);
    border: .2rem solid rgba(100, 149, 255, 0.45);
    border-radius: 1.6rem;
    padding: 2rem;
    width: 34rem;
    flex-shrink: 0;
}

.s1-card-right {
    display: flex;
    flex-direction: column;
    gap: .8rem;
    width: 17.5rem;
    flex-shrink: 0;
}

.s1-analyse-row {
    display: flex;
    align-items: center;
    gap: .8rem;
    margin-bottom: 1rem;
}

.s1-icon-box {
    width: 3rem;
    height: 3rem;
    border-radius: .8rem;
    background: rgba(255, 255, 255, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

.s1-btn-analyse {
    flex: 1;
    background: rgba(255, 255, 255, 0.15);
    border: .15rem solid rgba(255, 255, 255, 0.3);
    color: #fff;
    border-radius: .8rem;
    padding: .7rem 1rem;
    font-size: 1.2rem;
    font-weight: 600;
    cursor: pointer;
    font-family: "Inter", sans-serif;
}

.s1-insight {
    background: rgba(255, 255, 255, 0.08);
    border-radius: .8rem;
    padding: .9rem 1.1rem;
}

.s1-insight-head {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.7);
    font-weight: 700;
    margin-bottom: .5rem;
}

.s1-insight-li {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.6);
    list-style: disc;
    margin-left: 1.3rem;
    line-height: 1.55;
}

.s1-all-link {
    display: block;
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.55);
    text-align: center;
    margin-top: .9rem;
    font-style: italic;
}

/* forecast internals */
.s1-fc-head {
    font-size: 1.4rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: .3rem;
}

.s1-fc-sub {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 1rem;
}

.s1-fc-badge {
    background: rgba(0, 200, 83, 0.14);
    border: .1rem solid rgba(0, 200, 83, 0.3);
    border-radius: .7rem;
    padding: .7rem 1rem;
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5;
    margin-bottom: 1.2rem;
}

    .s1-fc-badge .g {
        color: #69f0ae;
        font-weight: 700;
    }

.s1-fc-compare {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .4rem;
    margin-bottom: 1.2rem;
}

.s1-fc-compare-item {
    text-align: center;
    flex: 1;
}

.s1-dot {
    width: .7rem;
    height: .7rem;
    border-radius: 50%;
    margin: 0 auto .3rem;
}

.dot-pink {
    background: #ff4081;
}

.dot-white {
    background: rgba(255, 255, 255, 0.5);
}

.dot-cyan {
    background: #40c4ff;
}

.s1-ci-label {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.5);
}

.s1-ci-val {
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
}

.s1-fc-vs {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.3);
}

.s1-chart {
    width: 100%;
    height: 7.2rem;
}

/* right col */
.s1-advisor {
    background: rgba(255, 255, 255, 0.08);
    border: .1rem solid rgba(255, 255, 255, 0.15);
    border-radius: 1.2rem;
    flex: 1;
    min-height: 13rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4.6rem;
    overflow: hidden;
}

    .s1-advisor img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: top center;
    }

.s1-rb {
    background: rgba(255, 255, 255, 0.1);
    border: .1rem solid rgba(255, 255, 255, 0.2);
    border-radius: .9rem;
    padding: .9rem 1.2rem;
    font-size: 1.2rem;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    text-align: center;
    transition: background 0.2s;
}

    .s1-rb:hover {
        background: rgba(255, 255, 255, 0.2);
    }

.slide-1 .hs-overlay {
    background: url(../Images/Hero_Image_1.svg);
    background-size: cover;
}

/* ════ SLIDE 2 — Outdoor photo ════ */
.slide-2 .hs-bg {
    background-position: center 20%;
    background: url(../Images/hero_banner_2.png);
}

.slide-2 .hs-overlay {
    background: url(../Images/Hero_Image_2.svg);
    background-size: cover;
    background-position: center 40%;
}

.slide-2 .hs-content {
    padding: 9rem 0 0 0;
}

/* ════ SLIDE 3 — Blue sky + bubbles ════ */
.slide-3 .hs-bg {
    background-position: center 30%;
    background: url(../Images/hero_banner_2.png);
}

.slide-3 .hs-overlay {
    background: url(../Images/hero_banner_3.png);
    background-size: cover;
    background-position: center 70%;
}

.slide-3 .hs-content {
    padding: 9rem 0 0 0;
}

/* Bubbles */
.s3-bubbles {
    position: absolute;
    top: 10%;
    right: 5%;
    z-index: 3;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    align-items: flex-end;
    pointer-events: none;
}

.s3-row {
    display: flex;
    align-items: flex-start;
    gap: 1.4rem;
}

.s3-bubble {
    background: rgba(255, 255, 255, 0.14);
    border: .15rem solid rgba(255, 255, 255, 0.38);
    backdrop-filter: blur(1.4rem);
    -webkit-backdrop-filter: blur(1.4rem);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    animation: bubbleFloat 3s ease-in-out infinite;
}

    .s3-bubble:nth-child(2) {
        animation-delay: .5s;
    }

    .s3-bubble:nth-child(3) {
        animation-delay: 1s;
    }

@keyframes bubbleFloat {

    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-.7rem);
    }
}

.s3-bubble-lg {
    width: 14rem;
    height: 14rem;
}

.s3-bubble-md {
    width: 11.8rem;
    height: 11.8rem;
}

.s3-bubble-sm {
    width: 10.8rem;
    height: 10.8rem;
}

.s3-bubble .sb-title {
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1.2;
}

.s3-bubble .sb-sub {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.7);
    margin-top: .4rem;
}

/* Arc connector (SVG) */
.s3-arc {
    position: absolute;
    top: 8%;
    right: 4%;
    z-index: 2;
    pointer-events: none;
    opacity: 0.4;
}

/* ════ SLIDE 4 — Dark navy + app mockup ════ */
.slide-4 .hs-bg {
    background-position: center center;
    background: url(../Images/hero_banner_2.png);
}

.slide-4 .hs-overlay {
    background: url(../Images/hero_banner_4.png);
    background-size: cover;
    background-position: center 70%;
}

.slide-4 .hs-content {
    padding: 9rem 0 0 0;
}

.slide-4 .hs-sub {
    max-width: 48.9rem;
}

/* App visual right side */
.s4-visual {
    position: absolute;
    right: 10%;
    bottom: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 1.6rem;
    width: 77.8rem;
}

    .s4-visual img {
        width: 100%;
        height: auto;
    }

/* Floating labels */
.s4-labels-col {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.s4-label {
    background: rgba(40, 60, 200, 0.72);
    border: .1rem solid rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(1.2rem);
    -webkit-backdrop-filter: blur(1.2rem);
    border-radius: 5rem;
    padding: 1rem 1.8rem;
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    gap: .7rem;
    white-space: nowrap;
    animation: labelFloat 3.5s ease-in-out infinite;
}

    .s4-label:nth-child(even) {
        animation-delay: .8s;
    }

    .s4-label:nth-child(3) {
        animation-delay: 1.5s;
    }

@keyframes labelFloat {

    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-.5rem);
    }
}

.s4-label .lbl-icon {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.lbl-pink {
    background: #e91e8c;
}

.lbl-blue {
    background: #1565c0;
}

.lbl-orange {
    background: #ff6f00;
}

.lbl-purple {
    background: #7b1fa2;
}

.lbl-green {
    background: #2e7d32;
}

/* Phone mockup */
.s4-phone-wrap {
    background: #e8eaf0;
    border-radius: 4rem;
    padding: .8rem;
    box-shadow: 0 2.8rem 7.2rem rgba(0, 0, 0, 0.5), 0 0 0 .1rem rgba(255, 255, 255, 0.08);
    width: 21rem;
    flex-shrink: 0;
}

.s4-phone-screen {
    background: #fff;
    border-radius: 3.3rem;
    overflow: hidden;
    padding: 1.4rem 1.3rem 0;
    min-height: 38rem;
}

.s4-notch {
    width: 7.2rem;
    height: .6rem;
    background: #111;
    border-radius: .3rem;
    margin: 0 auto 1.2rem;
}

.s4-ph-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.s4-ph-greeting {
    font-size: 1.4rem;
    font-weight: 800;
    color: #0a1628;
}

.s4-ph-icons {
    font-size: 1.1rem;
    color: #888;
    display: flex;
    gap: .6rem;
}

.s4-ph-search {
    background: #f5f6fa;
    border-radius: 2rem;
    padding: .7rem 1.2rem;
    font-size: 1rem;
    color: #aaa;
    margin-bottom: 1.4rem;
}

.s4-ph-curr-label {
    font-size: 1rem;
    color: #888;
    margin-bottom: .3rem;
    display: flex;
    align-items: center;
    gap: .4rem;
}

.s4-ph-curr-val {
    font-size: 1.8rem;
    font-weight: 900;
    color: #0a1628;
}

.s4-ph-curr-chg {
    font-size: 1rem;
    color: #888;
}

.s4-ph-invested {
    font-size: 1rem;
    color: #888;
    margin-bottom: 1.2rem;
}

.s4-ph-divider {
    height: .1rem;
    background: #f0f0f0;
    margin-bottom: 1.2rem;
}

.s4-ph-started {
    font-size: 1.2rem;
    font-weight: 700;
    color: #0a1628;
    margin-bottom: .8rem;
}

.s4-ph-invest-lbl {
    font-size: 1rem;
    color: #888;
    margin-bottom: .3rem;
}

.s4-ph-amount {
    font-size: 1.6rem;
    font-weight: 800;
    color: #0a1628;
    margin-bottom: .8rem;
}

    .s4-ph-amount span {
        font-size: 1rem;
        font-weight: 400;
        color: #888;
    }

.s4-ph-bars {
    display: flex;
    align-items: flex-end;
    gap: .3rem;
    height: 3.2rem;
    margin-bottom: .5rem;
}

.s4-ph-bar {
    flex: 1;
    background: #e8eaf0;
    border-radius: .2rem .2rem 0 0;
}

    .s4-ph-bar.on {
        background: var(--navy);
    }

.s4-ph-range {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    color: #ccc;
    margin-bottom: 1rem;
}

.s4-ph-ret-lbl {
    font-size: 0.9rem;
    color: #888;
    margin-bottom: .3rem;
}

.s4-ph-ret-val {
    font-size: 1.4rem;
    font-weight: 800;
    color: #00c853;
    margin-bottom: 1rem;
}

.s4-ph-sip {
    background: var(--navy);
    color: #fff;
    width: 100%;
    border: none;
    border-radius: 1rem;
    padding: 1rem;
    font-size: 1.2rem;
    font-weight: 700;
    cursor: pointer;
    font-family: "Inter", sans-serif;
}

/* ════ CUSTOM DOT NAV ════ */
.hero-nav-dots {
    position: absolute;
    bottom: 9rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    align-items: center;
    gap: .8rem;
}

.hnd-dot {
    width: 3.5rem;
    height: .2rem;
    border-radius: .2rem;
    background: #FFFFFF40;
    cursor: pointer;
    border: none;
    padding: 0;
    transition: all 0.35s ease;
    display: block;
}

    .hnd-dot.active {
        width: 4.4rem;
        background: #fff;
    }

/* ════ ENROLL BAR ════ */
.hero-enroll {
    border-top: .1rem solid #FFFFFF40;
    background: #01025E33;
    backdrop-filter: blur(1rem);
    -webkit-backdrop-filter: blur(1rem);
    padding: .9rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.8rem;
    flex-wrap: wrap;
    position: absolute;
    width: 100%;
    bottom: 0;
}

    .hero-enroll.footerLast {
        position: static;
        background: #00015E;
    }

.he-text {
    font-size: 2.4rem;
    font-weight: 400;
    color: #fff;
    white-space: nowrap;
}

.he-input {
    flex: 1;
    min-width: 20rem;
    max-width: 40rem;
    display: flex;
    align-items: center;
    border: .15rem solid #fff;
    border-radius: 5rem;
    overflow: hidden;
    padding: 0 .4rem 0 2.8rem;
    background: rgba(255, 255, 255, 0.1);
    position: relative;
}
    .he-input .help-block.error {
        position: absolute;
        bottom: 0;
        color: red;
        font-size: 1rem;
        transform: translate(-120%, -3px);
    }

    .he-input input {
        flex: 1;
        border: none;
        outline: none;
        font-size: 1.8rem;
        color: #fff;
        padding: 1.4rem 0;
        margin-left: 1rem;
        background: transparent;
        font-family: "Inter", sans-serif;
    }

        .he-input input::placeholder {
            color: rgba(255, 255, 255, 0.5);
        }

.btn-open-trading {
    background: var(--red);
    color: #fff;
    border: none;
    border-radius: 5rem;
    padding: 1.4rem 3rem;
    font-size: 1.8rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.2s;
    flex-shrink: 0;
    font-family: "Inter", sans-serif;
}

    .btn-open-trading:hover {
        background: #b80000;
    }

/* ════ RESPONSIVE ════ */
@media (max-width: 1200px) {
    .s4-visual {
        display: none;
    }

    .s3-bubbles {
        display: none;
    }

    .s1-widgets {
        display: none;
    }
}

@media (max-width: 900px) {
    .hero-slide {
        height: 52rem;
    }

    .hs-h1 {
        font-size: clamp(2.6rem, 6vw, 4rem);
    }
}

@media (max-width: 640px) {
    .hero-slide {
        height: auto;
        min-height: 60rem;
    }

    .hs-content {
        padding: 4rem 0 10rem;
        align-items: flex-start;
    }

    .slide-2 .hs-content,
    .slide-3 .hs-content,
    .slide-4 .hs-content {
        padding-top: 2.8rem;
    }

    .slide-1 .hs-content {
        padding: 2.8rem 0 8rem;
    }

    /* .slide-1 .hs-h1,
    .slide-1 .hs-sub,
    .slide-1 .hero-tag {
        text-align: left;
    } */
    .hero-tag {
        padding: .8rem 1.2rem;
        font-size: .8rem;
        margin-bottom: 1.8rem;
    }

    .slide-1 .hs-sub {
        margin-left: 0;
        font-size: 1rem;
        margin-bottom: 1.8rem;
    }

    .hs-h1 {
        font-size: 2.8rem;
        margin-bottom: 1rem;
    }
    .hs-h1-sub {
        font-size: 1.8rem;
    }
    .hs-sub {
        font-size: 1.3rem;
    }

    .btn-hs-white,
    .btn-hs-outline {
        font-size: 1.4rem;
        padding: 1.1rem 1.8rem;
    }

    .hero-nav-dots {
        bottom: 17rem;
    }

    .hero-enroll {
        padding: 1.2rem 1.6rem;
        gap: 1rem;
        flex-direction: column;
        align-items: stretch;
    }

    .he-text {
        font-size: 1.4rem;
        white-space: normal;
        text-align: center;
    }

    .he-input {
        max-width: 100%;
    }

    .btn-open-trading {
        font-size: 1.4rem;
        padding: 1.2rem 2rem;
        text-align: center;
    }
}

/* ════════════════════════════════
   YOUR WEALTH. YOUR RULES.
════════════════════════════════ */
/* ════════════════════════════════
   YOUR WEALTH. YOUR RULES.
════════════════════════════════ */
section {
    padding: 9.8rem 0;
}

.wealth-section {
    padding-top: 15.8rem;
    padding-bottom: 0;
}

.wealth-inner {
    padding-bottom: 9.8rem;
    border-bottom: .1rem solid transparent;
    border-image: linear-gradient(90deg, rgba(0, 255, 162, 0.5) 0%, rgba(82, 170, 253, 0.5) 100%);
    border-image-slice: 1;
}

.sectionTitle {
    font-size: 4.8rem;
    font-weight: 600;
    color: var(--blue);
    text-align: center;
    margin-bottom: 1.8rem;
}

.subTitle {
    font-size: 1.8rem;
    color: #000000;
    text-align: center;
    margin-bottom: 3.8rem;
}

.wealth-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.8rem;
}

/* Card base */
.wc {
    border: .1rem solid #0000001A;
    background: linear-gradient(0deg, rgba(239, 239, 239, 0.1), rgba(239, 239, 239, 0.1)), #FFFFFF;
    border-radius: 2rem;
    padding: 2.9rem 2.6rem;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: transform 0.25s, box-shadow 0.25s;
}

    .wc:hover {
        transform: translateY(-.4rem);
        box-shadow: 0 1.6rem 4.8rem rgba(26, 35, 126, 0.18);
    }

    /* Middle card (dark) */
    .wc.dark {
        background: linear-gradient(180deg, rgba(177, 180, 255, 0.15) -9.7%, rgba(42, 49, 206, 0.25) 103.4%);
    }

        .wc.dark .wc-heading {
            color: #00015E;
        }

        .wc.dark .wc-item {
            font-weight: 500;
            font-size: 1.8rem;
        }

            .wc.dark .wc-item::before {
                background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%2300015E'/%3E%3Cpath d='M6 10l3 3 5-5' stroke='%23FFFFFF' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100%;
            }

/* Card logo row */
.wc-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 5.8rem;
}

    .wc-top img {
        width: 100%;
        max-width: 14.4rem;
        height: auto;
    }

.logo-sky {
    background: #1a237e;
    color: #fff;
}

.logo-ir {
    background: #e31837;
    color: #fff;
}

.logo-tru {
    background: #e31837;
    color: #fff;
}

.wc-logo-name {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--navy);
}

    .wc-logo-name.white {
        color: #fff;
    }

.wc-logo-sub {
    font-size: .9rem;
    color: #aaa;
    display: block;
    letter-spacing: 0.5rem;
}

.wc-badge {
    background: #2A31CE1A;
    color: #000;
    border-radius: .8rem;
    padding: 1rem 1.8rem;
    font-size: 1.2rem;
}
.wc.dark .wc-badge {
    font-weight: 600;
}

.wc-heading {
    font-size: 2.8rem;
    font-weight: 400;
    color: #000000;
    line-height: 1.25;
    margin-bottom: 2.8rem;
}

.wc-items {
    list-style: none;
    margin-bottom: auto;
    padding: 0;
    max-width: 30.5rem;
    margin-bottom: 5.1rem;
}

.wc-item {
    font-size: 1.6rem;
    color: #000;
    padding: .7rem 0;
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    line-height: 1.25;
}

    .wc-item::before {
        content: "";
        width: 2rem;
        height: 2rem;
        flex-shrink: 0;
        margin-top: .1rem;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%23D9D9D9'/%3E%3Cpath d='M6 10l3 3 5-5' stroke='%23FFFFFF' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100%;
    }

.wc-footer {
    margin-top: auto;
}

.container > hr {
    border-top: .1rem solid;
    border-image-source: linear-gradient(90deg, rgba(0, 255, 162, 0.5) 0%, rgba(82, 170, 253, 0.5) 100%);
    margin: 0;
}

.btn-wc {
    border-radius: 2.5rem;
    padding: 1.3rem 1.8rem;
    font-size: 1.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-block;
}

.btn-wc-outline {
    background: #fff;
    color: var(--navy);
    border: .1rem solid #00000040;
}

    .btn-wc-outline:hover {
        border-color: var(--navy);
    }

.btn-wc-dark {
    background: #00015E;
    box-shadow: 0px .2rem .4rem 0px #393DA733, -.1rem .8rem .8rem 0px #393DA72B, -.2rem 1.7rem 1rem 0px #393DA71A, -.3rem 3.1rem 1.2rem 0px #393DA708, -.5rem 4.8rem 1.4rem 0px #393DA700;
    color: #fff;
    border: none;
    text-align: center;
    display: block;
    width: max-content;
}

    .btn-wc-dark:hover {
        background: #0d1b6e;
    }

.btn-wc-white {
    background: #fff;
    color: var(--navy);
    border: .2rem solid #ccc;
}

    .btn-wc-white:hover {
        border-color: var(--navy);
    }

/* ════════════════════════════════
   YOUR EDGE. BUILT IN. (Advanced Tools)
════════════════════════════════ */

.section-pill {
    display: inline-block;
    background: #E7EBFF;
    border: .05rem solid #00015E;
    border-radius: .8rem;
    padding: 1.3rem 2.2rem;
    font-size: 1.6rem;
    color: #000;
    margin-bottom: 1.8rem;
}

    .section-pill.light {
        background: #f0f0f0;
        border: .1rem solid #ddd;
        color: #555;
    }

/* Top card: Portfolio Optimiser (wide) */
.edge-top {
    background: var(--lavender);
    border-radius: 1.8rem;
    padding: 6.8rem 10rem;
    display: flex;
    align-items: center;
    gap: 4rem;
    margin-bottom: 1.8rem;
    overflow: hidden;
    position: relative;
}

.et-left {
    flex: 1;
}

    .et-left h3,
    .eb-card h3 {
        font-size: 3.8rem;
        font-weight: 400;
        color: var(--navy);
        margin-bottom: 1.8rem;
    }

    .et-left .et-bold,
    .eb-card .eb-bold {
        font-size: 2.4rem;
        font-weight: 300;
        color: var(--navy);
        margin-bottom: 1.8rem;
        line-height: 1.3;
    }

    .et-left p,
    .eb-card p {
        font-size: 1.6rem;
        color: #000;
        line-height: 1.3;
        margin-bottom: 1.8rem;
        max-width: 43.5rem;
    }
        .eb-card p {
            margin-bottom: 2.9rem
        }
        .btn-edge {
            background: transparent;
            color: var(--navy);
            border: .1rem solid var(--navy);
            border-radius: 2.5rem;
            padding: 1.3rem 1.8rem;
            font-size: 1.8rem;
            font-weight: 600;
            margin-top: 5.8rem;
            cursor: pointer;
            transition: all 0.2s;
            display: inline-block;
        }

    .btn-edge:hover {
        background: var(--navy);
        color: #fff;
    }

/* Phone mockup right */
.et-right {
    position: absolute;
    bottom: 0;
    right: 12.1rem;
}

    .et-right img {
        width: 100%;
        max-width: 40rem;
        height: auto;
    }

/* Risk gauge */
.gauge-wrap {
    text-align: center;
    padding: 1rem 0 .4rem;
}

.gauge-svg {
    width: 16rem;
    height: 9rem;
    margin: 0 auto;
}

.gauge-label {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--navy);
    margin-top: .6rem;
}

.gauge-sub {
    font-size: 1rem;
    color: #888;
    margin-bottom: .8rem;
}

.gauge-desc {
    font-size: .9rem;
    color: #888;
    text-align: center;
    line-height: 1.4;
    margin-bottom: .8rem;
}

.gauge-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .6rem .8rem;
    border: .1rem solid #eee;
    border-radius: .8rem;
    margin-bottom: .6rem;
    cursor: pointer;
}

    .gauge-row span {
        font-size: 1.1rem;
        color: var(--navy);
        font-weight: 500;
    }

    .gauge-row i {
        color: #bbb;
        font-size: 1rem;
    }

.model-port-btn {
    background: var(--navy);
    color: #fff;
    width: 100%;
    border: none;
    border-radius: .8rem;
    padding: .8rem;
    font-size: 1.1rem;
    font-weight: 700;
    cursor: pointer;
    margin-top: .4rem;
}

/* Bottom 2 cards */
.edge-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.8rem;
}

.eb-card {
    background: var(--lavender);
    border-radius: 1.8rem;
    padding: 6.8rem;
    padding-bottom: 0;
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
}

    .eb-card .btn-edge {
        margin-top: auto;
        width: max-content;
        margin-bottom: 3.6rem;
    }

/* Phone at bottom of card */
.eb-phone-wrap {
    width: 100%;
    max-width: 30rem;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

    .eb-phone-wrap img {
        width: 100%;
        max-width: 30rem;
        height: auto;
    }

/* Chart screen */
.cs-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: .9rem;
    color: #888;
    margin-bottom: .8rem;
}

    .cs-topbar .cs-ticker {
        font-weight: 700;
        color: var(--navy);
        font-size: 1rem;
    }

.cs-tools {
    display: flex;
    gap: .4rem;
}

.cs-tool {
    width: 1.2rem;
    height: 1.2rem;
    background: #eee;
    border-radius: .2rem;
}

.candlestick-wrap {
    position: relative;
    height: 10rem;
}

    .candlestick-wrap svg {
        width: 100%;
        height: 100%;
    }

/* Calculator screen */
.calc-head {
    font-size: 1rem;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: .6rem;
}

.calc-label {
    font-size: .9rem;
    color: #888;
    margin-bottom: .2rem;
}

.calc-amount {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--navy);
    margin-bottom: .8rem;
}

.calc-slider {
    width: 100%;
    accent-color: var(--blue);
    margin-bottom: .8rem;
    cursor: pointer;
}

.calc-range {
    display: flex;
    justify-content: space-between;
    font-size: .9rem;
    color: #bbb;
    margin-bottom: 1rem;
}

.calc-result {
    font-size: .9rem;
    color: #888;
    margin-bottom: .4rem;
}

.calc-result-val {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--navy);
}

.calc-btn {
    background: var(--blue);
    color: #fff;
    width: 100%;
    border: none;
    border-radius: .8rem;
    padding: .7rem;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    margin-top: .8rem;
}

/* ════════════════════════════════
   INTELLIGENCE (Investment Research)
════════════════════════════════ */

.intel-inner {
    max-width: 110rem;
    margin: 0 auto;
    padding: 0 3.2rem;
}

.intel-title {
    font-size: clamp(2.8rem, 3.5vw, 4.4rem);
    font-weight: 800;
    color: var(--blue);
    margin-bottom: 3.2rem;
}

/* Big stat card */
.intel-stat-card {
    background: var(--lavender);
    border-radius: 2.8rem;
    padding: 4.4rem;
    margin-bottom: 3.8rem;
    position: relative;
    overflow: hidden;
    text-align: center;
}

    /* Subtle chart background */
    .intel-stat-card::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        background: url(../Images/image_63.png);
        pointer-events: none;
        background-size: cover;
    }

.isc-small {
    font-size: 1.6rem;
    color: #000;
    font-weight: 600;
    margin-bottom: 3.8rem;
}

.isc-big {
    font-size: 3.8rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 1.8rem;
}

.isc-sub {
    font-size: 1.8rem;
    color: #000;
    margin: 0 auto 1.8rem;
    max-width: 52rem;
    line-height: 1.3;
}

.isc-desc {
    font-size: 1.4rem;
    color: #000;
    max-width: 62rem;
    line-height: 1.3;
    margin: 0 auto 4.8rem;
}

.intel-stats-row {
    display: flex;
    gap: 0;
    margin-bottom: 4.8rem;
}

.ist {
    flex: 1;
    text-align: center;
    padding: 1.85rem 0;
    border-right: .1rem solid #787878;
}

    .ist:last-child {
        border-right: none;
    }

.ist-num {
    font-size: 3.8rem;
    font-weight: 600;
    color: var(--navy);
}

.ist-label {
    font-size: 2.8rem;
    color: var(--navy);
}

.btn-intel {
    background: var(--navy);
    color: #fff;
    border: none;
    border-radius: 5rem;
    padding: 1.4rem 1.8rem;
    font-size: 1.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}

    .btn-intel:hover {
        background: #0d1b6e;
    }

/* Intel bottom 4 cards: 2x2 */
.intel-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    position: relative;
}

    /* Vertical Line */
    .intel-bottom::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: .2rem;
        height: 100%;
        background: linear-gradient(90deg, #00FFA2 0%, #52AAFD 100%);
        transform: translateX(-50%);
    }

    /* Horizontal Line */
    .intel-bottom::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        height: .2rem;
        background: linear-gradient(90deg, #00FFA2 0%, #52AAFD 100%);
        transform: translateY(-50%);
    }

.intel-card {
    padding: 3.6rem 2.8rem;
    transition: transform 0.25s;
    text-align: center;
}

    .intel-card:hover {
        transform: translateY(-.3rem);
    }

.ic-icon {
    width: 100%;
    max-width: 10rem;
    margin: 0 auto 2.9rem;
    display: block;
}

.ic-title {
    font-size: 2.8rem;
    font-weight: 500;
    color: var(--blue);
    margin-bottom: 1.8rem;
}

.ic-desc {
    font-size: 1.8rem;
    color: #000;
    line-height: 1.3;
    font-weight: 300;
    letter-spacing: -0.05rem;
}

/* ════════════════════════════════
   SUPPORT – WE'RE HERE. ALWAYS.
════════════════════════════════ */
.support-section {
    background: var(--lavender);
    padding: 6.7rem 0;
}

.support-inner {
    text-align: center;
}

.support-pill {
    display: inline-block;
    background: #fff;
    border: 0.5px solid #00015E; 
    border-radius: .8rem;
    padding: 1.2rem 2.4rem;
    font-size: 1.6rem;
    color: #000;
    margin-bottom: 1.6rem;
}

.support-sub {
    font-size: 1.5rem;
    color: var(--muted);
    line-height: 1.7;
    margin-bottom: 4.8rem;
}

.support-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.8rem;
    margin: 5.8rem 0;
}

.sc {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2.8rem;
}

.sc-img {
    width: 100%;
    border-radius: 1.2rem;
    overflow: hidden;
    margin-bottom: 1.8rem;
    aspect-ratio: 2/1.745;
    background: #D9D9D9;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .sc-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.sc-title {
    font-size: 2.4rem;
    font-weight: 500;
    color: var(--blue);
    margin-bottom: 1.8rem;
    line-height: 1.3;
}

.sc-desc {
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.25;
}

.support-btns {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem;
    margin-top: .8rem;
}

.btn-sup {
    border-radius: 5rem;
    padding: 1.3rem 3.6rem;
    font-size: 1.8rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
}

.btn-sup-dark {
    background: var(--navy);
    color: #fff;
}

    .btn-sup-dark:hover {
        background: #0d1b6e;
    }

.btn-sup-outline {
    background: var(--navy);
    color: #fff;
}

/* ════════════════════════════════
   KNOW YOUR MONEY (Fraud Free)
════════════════════════════════ */

.fraud-inner {
    text-align: center;
}

.fraud-title {
    font-size: clamp(2.6rem, 3.5vw, 4.2rem);
    font-weight: 800;
    background: linear-gradient(90deg, #1a78ff, #00e5ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 3.2rem;
    line-height: 1.2;
}

/* Big banner */
.fraud-banner {
    background: linear-gradient(120deg, #1230a0 0%, #1e40cc 40%, #3060f0 70%, #1a3ec8 100%);
    border-radius: 2rem;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    margin-bottom: 2.4rem;
    min-height: 28rem;
    position: relative;
}

.fb-left {
    padding: 4.4rem 4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 42rem;
    flex-shrink: 0;
    z-index: 1;
}

    .fb-left h2 {
        font-size: clamp(2.2rem, 3vw, 3.4rem);
        font-weight: 900;
        color: #fff;
        margin-bottom: 1.4rem;
        line-height: 1.2;
    }

.fb-btns {
    display: flex;
    gap: 1.2rem;
    flex-wrap: wrap;
    margin-top: .4rem;
}

.btn-watch {
    background: rgba(255, 255, 255, 0.15);
    border: .15rem solid rgba(255, 255, 255, 0.3);
    color: #fff;
    border-radius: 5rem;
    padding: 1rem 2rem;
    font-size: 1.3rem;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: .7rem;
}

.btn-learn {
    background: var(--navy);
    color: #fff;
    border: none;
    border-radius: 5rem;
    padding: 1rem 2rem;
    font-size: 1.3rem;
    font-weight: 700;
    cursor: pointer;
}

/* Scam 2025 poster area */
.fb-right {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.fb-right-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #0d1b6e, #1a3ec8, #6030c0);
    opacity: 0.8;
}

.scam-poster {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 2rem;
}

.scam-title-text {
    font-size: clamp(2.4rem, 3vw, 4rem);
    font-weight: 900;
    color: #fff;
    letter-spacing: .1rem;
}

.scam-sub-text {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.6);
    margin-top: .4rem;
    letter-spacing: .15rem;
    text-transform: uppercase;
}

.scam-by {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.4);
    margin-top: .8rem;
}

/* 2x2 fraud cards */
.fraud-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    text-align: left;
}

.fcard {
    background: var(--lavender);
    border-radius: 2.8rem;
    padding: 3.4rem;
    transition: transform 0.2s;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    text-align: center;
}

    .fcard:hover {
        transform: translateY(-.3rem);
    }

.fcard-icon {
    margin-bottom: 1.8rem;
}

    .fcard-icon img {
        width: 100%;
        max-width: 10rem;
        height: auto;
    }

.fcard-title {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--navy);
    margin-bottom: 1.8rem;
}

.fcard-desc {
    font-size: 1.8rem;
    color: #00000080;
    line-height: 1.3;
    max-width: 36.6rem;
}

.fraudSection {
    background-image: url("../Images/17707228563866_1.jpg");
    background-size: cover;
    background-position: center;
    padding: 19.2rem 12.1rem;
    margin: 4rem auto;
    max-width: 123.6rem;
    width: 100%;
    border-radius: 3.8rem;
    text-align: start;
}

    .fraudSection .d-flex {
        gap: 2.8rem;
        align-items: center;
    }

    .fraudSection .btn-sup-dark {
        border: .1rem solid #FFFFFF;
        font-size: 1.8rem;
        font-weight: 400;
        padding: 1rem 1.8rem;
    }

.fraudContent {
    max-width: 88%;
}

.fraudTitle {
    font-size: 5.8rem;
    font-weight: 300;
    color: #ffffff;
    margin-bottom: 2.8rem;
}

.watchButton {
    position: relative;
    overflow: hidden;
    z-index: 1;
    background-color: transparent;
    border: 0.1rem solid #ffffff;
    border-radius: 2.4rem;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 0;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.3s ease, border-color 0.4s ease;
}

    .watchButton::before {
        content: '';
        position: absolute;
        inset: 0;
        background-color: #ffffff;
        z-index: -2;
        border-radius: inherit;
    }

    .watchButton::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 0;
        background: linear-gradient(45deg, #003b8f 0%, #001028 100%);
        z-index: -1;
        transition: width 0.4s ease;
        border-radius: inherit;
    }

    .watchButton:hover {
        transform: scale(1.04);
        box-shadow: 0 0.6rem 2rem rgba(0, 0, 0, 0.2);
        border-color: transparent;
    }

        .watchButton:hover::after {
            width: 100%;
        }

        .watchButton:hover .watchText {
            color: #ffffff;
        }

.watchText {
    font-size: 1.8rem;
    font-weight: 400;
    color: #000000;
    padding: 1rem 1.4rem 1rem .68rem;
    transition: color 0.4s ease;
}

.playButton {
    background: linear-gradient(45deg, #003b8f 0%, #001028 100%);
    padding: 1rem;
    margin: 0.4rem 0.4rem 0.4rem 1.2rem;
    min-width: 2.9rem;
    width: 2.9rem;
    height: 2.9rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .playButton svg {
        width: 100%;
        max-width: 100%;
    }

.playIcon {
    width: 1.8rem;
    height: 1.8rem;
}

/* ════════════════════════════════
   PROTECT YOUR WEALTH (App section)
════════════════════════════════ */
.app-section {
}

.app-inner {
    background: var(--lavender);
    padding: 5.3rem 5.8rem 0;
    border-radius: 3.8rem;
    display: flex;
    align-items: end;
    gap: 1.8rem;
}

/* Left phone */
.app-phone-left,
.app-phone-right {
    flex-shrink: 0;
    width: 22.2rem;
}

    .app-phone-left img,
    .app-phone-right img {
        width: 100%;
    }

/* Centre content */
.app-center {
    flex: 1;
    text-align: center;
    margin-bottom: 2.8rem;
}

    .app-center h2 {
        font-size: 4.8rem;
        font-weight: 600;
        color: var(--navy);
        margin-bottom: 7.4rem;
    }

    .app-center p {
        font-size: 1.4rem;
        color: var(--blue);
        line-height: 1.2;
        margin-bottom: 3.8rem;
    }

.app-brands {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    flex-wrap: wrap;
    margin-bottom: 1.6rem;
}

    .app-brands img {
        width: auto;
        height: 100%;
        max-height: 3.2rem;
    }

        .app-brands img:first-child {
            max-height: 2.4rem;
        }



.ab-sub {
    font-size: .9rem;
    color: #888;
    text-transform: uppercase;
    letter-spacing: .05rem;
}

.app-stores {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    flex-wrap: wrap;
}

    .app-stores > div {
        display: flex;
        align-items: center;
        gap: .8rem;
    }
        .app-stores > div > img {
            max-width: 50%;
        }
.bottom-fade {
    width: 100%;
    height: 49px;
    background: #E7EBFF;
    backdrop-filter: blur(14.800000190734863px);
    position: absolute;
    bottom: 0;
}
        .app-stores > div .topImg {
            flex: 100%;
        }

        .app-stores > div > div, .app-stores > div > div > div {
            display: flex;
            flex-direction: column;
            gap: .6rem;
        }

.store-btn {
    background: #000;
    color: #fff;
    border: none;
    border-radius: 1.6rem;
    padding: .4rem .6rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    cursor: pointer;
    transition: background 0.2s;
    text-align: left;
    border: .1rem solid var(--muted);
}

    .store-btn:hover {
        background: #222;
    }

    .store-btn i {
        font-size: 1.7rem;
    }

.sb-text small {
    font-size: .9rem;
    color: rgba(255, 255, 255, 0.6);
    display: block;
}

.sb-text strong {
    font-size: 1.3rem;
    display: block;
}

.qr-box {
    width: 6rem;
    height: 6rem;
    border-radius: 1.6rem;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .7rem;
}

    .qr-box img {
        width: 100%;
    }

/* ════════════════════════════════
   HDFC DIFFERENCE
════════════════════════════════ */
.diff-section {
    padding-top: 0;
}

.diff-inner {
    text-align: center;
}

.diff-stats-row {
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    margin: 5.8rem 0;
}

.ds-item {
    flex: 1;
    text-align: center;
    max-width: 28rem;
}

.ds-num {
    font-size: 9.8rem;
    font-weight: 300;
    color: var(--blue);
    line-height: 1;
    margin-bottom: 2rem;
}

.ds-label {
    font-size: 2.8rem;
    color: #000000;
    font-weight: 400;
}

.diff-sub {
    font-size: 2.8rem;
    color: var(--blue);
    line-height: 1.3;
    font-weight: 300;
    margin: 0 auto;
}


/* ════════════════════════════════
   BOTTOM CTA BAR
════════════════════════════════ */
.cta-bar {
    background: var(--navy);
    padding: 1.2rem 3.2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.2rem;
    border-top: .1rem solid rgba(255, 255, 255, 0.08);
}

    .cta-bar span {
        font-size: 1.4rem;
        color: #fff;
    }

    .cta-bar a {
        color: #60a5fa;
        font-weight: 600;
    }

.btn-cta-red {
    background: var(--red);
    color: #fff;
    border: none;
    border-radius: .8rem;
    padding: .9rem 2.2rem;
    font-size: 1.4rem;
    font-weight: 700;
    cursor: pointer;
}

/* ════════════════════════════════
   MODALS
════════════════════════════════ */
.modal-content {
    border-radius: 1.6rem;
    border: none;
    overflow: hidden;
}

.modal-hdr {
    background: linear-gradient(135deg, var(--navy), var(--blue));
    padding: 2.8rem 3.2rem;
    border: none;
}

    .modal-hdr h5 {
        color: #fff;
        font-weight: 800;
        font-size: 2rem;
        margin-bottom: .4rem;
    }

    .modal-hdr p {
        color: rgba(255, 255, 255, 0.6);
        font-size: 1.3rem;
        margin: 0;
    }

.modal-body {
    padding: 2.8rem 3.2rem;
}

.form-group {
    margin-bottom: 1.8rem;
}

    .form-group label {
        display: block;
        font-size: 1.3rem;
        font-weight: 600;
        color: #333;
        margin-bottom: .6rem;
    }

    .form-group input,
    .form-group select {
        width: 100%;
        padding: 1.1rem 1.4rem;
        border: .15rem solid var(--border);
        border-radius: .8rem;
        font-size: 1.4rem;
        color: #333;
        outline: none;
        font-family: "Inter", sans-serif;
        background: #fff;
        transition: border-color 0.2s;
    }

        .form-group input:focus,
        .form-group select:focus {
            border-color: var(--blue);
        }

.btn-modal-submit {
    width: 100%;
    background: var(--red);
    color: #fff;
    border: none;
    border-radius: .8rem;
    padding: 1.3rem;
    font-size: 1.5rem;
    font-weight: 700;
    cursor: pointer;
    margin-top: .4rem;
}

.modal-note {
    text-align: center;
    font-size: 1.1rem;
    color: #999;
    margin-top: 1.2rem;
}

    .modal-note a {
        color: var(--blue);
    }

/* ════════════════════════════════
   HAMBURGER BUTTON (hidden on desktop)
════════════════════════════════ */
.hamburger-btn {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    width: 2.8rem;
    height: 2.2rem;
    position: relative;
    flex-direction: column;
    justify-content: space-between;
    padding: 0;
    z-index: 1001;
}

    .hamburger-btn span {
        display: block;
        width: 100%;
        height: .25rem;
        background: #fff;
        border-radius: .2rem;
        transition: all 0.3s ease;
        transform-origin: center;
    }

    .hamburger-btn.active span:nth-child(1) {
        transform: translateY(9.75px) rotate(45deg);
    }

    .hamburger-btn.active span:nth-child(2) {
        opacity: 0;
    }

    .hamburger-btn.active span:nth-child(3) {
        transform: translateY(-9.75px) rotate(-45deg);
    }

/* ════════════════════════════════
   RESPONSIVE
════════════════════════════════ */

/* ─── 1100px: hide hero cards, tighten mega menu ─── */
@media (max-width: 1100px) {
    .hero-cards {
        display: none;
    }

    .mega-inner {
        gap: 3.2rem;
        padding: 0 3.2rem;
    }

    .mega-col {
        min-width: 120px;
    }

    .mega-heading {
        font-size: 1.2rem;
    }

    .mega-col a {
        font-size: 1.2rem;
    }
}

/* ─── 900px: tablet adjustments ─── */
@media (max-width: 900px) {
    .header-top {
        padding: 1.2rem 1.6rem;
    }

    .header-nav {
        padding: 0 1.6rem;
        flex-wrap: wrap;
        gap: 1rem;
    }

    .nav-dd-btn {
        font-size: 1.4rem;
        gap: .6rem;
    }

    .mega-dropdown {
        padding: 2.4rem 0 3.6rem;
    }

    .mega-inner {
        gap: 2.4rem;
        padding: 0 2.4rem;
    }

    .mega-col {
        min-width: 10rem;
    }

    .mega-heading {
        font-size: 1.1rem;
        margin-bottom: 1rem;
    }

    .mega-col a {
        font-size: 1.1rem;
        padding: .3rem 0;
    }

    .header-ticker .ticker-item:nth-child(n + 4) {
        display: none;
    }

    .wealth-cards {
        grid-template-columns: 1fr 1fr;
    }

        .wealth-cards .wc:last-child {
            grid-column: span 2;
        }

    .edge-top {
        flex-direction: column;
    }

    .et-right {
        width: 100%;
        display: flex;
        justify-content: center;
        position: relative;
        right: 0;
    }

    .intel-bottom {
        grid-template-columns: 1fr 1fr;
    }

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

        .support-grid .sc:last-child {
            grid-column: span 2;
        }

    .fraud-cards {
        grid-template-columns: 1fr 1fr;
    }

    .app-inner {
        flex-direction: column;
        text-align: center;
    }

    .app-phone-left,
    .app-phone-right {
        width: 150px;
    }

    .footer-main {
        grid-template-columns: 1fr 1fr;
        gap: 2.8rem;
    }

    .diff-stats-row {
        flex-wrap: wrap;
    }
}

/* ─── 768px: Mobile layout ─── */
@media (max-width: 768px) {

    /* ── Container ── */
    .container {
        padding: 0 2rem;
    }

    /* ── Header ── */
    .hamburger-btn {
        display: flex;
    }

    .header-top {
        padding: 1.4rem 0;
        gap: 1.2rem;
    }

    .h-logo img {
        width: 110px;
    }

    .header-ticker {
        display: none;
    }

    .btn-open-acct {
        padding: .8rem 1.4rem;
        font-size: 1.2rem;
        border-radius: 2rem;
        min-width: auto;
    }

    .btn-login {
        padding: .8rem 1rem;
        font-size: 1.2rem;
    }

    .header-actions {
        gap: .6rem;
        margin-left: auto;
    }

    /* ── Mobile Nav (hidden by default) ── */
    .header-nav {
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 0 0 1.6rem;
        border-top: .1rem solid rgba(255, 255, 255, 0.1);
    }

        .header-nav.nav-open {
            display: flex;
            position: absolute;
            background: #00015e;
            width: 100%;
            right: 0;
            padding: 16px;
            height: 90vh;
            justify-content: start;
            overflow: auto;
            flex-direction: column;
            flex-wrap: nowrap;
        }

    .nav-dd {
        border-bottom: .1rem solid rgba(255, 255, 255, 0.08);
    }

    .nav-dd-btn {
        width: 100%;
        justify-content: space-between;
        padding: 1.4rem 0;
        font-size: 1.4rem;
    }

    .mega-dropdown {
        position: relative;
        width: 100%;
        padding: 0;
        transform: none;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        box-shadow: none;
        transition: max-height 0.35s ease, opacity 0.25s ease, visibility 0.25s, padding 0.25s ease;
    }

    .nav-dd:hover .mega-dropdown {
        max-height: 800px;
        opacity: 1;
        visibility: visible;
        padding: .8rem 0 1.6rem;
        transform: none;
    }

    .mega-inner {
        flex-direction: column;
        gap: 1.8rem;
        padding: 0 .8rem;
    }

    .mega-col {
        min-width: unset;
    }

    .mega-heading {
        font-size: 1.1rem;
        margin-bottom: .6rem;
    }

    .mega-col a {
        font-size: 1.2rem;
        padding: .3rem 0;
    }

    .nav-search {
        max-width: 100%;
        margin-top: .8rem;
    }

        .nav-search input {
            font-size: 1.4rem;
            padding: .9rem 1.4rem .9rem 4.4rem;
        }

        .nav-search .si {
            font-size: 1.6rem;
            left: 1.6rem;
        }

    /* ── Hero ── */
    .hero {
        padding: 3.6rem 0 0;
    }

    .hero-inner {
        padding: 0 1.6rem;
    }

    .hero h1 {
        font-size: 2.8rem;
        margin-bottom: 1.2rem;
    }

    .hero-sub {
        font-size: 1.3rem;
        margin-bottom: 2.4rem;
        line-height: 1.6;
    }

    .hero-btns {
        gap: 1rem;
        margin-bottom: 3.2rem;
    }

    .btn-hero-white,
    .btn-hero-outline {
        padding: 1rem 2.2rem;
        font-size: 1.3rem;
    }

    .hero-dots {
        padding: 1.4rem 0;
    }

    .hero-enroll {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        padding: 1.4rem 1.6rem;
    }

    .he-text {
        font-size: 1.3rem;
        text-align: center;
    }

    .he-input {
        max-width: 100%;
    }

        .he-input input {
            font-size: 1.3rem;
        }

    .btn-open-trading {
        font-size: 1.6rem;
        padding: 1rem 1.8rem;
    }

    /* ── Section Titles ── */
    section {
        padding: 3.8rem 0;
    }

        section.intel-section {
            padding-top: 0;
        }

    .sectionTitle {
        font-size: 2.6rem;
        margin-bottom: 1.2rem;
    }

    .subTitle {
        font-size: 1.4rem;
        margin-bottom: 2.4rem;
    }

        .subTitle br,
        .hero-sub br,
        .diff-sub br,
        .fraudTitle br {
            display: none;
        }

    .section-pill {
        font-size: 1.1rem;
        padding: .6rem 1rem;
        margin-bottom: 1.2rem;
    }

    /* ── Wealth Section ── */
    .wealth-section {
        padding-top: 3.8rem;
    }

    .wealth-inner {
        padding-bottom: 3.8rem;
    }

    .wealth-cards {
        grid-template-columns: 1fr;
    }

        .wealth-cards .wc:last-child {
            grid-column: span 1;
        }

    .wc {
        padding: 2.2rem 2rem;
        border-radius: 1.6rem;
        min-height: 42rem;
    }

    .wc-top {
        margin-bottom: 2.8rem;
    }

        .wc-top img {
            max-width: 110px;
        }

    .wc-badge {
        font-size: 1rem;
        padding: .6rem 1.2rem;
    }

    .wc-heading {
        font-size: 2rem;
        margin-bottom: 1.8rem;
    }

        .wc-heading br {
            display: none;
        }

    .wc-items {
        margin-bottom: 2.4rem;
    }

    .wc-item {
        font-size: 1.3rem;
        padding: .5rem 0;
    }

    .btn-wc {
        font-size: 1.4rem;
        padding: 1rem 1.6rem;
    }

    /* ── Edge Section (Your Edge Built In) ── */
    .edge-top {
        padding: 2.8rem;
        border-radius: 1.4rem;
        flex-direction: column;
        gap: 2.4rem;
        text-align: center;
    }

    .et-left h3,
    .eb-card h3 {
        font-size: 2.2rem;
        margin-bottom: 1rem;
    }

    .et-left .et-bold,
    .eb-card .eb-bold {
        font-size: 1.6rem;
        margin-bottom: 1.2rem;
    }

    .et-left p,
    .eb-card p {
        font-size: 1.3rem;
        margin-bottom: 1.2rem;
    }

    .btn-edge {
        font-size: 1.4rem;
        padding: .9rem 1.6rem;
        margin-top: 1.6rem;
    }

    .et-right {
        position: relative;
        right: auto;
    }

        .et-right img {
            max-width: 260px;
        }

    .edge-bottom {
        grid-template-columns: 1fr;
        gap: 1.8rem;
    }

    .eb-card {
        padding: 2.8rem;
        border-radius: 1.4rem;
        text-align: center;
        align-items: center;
    }

    .eb-phone-wrap {
        max-width: 220px;
        margin-top: -2rem;
        bottom: -2.8rem;
    }

    /* ── Intel Section ── */
    .intel-stat-card {
        padding: 2.8rem 2rem;
        border-radius: 1.6rem;
    }

    .isc-big {
        font-size: 2.6rem;
    }

    .isc-sub {
        font-size: 1.3rem;
    }

        .isc-sub br {
            display: none;
        }

    .isc-desc {
        font-size: 1.3rem;
    }

        .isc-desc br {
            display: none;
        }

    .intel-stats-row {
        gap: 1.6rem;
        flex-wrap: wrap;
        justify-content: center;
        flex-direction: column;
        width: max-content;
        margin: auto;
    }

    .ist {
        border-right: 0;
        border-bottom: .1rem solid #787878;
    }

        .ist:last-child {
            border: 0;
        }

    .ist-num {
        font-size: 2.8rem;
    }

    .ist-label {
        font-size: 1.8rem;
    }

    .btn-intel {
        font-size: 1.4rem;
        padding: 1rem 2rem;
    }

    .intel-bottom {
        grid-template-columns: 1fr;
        gap: 1.8rem;
    }

        .intel-bottom::before,
        .intel-bottom::after {
            display: none;
        }

    .intel-card {
        padding: 2.6rem 1.8rem;
        background: #F2F6FF;
        border-radius: 2.8rem;
    }

    .ic-icon {
        max-width: 3.8rem;
        margin-bottom: 1.8rem;
    }

    .ic-title {
        font-size: 1.8rem;
        margin-bottom: 1rem;
    }

    .ic-desc {
        font-size: 1.4rem;
    }

    /* ── Support Section ── */
    .support-section {
        padding: 4rem 0;
    }

    .support-grid {
        grid-template-columns: 1fr;
        gap: 1.4rem;
        margin: 3.2rem 0;
    }

        .support-grid .sc:last-child {
            grid-column: span 1;
        }

    .sc {
        padding: 1.6rem;
    }

    .sc-title {
        font-size: 1.8rem;
        margin-bottom: 1rem;
    }

        .sc-title br {
            display: none;
        }

    .sc-desc {
        font-size: 1.4rem;
    }

    .support-btns {
        gap: 1rem;
    }

    .btn-sup {
        padding: 1.1rem 2.4rem;
        font-size: 1.3rem;
    }

    /* ── Fraud Section ── */
    .fraud-inner p {
        font-size: 1.4rem;
    }

        .fraud-inner p br {
            display: none;
        }

    .fraudSection {
        padding: 2.8rem;
        border-radius: 2rem;
        margin: 2.4rem auto;
        background-image: url(../Images/17707228563866_1_Mo.jpg);
        min-height: 50rem
    }
    .fraudContent {
        max-width: 100%;
    }
    .fraudTitle {
        font-size: 2.8rem;
        margin-bottom: 2.8rem;
        text-align: center;
    }

    .fraudSection .d-flex {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.2rem;
    }

    .watchText {
        font-size: 1.4rem;
    }

    .fraudSection .btn-sup-dark {
        font-size: 1.4rem;
    }

    .fraud-cards {
        grid-template-columns: 1fr;
        gap: 1.4rem;
    }

    .fcard {
        padding: 2.4rem 2rem;
        border-radius: 1.8rem;
    }

    .fcard-icon {
        margin-bottom: 1.2rem;
    }

        .fcard-icon img {
            max-width: 64px;
        }

    .fcard-title {
        font-size: 1.8rem;
        margin-bottom: 1rem;
    }

    .fcard-desc {
        font-size: 1.4rem;
    }

    /* ── HDFC Difference ── */
    .diff-section {
        padding: 4rem 0;
    }

    .diff-stats-row {
        flex-direction: column;
        align-items: center;
        gap: 4.4rem;
        margin: 5.8rem 0;
    }

    .ds-num {
        font-size: 5.8rem;
        margin-bottom: .8rem;
    }

    .ds-label {
        font-size: 1.8rem;
    }

    .diff-sub {
        font-size: 1.6rem;
    }

    /* ── App Section ── */
    .app-inner {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        padding: 2.8rem 2rem 0;
        border-radius: 2rem;
        gap: 1.2rem;
    }

    .app-phone-left,
    .app-phone-right {
        width: 10rem;
        order: 2;
        display: none;
    }

    .app-center {
        order: 1;
        width: 100%;
        margin-bottom: 1.6rem;
    }

        .app-center h2 {
            font-size: 2.4rem;
            margin-bottom: 1.2rem;
        }

        .app-center p {
            font-size: 1.3rem;
            margin-bottom: 2rem;
        }

    .app-brands {
        /* justify-content: center; */
        gap: 1.6rem;
    }

        .app-brands img {
            max-height: 2.2rem;
        }

            .app-brands img:first-child {
                max-height: 1.8rem;
            }

    .app-stores {
        /* justify-content: center; */
        gap: 1.6rem;
    }

    .qr-box {
        width: 4.8rem;
        height: 4.8rem;
        border-radius: 1rem;
    }

    .app-stores > div > div a img {
        max-height: 3.2rem;
    }

    /* ── CTA Bar ── */
    .cta-bar {
        flex-direction: column;
        gap: .8rem;
        padding: 1.4rem 1.6rem;
        font-size: 1.2rem;
        text-align: center;
    }

    .btn-cta-red {
        font-size: 1.3rem;
        padding: 1rem 2rem;
        width: 100%;
    }

    /* ── Footer ── */
    .footer-main {
        grid-template-columns: 1fr;
        gap: 2.4rem;
        padding: 3.2rem 1.6rem 2.4rem;
    }

    .foot-brand p {
        font-size: 1.1rem;
    }

    .foot-phone a {
        font-size: 1.6rem;
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: .8rem;
        padding: 1.4rem 1.6rem;
    }

    .footer-links {
        flex-wrap: wrap;
        justify-content: center;
        gap: 1.2rem;
    }

    .sebi-bar {
        padding: 1.4rem 1.6rem;
        font-size: .9rem;
    }

    /* ── Modals ── */
    .modal-body {
        padding: 2rem 1.6rem;
    }
}

/* ─── 480px: Small phones ─── */
@media (max-width: 480px) {
    .hero h1 {
        font-size: 2.4rem;
    }

    .hero-sub {
        font-size: 1.2rem;
    }

    .hero-btns {
        flex-direction: column;
        gap: .8rem;
    }

    .btn-hero-white,
    .btn-hero-outline {
        width: 100%;
        text-align: center;
    }

    .sectionTitle {
        font-size: 2.2rem;
    }

    .subTitle {
        font-size: 1.2rem;
    }

    .wc-heading {
        font-size: 1.8rem;
    }

    .et-left h3,
    .eb-card h3 {
        font-size: 2rem;
    }

    .et-left .et-bold,
    .eb-card .eb-bold {
        font-size: 1.5rem;
    }

    .isc-big {
        font-size: 2.2rem;
    }

    /* .ds-num {
        font-size: 4.2rem;
    } */

    /* .ds-label {
        font-size: 1.4rem;
    } */

    .diff-sub {
        font-size: 1.4rem;
    }

    .app-center h2 {
        font-size: 2rem;
    }

    .app-phone-left,
    .app-phone-right {
        width: 80px;
    }

    /* .app-stores {
        flex-direction: column;
        align-items: center;
    } */
}

/*____________________________________________________________________________*/

:root {
    --unit: 10px;
}

@media (max-width: 1439.98px) {
    :root {
        --unit: 8.4px;
    }
}

@media (max-width: 1399.98px) {
    :root {
        --unit: 7.75px;
    }
}

@media (max-width: 1199.98px) {
    :root {
        --unit: 7.1px;
    }
}

@media (max-width: 991.98px) {
    :root {
        --unit: 10px;
    }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

header {
    color: #000000;
    background-color: #ffffff;
}

header,
footer {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    line-height: 1.3;
    z-index: 1020;
}

    header img,
    footer img {
        max-width: 100%;
        height: auto;
        display: block;
    }

    header button,
    footer button {
        border: none;
        cursor: pointer;
        font-family: inherit;
    }

    header input,
    footer input {
        font-family: inherit;
        border: none;
        outline: none;
    }

    header .container,
    footer .container {
        width: 100%;
        max-width: 144rem !important;
        margin: 0 auto;
        padding: 0 4.8rem !important;
    }

    header .positionRelative,
    footer .positionRelative {
        position: relative;
    }

@media (max-width: 991.99px) {

    header .container,
    footer .container {
        padding: 0 1.6rem !important;
    }
}

/* _header.scss */
header.header {
    background-color: #ffffff;
    padding: calc(var(--unit) * 1.9) 0 calc(var(--unit) * 2.2);
    position: fixed;
    top: 0;
    z-index: 100;
    width: 100%;
    transition: padding 0.4s ease, box-shadow 0.4s ease, background-color 0.4s ease;
}

.header.scrolled {
    padding: calc(var(--unit) * 1) 0;
    box-shadow: 0 calc(var(--unit) * 0.4) calc(var(--unit) * 2.4) rgba(0, 0, 0, 0.12);
}

/* Backdrop for Mobile Menu */
.menuBackdrop {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    opacity: 0;
    transition: opacity 0.3s ease;
}

    .menuBackdrop.active {
        display: block;
        opacity: 1;
    }

/* Close Button */
.menuClose {
    display: none;
    background: none;
    border: none;
    color: #ffffff;
    font-size: calc(var(--unit) * 3.6);
    position: absolute;
    top: calc(var(--unit) * 1.6);
    right: calc(var(--unit) * 2.4);
    cursor: pointer;
    line-height: 1;
}

.headerContent {
    display: flex;
    flex-direction: column;
    gap: calc(var(--unit) * 1.8);
    align-items: center;
    width: 100%;
    max-width: calc(var(--unit) * 144);
    margin: 0 auto;
    padding: 0 calc(var(--unit) * 4.8);
}

.headerMain {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    position: relative;
}

.logo {
    width: calc(var(--unit) * 13.8);
    height: calc(var(--unit) * 4.2);
    margin-top: calc(var(--unit) * 1);
    transition: transform 0.3s ease;
}

    .logo:hover {
        transform: scale(1.04);
    }

.navMenu {
    display: flex;
    position: absolute;
    right: 0;
    width: max-content;
    background: linear-gradient(230deg, #001028 0%, #003b8f 50%, #001028 100%);
    border-radius: calc(var(--unit) * 3);
    padding: calc(var(--unit) * 1.8) calc(var(--unit) * 3);
    flex-direction: column;
    align-items: center;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1000;
}

.navLinks {
    display: flex;
    gap: calc(var(--unit) * 1.8);
    font-weight: 500;
    align-items: center;
    width: 100%;
    justify-content: center;
}

.navItem {
    position: relative;
}

    .navItem.open > .navLink::after {
        transform: rotate(180deg);
    }

.navLink {
    color: #ffffff;
    text-decoration: none;
    font-size: calc(var(--unit) * 1.8);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: calc(var(--unit) * 0.4);
    transition: color 0.3s ease;
}

    .navLink:focus,
    .btnPrimary:focus,
    btnSecondary:focus {
        color: #fff;
    }

    .navLink::after {
        content: "";
        display: block;
        width: calc(var(--unit) * 2.4);
        height: calc(var(--unit) * 2.4);
        background-image: url("../Images/keyboard_arrow_down.svg");
        background-size: calc(var(--unit) * 2.4);
        transition: transform 0.3s ease;
    }

    .navLink:hover {
        -webkit-text-stroke: .05rem;
        color: #fff;
        outline: .2rem solid #fff;
        /* Crucial for WCAG: indicates which link is active */
        outline-offset: .4rem;
    }

.megaDropdown {
    position: relative;
    width: 100%;
    background: transparent;
    border-radius: 0;
    padding: 0 calc(var(--unit) * 1);
    pointer-events: none;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease, padding 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

    .megaDropdown.active {
        opacity: 1;
        max-height: 84vh;
        padding: calc(var(--unit) * 2.8) 0 calc(var(--unit) * 1.2);
        pointer-events: auto;
        overflow: auto;
    }

.dropdownPanel {
    display: none;
    grid-template-columns: repeat(auto-fit, minmax(calc(var(--unit) * 11.6), max-content));
    gap: calc(var(--unit) * 5.8);
    width: 100%;
    animation: panelFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

    .dropdownPanel.visible {
        display: grid;
    }

    .dropdownPanel#panelMarkets,
    .dropdownPanel#panelProducts,
    .dropdownPanel#panelDistribution {
        grid-template-columns: repeat(3, minmax(calc(var(--unit) * 11.6), max-content));
    }

    .dropdownPanel#panelPersonal {
        grid-template-columns: repeat(2, minmax(calc(var(--unit) * 11.6), max-content));
    }

    .dropdownPanel#panelProducts {
        column-gap: calc(var(--unit) * 3.2);
    }

@keyframes panelFadeIn {
    from {
        opacity: 0;
        transform: translateY(calc(var(--unit) * 0.6));
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.dropdownCol .menuHead {
    color: #ffffff;
    font-size: calc(var(--unit) * 1.8);
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 calc(var(--unit) * 2.4) 0;
}

.dropdownCol ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: calc(var(--unit) * 1.2);
}

    .dropdownCol ul li a {
        color: rgba(255, 255, 255, 0.82);
        text-decoration: none;
        font-size: calc(var(--unit) * 1.8);
        font-weight: 400;
        transition: color 0.2s ease;
        display: block;
        cursor: pointer;
    }

        .dropdownCol ul li a:hover {
            color: #4ca8ff;
        }

.headerButtons {
    display: flex;
    justify-content: flex-end;
    gap: calc(var(--unit) * 0.8);
}

@property --btn-angle {
    syntax: "<angle>";
    initial-value: 180deg;
    inherits: false;
}

.btnPrimary,
.btnSecondary {
    color: #ffffff;
    padding: calc(var(--unit) * 1.8) calc(var(--unit) * 2.1);
    font-size: calc(var(--unit) * 1.8);
    line-height: 1.3;
    font-weight: 400;
    text-decoration: none;
    border-radius: calc(var(--unit) * 3);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: calc(var(--unit) * 10.8);
    text-align: center;
    position: relative;
    overflow: hidden;
    z-index: 1;
    --btn-angle: 180deg;
    transition: --btn-angle 0.15s ease, box-shadow 0.3s ease;
}

    .btnPrimary span,
    .btnSecondary span {
        position: relative;
        display: inline-block;
        transition: transform 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94), font-weight 0.15s ease;
    }

    .btnPrimary:hover,
    .btnSecondary:hover {
        --btn-angle: 0deg;
    }

        .btnPrimary:hover span,
        .btnSecondary:hover span {
            /*font-weight: 600;*/
            -webkit-text-stroke: .05rem;
            color: #fff;
        }

.btnPrimary {
    background: linear-gradient(var(--btn-angle), #dd2127 0%, #771115 100%);
}

.btnSecondary {
    background: linear-gradient(var(--btn-angle), #003b8f 0%, #001028 100%);
}

.hamburger,
.SearchBtn {
    display: none;
    background: none;
    border: none;
    font-size: calc(var(--unit) * 2.4);
    cursor: pointer;
}

.marketTicker {
    background-color: #ffffff;
    border: calc(var(--unit) * 0.1) solid transparent;
    border-radius: calc(var(--unit) * 2.5);
    background: linear-gradient(#ffffff, #ffffff) padding-box, linear-gradient(180deg, #003b8f 0%, #1b1924 100%) border-box;
    /* Gradient border */
    padding: calc(var(--unit) * 0.8) calc(var(--unit) * 2.4);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(var(--unit) * 1.8);
    min-height: calc(var(--unit) * 5);
    flex-wrap: wrap;
    width: fit-content;
    align-self: center;
    animation: tickerSlideIn 0.7s ease 0.5s both;
}

@keyframes tickerSlideIn {
    from {
        opacity: 0;
        transform: translateX(calc(var(--unit) * 3));
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.tickerItem {
    display: flex;
    align-items: center;
    gap: calc(var(--unit) * 0.4);
    font-size: calc(var(--unit) * 1.4);
    color: #000000;
}

    .tickerItem svg {
        width: calc(var(--unit) * 2.4);
        height: auto;
    }

        .tickerItem svg.up {
            transform: rotate(180deg);
        }

            .tickerItem svg.up path {
                fill: #20a100;
            }

.tickerSeparator {
    width: calc(var(--unit) * 0.1);
    height: calc(var(--unit) * 1.4);
    background-color: #1d4582;
}

@media (max-width: 992px) {

    .btnPrimary,
    .btnSecondary {
        padding: calc(var(--unit) * 1.4) calc(var(--unit) * 1.7);
        font-size: calc(var(--unit) * 1.8);
    }
}

@media (max-width: 992px) {

    .hamburger,
    .SearchBtn {
        display: block;
    }

    .headerButtons {
        gap: 0;
    }

        .headerButtons .btnPrimary,
        .headerButtons .btnSecondary {
            display: none;
        }

    .navMenu {
        display: flex;
        position: fixed;
        right: -100%;
        top: 0;
        width: calc(var(--unit) * 32);
        max-width: 85vw;
        height: 100vh;
        background: linear-gradient(180deg, #001028 0%, #003b8f 100%);
        border-radius: 0;
        flex-direction: column;
        align-items: flex-start;
        padding: calc(var(--unit) * 6) calc(var(--unit) * 1.6) calc(var(--unit) * 4);
        overflow-y: auto;
        transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 1000;
    }

        .navMenu.mobile-open {
            right: 0;
        }

    .menuClose {
        display: block;
    }

    .navLinks {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
    }

    .navItem {
        width: 100%;
        border-bottom: calc(var(--unit) * 0.1) solid rgba(255, 255, 255, 0.15);
    }

        .navItem.open > .navLink::after {
            transform: rotate(180deg);
        }

    .navLink {
        width: 100%;
        padding: calc(var(--unit) * 1.2) 0;
        justify-content: space-between;
        font-size: calc(var(--unit) * 1.6);
    }

    .dropdownPanel {
        flex-direction: column;
        grid-template-columns: 1fr;
        gap: calc(var(--unit) * 1.6);
        padding: calc(var(--unit) * 1) 0 calc(var(--unit) * 2);
        display: none;
    }

        .dropdownPanel.visible {
            display: flex;
            flex-direction: column;
        }

    .dropdownCol {
        margin-bottom: calc(var(--unit) * 1.6);
    }

        .dropdownCol .menuHead {
            font-size: calc(var(--unit) * 1.4);
            margin-bottom: calc(var(--unit) * 1);
        }

        .dropdownCol ul li a {
            padding: calc(var(--unit) * 0.8) 0;
            font-size: calc(var(--unit) * 1.6);
        }

    .header {
        padding: 0;
    }

    .headerContent {
        padding: calc(var(--unit) * 1.6) calc(var(--unit) * 1.6) calc(var(--unit) * 1.2);
        gap: calc(var(--unit) * 2.4);
    }

    .marketTicker {
        gap: calc(var(--unit) * 0.8);
        flex-wrap: nowrap;
        padding: calc(var(--unit) * 0.6) calc(var(--unit) * 1.8);
        min-height: unset;
    }

        .marketTicker .tickerItem {
            gap: 0;
        }

            .marketTicker .tickerItem span {
                font-size: calc(var(--unit) * 1.2);
            }

                .marketTicker .tickerItem span span {
                    display: none;
                }

            .marketTicker .tickerItem svg {
                width: calc(var(--unit) * 1.8);
                margin-left: calc(var(--unit) * 0.4);
            }

    .dropdownCol ul {
        gap: 0;
    }

    .logo {
        width: calc(var(--unit) * 14.9);
        height: auto;
        margin-top: 0;
    }

    .headerMain {
        align-items: center;
    }
}

@media (min-width: 991.99px) {
    .megaDropdown.active {
        padding: 0 0 calc(var(--unit) * 1.2);
        margin-top: calc(var(--unit) * 2.8);
        margin-right: calc(var(--unit) * -2.4);
        width: calc(100% + calc(var(--unit) * 2.4));
    }
}

.headerSub {
    display: flex;
    align-items: center;
    gap: calc(var(--unit) * 2.4);
    width: 100%;
}

    .headerSub > div {
        flex: 1;
    }

    .headerSub .search-section {
        margin: 0;
        padding: 0;
        border: calc(var(--unit) * 0.1) solid #002863;
        background: #fff;
        border-radius: 2.5rem;
    }

        .headerSub .search-section.searchExpanded-small {
            border-radius: 0;
            border-top-left-radius: 2.5rem;
            border-top-right-radius: 2.5rem;
        }

    .headerSub .searchExpandedResults {
        position: absolute;
        top: calc(var(--unit) * 5.1);
        left: calc(var(--unit) * -0.05);
        width: calc(100% + calc(var(--unit) * 0.15));
        height: max-content;
        background-color: #fff;
        overflow-x: hidden;
        overflow-y: auto;
        max-height: 35rem;
        z-index: 5;
        padding: 0;
        border: calc(var(--unit) * 0.1) solid #002863;
        border-top: 0;
        border-radius: 0;
        border-bottom-left-radius: 2.5rem;
        border-bottom-right-radius: 2.5rem;
    }

        .headerSub .searchExpandedResults .searchHeading {
            color: #ee7a26;
            font-size: calc(var(--unit) * 1.4);
            line-height: calc(var(--unit) * 1.4);
            padding-left: calc(var(--unit) * 1.8);
            padding-right: calc(var(--unit) * 1.8);
            margin-top: calc(var(--unit) * 2);
            margin-bottom: calc(var(--unit) * 1);
        }

        .headerSub .searchExpandedResults .searchlist {
            padding-bottom: calc(var(--unit) * 0.5);
            padding-top: calc(var(--unit) * 0.5);
            padding-left: calc(var(--unit) * 1.8);
            padding-right: calc(var(--unit) * 1.8);
            border-bottom: calc(var(--unit) * 0.1) solid #d7dadf;
            background-color: #fff;
            color: #01265c;
            font-size: calc(var(--unit) * 1.4);
        }

            .headerSub .searchExpandedResults .searchlist span,
            .headerSub .searchExpandedResults .searchlist a {
                color: #01265c;
                font-size: calc(var(--unit) * 1.4);
                line-height: calc(var(--unit) * 1.4);
            }

.search-elements {
    padding: calc(var(--unit) * 0.7) calc(var(--unit) * 1.8);
    position: relative;
    width: 100%;
}

    .search-elements form1 {
        width: 100%;
        display: flex;
        gap: calc(var(--unit) * 0.8);
    }

        .search-elements form1 svg {
            width: calc(var(--unit) * 3.4);
            height: auto;
        }

    .search-elements input {
        flex: 1;
        font-size: calc(var(--unit) * 1.8);
        font-weight: 400;
        color: #01265c;
    }

        .search-elements input:focus,
        .search-elements input:focus-visible {
            outline: 0 !important;
        }

    .search-elements .search_submit {
        display: none;
    }

.mobile-search-close {
    display: none;
}

@media (max-width: 992px) {
    .headerSub .search-section {
        display: none;
    }

    .mobile-search-close {
        display: none;
        background: transparent;
        border: none;
        padding: 0;
        margin: 0;
        cursor: pointer;
        align-items: center;
        justify-content: center;
    }

        .mobile-search-close svg {
            width: calc(var(--unit) * 2.4);
            height: auto;
        }

    .header.mobile-search-active .hamburger,
    .header.mobile-search-active .logo,
    .header.mobile-search-active .SearchBtn {
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease;
    }

    .header.mobile-search-active .headerSub .search-section {
        display: flex;
        position: absolute;
        top: calc(var(--unit) * 1.5);
        left: calc(var(--unit) * 1.6);
        width: calc(100% - var(--unit) * 3.2);
        z-index: 10;
        animation: slideLeftExpand 0.3s forwards cubic-bezier(0.4, 0, 0.2, 1);
        transform-origin: right center;
    }

        .header.mobile-search-active .headerSub .search-section .mobile-search-close {
            display: flex;
        }
}

@keyframes slideLeftExpand {
    0% {
        transform: scaleX(0);
        opacity: 0;
    }

    100% {
        transform: scaleX(1);
        opacity: 1;
    }
}

.search-section.opened.searchExpanded-small .searchExpandedResults .searchHeading {
    color: #ee7a26;
    font-size: 1.4rem;
    line-height: 1.4rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

.search-section.opened.searchExpanded-small .searchExpandedResults .searchlist {
    padding-bottom: .5rem;
    padding-top: .5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    border-bottom: .1rem solid #d7dadf;
    min-height: 3.6rem;
    background-color: #fff;
}

    .search-section.opened.searchExpanded-small .searchExpandedResults .searchlist.selected,
    .search-section.opened.searchExpanded-small .searchExpandedResults .searchlist:hover {
        background-color: inherit;
    }

    .search-section.opened.searchExpanded-small .searchExpandedResults .searchlist:last-child {
        border-bottom: none;
    }

    .search-section.opened.searchExpanded-small .searchExpandedResults .searchlist a > span {
        display: inline-block;
        float: left;
        margin-top: .3rem;
    }

        .search-section.opened.searchExpanded-small .searchExpandedResults .searchlist a > span.text-red.icon-up-arrow {
            transform: rotate(180deg);
        }

    .search-section.opened.searchExpanded-small .searchExpandedResults .searchlist .searchCompName {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-right: .5rem;
    }

    .search-section.opened.searchExpanded-small .searchExpandedResults .searchlist .btn-custom {
        margin-right: 0;
        margin-top: 0;
        padding-top: .2rem;
        padding-bottom: .2rem;
    }

.search-section.opened.searchExpanded-small .searchExpandedResults.custom-scrollbar .jspVerticalBar {
    width: .5rem;
}

.search-section .search_submit {
    opacity: 0.8;
}

.search-section.searchExpanded .search-elements {
    background-color: #eceff6;
    position: absolute;
}

    .search-section.searchExpanded .search-elements form {
        display: block;
        position: absolute;
    }

        .search-section.searchExpanded .search-elements form .search-box {
            background-color: #eceff6;
        }

    .search-section.searchExpanded .search-elements .searchExpandedResults {
        display: none;
        margin-top: 1rem;
        overflow-x: hidden;
        overflow-y: auto;
        max-height: 350px;
    }

        .search-section.searchExpanded .search-elements .searchExpandedResults .searchHeading {
            color: #ee7a26;
            font-size: 1.4rem;
            line-height: 1.4rem;
            padding-left: .5rem;
            padding-right: .5rem;
        }

        .search-section.searchExpanded .search-elements .searchExpandedResults .searchlist {
            padding-bottom: .5rem;
            padding-top: .5rem;
            padding-left: .5rem;
            padding-right: .5rem;
            border-bottom: .1rem solid #d7dadf;
            min-height: 3.6rem;
            background-color: #fff;
        }

            .search-section.searchExpanded .search-elements .searchExpandedResults .searchlist:hover {
                background-color: inherit;
            }

            .search-section.searchExpanded .search-elements .searchExpandedResults .searchlist:last-child {
                border-bottom: none;
            }

            .search-section.searchExpanded .search-elements .searchExpandedResults .searchlist > span {
                display: inline-block;
                float: left;
                margin-top: .3rem;
            }

                .search-section.searchExpanded .search-elements .searchExpandedResults .searchlist > span.text-red.icon-up-arrow {
                    transform: rotate(180deg);
                }

            .search-section.searchExpanded .search-elements .searchExpandedResults .searchlist .searchCompName {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                margin-right: .5rem;
            }

.search-section .searchlist .btn-custom {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    white-space: nowrap;
    font-size: 1.4rem;
    border-radius: .4rem;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-right: 0;
    border-radius: 0 !important;
    margin: 0 1rem !important;
    margin-top: 0 !important;
    padding: .2rem 1rem !important;
    display: inline-block !important;
    text-transform: uppercase !important;
    border: .1rem solid transparent !important;
    color: #fff !important;
}

.search-section.searchExpanded .search-elements .searchExpandedResults.custom-scrollbar .jspVerticalBar {
    width: .5rem;
}

.bg-green {
    background-color: #00ae42 !important;
}

.bg-red {
    background-color: #eb3315 !important;
}

.pull-right {
    float: right !important;
}

.pull-left {
    float: left !important;
}

/* _footer.scss */
.footer {
    background-color: #000000;
    color: #ffffff;
}

.footerContent {
    max-width: calc(var(--unit) * 134.4);
    margin: 0 auto;
    padding: calc(var(--unit) * 9.3) calc(var(--unit) * 2.4) calc(var(--unit) * 2.4);
}

.footerMain {
    display: flex;
    flex-direction: row;
    gap: calc(var(--unit) * 8);
    justify-content: space-between;
    margin-bottom: calc(var(--unit) * 8);
}

.footerRightSide {
    display: flex;
    flex-direction: column;
    gap: calc(var(--unit) * 6);
    flex: 1;
}

.footerBrand {
    flex: 0 0 calc(var(--unit) * 31.8);
    max-width: 100%;
}

.footerLogo {
    width: 100%;
    max-width: calc(var(--unit) * 29.6);
    height: auto;
    margin-bottom: calc(var(--unit) * 3.4);
    transition: opacity 0.3s ease;
}

    .footerLogo:hover {
        opacity: 0.85;
    }

.footerReg {
    font-size: calc(var(--unit) * 1.6);
    font-weight: 400;
    margin-bottom: calc(var(--unit) * 4);
}

.footerAddress {
    font-size: calc(var(--unit) * 1.6);
    font-weight: 400;
}

.footerLinks {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    row-gap: calc(var(--unit) * 4);
    column-gap: calc(var(--unit) * 2);
}

.footerColumn {
    display: flex;
    flex-direction: column;
    gap: calc(var(--unit) * 4);
}

.footerLink {
    color: #ffffff;
    text-decoration: none;
    font-size: calc(var(--unit) * 1.8);
    font-weight: 400;
    transition: color 0.3s ease;
    cursor: pointer;
    position: relative;
}

    .footerLink .subFooterLinks {
        display: none;
        padding-top: calc(var(--unit) * 0.8);
        position: absolute;
        background: #3d3d3d;
        padding: calc(var(--unit) * 1.2);
        z-index: 9;
        border-radius: calc(var(--unit) * 1.2);
    }

        .footerLink .subFooterLinks .footerLink {
            font-size: calc(var(--unit) * 1.6);
            display: block;
            padding: calc(var(--unit) * 0.8) 0;
            font-weight: 400;
        }

    .footerLink:hover {
        color: #4ca8ff;
        font-weight: 600;
    }

        .footerLink:hover .subFooterLinks {
            display: block;
        }

.footerContact {
    display: grid;
    grid-template-columns: 2fr 1fr;
    align-items: start;
    gap: calc(var(--unit) * 3.2);
}

.contactInfo {
    grid-column: span 2;
}

    .contactInfo,
    .contactInfo + div {
        margin-top: calc(var(--unit) * 3.4);
    }

        .contactInfo h3 {
            font-size: calc(var(--unit) * 1.8);
            font-weight: 400;
            margin-bottom: calc(var(--unit) * 0.8);
        }

.contactPhone {
    font-size: calc(var(--unit) * 2.8);
    font-weight: 700;
}

.socialLinks {
    display: flex;
    gap: calc(var(--unit) * 1.2);
    margin-top: calc(var(--unit) * 0.8);
}

.socialIcon {
    width: calc(var(--unit) * 3.2);
    height: calc(var(--unit) * 3.2);
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s ease;
}

    .socialIcon:hover {
        transform: translateY(calc(var(--unit) * -0.3)) scale(1.15);
        opacity: 0.85;
    }

.disclaimerBtnFull {
    padding: calc(var(--unit) * 1.6) calc(var(--unit) * 3.2);
    background: transparent;
    color: #ffffff;
    font-size: calc(var(--unit) * 1.8);
    font-weight: 400;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    transition: background 0.3s ease, transform 0.3s ease;
    cursor: pointer;
    margin-bottom: 0;
    border-radius: calc(var(--unit) * 4) calc(var(--unit) * 4) 0 0;
}

    .disclaimerBtnFull:hover {
        background: rgba(255, 255, 255, 0.05);
        transform: translateY(calc(var(--unit) * -0.2));
    }

    .disclaimerBtnFull .disclaimerIcon {
        transition: transform 0.3s ease;
    }

    .disclaimerBtnFull[aria-expanded="true"] .disclaimerIcon {
        transform: rotate(180deg);
    }

.disclaimerContent {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, margin 0.3s ease;
    margin-bottom: 0;
}

    .disclaimerContent[aria-hidden="false"] {
        max-height: max-content;
        margin-bottom: calc(var(--unit) * 3.4);
    }

.disclaimerText {
    padding: calc(var(--unit) * 2) calc(var(--unit) * 3.2);
    background: rgba(255, 255, 255, 0.05);
    border-top: calc(var(--unit) * 0.1) solid rgba(255, 255, 255, 0.2);
    font-size: calc(var(--unit) * 1.4);
    color: #d1d5db;
}

    .disclaimerText p {
        margin-bottom: calc(var(--unit) * 1.4);
    }

.copyright {
    font-size: calc(var(--unit) * 1.6);
    color: #a1a1aa;
    font-weight: 400;
    text-align: center;
}

.scrollTop {
    display: none;
    position: fixed;
    bottom: calc(var(--unit) * 7);
    right: calc(var(--unit) * 4.8);
    width: calc(var(--unit) * 6);
    height: calc(var(--unit) * 6);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

    .scrollTop:hover {
        transform: translateY(calc(var(--unit) * -0.4)) scale(1.1);
    }

@media (max-width: 992px) {
    .footerContent {
        padding: calc(var(--unit) * 4.8) 0 0;
    }

    .footerMain {
        flex-direction: column;
        gap: calc(var(--unit) * 6);
    }

    .footerBrand {
        flex: auto;
    }

    .contactInfo {
        margin-top: calc(var(--unit) * 2);
    }

    .socialLinks {
        gap: calc(var(--unit) * 0.4);
    }

    .socialIcon {
        width: calc(var(--unit) * 2.8);
        height: calc(var(--unit) * 2.8);
    }

    .copyright {
        font-size: calc(var(--unit) * 1.2);
        color: #ffffff;
    }

    .footerLogo {
        max-width: calc(var(--unit) * 16);
        margin-bottom: calc(var(--unit) * 2.4);
    }

    .footerReg,
    .footerAddress,
    .footerLink,
    .contactInfo h3 {
        font-size: calc(var(--unit) * 1.4);
    }

    .footerReg {
        margin-bottom: calc(var(--unit) * 2);
    }

    .footerColumn {
        gap: calc(var(--unit) * 2);
    }

    .contactPhone {
        font-size: calc(var(--unit) * 1.8);
    }

    .disclaimerBtnFull {
        padding: calc(var(--unit) * 0.8) calc(var(--unit) * 1.6);
        font-size: calc(var(--unit) * 1.4);
    }

        .disclaimerBtnFull svg {
            width: calc(var(--unit) * 2.4);
        }

    .disclaimerContent[aria-hidden="false"] {
        margin-bottom: calc(var(--unit) * 2);
    }

    .disclaimerText {
        padding: calc(var(--unit) * 1.6) calc(var(--unit) * 1.6);
    }

        .disclaimerText p {
            font-size: calc(var(--unit) * 1.4);
        }

    .footerLink .subFooterLinks {
        padding-top: calc(var(--unit) * 0.8);
        position: static;
        background: transparent;
        padding: 0;
        z-index: 9;
    }

        .footerLink .subFooterLinks .footerLink {
            font-size: calc(var(--unit) * 1.2);
            padding: calc(var(--unit) * 0.4) 0;
        }
}

@media (max-width: 992px) {
    .footerLinks {
        grid-template-columns: repeat(2, 1fr);
        row-gap: calc(var(--unit) * 2);
    }

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

.disclaimerSection {
    border: calc(var(--unit) * 0.1) solid rgba(255, 255, 255, 0.4);
    border-radius: calc(var(--unit) * 4);
}

/*# sourceMappingURL=headerFooter.css.map */

.teaGreen {
    background-color: #ddffc1;
}

.social-share {
    position: fixed;
    top: 30%;
    left: 0;
    width: 4rem;
    min-height: auto;
    background-color: #fff;
    border-right: .1rem solid #c8e1ee;
    z-index: 999;
}

    .social-share:after,
    .social-share:before {
        content: "";
        width: 60px;
        height: 4rem;
        background-color: #fff;
        border-top: .1rem solid #c8e1ee;
        position: absolute;
        left: -2.6rem;
        z-index: -1;
    }

    .social-share:before {
        top: -2.4rem;
        transform: rotate(40deg);
    }

    .social-share:after {
        bottom: -2.4rem;
        transform: rotate(140deg);
    }

    .social-share ul {
        margin: 0;
        padding: .5rem 0;
    }

        .social-share ul li {
            list-style: none;
        }

            .social-share ul li a {
                margin: .5rem;
                display: block;
            }

            .social-share ul li a {
                background: url(../../images/img_sprites.png);
            }

                .social-share ul li a.bg-icon_blog_share {
                    width: 3.1rem;
                    height: 3.1rem;
                    background-position: -202px -123px;
                }

                .social-share ul li a.bg-icon_fb_share {
                    width: 3.2rem;
                    height: 3.1rem;
                    background-position: -202px -72px;
                }

                .social-share ul li a.bg-icon_insta_share {
                    width: 3.1rem;
                    height: 3.1rem;
                    background-position: -178px -193px;
                }

                .social-share ul li a.bg-icon_linkedin_share {
                    width: 3rem;
                    height: 3rem;
                    background-position: -256px -61px;
                }

                .social-share ul li a.bg-icon_share {
                    width: 3rem;
                    height: 3rem;
                    background-position: -256px -111px;
                }

                .social-share ul li a.bg-icon_twitter_share {
                    width: 3rem;
                    height: 3rem;
                    background-position: -256px -161px;
                }

                .social-share ul li a.bg-icon_youtube_share {
                    width: 3.1rem;
                    height: 3.1rem;
                    background-position: -256px -1rem;
                }

/*! CSS Used from: Embedded */
.bg-icon_telegram_share {
    background-position: -229px -244px !important;
    width: 3rem;
    height: 3rem;
}

/* Cookie Section Start */

.cookies-section {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    padding: .8rem 0 .4rem;
    font-family: RobotoRegular;
    z-index: 10;
    box-shadow: 0 0 1rem #000;
}

    .cookies-section .icon-section {
        float: left;
        margin-right: 0;
        width: 3.2rem;
    }

        .cookies-section .icon-section img {
            width: 100%;
            padding-top: 0;
        }

    .cookies-section .text-section {
        float: left;
        margin: 0 1rem;
        font-size: 1.4rem;
    }

        .cookies-section .text-section .content-title {
            display: block;
            font-size: 1.2rem;
            color: #353535;
        }

        .cookies-section .text-section .content-desc {
            font-size: 1.4rem;
            letter-spacing: 0;
            color: #353535;
            display: inline-block;
        }

        .cookies-section .text-section a + a:before {
            content: "|";
            padding: 0 .5rem;
            color: #003b90;
        }

    .cookies-section .form-btn-group {
        padding-top: .2rem;
    }

        .cookies-section .form-btn-group .btn {
            border-radius: .3rem;
            font-size: 1rem;
        }

@media (min-width:768px) and (max-width:1024px) {
    .cookies-section .icon-section {
        margin-right: .5rem;
    }

        .cookies-section .icon-section .info-icon {
            width: 4rem;
        }

    .cookies-section .text-section {
        margin: 0 .5rem;
    }

        .cookies-section .text-section .content-title {
            padding-bottom: .5rem;
        }

        .cookies-section .text-section .content-desc {
            font-size: 1.4rem;
            letter-spacing: 0;
        }
}

@media only screen and (max-width:767px) {
    .cookies-section {
        padding: 1rem 0;
    }

        .cookies-section .icon-section {
            margin: .5rem 0;
        }

            .cookies-section .icon-section .info-icon {
                margin: 0;
                width: 45px;
                display: block;
            }

        .cookies-section .text-section {
            margin: .5rem 0;
            width: 85%;
            float: right;
        }

            .cookies-section .text-section .content-title {
                padding-bottom: .5rem;
            }

            .cookies-section .text-section .content-desc {
                font-size: 1.6rem;
                letter-spacing: 0;
                line-height: 1.8rem;
            }

        .cookies-section .form-btn-group {
            padding-top: 1rem;
        }
    .support-pill {
        font-size: 12px;
        padding: 9px 12px;
    }
    .app-stores > div {
        justify-content: flex-start !important;
    }
    .header-actions > a {
        display: none;
    }
    .hs-content .container > img.img-fluid {
        width: 10rem !important;
        margin-bottom: 1rem !important;
    }
}

.btn-filled {
    border-radius: 0;
    font-size: 1.2rem;
    line-height: 1.4rem;
    padding: .8rem;
    margin-bottom: .5rem;
    margin-top: 0;
}

    .btn-filled:active,
    .btn-filled:focus,
    .btn-filled:hover {
        outline: 0 !important;
        box-shadow: none !important;
    }

    .btn-filled + .btn {
        margin-left: .5rem;
    }

.btn-filled {
    background-color: #003b90;
    color: #fff;
}

    .btn-filled:focus,
    .btn-filled:hover {
        color: #fff;
    }

@media only screen and (max-width:480px) {
    .col-xs-12 {
        width: 100% !important;
    }
}

/*! CSS Used from: Embedded */
@media (max-width: 767px) {
    .cookies-section .text-section {
        min-height: 6.25rem;
    }
}

/*! CSS Used from: Embedded */
.cookies-section {
    padding: .8rem 0 .4rem 0px;
}

    .cookies-section .icon-section {
        width: 3.2rem;
    }

    .cookies-section .btn {
        border-radius: .3rem;
        font-size: 1rem;
    }

    .cookies-section .text-section {
        font-size: 1.4rem;
    }

        .cookies-section .text-section .content-title {
            font-size: 1.2rem;
        }

        .cookies-section .text-section .content-desc {
            font-size: 1.4rem;
            letter-spacing: 0px;
        }

    .cookies-section .icon-section img {
        padding-top: 0px;
    }

    .cookies-section .form-btn-group {
        padding-top: .2rem;
    }

@media only screen and (max-width: 767px) {
    .cookies-section .text-section {
        width: 100% !important;
        float: left !important;
    }

        .cookies-section .text-section .content-desc {
            font-size: 1rem !important;
        }

        .cookies-section .text-section #gdprprivacy,
        .cookies-section .text-section #gdprsetting {
            font-size: 1rem !important;
        }
}

/*Model*/
.fade {
    opacity: 0;
    transition: opacity .15s linear;
}

    .fade.in {
        opacity: 1;
    }

.modal-backdrop {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.modal-backdrop {
    position: fixed;
    z-index: 1040;
    background-color: #000;
}

    .modal-backdrop.fade {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .modal-backdrop.in {
        opacity: .5;
        filter: alpha(opacity=50);
    }

/*! CSS Used from: ../Content/css/style.min.css?v=27022026 */
.btn {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

button {
    color: inherit;
    font: inherit;
    margin: 0;
}

button {
    overflow: visible;
}

button {
    text-transform: none;
}

button {
    -webkit-appearance: button;
    cursor: pointer;
}

@media print {

    *,
    :after,
    :before {
        background: 0 0 !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
}

.btn,
.btn-primary:active,
.btn:active {
    background-image: none;
}

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

button {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.modal-footer:after {
    clear: both;
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    border: .1rem solid transparent;
    white-space: nowrap;
    padding: .6rem 1.2rem;
    font-size: 1.4rem;
    line-height: 1.42857;
    border-radius: .4rem;
    user-select: none;
}

    .btn:active:focus,
    .btn:focus {
        outline: -webkit-focus-ring-color auto .5rem;
        outline-offset: -.2rem;
    }

    .btn:focus,
    .btn:hover {
        color: #333;
        text-decoration: none;
    }

    .btn:active {
        outline: 0;
        box-shadow: inset 0 .3rem .5rem rgba(0, 0, 0, .125);
    }

.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}

    .btn-primary:focus {
        color: #fff;
        background-color: #286090;
        border-color: #122b40;
    }

    .btn-primary:active,
    .btn-primary:hover {
        color: #fff;
        background-color: #286090;
        border-color: #204d74;
    }

        .btn-primary:active:focus,
        .btn-primary:active:hover {
            color: #fff;
            background-color: #204d74;
            border-color: #122b40;
        }

.fade {
    opacity: 0;
    transition: opacity .15s linear;
}

    .fade.in {
        opacity: 1;
    }

.close {
    font-weight: 700;
}

.modal {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.close {
    float: right;
    font-size: 2.1rem;
    line-height: 1;
    color: #000;
    text-shadow: 0 .1rem 0 #fff;
    opacity: .2;
    filter: alpha(opacity=20);
}

    .close:focus,
    .close:hover {
        color: #000;
        text-decoration: none;
        cursor: pointer;
        opacity: .5;
        filter: alpha(opacity=50);
    }

button.close {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
}

.modal-content {
    background-clip: padding-box;
}

.modal {
    display: none;
    overflow: hidden;
    position: fixed;
    z-index: 1050;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}

.modal-footer:after,
.modal-footer:before {
    display: table;
    content: " ";
}

.modal.fade .modal-dialog {
    transform: translate(0, -25%);
    transition: transform .3s ease-out;
}

.modal.in .modal-dialog {
    transform: translate(0, 0);
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto;
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 1rem;
}

.modal-content {
    position: relative;
    background-color: #fff;
    border: .1rem solid #999;
    border: .1rem solid rgba(0, 0, 0, .2);
    border-radius: .6rem;
    box-shadow: 0 .3rem .9rem rgba(0, 0, 0, .5);
    outline: 0;
}

.modal-body {
    position: relative;
    padding: 1.5rem;
}

.modal-footer {
    padding: 1.5rem;
    text-align: right;
    border-top: .1rem solid #e5e5e5;
}

@media (min-width:768px) {
    .modal-dialog {
        width: 60rem;
        margin: 3rem auto;
    }

    .modal-content {
        box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .5);
    }
}

.modal-header:after {
    clear: both;
}

.modal-header:after,
.modal-header:before {
    display: table;
    content: " ";
}

.modal-header {
    padding: 1.5rem;
    border-bottom: .1rem solid #e5e5e5;
}

.modal-custom .modal-content .modal-header {
    padding: 1.5rem;
}

    .modal-custom .modal-content .modal-header .modal-heading {
        font-family: RobotoMedium;
        font-size: 1.8rem;
        line-height: 1.8rem;
        margin: 1.2rem 0;
    }

@media (max-width:767px) {
    .modal-custom .modal-content .modal-header {
        padding: .5rem 1.5rem;
    }
}

@media (min-width:768px) {
    .modal-custom .modal-content .modal-header {
        padding: .5rem 3rem;
    }
}

@media (min-width:992px) {
    .modal-custom .modal-content .modal-header {
        padding: 1.5rem 3rem;
    }
}

/*! CSS Used from: Embedded */
.modal-custom .modal-content .modal-header {
    padding: .8rem 2rem;
}

/*! CSS Used from: ../Content/css/style.min.css?v=27022026 */
img {
    border: 0;
}

.btn {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

[hidden] {
    display: none;
}

a {
    background-color: transparent;
}

    a:active,
    a:hover {
        outline: 0;
    }

img {
    vertical-align: middle;
}

input {
    color: inherit;
    font: inherit;
    margin: 0;
}

    input[type=checkbox] {
        box-sizing: border-box;
        padding: 0;
    }

@media print {
    img {
        page-break-inside: avoid;
    }

    *,
    :after,
    :before {
        background: 0 0 !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

        a[href]:after {
            content: " (" attr(href) ")";
        }

        a[href^="#"]:after {
            content: "";
        }

    img {
        max-width: 100% !important;
    }

    p {
        orphans: 3;
        widows: 3;
    }
}

.btn,
.btn:active,
.form-control {
    background-image: none;
}

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

input {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

a {
    text-decoration: none;
}

    a:focus {
        outline-offset: -.2rem;
    }

p {
    margin: 0 0 1rem;
}

label {
    font-weight: 700;
}

.text-center {
    text-align: center;
}

.clearfix:after,
.row:after {
    clear: both;
}

.row:after,
.row:before {
    display: table;
    content: " ";
}

.row {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
}

.col-lg-12,
.col-md-12,
.col-sm-12 {
    position: relative;
    min-height: .1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

@media (min-width:768px) {
    .col-sm-12 {
        float: left;
    }

    .col-sm-12 {
        width: 100%;
    }
}

@media (min-width:992px) {
    .col-md-12 {
        float: left;
    }

    .col-md-12 {
        width: 100%;
    }
}

@media (min-width:1200px) {
    .col-lg-12 {
        float: left;
    }

    .col-lg-12 {
        width: 100%;
    }
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: .5rem;
}

input[type=checkbox] {
    margin: .4rem 0 0;
    margin-top: .1rem\9;
    line-height: normal;
}

.form-control {
    font-size: 1.4rem;
    line-height: 1.42857;
    color: #555;
    display: block;
}

input[type=checkbox]:focus {
    outline: -webkit-focus-ring-color auto .5rem;
    outline-offset: -.2rem;
}

.form-control {
    width: 100%;
    height: 3.4rem;
    padding: .6rem 1.2rem;
    background-color: #fff;
    border: .1rem solid #ccc;
    border-radius: .4rem;
    box-shadow: inset 0 .1rem .1rem rgba(0, 0, 0, .075);
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

    .form-control:focus {
        border-color: #66afe9;
        outline: 0;
        box-shadow: inset 0 .1rem .1rem rgba(0, 0, 0, .075), 0 0 .8rem rgba(102, 175, 233, .6);
    }

.form-group {
    margin-bottom: 1.5rem;
}

.checkbox {
    position: relative;
    display: block;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

    .checkbox label {
        min-height: 2rem;
        padding-left: 2rem;
        margin-bottom: 0;
        font-weight: 400;
        cursor: pointer;
    }

    .checkbox input[type=checkbox] {
        position: absolute;
        margin-left: -2rem;
        margin-top: .4rem\9;
    }

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    border: .1rem solid transparent;
    white-space: nowrap;
    padding: .6rem 1.2rem;
    font-size: 1.4rem;
    line-height: 1.42857;
    border-radius: .4rem;
    user-select: none;
}

    .btn:active:focus,
    .btn:focus {
        outline: -webkit-focus-ring-color auto .5rem;
        outline-offset: -.2rem;
    }

    .btn:focus,
    .btn:hover {
        color: #333;
        text-decoration: none;
    }

    .btn:active {
        outline: 0;
        box-shadow: inset 0 .3rem .5rem rgba(0, 0, 0, .125);
    }

.btn-lg {
    padding: 1rem 1.6rem;
    font-size: 1.8rem;
    line-height: 1.33333;
    border-radius: .6rem;
}

.input-group {
    position: relative;
}

.input-group {
    display: table;
    border-collapse: separate;
}

    .input-group .form-control {
        position: relative;
        z-index: 2;
        float: left;
        width: 100%;
        margin-bottom: 0;
    }

        .input-group .form-control:focus {
            z-index: 3;
        }

    .input-group .form-control,
    .input-group-addon {
        display: table-cell;
    }

.input-group-addon {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

.input-group-addon {
    padding: .6rem 1.2rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: .1rem solid #ccc;
    border-radius: .4rem;
}

.input-group .form-control:first-child {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.input-group-addon:last-child {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.input-group-addon:last-child {
    border-left: 0;
}

.modal-body {
    position: relative;
    padding: 1.5rem;
}

.clearfix:after,
.clearfix:before {
    content: " ";
    display: table;
}

.pull-left {
    float: left !important;
}

.btn-custom {
    border-radius: 0;
}

input {
    transition: border linear .2s, box-shadow linear .2s;
}

    input:focus {
        outline: 0;
        border-color: rgba(82, 168, 236, .8);
        box-shadow: inset 0 .1rem .3rem rgba(0, 0, 0, .1), 0 0 .8rem rgba(82, 168, 236, .6);
    }

    input[type=checkbox]:focus {
        box-shadow: none;
        outline: #666 dotted .1rem;
    }

    input[type=text],
    input[type=password] {
        display: inline-block;
        padding: .4rem;
        font-size: 1.3rem;
        line-height: 1.8rem;
        color: #555;
        border: .1rem solid #ccc;
        border-radius: .3rem;
    }

a {
    color: #003b90;
}

    a:focus,
    a:hover {
        color: #003b90;
        text-decoration: none;
        outline: 0;
    }

.bg-blue {
    background-color: #003b90 !important;
}

.btn-custom {
    margin: 0 1rem;
    padding: 1rem;
    display: inline-block;
    text-transform: uppercase;
    border: .1rem solid transparent;
    color: #fff;
}

    .btn-custom:active,
    .btn-custom:focus,
    .btn-custom:hover,
    .btn-custom:visited {
        color: #fff;
        outline: 0;
    }

.form-group label {
    font-weight: 400;
    margin-bottom: 0;
}

.form-group .form-control {
    border: .1rem solid #d1d1d1;
    border-radius: 0;
    box-shadow: none;
}

.form-group .input-group {
    width: 100%;
    margin: 0;
}

    .form-group .input-group .input-group-addon {
        background-color: transparent;
        border-color: transparent;
        border-radius: 0;
        padding: 0;
    }

.bB0 {
    border-bottom: none !important;
}

.clearfix {
    clear: both;
}

.form-theme .form-group label {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.3rem;
}

.form-theme .form-group .form-control {
    box-shadow: none;
    border-radius: 0;
    border: none;
    border-bottom: .1rem solid #cbcbcb;
    background-color: transparent;
    font-size: 1.6rem;
    color: #333;
    height: 3rem;
    padding: 0;
    font-family: RobotoRegular;
}

    .form-theme .form-group .form-control:disabled {
        opacity: .65;
    }

.form-theme .form-group .checkbox input + label {
    font-size: 1.6rem;
    font-family: RobotoRegular;
}

.form-theme .form-group .input-group .input-group-addon {
    border-bottom-color: #cbcbcb;
    font-size: 1.6rem;
}

.form-theme .form-btn-group {
    margin: 1.5rem 0;
}

    .form-theme .form-btn-group .btn {
        min-width: 120px;
    }

        .form-theme .form-btn-group .btn.btn-lg {
            padding: 1.2rem 1rem;
            min-height: 5rem;
        }

.text-lg {
    font-size: 2.4rem !important;
    line-height: 2.4rem;
}

.form-group a:focus {
    outline: 0 !important;
}

.checkbox input {
    position: absolute;
    display: none;
}

    .checkbox input + label {
        position: relative;
        display: block;
        padding-left: 3rem !important;
        cursor: pointer;
        vertical-align: middle;
        font-size: 1.4rem;
        line-height: 2.2rem;
    }

        .checkbox input + label:hover:before {
            animation-duration: .4s;
            animation-fill-mode: both;
            animation-name: hover-color;
        }

        .checkbox input + label:before {
            position: absolute;
            top: 0;
            left: 0;
            display: inline-block;
            width: 2.2rem;
            height: 2.2rem;
            content: '';
            border: .1rem solid #ccc;
        }

        .checkbox input + label:after {
            position: absolute;
            display: none;
            content: '';
        }

    .checkbox input:checked + label:before {
        animation-name: none;
    }

    .checkbox input:checked + label:after {
        display: block;
    }

    .checkbox input + label:before {
        border-radius: .3rem;
    }

    .checkbox input + label:after {
        top: .3rem;
        left: .9rem;
        box-sizing: border-box;
        width: .5rem;
        height: 1.3rem;
        transform: rotate(45deg);
        border-width: .2rem;
        border-style: solid;
        border-color: #fff;
        border-top: 0;
        border-left: 0;
    }

    .checkbox input:checked + label:before {
        border: #003b90;
        background: #003b90;
    }

@media only screen and (max-width:767px) {
    .login-form {
        margin-bottom: 1.2rem;
    }
}

@media only screen and (max-width:1023px) {
    .btn-custom.btn-lg {
        padding: .5rem 2.5rem;
    }
}

@media only screen and (min-width:1024px) {
    .btn-custom.btn-lg {
        padding: .8rem 5rem;
    }
}

@media (max-width:767px) {
    .btn-custom {
        margin: .5rem;
    }
}

@media (min-width:992px) {
    .modal-custom .modal-content .modal-body {
        padding: 1.5rem 3rem;
    }
}

/*! CSS Used from: Embedded */
.modal-custom .modal-content .modal-body {
    padding: .8rem 2rem;
}

/*! CSS Used from: Embedded */
.ttip {
    position: absolute;
    width: 4rem;
    height: 4rem;
    right: 0px;
    top: 1rem;
}

.showeye {
    background-image: url('../Content/images/show_pw.svg');
    background-repeat: no-repeat;
    background-position: 97%;
    background-size: 2rem;
    padding: 1rem 35px 1rem 1rem !important;
}

/*! CSS Used from: Embedded */
#dvWSCheck .checkbox input + label:before {
    width: 2rem;
    height: 2rem;
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url(../../fonts/glyphicons-halflings-regular.eot);
    src: url(../../fonts/glyphicons-halflings-regular.eot?#iefix) format("embedded-opentype"), url(../../fonts/glyphicons-halflings-regular.woff2) format("woff2"), url(../../fonts/glyphicons-halflings-regular.woff) format("woff"), url(../../fonts/glyphicons-halflings-regular.ttf) format("truetype"), url(../../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format("svg");
    font-display: swap
}

@font-face {
    font-family: hdfcsec_icon;
    src: url(../../fonts/hdfcsec_icon.eot?d3fzk7);
    src: url(../../fonts/hdfcsec_icon.eot?d3fzk7#iefix) format("embedded-opentype"), url(../../fonts/hdfcsec_icon.woff?d3fzk7) format("woff"), url(../../fonts/hdfcsec_icon.ttf?d3fzk7) format("truetype"), url(../../fonts/hdfcsec_icon.svg#?d3fzk7hdfcsec_icon) format("svg");
    font-display: swap
}

@font-face {
    font-family: hdfcsec_icon;
    src: url(../../fonts/hdfcsec_icon.eot?d3fzk7);
    src: url(../../fonts/hdfcsec_icon.eot?d3fzk7#iefix) format("embedded-opentype"), url(../../fonts/hdfcsec_icon.ttf?d3fzk7) format("truetype"), url(../../fonts/hdfcsec_icon.woff?d3fzk7) format("woff"), url(../../fonts/hdfcsec_icon.svg?d3fzk7#hdfcsec_icon) format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: RobotoLight;
    src: url(../../fonts/RobotoLight.eot?d3fzk7);
    src: url(../../fonts/RobotoLight.eot?d3fzk7#iefix) format("embedded-opentype"), url(../../fonts/RobotoLight.woff?d3fzk7) format("woff"), url(../../fonts/RobotoLight.ttf?d3fzk7) format("truetype"), url(../../fonts/RobotoLight.svg#?d3fzk7RobotoLight) format("svg");
    font-display: swap
}

@font-face {
    font-family: RobotoBold;
    src: url(../../fonts/RobotoBold.eot?d3fzk7);
    src: url(../../fonts/RobotoBold.eot?d3fzk7#iefix) format("embedded-opentype"), url(../../fonts/RobotoBold.woff?d3fzk7) format("woff"), url(../../fonts/RobotoBold.ttf?d3fzk7) format("truetype"), url(../../fonts/RobotoBold.svg#?d3fzk7RobotoBold) format("svg");
    font-display: swap
}

@font-face {
    font-family: RobotoMedium;
    src: url(../../fonts/RobotoMedium.eot?d3fzk7);
    src: url(../../fonts/RobotoMedium.eot?d3fzk7#iefix) format("embedded-opentype"), url(../../fonts/RobotoMedium.woff?d3fzk7) format("woff"), url(../../fonts/RobotoMedium.ttf?d3fzk7) format("truetype"), url(../../fonts/RobotoMedium.svg#?d3fzk7RobotoMedium) format("svg");
    font-display: swap
}

@font-face {
    font-family: RobotoRegular;
    src: url(../../fonts/RobotoRegular.eot?d3fzk7);
    src: url(../../fonts/RobotoRegular.eot?d3fzk7#iefix) format("embedded-opentype"), url(../../fonts/RobotoRegular.woff?d3fzk7) format("woff"), url(../../fonts/RobotoRegular.ttf?d3fzk7) format("truetype"), url(../../fonts/RobotoRegular.svg#?d3fzk7RobotoRegular) format("svg");
    font-display: swap
}

@font-face {
    font-family: source_sans_proregular;
    src: url(../../fonts/sourcesanspro-regular-webfont.eot);
    src: url(../../fonts/sourcesanspro-regular-webfont.eot?#iefix) format("embedded-opentype"), url(../../fonts/sourcesanspro-regular-webfont.woff2) format("woff2"), url(../../fonts/sourcesanspro-regular-webfont.woff) format("woff"), url(../../fonts/sourcesanspro-regular-webfont.ttf) format("truetype"), url(../../fonts/sourcesanspro-regular-webfont.svg#source_sans_proregular) format("svg");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

*:focus,
button:focus,
.form-group .bootstrap-select .dropdown-toggle:focus,
.form-group a:focus {
    outline: .2rem solid #003b7066 !important;
    box-shadow: var(--bs-focus-ring-x, 0) var(--bs-focus-ring-y, 0) var(--bs-focus-ring-blur, 0) 0.25rem #d7dadf;
}

/* This targets the visible button that the user actually tabs into */
/*button:focus, .form-group .bootstrap-select .dropdown-toggle:focus, .form-group a:focus {
    outline: .3rem solid #0056b3 !important;  
    outline-offset: .2rem !important;
    box-shadow: 0 0 0 .4rem rgba(255, 255, 255, 0.5) !important;
}*/
header.header + main {
    padding-top: calc(var(--unit) * 17);
}

@media (max-width: 991.99px) {
    header.header + main {
        padding-top: calc(var(--unit) * 13.52);
    }
}

.search-section {
    width: 100%;
    max-width: 42rem;
    position: relative;
    display: flex;
    align-items: center;
    background: transparent;
    border: .1rem solid #FFFFFF;
    border-radius: 2.5rem;
    padding: .7rem 2.1rem;
    font-size: 1.5rem;
    color: #FFFFFF80;
    outline: none;
    width: 100%;
    transition: border-color 0.2s;
}

    .search-section.searchExpanded-small {
        border-radius: 2.5rem 2.5rem 0 0;
    }

.search-elements {
    padding: 0;
}

    .search-elements svg path {
        fill: #FFFFFF80;
    }

    .search-elements input[type=text] {
        background: transparent;
        border: 0;
        color: #FFFFFF80;
        font-size: 1.8rem;
    }

.searchExpandedResults.custom-scrollbar {
    position: absolute;
    left: -2.2rem;
    max-height: 350px;
    overflow: auto;
    width: 112%;
    padding: 1.2rem 2.1rem;
    border: .1rem solid #fff;
    background: #fff;
    border-radius: 0 0 2.5rem 2.5rem;
}
.footer-disclaimer-wrapper {
    padding: 0;
}
.copyright {
    font-size: 1.8rem;
    font-weight: 400;
    text-align: center;
    color: #fff;
    padding-top: 2.4rem;
}
@media (max-width: 767px) {
    .copyright {
        font-size: 1.2rem;
        padding: 1.6rem 0;
    }
}
@media (max-width: 1599.98px) {
    html {
        font-size: 52.5%;
    }
}

@media (max-width: 1424.98px) {
    html, body {
        font-size: 48.5%;
    }
}

@media (max-width: 1256.98px) {
    html, body {
        font-size: 44.5%;
    }
}

@media (max-width: 991.98px) {
    html, body {
        font-size: 62.5%;
    }
}