/* =============================================================================
   Marca Shineweb animada (inc/inc-marca.php → shw_logo_svg())
   Entrada 1x por sessão (.is-entrada, posta pelo script ao lado do SVG) e
   brilho no hover/foco. As peças se movem em unidades do viewBox (620×676):
   90 unidades ≈ 4–5px na altura de 34–40px dos topos.
   ============================================================================= */

.shw-logo {
    display: block;
    flex: none;
    width: auto;
    aspect-ratio: 619.9 / 675.4;
    overflow: visible;
}
.shw-logo-pecas { fill: currentColor; }

/* Tamanho em cada topo (a cor vem do link) */
.lp-nav-logo .shw-logo { height: 34px; }
.sys-topbar-logo .shw-logo { height: 40px; color: #11161B; }
@media (max-width: 782px) {
    .sys-topbar-logo .shw-logo { height: 36px; }
}

/* ---------- entrada ---------- */
.shw-logo.is-entrada .shw-logo-base {
    animation: shw-logo-sobe .7s cubic-bezier(.2, .8, .2, 1) both;
}
.shw-logo.is-entrada .shw-logo-topo {
    animation: shw-logo-desce .8s cubic-bezier(.2, .8, .2, 1) .12s both;
}
.shw-logo.is-entrada .shw-logo-luz {
    animation: shw-logo-brilho 1.1s cubic-bezier(.4, 0, .2, 1) .75s;
}
/* O nome ao lado entra logo depois da marca */
.shw-logo.is-entrada ~ .lcopy,
.shw-logo.is-entrada ~ .sys-topbar-logo-copy {
    animation: shw-logo-nome .6s cubic-bezier(.2, .8, .2, 1) .35s both;
}

/* ---------- brilho no hover / foco ---------- */
a:hover > .shw-logo .shw-logo-luz,
a:focus-visible > .shw-logo .shw-logo-luz {
    animation: shw-logo-brilho-hover .9s cubic-bezier(.4, 0, .2, 1);
}

@keyframes shw-logo-sobe {
    from { opacity: 0; transform: translateY(90px); }
    to   { opacity: 1; transform: none; }
}
@keyframes shw-logo-desce {
    from { opacity: 0; transform: translateY(-90px); }
    to   { opacity: 1; transform: none; }
}
@keyframes shw-logo-nome {
    from { opacity: 0; transform: translateX(-6px); }
    to   { opacity: 1; transform: none; }
}
/* Dois nomes iguais de propósito: o do hover precisa ser outro pra reiniciar. */
@keyframes shw-logo-brilho       { from { transform: translateX(0); } to { transform: translateX(1300px); } }
@keyframes shw-logo-brilho-hover { from { transform: translateX(0); } to { transform: translateX(1300px); } }

@media (prefers-reduced-motion: reduce) {
    .shw-logo *,
    .shw-logo ~ .lcopy,
    .shw-logo ~ .sys-topbar-logo-copy { animation: none !important; }
}

/* Toque não tem hover: no celular o brilho passa sozinho de tempos em tempos */
@media (hover: none) {
    .sys-topbar-logo .shw-logo .shw-logo-luz {
        animation: shw-logo-brilho-ciclo 9s cubic-bezier(.4, 0, .2, 1) 2.5s infinite;
    }
}
@keyframes shw-logo-brilho-ciclo {
    0%   { transform: translateX(0); }
    12%  { transform: translateX(1300px); }
    100% { transform: translateX(1300px); }
}
@media (prefers-reduced-motion: reduce) {
    .sys-topbar-logo .shw-logo .shw-logo-luz { animation: none !important; }
}
