/**
 * Hero Component - Light Mode Overrides
 * Comprehensive light mode styling for all hero components
 */

/* ========================================
   LIGHT MODE - HERO SECTION BASE
   ======================================== */

[data-theme="light"] .hero-section:not(:has(.hero-background img)):not(:has(.hero-background video)):not(.has-admin-media) {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 50%, #cbd5e1 100%);
    color: #111827;
}

[data-theme="light"] .hero-section.hero-minimal {
    background: linear-gradient(135deg, #ffffff 0%, #f3f4f6 100%);
}

[data-theme="light"] .hero-section.hero-architect {
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
}

[data-theme="light"] .hero-section.hero-professional {
    background: linear-gradient(135deg, #ffffff 0%, #f3f4f6 100%);
}

/* ========================================
   LIGHT MODE - HERO BACKGROUND
   ======================================== */

[data-theme="light"] .hero-background-overlay {
    background: linear-gradient(135deg, rgba(248, 250, 252, 0.75) 0%, rgba(226, 232, 240, 0.65) 50%, rgba(203, 213, 225, 0.7) 100%);
}

[data-theme="light"] .hero-background-image {
    opacity: 0.45;
    filter: brightness(1.1) contrast(1.05);
}

[data-theme="light"] .hero-background-pattern {
    opacity: 0.05;
    background-image:
        linear-gradient(rgba(14, 165, 233, 0.1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(14, 165, 233, 0.1) 1px, transparent 1px);
}

/* ========================================
   LIGHT MODE - HERO CONTENT
   ======================================== */

[data-theme="light"] .hero-title {
    background: linear-gradient(135deg, #111827 0%, #0ea5e9 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="light"] .hero-subtitle {
    color: #4b5563;
}

[data-theme="light"] .hero-description {
    color: #6b7280;
}

/* ========================================
   LIGHT MODE - HERO LOGO
   ======================================== */

[data-theme="light"] .hero-logo {
    filter: drop-shadow(0 0 30px rgba(14, 165, 233, 0.3));
}

/* ========================================
   LIGHT MODE - HERO CTA BUTTONS
   ======================================== */

[data-theme="light"] .hero-cta-primary {
    background: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 100%);
    color: white;
    box-shadow: 0 10px 30px rgba(14, 165, 233, 0.4);
}

[data-theme="light"] .hero-cta-primary:hover {
    box-shadow: 0 15px 40px rgba(14, 165, 233, 0.6);
}

[data-theme="light"] .hero-cta-secondary {
    background: white;
    color: #0ea5e9;
    border: 2px solid #0ea5e9;
}

[data-theme="light"] .hero-cta-secondary:hover {
    border-color: #0284c7;
    background: rgba(14, 165, 233, 0.1);
    color: #0284c7;
}

/* ========================================
   LIGHT MODE - HERO SCROLL INDICATOR
   ======================================== */

[data-theme="light"] .hero-scroll-icon {
    border-color: rgba(14, 165, 233, 0.5);
    background: rgba(255, 255, 255, 0.8);
}

[data-theme="light"] .hero-scroll-icon:hover {
    border-color: #0ea5e9;
}

[data-theme="light"] .hero-scroll-icon::before {
    background: #0ea5e9;
}

/* ========================================
   LIGHT MODE - HERO EFFECTS
   ======================================== */

[data-theme="light"] .hero-glow {
    text-shadow: 0 0 15px rgba(14, 165, 233, 0.3);
    color: #0ea5e9;
}

[data-theme="light"] .hero-glow-strong {
    text-shadow:
        0 0 15px rgba(14, 165, 233, 0.5),
        0 0 30px rgba(14, 165, 233, 0.3),
        0 0 45px rgba(14, 165, 233, 0.2);
    color: #0ea5e9;
}