/* fundo da hero: as meias-luas do logo como fitas de luz girando devagar atrás da hero (no espírito da Accelera) */
.fitas { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden;
  -webkit-mask-image: radial-gradient(ellipse 38% 44% at 50% 46%, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .12) 55%, rgba(0, 0, 0, .7) 100%);
  mask-image: radial-gradient(ellipse 38% 44% at 50% 46%, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, .12) 55%, rgba(0, 0, 0, .7) 100%); }
.hero > .wrap { position: relative; z-index: 1; }
.fitas svg { position: absolute; left: 50%; top: 50%; width: max(1500px, 120vw); height: auto; transform: translate(-50%, -54%); }
.fitas .giro { transform-box: view-box; transform-origin: 800px 450px; animation: fitas-gira 120s linear infinite; }
.fitas .giro--b { animation-duration: 180s; animation-direction: reverse; }
.fitas .fio { fill: none; stroke-width: .5; vector-effect: non-scaling-stroke; }
.fitas .fio--1 { stroke: url(#fitas-ouro); stroke-width: 1.2; opacity: .26; }
.fitas .fio--2 { stroke: url(#fitas-ouro); stroke-width: 1; opacity: .14; }
.fitas .fio--3 { stroke: url(#fitas-prata); stroke-width: 1; opacity: .1; }
.fitas .luz { fill: none; stroke: #F0D878; stroke-width: 1.6; vector-effect: non-scaling-stroke; stroke-linecap: round;
  stroke-dasharray: .12 .88; stroke-dashoffset: 1; opacity: .3; animation: fitas-corre 14s linear infinite; }
.fitas .luz--b { animation-duration: 20s; animation-delay: -4s; }
.fitas.entra { opacity: 0; animation: risco-mostra 2.4s ease-out .2s forwards; }
@keyframes fitas-gira { to { transform: rotate(360deg); } }
@keyframes fitas-corre { to { stroke-dashoffset: 0; } }
@media (max-width: 720px) { .fitas svg { width: 260vw; } }
@media (prefers-reduced-motion: reduce) {
  .fitas .giro, .fitas .luz { animation: none; }
  .fitas.entra { animation: none; opacity: 1; }
}

@keyframes risco-mostra { to { opacity: 1; } }
