
        /* Custom subtle gradients for visual depth */
        .hero-radial {
            background: radial-gradient(circle at 50% 50%, rgba(223, 186, 88, 0.12) 0%, transparent 60%);
        }
        .gradient-solar {
            background: linear-gradient(135deg, #FAF8F2 0%, #F5ECDB 100%);
        }
        .gradient-cosmetic {
            background: linear-gradient(135deg, #FAF8F2 0%, #EBC76B/20 100%);
        }
        .btn-premium-gold {
            background-color: #DFBA58;
            color: #060a13;
            transition: all 0.3s ease;
        }
        .btn-premium-gold:hover {
            background-color: #C29C3E;
            box-shadow: 0 10px 20px rgba(223, 186, 88, 0.3);
        }

        /* Gentle Premium Floating Loader Effect */
        @keyframes float-gentle {
            0%, 100% { transform: translateY(0px) scale(1); }
            50% { transform: translateY(-10px) scale(1.02); }
        }
        .animate-float {
            animation: float-gentle 4s ease-in-out infinite;
        }

        /* Scroll Reveal Base Animations */
        .reveal {
            opacity: 0;
            transform: translateY(35px);
            transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1);
            will-change: transform, opacity;
        }
        .reveal.active {
            opacity: 1;
            transform: translateY(0);
        }
        
        .reveal-left {
            opacity: 0;
            transform: translateX(-35px);
            transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1);
            will-change: transform, opacity;
        }
        .reveal-left.active {
            opacity: 1;
            transform: translateX(0);
        }
        
        .reveal-right {
            opacity: 0;
            transform: translateX(35px);
            transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1);
            will-change: transform, opacity;
        }
        .reveal-right.active {
            opacity: 1;
            transform: translateX(0);
        }

        /* Dynamic Delay helpers for Staggered surfing effects */
        .delay-100 { transition-delay: 100ms !important; }
        .delay-200 { transition-delay: 200ms !important; }
        .delay-300 { transition-delay: 300ms !important; }
        .delay-400 { transition-delay: 400ms !important; }
        .delay-500 { transition-delay: 500ms !important; }
  