/* Logotipo VDA com "tremidinhas": pequenos tremores a cada poucos segundos */
.hero-logo,.fim img.logo{transform-origin:50% 60%;animation:tremor-logo 4.5s ease-in-out 2.6s infinite}
@keyframes tremor-logo{
  0%,78%,100%{transform:translate(0,0) rotate(0)}
  80%{transform:translate(-2px,0) rotate(-1.2deg)}
  82%{transform:translate(2px,-1px) rotate(1.2deg)}
  84%{transform:translate(-2px,1px) rotate(-.9deg)}
  86%{transform:translate(2px,0) rotate(.9deg)}
  88%{transform:translate(-1px,0) rotate(-.5deg)}
  90%{transform:translate(1px,0) rotate(.4deg)}
  92%{transform:translate(0,0) rotate(0)}
}

/* Todos os botões pulsando */
.btn,.vbtn{animation:pulso-btn 2.2s ease-out infinite}
.btn-c,.vbtn.c{animation-name:pulso-btn-claro}
.topo .btn{animation-delay:.4s}
tfoot .btn{animation-delay:.8s}
.cta-fixo .btn{animation-delay:.2s}
@keyframes pulso-btn{
  0%{box-shadow:0 0 0 0 rgba(243,142,24,.6);transform:scale(1)}
  50%{transform:scale(1.035)}
  70%{box-shadow:0 0 0 16px rgba(243,142,24,0)}
  100%{box-shadow:0 0 0 0 rgba(243,142,24,0);transform:scale(1)}
}
@keyframes pulso-btn-claro{
  0%{box-shadow:0 0 0 0 rgba(245,243,239,.45);transform:scale(1)}
  50%{transform:scale(1.035)}
  70%{box-shadow:0 0 0 14px rgba(245,243,239,0)}
  100%{box-shadow:0 0 0 0 rgba(245,243,239,0);transform:scale(1)}
}
.btn:hover,.vbtn:hover{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.hero-logo,.fim img.logo,.topo a img,.btn,.vbtn{animation:none}}
.topo .btn,tfoot .btn,.cta-fixo .btn,.cta-faixa .btn{animation:pulso-btn 2.2s ease-out infinite}
tfoot .btn.btn-c{animation-name:pulso-btn-claro}
.topo .btn{animation-delay:.4s}tfoot .btn{animation-delay:.8s}

/* Hexágonos do ecossistema com as mesmas tremidinhas do logotipo, em tempos alternados */
.hex,.item-eco .mini{transform-origin:50% 50%;animation:tremor-logo 4.5s ease-in-out infinite}
.hex.h1{animation-delay:1.0s}.hex.h2{animation-delay:1.6s}.hex.h3{animation-delay:2.2s}
.hex.h4{animation-delay:2.8s}.hex.h5{animation-delay:3.4s}.hex.centro{animation-delay:4.0s}
.item-eco:nth-child(1) .mini{animation-delay:1.3s}.item-eco:nth-child(2) .mini{animation-delay:1.9s}
.item-eco:nth-child(3) .mini{animation-delay:2.5s}.item-eco:nth-child(4) .mini{animation-delay:3.1s}
.item-eco:nth-child(5) .mini{animation-delay:3.7s}
@media (prefers-reduced-motion:reduce){.hex,.item-eco .mini{animation:none}}

/* logotipo da barra do topo fica parado */
.topo a img{animation:none!important}

