/* Animations */

@keyframes bounce-y {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(6px); }
}

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

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

@keyframes float-card {
  0%, 100% { transform: translateY(0px) rotate(-0.5deg); }
  50%       { transform: translateY(-14px) rotate(0.5deg); }
}

@keyframes cursor-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

@keyframes type-reveal {
  from { max-width: 0; }
  to   { max-width: 100%; }
}

@keyframes hero-orb-drift {
  0%   { transform: translate(0, 0) scale(1); }
  25%  { transform: translate(-4%, 3%) scale(1.06); }
  50%  { transform: translate(3%, -2%) scale(1.12); }
  75%  { transform: translate(-2%, 4%) scale(1.04); }
  100% { transform: translate(0, 0) scale(1); }
}
@keyframes hero-orb-drift-2 {
  0%   { transform: translate(0, 0) scale(1); }
  33%  { transform: translate(5%, -3%) scale(1.1); }
  66%  { transform: translate(-3%, 4%) scale(1.05); }
  100% { transform: translate(0, 0) scale(1); }
}

@keyframes pulse-ring {
  0%   { box-shadow: 0 0 0 0 rgba(224,104,58,.35); }
  70%  { box-shadow: 0 0 0 10px rgba(224,104,58,0); }
  100% { box-shadow: 0 0 0 0 rgba(224,104,58,0); }
}

/* Reveal on scroll */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.65s cubic-bezier(.22,.68,0,1.1),
              transform 0.65s cubic-bezier(.22,.68,0,1.1);
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 80ms; }
.reveal-delay-2 { transition-delay: 160ms; }
.reveal-delay-3 { transition-delay: 240ms; }
.reveal-delay-4 { transition-delay: 320ms; }
.reveal-delay-5 { transition-delay: 400ms; }
.reveal-delay-6 { transition-delay: 480ms; }

/* Hero entrance stagger */
.hero__content > * {
  animation: fade-up 0.75s cubic-bezier(.22,.68,0,1.1) both;
}
.hero__content > *:nth-child(1) { animation-delay: 120ms; }
.hero__content > *:nth-child(2) { animation-delay: 210ms; }
.hero__content > *:nth-child(3) { animation-delay: 300ms; }
.hero__content > *:nth-child(4) { animation-delay: 380ms; }

.hero__visual {
  animation: fade-in 0.9s ease 0.45s both;
}

/* Typing animation on hero headline — SEO-safe: text is always in the DOM */
@media (prefers-reduced-motion: no-preference) {
  .hero__hl-type {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    max-width: 0;
    vertical-align: bottom;
    animation: type-reveal 1.1s steps(22, end) 1.1s forwards;
  }
  .hero__hl-type::after {
    content: '|';
    color: var(--brand-secondary);
    font-weight: 300;
    animation: cursor-blink 0.75s step-end 1.1s infinite;
  }
}

/* Mockup card float */
@media (prefers-reduced-motion: no-preference) {
  .hero__mockup {
    animation: float-card 5.5s ease-in-out infinite;
  }
}

/* Reduced-motion overrides */
@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; }
  .hero__hl-type { max-width: 100% !important; white-space: normal; }
}