/* Realce animado e reversivel sobre o feixe original da fotografia. */
.login-lighthouse-light {
    position: absolute;
    z-index: 0;
    left: 43.45%;
    top: calc(50% - 10.55vw);
    width: 57vw;
    height: clamp(38px, 6vw, 92px);
    pointer-events: none;
    transform-origin: 0 50%;
    opacity: 0;
    background: linear-gradient(90deg,
        rgba(255, 244, 204, .52) 0%,
        rgba(255, 190, 102, .25) 26%,
        rgba(255, 150, 65, .09) 62%,
        transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 100% 50% at 0 50%, #000 0%, rgba(0,0,0,.9) 34%, rgba(0,0,0,.36) 70%, transparent 100%);
    mask-image: radial-gradient(ellipse 100% 50% at 0 50%, #000 0%, rgba(0,0,0,.9) 34%, rgba(0,0,0,.36) 70%, transparent 100%);
    filter: blur(7px);
    mix-blend-mode: screen;
    animation: login-lighthouse-turn 14s ease-in-out infinite;
}

.login-lighthouse-light::before {
    content: "";
    position: absolute;
    left: -7px;
    top: 50%;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(255, 231, 171, .74);
    box-shadow:
        0 0 8px rgba(255, 240, 190, .9),
        0 0 22px rgba(255, 157, 52, .66),
        0 0 42px rgba(255, 128, 25, .32);
    transform: translateY(-50%);
}

@keyframes login-lighthouse-turn {
    0%, 100% {
        opacity: .34;
        transform: translateY(-50%) rotate(0deg) scaleX(1);
    }
    18% {
        opacity: .16;
        transform: translateY(-50%) rotate(-2deg) scaleX(.38);
    }
    24.5% {
        opacity: 0;
        transform: translateY(-50%) rotate(-3deg) scaleX(.02);
    }
    25.5% {
        opacity: 0;
        transform: translateY(-50%) rotate(3deg) scaleX(-.02);
    }
    32% {
        opacity: .15;
        transform: translateY(-50%) rotate(2deg) scaleX(-.38);
    }
    50% {
        opacity: .54;
        transform: translateY(-50%) rotate(0deg) scaleX(-.82);
    }
    68% {
        opacity: .15;
        transform: translateY(-50%) rotate(-2deg) scaleX(-.38);
    }
    74.5% {
        opacity: 0;
        transform: translateY(-50%) rotate(-3deg) scaleX(-.02);
    }
    75.5% {
        opacity: 0;
        transform: translateY(-50%) rotate(3deg) scaleX(.02);
    }
    82% {
        opacity: .16;
        transform: translateY(-50%) rotate(2deg) scaleX(.38);
    }
}

.login-lighthouse-flare {
    position: absolute;
    z-index: 0;
    left: 43.45%;
    top: calc(50% - 10.55vw);
    width: 24px;
    height: 24px;
    border-radius: 50%;
    pointer-events: none;
    opacity: .08;
    transform: translate(-50%, -50%) scale(.55);
    background: radial-gradient(circle, #fff 0 9%, #fff2c8 15%, rgba(255,177,78,.52) 34%, transparent 70%);
    box-shadow: 0 0 14px rgba(255,236,189,.55), 0 0 36px rgba(255,151,50,.34);
    mix-blend-mode: screen;
    animation: login-lighthouse-facing 14s ease-in-out infinite;
}

.login-lighthouse-flare::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 34vw;
    height: 22vw;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(255,225,167,.2) 0%, rgba(255,151,57,.07) 34%, transparent 70%);
    filter: blur(8px);
}

@keyframes login-lighthouse-facing {
    0%, 18%, 32%, 68%, 82%, 100% {
        opacity: .06;
        transform: translate(-50%, -50%) scale(.58);
    }
    23%, 27%, 73%, 77% {
        opacity: .26;
        transform: translate(-50%, -50%) scale(.92);
    }
    25%, 75% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.82);
    }
}

@media (max-width: 760px) {
    .login-lighthouse-light {
        left: calc(50% - 9.86vh);
        top: 34.2%;
        width: 62vw;
        filter: blur(7px);
    }
    .login-lighthouse-flare {
        left: calc(50% - 9.86vh);
        top: 34.2%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .login-lighthouse-light { display: none; }
    .login-lighthouse-flare { display: none; }
}