@keyframes marquee {
    0% { transform: translateX(0%); }
    100% { transform: translateX(-50%); }
}

.animate-marquee {
    display: flex;
    width: max-content;
    animation: marquee 20s linear infinite;
}

/* Optional: Pause on hover so users can read it */
.animate-marquee:hover {
    animation-play-state: paused;
}

.highlight-search {
    background-color: yellow;
    color: black;
    padding: 2px 4px;
    border-radius: 4px;
}

@media (max-width: 768px) {
  /* mobile styles go here */
}

img {
  max-width: 100%;
  height: auto;
}
body {
  overflow-x: hidden;
}

.container {
  width: 100%;
}
img {
  max-width: 100%;
  height: auto;
}
img {
  max-width: 100%;
  height: auto;
}

.container {
  width: 100%;
}
.container {
  width: 100%;
  max-width: 1200px;   /* Optional */
  margin: 0 auto;
}

img {
  max-width: 100%;
  height: auto;
}
.parent {
  display: flex;
  flex-wrap: wrap;
}

.child {
  flex: 1;
  min-width: 250px;
}
.services {
  display: flex;
  flex-wrap: wrap;
}

.service-box {
  flex: 1 1 300px;
}
<meta name="viewport" content="width=device-width, initial-scale=1">


