/* Page dark theme base */
body.page-dark {
    background-color: #020B12 !important;
    overflow-x: hidden;
}

/* Star layers - fixed viewport overlay, shifted via JS on scroll */
.stars, .stars-md, .stars-lg {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.stars {
    background-image:
        radial-gradient(1px 1px at 50px 80px, rgba(255,255,255,0.4), transparent),
        radial-gradient(1px 1px at 180px 150px, rgba(255,255,255,0.35), transparent),
        radial-gradient(1px 1px at 320px 60px, rgba(255,255,255,0.3), transparent),
        radial-gradient(1px 1px at 470px 200px, rgba(255,255,255,0.45), transparent),
        radial-gradient(1px 1px at 100px 300px, rgba(255,255,255,0.3), transparent),
        radial-gradient(1px 1px at 250px 420px, rgba(255,255,255,0.4), transparent),
        radial-gradient(1px 1px at 600px 100px, rgba(255,255,255,0.35), transparent),
        radial-gradient(1px 1px at 750px 350px, rgba(255,255,255,0.3), transparent),
        radial-gradient(1px 1px at 400px 500px, rgba(255,255,255,0.4), transparent),
        radial-gradient(1px 1px at 550px 250px, rgba(255,255,255,0.35), transparent);
    background-size: 800px 600px;
    background-repeat: repeat;
}
.stars-md {
    background-image:
        radial-gradient(1.5px 1.5px at 120px 200px, rgba(255,255,255,0.35), transparent),
        radial-gradient(1.5px 1.5px at 350px 380px, rgba(255,255,255,0.3), transparent),
        radial-gradient(1.5px 1.5px at 520px 120px, rgba(255,255,255,0.4), transparent),
        radial-gradient(1.5px 1.5px at 680px 450px, rgba(255,255,255,0.3), transparent),
        radial-gradient(1.5px 1.5px at 200px 550px, rgba(255,255,255,0.35), transparent),
        radial-gradient(1.5px 1.5px at 450px 50px, rgba(255,255,255,0.4), transparent),
        radial-gradient(1.5px 1.5px at 80px 480px, rgba(255,255,255,0.3), transparent),
        radial-gradient(1.5px 1.5px at 900px 280px, rgba(255,255,255,0.35), transparent);
    background-size: 1000px 700px;
    background-repeat: repeat;
}
.stars-lg {
    background-image:
        radial-gradient(2px 2px at 300px 150px, rgba(255,255,255,0.5), transparent),
        radial-gradient(2px 2px at 700px 400px, rgba(255,255,255,0.45), transparent),
        radial-gradient(2px 2px at 150px 600px, rgba(255,255,255,0.4), transparent),
        radial-gradient(2px 2px at 500px 300px, rgba(255,255,255,0.5), transparent),
        radial-gradient(2px 2px at 900px 100px, rgba(255,255,255,0.45), transparent);
    background-size: 1200px 800px;
    background-repeat: repeat;
}
body.page-dark > *:not(.stars):not(.stars-md):not(.stars-lg):not(.navbar-overlay) {
    position: relative;
    z-index: 1;
}

/* Keep navbar dark-themed when scrolled (override sticky white bg) */
body.page-dark .navbar-overlay {
    transition: background-color 0.3s ease, backdrop-filter 0.3s ease;
}

body.page-dark.navbar-sticky-init .navbar-overlay,
body.page-dark:not(.navbar-sticky-init) .navbar-overlay:has(.contain-mega-menu:hover) {
    background-color: rgba(2, 11, 18, 0.95) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
    transition: background-color 0.3s ease, backdrop-filter 0.3s ease;
}
body.page-dark.navbar-sticky-init .navbar-1 .nav-link {
    color: #fff !important;
}
body.page-dark.navbar-sticky-init .navbar-1 .nav-link.active {
    color: #fff !important;
}
body.page-dark.navbar-sticky-init .navbar .logo__img {
    display: block !important;
}
body.page-dark.navbar-sticky-init .btn-dark {
    color: #fff !important;
}

/* Dark mega menu dropdown */
body.page-dark .contain-mega-menu__content {
    background-color: #0b1a24 !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
}
body.page-dark .contain-mega-menu__list {
    background-color: transparent !important;
}
body.page-dark .contain-mega-menu__link:hover,
body.page-dark .contain-mega-menu__list li:hover > .contain-mega-menu__link {
    background-color: rgba(255, 255, 255, 0.05) !important;
}
body.page-dark .contain-mega-menu__title {
    color: #fff;
}
body.page-dark .contain-mega-menu__description {
    color: rgba(179, 182, 184, 0.85);
}
body.page-dark .contain-mega-menu__content .h5,
body.page-dark .contain-mega-menu__content h5,
body.page-dark .contain-mega-menu__content span.h5 {
    color: #fff;
}
body.page-dark .contain-mega-menu__content .fw-medium {
    color: rgba(179, 182, 184, 0.85);
}
body.page-dark .contain-mega-menu__content .bg-primary.bg-opacity-5 {
    background-color: rgba(255, 255, 255, 0.04) !important;
}
body.page-dark .contain-mega-menu:hover > .nav-link {
    color: #B3FC6A !important;
}

/* Smooth cross-page view transitions */
@view-transition {
    navigation: auto;
}
::view-transition-old(root) {
    animation: fade-out 0.15s ease-in forwards;
}
::view-transition-new(root) {
    animation: fade-in 0.15s ease-out forwards;
}
@keyframes fade-out {
    from { opacity: 1; }
    to { opacity: 0; }
}
@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}