/* Neon moving CTA border (scoped, does not affect other buttons) */
.btn-neon-moving {
  --neon-angle: 0deg;
  position: relative;
  isolation: isolate;
  overflow: visible;
  z-index: 0;
}

.btn-neon-moving::before,
.btn-neon-moving::after {
  content: "";
  position: absolute;
  inset: -2px;
  padding: 2px;
  border-radius: inherit;
  pointer-events: none;
  background: conic-gradient(
    from var(--neon-angle),
    rgba(255, 52, 255, 0) 120deg,
    #34f5ff 230deg,
    #ff34ff 360deg
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: btn-neon-rotate 2.8s linear infinite;
}

.btn-neon-moving::before {
  z-index: -1;
}

.btn-neon-moving::after {
  inset: -6px;
  padding: 6px;
  filter: blur(14px);
  opacity: 0.6;
  z-index: -2;
}

.btn-neon-moving:hover::before,
.btn-neon-moving:hover::after {
  animation-play-state: paused;
  background: linear-gradient(#ff34ff, #ff34ff);
}

.btn-neon-moving:hover,
.btn-neon-moving:focus {
  background-color: #06070f !important;
  border-color: #ff34ff !important;
  color: #ffffff !important;
}

.btn-neon-moving:hover::after,
.btn-neon-moving:focus::after {
  opacity: 0.8;
  filter: blur(16px);
}

@keyframes btn-neon-rotate {
  to {
    --neon-angle: 360deg;
  }
}

@property --neon-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@media (prefers-reduced-motion: reduce) {
  .btn-neon-moving::before,
  .btn-neon-moving::after {
    animation: none;
  }
}

/* Neon panel effect for CTA boxes */
.panel-neon-moving {
  --panel-neon-angle: 0deg;
  position: relative;
  isolation: isolate;
  overflow: visible;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 10px 24px rgba(47, 85, 212, 0.2);
}

.panel-neon-moving::before,
.panel-neon-moving::after {
  content: "";
  position: absolute;
  inset: -2px;
  padding: 2px;
  border-radius: inherit;
  pointer-events: none;
  background: conic-gradient(
    from var(--panel-neon-angle),
    rgba(76, 232, 255, 0) 120deg,
    #4ce8ff 230deg,
    #ff34ff 360deg
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: panel-neon-rotate 3.8s linear infinite;
}

.panel-neon-moving::before {
  z-index: -1;
}

.panel-neon-moving::after {
  display: none;
}

@keyframes panel-neon-rotate {
  to {
    --panel-neon-angle: 360deg;
  }
}

@property --panel-neon-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@media (prefers-reduced-motion: reduce) {
  .panel-neon-moving::before,
  .panel-neon-moving::after {
    animation: none;
  }
}

/* Neon panel effect v2 (cyan + blue + violet) */
.panel-neon-moving-two {
  position: relative;
  isolation: isolate;
  overflow: visible;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 10px 24px rgba(47, 85, 212, 0.2);
}

.panel-neon-moving-two::before,
.panel-neon-moving-two::after {
  content: "";
  position: absolute;
  inset: -2px;
  padding: 2px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(
    115deg,
    rgba(76, 232, 255, 0.12) 0%,
    #4ce8ff 24%,
    #ff34ff 64%,
    #4ce8ff 90%,
    rgba(76, 232, 255, 0.12) 100%
  );
  background-size: 220% 220%;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: panel-neon-flow-two 3.6s ease-in-out infinite;
}

.panel-neon-moving-two::before {
  z-index: -1;
}

.panel-neon-moving-two::after {
  display: none;
}

@keyframes panel-neon-flow-two {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .panel-neon-moving-two::before,
  .panel-neon-moving-two::after {
    animation: none;
  }
}

/* Neon panel effect v3 (soft breathing neon motion) */
.panel-neon-moving-tree {
  position: relative;
  isolation: isolate;
  overflow: visible;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 10px 24px rgba(47, 85, 212, 0.2);
}

.panel-neon-moving-tree::before,
.panel-neon-moving-tree::after {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2px;
  border-radius: inherit;
  pointer-events: none;
  background: conic-gradient(
    from 210deg,
    rgba(76, 232, 255, 0.16) 0deg,
    #4ce8ff 120deg,
    #7a7dff 220deg,
    #ff34ff 300deg,
    rgba(76, 232, 255, 0.16) 360deg
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: panel-neon-breathe-tree 2.4s ease-in-out infinite;
}

.panel-neon-moving-tree::before {
  z-index: 1;
}

.panel-neon-moving-tree::after {
  display: none;
}

.panel-neon-moving-tree > * {
  position: relative;
  z-index: 2;
}

@keyframes panel-neon-breathe-tree {
  0%,
  100% {
    opacity: 0.56;
    filter: saturate(0.95) brightness(0.92);
  }
  50% {
    opacity: 1;
    filter: saturate(1.15) brightness(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  .panel-neon-moving-tree::before,
  .panel-neon-moving-tree::after {
    animation: none;
  }
}

/* Neon variant for light/white button */
.btn-neon-moving-two {
  --neon2-angle: 0deg;
  position: relative;
  isolation: isolate;
  overflow: visible;
  z-index: 0;
  border-width: 1px;
  background-color: #ffffff !important;
  color: #0f172a !important;
  border-color: #dbe3f3 !important;
  font-weight: 700;
  text-shadow: none !important;
}

.btn-neon-moving-two:visited,
.btn-neon-moving-two:active {
  background-color: #ffffff !important;
  color: #0f172a !important;
}

.btn-neon-moving-two::before,
.btn-neon-moving-two::after {
  content: "";
  position: absolute;
  inset: -2px;
  padding: 2px;
  border-radius: inherit;
  pointer-events: none;
  background: conic-gradient(
    from var(--neon2-angle),
    rgba(66, 245, 255, 0) 110deg,
    #4ce8ff 235deg,
    #8f70ff 320deg,
    #4ce8ff 360deg
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: btn-neon-rotate-two 3.2s linear infinite;
}

.btn-neon-moving-two::before {
  z-index: -1;
}

.btn-neon-moving-two::after {
  inset: -5px;
  padding: 5px;
  filter: blur(12px);
  opacity: 0.55;
  z-index: -2;
}

.btn-neon-moving-two:hover::before,
.btn-neon-moving-two:hover::after {
  animation-play-state: paused;
  background: linear-gradient(#ff34ff, #ff34ff);
}

.btn.btn-neon-moving-two:hover,
.btn.btn-neon-moving-two:focus,
.btn.btn-neon-moving-two:active {
  background-color: #06070f !important;
  border-color: #ff34ff !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 0 0 transparent;
  opacity: 1 !important;
  filter: none !important;
}

.btn.btn-neon-moving-two i,
.btn.btn-neon-moving-two:hover i,
.btn.btn-neon-moving-two:focus i,
.btn.btn-neon-moving-two:active i {
  color: currentColor !important;
  opacity: 1 !important;
}

.btn-neon-moving-two:hover::after,
.btn-neon-moving-two:focus::after {
  opacity: 0.58;
  filter: blur(12px);
}

@keyframes btn-neon-rotate-two {
  to {
    --neon2-angle: 360deg;
  }
}

@property --neon2-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@media (prefers-reduced-motion: reduce) {
  .btn-neon-moving-two::before,
  .btn-neon-moving-two::after {
    animation: none;
  }
}

/* Ensure logo inside circular plan badge stays perfectly round */
.job-box .firm-logo {
  overflow: hidden;
}

.job-box .firm-logo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 50%;
  display: block;
}