/* ... existing styles ... */

/* Theme Variables - Updated for Toggling */
:root {
    --bg-color: #000000;
    --text-primary: #ffffff;
    --text-secondary: #a1a1a1;
    --accent-blue: #00a8ff;
    /* New Electric Blue */
    --accent-glow: rgba(0, 168, 255, 0.15);
    /* Reduced glow opacity */
    --card-bg: #0a0a0a;
    --card-hover: #111111;
    --border-color: #333333;
    --feature-bg: rgba(255, 255, 255, 0.02);
    --feature-hover: rgba(255, 255, 255, 0.05);
    /* Reverted to white hover for subtle look */
    /* Blue tint on hover */
    --particle-color: #333333;
    /* Reverted to grey particles */
    --glass-bg: rgba(0, 0, 0, 0.8);
    --font-primary: 'Poppins', sans-serif;
    --transition-speed: 0.3s;
}

[data-theme="light"] {
    --bg-color: #f4f6f8;
    --text-primary: #121212;
    --text-secondary: #555555;
    --card-bg: #ffffff;
    --card-hover: #ffffff;
    --border-color: #e0e0e0;
    --feature-bg: #ffffff;
    --feature-hover: #ffffff;
    /* We'll rely on shadow for light mode hover */
    --particle-color: #cccccc;
    --glass-bg: rgba(255, 255, 255, 0.85);
}

/* Light mode specific overrides */
[data-theme="light"] .company-card {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

[data-theme="light"] .company-card:hover {
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
    border-color: var(--border-color);
    /* Keep border subtle */
}

/* Fix logo visibility in light mode */
[data-theme="light"] .invert-white {
    filter: none !important;
    /* Don't invert in light mode (assuming logos work on white) 
                               Wait, original logos are for white bg? User said "transparent backgrounds... logo size is very low". 
                               If they are black text on transparent, they work on white. 
                               But if they were needing invert for dark mode, they are likely dark logos? 
                               Actually user said "luxn it logo has luxn part in black". So yes, originally dark.
                               So in Light Mode: simple remove filter. 
                               EXCEPTION: The Main Header Logo (placeholder white one?)
                            */
}

/* But main header logo is fixed image URL which is "luxn-lg-white". */
[data-theme="light"] .main-logo,
[data-theme="light"] .hero-logo,
[data-theme="light"] .footer-logo {
    filter: invert(1);
    -webkit-filter: invert(1);
    /* Invert the white logo to black for light mode */
}

/* Navbar Theme Toggle */
.theme-toggle-btn {
    background: transparent;
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s;
    margin-left: 1rem;
    position: relative;
    overflow: hidden;
}

.theme-toggle-btn:hover {
    background: var(--text-primary);
    color: var(--bg-color);
}

.theme-toggle-btn .icon-sun,
.theme-toggle-btn .icon-moon {
    position: absolute;
    transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.5s;
    font-size: 1.2rem;
}

[data-theme="dark"] .icon-sun {
    transform: translateY(150%);
    opacity: 0;
}

[data-theme="dark"] .icon-moon {
    transform: translateY(0);
    opacity: 1;
}

[data-theme="light"] .icon-sun {
    transform: translateY(0);
    opacity: 1;
}

[data-theme="light"] .icon-moon {
    transform: translateY(-150%);
    opacity: 0;
}

/* Enhanced Animations */
@keyframes float {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0px);
    }
}

.feature-item {
    /* ... existing ... */
    transition: transform 0.3s, background 0.3s;
}

.feature-item:hover {
    transform: translateY(-5px);
}

.hero-logo-wrapper {
    animation: float 6s ease-in-out infinite;
}

/* Glassmorphism for Company Cards */
.company-card {
    /* ... existing ... */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    /* For dark mode, maybe a slight transparency if desired, sticking to current solid for contrast per request but adding subtle border glow */
}

/* Parallax/Advanced Effects */
.particles {
    opacity: 0.3;
    /* Increased visibility slightly */
}

/* Button Theme Smoothing (Removed Glare) */
.btn {
    position: relative;
    overflow: hidden;
}