/* ══════════════════════════════════════════════════════════════
   پویانمایی صحنه‌های SVG — همه با prefers-reduced-motion خاموش می‌شوند
   ══════════════════════════════════════════════════════════════ */

.scene {
  width: 100%;
  height: 100%;
}

/* توحید: پرتوها، ابرها */
.scene .ray {
  transform-box: view-box;
  transform-origin: 200px 300px;
  animation: raySway 13s ease-in-out infinite alternate;
}
.scene .ray.r2 { animation-duration: 17s; animation-delay: -3s; }
.scene .ray.r3 { animation-duration: 15s; animation-delay: -7s; }
.scene .ray.r4 { animation-duration: 11s; animation-delay: -2s; }

@keyframes raySway {
  from { opacity: 0.5; transform: rotate(-2.4deg) scaleY(0.94); }
  to   { opacity: 0.95; transform: rotate(2.4deg) scaleY(1.03); }
}

.scene .cloud {
  animation: drift 38s ease-in-out infinite alternate;
}
.scene .cloud.c2 { animation-duration: 52s; animation-delay: -8s; }
.scene .cloud.c3 { animation-duration: 44s; animation-delay: -16s; opacity: 0.8; }

@keyframes drift {
  from { transform: translateX(-16px); }
  to   { transform: translateX(22px); }
}

/* احکام: طومار شناور و غبار */
.scene .float {
  transform-box: view-box;
  transform-origin: 200px 214px;
  animation: floaty 7s ease-in-out infinite alternate;
}

@keyframes floaty {
  from { transform: translate(200px, 212px) rotate(-7deg); }
  to   { transform: translate(200px, 205px) rotate(-4.4deg); }
}

.scene .mote {
  animation: moteRise 9s ease-in-out infinite;
}
.scene .mote.m2 { animation-duration: 12s; animation-delay: -3s; }
.scene .mote.m3 { animation-duration: 10.5s; animation-delay: -6s; }

@keyframes moteRise {
  0%   { transform: translateY(8px); opacity: 0; }
  25%  { opacity: 0.85; }
  70%  { opacity: 0.5; }
  100% { transform: translateY(-30px); opacity: 0; }
}

/* غرب‌شناسی: کرهٔ هولوگرافیک، رصد، اسکن */
.scene .globe-spin {
  transform-box: fill-box;
  transform-origin: center;
  animation: globeSpin 26s linear infinite;
}

@keyframes globeSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

.scene .orbit-node {
  transform-box: view-box;
  transform-origin: 272px 112px;
  animation: globeSpin 14s linear infinite;
}

.scene .scan {
  transform-box: view-box;
  animation: scanDown 7s linear infinite;
}

@keyframes scanDown {
  from { transform: translateY(-70px); }
  to   { transform: translateY(320px); }
}

/* جزیره زن: گلبرگ‌ها و شکوفه‌ها */
.scene .petal {
  transform-box: fill-box;
  transform-origin: center;
  animation: petalFall linear infinite;
  opacity: 0;
}

@keyframes petalFall {
  0%   { transform: translate(0, -20px) rotate(0deg) scale(var(--s, 1)); opacity: 0; }
  12%  { opacity: 0.9; }
  85%  { opacity: 0.75; }
  100% { transform: translate(var(--dx, 10px), 330px) rotate(240deg) scale(var(--s, 1)); opacity: 0; }
}

.scene .blossom {
  transform-box: fill-box;
  transform-origin: center;
  animation: blossomSway 6s ease-in-out infinite alternate;
}
.scene .blossom:nth-of-type(2n) { animation-duration: 8s; animation-delay: -2s; }
.scene .blossom:nth-of-type(3n) { animation-duration: 7s; animation-delay: -4s; }

@keyframes blossomSway {
  from { transform: rotate(-1.6deg) scale(0.99); }
  to   { transform: rotate(1.6deg) scale(1.02); }
}

.scene .lantern {
  animation: lanternPulse 5s ease-in-out infinite;
}

@keyframes lanternPulse {
  0%, 100% { opacity: 0.85; }
  50%      { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .scene .petal { opacity: 0.5; }
}

/* ───────── تصویر تولیدشده به‌جای صحنهٔ SVG ───────── */

.artimg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.isle__art .artimg {
  transition: scale 0.9s var(--ease);
}

.islehero__art .artimg {
  object-position: center 42%;
}

@media (prefers-reduced-motion: no-preference) {
  .artimg {
    animation: artIn 0.9s var(--ease) both;
  }
}

@keyframes artIn {
  from {
    opacity: 0;
    scale: 1.04;
  }
  to {
    opacity: 1;
    scale: 1;
  }
}
