/* About Us section - Main stylesheet */

/* Import split components */
@import url('about-cards.css');
@import url('about-animations.css');
@import url('about-layout.css');
@import url('about-responsive.css');

/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css?family=Orbitron:700&display=swap');

/* Main about section background */
.about-section-bg {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background: linear-gradient(135deg, #18192a 60%, #1a0033 100%), url('../assets/brand3.svg') center/cover no-repeat;
  opacity: 0.13;
  z-index: 0;
  pointer-events: none;
  animation: bgMove 24s linear infinite alternate;
}

@keyframes bgMove {
  0% { background-position: 0 0, 0 0; }
  100% { background-position: 100px 100px, 120px 80px; }
}

/* Main animation class for cards */
.about-card-animate {
  animation: aboutGlowPulse 1.2s ease-out 1;
}

@keyframes aboutGlowPulse {
  0% {
    box-shadow: 0 0 24px #00fff7, 0 0 32px #ff00cc;
  }
  50% {
    box-shadow: 0 0 48px #ff00cc, 0 0 64px #00fff7;
  }
  100% {
    box-shadow: 0 0 24px #00fff7, 0 0 32px #ff00cc;
  }
}

.highlight, .neon-keyword {
  color: #39ff14 !important;
  text-shadow:
    0 0 2px #000,
    0 0 8px #ff00cc,
    0 0 16px #ff00cc;
  font-weight: 700;
}

/* Remove or override any other .highlight or .neon-keyword color or text-shadow rules below */ 