/* ============================================================
   Animações — keyframes + estados de scroll-reveal
   ============================================================ */

/* ---------- Scroll reveal (apenas quando JS está ativo) ---------- */
html.js [data-reveal] {
  opacity: 0;
  transform: translateY(38px);
  transition: opacity .9s var(--ease-out), transform .9s var(--ease-out);
  will-change: opacity, transform;
}
html.js [data-reveal="left"]  { transform: translateX(-48px); }
html.js [data-reveal="right"] { transform: translateX(48px); }
html.js [data-reveal="scale"] { transform: scale(.92); }
html.js [data-reveal="blur"]  { filter: blur(14px); transform: translateY(28px); }
html.js [data-reveal].in {
  opacity: 1; transform: none; filter: none;
}
[data-delay="1"] { transition-delay: .08s; }
[data-delay="2"] { transition-delay: .16s; }
[data-delay="3"] { transition-delay: .24s; }
[data-delay="4"] { transition-delay: .32s; }
[data-delay="5"] { transition-delay: .40s; }
[data-delay="6"] { transition-delay: .48s; }

/* ---------- Keyframes ---------- */
@keyframes floatY {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-16px); }
}
@keyframes floatY-sm {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-9px); }
}
@keyframes pulseRing {
  0% { transform: scale(.85); opacity: .7; }
  70% { transform: scale(1.7); opacity: 0; }
  100% { opacity: 0; }
}
@keyframes spinSlow { to { transform: rotate(360deg); } }
@keyframes meshDrift {
  0%   { transform: translate(0,0) scale(1); }
  33%  { transform: translate(4%, -5%) scale(1.08); }
  66%  { transform: translate(-4%, 4%) scale(.96); }
  100% { transform: translate(0,0) scale(1); }
}
@keyframes sheenMove {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(26px); }
  to   { opacity: 1; transform: none; }
}
@keyframes shimmerText {
  to { background-position: 200% center; }
}
@keyframes wave {
  0%,100% { transform: rotate(0deg); }
  20% { transform: rotate(14deg); }
  40% { transform: rotate(-8deg); }
  60% { transform: rotate(10deg); }
}
@keyframes drawLine { to { stroke-dashoffset: 0; } }

/* ---------- Aplicações utilitárias ---------- */
.float { animation: floatY 7s var(--ease-soft) infinite; }
.float-sm { animation: floatY-sm 5.5s var(--ease-soft) infinite; }

/* Entrada para conteúdo carregado via htmx (ex.: depoimentos extras) */
.fade-up { animation: fadeUp .7s var(--ease-out) both; }
.fade-up--d1 { animation-delay: .1s; }
.fade-up--d2 { animation-delay: .2s; }

.metal-text { animation: shimmerText 6s linear infinite; }

/* Hero mesh gradient blobs */
.mesh { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .55; pointer-events: none; }
.mesh--1 { width: 540px; height: 540px; background: radial-gradient(circle, #2d52a3, transparent 65%); animation: meshDrift 18s ease-in-out infinite; }
.mesh--2 { width: 460px; height: 460px; background: radial-gradient(circle, #ff7c3c, transparent 62%); opacity: .28; animation: meshDrift 22s ease-in-out infinite reverse; }
.mesh--3 { width: 600px; height: 600px; background: radial-gradient(circle, #6b97dd, transparent 66%); opacity: .35; animation: meshDrift 26s ease-in-out infinite; }

/* Scroll progress bar */
.scroll-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0%;
  background: var(--grad-orange); z-index: 1000;
  box-shadow: 0 0 12px rgba(236,90,26,.6);
}

/* Reveal mask for images (apenas com JS) */
.img-mask { position: relative; overflow: hidden; }
html.js .img-mask img { transform: scale(1.18); transition: transform 1.4s var(--ease-out); }
html.js .img-mask::after {
  content: ""; position: absolute; inset: 0; z-index: 2;
  background: var(--navy-800);
  transform: scaleY(1); transform-origin: bottom;
  transition: transform 1.1s var(--ease-out);
}
html.js .img-mask.in img { transform: scale(1); }
html.js .img-mask.in::after { transform: scaleY(0); }

/* Count-up nums use no special anim, JS drives text */

/* Magnetic hover lift for cards handled in components */

/* Number ticker */
.counter { font-variant-numeric: tabular-nums; }