﻿:root {
    --primary: #0f6fff;
    --primary-dark: #174ea6;
    --cyan: #00c2ff;
    --navy: #071a36;
    --navy-900: #041226;
    --navy-soft: #10284f;
    --white: #ffffff;
    --text: #1e293b;
    --muted: #64748b;
    --border: #e2e8f0;
    --bg: #f8fbff;
    --surface: rgba(255, 255, 255, .9);
    --shadow-soft: 0 16px 45px rgba(2, 8, 23, .08);
    --shadow-lg: 0 34px 90px rgba(2, 8, 23, .14);
    --shadow-blue: 0 28px 75px rgba(15, 111, 255, .22);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--bg);
    color: var(--text);
}

/* HERO */

.fx-home-hero {
    position: relative;
    overflow: hidden;
    padding: 86px 0 96px;
    background: radial-gradient(circle at 78% 18%, rgba(0, 194, 255, .22), transparent 32%), radial-gradient(circle at 12% 86%, rgba(15, 111, 255, .12), transparent 34%), linear-gradient(135deg, #ffffff 0%, #eef7ff 54%, #f8fbff 100%);
}

.fx-hero-bg {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(15, 111, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(15, 111, 255, .045) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: linear-gradient(to bottom, black 0%, black 74%, transparent 98%);
    pointer-events: none;
}

.fx-home-hero::before {
    content: "";
    position: absolute;
    width: 640px;
    height: 640px;
    right: -260px;
    top: 70px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(15, 111, 255, .13), transparent 68%);
}

.fx-home-hero::after {
    content: "";
    position: absolute;
    left: 4%;
    bottom: -230px;
    width: 540px;
    height: 540px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 194, 255, .11), transparent 70%);
}

.fx-home-hero .container {
    position: relative;
    z-index: 2;
}

.fx-hero-header {
    max-width: 1180px;
    margin: 0 auto 42px;
    text-align: center;
}

.fx-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--primary);
    background: rgba(255, 255, 255, .94);
    border: 1px solid rgba(15, 111, 255, .16);
    border-radius: 999px;
    padding: 10px 17px;
    font-size: .74rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    box-shadow: 0 12px 30px rgba(15, 111, 255, .08);
    margin-bottom: 24px;
}

    .fx-eyebrow::before {
        content: "";
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background: linear-gradient(135deg, var(--primary), var(--cyan));
        box-shadow: 0 0 0 6px rgba(15, 111, 255, .10);
    }

.fx-home-hero h1 {
    max-width: 1180px;
    margin: 0 auto 22px;
    color: var(--navy);
    font-size: clamp(3rem, 5vw, 5.1rem);
    font-weight: 950;
    line-height: 1.03;
    letter-spacing: -3.2px;
}

    .fx-home-hero h1 span {
        display: block;
        background: linear-gradient(135deg, var(--primary), var(--cyan));
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

.fx-hero-text {
    max-width: 780px;
    margin: 0 auto;
    color: var(--muted);
    font-size: 1.15rem;
    line-height: 1.82;
}

.fx-hero-banner {
    margin: 42px auto 34px;
}

/* HERO IMAGE */

.fx-logo-showcase {
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 1480px;
    margin: 0 auto;
    border-radius: 34px;
    box-shadow: 0 34px 90px rgba(2, 8, 23, .16), 0 0 70px rgba(15, 111, 255, .10);
    isolation: isolate;
    transform-style: preserve-3d;
    animation: fxFloat 6s ease-in-out infinite;
    transition: box-shadow .35s ease;
}

    .fx-logo-showcase:hover {
        box-shadow: 0 46px 115px rgba(2, 8, 23, .20), 0 0 90px rgba(0, 194, 255, .18);
    }

    .fx-logo-showcase::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 3;
        border-radius: inherit;
        background: linear-gradient( 120deg, transparent 0%, rgba(0, 194, 255, .16) 42%, rgba(255, 255, 255, .18) 50%, rgba(15, 111, 255, .16) 58%, transparent 100% );
        transform: translateX(-120%);
        animation: fxScan 4.8s ease-in-out infinite;
        pointer-events: none;
    }

    .fx-logo-showcase::after {
        content: "";
        position: absolute;
        inset: auto 70px -14px;
        height: 12px;
        border-radius: 999px;
        background: linear-gradient( 90deg, transparent, var(--primary), var(--cyan), #8b5cf6, transparent );
        filter: blur(10px);
        opacity: .75;
        animation: fxNeonPulse 2.8s ease-in-out infinite;
    }

    .fx-logo-showcase img {
        display: block;
        width: 100%;
        height: 520px;
        object-fit: cover;
        object-position: center;
        border-radius: 34px;
        box-shadow: 0 30px 80px rgba(2, 8, 23, .20);
        animation: fxImagePulse 5.5s ease-in-out infinite;
    }

.fx-logo-glow {
    position: absolute;
    inset: -34px;
    z-index: -1;
    border-radius: inherit;
    background: radial-gradient(circle at 24% 25%, rgba(15,111,255,.24), transparent 38%), radial-gradient(circle at 82% 70%, rgba(0,194,255,.20), transparent 42%), radial-gradient(circle at 70% 25%, rgba(112,0,255,.12), transparent 38%);
    filter: blur(34px);
    opacity: .78;
    pointer-events: none;
    animation: fxGlowMove 7s ease-in-out infinite;
}

.fx-floating-badge,
.fx-badge-one,
.fx-badge-two,
.fx-badge-three {
    display: none !important;
}

/* HERO BUTTONS */

.fx-hero-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    margin: 0 auto 44px;
}

    .fx-hero-actions .btn {
        min-height: 56px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        padding-inline: 32px;
        font-weight: 900;
    }

