/* Logo header — halo sur les yeux du PNG + faisceaux laser (sans overlay SVG) */

.ns-header-logo[data-stadium-eyes] {
    position: relative;
    overflow: visible;
}

.ns-header-logo[data-stadium-eyes] .ns-logo-plate {
    position: relative;
    display: inline-block;
    line-height: 0;
    overflow: visible;
}

/* Halo lumineux calé sur les yeux du PNG (pas de formes visibles au repos) */
.ns-header-logo[data-stadium-eyes] .ns-logo-plate::before,
.ns-header-logo[data-stadium-eyes] .ns-logo-plate::after {
    content: '';
    position: absolute;
    z-index: 2;
    width: 13%;
    height: 4.5%;
    top: 73.5%;
    border-radius: 50%;
    opacity: 0;
    pointer-events: none;
    background: transparent;
    transition: opacity 0.32s ease, box-shadow 0.32s ease;
}

.ns-header-logo[data-stadium-eyes] .ns-logo-plate::before {
    left: 25.5%;
    transform: rotate(-11deg);
}

.ns-header-logo[data-stadium-eyes] .ns-logo-plate::after {
    right: 25.5%;
    transform: rotate(11deg);
}

.ns-header-logo.is-eyes-lit .ns-logo-plate::before,
.ns-header-logo.is-eyes-lit .ns-logo-plate::after,
.ns-header-logo:hover .ns-logo-plate::before,
.ns-header-logo:hover .ns-logo-plate::after,
.ns-header-logo:focus-visible .ns-logo-plate::before,
.ns-header-logo:focus-visible .ns-logo-plate::after {
    opacity: 1;
    box-shadow:
        0 0 6px rgba(255, 255, 255, 0.85),
        0 0 14px rgba(255, 45, 58, 0.95),
        0 0 28px rgba(255, 45, 58, 0.45);
}

.ns-header-logo.is-eyes-lit .ns-logo-img,
.ns-header-logo:hover .ns-logo-img,
.ns-header-logo:focus-visible .ns-logo-img {
    filter:
        drop-shadow(0 0 8px rgba(255, 45, 58, 0.18))
        drop-shadow(0 0 18px rgba(255, 45, 58, 0.1));
}

/* Éclair rapide quand les lasers partent */
.ns-header-logo.is-laser-firing .ns-logo-plate::before,
.ns-header-logo.is-laser-firing .ns-logo-plate::after {
    animation: nsLogoEyeSpark 0.55s ease-out;
}

@keyframes nsLogoEyeSpark {
    0% {
        opacity: 0;
        box-shadow: none;
    }
    18% {
        opacity: 1;
        box-shadow:
            0 0 4px #fff,
            0 0 16px #ff2d3a,
            0 0 36px rgba(255, 45, 58, 0.85);
    }
    45% {
        opacity: 0.85;
        box-shadow:
            0 0 8px #fff,
            0 0 22px #ff2d3a,
            0 0 40px rgba(255, 45, 58, 0.55);
    }
    100% {
        opacity: 0;
        box-shadow: none;
    }
}

/* Faisceaux laser depuis les yeux */
.ns-logo-lasers {
    position: absolute;
    inset: 0;
    overflow: visible;
    pointer-events: none;
    z-index: 4;
}

.ns-logo-laser {
    position: absolute;
    top: 76%;
    height: 2px;
    width: 0;
    opacity: 0;
    border-radius: 2px;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.95) 0%,
        var(--ns-red, #ff2d3a) 22%,
        rgba(255, 45, 58, 0.45) 68%,
        transparent 100%
    );
    box-shadow:
        0 0 6px var(--ns-red, #ff2d3a),
        0 0 16px rgba(255, 45, 58, 0.55);
}

.ns-logo-laser--left {
    left: 30.3%;
    width: min(38vw, 220px);
    transform: translateY(-50%) translateX(-100%) rotate(-6deg) scaleX(0);
    transform-origin: right center;
}

.ns-logo-laser--right {
    left: 69.7%;
    width: min(42vw, 260px);
    transform: translateY(-50%) rotate(6deg) scaleX(0);
    transform-origin: left center;
}

.ns-header-logo.is-laser-firing .ns-logo-laser--left {
    animation: nsLogoLaserLeft 0.62s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.ns-header-logo.is-laser-firing .ns-logo-laser--right {
    animation: nsLogoLaserRight 0.62s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes nsLogoLaserLeft {
    0% {
        transform: translateY(-50%) translateX(-100%) rotate(-6deg) scaleX(0);
        opacity: 0;
    }
    12% { opacity: 1; }
    100% {
        transform: translateY(-50%) translateX(-100%) rotate(-6deg) scaleX(1);
        opacity: 0;
    }
}

@keyframes nsLogoLaserRight {
    0% {
        transform: translateY(-50%) rotate(6deg) scaleX(0);
        opacity: 0;
    }
    12% { opacity: 1; }
    100% {
        transform: translateY(-50%) rotate(6deg) scaleX(1);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ns-header-logo.is-laser-firing .ns-logo-laser,
    .ns-header-logo.is-laser-firing .ns-logo-plate::before,
    .ns-header-logo.is-laser-firing .ns-logo-plate::after {
        animation: none !important;
    }

    .ns-header-logo.is-eyes-lit .ns-logo-plate::before,
    .ns-header-logo.is-eyes-lit .ns-logo-plate::after,
    .ns-header-logo:hover .ns-logo-plate::before,
    .ns-header-logo:hover .ns-logo-plate::after {
        opacity: 1;
        box-shadow: 0 0 10px rgba(255, 45, 58, 0.45);
    }
}
