builder-component {
  max-width: none !important;
}

.div {
  display: flex;
  flex-direction: column;
  padding: 0 6px;
}

.tech {
  background-color: rgba(255, 255, 255, 1);
  display: flex;
  width: 100%;
  flex-direction: column;
  overflow: hidden;
  align-items: center;
  justify-content: start;
}

@media (max-width: 991px) {
  .tech {
    max-width: 100%;
  }
}

.hero-section {
  background-image: url(imgs/image.svg);
  display: flex;
  min-height: 680px;
  max-width: 100%;
  width: 100%;
  align-items: start;
  gap: 10px;
  overflow: hidden;
  justify-content: start;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.image {
  display: flex;
  min-width: 240px;
  width: 100%;
  padding-bottom: 124px;
  flex-direction: column;
}

@media (max-width: 991px) {
  .image {
    padding-bottom: 100px;
  }
}

/* .header {
  background-color: rgba(34, 45, 57, 0.5);
  display: flex;
  flex-direction: column;
  font-weight: 400;
  line-height: 1.4;
  justify-content: center;
  padding: 8px 32px;
}
@media (max-width: 991px) {
  .header {
    max-width: 100%;
    padding: 0 0px;
  }
} */
.container {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 40px 100px;
  justify-content: space-between;
  flex-wrap: wrap;
}

@media (max-width: 991px) {
  .container {
    max-width: 100%;
  }
}

.img {
  aspect-ratio: 0.97;
  object-fit: contain;
  object-position: center;
  width: 57px;
  margin-top: 4px;
}

.jaltix {
  color: rgba(255, 255, 255, 1);
  font-size: 35px;
}

.tech-labs-pvt-ltd {
  color: rgba(151, 165, 175, 1);
  font-size: 11px;
  z-index: 10;
  margin-top: -6px;
}

.transforming-ideas-into-reality-through-advanced-technologies {
  transform: rotate(5.460197627371599e-9rad);
  color: rgba(255, 255, 255, 1);
  align-self: start;
  margin: 479px 0 0 37px;
  font: 600 48px/55px Roboto, sans-serif;
}

@media (max-width: 991px) {
  .transforming-ideas-into-reality-through-advanced-technologies {
    max-width: 100%;
    margin-top: 303px;
    font-size: 40px;
    line-height: 51px;
  }
}

.components-info {
  display: flex;
  min-height: 738px;
  max-width: 100%;
  flex-direction: column;
  justify-content: center;
  padding: 37px 215px;
}

@media (max-width: 991px) {
  .components-info {
    padding: 0 20px;
  }
}

.info {
  display: flex;
  width: 100%;
  flex-direction: column;
}

@media (max-width: 991px) {
  .info {
    max-width: 100%;
  }
}

.div-4 {
  display: flex;
  align-items: center;
  justify-content: start;
  flex-wrap: wrap;
}

@media (max-width: 991px) {
  .div-4 {
    max-width: 100%;
  }
}

.div-5 {
  align-self: stretch;
  display: flex;
  min-width: 240px;
  flex-direction: column;
  width: 669px;
  margin: auto 0;
}

@media (max-width: 991px) {
  .div-5 {
    max-width: 100%;
  }
}

.div-6 {
  display: flex;
  width: 100%;
  flex-direction: column;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-6 {
    max-width: 100%;
  }
}

.div-7 {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 40px 47px;
  justify-content: start;
  flex-wrap: wrap;
}

@media (max-width: 991px) {
  .div-7 {
    max-width: 100%;
  }
}

.img-2 {
  aspect-ratio: 0.9;
  object-fit: contain;
  object-position: center;
  width: 196px;
  border-radius: 9px;
  align-self: stretch;
  min-width: 240px;
  flex-grow: 1;
  margin: auto 0;
}

.img-3 {
  aspect-ratio: 0.61;
  object-fit: contain;
  object-position: center;
  width: 196px;
  border-radius: 9px;
  align-self: stretch;
  min-width: 240px;
  flex-grow: 1;
  margin: auto 0;
}

.info-2 {
  display: flex;
  margin-top: 47px;
  width: 100%;
  flex-direction: column;
}

@media (max-width: 991px) {
  .info-2 {
    max-width: 100%;
    margin-top: 40px;
  }
}

.div-8 {
  display: flex;
  flex-direction: column;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-8 {
    max-width: 100%;
  }
}

.secondary-headline {
  color: rgba(1, 35, 91, 1);
  font: 200 48px/53px Roboto, sans-serif;
}

@media (max-width: 991px) {
  .secondary-headline {
    max-width: 100%;
    font-size: 40px;
    line-height: 49px;
  }
}

.describe-how-jaltix-applies-ai-and-machine-learning-technologies-to-build-intelligent-data-driven-solutions-for-clients-highlight-key-tools-and-libraries-like-tensor-flow-py-torch-and-custom-ai-ml-models {
  color: rgba(148, 162, 179, 1);
  letter-spacing: -0.18px;
  margin-top: 22px;
  font: 500 18px/22px Poppins, sans-serif;
}

@media (max-width: 991px) {
  .describe-how-jaltix-applies-ai-and-machine-learning-technologies-to-build-intelligent-data-driven-solutions-for-clients-highlight-key-tools-and-libraries-like-tensor-flow-py-torch-and-custom-ai-ml-models {
    max-width: 100%;
  }
}

.auto-added-frame {
  border-radius: 9px;
  align-self: stretch;
  display: flex;
  min-width: 240px;
  height: 588px;
  align-items: center;
  gap: 7px;
  overflow: hidden;
  justify-content: center;
  width: 306px;
  margin: auto 0;
}

.div-9 {
  border-radius: 9px;
  align-self: stretch;
  display: flex;
  min-width: 240px;
  width: 435px;
  flex-direction: column;
  margin: auto 0;
  padding: 0 31px;
}

@media (max-width: 991px) {
  .div-9 {
    padding: 0 20px;
  }
}

.img-4 {
  aspect-ratio: 0.52;
  object-fit: contain;
  object-position: center;
  width: 100%;
  border-radius: 9px;
}

.div-10 {
  min-height: 0px;
  width: 874px;
  max-width: 100%;
  border: 1px solid rgba(210, 210, 210, 1);
}

.info-3 {
  display: flex;
  width: 100%;
  max-width: 1009px;
  flex-direction: column;
}

@media (max-width: 991px) {
  .info-3 {
    max-width: 100%;
  }
}

.div-11 {
  display: flex;
  width: 100%;
  align-items: start;
  gap: 23px;
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 991px) {
  .div-11 {
    max-width: 100%;
  }
}

.auto-added-frame-2 {
  display: flex;
  min-width: 240px;
  align-items: start;
  gap: 7px;
  overflow: hidden;
  justify-content: start;
  flex: 1;
  flex-basis: 0%;
}

.div-12 {
  border-radius: 9px;
  display: flex;
  min-width: 240px;
  width: 321px;
  flex-direction: column;
}

.img-5 {
  aspect-ratio: 0.79;
  object-fit: contain;
  object-position: center;
  width: 100%;
  border-radius: 9px;
}

.div-13 {
  display: flex;
  min-width: 240px;
  flex-direction: column;
  width: 687px;
}

@media (max-width: 991px) {
  .div-13 {
    max-width: 100%;
  }
}

.div-14 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-14 {
    max-width: 100%;
  }
}

