* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
      scroll-behavior: smooth;
    }

    /* Hero background gradient */
    .hero-gradient {
      background: linear-gradient(135deg, #0f172a 0%, #181c26 50%, #0f172a 100%);
      position: relative;
      overflow: hidden;
    }

    .text-slate-900 {
      color: #ffffff !important;
    }

    /* Floating light overlay */
    .hero-gradient::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: radial-gradient(circle at 20% 50%,
          rgba(59, 130, 246, 0.1) 0%,
          transparent 50%),
        radial-gradient(circle at 80% 80%,
          rgba(251, 191, 36, 0.1) 0%,
          transparent 50%);
      animation: float 6s ease-in-out infinite;
      z-index: 1;
    }

    /* Glitter effect overlay */
    .glitter {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: radial-gradient(2px 2px at 20% 30%,
          rgba(255, 215, 0, 0.8),
          transparent),
        radial-gradient(1.5px 1.5px at 60% 70%,
          rgba(173, 216, 230, 0.8),
          transparent),
        radial-gradient(2px 2px at 80% 20%,
          rgba(255, 223, 0, 0.7),
          transparent),
        radial-gradient(1.5px 1.5px at 30% 80%,
          rgba(255, 255, 255, 0.5),
          transparent);
      background-repeat: repeat;
      background-size: 400px 400px;
      animation: sparkle 8s infinite linear;
      pointer-events: none;
      z-index: 2;
    }

    @keyframes sparkle {
      0% {
        background-position: 0 0, 50px 50px, 100px 100px, 150px 150px;
      }

      100% {
        background-position: 400px 400px, 450px 450px, 500px 500px,
          550px 550px;
      }
    }

    @keyframes float {

      0%,
      100% {
        transform: translateY(0px);
      }

      50% {
        transform: translateY(20px);
      }
    }

    .nav-scroll {
      transition: all 0.3s ease;
    }

    .nav-scroll.scrolled {
      background: rgba(15, 23, 42, 0.95);
      backdrop-filter: blur(10px);
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }

    .btn-primary {
      background: linear-gradient(90deg, #00C853 0%, #009624 100%);
      transition: all 0.3s ease;
    }

    .btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 20px rgb(2 209 98 / 32%);
    }

    .btn-secondary {
      border: 2px solid #01d160;
      color: #01d160;
      transition: all 0.3s ease;
    }

    .btn-secondary:hover {
      background: #01d15f4f;
    }


       .highlight-item {
      background: rgba(0, 102, 255, 0.05);
      border-left: 3px solid #02d162;
      transition: all 0.3s ease;
    }

    .highlight-item:hover {
      background: rgba(0, 102, 255, 0.1);
    }

     .gradient-text {
        background: linear-gradient(90deg, #00c853 0%, #009624 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
      }

       .gradient-text {
        background: linear-gradient(90deg, #00c853 0%, #009624 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
      }