:root {
    --isp-logo-glow-core: rgba(255, 255, 255, 0.98);
    --isp-logo-glow-accent: rgba(255, 255, 255, 0.78);
    --isp-logo-glow-edge: rgba(110, 255, 190, 0.42);
}

@keyframes ispLogoGlowPulse {
    0%,
    100% {
        opacity: 0.9;
        transform: translateZ(0) scale(1);
        filter:
            drop-shadow(0 0 0 rgba(255, 255, 255, 0))
            drop-shadow(0 0 12px rgba(255, 255, 255, 0.16))
            drop-shadow(0 0 26px rgba(110, 255, 190, 0.12));
    }

    50% {
        opacity: 1;
        transform: translateZ(0) scale(1.04);
        filter:
            drop-shadow(0 0 14px var(--isp-logo-glow-core))
            drop-shadow(0 0 34px var(--isp-logo-glow-accent))
            drop-shadow(0 0 64px var(--isp-logo-glow-edge));
    }
}

.bills-brand-logo,
.fms-brand-logo,
.tickets-logo,
.help-brand-logo,
.login-brand img,
.brand img,
.logo,
.navbar-brand img {
    position: relative;
    display: block;
    max-width: 100%;
    height: auto;
    padding: 0 !important;
    background: none !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    animation: ispLogoGlowPulse 5.4s ease-in-out infinite;
    will-change: transform, filter, opacity;
}

.login-brand img {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 220px !important;
    object-fit: contain !important;
    margin: 0 auto 1.25rem !important;
}

.login-card .logo {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 180px !important;
    object-fit: contain !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 1.4rem !important;
}

@media (max-width: 576px), (hover: none) and (pointer: coarse) {
    .login-brand img {
        max-height: 168px !important;
    }

    .login-card .logo {
        max-height: 144px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bills-brand-logo,
    .fms-brand-logo,
    .tickets-logo,
    .help-brand-logo,
    .login-brand img,
    .brand img,
    .logo,
    .navbar-brand img {
        animation: none;
        filter: drop-shadow(0 0 14px rgba(255, 255, 255, 0.28));
    }
}
