/* ==========================================================================
   Sula Alaçatı — motion / animation layer (extends style.css)
   ========================================================================== */

@keyframes sula-fade-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes sula-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes sula-zoom {
  from { opacity: 0; transform: scale(.92); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes sula-shimmer {
  0%   { background-position: -150% 0; }
  100% { background-position: 150% 0; }
}
@keyframes sula-slide-left {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes sula-slide-right {
  from { opacity: 0; transform: translateX(-40px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* Entrance animations on the hero */
.hero__eyebrow,
.hero__title,
.hero__subtitle,
.hero__ctas {
  opacity: 0;
  transform: translateY(40px);
  animation: sula-fade-up 1.4s var(--ease-out, cubic-bezier(.2,.7,.2,1)) forwards;
}
.hero__title    { animation-delay: .2s; }
.hero__subtitle { animation-delay: .45s; }
.hero__ctas     { animation-delay: .7s; }

/* Slowly zoom the hero video */
.hero__video {
  animation: sula-hero-zoom 16s ease-in-out infinite alternate;
}
@keyframes sula-hero-zoom {
  from { transform: scale(1.04); }
  to   { transform: scale(1.14); }
}

/* Subtle header shine on the wordmark */
.brand__name {
  background-image: linear-gradient(110deg, currentColor 30%, var(--gold-400) 50%, currentColor 70%);
  background-size: 220% 100%;
  background-position: 200% 0;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: sula-shimmer 6s linear infinite;
}

/* The CTA banner subtle bg shift */
.section--cta-banner {
  background-size: 200% 200%;
  animation: sula-cta-move 18s ease-in-out infinite alternate;
}
@keyframes sula-cta-move {
  from { background-position: 0% 0%; }
  to   { background-position: 100% 100%; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1; transform: none; }
}