/**
 * Cross-browser motion & overlay fallbacks (Chrome, Firefox, Edge, Brave, Opera).
 * Loaded last — fixes color-mix / blend-mode gaps and prevents stuck hidden content.
 */

html {
    overflow-anchor: none;
}

/* ── color-mix fallbacks (Firefox < 113, older engines) ── */
@supports not (background: color-mix(in srgb, #00cff0 50%, transparent)) {
    .bn-bento__item:hover::before {
        background: linear-gradient(
            135deg,
            rgba(0, 207, 240, 0.42),
            rgba(0, 191, 255, 0.18),
            transparent 72%
        );
    }

    .bn-bento__item .pilot-aev-ic {
        border-color: rgba(125, 211, 252, 0.28);
    }

    .bn-bento__item:hover .pilot-aev-ic {
        border-color: rgba(125, 211, 252, 0.55);
    }
}

/* ── mix-blend-mode fallback ── */
@supports not (mix-blend-mode: soft-light) {
    .bn-cinematic .bn-stats-band__glow {
        mix-blend-mode: normal;
        opacity: 0.65;
    }

    .bn-cinematic .bn-hero::before {
        mix-blend-mode: normal;
        opacity: 0.28;
    }
}

/* ── Overlay pseudo-elements: always composited, never block clicks ── */
.bn-bento__item::after,
.bn-bento__glow,
.bn-stat-block::after,
.bn-hero-stats__item::after,
.bn-pill-card::after,
.bn-crew-card::after,
.bn-cinematic .bn-section::before,
.bn-cinematic .bn-hero::after,
.bn-cinematic .bn-cta::after,
.bn-cinematic .bn-home-news__item::after {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* ── Animations: opacity + transform only (never blocked as "tracking") ── */
.bn-bento__item,
.bn-stat-block,
.bn-pill-card,
.bn-hero-stats__item,
.bn-crew-card,
.bn-home-news__item,
.bn-logo__img,
.pilot-aev-ic {
    will-change: auto;
}

.bn-bento__item:hover,
.bn-stat-block:hover,
.bn-pill-card:hover,
.bn-hero-stats__item:hover {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* ── Reduced motion: show everything, keep subtle hovers ── */
@media (prefers-reduced-motion: reduce) {
    .bn-reveal,
    .bn-cinematic-head,
    .bn-bento__item,
    .bn-stat-block,
    .bn-pill-card,
    .bn-crew-card,
    .bn-home-news__item,
    .bn-hero-stats__item,
    .bn-section-head,
    .bn-fleet-stage,
    [data-fleet-pick],
    .bn-cta__inner,
    .bn-split__content,
    .bn-split__media,
    .bn-ladder__step,
    .bn-live-board,
    .bn-nav,
    .bn-hero__lead,
    .bn-hero__actions,
    .bn-hero__visual,
    .bn-flight-card {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        filter: none !important;
        animation: none !important;
    }

    .bn-bento__item:hover .pilot-aev-ic,
    .bn-stat-block:hover .pilot-aev-ic {
        animation: none !important;
    }

    .bn-stats-band__glow {
        animation: none !important;
    }
}

/* ── Safety class when JS detects stuck hidden layers ── */
.bn-cinematic.bn-motion-safe .bn-reveal,
.bn-cinematic.bn-motion-safe .bn-cinematic-head,
.bn-cinematic.bn-motion-safe .bn-bento__item,
.bn-cinematic.bn-motion-safe .bn-stat-block,
.bn-cinematic.bn-motion-safe .bn-pill-card,
.bn-cinematic.bn-motion-safe .bn-crew-card,
.bn-cinematic.bn-motion-safe .bn-home-news__item,
.bn-cinematic.bn-motion-safe .bn-hero-stats__item,
.bn-cinematic.bn-motion-safe .bn-section-head,
.bn-cinematic.bn-motion-safe .bn-fleet-stage,
.bn-cinematic.bn-motion-safe [data-fleet-pick],
.bn-cinematic.bn-motion-safe .bn-cta__inner,
.bn-cinematic.bn-motion-safe .bn-split__content,
.bn-cinematic.bn-motion-safe .bn-split__media,
.bn-cinematic.bn-motion-safe .bn-ladder__step,
.bn-cinematic.bn-motion-safe .bn-live-board,
.bn-cinematic.bn-motion-safe .bn-contact__info,
.bn-cinematic.bn-motion-safe .bn-contact__form,
.bn-cinematic.bn-motion-safe .bn-nav,
.bn-cinematic.bn-motion-safe .bn-hero__lead,
.bn-cinematic.bn-motion-safe .bn-hero__actions,
.bn-cinematic.bn-motion-safe .bn-flight-card,
.bn-cinematic.bn-motion-safe .bn-hero__visual {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    filter: none !important;
}

.bn-cinematic.bn-motion-safe .bn-gradient-text {
    opacity: 1 !important;
    -webkit-text-fill-color: transparent;
}

/* ── Section / hero overlays: visible once cinematic bootstraps ── */
.bn-cinematic.bn-cinematic-ready .bn-section::before {
    opacity: 1;
}

/* ── backdrop-filter fallbacks (Firefox privacy / older Chromium) ── */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .bn-nav__bar,
    .bn-nav__inner,
    .bn-flight-card,
    .bn-pill,
    .bn-stat-block,
    .bn-hero-stats__item {
        background-color: rgba(8, 16, 32, 0.92);
    }
}

/* ── Infinite ambient overlays: keep visible without blend-mode ── */
.bn-stats-band__glow,
.bn-cinematic .bn-cta::after {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* ── Scroll reveals: hidden until .is-visible (CSS-only motion path) ── */
.bn-cinematic .bn-reveal:not(.is-visible),
.bn-cinematic .bn-cinematic-head:not(.is-visible) {
    opacity: 0;
    visibility: visible;
}

.bn-cinematic .bn-reveal.is-visible,
.bn-cinematic .bn-cinematic-head.is-visible {
    opacity: 1;
}
