html {
  scroll-behavior: smooth;
  background-color: #121212;
  overscroll-behavior: none;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: #121212;
}

.bg-dark {
  background-color: #121212;
}

.text-primary {
  color: #8cc433;
}

.bg-primary {
  background-color: #8cc433;
}

.border-primary {
  border-color: #8cc433;
}

/* Service Card Premium Animation */
.service-card {
  position: relative;
  background-color: #1e1e1e;
  border-radius: 0.75rem;
  /* xl */
  border: 1px solid rgba(255, 255, 255, 0.05);
  /* Base border */
  padding: 1.5rem;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  z-index: 1;
}

.service-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(140, 196, 51, 0.2);
  border-color: transparent;
}

.service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 0.75rem;
  border: 2px solid #8cc433;
  /* The green border */

  /* Start hidden at bottom-left corner */
  -webkit-clip-path: circle(0% at 0% 100%);
  clip-path: circle(0% at 0% 100%);

  transition: clip-path 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  /* Ensure clicks pass through */
  z-index: 10;
  /* Sit on top of content if needed, or just below text */
}

.service-card:hover::after {
  /* Expand to cover full card */
  -webkit-clip-path: circle(150% at 0% 100%);
  clip-path: circle(150% at 0% 100%);
}

/* Infinite Scroll Carousel */
.slider-container {
  overflow: hidden;
  position: relative;
  width: 100%;
  padding: 40px 0;
  background-color: #121212;
}

.slider-track {
  display: flex;
  width: calc(300px * 24);
  /* 300px width * 24 items (12 unique * 2) */
  animation: scroll 40s linear infinite;
}

.slide {
  height: 200px;
  width: 300px;
  padding: 0 10px;
  flex-shrink: 0;
}

.slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
  filter: grayscale(0.5);
}

.slide img:hover {
  transform: scale(1.05);
  filter: grayscale(0);
  border-color: #8cc433;
  box-shadow: 0 0 20px rgba(140, 196, 51, 0.2);
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(calc(-300px * 12));
    /* Move exactly half the width */
  }
}

