/* ═══════════════════════════════════════════
   COMMUNITY
═══════════════════════════════════════════ */
#community { padding: 160px 24px; position: relative; overflow: hidden; }
#community::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 100% 100% at 50% 50%,
    rgba(168,85,247,0.15) 0%, rgba(0,245,255,0.07) 40%, transparent 70%);
  animation: community-bg 10s ease-in-out infinite alternate;
}
@keyframes community-bg {
  0%   { filter: hue-rotate(0deg) brightness(1); }
  100% { filter: hue-rotate(30deg) brightness(1.2); }
}

.bubble {
  position: absolute; border-radius: 50%; opacity: 0.04;
  animation: float-bubble linear infinite;
}
@keyframes float-bubble {
  0%   { transform: translateY(100vh) scale(0.5); opacity: 0; }
  10%  { opacity: 0.04; }
  90%  { opacity: 0.04; }
  100% { transform: translateY(-20vh) scale(1.2); opacity: 0; }
}

/* Glassmorphism orbs */
.glass-orb {
  position: absolute; border-radius: 50%;
  filter: blur(45px); pointer-events: none;
  animation: orb-drift ease-in-out infinite alternate;
}
@keyframes orb-drift {
  0%   { transform: translateY(0) scale(1) rotate(0deg); }
  100% { transform: translateY(-50px) scale(1.1) rotate(20deg); }
}

.community-inner { position: relative; z-index: 2; max-width: 800px; margin: 0 auto; text-align: center; }

/* Avatar ring */
.avatar-ring-wrap {
  position: relative; width: 220px; height: 220px;
  margin: 0 auto 44px;
}

.avatar-orbit {
  position: absolute; top: 50%; left: 50%;
  width: 200px; height: 200px;
  transform: translate(-50%, -50%);
  animation: orbit-spin 14s linear infinite;
}
@keyframes orbit-spin { from { transform: translate(-50%,-50%) rotate(0deg); } to { transform: translate(-50%,-50%) rotate(360deg); } }
.avatar-node {
  position: absolute; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Space Grotesk', sans-serif; font-size: 11px; font-weight: 700;
  border: 2px solid; animation: counter-spin 14s linear infinite;
}
@keyframes counter-spin { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } }

.avatar-ring-center {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 96px; height: 96px; border-radius: 50%;
  background: linear-gradient(135deg, #00aff0, #0066cc);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 40px rgba(0,175,240,0.3), 0 0 80px rgba(0,175,240,0.15);
  animation: ring-pulse 3s ease-in-out infinite; z-index: 2;
}
@keyframes ring-pulse {
  0%,100% { box-shadow: 0 0 40px rgba(0,175,240,0.3), 0 0 80px rgba(0,175,240,0.15); }
  50%      { box-shadow: 0 0 60px rgba(0,175,240,0.5), 0 0 120px rgba(0,175,240,0.25); }
}
.avatar-ring-center svg { width: 48px; height: 48px; fill: white; }

/* Activity ticker */
#activity-ticker {
  position: relative; z-index: 2; max-width: 400px; margin: 0 auto 48px;
  height: 44px; overflow: hidden;
  border: 1px solid rgba(255,255,255,0.08); border-radius: 8px;
  background: rgba(255,255,255,0.03); backdrop-filter: blur(12px);
}
.ticker-item {
  display: flex; align-items: center; gap: 10px;
  height: 44px; padding: 0 16px;
  font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--muted);
  position: absolute; top: 0; left: 0; right: 0;
  opacity: 0; transform: translateY(100%);
  transition: opacity 0.4s, transform 0.4s;
}
.ticker-item.active { opacity: 1; transform: translateY(0); }
.ticker-item.exiting { opacity: 0; transform: translateY(-100%); }
.ticker-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.ticker-name { color: var(--text); font-weight: 700; }

.community-headline {
  font-family: 'Space Grotesk', sans-serif; font-size: clamp(36px, 6vw, 72px);
  font-weight: 800; line-height: 1.05; margin-bottom: 24px; opacity: 0;
}
.community-headline span {
  background: linear-gradient(135deg, var(--cyan), var(--purple), var(--pink));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.community-sub { font-size: clamp(16px, 2vw, 20px); color: var(--muted); line-height: 1.7; margin-bottom: 52px; opacity: 0; }
.community-cta-wrap { opacity: 0; }
.social-proof { margin-top: 28px; font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: 0.15em; color: var(--muted); }
.social-proof .dot { margin: 0 10px; color: rgba(255,255,255,0.15); }

/* Live count */
.live-count {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 16px; font-family: 'JetBrains Mono', monospace;
  font-size: 12px; color: var(--green); letter-spacing: 0.08em;
}
.live-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); animation: status-pulse 1.5s ease-in-out infinite; }