.info-4 {
  display: flex;
  max-width: 100%;
  width: 687px;
  flex-direction: column;
}

.div-15 {
  display: flex;
  flex-direction: column;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-15 {
    max-width: 100%;
  }
}

.secondary-headline-2 {
  color: rgba(1, 35, 91, 1);
  font: 200 48px/1.1 Roboto, sans-serif;
}

@media (max-width: 991px) {
  .secondary-headline-2 {
    max-width: 100%;
    font-size: 40px;
  }
}

.detail-the-cloud-platforms-and-services-jaltix-works-with-aws-azure-google-cloud-and-describe-how-these-solutions-drive-scalability-efficiency-and-security-for-client-infrastructures {
  color: rgba(148, 162, 179, 1);
  letter-spacing: -0.18px;
  margin-top: 22px;
  font: 500 18px/22px Poppins, sans-serif;
}

@media (max-width: 991px) {
  .detail-the-cloud-platforms-and-services-jaltix-works-with-aws-azure-google-cloud-and-describe-how-these-solutions-drive-scalability-efficiency-and-security-for-client-infrastructures {
    max-width: 100%;
  }
}

.img-6 {
  aspect-ratio: 1.75;
  object-fit: contain;
  object-position: center;
  width: 664px;
  border-radius: 9px;
  margin-top: 47px;
  max-width: 100%;
}

