/* ============================================================
   Social Stage — Custom Styles
   ============================================================ */

/* Base */
body { cursor: none; overflow-x: hidden; }
@media (pointer: coarse) { body { cursor: auto; } }

.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Custom Cursor */
#cursor {
  width: 8px; height: 8px;
  background: #C7B7E6;
  border-radius: 50%;
  position: fixed;
  pointer-events: none;
  z-index: 9999;
  transition: transform 0.15s ease;
}
@media (pointer: coarse) { #cursor { display: none; } }
.cursor-hover #cursor { transform: scale(6); mix-blend-mode: difference; }

/* Spotlight Gradient */
.spotlight {
  background: radial-gradient(circle at center, rgba(199, 183, 230, 0.15) 0%, transparent 70%);
}

/* Editorial Line */
.editorial-line { position: relative; }
.editorial-line::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 100%; height: 1px;
  background-color: rgba(255,255,255,0.2);
}
.editorial-line::before {
  content: '';
  position: absolute;
  bottom: -2px; right: 0;
  width: 4px; height: 4px;
  background-color: white;
  border-radius: 50%;
}

/* Marquee */
@keyframes marquee-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.marquee-container { overflow: hidden; white-space: nowrap; }
.marquee-content {
  display: inline-block;
  animation: marquee-scroll 30s linear infinite;
}

/* Smoke Particles */
.smoke-container {
  position: absolute; inset: 0;
  pointer-events: none; overflow: hidden; z-index: 5;
}
.smoke-particle {
  position: absolute;
  background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0) 70%);
  border-radius: 50%;
  filter: blur(40px);
  animation: smoke-drift 20s infinite ease-in-out;
  will-change: transform, opacity;
}
@keyframes smoke-drift {
  0%   { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 0.3; }
  33%  { transform: translate(30px, -50px) rotate(5deg) scale(1.1); opacity: 0.6; }
  66%  { transform: translate(-20px, -20px) rotate(-3deg) scale(0.95); opacity: 0.4; }
  100% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 0.3; }
}

/* Step Number Glow */
.step-number-glow { text-shadow: 0 0 20px rgba(199, 183, 230, 0.3); }

/* Column layout for about text */
.column-count-2 { column-count: 1; }
@media (min-width: 1024px) { .column-count-2 { column-count: 2; column-gap: 4rem; } }

/* GSAP initial states */
.gsap-reveal { opacity: 0; transform: translateY(60px); }
.gsap-stagger-parent > * { opacity: 0; transform: translateY(40px); }

/* Mobile menu */
.mobile-menu { transform: translateX(100%); transition: transform 0.3s ease; }
.mobile-menu.open { transform: translateX(0); }

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