.btn-primary {
    border: 0;
    background: linear-gradient(135deg, var(--primary), var(--cyan));
    box-shadow: 0 18px 42px rgba(15, 111, 255, .28);
}

    .btn-primary:hover {
        transform: translateY(-3px);
        box-shadow: 0 24px 56px rgba(15, 111, 255, .34);
    }

.btn-outline-dark {
    color: var(--navy);
    border: 1px solid rgba(15, 111, 255, .20);
    background: rgba(255, 255, 255, .86);
    backdrop-filter: blur(12px);
}

    .btn-outline-dark:hover {
        color: var(--white);
        background: var(--navy);
        transform: translateY(-3px);
    }

/* TRUST CARDS */

.fx-trust-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    max-width: 1080px;
    margin: 0 auto;
}

    .fx-trust-row a {
        position: relative;
        overflow: hidden;
        min-height: 150px;
        padding: 30px 32px;
        color: inherit;
        text-decoration: none;
        background: rgba(255, 255, 255, .92);
        border: 1px solid rgba(15, 111, 255, .12);
        border-radius: 24px;
        box-shadow: var(--shadow-soft);
        backdrop-filter: blur(16px);
        display: flex;
        align-items: center;
        gap: 22px;
        transition: transform .25s ease, box-shadow .3s ease, border-color .3s ease;
    }

        .fx-trust-row a > i {
            position: relative;
            z-index: 2;
            flex: 0 0 56px;
            width: 56px;
            height: 56px;
            display: grid;
            place-items: center;
            border-radius: 18px;
            color: var(--primary);
            background: rgba(15, 111, 255, .08);
            font-size: 1.9rem;
        }

        .fx-trust-row a::before {
            content: "";
            position: absolute;
            width: 180px;
            height: 180px;
            right: -82px;
            top: -82px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(0, 194, 255, .30), transparent 72%);
            opacity: 0;
            transition: opacity .3s ease;
        }

        .fx-trust-row a::after {
            content: "";
            position: absolute;
            left: 32px;
            right: 32px;
            bottom: 0;
            height: 5px;
            border-radius: 999px 999px 0 0;
            background: linear-gradient(90deg, var(--primary), var(--cyan));
            opacity: 0;
            transform: scaleX(.25);
            transform-origin: left;
            transition: opacity .3s ease, transform .3s ease;
        }

        .fx-trust-row a:hover {
            transform: translateY(-6px);
            border-color: rgba(15, 111, 255, .30);
            box-shadow: var(--shadow-blue);
        }

            .fx-trust-row a:hover::before,
            .fx-trust-row a:hover::after {
                opacity: 1;
                transform: scaleX(1);
            }

    .fx-trust-row strong {
        position: relative;
        z-index: 2;
        display: block;
        color: var(--navy);
        font-size: 1.18rem;
        font-weight: 950;
        margin-bottom: 8px;
    }

    .fx-trust-row span {
        position: relative;
        z-index: 2;
        display: block;
        color: var(--muted);
        font-size: .97rem;
        line-height: 1.55;
    }

/* CAROUSEL */

.fx-carousel-section {
    padding: 105px 0;
    background: var(--white);
}