@media (max-width: 991px) {
  .img-6 {
    margin-top: 40px;
  }
}

.info-5 {
  display: flex;
  width: 100%;
  max-width: 1009px;
  flex-direction: column;
}

@media (max-width: 991px) {
  .info-5 {
    max-width: 100%;
  }
}

.div-17 {
  display: flex;
  min-height: 736px;
  width: 100%;
  gap: 23px;
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 991px) {
  .div-17 {
    max-width: 100%;
  }
}

.div-18 {
  display: flex;
  min-width: 240px;
  flex-direction: column;
  width: 562px;
}

@media (max-width: 991px) {
  .div-18 {
    max-width: 100%;
  }
}

.div-19 {
  display: flex;
  min-height: 736px;
  flex-direction: column;
  align-items: center;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-19 {
    max-width: 100%;
  }
}

.info-6 {
  display: flex;
  max-width: 100%;
  width: 562px;
  flex-direction: column;
}

.div-20 {
  display: flex;
  flex-direction: column;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-20 {
    max-width: 100%;
  }
}

.explain-the-data-technologies-jaltix-utilizes-to-provide-powerful-analytics-and-insights-such-as-hadoop-power-bi-and-tableau-showcase-how-these-tools-are-used-for-business-intelligence-and-decision-making {
  color: rgba(148, 162, 179, 1);
  letter-spacing: -0.18px;
  margin-top: 22px;
  font: 500 18px/22px Poppins, sans-serif;
}

@media (max-width: 991px) {
  .explain-the-data-technologies-jaltix-utilizes-to-provide-powerful-analytics-and-insights-such-as-hadoop-power-bi-and-tableau-showcase-how-these-tools-are-used-for-business-intelligence-and-decision-making {
    max-width: 100%;
  }
}

.img-7 {
  aspect-ratio: 1.36;
  object-fit: contain;
  object-position: center;
  width: 562px;
  border-radius: 9px;
  margin-top: 48px;
  max-width: 100%;
}

@media (max-width: 991px) {
  .img-7 {
    margin-top: 40px;
  }
}

.auto-added-frame-3 {
  display: flex;
  min-width: 240px;
  align-items: center;
  gap: 7px;
  overflow: hidden;
  justify-content: center;
  height: 100%;
  flex: 1;
  flex-basis: 0%;
}

@media (max-width: 991px) {
  .auto-added-frame-3 {
    max-width: 100%;
  }
}

.div-21 {
  border-radius: 9px;
  align-self: stretch;
  display: flex;
  min-width: 240px;
  width: 375px;
  flex-direction: column;
  margin: auto 0;
}

.img-8 {
  aspect-ratio: 0.51;
  object-fit: contain;
  object-position: center;
  width: 100%;
  border-radius: 9px;
}

.components-carousel-slider {
  background-color: rgba(247, 249, 252, 1);
  display: flex;
  width: 100%;
  flex-direction: column;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  padding: 40px 80px;
}

@media (max-width: 991px) {
  .components-carousel-slider {
    max-width: 100%;
    padding: 20px;
  }
}

.section {
  position: relative;
  display: flex;
  align-items: center;
  gap: 40px 54px;
  justify-content: center;
}

@media (max-width: 991px) {
  .section {
    max-width: 100%;
    flex-direction: column;
  }
}

.decoration-icons {
  align-self: start;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: start;
  left: 0px;
  bottom: 31px;
  width: 176px;
}

@media (max-width: 991px) {
  .decoration-icons {
    max-width: 100%;
    position: absolute;
    top: 300px;
    left: 220px;

  }
}

.img-9 {
  aspect-ratio: 10.99;
  object-fit: contain;
  object-position: center;
  width: 176px;
  max-width: 100%;
}

.img-10 {
  aspect-ratio: 10.99;
  object-fit: contain;
  object-position: center;
  width: 176px;
  margin-top: 16px;
  max-width: 100%;
}

