/* Shared section glow system — ambient pulse, rising particles with repulsion */

.glow-bg {
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:90%; height:80%;
  border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(255,106,0,.26) 0%, transparent 65%);
  animation:glowambient 5s ease-in-out infinite;
  pointer-events:none;
  z-index:0;
}
@keyframes glowambient {
  0%, 100% { opacity:.6; transform:translate(-50%,-50%) scale(.88); }
  50%       { opacity:1;  transform:translate(-50%,-50%) scale(1.12); }
}

/* Section content wrapper — sits above all glow layers */
.glow-inner {
  position:relative;
  z-index:2;
}

/* Baseline text glow for all initGlowSection sections */
.glow-section .sl {
  animation:glowlabel 4s ease-in-out infinite;
}
.glow-section .st {
  animation:glowheading 4s ease-in-out infinite;
  animation-delay:.6s;
}
@keyframes glowlabel {
  0%,100% { filter:drop-shadow(0 0 8px rgba(255,106,0,.6)) drop-shadow(0 0 2px rgba(255,106,0,.36)); }
  50%      { filter:drop-shadow(0 0 22px rgba(255,106,0,1)) drop-shadow(0 0 8px rgba(255,106,0,.84)); }
}
@keyframes glowheading {
  0%,100% { filter:drop-shadow(0 0 5px rgba(255,106,0,.18)); }
  50%      { filter:drop-shadow(0 0 22px rgba(255,106,0,.54)) drop-shadow(0 0 5px rgba(255,106,0,.24)); }
}

/* Cursor-following radial overlay — tracks mouse via CSS vars --gx/--gy */
.glow-cursor {
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:radial-gradient(circle 420px at var(--gx,50%) var(--gy,50%), rgba(255,106,0,.22) 0%, transparent 60%);
  opacity:0;
  will-change:opacity;
}

/* Particle layer — mask fades particles at all four edges */
.glow-particle-layer {
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:radial-gradient(ellipse 88% 82% at 50% 50%, black 35%, transparent 100%);
          mask-image:radial-gradient(ellipse 88% 82% at 50% 50%, black 35%, transparent 100%);
}

/* Zero-size anchor — carries the repulsion transform; inner particle carries the rise animation */
.glow-particle-wrapper {
  position:absolute;
  width:0; height:0;
  pointer-events:none;
  will-change:transform;
}

/* Inner particle — rise animation only, no position (wrapper anchors it) */
.glow-particle {
  position:absolute;
  border-radius:50%;
  background:rgba(255,255,255,.75);
  pointer-events:none;
  animation:glowparticlerise linear infinite;
}
@keyframes glowparticlerise {
  0%   { transform:translateY(0) scale(0);     opacity:0; }
  12%  { transform:translateY(-24px) scale(1);  opacity:1; }
  88%  {                                         opacity:.2; }
  100% { transform:translateY(-180px) scale(.2); opacity:0; }
}