/* animations.css — Keyframes e classes de animação */

/* ── Keyframes base ─────────────────────────────────── */

@keyframes navbar-slide-down {
  from { transform: translateY(-100%); opacity: 0; }
  to   { transform: translateY(0);     opacity: 1; }
}

@keyframes fade-up {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: translateY(0);    }
}

@keyframes fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes scale-in {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1);    }
}

@keyframes word-reveal {
  from { transform: translateY(110%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

@keyframes image-reveal {
  from { clip-path: inset(100% 0 0 0); }
  to   { clip-path: inset(0% 0 0 0);  }
}

@keyframes line-expand {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@keyframes scroll-line {
  0%   { transform: scaleY(0); transform-origin: top; opacity: 1; }
  50%  { transform: scaleY(1); transform-origin: top; opacity: 1; }
  51%  { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
}

@keyframes whatsapp-pulse {
  0%   { box-shadow: 0 8px 32px rgba(184, 196, 172, 0.35); }
  50%  { box-shadow: 0 8px 48px rgba(184, 196, 172, 0.55), 0 0 0 8px rgba(184, 196, 172, 0.12); }
  100% { box-shadow: 0 8px 32px rgba(184, 196, 172, 0.35); }
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-8px); }
}

/* ── Classes de animação de entrada (scroll-reveal) ─── */

/* Estado inicial — antes de entrar na viewport */
[data-reveal] {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1s var(--ease-out-expo),
              transform 1s var(--ease-out-expo);
}

[data-reveal="image"] {
  opacity: 0;
  clip-path: inset(100% 0 0 0);
  transform: none;
  transition: opacity 0.01s,
              clip-path 1.1s var(--ease-out-expo);
}

[data-reveal="scale"] {
  opacity: 0;
  transform: scale(0.96);
  transition: opacity 0.8s var(--ease-out-expo),
              transform 0.8s var(--ease-out-expo);
}

[data-reveal="left"] {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 1s var(--ease-out-expo),
              transform 1s var(--ease-out-expo);
}

[data-reveal="right"] {
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 1s var(--ease-out-expo),
              transform 1s var(--ease-out-expo);
}

[data-reveal="line"] {
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 1.2s var(--ease-out-expo);
}

/* Estado visível — após entrar na viewport */
[data-reveal].is-revealed {
  opacity: 1;
  transform: translateY(0) translateX(0) scale(1);
  clip-path: inset(0% 0 0 0);
}

[data-reveal="line"].is-revealed {
  transform: scaleX(1);
}

/* Delays escalonados para grupos */
[data-delay="100"] { transition-delay: 0.10s; }
[data-delay="200"] { transition-delay: 0.20s; }
[data-delay="300"] { transition-delay: 0.30s; }
[data-delay="400"] { transition-delay: 0.40s; }
[data-delay="500"] { transition-delay: 0.50s; }
[data-delay="600"] { transition-delay: 0.60s; }
[data-delay="700"] { transition-delay: 0.70s; }
[data-delay="800"] { transition-delay: 0.80s; }

/* ── Animações do Hero (carregamento) ───────────────── */

/* Keyframe exclusivo: pulso infinito da linha de scroll */
@keyframes hero-scroll-pulse {
  0%         { transform: scaleY(0); transform-origin: top;    opacity: 0.4; }
  45%        { transform: scaleY(1); transform-origin: top;    opacity: 0.4; }
  46%        { transform: scaleY(1); transform-origin: bottom; opacity: 0.4; }
  100%       { transform: scaleY(0); transform-origin: bottom; opacity: 0;   }
}

/* Keyframe: expansão horizontal das linhas do eyebrow */
@keyframes eyebrow-line-expand {
  from { width: 0;    opacity: 0; }
  to   { width: 40px; opacity: 0.45; }
}

/* Ornamento SVG — scale-in sutil */
.hero__ornament {
  opacity: 0;
  transform: scale(0.9);
  animation: scale-in 0.8s var(--ease-out-expo) 0.2s forwards;
}

/* Label eyebrow — fade-up */
.hero__eyebrow {
  opacity: 0;
  animation: fade-up 0.8s var(--ease-out-expo) 0.4s forwards;
}

/* Linhas laterais do eyebrow — expandem após o label aparecer */
.hero__eyebrow-line {
  width: 0;
  opacity: 0;
  animation: eyebrow-line-expand 0.8s var(--ease-out-expo) 0.6s forwards;
}

/* Título — cada palavra com delay escalonado */
.hero__title .word-inner {
  display: inline-block;
  animation: word-reveal 1s var(--ease-out-expo) both;
}

.hero__title .word:nth-child(1) .word-inner { animation-delay: 0.70s; }
.hero__title .word:nth-child(2) .word-inner { animation-delay: 0.78s; }
.hero__title .word:nth-child(3) .word-inner { animation-delay: 0.86s; }
.hero__title .word:nth-child(4) .word-inner { animation-delay: 0.94s; }
.hero__title .word:nth-child(5) .word-inner { animation-delay: 1.02s; }
.hero__title .word:nth-child(6) .word-inner { animation-delay: 1.10s; }
.hero__title .word:nth-child(7) .word-inner { animation-delay: 1.18s; }

/* Parágrafo lead */
.hero__lead {
  opacity: 0;
  animation: fade-up 0.9s var(--ease-out-expo) 1.4s forwards;
}

/* Ações — container anima junto */
.hero__actions {
  opacity: 0;
  animation: fade-up 0.9s var(--ease-out-expo) 1.7s forwards;
}

/* Scroll indicator — fade-in tardio, depois ativa o pulso */
.hero__scroll-indicator {
  opacity: 0;
  animation: fade-in 0.8s ease 2.2s forwards;
}

.hero__scroll-indicator.is-visible .hero__scroll-line {
  animation-play-state: running;
}

/* ── Overrides mobile ───────────────────────────────── */

@media (max-width: 768px) {
  /* Reduz deslocamento e duração das animações de entrada */
  [data-reveal] {
    transform: translateY(20px);
    transition: opacity 0.7s var(--ease-out-expo),
                transform 0.7s var(--ease-out-expo);
  }

  [data-reveal="left"] {
    transform: translateX(-15px);
    transition: opacity 0.7s var(--ease-out-expo),
                transform 0.7s var(--ease-out-expo);
  }

  [data-reveal="right"] {
    transform: translateX(15px);
    transition: opacity 0.7s var(--ease-out-expo),
                transform 0.7s var(--ease-out-expo);
  }

  [data-reveal="image"] {
    transition: opacity 0.01s,
                clip-path 0.8s var(--ease-out-expo);
  }

  /* Desativa parallax no mobile */
  [data-parallax] img,
  [data-parallax],
  .sobre-imagem-wrapper img {
    transform: none !important;
  }
}