.img-11 {
  aspect-ratio: 10.99;
  object-fit: contain;
  object-position: center;
  width: 176px;
  margin-top: 16px;
  max-width: 100%;
}

.img-12 {
  aspect-ratio: 10.99;
  object-fit: contain;
  object-position: center;
  width: 176px;
  margin-top: 16px;
  max-width: 100%;
}

.img-13 {
  aspect-ratio: 10.99;
  object-fit: contain;
  object-position: center;
  width: 176px;
  margin-top: 16px;
  max-width: 100%;
}

.img-14 {
  aspect-ratio: 10.99;
  object-fit: contain;
  object-position: center;
  width: 176px;
  margin-top: 16px;
  max-width: 100%;
}

.img-15 {
  aspect-ratio: 0.65;
  object-fit: contain;
  object-position: center;
  width: 292px;
  border-radius: 0px 0px 0px 0px;
  align-self: stretch;
  min-width: 240px;
  margin: auto 0;
  padding: 20px;
}

.section-text {
  align-self: stretch;
  display: flex;
  min-width: 240px;
  flex-direction: column;
  font-family: Roboto, sans-serif;
  font-weight: 500;
  justify-content: start;
  width: 610px;
  margin: auto 0;
}

@media (max-width: 991px) {
  .section-text {
    max-width: 100%;
  }
}

.top {
  width: 100%;
  font-size: 48px;
  color: rgba(1, 35, 91, 1);
  font-weight: 600;
  line-height: 53px;
}

@media (max-width: 991px) {
  .top {
    max-width: 100%;
    font-size: 40px;
    line-height: 49px;
  }
}

.paragraph {
  color: rgba(148, 162, 179, 1);
  font-size: 18px;
  line-height: 29px;
  margin-top: 24px;
}

@media (max-width: 991px) {
  .paragraph {
    max-width: 100%;
  }
}

.buttons-group {
  align-self: start;
  display: flex;
  margin-top: 24px;
  align-items: center;
  gap: 16px;
  font-size: 16px;
  color: #299ef3;
  letter-spacing: 0.5px;
  justify-content: start;
}

.button {
  border-radius: 8px;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto 0;
  padding: 12px 0;
}

.see-how-it-helped-others {
  align-self: stretch;
  padding-right: 16px;
  margin: auto 0;
}

.img-16 {
  aspect-ratio: 1;
  object-fit: contain;
  object-position: center;
  width: 24px;
  align-self: stretch;
  margin: auto 0;
}

.div-24 {
  background-color: rgba(255, 255, 255, 1);
  display: flex;
  width: 100%;
  flex-direction: column;
  overflow: hidden;
  justify-content: start;
  padding: 48px 80px;
}

@media (max-width: 991px) {
  .div-24 {
    max-width: 100%;
    padding: 20px;
    align-items: center;
  }
}

.top-2 {
  width: 100%;
  color: rgba(1, 35, 91, 1);
  font: 600 48px/1.1 Roboto, sans-serif;
  display: flex;
  justify-content: center;
}

@media (max-width: 991px) {
  .top-2 {
    max-width: 100%;
    font-size: 40px;
    width: 200px;
    padding: 12px;
  }
}

.div-25 {
  box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.25);
  align-self: center;
  display: flex;
  margin-top: 48px;
  max-width: 100%;
  align-items: start;
  gap: 32px;
  overflow: hidden;
  width: 1360px;
  justify-content: center;
  flex-wrap: wrap;
  padding: 48px 80px;
}

@media (max-width: 991px) {
  .div-25 {
    margin-top: 20px;
    padding: 20px;
  }
}

.div-26 {
  display: flex;
  min-width: 240px;
  align-items: center;
  gap: 12px;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-26 {
    max-width: 100%;
  }
}

.div-27 {
  border-radius: 12px;
  background-color: rgba(241, 232, 255, 1);
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: 10px;
  overflow: hidden;
  justify-content: center;
  width: 95px;
  height: 95px;
  margin: auto 0;
  padding: 27px;
}

@media (max-width: 991px) {
  .div-27 {
    padding: 0 20px;
  }
}

.img-17 {
  aspect-ratio: 1;
  object-fit: contain;
  object-position: center;
  width: 70px;
  align-self: stretch;
  margin: auto 0;
}

