.gradient-text {
            /* Fallback for older browsers */
            color: #CF2E2E;
            /* Gradient Background */
            background-image: linear-gradient(to right, #FF2C5D, #FF5C3A, #FFB820);
            /* Clipping the background to the text */
            -webkit-background-clip: text;
            background-clip: text;
            /* Making the text color transparent to reveal the gradient */
            color: transparent;
        }
        body {
            font-family: 'Inter', sans-serif;
            scroll-padding-top: 100px;
        }

        .header-gradient {
            background-image: linear-gradient(to right, #FF2C5D, #FF5C3A, #FFB820);
            
        }

        @keyframes gradientBG {
            0% {
                background-position: 0% 50%;
            }

            50% {
                background-position: 100% 50%;
            }

            100% {
                background-position: 0% 50%;
            }
        }

        /* --- NEW: Subtle Gradient Background --- */
        .subtle-gradient-bg {
            position: relative;
            overflow: hidden; /* Ensures the pseudo-element doesn't spill out */
        }

        .subtle-gradient-bg::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            /* Using the EXACT same gradient as the header */
            background-image: linear-gradient(to right, #FF2C5D, #FF5C3A, #FFB820);
            background-size: 300% 300%;
            animation: gradientBG 15s ease infinite; /* Slower animation */
            opacity: 0.15; /* This makes it subtle. Adjust from 0.1 to 0.3 for desired effect */
            z-index: 1;
        }

        /* This ensures the content (div, h2, p, etc.) sits on TOP of the gradient */
        .subtle-gradient-bg > * {
            position: relative;
            z-index: 2;
        }


        /* --- Enhanced Scroll Animation --- */
        .fade-in-scale-up {
            opacity: 0;
            transform: translateY(30px) scale(0.95);
            transition: opacity 0.7s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
        }

        .is-visible {
            opacity: 1;
            transform: translateY(0) scale(1);
        }

        /* --- Nav Link Animation --- */
        .nav-link {
            position: relative;
            padding-bottom: 6px;
        }

        .nav-link::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 2px;
            background-color: white;
            transform: scaleX(0);
            transform-origin: right;
            transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
        }

        .nav-link:hover::after {
            transform: scaleX(1);
            transform-origin: left;
        }

        /* --- Gallery Hover Effect --- */
        .gallery-item .overlay {
            opacity: 0;
            transition: opacity 0.4s cubic-bezier(0.23, 1, 0.32, 1);
        }

        .gallery-item:hover .overlay {
            opacity: 1;
        }

        .gallery-item .caption {
            transform: translateY(15px);
            opacity: 0;
            transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0.1s;
        }

        .gallery-item:hover .caption {
            transform: translateY(0);
            opacity: 1;
        }

        .gallery-item img {
            transition: transform 0.5s cubic-bezier(0.25, 0.8, 0.25, 1);
        }

        .gallery-item:hover img {
            transform: scale(1.1) rotate(2deg);
        }

        /* --- Cursor Click Wave Effect --- */
        .click-wave {
            position: fixed;
            width: 150px;
            height: 150px;
            border-radius: 50%;
            background: radial-gradient(circle, transparent 30%, rgba(252, 185, 0, 0.7) 45%, rgba(255, 105, 0, 0.5) 65%, rgba(207, 46, 46, 0.3) 85%, transparent 100%);
            transform: translate(-50%, -50%) scale(0);
            animation: wave-effect 0.6s ease-out;
            pointer-events: none;
            z-index: 9999;
        }

        @keyframes wave-effect {
            from {
                transform: translate(-50%, -50%) scale(0);
                opacity: 1;
            }

            to {
                transform: translate(-50%, -50%) scale(1);
                opacity: 0;
            }
        }

        /* --- Custom Video Poster Styles --- */
        .video-poster-bg {
            background-image: linear-gradient(to right, #FF2C5D, #FF5C3A, #FFB820);
            transition: opacity 0.3s ease-out;
        }