/* PayTok — global styles */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Card shadows for the hero mockup */
.card-shadow {
  filter: drop-shadow(0 30px 50px rgba(0,0,0,0.45));
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.card-shadow:hover { transform: translateY(-6px); }

.card-inner {
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* subtle animated gradient ring */
@keyframes ringSpin { to { transform: rotate(360deg); } }
.spin-ring { animation: ringSpin 20s linear infinite; }

/* fade-in on load */
.fade-in { animation: fadeUp 0.8s cubic-bezier(0.22, 1, 0.36, 1) both; }
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* glow text */
.glow-text { text-shadow: 0 0 40px rgba(0,242,234,0.35); }

/* marquee for ticker */
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.marquee { animation: marquee 30s linear infinite; }

/* anchor offset for fixed header */
section[id] { scroll-margin-top: 80px; }

/* hide horizontal overflow for marquees */
.no-overflow { overflow: hidden; }

/* RTL (Arabic) tweaks — flex-direction row auto-flips under dir=rtl,
   but a few elements need explicit mirroring. */
[dir="rtl"] .flip-on-rtl { transform: scaleX(-1); }
[dir="rtl"] .rotate-rtl-180 { transform: rotate(180deg); }