@font-face {
  font-family: "Suisse Intl";
  src: url("./assets/fonts/SuisseIntl-Regular.woff2") format("woff2");
}

/* For modern browsers */
html,
body {
  overflow: hidden;
  overflow-y: auto;
}

/* Optional: For older versions of Internet Explorer */
body {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

body::-webkit-scrollbar {
  display: none; /* Chrome, Safari, and Opera */
}

/* Media query for desktop */
@media (min-width: 768px) {
  .h1 {
    font-family: "Suisse Intl";
    font-size: 56px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -2.24px;
  }
  .h2 {
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -1.92px;
  }
  .h3 {
    font-family: "Suisse Intl";
    font-size: 38px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -1.14px;
  }
  .h4 {
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.78px;
  }
  .h5 {
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.66px;
  }
  .h6 {
    font-family: "Suisse Intl";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.72px;
  }
  .header-para {
    font-family: "Suisse Intl";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.2px;
  }
  .main-para {
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.16px;
  }
  .span {
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.16px;
  }
  .btn-text {
    font-family: "Suisse Intl";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.36px;
  }
  .footer-head {
    font-family: "Suisse Intl";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.2px;
  }
  .blue {
    color: #002d71;
  }
  .white {
    color: #fff;
  }
  .black {
    color: #000;
  }
}

.h1 {
  font-family: "Suisse Intl";
  font-size: 40px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.6px;
}
.h2 {
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.28px;
}
.h3 {
  font-family: "Suisse Intl";
  font-size: 30px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.9px;
}
.h4 {
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.66px;
}
.h5 {
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.54px;
}
.h6 {
  font-family: "Suisse Intl";
  font-size: 16.8px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.504px;
}

.header-para {
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.16px;
}
.main-para {
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.16px;
}
.span {
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.16px;
}
.btn-text {
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.32px;
}
.footer-head {
  font-family: "Suisse Intl";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.2px;
}
.blue {
  color: #002d71;
}
.white {
  color: #fff;
}
.black {
  color: #000;
}

/* Mobile */

.navbar-section {
  display: flex;
  padding: 20px 30px;
  /* flex-direction: row; */
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.8);
}

.navlink {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.18px;
}

.navlink-contact {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.36px;
}

.hero-section {
  position: relative;
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.hero-section .image-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
}

.hero-section .image-container.incoming {
  transform: translateX(100%);
}

.hero-section .image-container.outgoing {
  transform: translateX(-100%);
  opacity: 0;
}

.hero-section .image-container.current {
  transform: translateX(0);
  opacity: 1;
}

.hero-para {
  color: #fff;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.16px;
}

.learn-more-btn {
  display: flex;
  padding: 10px 20px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 12px;
  background: #fff;
  color: #000;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.32px;
  width: fit-content;
}

/* Marquee section styles */
.marquee-section {
  background-color: #fff;
  padding: 0 0;
}

.marquee-wrapper {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.marquee-content {
  display: flex;
  align-items: center;
  gap: 3rem;
}

@keyframes marquee {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}

.animate-marquee {
  animation: marquee 20s linear infinite;
}

.marquee-content img {
  max-height: 400px;
}

/* Pillar Section */
.pillar-header {
  color: #002d71;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.28px;
}

.pillar-info {
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.16px;
}

.pillar-heading {
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.66px;
}

.pillar-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* flex-grow: 1; */
  gap: 20px;
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 26px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.78px;
}

