﻿/* ==========================================================================
   أبعاد جلوبال — Keyframe Animations v2
   ========================================================================== */

/* ── Hero image parallax entry ── */
@keyframes heroZoom {
  from { transform: scale(1.12); }
  to   { transform: scale(1.04); }
}
.hero-bg img,
.hero-bg video { animation: heroZoom 9s cubic-bezier(0.16,1,0.3,1) forwards; }

/* ── Hero text entrance ── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hero [data-ha] {
  opacity: 0;
  animation: fadeUp 1s cubic-bezier(0.16,1,0.3,1) forwards;
}
.hero [data-ha="1"] { animation-delay: 0.15s; }
.hero [data-ha="2"] { animation-delay: 0.30s; }
.hero [data-ha="3"] { animation-delay: 0.45s; }
.hero [data-ha="4"] { animation-delay: 0.60s; }
.hero [data-ha="5"] { animation-delay: 0.75s; }

/* ── Vertical scroll line ── */
@keyframes lineGrow {
  0%   { opacity: 0; transform: scaleY(0); transform-origin: top; }
  50%  { opacity: 1; transform: scaleY(1); transform-origin: top; }
  100% { opacity: 0; transform: scaleY(1); transform-origin: bottom; }
}

/* ── Counter shimmer (number counting running) ── */
@keyframes countPulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.7; }
}

/* ── Partners infinite marquee ── */
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.partners-track { animation: marquee 28s linear infinite; }
.partners-wrap:hover .partners-track { animation-play-state: paused; }

/* ── Floating badge bob ── */
@keyframes bob {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-6px); }
}
.about-badge { animation: bob 5s ease-in-out infinite; }

/* ── Gold shimmer on text ── */
@keyframes goldShimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}
.shimmer-gold {
  background: linear-gradient(90deg, var(--c-gold) 0%, var(--c-gold-light) 40%, var(--c-gold) 60%, var(--c-gold-deep) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: goldShimmer 4.5s linear infinite;
}

/* ── Skeleton loading ── */
@keyframes skeleton {
  0%   { background-position: -400px 0; }
  100% { background-position: 400px 0; }
}
.skeleton {
  background: linear-gradient(90deg, var(--c-bg-section) 25%, #ece9e1 50%, var(--c-bg-section) 75%);
  background-size: 800px 100%;
  animation: skeleton 1.8s infinite;
}

/* ── Lazy image fade in ── */
img[data-src] { opacity: 0; transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1); }
img.loaded     { opacity: 1; }

/* ── Reduced motion override ── */
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal], .img-reveal { opacity: 1 !important; transform: none !important; }
  .hero [data-ha] { opacity: 1 !important; animation: none !important; }
  .hero-bg img,
  .hero-bg video { animation: none !important; transform: scale(1.04); }
  .about-badge { animation: none !important; }
}

