/* ═══════════════════════════════════════════
   ALMASAYEL – ANIMATIONS
   أنيميشن دخول ناعم + تأثيرات هوفر احترافية
   (يُحمّل فقط لو مفعّل من Theme Options، والتأثيرات
    تشتغل بس لما الـ JS يضيف كلاس .alm-animate)
   ═══════════════════════════════════════════ */

/* ──────────────────────────────────────────
   SCROLL REVEAL
────────────────────────────────────────── */
.alm-animate .alm-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.alm-animate .alm-reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* ──────────────────────────────────────────
   HOVER – Button sheen (سحبة لمعان خفيفة)
────────────────────────────────────────── */
.alm-animate .alm-btn {
  position: relative;
  overflow: hidden;
}

.alm-animate .alm-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -130%;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 255, 255, 0.35),
    transparent
  );
  transform: skewX(-20deg);
  transition: left 0.6s ease;
  pointer-events: none;
}

.alm-animate .alm-btn:hover::after {
  left: 150%;
}

/* ──────────────────────────────────────────
   HOVER – Explore link (سهم ناعم)
────────────────────────────────────────── */
.alm-animate .alm-product-explore {
  position: relative;
  overflow: hidden;
}

.alm-animate .alm-product-explore::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
  transform: translateX(-100%);
  transition: transform 0.55s ease;
}

.alm-animate .alm-product-explore:hover::after {
  transform: translateX(100%);
}

/* ──────────────────────────────────────────
   HOVER – Card media subtle accent ring
────────────────────────────────────────── */
.alm-animate .alm-service-card,
.alm-animate .alm-target-card,
.alm-animate .alm-product-card,
.alm-animate .alm-vm-card,
.alm-animate .alm-brand-item {
  transition:
    transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.4s ease,
    border-color 0.4s ease;
}

/* ──────────────────────────────────────────
   HOVER – Nav links color glide already in style.css
   هنا بس نضيف انتقال أنعم للأيقونات
────────────────────────────────────────── */
.alm-animate .alm-service-icon,
.alm-animate .alm-target-icon {
  transition: color 0.4s ease, transform 0.4s ease;
}

.alm-animate .alm-service-card:hover .alm-service-icon,
.alm-animate .alm-target-card:hover .alm-target-icon {
  transform: scale(1.08);
}

/* ──────────────────────────────────────────
   ACCESSIBILITY – احترام تقليل الحركة
────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .alm-animate .alm-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .alm-animate .alm-btn::after,
  .alm-animate .alm-product-explore::after {
    display: none;
  }
}