:root {
    --primary: #1DB954;
    --primary-light: #5eb17b;
    --text: #191414;
    --text-light: #727272;
    --card-light: #f3f3f3;
    --card-dark: #e0e0e0;
    --icons:#374151;
    --bg: #eee;
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--bg);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}
html {
  scroll-behavior: smooth;
}
section {
    padding: 50px 0px;
}
nav .tooltip-text {
    position: absolute;
    left: 100%;
    transform: translate(-88%, 187%);
}
/* *{
  outline: 1px solid black;
} */


p {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    color: var(--text);
}

.container {
  width: 95%;
  max-width: 72rem;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  padding: 0.25rem; 
}

/* navbar */
.nav-link {
    color: var(--text);
    padding: 0.25rem 0.75rem;
    border-radius: 0.5rem;
    transition: background 0.2s, color 0.2s;
}

.nav-link:hover {
    background: var(--card-light);
}

/* hero */
.hero-section, .top-section {
    margin-top: 65px;
}

.hero-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 24px;
    align-items: center;
}

.hero-content h1,h2,h3,h4,h5,h6 {
    font-weight: 700;
    color: var(--text);
}

/* toolkit */
.tooltip {
  position: relative;
  cursor: pointer;
}

.tooltip-text {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 100%;
  margin-bottom: 0.5rem; /* mb-2 */
  width: 14rem; /* w-56 */
  border-radius: 0.5rem; /* rounded-lg */
  background-color: #1f2937; /* bg-gray-800 */
  color: white;
  font-size: 0.875rem; /* text-sm */
  padding: 0.5rem 0.75rem; /* px-3 py-2 */
  white-space: normal;

  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}

.tooltip:hover .tooltip-text {
  opacity: 1;
  visibility: visible;
}




/*  */
.pill {
    display: inline-block;
    white-space: nowrap;
    background-color: var(--card-dark);
    padding: 0.25rem 0.25rem;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    width: fit-content;
    color: var(--text);

}

.g-dot {
    height: 10px;
    width: 10px;
    background-color: var(--primary);
    border-radius: 50%;
}

/* marquee */
  .clients-marquee .swiper-wrapper {
    transition-timing-function: linear !important;
  }
  .clients-marquee .swiper-slide {
    width: auto; /* works with slidesPerView: 'auto' */
    padding: 0 24px; /* gap between logos */
  }


/* marquee */
  .rr-5{
    transform: rotate(5deg) translate(-50%, -50%);
    z-index: 9;
    width: 200%;
  }
  .marquee-track {
    width: max-content;
    animation: marquee-left 60s linear infinite;
  }
  @keyframes marquee-left {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }

  /* footer */
  .social img{
filter: invert(23%) sepia(22%) saturate(562%) hue-rotate(178deg) brightness(92%) contrast(91%);
  }


/* rich text */
.job-description ul {
  list-style: none !important;   /* remove default bullets */
  padding: 0 !important;
  margin: 0 !important;
}

.job-description ul li {
  position: relative !important;
  padding-left: 1.5rem !important;   /* space for custom bullet */
  margin-bottom: 0.5rem !important;
}

.job-description ul li::before {
  content: "•" !important;       /* custom bullet */
  position: absolute !important;
  left: 0 !important;
  top: 0.25rem !important;       /* aligns bullet vertically */
  color: #0f766e !important;     /* Tailwind teal-700 */
  font-size: 1.1rem !important;
  line-height: 1 !important;
}