/* ========================================
   FEIER MIT HERZ — Animations
   ======================================== */

/* --- Keyframes --- */
@keyframes fadeInUp   { from { opacity:0; transform:translateY(30px);  } to { opacity:1; transform:none; } }
@keyframes fadeInDown { from { opacity:0; transform:translateY(-24px); } to { opacity:1; transform:none; } }
@keyframes fadeIn     { from { opacity:0; } to { opacity:1; } }
@keyframes scaleIn    { from { opacity:0; transform:scale(0.94); }      to { opacity:1; transform:scale(1); } }

@keyframes scrollLine {
  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 shimmer {
  0%   { background-position:-200% center; }
  100% { background-position: 200% center; }
}

@keyframes lineGrow {
  from { width:0; }
  to   { width:60px; }
}

/* --- Scroll Reveal --- */
.reveal, .reveal-left, .reveal-right, .reveal-scale {
  opacity: 0;
  will-change: opacity, transform;
  transition: opacity 0.75s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.75s cubic-bezier(0.4, 0, 0.2, 1);
}
.reveal       { transform: translateY(28px); }
.reveal-left  { transform: translateX(-32px); }
.reveal-right { transform: translateX(32px); }
.reveal-scale { transform: scale(0.95); }

.reveal.visible, .reveal-left.visible,
.reveal-right.visible, .reveal-scale.visible {
  opacity: 1; transform: none;
}

/* --- Stagger --- */
.stagger > * {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.stagger.visible > *:nth-child(1) { transition-delay: 0.05s; }
.stagger.visible > *:nth-child(2) { transition-delay: 0.15s; }
.stagger.visible > *:nth-child(3) { transition-delay: 0.25s; }
.stagger.visible > *:nth-child(4) { transition-delay: 0.35s; }
.stagger.visible > *:nth-child(5) { transition-delay: 0.45s; }
.stagger.visible > *:nth-child(6) { transition-delay: 0.55s; }
.stagger.visible > * { opacity: 1; transform: none; }

/* --- Hero Entrance --- */
.hero__content .label        { animation: fadeInDown 0.7s ease both; animation-delay: 0.3s; }
.hero__content h1            { animation: fadeInUp  0.9s ease both; animation-delay: 0.5s; }
.hero__content .hero__subtitle { animation: fadeInUp 0.9s ease both; animation-delay: 0.7s; }
.hero__content .btn-group    { animation: fadeInUp  0.9s ease both; animation-delay: 0.9s; }
.hero__scroll                { animation: fadeIn    1.0s ease both; animation-delay: 1.4s; }

/* --- Nav Entrance --- */
.nav { animation: fadeInDown 0.6s ease both; }

/* --- Section Line --- */
.section-header__line { animation: lineGrow 0.8s ease both; animation-play-state: paused; }
.section-header.visible .section-header__line { animation-play-state: running; }

/* --- Cursor --- */
@media (hover: hover) {
  .cursor-dot {
    position: fixed; width: 8px; height: 8px;
    background: var(--color-primary); border-radius: 50%;
    pointer-events: none; z-index: 9999;
    transform: translate(-50%,-50%);
    transition: transform 0.1s ease, opacity 0.3s ease;
    opacity: 0;
  }
  .cursor-ring {
    position: fixed; width: 28px; height: 28px;
    pointer-events: none; z-index: 9998;
    transform: translate(-50%, -44%);
    transition: width 0.3s ease, height 0.3s ease, opacity 0.3s ease;
    opacity: 0;
    background: var(--color-primary);
    clip-path: path('M14 25 C14 25 2 17 2 9 A6 6 0 0 1 14 6 A6 6 0 0 1 26 9 C26 17 14 25 14 25 Z');
  }
  body:hover .cursor-dot, body:hover .cursor-ring { opacity: 1; }
}

/* --- Page Transition --- */
.page-transition {
  position: fixed; inset: 0;
  background: var(--color-light);
  z-index: 9999;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.35s ease;
}
.page-transition.active { opacity: 1; pointer-events: all; }

/* --- Reduced Motion --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .reveal, .reveal-left, .reveal-right, .reveal-scale { opacity: 1; transform: none; }
  .stagger > * { opacity: 1; transform: none; }
}