.div-28 {
  align-self: stretch;
  display: flex;
  min-width: 240px;
  flex-direction: column;
  font-family: Poppins, sans-serif;
  justify-content: start;
  margin: auto 0;
  width: 468px;
}

@media (max-width: 991px) {
  .div-28 {
    width: 328px;
  }
}

.programming-languages {
  color: rgba(0, 0, 0, 1);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.25px;
  text-align: center;
  align-self: start;
}

.tittle-3 {
  color: rgba(121, 121, 121, 1);
  font-size: 16px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: 0.16px;
}

.div-29 {
  display: flex;
  min-width: 240px;
  align-items: center;
  gap: 12px;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-29 {
    max-width: 100%;
  }
}

.div-30 {
  border-radius: 12px;
  background-color: rgba(255, 242, 242, 1);
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: 10px;
  overflow: hidden;
  justify-content: center;
  width: 95px;
  height: 95px;
  margin: auto 0;
  padding: 27px;
}

@media (max-width: 991px) {
  .div-30 {
    padding: 0 20px;
  }
}

.img-18 {
  aspect-ratio: 1;
  object-fit: contain;
  object-position: center;
  width: 50px;
  align-self: stretch;
  margin: auto 0;
}

.div-32 {
  min-width: 240px;
  width: 788px;
  height: 0px;
  flex-grow: 1;
  border: 1px solid rgba(210, 210, 210, 1);
}

.div-33 {
  display: flex;
  min-width: 240px;
  align-items: center;
  gap: 12px;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-33 {
    max-width: 100%;
  }
}

.div-34 {
  border-radius: 12px;
  background-color: rgba(226, 243, 255, 1);
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: 10px;
  overflow: hidden;
  justify-content: center;
  width: 95px;
  height: 95px;
  margin: auto 0;
  padding: 27px;
}

@media (max-width: 991px) {
  .div-34 {
    padding: 0 20px;
  }
}

.img-19 {
  aspect-ratio: 1;
  object-fit: contain;
  object-position: center;
  width: 41px;
  align-self: stretch;
  margin: auto 0;
}

.div-36 {
  display: flex;
  min-width: 240px;
  align-items: center;
  gap: 12px;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-36 {
    max-width: 100%;
  }
}

.div-37 {
  border-radius: 12px;
  background-color: rgba(255, 231, 251, 1);
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: 10px;
  overflow: hidden;
  justify-content: center;
  width: 95px;
  height: 95px;
  margin: auto 0;
  padding: 27px;
}

@media (max-width: 991px) {
  .div-37 {
    padding: 0 20px;
  }
}


.div-39 {
  background-color: rgba(34, 45, 57, 1);
  display: flex;
  width: 100%;
  flex-direction: column;
  overflow: hidden;
  justify-content: start;
}

@media (max-width: 991px) {
  .div-39 {
    max-width: 100%;
    padding: 0 20px;
  }
}

.div-40 {
  display: flex;
  min-height: 64px;
  width: 100%;
}

@media (max-width: 991px) {
  .div-40 {
    max-width: 100%;
  }
}

.div-41 {
  display: flex;
  margin-top: 40px;
  align-items: start;
  gap: 40px 100px;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 40px;
}

@media (max-width: 991px) {
  .div-41 {
    max-width: 100%;
  }
}

.community {
  border-radius: 0px 0px 0px 0px;
  display: flex;
  flex-direction: column;
  width: 123px;
}

