/* css/splash.css — splash animada LGL (chapinha girando) */
#lgl-splash{ position:fixed; inset:0; z-index:99999; overflow:hidden; background:#0A1E7A; }
#lgl-splash *{ box-sizing:border-box; }
.splash-bg-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
.splash-ring{ position:absolute; left:50%; top:38%; width:48vw; max-width:210px; aspect-ratio:1;
  border-radius:50%; border:3px solid rgba(255,255,255,.85);
  transform:translate(-50%,-50%) scale(.5); opacity:0; will-change:transform,opacity; z-index:1; }
.splash-cap{ position:absolute; left:50%; top:38%; width:49vw; max-width:210px; height:auto;
  transform:translate(-50%,-50%); filter:drop-shadow(0 14px 30px rgba(0,0,0,.5));
  will-change:transform,opacity; z-index:2; }
.splash-cta{ position:absolute; left:0; right:0; top:60%; text-align:center; z-index:2;
  font-family:'Outfit',system-ui,-apple-system,sans-serif; font-weight:800; line-height:1.02;
  letter-spacing:-.5px; font-size:clamp(34px,11vw,52px); color:#fff; opacity:0; will-change:transform,opacity; }
.splash-cta .l1{ display:block; color:#fff; }
.splash-cta .l2{ display:block; color:#37E0E6; }
.splash-bar{ position:absolute; left:50%; bottom:7%; width:46px; height:4px; margin-left:-23px;
  border-radius:2px; background:#37E0E6; opacity:0; z-index:2; will-change:opacity; }

#lgl-splash.splash-full{ animation:splashOut 3.6s ease forwards; }
.splash-full .splash-cap{ animation:capSpin 3.6s cubic-bezier(.42,.04,.32,1) both; }
.splash-full .splash-ring{ animation:ringPop 3.6s ease-out both; }
.splash-full .splash-cta{ animation:ctaIn 3.6s cubic-bezier(.25,.9,.3,1) both; }
.splash-full .splash-bar{ animation:barIn 3.6s ease both; }

#lgl-splash.splash-short{ animation:splashOut 1.6s ease forwards; }
.splash-short .splash-cap{ animation:capShort 1.6s ease both; }
.splash-short .splash-ring{ display:none; }
.splash-short .splash-cta{ animation:ctaShort 1.6s ease both; }
.splash-short .splash-bar{ display:none; }

@keyframes splashOut{ 0%,92%{opacity:1} 100%{opacity:0;visibility:hidden} }
@keyframes capSpin{
  0%{opacity:0; transform:translate(-50%,-50%) rotate(0deg) scale(.82)}
  8%{opacity:1; transform:translate(-50%,-50%) rotate(45deg) scale(1)}
  44%{transform:translate(-50%,-50%) rotate(684deg) scale(1)}
  49%{transform:translate(-50%,-50%) rotate(744deg) scale(1.11)}
  54%{transform:translate(-50%,-50%) rotate(720deg) scale(1)}
  58%{transform:translate(-50%,-50%) rotate(723deg) scale(1.035)}
  62%{transform:translate(-50%,-50%) rotate(720deg) scale(1)}
  100%{opacity:1; transform:translate(-50%,-50%) rotate(720deg) scale(1)}
}
@keyframes ringPop{
  0%,44%{opacity:0; transform:translate(-50%,-50%) scale(.55)}
  50%{opacity:.8; transform:translate(-50%,-50%) scale(.72)}
  64%{opacity:0; transform:translate(-50%,-50%) scale(2.2)}
  100%{opacity:0; transform:translate(-50%,-50%) scale(2.2)}
}
@keyframes ctaIn{
  0%,58%{opacity:0; transform:translateX(-70px)}
  68%{opacity:1; transform:translateX(9px)}
  73%{transform:translateX(0)}
  100%{opacity:1; transform:translateX(0)}
}
@keyframes barIn{ 0%,74%{opacity:0} 84%{opacity:.95} 100%{opacity:.95} }
@keyframes capShort{ 0%{opacity:0; transform:translate(-50%,-50%) scale(.9)} 35%{opacity:1; transform:translate(-50%,-50%) scale(1)} 100%{opacity:1; transform:translate(-50%,-50%) scale(1)} }
@keyframes ctaShort{ 0%,40%{opacity:0; transform:translateX(-20px)} 68%{opacity:1; transform:translateX(0)} 100%{opacity:1; transform:translateX(0)} }

@media (prefers-reduced-motion: reduce){
  .splash-full .splash-cap{ animation:capShort 1.6s ease both; }
  .splash-full .splash-ring{ display:none; }
  #lgl-splash.splash-full{ animation:splashOut 1.8s ease forwards; }
}