.fx-executive-carousel {
    overflow: hidden;
    border-radius: 34px;
    box-shadow: var(--shadow-lg);
    border: 1px solid rgba(15, 111, 255, .10);
}

.fx-slide-card {
    display: grid;
    grid-template-columns: .95fr 1.05fr;
    min-height: 610px;
    color: inherit;
    text-decoration: none;
    background: var(--white);
}

.fx-slide-image {
    position: relative;
    min-height: 610px;
    overflow: hidden;
}

    .fx-slide-image::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, transparent 55%, rgba(255,255,255,.35));
        pointer-events: none;
    }

    .fx-slide-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 1.1s ease;
    }

.carousel-item.active .fx-slide-image img {
    transform: scale(1.045);
}

.fx-slide-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(42px, 5vw, 78px);
}

    .fx-slide-content span {
        color: var(--primary);
        font-size: .78rem;
        font-weight: 950;
        letter-spacing: 2.2px;
        text-transform: uppercase;
    }

    .fx-slide-content h2 {
        margin: 18px 0;
        color: var(--navy);
        font-size: clamp(2rem, 3.2vw, 3.35rem);
        line-height: 1.04;
        font-weight: 950;
        letter-spacing: -1.7px;
    }

    .fx-slide-content p {
        max-width: 620px;
        color: var(--muted);
        line-height: 1.85;
        font-size: 1.05rem;
    }

    .fx-slide-content strong,
    .fx-slide-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        width: fit-content;
        margin-top: 22px;
        color: var(--primary);
        font-weight: 950;
        text-decoration: none;
        transition: color .25s ease, gap .25s ease;
    }

        .fx-slide-card:hover .fx-slide-content strong,
        .fx-slide-link:hover {
            color: var(--cyan);
            gap: 12px;
        }

.carousel-indicators {
    margin-bottom: 22px;
}

    .carousel-indicators [data-bs-target] {
        width: 11px;
        height: 11px;
        border-radius: 999px;
        border: 0;
    }

/* SECTIONS */

.fx-section {
    position: relative;
    padding: 108px 0;
    background: var(--bg);
}

.fx-white {
    background: var(--white);
}

.fx-section-title {
    max-width: 900px;
    margin: 0 auto 58px;
    text-align: center;
}

    .fx-section-title span {
        color: var(--primary);
        font-size: .78rem;
        font-weight: 950;
        text-transform: uppercase;
        letter-spacing: 2.1px;
    }

    .fx-section-title h2 {
        margin: 14px 0;
        color: var(--navy);
        font-size: clamp(2.15rem, 4vw, 3.25rem);
        font-weight: 950;
        letter-spacing: -1.9px;
    }

    .fx-section-title p {
        color: var(--muted);
        line-height: 1.8;
        margin: 0 auto;
        max-width: 720px;
    }

/* SERVICE CARDS */

.fx-service-card {
    position: relative;
    overflow: hidden;
    display: block;
    height: 100%;
    min-height: 320px;
    padding: 34px;
    color: inherit;
    text-decoration: none;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 26px;
    box-shadow: var(--shadow-soft);
    transition: transform .25s ease, box-shadow .3s ease, border-color .3s ease;
}

    .fx-service-card::before {
        content: "";
        position: absolute;
        width: 240px;
        height: 240px;
        right: -98px;
        top: -98px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(0, 194, 255, .26), transparent 68%);
        opacity: 0;
        transition: opacity .3s ease;
    }

    .fx-service-card::after {
        content: "";
        position: absolute;
        left: 34px;
        right: 34px;
        bottom: 0;
        height: 5px;
        border-radius: 999px 999px 0 0;
        background: linear-gradient(90deg, var(--primary), var(--cyan));
        opacity: 0;
        transform: scaleX(.25);
        transform-origin: left;
        transition: opacity .3s ease, transform .3s ease;
    }

    .fx-service-card:hover {
        transform: translateY(-7px);
        border-color: rgba(15, 111, 255, .30);
        box-shadow: var(--shadow-blue);
    }

        .fx-service-card:hover::before,
        .fx-service-card:hover::after {
            opacity: 1;
            transform: scaleX(1);
        }

    .fx-service-card i {
        position: relative;
        z-index: 2;
        width: 54px;
        height: 54px;
        display: grid;
        place-items: center;
        border-radius: 17px;
        color: var(--primary);
        background: rgba(15, 111, 255, .08);
        font-size: 1.75rem;
    }

    .fx-service-card h3 {
        position: relative;
        z-index: 2;
        margin: 22px 0 12px;
        color: var(--navy);
        font-size: 1.35rem;
        font-weight: 950;
    }

    .fx-service-card p {
        position: relative;
        z-index: 2;
        color: var(--muted);
        line-height: 1.75;
        margin: 0;
    }

    .fx-service-card small {
        position: relative;
        z-index: 2;
        display: inline-flex;
        margin-top: 20px;
        color: var(--primary);
        font-weight: 950;
    }

