.scrolling-text-container {
      display: flex;
      align-items: center;
      white-space: nowrap;
      font-size: 1.875rem; /* text-3xl */
      font-weight: bold;
      color: #1e40af; /* text-blue-800 */
      gap: 10px;
    }

    .scrolling-area {
      overflow: hidden;
      position: relative;
      width: 400px; /* Adjust to fit your design */
    }

    .scrolling-text {
      display: inline-block;
      padding-left: 100%;
      animation: scroll-left 15s linear infinite;
      white-space: nowrap;
    }

    .scrolling-area:hover .scrolling-text {
      animation-play-state: paused;
    }

    @keyframes scroll-left {
      0% {
        transform: translateX(0%);
      }
      100% {
        transform: translateX(-100%);
      }
    }
    
  /* Popup overlay */
 .popup-overlay {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.95); /* Almost full white overlay */
  opacity: 0; /* Initially invisible */
  pointer-events: none;
  z-index: 9999;
  transition: opacity 0.5s ease, transform 0.5s ease; /* Smooth fade and scale */
  transform: scale(0.95); /* Slight shrink before animation */
}

.popup-overlay.show {
  opacity: 1; /* Fade in overlay */
  pointer-events: auto; /* Allow interactions */
  transform: scale(1); /* Scale to normal size */
}
  /* Card */
  .card-custom {
    border-radius: 1rem;
    box-shadow: 0 10px 28px rgba(0,0,0,.35);
    max-width: 900px;
    width: 95%;
    background: #fff;
    overflow: hidden;
    position: relative;
    transform: translateY(20px);
    opacity: 0;
    transition: transform .5s ease, opacity .5s ease;
    padding: 1.5rem;
  }
  .card-custom.show { transform:translateY(0); opacity:1; }

  .close-btn {
    position:absolute; top:15px; right:20px; font-size:2.5rem; font-weight:bold;
    color:#f08c00; cursor:pointer;
  }
  .close-btn:hover { color:#d9480f; transform:scale(1.2) rotate(5deg); }

  .profile-img { width:120px; border-radius:50%; border:2px solid #f08c00; display:none; }
  .profile-text { display:none; text-align:center; margin-top:5px; }

  .container-typing {
    font-size: 1.3rem;
    font-family: 'Dancing Script', cursive;
    color: #000;
    white-space: pre-wrap;
    line-height:1.5;
  }
  .letter { display:none; opacity:0; }
  .icon { display:inline-block; font-size:1.3rem; margin-left:6px; }
  .icon.rubber { display:none; }

  .blurred { filter: blur(6px); transition: filter .5s ease; }

  /* Fixed top tab container */
 #tabContainer { padding:5px 0; gap:0.5rem; justify-content:center; }
.tab-btn { font-size:0.85rem; flex-shrink:1; white-space:nowrap; }
.tab-btn.active { animation: blink 1.2s infinite;}
@keyframes blink {0%,50%,100%{opacity:1;}25%,75%{opacity:0.3;}}
    .scrolling-area {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.scrolling-images {
  display: flex; /* horizontal row */
  align-items: center;
  gap: 15px;
  animation: scroll-left 15s linear infinite;
}

.scrolling-area:hover .scrolling-images {
  animation-play-state: paused;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
    .blink {
      animation: blinker 1s step-start infinite;
      padding: 2px 6px;
      background: #ff9800;
      border-radius: 4px;
      color: #fff;
      font-weight: bold;
    }
    @keyframes blinker { 50% { opacity: 0; } }
    /* Team Carousel Unique Style */
#team-carousel .team-box {
    border-radius: 10px;
    background: #fff;
    transition: all 0.3s ease;
    cursor: pointer;
}
#team-carousel .team-box:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}
#team-carousel .team-img img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: 8px;
}
#team-carousel .role {
    font-size: 0.9rem;
    color: #444;
}
#team-carousel .skills {
    font-size: 0.8rem;
    color: #777;
}
#team-carousel .th-btn {
    font-size: 0.85rem;
    padding: 6px 12px;
}