/* CINEMATIC POLISH PACK - AWARD WINNING UPGRADES */

/* 1. GLOBAL FILM GRAIN (Texture) */
.lex-film-grain {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    pointer-events: none;
    z-index: 50;
    opacity: 0.015; /* Reduced from 0.03 to reduce fuzziness */
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='1'/%3E%3C/svg%3E");
}

/* 2. VOLUMETRIC NEBULA (Atmosphere) */
/* Floating colored lights behind the engine */
.lex-nebula-container {
    display: none; /* Hide standard nebula for neural bg */
}

/* New: Neural Background Integration */
.lex-neural-integration {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 0;
    pointer-events: none;
    opacity: 0.6; /* Adjust intensity of neurons */
}

/* 3. TEXT REVEAL ANIMATIONS (Entrance) */
.lex-eyebrow { animation: fadeSlideUp 0.8s ease-out 0.2s backwards; }
.lex-h1 { animation: fadeSlideUp 0.8s ease-out 0.4s backwards; }
.lex-subtext { animation: fadeSlideUp 0.8s ease-out 0.6s backwards; }
.lex-step-block > div:last-child { animation: fadeSlideUp 0.8s ease-out 0.8s backwards; } /* Buttons */
.lex-scroll-indicator { animation: fadeIn 1s ease-out 1.5s backwards; }

@keyframes fadeSlideUp {
    0% { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
    0% { opacity: 0; }
    50% { opacity: 0.5; } /* Match default opacity */
    100% { opacity: 0.5; }
}

/* 4. ENHANCED GLASS BORDER (Center Canvas) */
/* Add a subtle shimmering border to the telemetry canvas */
.lex-telemetry-canvas::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 12px;
    padding: 1px; /* Border width */
    background: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.05) 40%, rgba(255,255,255,0) 60%, rgba(255,255,255,0.1));
    -webkit-mask: 
       linear-gradient(#fff 0 0) content-box, 
       linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

/* 5. ENGINE MICRO-DETAILS */
/* Add a subtle scanning line over the whole engine */
.lex-loop-ring::after {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, transparent 40%, rgba(255, 255, 255, 0.03) 50%, transparent 60%);
    background-size: 100% 200%;
    border-radius: 50%;
    animation: globalScan 8s linear infinite;
    pointer-events: none;
    z-index: 5;
}

@keyframes globalScan {
    0% { background-position: 0% -100%; }
    100% { background-position: 0% 200%; }
}

/* 6. RESPONSIVE TYPOGRAPHY TWEAK */
/* Ensure H1 looks amazing on large screens too */
@media (min-width: 1600px) {
    .lex-h1 { font-size: 96px; }
}