/* SEDENTOS · camada de animacoes da pagina do evento (index.html).
   Regra: nada aqui muda o estado FINAL de nenhum elemento. So estados iniciais
   temporarios (removidos depois da entrada) e transicoes de hover.
   html.js       = JavaScript ativo (colocado por um script inline no <head>)
   html.movimento = JS ativo E a pessoa nao pediu "reduzir movimento" */

/* ---------- PRELOADER ---------- */
.preloader{ display:none; }
html.movimento .preloader{
  display:flex; align-items:center; justify-content:center;
  position:fixed; inset:0; z-index:1000;
  background:var(--ground,#0A1A1F);
  transition:opacity .6s ease .15s, visibility 0s linear .75s;
  /* seguranca: se o JS falhar, o preloader some sozinho */
  animation:pl-seguranca .5s ease 4.5s forwards;
}
html.movimento .preloader::before{ /* mesma textura de pontos do site */
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.05;
  background-image:radial-gradient(var(--bone,#F5FAFE) .5px, transparent .5px); background-size:3px 3px;
}
html.movimento .preloader::after{ /* mesmo brilho azul do hero */
  content:""; position:absolute; left:50%; top:50%; width:min(760px,130vw); height:420px;
  transform:translate(-50%,-50%);
  background:radial-gradient(closest-side, color-mix(in srgb, var(--ember,#1AA3E8) 30%, transparent), transparent 72%);
  opacity:0; animation:pl-brilho 1.6s ease .1s forwards; pointer-events:none;
}
@keyframes pl-seguranca{ to{ opacity:0; visibility:hidden; } }
@keyframes pl-brilho{ to{ opacity:.55; } }

.pl-centro{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; transition:transform .5s cubic-bezier(.4,0,.2,1), opacity .45s ease; }
.pl-marca{
  display:flex; overflow:hidden; padding:.04em .02em 0;
  font-family:var(--impact,'Big Shoulders Display','Arial Narrow',sans-serif); font-weight:900; text-transform:uppercase;
  font-size:clamp(3.4rem,15vw,7.5rem); line-height:.9; letter-spacing:.01em; color:var(--bone,#F5FAFE);
}
.pl-marca span{ display:inline-block; transform:translateY(105%); animation:pl-letra .75s cubic-bezier(.2,.7,.2,1) forwards; }
.pl-marca span:nth-child(1){ animation-delay:.05s; } .pl-marca span:nth-child(2){ animation-delay:.10s; }
.pl-marca span:nth-child(3){ animation-delay:.15s; } .pl-marca span:nth-child(4){ animation-delay:.20s; }
.pl-marca span:nth-child(5){ animation-delay:.25s; } .pl-marca span:nth-child(6){ animation-delay:.30s; }
.pl-marca span:nth-child(7){ animation-delay:.35s; } .pl-marca span:nth-child(8){ animation-delay:.40s; }
.pl-marca .t{ color:var(--ember,#1AA3E8); }
@keyframes pl-letra{ to{ transform:none; } }

/* a onda original da identidade (mesmo desenho e cor dos cards de line up) */
.pl-onda{ width:min(300px,62vw); height:auto; margin-top:10px; overflow:visible; animation:pl-balanco 3.2s ease-in-out .9s infinite alternate; }
.pl-onda path{ stroke-dasharray:640; stroke-dashoffset:640; animation:pl-traco 1.1s cubic-bezier(.4,0,.2,1) .35s forwards; }
@keyframes pl-traco{ to{ stroke-dashoffset:0; } }
@keyframes pl-balanco{ from{ transform:translateX(-7px); } to{ transform:translateX(7px); } }

.pl-pelo{ margin-top:12px; font-family:var(--serif,'Newsreader',Georgia,serif); font-style:italic; color:var(--ember-soft,#5BC0F0); font-size:clamp(1.15rem,4vw,1.6rem); opacity:0; transform:translateY(6px); animation:pl-surge .7s ease .6s forwards; }
@keyframes pl-surge{ to{ opacity:1; transform:none; } }

/* saida */
html.movimento .preloader.saindo{ opacity:0; visibility:hidden; pointer-events:none; }
.preloader.saindo .pl-centro{ transform:translateY(-14px); opacity:0; }

/* ---------- ENTRADA DO HERO ---------- */
/* estado inicial temporario (so enquanto o preloader cobre a tela) */
html.movimento .hero-pre .ent,
html.movimento .topbar.ent-pre{ opacity:0; transform:translate3d(0,var(--ent-y,16px),0); }
html.movimento .hero-pre::after{ opacity:0; }
/* entrada */
html.movimento .hero-in .ent,
html.movimento .topbar.ent-in{
  opacity:1; transform:none;
  transition:opacity .8s ease, transform .9s cubic-bezier(.2,.7,.2,1);
  transition-delay:var(--ent-d,0ms);
}
html.movimento .hero-in::after{ transition:opacity 1.3s ease; }

/* ---------- PARALLAX DO BRILHO DO HERO (so desktop) ---------- */
html.movimento .hero.plx::after{ transform:translate3d(-50%, var(--plx,0px), 0); will-change:transform; }

/* ---------- REVELACAO NO SCROLL ---------- */
html.movimento .rv{ opacity:0; transform:translate3d(0,var(--rv-y,22px),0); }
html.movimento .rv.rv-in{
  opacity:1; transform:none;
  transition:opacity .75s ease, transform .85s cubic-bezier(.2,.7,.2,1);
  transition-delay:var(--rv-d,0ms);
}
@media (max-width:640px){ html.movimento .rv{ --rv-y:14px; } }
@media print{ .rv, .ent, .ent-pre{ opacity:1 !important; transform:none !important; } .preloader{ display:none !important; } }

/* ---------- MICROINTERACOES (so movimento, sem mudar cores/bordas) ---------- */
html.movimento .btn:hover{ transform:translateY(-2px); }
html.movimento .btn:active{ transform:translateY(0) scale(.97); }
html.movimento a{ transition:color .15s ease, opacity .15s ease; }
html.movimento .spk-card{ transition:transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease; }
html.movimento .spk-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -24px rgba(0,0,0,.7); }
html.movimento .spk-card .ph img{ transition:transform .7s cubic-bezier(.2,.7,.2,1); }
html.movimento .spk-card:hover .ph img{ transform:scale(1.04); }
html.movimento .day, html.movimento .steps li{ transition:transform .3s cubic-bezier(.2,.7,.2,1); }
html.movimento .day:hover, html.movimento .steps li:hover{ transform:translateY(-3px); }
html.movimento summary::after{ transition:transform .3s ease; }
html.movimento details[open] summary::after{ transform:rotate(180deg); }
html.movimento .chip{ transition:transform .2s ease; }
html.movimento .chip:hover{ transform:translateY(-1px); }

/* telas de toque: sem hover "grudado" nos cards */
@media (hover:none){
  html.movimento .spk-card:hover, html.movimento .day:hover, html.movimento .steps li:hover, html.movimento .chip:hover{ transform:none; box-shadow:none; }
  html.movimento .spk-card:hover .ph img{ transform:none; }
}