/* ....................... Home Page................... */
.as-im-home-hero-section .swiper-pagination .swiper-pagination-bullet {
  height: 5px !important;
  width: 36px !important;
  border-radius: 6px;
}

.channel-partner-slider .swiper-pagination-bullet {
  background: #000000;
  opacity: 1;
}

.channel-partner-slider .swiper-pagination-bullet-active {
  background: #8dd8f8;
}

.channel-partner-slider .swiper-pagination {
  margin-top: 25px;
  position: relative;
}

.channel-partner-slider {
  padding-bottom: 30px;
}

/* ...................... Home page services section.................. */
.prod_box {
  --hw: 9rem;
  display: grid;
  place-content: center;
  height: var(--hw);
  transition: 0.3s;
  width: var(--hw);
  border-radius: 50rem;
  background-color: #fff;
  color: #0c2c52;
  font-size: 18px;
  font-weight: 800;
}

.prod_box:hover {
  box-shadow:
    0 0 0 10px #8dd8f8,
    0 0 0 20px #d3f2ff;
}

a {
  text-decoration: none;
}

.sec_head {
  position: relative;
  margin-bottom: 22px !important;
  text-transform: capitalize;
  font-weight: 800 !important;
}

.sec_head::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: -0.75rem;
  height: 4px;
  width: 3rem;
  background-color: #8dd8f8;
}

.prod_about li {
  list-style-type: none;
  gap: 10px;
}

.prod_about li svg {
  height: 22px;
  width: 20px;
}

.product_main_box_1 {
  right: -2rem;
  top: 12%;
}

.product_main_box_2 {
  right: -3rem;
  top: 36%;
}

.product_main_box {
  position: absolute;
  transform: scale(0.85);
}

.product_main_box_3 {
  right: 0rem;
  top: 64%;
}

.product_main_box_4 {
  right: 11rem;
  top: 82%;
}

@media (min-width: 1099px) {
  .prod_img_main_box {
    padding-right: 5rem;
  }
}

@media (min-width: 1399px) {
  .prod_about {
    padding-left: 7rem;
  }
}
/* ............................... Home Client Testimonial......................... */
.client_logo
  .elementor-image-carousel-wrapper
  .elementor-image-carousel
  .swiper-slide {
  padding: 1rem;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  place-content: center;
}

.client_logo
  .elementor-image-carousel-wrapper
  .elementor-image-carousel
  .swiper-slide
  .swiper-slide-inner
  img {
  width: 100%;
  height: 99px;
  object-fit: contain;
  object-position: center;
  display: block;
}

/* .......................... Resource Page......................... */

.as-mi-services-center-wrapper:hover .as-mi-resources-box,
.as-mi-services-center-wrapper:hover .as-mi-resources-box a,
.as-mi-services-center-wrapper:hover .as-mi-resources-box h2 {
  color: #8dd8f8 !important;
}
.as-mi-services-center-wrapper:hover {
  transform: translateY(-0.5rem);
}
/* ................. About Page................ */
.as-im-about-section:hover,
.as-im-contact-section:hover {
  transform: translateY(-1rem);
}
.as-im-contact-section,
.as-im-form-box-shadow {
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.as-im-about-indistries-services {
  position: relative;
  overflow: hidden;
  z-index: 0;
  cursor: pointer;
}

.as-im-about-indistries-services::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(0, 123, 255, 0) 0%,
    rgba(0, 123, 255, 0.4) 50%,
    rgba(0, 123, 255, 0) 100%
  );
  top: -100%;
  left: -100%;
  transition: all 0.8s ease;
}

.as-im-about-indistries-services:hover::before {
  top: 100%;
  left: 100%;
}

/* .................... catalogues css............... */
.catalogues-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  justify-content: flex-start;
  /* background: #e8f6fb; */
  padding: 30px 0;
}

.catalogue-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #ebebeb;
  border-radius: 12px;
  padding: 18px 18px;
  width: 422px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.catalogue-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}

.catalogue-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.catalogue-left svg {
  color: #0072ce; /* blue PDF icon */
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}

