/* Cinematic Scroll Classes */
        .cinematic-layer {
            will-change: transform, opacity;
            transform-origin: center center;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            pointer-events: none;
            transition: none !important;
        }

.cinematic-image {
            width: 100%;
            height: 100%;
            object-fit: contain;
            transform-origin: center center;
            transition: none !important;
        }

/* Large Intro Text */
        .mega-text {
            font-family: -apple-system, BlinkMacSystemFont, sans-serif;
            font-size: clamp(2rem, 10vw, 9rem);
            line-height: 0.9;
            text-align: center;
            font-weight: 700;
            letter-spacing: -0.02em;
            color: #FFFFFF;
            /* Default: Desktop (No Wrap) - Enforced */
            white-space: nowrap !important;
            padding: 0;
        }

/* Mobile Adjustments (Max-width 767px) - Only for phones */
        @media (max-width: 767px) {
            .mega-text {
                white-space: normal !important;
                line-height: 1.1;
                max-width: 100%;
                padding: 0 1rem;
            }
        }

/* FAQ Accordion Animation */
        details>summary {
            list-style: none;
        }

details>summary::-webkit-details-marker {
            display: none;
        }

/* JS handles smooth FAQ accordion animation */

        /* Fluid Logo River Animation */
        @keyframes float-1 {

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

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

@keyframes float-2 {

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

            50% {
                transform: translateY(15px);
            }
        }

@keyframes float-3 {

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

            50% {
                transform: translateY(5px);
            }
        }

.logo-float-1 {
            animation: float-1 8s ease-in-out infinite;
        }

.logo-float-2 {
            animation: float-2 10s ease-in-out infinite;
        }

.logo-float-3 {
            animation: float-3 7s ease-in-out infinite;
        }

@keyframes float-4 {

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

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

.logo-float-4 {
            animation: float-4 9s ease-in-out infinite;
        }

/* Logo River Animation */
        @keyframes scroll-left {
            from {
                transform: translateX(0);
            }

            to {
                transform: translateX(-50%);
            }
        }

#logo-river-1,
        #logo-river-2,
        #logo-river-3 {
            white-space: nowrap;
            /* Prevent logos from wrapping */
            will-change: transform;
            display: flex;
            align-items: center;
            animation: scroll-left 50s linear infinite;
        }

#logo-river-1 {
            animation: scroll-left 25s linear infinite;
        }

#logo-river-2 {
            animation: scroll-left 40s linear infinite;
        }

#logo-river-3 {
            animation: scroll-left 30s linear infinite;
        }

#clients:hover #logo-river-1,
        #clients:hover #logo-river-2,
        #clients:hover #logo-river-3 {
            animation-play-state: paused;
        }

.client-logo {
            filter: grayscale(0%);
            opacity: 1;
            transition: transform 0.35s ease;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }

.client-logo:hover {
            transform: translateY(-1px);
        }

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

            #logo-river-1,
            #logo-river-2,
            #logo-river-3 {
                animation: none !important;
                transform: none !important;
            }
        }

/* General Smooth Transitions */
        /* Global smooth transitions removed to prevent stuttering */

        /* Logo - No styling needed with light background */
        nav a[href="index.html"] img[alt="Trumarx Logo"],
        footer a[href="index.html"] img[alt="Trumarx Logo"] {
            transition: all 0.3s ease;
        }

/* Apple-Style Button Styles */
        .btn-royal-blue {
            background-color: #1d1d1f;
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
        }

/* First-time Visitor Splash Screen Styles */
        .splash-skip #splash-screen {
            display: none !important;
        }

#splash-screen {
            display: flex;
            position: fixed;
            inset: 0;
            background-color: #000000;
            z-index: 9999;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            opacity: 1;
            transition: opacity 0.7s cubic-bezier(0.25, 1, 0.5, 1);
        }

#splash-screen.fade-out {
            background-color: transparent !important;
            pointer-events: none;
        }

#floating-stamp {
            opacity: 0;
            pointer-events: none;
            transform: scale(0.6);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

.splash-skip #floating-stamp, #floating-stamp.show {
            opacity: 1 !important;
            transform: scale(1) !important;
            pointer-events: auto !important;
        }

.splash-logo-container {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
        }

#splash-logo {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 12rem;
            height: 12rem;
            background-color: #ffffff;
            border-radius: 50%;
            padding: 1.75rem;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
            opacity: 0;
            transform: translateY(-150px) scale(0.8);
            transition: none;
        }

.splash-logo-img {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }

#splash-logo.animate-drop {
            animation: splashDropBounce 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards,
                splashPulsePop 0.7s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;
        }

