/* ============ Interações e animações da LP ============ */

/* Esconde o hero até a animação de entrada (o fallback no <head> remove .js se o GSAP não carregar) */
.js [data-s=hero] .wrap > *{opacity:0}
[data-s=hero]{overflow:hidden}

/* Barra de progresso de leitura */
.es-progress{position:fixed;top:0;left:0;height:3px;width:100%;background:linear-gradient(90deg,#C49A4E,#DFC79E);transform-origin:0 50%;transform:scaleX(0);z-index:60;pointer-events:none}

/* CTA: brilho que passa pelo botão */
.cta{position:relative;overflow:hidden;isolation:isolate;transition:background 150ms,translate 150ms}
.cta:hover{translate:0 -1px}
.cta::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:es-shine 4.2s ease-in-out infinite;z-index:-1;pointer-events:none}
@keyframes es-shine{0%,62%{left:-60%}100%{left:130%}}

/* Botão de play do vídeo: ondas pulsando */
.es-play{transition:transform .3s ease}
.es-play::before,.es-play::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(245,244,240,.6);animation:es-ring 2.4s ease-out infinite;pointer-events:none}
.es-play::after{animation-delay:1.2s}
.es-play:hover{transform:translate(-50%,-50%) scale(1.08) !important}
@keyframes es-ring{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.9);opacity:0}}

/* Checklist interativo da identificação */
/* Hover usa a propriedade translate (não transform) para não brigar com o GSAP */
.es-check{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;transition:border-color .25s,background-color .25s,box-shadow .25s,translate .25s}
@media (hover:hover){.es-check:hover{border-color:#C49A4E !important;translate:0 -2px;box-shadow:0 10px 28px rgba(12,26,52,.08)}}
.es-check:focus-visible{outline:2px solid #C49A4E;outline-offset:3px}
.es-check .es-box{transition:background-color .25s,border-color .25s}
.es-check .es-box svg{transform:scale(0);transition:transform .35s cubic-bezier(.34,1.8,.64,1)}
.es-check.on{background:#12294B !important;border-color:#12294B !important;color:#F5F4F0}
.es-check.on .es-box{background:#C49A4E;border-color:#C49A4E !important}
.es-check.on .es-box svg{transform:scale(1)}
.es-check.on .es-box svg path{stroke:#0C1A34}
.es-meter{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.es-meter-bar{width:min(420px,100%);height:8px;border-radius:999px;background:#E3DED2;overflow:hidden}
.es-meter-fill{height:100%;width:0;background:linear-gradient(90deg,#C49A4E,#DFC79E);border-radius:999px;transition:width .5s cubic-bezier(.22,1,.36,1)}
.es-meter-msg{margin:0;font:700 18px/1.5 'Manrope',sans-serif;color:#12294B;max-width:640px;min-height:27px}
.es-meter-msg strong{color:#896B35}
.es-meter a{display:none;font-weight:600}
.es-meter.alto a{display:inline}

/* Cards com elevação no hover */
.es-lift{transition:translate .35s cubic-bezier(.22,1,.36,1),box-shadow .35s}
@media (hover:hover){.es-lift:hover{translate:0 -6px;box-shadow:0 22px 50px rgba(12,26,52,.16)}}

/* Roda 360 */
.es-wheel .es-node{cursor:pointer;transition:filter .25s}
.es-wheel .es-node circle{transition:fill .3s,stroke .3s}
.es-wheel .es-node:hover circle,.es-wheel .es-node.on circle{fill:#12294B;stroke:#C49A4E}
.es-wheel .es-node:hover text,.es-wheel .es-node.on text{fill:#F5F4F0}
.es-wheel .es-spoke{transition:stroke-width .3s,stroke .3s}
.es-wheel .es-spoke.on{stroke-width:3.5;stroke:#C49A4E}
.es-orbit{transform-origin:260px 260px;animation:es-spin 60s linear infinite}
.es-wheel-tip{margin:12px 0 0;text-align:center;font-size:15px;line-height:22px;color:#41546F;min-height:44px}
.es-wheel-tip strong{color:#12294B}

/* Selo de garantia girando */
.es-seal-ring{transform-origin:140px 140px;animation:es-spin 28s linear infinite}
@keyframes es-spin{to{transform:rotate(360deg)}}

/* Preço riscado desenhado */
.es-strike{position:relative;text-decoration:none;display:inline-block}
.es-strike::after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:2px;background:#B44B3A;transform:scaleX(var(--s,0));transform-origin:0 50%;transition:transform .45s cubic-bezier(.65,0,.35,1)}

/* Card da oferta com brilho na borda */
.es-glow{position:relative}
.es-glow::before{content:"";position:absolute;inset:-2px;border-radius:34px;padding:2px;background:conic-gradient(from var(--a,0deg),transparent 0 70%,#C49A4E 80%,#DFC79E 85%,transparent 95%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:es-orbit 5s linear infinite}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes es-orbit{to{--a:360deg}}

/* FAQ abrindo suave */
[data-s=faq] details{overflow:hidden}
[data-s=faq] summary{transition:color .2s}
[data-s=faq] summary:hover{color:#DFC79E !important}
[data-s=faq] .pl{display:inline-block}
[data-s=faq] details.closing .pl{transform:none}

/* CTA fixo no celular */
.es-sticky{position:fixed;left:12px;right:12px;bottom:12px;z-index:55;display:none;transform:translateY(140%);transition:transform .45s cubic-bezier(.22,1,.36,1)}
.es-sticky.show{transform:translateY(0)}
.es-sticky .cta{width:100%;min-height:56px;font-size:14px;box-shadow:0 14px 34px rgba(12,26,52,.45)}
@media (max-width:760px){.es-sticky{display:block}}

/* Seta "Role para continuar" do topo (versão sem VSL) */
.es-scroll svg{animation:es-bob 1.8s ease-in-out infinite}
.es-scroll:hover{color:#DFC79E !important}
@keyframes es-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* Quem prefere menos movimento não recebe animações contínuas */
@media (prefers-reduced-motion: reduce){
.js [data-s=hero] .wrap > *{opacity:1}
.cta::after,.es-play::before,.es-play::after,.es-orbit,.es-seal-ring,.es-glow::before,.es-scroll svg{animation:none}
}