/* Media query for desktop */
@media (min-width: 768px) {
  .services-heading {
    color: #000;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 56px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -2.24px;
  }
  .services-para {
    color: #000;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.16px;
  }
  .service-card-text {
    position: absolute;
    bottom: -20px;
    /* width: fit-content; */
    padding: 20px 5px;
    border-radius: 14px;
    border: 1px solid rgba(246, 246, 246, 0);
    background: white;
    box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
      0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
      0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
    color: #000;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.66px;
  }
  .video-header {
    color: #fff;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 56px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -2.24px;
  }
  .video-para {
    color: #fff;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.16px;
  }
  .industry-heading {
    color: #000;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 56px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -2.24px;
  }
  .hero-header {
    color: #fff;
    font-family: "Suisse Intl";
    font-size: 56px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -2.24px;
  }
  .hero-para {
    color: #fff;
    font-family: "Suisse Intl";
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.2px;
  }
  .learn-more-btn {
    display: flex;
    padding: 10px 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 12px;
    background: #fff;
    color: #000;
    font-family: "Suisse Intl";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.36px;
  }
  .pillar-header {
    color: #002d71;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -1.92px;
  }
  .pillar-info {
    color: #000;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.16px;
  }
  .pillar-heading {
    color: #000;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.78px;
  }
  .industry-card {
    padding: 20px;
    gap: 20px;
    /* width: 248px !important; */
    border-radius: 14px;
    border: 1px solid #f2f2f2;
    background: #fff;
    box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
      0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
      0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
    width: fit-content;
    color: #000;
    text-align: center;
    font-family: "Suisse Intl";
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.78px;
  }
  .project-heading {
    color: #000;
    font-family: "Suisse Intl";
    font-size: 56px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -2.24px;
  }
  .project-item-heading {
    color: #000;
    font-family: "Suisse Intl";
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.72px;
  }
  .project-item-para {
    overflow: hidden;
    color: #000;
    text-overflow: ellipsis;
    font-family: "Suisse Intl";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.42px;
    text-transform: uppercase;
    opacity: 0.5;
  }
  .certificate-header {
    color: #000;
    font-family: "Suisse Intl";
    font-size: 38px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -1.14px;
  }
  .footer-address {
    color: #fff;
    font-family: "Suisse Intl";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.18px;
  }
  .footer-heading {
    color: #fff;
    font-family: "Suisse Intl";
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.2px;
  }
  .footer-link {
    color: #fff;
    font-family: "Suisse Intl";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.18px;
  }
}

.footer-link {
  color: #fff;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.18px;
}
.certificate-header {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 30px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.9px;
}

.project-heading {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.28px;
}

.industry-card {
  padding: 20px;
  gap: 20px;
  /* width: 248px !important; */
  border-radius: 14px;
  /* border-radius: 14px; */
  border: 1.5px solid #002d71;
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
  width: fit-content;
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.66px;
}

.hero-header {
  color: #fff;
  font-family: "Suisse Intl";
  font-size: 40px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.6px;
}

.industry-heading {
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.28px;
}

.video-para {
  color: #fff;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.16px;
}

.video-header {
  color: #fff;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 56px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -2.24px;
}

.service-card-text {
  position: absolute;
  bottom: -25px;
  /* width: fit-content; */
  padding: 15px 5px;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  border-radius: 14px;
  border: 1.5px solid rgba(0, 45, 113, 0);
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.54px;
}

.services-para {
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.16px;
}

.services-heading {
  color: #000;
  text-align: center;
  font-family: "Suisse Intl";
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.28px;
}

.service-card {
  position: relative;
  /* flex-grow: 1; */
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 11px;
}

.service-card:hover .service-card-text {
  border: 1.5px solid rgba(0, 45, 113, 1);
}

.services-btn {
  display: flex;
  padding: 10px 20px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 12px;
  background: #eee;
  color: #000;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.36px;
}

.video-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* width: fit-content; */
}

.industry-card:hover {
  border-radius: 14px;
  border: 1.5px solid #002d71;
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
}

.project-item-heading {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 16.8px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.504px;
}

.project-item-para {
  overflow: hidden;
  color: #000;
  text-overflow: ellipsis;
  font-family: "Suisse Intl";
  font-size: 9.8px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.294px;
  text-transform: uppercase;
}