/* selos de vagas pulsando */
.selo-vagas{animation:pulso-selo 1.8s ease-out infinite}
.selo-vagas.esgotadas{animation-name:pulso-selo-vermelho}
@keyframes pulso-selo{0%{box-shadow:0 0 0 0 rgba(243,142,24,.6);transform:scale(1)}50%{transform:scale(1.06)}70%{box-shadow:0 0 0 10px rgba(243,142,24,0)}100%{box-shadow:0 0 0 0 rgba(243,142,24,0);transform:scale(1)}}
@keyframes pulso-selo-vermelho{0%{box-shadow:0 0 0 0 rgba(229,72,77,.6);transform:scale(1)}50%{transform:scale(1.06)}70%{box-shadow:0 0 0 10px rgba(229,72,77,0)}100%{box-shadow:0 0 0 0 rgba(229,72,77,0);transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.selo-vagas{animation:none}}
/* colmeia com 3 itens: triângulo em volta do centro */
.colmeia .hex.h1{left:34.5%;top:2%}
.colmeia .hex.h4{left:8%;top:62%}
.colmeia .hex.h5{right:8%;top:62%}
.item-eco:nth-child(1) .mini{animation-delay:1.3s}.item-eco:nth-child(2) .mini{animation-delay:2.2s}.item-eco:nth-child(3) .mini{animation-delay:3.1s}
/* colmeia com 4 itens em losango em volta do centro */
.colmeia .hex.h1{left:34.5%;top:0;right:auto}
.colmeia .hex.h2{left:0;top:34%;right:auto}
.colmeia .hex.h3{right:0;left:auto;top:34%}
.colmeia .hex.h4{left:34.5%;top:68%;right:auto}
.colmeia .hex.h5{display:none}
.item-eco:nth-child(1) .mini{animation-delay:1.3s}.item-eco:nth-child(2) .mini{animation-delay:2.0s}.item-eco:nth-child(3) .mini{animation-delay:2.7s}.item-eco:nth-child(4) .mini{animation-delay:3.4s}
/* colmeia: as hexágonos só tremem quando o mouse passa por cima */
.colmeia .hex{animation:none}
@keyframes tremor-hover{0%,100%{transform:translate(0,0) rotate(0)}20%{transform:translate(-2px,0) rotate(-1.4deg)}40%{transform:translate(2px,-1px) rotate(1.4deg)}60%{transform:translate(-1px,1px) rotate(-.8deg)}80%{transform:translate(1px,0) rotate(.6deg)}}
.colmeia .hex:hover{animation:tremor-hover .45s ease-in-out infinite;animation-delay:0s;cursor:default}
@media (prefers-reduced-motion:reduce){.colmeia .hex:hover{animation:none}}
/* hexágono do centro: logo e nome juntos, no meio */
.hex.centro span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.hex.centro img{margin:0 auto}
@media (max-width:640px){.colmeia .hex:not(.centro) span{font-size:.625rem;letter-spacing:-.01em}}
/* ecossistema: hexágonos e cartões reagem ao mouse com brilho e elevação */
.colmeia .hex{transition:filter .25s,translate .25s}
.colmeia .hex:hover{filter:drop-shadow(0 0 18px rgba(243,142,24,.55)) brightness(1.08);translate:0 -6px}
.item-eco{transition:transform .25s,box-shadow .25s,background-color .25s;border-radius:16px}
.item-eco:hover{transform:translateY(-4px);background-image:linear-gradient(rgba(243,142,24,.08),rgba(243,142,24,.08));border-color:rgba(243,142,24,.35);box-shadow:0 10px 28px rgba(243,142,24,.14)}
.item-eco:hover .mini{filter:drop-shadow(0 0 10px rgba(243,142,24,.6))}
@media (prefers-reduced-motion:reduce){.colmeia .hex:hover,.item-eco:hover{translate:none;transform:none}}
/* só o logotipo da primeira dobra (hero) treme; os demais ficam parados */
.fim img.logo,.item-eco .mini,.planos-cab img{animation:none!important}
.colmeia .hex.centro,.colmeia .hex.centro:hover{animation:none!important;translate:none;filter:none}
/* "Eles querem resolver a vida tendo": mesmo efeito dos cartões do ecossistema ao passar o mouse */
.queriam ol>li{transition:transform .25s,box-shadow .25s,background-color .25s}
.queriam ol>li:hover{transform:translateY(-4px);background-image:linear-gradient(rgba(243,142,24,.08),rgba(243,142,24,.08));box-shadow:0 10px 28px rgba(243,142,24,.14)}
.queriam ol>li::before{transition:filter .25s}
.queriam ol>li:hover::before{filter:drop-shadow(0 0 10px rgba(243,142,24,.6))}
@media (prefers-reduced-motion:reduce){.queriam ol>li:hover{transform:none}}
/* cartões clicáveis: abrem uma explicação */
.clicavel{cursor:pointer;position:relative}
.clicavel::after{content:"+";position:absolute;top:14px;right:16px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:19px;line-height:1;color:#F38E18;border:1.5px solid rgba(243,142,24,.5);transition:transform .25s,background-color .25s}
.clicavel[aria-expanded="true"]::after{transform:rotate(45deg);background-color:rgba(243,142,24,.12)}
.clicavel:focus-visible{outline:2px solid #F38E18;outline-offset:3px}
.clicavel .mais p{margin:10px 0 0;font-size:.9375rem;line-height:1.6;font-weight:500;color:#C9C9CE;animation:abre-mais .25s ease-out}
.item-eco.clicavel>div:last-child{padding-right:28px}
.queriam ol>li.abre .li-tit{padding-right:34px}
.queriam ol>li.abre .mais{grid-column:2}
.queriam ol>li.abre .mais p{margin-top:4px}
@keyframes abre-mais{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.clicavel .mais p{animation:none}}