/* ============================================================
   Retro ambient decor — floating rainbows, mushrooms, flowers, stars
   strategically placed in page gutters between content
   ============================================================ */

.retro-decor {
  position: absolute;
  pointer-events: none;
  z-index: 1;
  opacity: 0.92;
  animation: retro-float 7s ease-in-out infinite;
}
.retro-decor svg { width: 100%; height: 100%; display: block; transform: rotate(var(--rot, 0deg)); }
.retro-decor.is-spin svg { animation: retro-spin 22s linear infinite; }

@keyframes retro-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}
@keyframes retro-spin {
  from { transform: rotate(var(--rot, 0deg)); }
  to   { transform: rotate(calc(var(--rot, 0deg) + 360deg)); }
}

/* Section divider — a tiny rainbow with two clouds, sits between content blocks */
.retro-divider {
  position: relative;
  height: 130px;
  margin: -20px 0 -10px;
  pointer-events: none;
  overflow: hidden;
}
.retro-divider__rainbow {
  position: absolute;
  left: 50%; top: 14px;
  transform: translateX(-50%);
  width: 280px;
  opacity: 0.85;
}
.retro-divider__cloud-l,
.retro-divider__cloud-r {
  position: absolute;
  width: 80px;
  top: 56px;
  opacity: 0.9;
  animation: retro-float 6s ease-in-out infinite;
}
.retro-divider__cloud-l { left: calc(50% - 200px); transform: rotate(-4deg); }
.retro-divider__cloud-r { left: calc(50% + 120px); transform: rotate(3deg); animation-delay: -2s; }
.retro-divider__flower-l,
.retro-divider__flower-r {
  position: absolute;
  width: 38px;
  top: 78px;
  animation: retro-float 5s ease-in-out infinite;
}
.retro-divider__flower-l { left: calc(50% - 90px); transform: rotate(-12deg); animation-delay: -1s; }
.retro-divider__flower-r { left: calc(50% + 60px); transform: rotate(10deg); animation-delay: -2.5s; }

@media (max-width: 720px) {
  .retro-divider__rainbow { width: 200px; }
  .retro-divider__cloud-l { left: 4%; }
  .retro-divider__cloud-r { left: auto; right: 4%; }
  .retro-divider__flower-l, .retro-divider__flower-r { display: none; }
}

/* Edge-cluster — a knot of decor anchored to a corner/edge, behind content */
.retro-cluster {
  position: absolute;
  pointer-events: none;
  z-index: 1;
  width: 0; height: 0;
}
.retro-cluster .retro-decor { position: absolute; }

@media (prefers-reduced-motion: reduce) {
  .retro-decor, .retro-divider__cloud-l, .retro-divider__cloud-r,
  .retro-divider__flower-l, .retro-divider__flower-r,
  .retro-decor.is-spin svg { animation: none; }
}