.community-2 {
  color: var(--White, #fff);
  font: 400 24px/1 Roboto, sans-serif;
}

.learners-leadership-partners-developers {
  color: var(--Text-On-Dark, #adb7c2);
  align-self: start;
  margin-top: 25px;
  font: 500 18px/28px HK Grotesk, sans-serif;
}

.links {
  border-radius: 0px 0px 0px 0px;
  display: flex;
  flex-direction: column;
  width: 143px;
}

.quick-links {
  color: var(--White, #fff);
  font: 400 24px/1 Roboto, sans-serif;
}

.career-about-us-contact-privacy-policy {
  color: var(--Text-On-Dark, #adb7c2);
  margin-top: 25px;
  font: 500 18px/28px HK Grotesk, sans-serif;
}

.about {
  display: flex;
  min-width: 240px;
  flex-direction: column;
  align-items: start;
  color: var(--Text-On-Dark, #adb7c2);
  width: 420px;
  justify-content: start;
  font: 400 18px Roboto, sans-serif;
}

.text {
  border-radius: 0px 0px 0px 0px;
  align-self: stretch;
  width: 100%;
  padding-bottom: 9px;
  line-height: 28px;
}

@media (max-width: 991px) {
  .text {
    padding-right: 20px;
  }
}

.img-21 {
  aspect-ratio: 1;
  object-fit: contain;
  object-position: center;
  width: 36px;
}

.text-2 {
  border-radius: 0px 0px 0px 0px;
  margin-top: 32px;
  width: 157px;
  max-width: 100%;
  white-space: nowrap;
  line-height: 2;
}

@media (max-width: 991px) {
  .text-2 {
    white-space: initial;
  }
}

.social-icons {
  display: flex;
  /* Align icons in one line */
  justify-content: center;
  /* Center them horizontally */
  align-items: center;
  /* Center them vertically */
  gap: 20px;
  /* Space between each icon */
  padding: 8px;
}

.social-icon {
  color: #fff;
  /* Icon color */
  background-color: #333;
  /* Background color for each icon */
  border-radius: 50%;
  /* Circular shape */
  width: 40px;
  /* Icon container width */
  height: 40px;
  /* Icon container height */
  display: flex;
  /* Flexbox for inner alignment */
  justify-content: center;
  /* Center the icon horizontally */
  align-items: center;
  /* Center the icon vertically */
  text-decoration: none;
  /* Remove underline */
  transition: background-color 0.3s ease;
}

.social-icon:hover {
  background-color: #555;
}

.social-icon i {
  font-size: 24px;
}

.facebook {
  background-color: #3b5998;
}

.twitter {
  background-color: #1da1f2;
}

.linkedin {
  background-color: #0077b5;
}

.instagram {
  background-color: #e1306c;
}

.social-icon:hover.facebook {
  background-color: #2d4373;
}

.social-icon:hover.twitter {
  background-color: #0c85d0;
}

.social-icon:hover.linkedin {
  background-color: #005983;
}

.social-icon:hover.instagram {
  background-color: #c32c60;
}

/* General styles */
.container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}


#scrollToTopBtn {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 50px;
  height: 50px;
  background-color: #008aff;
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 20px;
  cursor: pointer;
  display: none;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
  transition: opacity 0.3s, transform 0.3s;
}

#scrollToTopBtn:hover {
  background-color: #0056b3;
}

#scrollToTopBtn.show {
  display: block;
}

.navbar-transparent {
  background: rgba(0, 0, 0, 0.3);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  border-radius: 0;
  transition: background 0.3s ease-in-out;
}

.jaltix-logo {
  align-self: stretch;
  display: flex;
  align-items: start;
  gap: 7px;
  font-family: Poppins, sans-serif;
  width: 200px;
  margin: auto 0;
  padding: 1px 16px;
}

.jaltix-logo-text {
  display: flex;
  align-items: center;
  justify-content: start;
  flex-wrap: wrap;
}

@media (max-width: 991px) {
  .jaltix-logo-text {
    max-width: 100%;
  }
}

.navbar-brand {
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: 1px;
  color: #333;
}

.navbar-nav .nav-link {
  padding: 8px 16px;
  color: #ffffff;
  font-weight: 500;
  border-radius: 8px;
  transition: all 0.3s ease;
  font-size: 18px;
  letter-spacing: 0.7px;
}

.navbar-nav .nav-link:hover {
  background-color: rgba(255, 255, 255, 0.4);
  color: #000;
}

.navbar-toggler {
  border: none;
  outline: none;
}

.navbar.scrolled {
  background: rgba(255, 255, 255, 0.95);
}

.custom-toggler-icon {
  width: 24px;
  height: 2px;
  background-color: #ffffff;
  display: block;
  position: relative;
}

.custom-toggler-icon::before,
.custom-toggler-icon::after {
  content: "";
  width: 24px;
  height: 2px;
  background-color: #ffffff;
  position: absolute;
  left: 0;
  transition: all 0.3s ease;
}

.custom-toggler-icon::before {
  top: -8px;
}

.custom-toggler-icon::after {
  top: 8px;
}