/* Floating WhatsApp Button */
#simple-chat-button--button {
  display: block;
  position: relative;
  text-decoration: none;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  /* -webkit-transition: all 0.2s ease-in-out; */
  transition: all 0.2s ease-in-out;
  -webkit-transform: scale(1);
  transform: scale(1);
  box-shadow: 0 6px 8px 2px rgba(0, 0, 0, .15);
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjU2IiB3aWR0aD0iMjU2IiB2aWV3Qm94PSItMjMgLTIxIDY4MiA2ODIuNjY3IiBmaWxsPSIjZmZmIiB4bWxuczp2PSJodHRwczovL3ZlY3RhLmlvL25hbm8iPjxwYXRoIGQ9Ik01NDQuMzg3IDkzLjAwOEM0ODQuNTEyIDMzLjA2MyA0MDQuODgzLjAzNSAzMjAuMDUxIDAgMTQ1LjI0NiAwIDIuOTggMTQyLjI2MiAyLjkxIDMxNy4xMTNjLS4wMjMgNTUuODk1IDE0LjU3OCAxMTAuNDU3IDQyLjMzMiAxNTguNTUxTC4yNSA2NDBsMTY4LjEyMS00NC4xMDJjNDYuMzI0IDI1LjI3IDk4LjQ3NyAzOC41ODYgMTUxLjU1MSAzOC42MDJoLjEzM2MxNzQuNzg1IDAgMzE3LjA2Ni0xNDIuMjczIDMxNy4xMzMtMzE3LjEzMy4wMzUtODQuNzQyLTMyLjkyMi0xNjQuNDE4LTkyLjgwMS0yMjQuMzU5ek0zMjAuMDUxIDU4MC45NDFoLS4xMDljLTQ3LjI5Ny0uMDItOTMuNjg0LTEyLjczLTEzNC4xNi0zNi43NDJsLTkuNjIxLTUuNzE1LTk5Ljc2NiAyNi4xNzIgMjYuNjI5LTk3LjI3LTYuMjctOS45NzNjLTI2LjM4Ny00MS45NjktNDAuMzItOTAuNDc3LTQwLjI5Ny0xNDAuMjgxLjA1NS0xNDUuMzMyIDExOC4zMDUtMjYzLjU3IDI2My42OTktMjYzLjU3IDcwLjQwNi4wMjMgMTM2LjU5IDI3LjQ3NyAxODYuMzU1IDc3LjMwMXM3Ny4xNTYgMTE2LjA1MSA3Ny4xMzMgMTg2LjQ4NGMtLjA2MiAxNDUuMzQ0LTExOC4zMDUgMjYzLjU5NC0yNjMuNTk0IDI2My41OTR6bTE0NC41ODYtMTk3LjQxOGMtNy45MjItMy45NjktNDYuODgzLTIzLjEzMy01NC4xNDgtMjUuNzgxLTcuMjU4LTIuNjQ1LTEyLjk0Ny0zLjk2MS0xNy44MjQgMy45NjktNS4yODUgNy45My0yMC40NjkgMjUuNzgxLTI1LjA5NCAzMS4wNjZzLTkuMjQyIDUuOTUzLTE3LjE2OCAxLjk4NC0zMy40NTctMTIuMzM2LTYzLjcyNy0zOS4zMzJjLTIzLjU1NS0yMS4wMTItMzkuNDU3LTQ2Ljk2MS00NC4wODItNTQuODkxLTQuNjE3LTcuOTM3LS4wMzktMTEuODEyIDMuNDc3LTE2LjE3MiA4LjU3OC0xMC42NTIgMTcuMTY4LTIxLjgyIDE5LjgwOS0yNy4xMDVzMS4zMi05LjkxOC0uNjY0LTEzLjg4M2MtMS45NzctMy45NjUtMTcuODI0LTQyLjk2OS0yNC40MjYtNTguODQtNi40MzctMTUuNDQ1LTEyLjk2NS0xMy4zNTktMTcuODMyLTEzLjYwMi00LjYxNy0uMjMtOS45MDItLjI3Ny0xNS4xODctLjI3N3MtMTMuODY3IDEuOTgtMjEuMTMzIDkuOTE4LTI3LjczIDI3LjEwMi0yNy43MyA2Ni4xMDUgMjguMzk1IDc2LjY4NCAzMi4zNTUgODEuOTczIDU1Ljg3OSA4NS4zMjggMTM1LjM2NyAxMTkuNjQ4YzE4LjkwNiA4LjE3MiAzMy42NjQgMTMuMDQzIDQ1LjE3NiAxNi42OTUgMTguOTg0IDYuMDMxIDM2LjI1NCA1LjE4IDQ5LjkxIDMuMTQxIDE1LjIyNy0yLjI3NyA0Ni44NzktMTkuMTcyIDUzLjQ4OC0zNy42OCA2LjYwMi0xOC41MTIgNi42MDItMzQuMzc1IDQuNjE3LTM3LjY4NC0xLjk3Ny0zLjMwNS03LjI2Mi01LjI4NS0xNS4xODQtOS4yNTR6bTAgMCIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+") center/44px 44px no-repeat #25D366;
}

#simple-chat-button--button:hover {
  transform: scale(1.1);
  box-shadow: 0 8px 12px 2px rgba(0, 0, 0, .25);
}

/* Shimmer Text Effect */
/* Shimmer Text Effect */
.shimmer-text {
  /* 
    Layer 1 (Top): The moving green shimmer. 
    Layer 2 (Bottom): Solid white base.
  */
  background-image:
    linear-gradient(120deg, transparent 40%, #8cc433 50%, transparent 60%),
    linear-gradient(#fff, #fff);
  background-size: 200% auto, 100% auto;
  background-repeat: no-repeat, repeat;
  background-position: -200% center, 0 0;

  /* Text Fill Logic */
  color: rgba(255, 255, 255, 0.1);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  animation: shine 30s linear infinite;
}

@keyframes shine {
  0% {
    background-position: -200% center, 0 0;
  }

  5% {
    /* Fast pass in 1.5s (5% of 30s) */
    background-position: 200% center, 0 0;
  }

  100% {
    background-position: 200% center, 0 0;
  }
}