/* El logo original en capas (herramientas/logo.py y armar.py): el fondo, los rayos que giran en sentido horario y la
   marca encima. Lo que gira son las cuñas con su brillo y las líneas; cada brillo va recortado a su lado (celeste a la
   izquierda, naranja a la derecha), así los colores no se mezclan. Una vuelta cada 72 s. Con "reducir movimiento", quieto. */
.logo-gr { position: relative; width: 100%; aspect-ratio: 1024 / 842; }
.logo-gr > img, .lg-rayos, .lg-lado, .lg-giro { position: absolute; inset: 0; width: 100%; height: 100%; }
.logo-gr > img { display: block; max-width: none; }
.lg-rayos { overflow: hidden; -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.lg-izq { clip-path: inset(0 48.535% 0 0); }
.lg-der { clip-path: inset(0 0 0 51.465%); }
.lg-giro { overflow: visible; transform-origin: 51.465% 46.793%; }
.logo-gr > .lg-marca-claro { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .lg-giro { animation: lg-girar 72s linear infinite; will-change: transform; }
}
@keyframes lg-girar { to { transform: rotate(360deg); } }