/* ══════════════════════════════════════════════════════════════
   TOPA TRADERS — Animation Styles
   قاعدة صارمة: لا شيء مخفي افتراضياً.
   كل قواعد الإخفاء مشروطة بالصنف .tp-anim الذي لا يضيفه
   topa-animations.js إلا بعد التأكد من عمل JavaScript ووجود
   IntersectionObserver. بدون ذلك تظهر الصفحة كاملة.
   ══════════════════════════════════════════════════════════════ */

/* ─── الظهور عند التمرير ─── */
.topa.tp-anim [data-rv]{
  opacity:0;transform:translateY(var(--shift));
  transition:opacity var(--dur) var(--ez),transform var(--dur) var(--ez);
}
.topa.tp-anim [data-rv].is-in{opacity:1;transform:none}

/* ─── كشف العنوان كلمة بعد كلمة ─── */
.topa.tp-anim .t-wd{
  display:inline-block;opacity:0;transform:translateY(18px);
  transition:opacity .58s var(--ez),transform .58s var(--ez);
}
.topa.tp-anim [data-rv].is-in .t-wd{opacity:1;transform:none}

/* الهيرو يدخل بمدة أطول قليلاً */
.topa.tp-anim .t-hero [data-rv]{transition-duration:.72s}

/* ─── حركة العناصر البصرية ─── */
.topa.tp-anim .t-ring:nth-of-type(1){animation:tpSpin 52s linear infinite}
.topa.tp-anim .t-ring:nth-of-type(2){animation:tpSpin 40s linear infinite reverse}
.topa.tp-anim .t-note{animation:tpFloat 9.5s ease-in-out infinite}
.topa.tp-anim .t-coin{animation:tpFloat2 8s ease-in-out infinite}
.topa.tp-anim .t-cndl{animation:tpFloat3 11s ease-in-out infinite}
.topa.tp-anim .t-vis .tp-orbit{animation:tpSpin 44s linear infinite;transform-origin:150px 150px}
.topa.tp-anim .t-vis .tp-orbit2{animation:tpSpin 32s linear infinite reverse;transform-origin:150px 150px}
.topa.tp-anim .t-vis .tp-pulse{animation:tpPulse 3.4s ease-in-out infinite}

/* توفير المعالج والبطارية خارج الشاشة */
.topa .t-stage.is-paused *,.topa .t-vis.is-paused *{animation-play-state:paused!important}

@keyframes tpSpin{to{transform:rotate(360deg)}}
@keyframes tpFloat{
  0%,100%{transform:rotateX(10deg) rotateY(-15deg) rotateZ(-5deg) translateY(0)}
  50%{transform:rotateX(8deg) rotateY(-12deg) rotateZ(-4deg) translateY(-10px)}}
@keyframes tpFloat2{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-13px) rotate(-3deg)}}
@keyframes tpFloat3{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes tpPulse{0%,100%{opacity:.28;transform:scale(1)}50%{opacity:.55;transform:scale(1.05)}}

/* ─── احترام تفضيل تقليل الحركة ─── */
@media (prefers-reduced-motion:reduce){
  .topa *,.topa *::before,.topa *::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
  .topa.tp-anim [data-rv],.topa.tp-anim .t-wd{opacity:1!important;transform:none!important}
  .topa .t-note,.topa .t-coin,.topa .t-cndl,.topa .t-ring,
  .topa .tp-orbit,.topa .tp-orbit2,.topa .tp-pulse{animation:none!important}
}

/* ─── الطباعة ─── */
@media print{
  .topa .t-sticky,.topa .t-mob,.topa .t-burger{display:none!important}
  .topa.tp-anim [data-rv],.topa.tp-anim .t-wd{opacity:1!important;transform:none!important}
  .topa.tp-js .t-q__p{height:auto!important}
}