/* ==========================================================================
   PREMIUM ENTERPRISE DARK-CYBER THEME MAP & CONFIGURATION
   ========================================================================== */
:root {
    --bg-dark-core: #030712;
    --bg-dark-surface: #0b1329;
    --accent-red-glow: #c8102e;
    --accent-blue-glow: #1e40af;
    --text-primary: #f9fafb;
    --text-secondary: #9ca3af;
    --card-border-glow: rgba(255, 255, 255, 0.08);
}

/* 1. Global Background & Layout Utilities Overrides */
body, main, section {
    background-color: var(--bg-dark-core) !important;
    color: var(--text-primary) !important;
    transition: background-color 0.5s ease;
}

/* Forces global standard text elements to look bright and readable */
h1, h2, h3, h4, .text-navy {
    color: var(--text-primary) !important;
}
p {
    color: var(--text-secondary) !important;
}

/* 2. Persistent Universal Tailwind Color Intercepts (Fixes image_dc25e7.png) */
.text-\[\#001F3F\], 
[class*="text-[#001F3F]"],
h2.text-\[\#001F3F\],
div.text-\[\#001F3F\] {
    color: #ffffff !important;
}

.text-\[\#5F6B7A\],
[class*="text-[#5F6B7A]"] {
    color: #9ca3af !important;
    opacity: 0.9 !important;
}

/* Target specifics for the platform metrics panel */
#platform .grid div div,
#platform h2 {
    color: #ffffff !important;
}

/* 3. Tech Cyber-Grid Background Overlay Element */
.video-overlay {
    background: linear-gradient(180deg, rgba(3, 7, 18, 0.4) 0%, var(--bg-dark-core) 100%) !important;
}

section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
    background-size: 50px 50px;
    pointer-events: none;
    z-index: 1;
    opacity: 0.7;
}

/* 4. Ultra-Premium Glassmorphic Floating Cards Configuration */
.pillar-card, .service-card, .feature-card, .colo-card {
    background: rgba(11, 19, 41, 0.65) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid var(--card-border-glow) !important;
    border-radius: 16px !important;
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* High Animation Glowing Hover States */
.pillar-card:hover, .service-card:hover, .feature-card:hover, .colo-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    border-color: rgba(200, 16, 46, 0.5) !important;
    background: rgba(11, 19, 41, 0.85) !important;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.6), 
                0 0 30px rgba(200, 16, 46, 0.15) !important;
}

/* 5. Direct Deep Typography Contrast Enforcement inside Cards */
.pillar-card *, .service-card *, .feature-card *, .colo-card * {
    color: var(--text-primary);
}

.pillar-card h3, .service-card h3, .feature-card h3, .colo-card h3,
.pillar-card h2, .service-card h2, .feature-card h2, .colo-card h2 {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.pillar-card p, .service-card p, .feature-card p, .colo-card p {
    color: #9ca3af !important;
    opacity: 0.9 !important;
}

.pillar-card li, .service-card li, .feature-card li, .colo-card li {
    color: #e5e7eb !important;
}

.pillar-card span, .service-card span, .feature-card span, .colo-card span {
    color: #ff4d6d !important;
}

/* 6. Button Pulse-Glow Interaction Engine */
button.bg-\[\#C8102E\] {
    background: linear-gradient(135deg, #c8102e 0%, #9a0f25 100%) !important;
    box-shadow: 0 0 0 0 rgba(200, 16, 46, 0.4);
    animation: pulseGlow 3s infinite;
}

@keyframes pulseGlow {
    0% { box-shadow: 0 0 0 0 rgba(200, 16, 46, 0.5); }
    70% { box-shadow: 0 0 0 15px rgba(200, 16, 46, 0); }
    100% { box-shadow: 0 0 0 0 rgba(200, 16, 46, 0); }
}

/* 7. Keyframe Matrix for Static Elements Reveal */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-animate {
    opacity: 0;
    animation: fadeInUp 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.hero-animate:nth-child(1) { animation-delay: 0.2s; }
.hero-animate:nth-child(2) { animation-delay: 0.4s; }
.hero-animate:nth-child(3) { animation-delay: 0.6s; }

/* Dynamic Float for Partner Systems Logos */
.partner-logo {
    animation: floatLogo 6s ease-in-out infinite alternate;
}
.partner-logo:nth-child(2n) { animation-delay: 1.5s; }
.partner-logo:nth-child(3n) { animation-delay: 3s; }

@keyframes floatLogo {
    0% { transform: translateY(0px); }
    100% { transform: translateY(-6px); }
}

/* 8. Core Scroll Reveal Active States Framework (Fired by JS Script) */
.scroll-reveal-element {
    opacity: 0;
    transform: translateY(50px) scale(0.96);
    filter: blur(4px);
    transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1), 
                transform 1.2s cubic-bezier(0.16, 1, 0.3, 1),
                filter 1s ease !important;
}

.scroll-reveal-element.revealed {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0px);
}