.industry-item-text {
  position: absolute;
  bottom: 0px;
  display: flex;
  width: 90%;
  padding: 20px 0px;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  border-radius: 14px;
  border: 1px solid rgba(246, 246, 246, 0);
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
}

/* Footer */
.footer-address {
  color: #fff;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.18px;
}

.footer-heading {
  color: #fff;
  font-family: "Suisse Intl";
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.2px;
}

.contact-form {
  display: flex;
  /* width: 854px; */
  padding: 30px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 30px;
  border-radius: 14px;
  border: 1.5px solid #ececec;
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
}

.contact-header {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 28px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.84px;
}

.contact-form-label {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.18px;
}

.contact-form-field {
  display: flex;
  padding: 15px 20px;
  align-items: center;
  gap: 10px;
  align-self: stretch;
  border-radius: 12px;
  background: #f5f5f5;
  margin-top: 10px;
}

.contact-form-file {
  display: flex;
  /* width: 246px;
  height: 58px; */
  padding: 10px 20px;
  justify-content: center;
  align-items: center;
  /* gap: 10px; */
  border-radius: 12px;
  border: 1px solid #002d71;
  background: #f5f5f5;

  color: #002d71;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.36px;
}

.contact-submit-btn {
  display: flex;
  padding: 10px 20px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 12px;
  background: #002d71;
  color: #fff;
  font-family: "Suisse Intl";
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.36px;
}

.contact-details {
  display: flex;
  padding: 20px;
  height: fit-content;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  /* flex: 1 0 0; */
  border-radius: 14px;
  border: 1.5px solid rgba(0, 45, 113, 1);
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
}

.equipment-card {
  display: flex;
  padding: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;
  border-radius: 14px;
  border: 1.5px solid #ececec;
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
}

.equipment-card-head {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.66px;
}

.equipment-card-para {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.48px;
}

.industry-item-text {
  position: absolute;
  bottom: 3px;
  display: flex;
  width: 90%;
  padding: 20px 0px;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  border-radius: 14px;
  border: 1px solid rgba(246, 246, 246, 0);
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
}

#mobile-menu-button {
  padding: 20px;
  align-items: center;
  gap: 10px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.8);
}

/* Base styles */
.work-item {
  position: relative;
  width: 100% !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 250px; /* Ensure a minimum width for each item */
}

.work-item:hover .industry-item-text {
  border: 1.5px solid #002d71;
  background: #fff;
  box-shadow: 0px 57px 16px 0px rgba(0, 0, 0, 0),
    0px 36px 15px 0px rgba(0, 0, 0, 0), 0px 20px 12px 0px rgba(0, 0, 0, 0.01),
    0px 9px 9px 0px rgba(0, 0, 0, 0.02), 0px 2px 5px 0px rgba(0, 0, 0, 0.02);
}

.work-item:hover img {
  height: 400px;
}

/* Flexbox container for items */
section .done-deal {
  display: flex;
  gap: 15px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 20px 10px;
}

section .done-deal::-webkit-scrollbar {
  display: none; /* Hide scrollbar on mobile */
}

/* Ensure each work-item snaps to position */
.work-item {
  scroll-snap-align: start;
}

/* Larger screens */
@media (min-width: 768px) {
  section .done-deal {
    flex-wrap: wrap;
    /* overflow-x: unset; */
  }

  .work-item {
    flex-basis: 20%; /* Adjusts the size of the item in a row on desktop */
    max-width: 19%;
    min-width: auto;
  }

  /* Reset item hover image height */
  .work-item:hover img {
    height: 350px;
  }

  .equipment-heading {
    color: #000;
    font-family: "Suisse Intl";
    font-size: 38px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -1.14px;
  }
  .text-style {
    font-family: "Suisse Intl";
  }
}

.text-style {
  font-family: "Suisse Intl";
}
.equipment-heading {
  color: #000;
  font-family: "Suisse Intl";
  font-size: 38px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -1.14px;
}
