/* Vitrine Eagle Bullets — movimento da página (13/10/2026).
   Par de assets/vitrine.js. Modelo medido no netinbox.com.br; aqui só o Lenis
   (lenis.min.js, rolagem com inércia) entra como biblioteca — o "aparecer ao
   rolar" é CSS + IntersectionObserver nativo. */

/* Rolagem com inércia: o Lenis move a página quadro a quadro, então o
   "smooth" nativo do navegador tem de sair, senão os dois brigam nos links
   de âncora. As classes lenis/lenis-* são do próprio Lenis. */
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-smooth iframe{pointer-events:none}

/* Blocos que aparecem ao rolar. Só nascem escondidos quando o JS avisou que
   está vivo (html.vitrine-js, ligado por vitrine.js no <head>, antes do corpo
   pintar): sem JS, ou se o arquivo não carregar, a página fica inteira à
   vista. Ao terminar de aparecer, vitrine.js tira o atributo e o bloco volta
   ao CSS normal da página (hover dos cartões etc.). */
.vitrine-js [data-revela]{opacity:0;transition:opacity .8s cubic-bezier(.215,.61,.355,1),transform .8s cubic-bezier(.215,.61,.355,1);will-change:opacity,transform}
.vitrine-js [data-revela="sobe"]{transform:translate3d(0,28px,0)}
.vitrine-js [data-revela="esquerda"]{transform:translate3d(-32px,0,0)}
.vitrine-js [data-revela="direita"]{transform:translate3d(32px,0,0)}
.vitrine-js [data-revela="zoom"]{transform:scale(.94)}
.vitrine-js [data-revela].visivel{opacity:1;transform:none}

/* Fundo com profundidade (pedido do Christian, 13/10/2026): duas camadas FIXAS
   atrás de todo o conteúdo — cinza chumbo com textura de ruído e linhas de
   metal escovado, e um brilho suave (chumbo claro + um fio de dourado) — que
   vitrine.js move devagar conforme a página rola: o conteúdo passa por cima
   em outra velocidade, como a foto do hero atrás do texto. Mais altas que a
   tela para nunca mostrar borda. z-index negativo = atrás de tudo, inclusive
   das faixas (que ficaram semitransparentes no CSS da home). Sem JS a camada
   nem existe (é o vitrine.js que a cria). */
.vitrine-fundo{position:fixed;left:0;top:0;width:100%;height:100vh;z-index:-1;pointer-events:none;overflow:hidden;background:#0b0c0e}
.vitrine-fundo>i{position:absolute;left:0;right:0;display:block;will-change:transform}
/* Textura: foto de areia escura mandada pelo Christian (13/10/2026, 1672×941,
   img/fundo-areia-2026-10.webp), coberta por um véu escuro e com opacidade
   baixa — a regra dele: o fundo nunca pode ter mais ênfase que o conteúdo.
   O caminho ../img/ vale no painel (/site/assets → /site/img) e no domínio
   (/assets → /img). Mudou a foto: trocar o arquivo E subir o ?v=. */
.vitrine-fundo-tex{top:-30vh;height:160vh;opacity:.42;
  background:
    linear-gradient(180deg,#0b0c0e 0%,#0b0c0e80 14%,#0b0c0e59 50%,#0b0c0e80 86%,#0b0c0e 100%),
    url("../img/fundo-areia-2026-10.webp?v=1") center/cover no-repeat #0b0c0e}
.vitrine-fundo-luz{top:-60vh;height:220vh;
  background:
    radial-gradient(42% 28% at 78% 30%,#d7ae6012,transparent 70%),
    radial-gradient(55% 30% at 18% 62%,#3a4048 0%,transparent 70%),
    radial-gradient(40% 24% at 70% 86%,#2a2f3533 0%,transparent 70%)}

/* Quem pediu "reduzir movimento" no aparelho vê tudo parado e à vista. */
@media (prefers-reduced-motion:reduce){
  .vitrine-js [data-revela]{opacity:1;transform:none;transition:none;will-change:auto}
}
