/* ============================================================
   glass.css — glassmorphism-панелі, neon glow, hover-ефекти
   ============================================================ */

/* Базова скляна панель */
.glass {
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  box-shadow:
    0 10px 40px rgba(2, 6, 18, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transition:
    background .3s var(--ease),
    border-color .3s var(--ease),
    box-shadow .35s var(--ease),
    transform .3s var(--ease);
}

/* Інтерактивна скляна панель (карточки) */
.glass-hover:hover {
  background: var(--glass-bg-hover);
  border-color: var(--glass-border-hover);
  box-shadow:
    0 18px 54px rgba(2, 6, 18, 0.6),
    0 0 40px rgba(61, 123, 253, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.09);
  transform: translateY(-4px);
}

/* Сильне скло (модалки, навбар-дропдауни) */
.glass-strong {
  background: var(--glass-strong);
  border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: blur(26px) saturate(1.3);
  backdrop-filter: blur(26px) saturate(1.3);
  box-shadow: 0 24px 70px rgba(2, 6, 18, 0.7), inset 0 1px 0 rgba(255,255,255,.07);
}

/* Внутрішній spotlight, що слідкує за курсором (через CSS-змінні --mx / --my) */
.glass-spot::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  transition: opacity .35s;
  background: radial-gradient(
    420px circle at var(--mx, 50%) var(--my, 50%),
    rgba(110, 168, 255, 0.16),
    transparent 48%
  );
}
.glass-spot:hover::after { opacity: 1; }

/* Верхня неонова смужка на карточках */
.glow-line::before {
  content: '';
  position: absolute;
  top: 0; left: 12%; right: 12%;
  height: 1px;
  border-radius: 1px;
  background: linear-gradient(90deg, transparent, rgba(110, 168, 255, 0.55), transparent);
  opacity: 0;
  transition: opacity .35s;
}
.glow-line:hover::before { opacity: 1; }

/* Жовтий варіант неонової смужки */
.glow-line-gold::before {
  background: linear-gradient(90deg, transparent, rgba(255, 196, 45, 0.6), transparent);
}

/* Неоновий текст */
.neon-blue { color: var(--blue-2); text-shadow: 0 0 18px rgba(110, 168, 255, 0.65); }
.neon-gold { color: var(--yellow); text-shadow: 0 0 18px rgba(255, 196, 45, 0.65); }

/* Декоративні орби на фоні секцій */
.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
}
.orb-blue { background: rgba(61, 123, 253, 0.14); }
.orb-gold { background: rgba(255, 173, 32, 0.09); }
.orb-cyan { background: rgba(56, 214, 255, 0.1); }