@keyframes splashDropBounce {
            0% {
                opacity: 0;
                transform: translateY(-150px) scale(0.8);
            }

            100% {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }

@keyframes splashPulsePop {
            0% {
                transform: scale(1);
                filter: drop-shadow(0 0 0px rgba(255, 255, 255, 0));
            }

            animation: float-1 8s ease-in-out infinite;
        }

.logo-float-2 {
            animation: float-2 10s ease-in-out infinite;
        }

.logo-float-3 {
            animation: float-3 7s ease-in-out infinite;
        }

@keyframes float-4 {

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

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

.logo-float-4 {
            animation: float-4 9s ease-in-out infinite;
        }

/* Logo River Animation */
        @keyframes scroll-left {
            from {
                transform: translateX(0);
            }

            to {
                transform: translateX(-50%);
            }
        }

#logo-river-1,
        #logo-river-2,
        #logo-river-3 {
            white-space: nowrap;
            /* Prevent logos from wrapping */
            will-change: transform;
            display: flex;
            align-items: center;
            animation: scroll-left 50s linear infinite;
        }

#logo-river-1 {
            animation: scroll-left 25s linear infinite;
        }

#logo-river-2 {
            animation: scroll-left 40s linear infinite;
        }

#logo-river-3 {
            animation: scroll-left 30s linear infinite;
        }

#clients:hover #logo-river-1,
        #clients:hover #logo-river-2,
        #clients:hover #logo-river-3 {
            animation-play-state: paused;
        }

.client-logo {
            filter: grayscale(0%);
            opacity: 1;
            transition: transform 0.35s ease;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }

.client-logo:hover {
            transform: translateY(-1px);
        }

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

            #logo-river-1,
            #logo-river-2,
            #logo-river-3 {
                animation: none !important;
                transform: none !important;
            }
        }

/* General Smooth Transitions */
        /* Global smooth transitions removed to prevent stuttering */

        /* Logo - No styling needed with light background */
        nav a[href="index.html"] img[alt="Trumarx Logo"],
        footer a[href="index.html"] img[alt="Trumarx Logo"] {
            transition: all 0.3s ease;
        }

/* Apple-Style Button Styles */
        .btn-royal-blue {
            background-color: #1d1d1f;
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
        }

/* First-time Visitor Splash Screen Styles */
        .splash-skip #splash-screen {
            display: none !important;
        }

#splash-screen {
            display: flex;
            position: fixed;
            inset: 0;
            background-color: #000000;
            z-index: 9999;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            opacity: 1;
            transition: opacity 0.7s cubic-bezier(0.25, 1, 0.5, 1);
        }

#splash-screen.fade-out {
            background-color: transparent !important;
            pointer-events: none;
        }

#floating-stamp {
            opacity: 0;
            pointer-events: none;
            transform: scale(0.6);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

.splash-skip #floating-stamp, #floating-stamp.show {
            opacity: 1 !important;
            transform: scale(1) !important;
            pointer-events: auto !important;
        }

.splash-logo-container {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
        }

#splash-logo {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 12rem;
            height: 12rem;
            background-color: #ffffff;
            border-radius: 50%;
            padding: 1.75rem;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
            opacity: 0;
            transform: translateY(-150px) scale(0.8);
            transition: none;
        }

.splash-logo-img {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }

#splash-logo.animate-drop {
            animation: splashDropBounce 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards,
                splashPulsePop 0.7s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;
        }

@keyframes splashDropBounce {
            0% {
                opacity: 0;
                transform: translateY(-150px) scale(0.8);
            }

            100% {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }

@keyframes splashPulsePop {
            0% {
                transform: scale(1);
                filter: drop-shadow(0 0 0px rgba(255, 255, 255, 0));
            }

            50% {
                transform: scale(1.1);
                filter: drop-shadow(0 0 25px rgba(255, 255, 255, 0.3));
            }

            100% {
                transform: scale(1);
                filter: drop-shadow(0 0 0px rgba(255, 255, 255, 0));
            }
        }

/* Statistics Cards Section */
.stat-card {
    background-color: #ffffff;
    border: 1px solid #eaeaea;
    border-radius: 20px;
    padding: 40px 20px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    transition: all 0.3s ease;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.dark .stat-card {
    background-color: #111111;
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.stat-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
}

.dark .stat-card:hover {
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6);
}
/* Hero Float Animation */
@keyframes hero-float {
    0% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0); }
}
.animate-hero-float {
    animation: hero-float 6s ease-in-out infinite;
}