.catalogue-title {
  font-weight: 700;
  font-size: 22px;
  color: #222;
}

.catalogue-right {
  display: flex;
  align-items: center;
  justify-content: center;
}

.catalogue-right a {
  background: #f7b500; /* yellow circle */
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s ease;
}

.catalogue-right a:hover {
  background: #ffcb42;
  transform: scale(1.1);
}

.catalogue-right svg {
  width: 32px;
  height: 32px;
  color: #fff;
}

@media (max-width: 1024px) {
  .catalogue-item {
    width: 484px;
  }
}

@media (max-width: 991px) {
  .catalogues-wrapper {
    gap: 20px;
    padding: 30px 15px;
  }
  .catalogue-item {
    padding: 16px 20px;
  }
  .catalogue-title {
    font-size: 16px;
  }
  .catalogue-item {
    width: 100%;
  }
}

@media (max-width: 600px) {
  .catalogues-wrapper {
    grid-template-columns: 1fr;
  }
  .catalogue-item {
    flex-direction: row;
  }
}

/* .......................... Services Css.................... */
.as-im-services-wrapper .elementor-post__thumbnail {
  background: #41bbc6;
  border-radius: 16px;
  padding: 25px;
  width: 228px;
  margin-bottom: -165px;
  margin-left: 40px;
}

.as-im-services-wrapper .elementor-post__thumbnail img {
  width: 100%;
  height: 180px !important;
  object-fit: contain;
  object-position: center;
  display: block;
}

.as-im-services-wrapper .elementor-post__text {
  border: 1px solid #0c2c52;
  border-radius: 18px;
  padding-top: 175px !important;
  padding-bottom: 38px !important;
}

.as-im-services-wrapper .elementor-post__title a {
  font-weight: 800 !important;
  font-size: 28px !important;
}

.as-im-services-wrapper
  .elementor-post__read-more-wrapper
  a.elementor-post__read-more {
  background: #f0ac00;
  color: #fff;
  border-radius: 6px;
  padding: 18px;
  display: inline-block;
  text-decoration: none;
  transition: all 0.3s ease;
}

.as-im-services-wrapper
  .elementor-post__read-more-wrapper
  a.elementor-post__read-more:hover {
  background: #8dd8fb;
}

.as-im-services-wrapper .elementor-post__card {
  transition: all 0.8s ease;
}

.as-im-services-wrapper .elementor-post__text {
  transition: all 0.8s ease;
}

.as-im-services-wrapper .elementor-post__card:hover .elementor-post__text {
  background: #032b5f !important;
}

.as-im-services-wrapper .elementor-post__card:hover .elementor-post__title a {
  color: #41bbc6;
}

.as-im-services-wrapper .elementor-post__card:hover .elementor-post__excerpt p {
  color: #fff !important;
}
/* ..................... Services Single Page................ */
.as-im-services-single-product {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 30px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.as-im-services-single-product th {
  background-color: #0c2c52 !important;
  color: #fff;
  text-align: left;
  padding: 12px 15px;
  font-size: 1.1em;
}

.as-im-services-single-product td {
  background-color: #e8f0fe;
  color: #7a7a7a;
  padding: 10px 15px;
  border-bottom: 1px solid #8dd8f8;
}

.as-im-services-single-product tr:last-child td {
  border-bottom: none;
}

.as-mi-table-industrial-meter {
  overflow-x: auto;
}

@media (max-width: 768px) {
  .as-im-services-single-product-wrapper {
    overflow-x: auto;
  }
}

/* ....................... Soluation Services Css..................... */
.as-single-soluation {
  width: 100%;
}

#as-im-single-drs-dcu-services div figure {
  margin-bottom: 25px;
}

#as-mi-image-icon-mrs-moniter div figure {
  margin-bottom: 30px;
}

#as-mi-image-icon-industrial-meters div figure {
  margin-bottom: 60px;
}

#as-mi-image-icon div figure {
  margin-top: 5px;
}

.as-mi-single-service-icon-list div h3 {
  margin-top: 0px;
}