/* DARK PROCESS */

.fx-dark-panel {
    color: var(--white);
    background: radial-gradient(circle at top right, rgba(0, 194, 255, .22), transparent 34%), radial-gradient(circle at bottom left, rgba(15, 111, 255, .18), transparent 36%), linear-gradient(135deg, #071a36, #10284f);
}

    .fx-dark-panel .fx-eyebrow {
        color: var(--primary);
        background: rgba(255, 255, 255, .96);
        border-color: rgba(255, 255, 255, .16);
    }

    .fx-dark-panel h2 {
        color: var(--white) !important;
        font-size: clamp(2.1rem, 4vw, 3.15rem);
        font-weight: 950;
        letter-spacing: -1.5px;
    }

    .fx-dark-panel p {
        color: rgba(255, 255, 255, .86) !important;
        line-height: 1.8;
    }

.light {
    color: var(--cyan);
}

.fx-process-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

    .fx-process-grid div {
        position: relative;
        overflow: hidden;
        min-height: 185px;
        padding: 30px;
        background: rgba(255, 255, 255, .075);
        border: 1px solid rgba(255, 255, 255, .16);
        border-radius: 25px;
        backdrop-filter: blur(14px);
        transition: transform .25s ease, background .3s ease, border-color .3s ease;
    }

        .fx-process-grid div::after {
            content: "";
            position: absolute;
            left: 30px;
            right: 30px;
            bottom: 0;
            height: 4px;
            border-radius: 999px 999px 0 0;
            background: linear-gradient(90deg, var(--primary), var(--cyan));
            opacity: 0;
            transform: scaleX(.25);
            transform-origin: left;
            transition: opacity .3s ease, transform .3s ease;
        }

        .fx-process-grid div:hover {
            transform: translateY(-5px);
            background: rgba(255, 255, 255, .10);
            border-color: rgba(0, 194, 255, .34);
        }

            .fx-process-grid div:hover::after {
                opacity: 1;
                transform: scaleX(1);
            }

    .fx-process-grid b {
        display: inline-flex;
        width: 50px;
        height: 50px;
        align-items: center;
        justify-content: center;
        color: var(--white) !important;
        border-radius: 15px;
        background: linear-gradient(135deg, var(--primary), var(--cyan));
        margin-bottom: 16px;
    }

    .fx-process-grid h4 {
        color: var(--white) !important;
        font-weight: 950;
        margin-bottom: 10px;
    }

    .fx-process-grid p {
        color: rgba(255, 255, 255, .82) !important;
        margin: 0;
    }

/* TECHNOLOGY */

.fx-tech-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
}

.fx-tech-card {
    position: relative;
    overflow: hidden;
    min-height: 214px;
    padding: 28px;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 26px;
    box-shadow: var(--shadow-soft);
    transition: transform .25s ease, box-shadow .3s ease, border-color .3s ease;
}

    .fx-tech-card::after {
        content: "";
        position: absolute;
        left: 28px;
        right: 28px;
        bottom: 0;
        height: 4px;
        border-radius: 999px 999px 0 0;
        background: linear-gradient(90deg, var(--primary), var(--cyan));
        opacity: 0;
        transform: scaleX(.25);
        transform-origin: left;
        transition: opacity .3s ease, transform .3s ease;
    }

    .fx-tech-card:hover {
        transform: translateY(-6px);
        border-color: rgba(15, 111, 255, .28);
        box-shadow: var(--shadow-blue);
    }

        .fx-tech-card:hover::after {
            opacity: 1;
            transform: scaleX(1);
        }

    .fx-tech-card span {
        display: inline-block;
        color: var(--primary);
        font-size: .75rem;
        font-weight: 950;
        text-transform: uppercase;
        letter-spacing: 1.7px;
        margin-bottom: 12px;
    }

    .fx-tech-card h3 {
        color: var(--navy);
        font-size: 1.18rem;
        font-weight: 950;
        margin-bottom: 12px;
    }

    .fx-tech-card p {
        color: var(--muted);
        line-height: 1.7;
        margin: 0;
    }

/* CTA */

