/* ============================================
   Prime DB — Animações (2026 Refactor)
   @layer animations
   Scroll-driven + @starting-style + fallbacks
   ============================================ */

@layer animations {

/* ── FADE-IN-UP: JS fallback + native scroll-driven ── */
.fade-in-up {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity var(--duration-slow) var(--ease-out),
    transform var(--duration-slow) var(--ease-out);
}
.fade-in-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@supports (animation-timeline: view()) {
  @keyframes fade-in-up-keyframes {
    from { opacity: 0; transform: translateY(20px); }
    entry 20% { opacity: 1; transform: translateY(0); }
  }
  .fade-in-up-native {
    animation: fade-in-up-keyframes linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 30%;
  }
}

/* ── FADE-IN-SCALE: JS fallback + native ── */
.fade-in-scale {
  opacity: 0;
  transform: scale(0.95);
  transition:
    opacity var(--duration-slow) var(--ease-out),
    transform var(--duration-slow) var(--ease-out);
}
.fade-in-scale.is-visible {
  opacity: 1;
  transform: scale(1);
}

@supports (animation-timeline: view()) {
  @keyframes fade-in-scale-keyframes {
    from { opacity: 0; transform: scale(0.95); }
    entry 20% { opacity: 1; transform: scale(1); }
  }
  .fade-in-scale-native {
    animation: fade-in-scale-keyframes linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 25%;
  }
}

/* ── STAGGER CHILDREN: JS fallback + native ── */
.stagger-children > * {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity var(--duration-slow) var(--ease-out),
    transform var(--duration-slow) var(--ease-out);
}
.stagger-children.is-visible > *:nth-child(1) { transition-delay: 0ms; }
.stagger-children.is-visible > *:nth-child(2) { transition-delay: 100ms; }
.stagger-children.is-visible > *:nth-child(3) { transition-delay: 200ms; }
.stagger-children.is-visible > *:nth-child(4) { transition-delay: 300ms; }
.stagger-children.is-visible > *:nth-child(5) { transition-delay: 400ms; }
.stagger-children.is-visible > *:nth-child(6) { transition-delay: 500ms; }
.stagger-children.is-visible > *:nth-child(7) { transition-delay: 600ms; }
.stagger-children.is-visible > *:nth-child(8) { transition-delay: 700ms; }
.stagger-children.is-visible > * {
  opacity: 1;
  transform: translateY(0);
}

@supports (animation-timeline: view()) {
  @keyframes stagger-reveal {
    from { opacity: 0; transform: translateY(20px); }
    entry 25% { opacity: 1; transform: translateY(0); }
  }
  .stagger-children-native > * {
    animation: stagger-reveal linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 30%;
  }
}

/* ── SECTION REVEAL: JS fallback + scroll-driven ── */
.section-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .6s ease, transform .6s ease;
}
.section-reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

@supports (animation-timeline: view()) {
  @keyframes section-reveal-native {
    from { opacity: 0; transform: translateY(30px); }
    entry 25% { opacity: 1; transform: translateY(0); }
  }
  .section-reveal-native {
    animation: section-reveal-native linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 30%;
  }
}

/* ── @STARTING-STYLE: popover/modal entry ── */
.popover {
  opacity: 1;
  transition: opacity 0.3s, transform 0.3s;
}
@starting-style {
  .popover {
    opacity: 0;
    transform: scale(0.95);
  }
}

/* ── VISUALLY HIDDEN (sr-only) ── */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border-width: 0;
}

} /* /@layer animations */