@media (max-width: 1024px) {
  #as-im-single-drs-dcu-services div figure,
  #as-mi-image-icon-mrs-moniter div figure,
  #as-mi-image-icon-industrial-meters div figure {
    margin-bottom: 0px;
  }
}

@media (max-width: 768px) {
  #as-im-single-drs-dcu-services div figure,
  #as-mi-image-icon-mrs-moniter div figure,
  #as-mi-image-icon-industrial-meters div figure {
    margin-bottom: 0px;
  }

  .as-mi-single-service-icon-list div {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .as-mi-table {
    overflow-x: scroll;
  }
}

.as-link {
  color: #7a7a7a !important;
}

.as-link:hover {
  color: #7a7a7a !important;
}
/* ......................... Product Gallery Css................. */
.sp-product-gallery-wrap {
  width: 100%;
  max-width: 650px;
  margin: auto;
}

.main-slider {
  width: 100%;
  height: 450px;
  margin-bottom: 15px;
  border-radius: 12px;
  overflow: hidden;
}

.sp-product-main-img {
  position: relative;
  display: inline-block;
}

.im-image-wrapper {
  display: flex !important;
  justify-content: center;
  align-items: center;
}

.main-slider img {
  width: 100%;
  height: 450px !important;
  object-fit: contain;
  object-position: center;
  display: block;
}

.mySwiper {
  height: 156px;
}

.mySwiper .swiper-wrapper {
  height: 156px;
}

.mySwiper .swiper-slide {
  height: 156px !important;
  display: flex;
  justify-content: center;
  align-items: center;
}

.mySwiper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.swiper-button-next,
.swiper-button-prev {
  background-color: #000000;
}

.swiper-button-next svg,
.swiper-button-prev svg {
  width: 18px !important;
  height: 18px !important;
  color: #ffffff !important;
}

@media (max-width: 500px) {
  .main-slider {
    height: 320px;
  }
}

@media (max-width: 380px) {
  .main-slider {
    height: 270px;
  }
}
/* ........... Channel partner slider css................ */
.channel-partner-slider img {
  width: 100%;
  object-fit: cover;
}

.swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ....................... Archive Page Design............... */
/* ......................... Product Archive Page Css.............. */
.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card {
  padding: 10px;
}

.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card
  .elementor-post__thumbnail,
.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card
  .elementor-post__thumbnail__link::after {
  border-radius: 20px;
}

.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card
  .elementor-post__text
  h5 {
  border-bottom: 1px solid #1616161a;
  padding-bottom: 16px;
  margin: 0 0 18px;
}

.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card
  .elementor-post__read-more-wrapper
  .elementor-post__read-more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  font-weight: 600;
  text-transform: capitalize;
  font-size: 16px;
}

.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card
  .elementor-post__read-more-wrapper
  .elementor-post__read-more::after {
  content: url("https://maroon-dove-548416.hostingersite.com/wp-content/uploads/2026/03/arrow.svg");
  margin: 0;
  width: 24px;
  height: 24px;
  padding: 4px;
  background-color: #0c2c52;
  border-radius: 50%;
  rotate: -45deg;
  transition: 375ms cubic-bezier(0.7, 0, 0.3, 1);
}

.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card
  .elementor-post__read-more-wrapper
  a:hover::after {
  background-color: #0c2c52;
  rotate: 0deg;
}

.as-sp-product-list-box
  .elementor-posts-container
  .elementor-post
  .elementor-post__card
  .elementor-post__read-more-wrapper
  a:hover {
  color: #0c2c52 !important;
}

.as-sp-product-list-box .elementor-post__thumbnail img {
  width: 100% !important;
  height: 250px !important;
  object-fit: contain;
  object-position: center;
  display: block !important;
}

.decorated-link,
.decorated-link:hover {
  color: #000000;
  text-decoration: none;
}
/*.......................technology partner related product............. */
.sp-title {
  font-family: "Mont", Sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 36px;
  color: #000000;
  margin-bottom: 10px;
}

.sp-partner-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.sp-partner-item {
  width: 250px;
}

.sp-partner-item img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