.fx-executive-cta {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 150px 1fr auto;
    gap: 36px;
    align-items: center;
    padding: 46px;
    background: radial-gradient(circle at top right, rgba(0, 194, 255, .15), transparent 30%), linear-gradient(135deg, #eef6ff, #ffffff);
    border: 1px solid var(--border);
    border-radius: 34px;
    box-shadow: var(--shadow-soft);
}

    .fx-executive-cta::after {
        content: "";
        position: absolute;
        left: 46px;
        right: 46px;
        bottom: 0;
        height: 5px;
        border-radius: 999px 999px 0 0;
        background: linear-gradient(90deg, var(--primary), var(--cyan));
    }

    .fx-executive-cta img {
        position: relative;
        z-index: 2;
        width: 100%;
        max-height: 120px;
        object-fit: contain;
    }

    .fx-executive-cta div,
    .fx-executive-cta a {
        position: relative;
        z-index: 2;
    }

    .fx-executive-cta span {
        color: var(--primary);
        font-size: .78rem;
        font-weight: 950;
        text-transform: uppercase;
        letter-spacing: 2px;
    }

    .fx-executive-cta h2 {
        color: var(--navy);
        font-size: clamp(1.8rem, 3vw, 2.65rem);
        font-weight: 950;
        letter-spacing: -1.2px;
        margin: 10px 0;
    }

    .fx-executive-cta p {
        color: var(--muted);
        line-height: 1.7;
        margin: 0;
    }

/* RESPONSIVE */

@media (max-width: 1200px) {
    .fx-home-hero h1 {
        font-size: clamp(2.7rem, 5vw, 4.4rem);
    }

    .fx-logo-showcase img {
        height: 460px;
    }

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

@media (max-width: 991px) {
    .fx-home-hero {
        padding: 92px 0 78px;
    }

        .fx-home-hero h1 {
            font-size: clamp(2.45rem, 8vw, 4rem);
            letter-spacing: -2.4px;
        }

    .fx-hero-text {
        font-size: 1.05rem;
    }

    .fx-logo-showcase img {
        height: 360px;
    }

    .fx-trust-row {
        grid-template-columns: 1fr;
        max-width: 640px;
    }

        .fx-trust-row a {
            min-height: auto;
        }

    .fx-slide-card {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .fx-slide-image {
        min-height: 360px;
    }

        .fx-slide-image::after {
            display: none;
        }

    .fx-slide-content {
        padding: 42px;
        text-align: left;
    }

    .fx-process-grid {
        grid-template-columns: 1fr;
    }

    .fx-executive-cta {
        grid-template-columns: 1fr;
        text-align: center;
    }

        .fx-executive-cta img {
            max-width: 170px;
            margin: 0 auto;
        }
}

@media (max-width: 768px) {
    .fx-home-hero {
        padding: 82px 0 68px;
    }

        .fx-home-hero h1 {
            font-size: clamp(2.2rem, 10.5vw, 3.25rem);
            line-height: 1.06;
            letter-spacing: -2px;
        }

    .fx-hero-text {
        font-size: 1rem;
        line-height: 1.72;
    }

    .fx-hero-actions {
        gap: 12px;
    }

    .fx-logo-showcase {
        border-radius: 26px;
    }

        .fx-logo-showcase img {
            height: 285px;
            border-radius: 26px;
        }

    .fx-trust-row a {
        padding: 24px;
        align-items: flex-start;
    }

    .fx-carousel-section,
    .fx-section {
        padding: 78px 0;
    }

    .fx-slide-image {
        min-height: 280px;
    }

    .fx-slide-content {
        padding: 32px;
    }

    .fx-service-card {
        min-height: auto;
        padding: 28px;
    }

    .fx-tech-grid {
        grid-template-columns: 1fr;
    }

    .fx-executive-cta {
        padding: 34px 24px;
        border-radius: 28px;
    }
}

@media (max-width: 480px) {
    .fx-eyebrow {
        font-size: .66rem;
        letter-spacing: 1.6px;
        padding: 9px 12px;
    }

    .fx-home-hero h1 {
        font-size: 2.25rem;
    }

    .fx-hero-actions .btn {
        width: 100%;
    }

    .fx-logo-showcase img {
        height: 220px;
    }

    .fx-trust-row a {
        flex-direction: column;
        gap: 16px;
    }

    .fx-slide-content {
        padding: 28px 24px;
    }

        .fx-slide-content h2 {
            font-size: 2rem;
        }

    .fx-section-title h2 {
        font-size: 2rem;
    }
}

/* ANIMATIONS */

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

    50% {
        transform: translateY(-10px);
    }
}

@keyframes fxScan {
    0% {
        transform: translateX(-120%);
        opacity: 0;
    }

    20% {
        opacity: .9;
    }

    55% {
        transform: translateX(120%);
        opacity: .55;
    }

    100% {
        transform: translateX(120%);
        opacity: 0;
    }
}

@keyframes fxNeonPulse {
    0%, 100% {
        opacity: .45;
        transform: scaleX(.92);
    }

    50% {
        opacity: .95;
        transform: scaleX(1.08);
    }
}

@keyframes fxImagePulse {
    0%, 100% {
        filter: brightness(1) contrast(1.04) saturate(1.08);
    }

    50% {
        filter: brightness(1.09) contrast(1.1) saturate(1.22);
    }
}

@keyframes fxGlowMove {
    0%, 100% {
        transform: scale(1) translate(0, 0);
        opacity: .65;
    }

    50% {
        transform: scale(1.08) translate(14px, -10px);
        opacity: .95;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}

/* FINAL FIX - DARK DELIVERY + TECHNOLOGY CARDS */

.fx-dark-panel {
    background: radial-gradient(circle at top right, rgba(0, 194, 255, .22), transparent 34%), radial-gradient(circle at bottom left, rgba(15, 111, 255, .18), transparent 36%), linear-gradient(135deg, #071a36, #10284f);
}

    .fx-dark-panel h2,
    .fx-dark-panel h4,
    .fx-dark-panel b,
    .fx-dark-panel strong {
        color: #ffffff !important;
    }

    .fx-dark-panel p,
    .fx-dark-panel span {
        color: rgba(255, 255, 255, .84) !important;
    }

    .fx-dark-panel .fx-eyebrow {
        color: var(--primary) !important;
        background: rgba(255, 255, 255, .96);
    }

.fx-process-grid div {
    background: rgba(255, 255, 255, .075);
    border: 1px solid rgba(255, 255, 255, .16);
}

.fx-process-grid b {
    background: linear-gradient(135deg, var(--primary), var(--cyan));
}

/* TECHNOLOGY STACK CARDS */

.fx-tech-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 22px;
    margin-top: 54px;
}

.fx-tech-card {
    position: relative;
    overflow: hidden;
    min-height: 240px;
    padding: 30px;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,251,255,.96));
    border: 1px solid rgba(15, 111, 255, .12);
    border-radius: 26px;
    box-shadow: 0 18px 50px rgba(2, 8, 23, .08), inset 0 1px 0 rgba(255,255,255,.8);
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

    .fx-tech-card::before {
        content: "";
        position: absolute;
        width: 190px;
        height: 190px;
        right: -90px;
        top: -90px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(0, 194, 255, .26), transparent 70%);
        opacity: 0;
        transition: opacity .28s ease;
    }

    .fx-tech-card::after {
        content: "";
        position: absolute;
        left: 30px;
        right: 30px;
        bottom: 0;
        height: 5px;
        border-radius: 999px 999px 0 0;
        background: linear-gradient(90deg, var(--primary), var(--cyan));
        opacity: 0;
        transform: scaleX(.25);
        transform-origin: left;
        transition: opacity .28s ease, transform .28s ease;
    }

    .fx-tech-card:hover {
        transform: translateY(-8px);
        border-color: rgba(15, 111, 255, .30);
        box-shadow: 0 28px 75px rgba(15, 111, 255, .18), inset 0 1px 0 rgba(255,255,255,.9);
    }

        .fx-tech-card:hover::before,
        .fx-tech-card:hover::after {
            opacity: 1;
            transform: scaleX(1);
        }

    .fx-tech-card span {
        position: relative;
        z-index: 2;
        display: inline-block;
        color: var(--primary);
        font-size: .74rem;
        font-weight: 950;
        text-transform: uppercase;
        letter-spacing: 1.8px;
        margin-bottom: 16px;
    }

    .fx-tech-card h3 {
        position: relative;
        z-index: 2;
        color: var(--navy);
        font-size: 1.32rem;
        font-weight: 950;
        margin-bottom: 14px;
    }

    .fx-tech-card p {
        position: relative;
        z-index: 2;
        color: var(--muted);
        font-size: .98rem;
        line-height: 1.75;
        margin: 0;
    }

@media (max-width: 1200px) {
    .fx-tech-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .fx-tech-grid {
        grid-template-columns: 1fr;
    }
}