/* =========================================
           HERO SECTION: SEO (CHARCOAL & RED FIX)
           ========================================= */
        .seo-hero-section {
            position: relative;
            background: linear-gradient(135deg, #000000 0%, #4a4244 100%) !important; /* Charcoal/Black */
            overflow: hidden;
            padding: 80px 0; /* Reduced padding */
            color: #fff;
            min-height: 80vh; /* Reduced height */
            display: flex;
            align-items: center;
        }

        /* Animated Particles Background */
        .particles-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 0; pointer-events: none; }
        .particle { position: absolute; width: 4px; height: 4px; background: rgba(235, 30, 36, 0.4); /* Red particles */ border-radius: 50%; animation: floatParticle 15s infinite linear; }
        .p1 { top: 10%; left: 10%; animation-duration: 12s; width: 6px; height: 6px; opacity: 0.5; }
        .p2 { top: 20%; left: 80%; animation-duration: 18s; background: rgba(255,255,255,0.2); }
        .p3 { top: 80%; left: 15%; animation-duration: 22s; width: 3px; height: 3px; }
        .p4 { top: 70%; left: 70%; animation-duration: 14s; background: rgba(235, 30, 36, 0.6); }
        .p5 { top: 40%; left: 40%; animation-duration: 25s; width: 2px; height: 2px; }
        
        @keyframes floatParticle { 
            0% { transform: translateY(0) translateX(0); opacity: 0; } 
            50% { opacity: 1; } 
            100% { transform: translateY(-100px) translateX(50px); opacity: 0; } 
        }
        
        /* Ambient Glow Orb (Red Glow) */
        .glow-orb { position: absolute; width: 600px; height: 600px; background: radial-gradient(circle, rgba(235, 30, 36, 0.2) 0%, transparent 70%); border-radius: 50%; top: -100px; right: -100px; z-index: 0; animation: pulseOrb 10s infinite alternate; }
        @keyframes pulseOrb { from { transform: scale(1); opacity: 0.5; } to { transform: scale(1.2); opacity: 0.8; } }

        /* Left Content Styling */
        .seo-hero-content { position: relative; z-index: 2; padding-right: 20px; }
        
        .seo-badge { 
            background: rgba(255, 255, 255, 0.1); 
            border: 1px solid rgba(235, 30, 36, 0.5); /* Red Border */
            color: var(--secondary-color); /* Red Text */
            padding: 8px 16px; border-radius: 50px; font-size: 12px; font-weight: 700; 
            text-transform: uppercase; letter-spacing: 1.5px; display: inline-flex; align-items: center; gap: 8px; margin-bottom: 25px; 
        }
        
        .seo-hero-content h1 { font-size: 3.5rem; font-weight: 800; line-height: 1.2; margin-bottom: 20px; }
        
        .gold-text { 
            background: linear-gradient(135deg, #ff4d4d 0%, #eb1e24 100%); /* Red Gradient */
            -webkit-background-clip: text; -webkit-text-fill-color: transparent; 
        }
        
        .seo-hero-content p { font-size: 1.2rem; color: rgba(255,255,255,0.8); margin-bottom: 35px; max-width: 550px; }

        /* =========================================
           SEARCH SIMULATOR STYLES
           ========================================= */
        .search-simulator-wrapper { position: relative; z-index: 5; padding: 20px; }
        
        /* Browser Window Frame */
        .browser-window { 
            background: rgba(255, 255, 255, 0.05); 
            backdrop-filter: blur(20px); 
            border: 1px solid rgba(255, 255, 255, 0.15); 
            border-radius: 24px; 
            box-shadow: 0 30px 60px rgba(0,0,0,0.6); 
            padding: 40px; 
            transform: translateY(0); 
            position: relative; 
            animation: floatBrowser 6s ease-in-out infinite; 
        }
        @keyframes floatBrowser { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }

        /* Simulated Search Bar */
        .sim-search-bar { background: #fff; border-radius: 50px; padding: 12px 25px; display: flex; align-items: center; box-shadow: 0 5px 20px rgba(0,0,0,0.2); margin-bottom: 30px; position: relative; }
        .sim-search-icon { color: #999; margin-right: 15px; font-size: 18px; }
        .sim-input-text { color: #333; font-size: 16px; font-weight: 500; border-right: 2px solid var(--secondary-color); white-space: nowrap; overflow: hidden; width: 0; }
        
        .cursor-blink { animation: blinkCursor 0.7s infinite; }
        @keyframes blinkCursor { 0%, 100% { border-color: var(--secondary-color); } 50% { border-color: transparent; } }
        
        .sim-search-btn { background: #4285F4; color: #fff; width: 35px; height: 35px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-left: auto; font-size: 14px; transition: 0.3s; }
        .sim-search-btn.active { transform: scale(0.9); background: #3367d6; }

        /* Results List */
        .sim-results-list { display: flex; flex-direction: column; gap: 15px; min-height: 250px; position: relative; }
        
        /* Generic Result Card */
        .sim-result-card { background: rgba(255,255,255,0.08); border-radius: 12px; padding: 15px 20px; display: flex; flex-direction: column; gap: 5px; opacity: 0; transform: translateY(10px); transition: all 0.5s ease; }
        .sim-result-card.visible { opacity: 1; transform: translateY(0); }
        .sim-res-title { height: 12px; width: 60%; background: rgba(255,255,255,0.3); border-radius: 4px; }
        .sim-res-desc { height: 8px; width: 90%; background: rgba(255,255,255,0.1); border-radius: 4px; }
        .sim-res-desc-2 { height: 8px; width: 70%; background: rgba(255,255,255,0.1); border-radius: 4px; }

        /* The Winner Card (Client Site) */
        .sim-result-card.winner { 
            background: #fff; 
            border-left: 5px solid var(--secondary-color); /* Red edge */
            box-shadow: 0 15px 40px rgba(0,0,0,0.3); 
            position: absolute; 
            width: 90%; 
            left: 50%; 
            transform: translateX(-50%) scale(1);
            top: 220px; 
            z-index: 10; 
            opacity: 0; 
            transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1.275); 
        }
        
        .sim-result-card.winner.climb { 
            top: 20px; 
            opacity: 1; 
            transform: translateX(-50%) scale(1.05); 
        }
        
        .winner-content { display: flex; align-items: center; justify-content: space-between; }
        .winner-text h4 { margin: 0; font-size: 16px; font-weight: 700; color: var(--primary-color); }
        .winner-text span { font-size: 12px; color: #28a745; font-weight: 600; }
        .rank-badge { 
            background: var(--secondary-color); /* Red badge */
            color: #fff; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 18px; box-shadow: 0 5px 15px rgba(235, 30, 36, 0.4); animation: pulseBadge 2s infinite; 
        }
        @keyframes pulseBadge { 0% { box-shadow: 0 0 0 0 rgba(235, 30, 36, 0.7); } 70% { box-shadow: 0 0 0 10px rgba(235, 30, 36, 0); } 100% { box-shadow: 0 0 0 0 rgba(235, 30, 36, 0); } }

        /* Floating Stat Pills */
        .float-stat { position: absolute; background: rgba(20, 20, 20, 0.8); backdrop-filter: blur(12px); padding: 12px 24px; border-radius: 50px; border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: 0 15px 35px rgba(0,0,0,0.3); color: #fff; display: flex; align-items: center; gap: 15px; z-index: 20; animation: floatPill 5s infinite ease-in-out; min-width: 180px; }
        .stat-icon { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; }
        .stat-info { display: flex; flex-direction: column; line-height: 1.2; }
        .stat-label { font-size: 10px; text-transform: uppercase; color: rgba(255,255,255,0.6); letter-spacing: 1px; }
        .stat-value { font-size: 16px; font-weight: 700; color: #fff; }
        
        .fs-1 { top: -20px; right: -60px; border-left: 3px solid var(--secondary-color); animation-delay: 0s; }
        .fs-1 .stat-icon { background: linear-gradient(135deg, #eb1e24 0%, #ff4d4d 100%); color: #fff; }
        .fs-1 .stat-value { color: #ff4d4d; }
        
        .fs-2 { bottom: 15%; left: -60px; border-left: 3px solid #28a745; animation-delay: 2.5s; }
        .fs-2 .stat-icon { background: linear-gradient(135deg, #28a745 0%, #1e7e34 100%); color: #fff; }
        .fs-2 .stat-value { color: #28a745; }
        
        @keyframes floatPill { 
            0%, 100% { transform: translateY(0); } 
            50% { transform: translateY(-12px); } 
        }

        /* ================================
           HERO CTA BUTTON UPGRADE
        ================================ */
        .seo-hero-content .btn {
            position: relative;
            overflow: hidden;
            transition: all 0.35s ease;
            font-weight: 700;
            letter-spacing: 0.3px;
            border-radius: 50px;
        }

        /* Primary Button – Red/Charcoal */
        .seo-hero-content .btn-light {
            background: linear-gradient(135deg, #ff4d4d, #eb1e24);
            color: #fff !important;
            border: none;
            box-shadow: 0 10px 30px rgba(235, 30, 36, 0.35);
        }

        .seo-hero-content .btn-light::before {
            content: ""; position: absolute; top: 0; left: -120%; width: 200%; height: 100%;
            background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,0.4), transparent 80%);
            transition: 0.6s ease;
        }
        .seo-hero-content .btn-light:hover::before { left: 100%; }
        .seo-hero-content .btn-light:hover { transform: translateY(-4px) scale(1.03); box-shadow: 0 20px 50px rgba(235, 30, 36, 0.55); }

        /* Secondary Button – Outline */
        .seo-hero-content .btn-outline-light { border: 2px solid rgba(255,255,255,0.4); background: rgba(255,255,255,0.05); backdrop-filter: blur(6px); }
        .seo-hero-content .btn-outline-light:hover { background: rgba(235, 30, 36, 0.15); border-color: #eb1e24; color: #ff4d4d !important; transform: translateY(-3px); box-shadow: 0 0 25px rgba(235, 30, 36, 0.4); }
        .seo-hero-content .btn:active { transform: scale(0.96); }

        /* Responsive Media Queries */
        @media (max-width: 991px) {
            .seo-hero-section {
                padding-top: 100px;
                padding-bottom: 80px;
                text-align: center;
                display: block; 
            }
            .seo-hero-content { padding-right: 0; margin-bottom: 60px; }
            .seo-hero-content h1 { font-size: 2.5rem; }
            .seo-hero-content p { margin: 0 auto 30px; }
            .d-flex.gap-3 { justify-content: center; }
            
            /* Simulator Mobile Adjustments */
            .search-simulator-wrapper { padding: 0; max-width: 450px; margin: 0 auto; }
            .fs-1 { top: -30px; right: 0; transform: scale(0.8); }
            .fs-2 { bottom: -30px; left: 0; transform: scale(0.8); }
            
            @keyframes floatPill { 
                0%, 100% { transform: translateY(0) scale(0.8); } 
                50% { transform: translateY(-10px) scale(0.8); } 
            }

            .browser-window { padding: 20px; }
            .sim-search-bar { padding: 8px 15px; margin-bottom: 20px; }
            .sim-input-text { font-size: 13px; }
            .sim-result-card.winner { width: 90%; }
            .seo-hero-content .btn { font-size: 14px; padding: 12px 22px; }
        }

        @media (max-width: 576px) {
            .seo-hero-content h1 { font-size: 2rem; }
            .float-stat { display: none; }
            .seo-hero-content .btn { font-size: 13px; padding: 10px 18px; }
            .seo-hero-content .btn i { font-size: 12px; }
        }