/*
 * Design Taste local motion primitives.
 * These classes are intentionally CSS-only so generated Twig can add a little
 * polish without pulling remote scripts or unpredictable runtime libraries.
 */
:root {
  --dt-motion-distance: 18px;
  --dt-motion-duration: 620ms;
  --dt-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.dt-fade-in {
  animation: dt-fade-in var(--dt-motion-duration) var(--dt-motion-ease) both;
}

.dt-reveal,
.dt-reveal-up {
  animation: dt-reveal-up var(--dt-motion-duration) var(--dt-motion-ease) both;
}

.dt-stagger-soft > * {
  animation: dt-reveal-up var(--dt-motion-duration) var(--dt-motion-ease) both;
}

.dt-stagger-soft > *:nth-child(2) {
  animation-delay: 80ms;
}

.dt-stagger-soft > *:nth-child(3) {
  animation-delay: 160ms;
}

.dt-stagger-soft > *:nth-child(4) {
  animation-delay: 240ms;
}

.dt-stagger-soft > *:nth-child(5) {
  animation-delay: 320ms;
}

.dt-stagger-soft > *:nth-child(6) {
  animation-delay: 400ms;
}

.dt-hover-lift {
  transition: transform 220ms var(--dt-motion-ease), box-shadow 220ms var(--dt-motion-ease), border-color 220ms var(--dt-motion-ease);
}

.dt-hover-lift:hover {
  transform: translateY(-3px);
}

.dt-soft-float {
  animation: dt-soft-float 7s ease-in-out infinite;
}

.dt-pressable {
  transition: transform 160ms var(--dt-motion-ease);
}

.dt-pressable:active {
  transform: translateY(1px) scale(0.99);
}

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

@keyframes dt-reveal-up {
  from {
    opacity: 0;
    transform: translateY(var(--dt-motion-distance));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

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

@media (prefers-reduced-motion: reduce) {
  .dt-fade-in,
  .dt-reveal,
  .dt-reveal-up,
  .dt-stagger-soft > *,
  .dt-soft-float {
    animation: none !important;
  }

  .dt-hover-lift,
  .dt-pressable {
    transition: none !important;
  }

  .dt-hover-lift:hover,
  .dt-pressable:active {
    transform: none !important;
  }
}