body {
    font-family: 'Orbitron', sans-serif;
    background: #0e0e0e;
  }

  :root {
    --footer-bg: rgba(0, 0, 0, 0.8);
    --footer-text: #ffffff;
    --header-bg: rgba(0, 0, 0, 0.8);
    --header-text: #ffffff;
    --header-hover: #ff7a00;
    --primary-color: #ff7a00;
    --secondary-color: #ffbf85;
  }

  .custom-header {
    background-color: var(--header-bg);
    color: var(--header-text);
  }

  .custom-header a {
    color: var(--header-text);
  }

  .custom-header a:hover {
    color: var(--header-hover);
  }

  .custom-footer {
    background-color: var(--footer-bg);
    color: var(--footer-text);
  }

  .section-hero {
    background-color: rgba(0, 0, 0, 0.6);
  }

  .section-testimonials,
  .section-languages,
  .section-projects {
    background-color: rgba(0, 0, 0, 0.4);
  }

  .section-about,
  .section-skills,
  .section-services {
    background-color: rgba(0, 0, 0, 0.2);
  }

  .progress {
    transition: stroke-dashoffset 1.5s ease;
  }

  #particles-js {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #0e0e0e;
    background-size: cover;
    z-index: -10;
  }

  .glow-avatar {
    position: relative;
    animation: glow 1.5s ease-in-out infinite;
  }

  .custom-footer {
    --x-padding: 410px; /* Change this value to move items closer/farther */
    padding-left: var(--x-padding);
    padding-right: var(--x-padding);
  }

  @keyframes glow {
    0% {
      box-shadow: 0 0 5px var(--primary-color), 0 0 10px var(--primary-color), 0 0 15px var(--primary-color),
                  0 0 20px var(--primary-color), 0 0 25px var(--primary-color), 0 0 30px var(--primary-color);
    }
    50% {
      box-shadow: 0 0 10px var(--primary-color), 0 0 20px var(--primary-color), 0 0 30px var(--primary-color),
                  0 0 40px var(--primary-color), 0 0 50px var(--primary-color), 0 0 60px var(--primary-color);
    }
    100% {
      box-shadow: 0 0 5px var(--primary-color), 0 0 10px var(--primary-color), 0 0 15px var(--primary-color),
                  0 0 20px var(--primary-color), 0 0 25px var(--primary-color), 0 0 30px var(--primary-color);
    }
  }

  @keyframes waveColor {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
  }

  @keyframes blink {
    0%, 100% { opacity: 0 }
    50% { opacity: 1 }
  }

  @keyframes breathe {
    0% {
      transform: scale(1);
      box-shadow: 0 0 10px #ff260086;
    }
    50% {
      transform: scale(1.1);
      box-shadow: 0 0 15px #ff260086;
    }
    100% {
      transform: scale(1);
      box-shadow: 0 0 10px #ff260086;
    }
  }

  .wave-text {
    font-size: 3rem;
    font-weight: bold;
    background: linear-gradient(270deg, #ffffff, var(--primary-color), #ffffff, var(--primary-color), #ffffff);
    background-size: 600% 600%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: waveColor 10s ease infinite;
  }

  .glowing-icon {
    color: var(--primary-color);
    text-shadow: 0 0 5px #000000c4, 0 0 10px #000000c4, 0 0 20px #000000c4;
    animation: glowPulse 1.5s infinite ease-in-out;
  }

  .animate-breathe {
    animation: breathe 2.5s ease-in-out infinite;
  }

  .btn-breathe {
    animation: breathe 2s infinite ease-in-out;
    background-color: var(--primary-color);
  }

  #typewriter::after {
    content: "|";
    animation: blink 1s step-end infinite;
    margin-left: 5px;
  }