/* Scroll & load animations */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(28px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes fadeInDown {
    from {
      opacity: 0;
      transform: translateY(-20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes fadeInRight {
    from {
      opacity: 0;
      transform: translateX(36px) scale(0.98);
    }
    to {
      opacity: 1;
      transform: translateX(0) scale(1);
    }
  }

  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  @keyframes scaleIn {
    from {
      opacity: 0;
      transform: scale(0.92);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }

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

  @keyframes arrowPulse {
    0%, 100% { opacity: 0.45; transform: translateX(0); }
    50% { opacity: 1; transform: translateX(4px); }
  }

  /* Page load (hero & header) */
  .anim-load-down {
    animation: fadeInDown 0.65s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  .anim-load-up {
    animation: fadeInUp 0.75s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  .anim-load-right {
    animation: fadeInRight 0.85s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  .anim-delay-1 { animation-delay: 0.1s; }
  .anim-delay-2 { animation-delay: 0.22s; }
  .anim-delay-3 { animation-delay: 0.34s; }
  .anim-delay-4 { animation-delay: 0.46s; }
  .anim-delay-5 { animation-delay: 0.58s; }

  .hero-car.anim-load-right {
    animation: fadeInRight 0.9s cubic-bezier(0.22, 1, 0.36, 1) both,
               floatSoft 5s ease-in-out 1.2s infinite;
  }

  /* Scroll reveal */
  .reveal {
    opacity: 0;
    transform: translateY(32px);
    transition:
      opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
      transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--reveal-delay, 0s);
  }

  .reveal.reveal-fade {
    transform: none;
  }

  .reveal.reveal-scale {
    transform: scale(0.94);
  }

  .reveal.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  /* Interactive hovers */
  .feature-card,
  .package-card,
  .order-form {
    transition:
      transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.3s cubic-bezier(0.22, 1, 0.36, 1),
      border-color 0.25s ease;
  }

  .feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
  }

  .package-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14);
  }

  .order-form:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 36px rgba(15, 23, 42, 0.1);
  }

  .btn {
    transition:
      transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.25s ease,
      background 0.2s ease;
  }

  .btn:hover {
    transform: translateY(-2px);
  }

  .btn:active {
    transform: translateY(0) scale(0.98);
  }

  .logo {
    transition: transform 0.25s ease, opacity 0.25s ease;
  }

  .logo:hover {
    transform: scale(1.02);
  }

  .step {
    transition: transform 0.3s ease;
  }

  .step:hover {
    transform: translateY(-4px);
  }

  .step-arrow {
    animation: arrowPulse 2s ease-in-out infinite;
  }

  .site-header {
    transition: box-shadow 0.3s ease, background 0.3s ease;
  }

  .site-header.is-scrolled {
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(8px);
  }

  .fc-check {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  }

  .feature-card:hover .fc-check {
    transform: scale(1.12);
  }
}