.vx-banner {
        width: 100%;
        min-height: 727px;
        background: #020D1A;
        position: relative;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Grid overlay */
    .vx-grid {
        position: absolute;
        inset: 0;
        background-image:
            linear-gradient(rgba(167, 235, 242, 0.04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(167, 235, 242, 0.04) 1px, transparent 1px);
        background-size: 48px 48px;
        z-index: 0;
    }

    /* Orb 1 */
    .vx-orb1 {
        position: absolute;
        width: 480px;
        height: 480px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(84, 172, 191, 0.28) 0%, transparent 70%);
        top: -120px;
        left: -80px;
        z-index: 0;
        animation: drift1 9s ease-in-out infinite;
    }

    /* Orb 2 */
    .vx-orb2 {
        position: absolute;
        width: 360px;
        height: 360px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(2, 56, 89, 0.7) 0%, transparent 70%);
        bottom: -80px;
        right: -60px;
        z-index: 0;
        animation: drift2 12s ease-in-out infinite;
    }

    /* Accent line */
    .vx-line {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 1px;
        height: 100%;
        background: linear-gradient(180deg, transparent, rgba(167, 235, 242, 0.12) 40%, rgba(167, 235, 242, 0.18) 60%, transparent);
        z-index: 0;
    }

    /* Noise grain */
    .vx-noise {
        position: absolute;
        inset: 0;
        z-index: 1;
        opacity: 0.025;
        background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
        background-size: 180px 180px;
    }

    /* Content */
    .vx-content {
        position: relative;
        z-index: 2;
        max-width: 660px;
        padding: 72px 40px;
        text-align: center;
        animation: fadeUp 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    /* Badge */
    .vx-badge {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        background: rgba(167, 235, 242, 0.08);
        border: 0.5px solid rgba(167, 235, 242, 0.25);
        border-radius: 100px;
        padding: 5px 14px;
        font-size: 11px;
        font-weight: 500;
        color: #A7EBF2;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        margin-bottom: 28px;
    }

    .vx-badge-dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #A7EBF2;
        animation: pulse 2s ease-in-out infinite;
    }

    /* Heading */
    .vx-heading {
        font-weight: 700;
        font-size: 52px;
        line-height: 1.1;
        color: #ffffff;
        margin: 0 0 20px;
        letter-spacing: -0.02em;
    }

    .vx-heading span {
        background: linear-gradient(135deg, #A7EBF2 0%, #54ACBF 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    /* Desc */
    .vx-desc {
        font-size: 16px;
        line-height: 1.7;
        color: rgba(255, 255, 255, 0.5);
        margin: 0 0 36px;
        font-weight: 400;
    }

    /* CTA */
    .vx-cta {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: #A7EBF2;
        color: #020D1A;
        padding: 13px 28px;
        border-radius: 8px;
        font-weight: 600;
        font-size: 14px;
        text-decoration: none;
        letter-spacing: 0.02em;
        transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
        box-shadow: 0 0 0 0 rgba(167, 235, 242, 0.3);
        border: none;
    }

    .vx-cta:hover {
        background: #c8f4f9;
        /* transform: translateY(-2px); */
        box-shadow: 0 8px 32px rgba(167, 235, 242, 0.2);
    }

    .vx-cta-arrow {
        display: inline-block;
        transition: transform 0.2s ease;
    }

    .vx-cta:hover .vx-cta-arrow {
        transform: translateX(4px);
    }

    /* Stats row */
    .vx-stats {
        display: flex;
        justify-content: center;
        gap: 40px;
        margin-top: 52px;
        padding-top: 36px;
        border-top: 0.5px solid rgba(167, 235, 242, 0.1);
    }

    .vx-stat {
        text-align: center;
    }

    .vx-stat-num {
        font-size: 22px;
        font-weight: 700;
        color: #ffffff;
        display: block;
    }

    .vx-stat-label {
        font-size: 12px;
        color: rgba(255, 255, 255, 0.35);
        text-transform: uppercase;
        letter-spacing: 0.1em;
        margin-top: 2px;
        display: block;
    }

    @keyframes fadeUp {
        from {
            opacity: 0;
            transform: translateY(28px);
        }

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

    @keyframes drift1 {

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

        50% {
            transform: translate(30px, 40px);
        }
    }

    @keyframes drift2 {

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

        50% {
            transform: translate(-20px, -30px);
        }
    }

    @keyframes pulse {

        0%,
        100% {
            opacity: 1;
        }

        50% {
            opacity: 0.3;
        }
    }

    @media (max-width: 520px) {
        .vx-heading {
            font-size: 32px;
        }

        .vx-stats {
            gap: 20px;
        }

        .vx-content {
            padding: 52px 24px;
        }
    }

    /* Section-2 */
    .vss-section {
        background: #f4f9fb;
        padding: 80px 0;
    }

    .vss-header {
        /* text-align: center; */
        margin-bottom: 52px;
    }

    .vss-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: #54ACBF;
        margin-bottom: 14px;
    }

    .vss-eyebrow-line {
        width: 28px;
        height: 1.5px;
        background: #54ACBF;
        border-radius: 2px;
        display: inline-block;
    }

    .vss-title {
        font-size: 36px;
        font-weight: 800;
        color: #020D1A;
        margin: 0 0 12px;
        letter-spacing: -0.02em;
        line-height: 1.15;
    }

    .vss-title span {
        color: #54ACBF;
    }

    .vss-subtitle {
        font-size: 16px;
        font-weight: 400;
        color: #5f7c8a;
        margin: 0;
        line-height: 1.6;
    }

    .vss-card {
        background: #ffffff;
        border-radius: 16px;
        padding: 28px 24px;
        border: 1px solid rgba(2, 13, 26, 0.06);
        height: 100%;
        transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
        display: flex;
        flex-direction: column;
    }

    .vss-card:hover {
        /* transform: translateY(-6px); */
        box-shadow: 0 20px 48px rgba(2, 56, 89, 0.1);
        border-color: rgba(84, 172, 191, 0.3);
    }

    .vss-card:hover .vss-icon-wrap {
        background: #023859;
    }

    .vss-card:hover .vss-icon-wrap svg path,
    .vss-card:hover .vss-icon-wrap svg rect,
    .vss-card:hover .vss-icon-wrap svg circle {
        stroke: #A7EBF2;
    }

    .vss-icon-wrap {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: #eef7fa;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 18px;
        transition: background 0.3s ease;
    }

    .vss-card-tag {
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: #54ACBF;
        margin-bottom: 8px;
    }

    .vss-card-title {
        font-size: 20px;
        font-weight: 700;
        color: #020D1A;
        margin: 0 0 10px;
        letter-spacing: -0.01em;
        line-height: 1.3;
    }

    .vss-card-desc {
        font-size: 16px;
        font-weight: 400;
        color: #5f7c8a;
        line-height: 1.65;
        margin: 0 0 20px;
        flex: 1;
    }

    .vss-stat {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px 0;
        border-top: 1px solid rgba(2, 13, 26, 0.06);
        margin-bottom: 16px;
    }

    .vss-stat-num {
        font-size: 24px;
        font-weight: 800;
        color: #023859;
    }

    .vss-stat-label {
        font-size: 12px;
        color: #7a9aa6;
        line-height: 1.3;
    }

    .vss-link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        font-weight: 500;
        color: #54ACBF;
        text-decoration: none;
        transition: gap 0.25s ease, color 0.25s ease;
    }

    .vss-link:hover {
        gap: 10px;
        color: #023859;
    }

    .vss-link .arrow {
        transition: transform 0.25s ease;
        display: inline-block;
    }

    .vss-link:hover .arrow {
        transform: translateX(3px);
    }

    @media (max-width: 768px) {
        .vss-section {
            padding: 60px 0;
        }

        .vss-title {
            font-size: 26px;
        }

        .vss-card {
            margin-bottom: 16px;
        }
    }

    /* SECTION-3 */


    .vrilex-industries {
        background: #020D1A;
        padding: 80px 0;
        position: relative;
        overflow: hidden;
    }

    /* subtle background glow */
    .vrilex-industries::before {
        content: "";
        position: absolute;
        width: 500px;
        height: 500px;
        background: #A7EBF2;
        filter: blur(120px);
        opacity: 0.08;
        top: -150px;
        left: -150px;
    }

    /* LEFT CONTENT */
    .vrilex-industries-title {
        font-size: 28px;
        font-weight: 700;
        color: #ffffff;
        margin-bottom: 12px;
    }

    .vrilex-industries-desc {
        font-size: 16px;
        color: rgba(255, 255, 255, 0.7);
        max-width: 420px;
    }

    /* CARDS */
    .vrilex-industry-card {
        background: rgba(255, 255, 255, 0.03);
        border: 1px solid rgba(167, 235, 242, 0.15);
        padding: 25px;
        border-radius: 12px;
        margin-bottom: 20px;
        transition: all 0.3s ease;
        height: 100%;
        backdrop-filter: blur(6px);
    }

    /* Hover effect */
    .vrilex-industry-card:hover {
        /* transform: translateY(-6px); */
        border-color: #A7EBF2;
        box-shadow: 0 10px 30px rgba(167, 235, 242, 0.15);
    }

    /* Card text */
    .vrilex-industry-title {
        font-size: 18px;
        font-weight: 600;
        color: #ffffff;
        margin-bottom: 10px;
    }

    .vrilex-industry-desc {
        font-size: 14px;
        color: rgba(255, 255, 255, 0.7);
        margin-bottom: 16px;
        line-height: 1.5;
    }

    /* Link */
    .vrilex-industry-link {
        font-size: 14px;
        color: #A7EBF2;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        transition: all 0.3s ease;
    }

    .vrilex-industry-link span {
        transition: transform 0.3s ease;
    }

    .vrilex-industry-link:hover span {
        transform: translateX(5px);
    }

    .vrilex-industry-link:hover {
        color: #ffffff;
    }

    /* ===== RESPONSIVE ===== */

    /* Tablet */
    @media (max-width: 992px) {
        .vrilex-industries-title {
            font-size: 24px;
        }

        .vrilex-industries-desc {
            margin-bottom: 30px;
        }
    }

    /* Mobile */
    @media (max-width: 768px) {
        .vrilex-industries {
            padding: 60px 20px;
        }

        .vrilex-industries-title {
            font-size: 22px;
        }

        .vrilex-industries-desc {
            font-size: 14px;
        }

        .vrilex-industry-card {
            padding: 20px;
        }
    }

    /* SECTION 4 */

    .vrilex-customer-stories {
        background: #f4f9fb;
        padding: 80px 0;
        color: #020D1A;
    }

    /* HEADER */
    .vrilex-cs-header {
        margin-bottom: 30px;
    }

    .vrilex-cs-title {
        font-size: 36px;
        font-weight: 700;
    }

    /* NAV BUTTONS */
    .vrilex-cs-nav {
        display: flex;
        gap: 10px;
    }

    .vrilex-cs-arrow {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        border: 1px solid rgba(167, 235, 242, 0.4);
        background: #A7EBF2;

        color: #023859;
        cursor: pointer;
        transition: 0.3s;
    }

    .vrilex-cs-arrow:hover {
        background: #54ACBF;
        color: #023859;
    }

    /* SLIDER */
    .vrilex-cs-slider {
        display: flex;
        gap: 20px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-bottom: 10px;
    }

    .vrilex-cs-slider::-webkit-scrollbar {
        display: none;
    }

    /* CARD */
    .vrilex-cs-card {
        min-width: 320px;
        height: 420px;
        border-radius: 16px;
        overflow: hidden;
        position: relative;
        flex-shrink: 0;
        scroll-snap-align: start;
    }

    /* IMAGE */
    .vrilex-cs-card img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* OVERLAY */
    .vrilex-cs-overlay {
        position: absolute;
        bottom: 0;
        width: 100%;
        padding: 20px;
        background: linear-gradient(to top,
                rgba(2, 56, 89, 0.95),
                rgba(2, 56, 89, 0.6),
                transparent);
    }

    /* TEXT */
    .vrilex-cs-overlay h3 {
        font-size: 30px;
        margin-bottom: 6px;
        color: #ffffff;
    }

    .vrilex-cs-overlay p {
        font-size: 16px;
        color: rgba(255, 255, 255, 0.86);
    }


    .vrilex-cs-slider {
        scroll-behavior: smooth;
        /* smooth scroll */
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 768px) {
        .vrilex-cs-title {
            font-size: 22px;
        }

        .vrilex-cs-card {
            min-width: 260px;
            height: 360px;
        }
    }

    /* SECTION 5 */

    .vrilex-insights {
        background: #f4f9fb;
        padding: 80px 0;
        color: #fff;
    }

    /* TITLE */
    .vrilex-insights-title {
        font-size: 36px;
        font-weight: 800;
        color: #020D1A;
        margin-bottom: 50px;
    }

    /* CARD */
    .vrilex-insight-card {
        display: flex;
        align-items: end;
        position: relative;
        height: 320px;
        border-radius: 12px;
        overflow: hidden;
        padding: 20px;
        background: linear-gradient(135deg, #023859, #0b5c73);
        transition: all 0.4s ease;
        cursor: pointer;
        text-align: start;
    }

    /* ENLARGE ON HOVER */
    .vrilex-insight-card:hover {
        /* transform: scale(1.05); */
        z-index: 2;
    }

    /* CONTENT */
    .vrilex-insight-content {
        position: relative;
        z-index: 2;
    }

    .vrilex-insight-tag {
        font-size: 11px;
        color: #A7EBF2;
        letter-spacing: 1px;
    }

    .vrilex-insight-content h3 {
        font-size: 16px;
        margin-top: 10px;
        line-height: 1.4;
    }

    /* IMAGE (hidden initially) */
    .vrilex-insight-image {
        position: absolute;
        inset: 0;
        transform: translateY(100%);
        transition: all 0.5s ease;
        z-index: 1;
    }

    .vrilex-insight-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0.85;
    }

    /* IMAGE SLIDE ON HOVER */
    .vrilex-insight-card:hover .vrilex-insight-image {
        transform: translateY(0);
    }

    /* DARK OVERLAY ON IMAGE */
    .vrilex-insight-card::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(to top,
                rgba(2, 56, 89, 0.9),
                rgba(2, 56, 89, 0.3));
        z-index: 1;
    }

    /* BUTTON */
    .vrilex-insights-btn {
        margin-top: 40px;
        padding: 10px 30px;
        border: 1px solid #A7EBF2;
        background: transparent;
        color: #A7EBF2;
        transition: 0.3s;
    }

    .vrilex-insights-btn:hover {
        background: #A7EBF2;
        color: #023859;
    }

    /* SPACING */
    .vrilex-insights-cards .col-md-4 {
        margin-bottom: 20px;
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 768px) {
        .vrilex-insight-card {
            height: 260px;
        }

        .vrilex-insights-title {
            font-size: 22px;
        }
    }

    /* Section 6 */

    .vrilex-contact {
        background: #f4f9fb;
        padding: 80px 0;
        position: relative;
        overflow: hidden;
    }


    /* BOX */
    .vrilex-contact-box {
        background: #020D1A;
        position: relative;
        z-index: 1;
        max-width: 1040px;
        margin: auto;
        padding: 40px 50px;
    }

    /* GRID BACKGROUND */
    .vrilex-contact-box::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image:
            linear-gradient(rgba(167, 235, 242, 0.08) 1px, transparent 1px),
            linear-gradient(90deg, rgba(167, 235, 242, 0.08) 1px, transparent 1px);
        background-size: 80px 80px;
    }


    /* TITLE */
    .vrilex-contact-title {
        font-size: 28px;
        font-weight: 700;
        color: #ffffff;
    }

    .vrilex-contact-subtitle {
        color: rgba(255, 255, 255, 0.7);
        margin-bottom: 40px;
    }

    /* FORM */
    .vrilex-contact-form input,
    .vrilex-contact-form textarea {
        width: 100%;
        background: transparent;
        border: none;
        border-bottom: 1px solid rgba(167, 235, 242, 0.3);
        padding: 10px 5px;
        margin-bottom: 25px;
        color: #ffffff;
        outline: none;
        transition: 0.3s;
    }

    /* INPUT FOCUS */
    .vrilex-contact-form input:focus,
    .vrilex-contact-form textarea:focus {
        border-color: #A7EBF2;
    }

    /* PLACEHOLDER */
    .vrilex-contact-form input::placeholder,
    .vrilex-contact-form textarea::placeholder {
        color: rgba(255, 255, 255, 0.5);
        font-size: 14px;
    }

    /* TEXTAREA */
    .vrilex-contact-form textarea {
        min-height: 80px;
        resize: none;
    }

    /* BUTTON */
    .vrilex-contact-btn {
        margin-top: 10px;
        padding: 10px 28px;
        background: #A7EBF2;
        color: #023859;
        border: none;
        font-weight: 500;
        border-radius: 4px;
        transition: 0.3s;
    }

    .vrilex-contact-btn:hover {
        background: #54ACBF;
        color: #ffffff;
    }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 768px) {
        .vrilex-contact-title {
            font-size: 22px;
        }

        .vrilex-contact-box {
            padding: 30px 15px;
        }
    }