/* =========================================================================
   VoltryX — Floating section objects (chrome shapes per section)
   ========================================================================= */

.sec-obj-pin {
  position: sticky;
  top: 18vh;
  height: 0;
  width: 100%;
  pointer-events: none;
  z-index: 0;
}

.sec-obj {
  position: absolute;
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  filter: drop-shadow(0 0 18px rgba(124, 58, 237, 0.22))
          drop-shadow(0 0 50px rgba(167, 139, 250, 0.1));
  transition: opacity 1.4s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}
.sec-obj.is-in { opacity: 0.38; }

.sec-obj svg { width: 100%; height: 100%; display: block; }

/* Slow spin baseline */
.sec-obj-rotate { animation: obj-rotate 60s linear infinite; transform-origin: center; }
.sec-obj-rotate-rev { animation: obj-rotate 80s linear infinite reverse; }
@keyframes obj-rotate { to { transform: rotate(360deg); } }

/* Float */
@keyframes obj-float {
  0%,100% { transform: translateY(0) translateX(0); }
  50%     { transform: translateY(-18px) translateX(8px); }
}
.sec-obj-float { animation: obj-float 14s ease-in-out infinite; }

/* Pulse */
@keyframes obj-pulse {
  0%,100% { transform: scale(1); }
  50%     { transform: scale(1.06); }
}
.sec-obj-pulse { animation: obj-pulse 10s ease-in-out infinite; }

/* Section-specific positioning (relative to the sticky .sec-obj-pin) */
.thesis        .sec-obj { width: 460px; height: 460px; top: 0;   right: 4%; }
#anatomy       .sec-obj { width: 520px; height: 520px; top: 0;   left: -8%; }
#platform      .sec-obj { width: 540px; height: 540px; top: 0;   right: -6%; }
#layers        .sec-obj { width: 480px; height: 480px; top: 0;   left: -4%; }
#numbers       .sec-obj { width: 500px; height: 500px; top: 0;   right: -8%; }
#customers     .sec-obj { width: 560px; height: 560px; top: 0;   left: 50%; margin-left: -280px; }
#pricing       .sec-obj { width: 520px; height: 520px; top: 0;   right: -6%; }

@media (max-width: 900px) {
  .sec-obj { display: none; }
}

/* Cursor-tracked tilt wrapper (set via JS on transform) */
.sec-obj-tilt {
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}