
  .hero-welcome {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 150px;
    background: #0b1220; /* simple dark bg */
    overflow: hidden;
  }

  .welcome-text {
    font-size: clamp(32px, 7vw, 64px);
    font-weight: 800;
    color: #fff;
    text-align: center;
    z-index: 2;
    animation: fadeUp 1.2s ease-out forwards;
  }

  .welcome-text span {
    background: linear-gradient(90deg, #00d4ff, #29ff9f, #ffda29, #ff29e7);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(40px) scale(0.95); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
  }

  /* Stars styling */
  .stars {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
  }

  .stars span {
    position: absolute;
    width: 10px; height: 10px;
    border-radius: 50%;
    background: white;
    animation: blink 1.5s infinite;
  }

  /* Random star positions around text */
  .stars span:nth-child(1){ top:20%; left:30%; background:#ff4d4d; animation-delay:0s; }
  .stars span:nth-child(2){ top:25%; right:25%; background:#29ff9f; animation-delay:.3s; }
  .stars span:nth-child(3){ bottom:30%; left:20%; background:#00d4ff; animation-delay:.6s; }
  .stars span:nth-child(4){ top:15%; left:60%; background:#ffda29; animation-delay:.9s; }
  .stars span:nth-child(5){ bottom:25%; right:30%; background:#ff29e7; animation-delay:1.2s; }
  .stars span:nth-child(6){ top:40%; left:15%; background:#29ff9f; animation-delay:.45s; }
  .stars span:nth-child(7){ bottom:20%; left:50%; background:#00d4ff; animation-delay:.75s; }
  .stars span:nth-child(8){ top:50%; right:15%; background:#ff4d4d; animation-delay:1.05s; }
  .stars span:nth-child(9){ top:35%; right:40%; background:#ffda29; animation-delay:1.35s; }
  .stars span:nth-child(10){ bottom:15%; left:35%; background:#ff29e7; animation-delay:1.65s; }

  @keyframes blink {
    0%, 100% { opacity: 0.2; transform: scale(0.6); }
    50% { opacity: 1; transform: scale(1.2); }
  }
