:root {
            --primary-dark-blue: 18, 23, 67;  /* #121743 */
            --accent-orange: 246, 159, 29;    /* #F69F1D */
            --white: 255, 255, 255;
            --company-orange: 246, 159, 29;  /* #F69F1D */
            --company-navy: 18, 23, 67;      /* #121743 */
        }

        @keyframes float {
            0% { transform: translateY(0px); }
            50% { transform: translateY(-10px); }
            100% { transform: translateY(0px); }
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes fadeOut {
            from { opacity: 1; transform: translateY(0); }
            to { opacity: 0; transform: translateY(-20px); }
        }

        .animate-float { animation: float 3s ease-in-out infinite; }
        .fade-in { animation: fadeIn 0.5s ease-out forwards; }
        .fade-out { animation: fadeOut 0.5s ease-out forwards; }
        .text-shadow-lg { text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }

        .hero-gradient {
            background: linear-gradient(90deg, rgb(var(--primary-dark-blue)), rgb(var(--accent-orange)));
            border-bottom: 3px solid rgb(var(--accent-orange));
        }

        .bg-gradient-light {
            background: linear-gradient(135deg, rgba(246, 159, 29, 0.1) 0%, rgba(18, 23, 67, 0.1) 100%);
        }

        
        

                /* Enhanced smooth rotating text animations - replaces your existing .rotating-text styles */
        .rotating-text-container {
            min-height: 4rem;
            position: relative;
            overflow: hidden; /* Prevents text from showing outside during animations */
        }

        .rotating-text {
            position: absolute;
            width: 100%;
            opacity: 0;
            transform: translateY(30px) scale(0.95);
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .rotating-text.active {
            opacity: 1;
            transform: translateY(0) scale(1);
        }

        .rotating-text.entering {
            animation: smoothSlideIn 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        }

        .rotating-text.exiting {
            animation: smoothSlideOut 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        }

        @keyframes smoothSlideIn {
            0% {
                opacity: 0;
                transform: translateY(40px) scale(0.9);
                filter: blur(2px);
            }
            50% {
                opacity: 0.7;
                transform: translateY(10px) scale(0.98);
                filter: blur(1px);
            }
            100% {
                opacity: 1;
                transform: translateY(0) scale(1);
                filter: blur(0);
            }
        }

        @keyframes smoothSlideOut {
            0% {
                opacity: 1;
                transform: translateY(0) scale(1);
                filter: blur(0);
            }
            50% {
                opacity: 0.3;
                transform: translateY(-20px) scale(1.02);
                filter: blur(1px);
            }
            100% {
                opacity: 0;
                transform: translateY(-40px) scale(1.05);
                filter: blur(2px);
            }
        }
        
        .feature-card {
            transition: all 0.3s ease;
        }
        
        .feature-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
        }
        
        .btn-primary {
            background: rgb(var(--company-orange));
            color: white;
            font-weight: bold;
            padding: 0.75rem 1.5rem;
            border-radius: 0.5rem;
            transition: all 0.3s ease;
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
        }
        
        .btn-primary:hover {
            background: rgba(var(--company-orange), 0.9);
            transform: translateY(-2px);
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
        }
        
        .btn-outline {
            background: transparent;
            color: white;
            border: 2px solid white;
            font-weight: bold;
            padding: 0.75rem 1.5rem;
            border-radius: 0.5rem;
            transition: all 0.3s ease;
        }
        
        .btn-outline:hover {
            background: rgb(var(--company-orange));
            color: white;
        }
        
        /* Header styling */
        .header-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            background: rgba(240, 240, 240, 0.95);
            backdrop-filter: blur(10px);
            z-index: 1000;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }
        
        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 4rem;
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 1rem;
        }
        
        .logo-container {
            display: flex;
            align-items: center;
            gap: 0.75rem;
        }
        
        .logo {
            height: 2.5rem;
            width: auto;
            filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2));
        }


        .payment-card {
            transition: all 0.3s ease;
        }
        
        .payment-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
        }
       .privacy-guarantee {
            background: linear-gradient(135deg, rgba(18, 23, 67, 0.05) 0%, rgba(246, 159, 29, 0.05) 100%);
            border-left: 4px solid rgb(var(--company-orange));
        }

        .testimonial-card {
            background: white;
            border-radius: 12px;
            padding: 1.5rem;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
        }

        .testimonial-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
        }