html {
  scroll-behavior: smooth;
  scroll-padding-top: 160px; /* your header height */
}
.site-header .site-branding img {
  max-height: 140px !important;
}

.bg-light1 {
  background-color: #8cc63f !important;
}

.sec-title {
  color: #ffffff !important;
}
/* .header-style-2 .pbmit-button-box .header-button .pbmit-btn {
    padding: 13px 20px !important;
} */
.header-style-2 .site-branding {
  height: 45px !important;
}
/* .image-frame{
    border-radius: 20px 0px;
    padding: 20px;
    border: 1px solid #8CC63F;
} */

.sec-title2 {
  color: black !important;
}

.service__text p {
  font-size: 18px !important;
  color: #ffffff !important;
}

.text-color {
  color: #bbb !important;
}

.site-footer,
.site-footer.thsn-bg-color-custom:before {
  background-color: #ffffff !important;
}

.banner-img2 {
  width: 80px;
  height: 80px;
}

.about-img-01 {
  margin-top: -40px !important;
}

.site-footer .widget.widget_nav_menu ul li > a::before {
  content: none !important;
}
:root {
  --swiper-navigation-size: 25px !important;
}

.about__content ul li::before,
.about__content-6 ul li::before,
.about__content-3 ul li::before {
  content: none !important;
}
li b {
  white-space: normal !important;
  word-wrap: break-word;
  margin-left: 5px;
}
@media (max-width: 767px) {
  .about-img-02 {
    margin: 1px 0px 0px 220px !important;
  }
  .mobile-space-2 {
    margin-bottom: 10% !important;
  }
}
@media (max-width: 660px) {
  .form-row {
    display: block !important;
  }
}
@media (max-width: 576px) {
  .about-img-02 {
    margin: 0 !important;
    width: 380px !important;
  }
  .mobile-logo {
    margin-left: 85%;
  }
}

.header-style-2 .sticky-header .pbmit-sticky-logo {
  height: 60px !important;
}

.about__content ul li,
.about__content-6 ul li,
.about__content-3 ul li {
  padding-bottom: 10px !important;
}
.sticky-header {
  padding: 3px !important;
}

.site-footer .widget.widget_nav_menu ul li > a {
  padding-left: 0px !important;
}
.header-style-2 .pbmit-button-box .header-button:hover .pbmit-btn {
  background-color: #bebcbc !important;
}

.home2-section-what-we-do-img {
  left: 0px !important;
}

.vectors {
  width: 60px;
  height: auto;
}

.footer-img {
  width: 100px;
}

.swiper-button-prev {
  right: auto !important;
  padding: 10px !important;
}

.swiper-button-next {
  left: auto !important;
}

.form-row {
  display: flex;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.form-col {
  flex: 1 1 48%;
}

.home-2-section-testimonail-bg {
  background-image: none !important;
}

/* Field Titles */
.form-col label {
  display: block;
  font-weight: 500;
  margin-bottom: 0.5px;
  /* near-zero spacing */
  font-size: 16px;
  /* increased font size */
  color: #222;
}

/* Inputs and Selects - Uniform Styling */
input[type="text"],
input[type="tel"],
input[type="email"],
textarea,
select {
  width: 100%;
  height: 38px;
  padding: 6px 10px;
  font-size: 13px;
  border: 1px solid #ccc;
  border-radius: 15px;
  background-color: #f5f5f5;
  color: #333;
  box-shadow: none;
  outline: none;
  appearance: none;
  transition: border 0.2s ease;
  line-height: 1.2;
  box-sizing: border-box;
}

/* Textarea Exception */
textarea {
  height: auto;
  min-height: 70px;
  resize: vertical;
}

/* Submit Button */
.form-submit {
  text-align: center;
  margin-top: 20px;
}

input[type="submit"] {
  background-color: #444;
  color: #fff;
  border: none;
  padding: 10px 24px;
  font-size: 14px;
  border-radius: 15px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.mobile-text {
  color: #ffffff;
}

input[type="submit"]:hover {
  background-color: #000;
}

@media (max-width: 1024px) {
  .extra-text {
    display: none;
  }
  .service-inner {
    margin-top: -160px !important;
  }

  .medal-img {
    width: 30px;
  }

  .ev-text {
    font-size: 10px !important;
  }

  .about__imgs .projects p span,
  .about__imgs-6 .projects p span {
    font-size: 20px !important;
  }
}

@media (max-width: 576px) {
  .mobile-text {
    display: none;
  }

  .site-header .site-branding img {
    max-height: 100px !important;
  }
  .youtube-slider {
    margin-bottom: 10% !important;
  }
}

@media (max-width: 768px) {
  .dealer-img {
    height: 500px;
  }

  .mobile-img {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 991px) {
  .home2-section-what-we-do-img img {
    width: 385px !important;
  }
  .custom-prev,
  .custom-next {
    top: 9% !important;
  }
  .custom-prev {
    left: 84% !important;
  }
}

.form-col label {
  font-weight: bold !important;
  margin-bottom: 5px !important;
}

input[type="text"],
input[type="tel"],
input[type="email"],
textarea,
select {
  border: 1px solid #8cc63f !important;
  border-radius: 15px 0px 15px 0px !important;
  background-color: #ffffff !important;
  box-shadow: none;
}
.footer-paragrapgh {
  margin-inline: 10px;
}

.service__item.style2 .service__content {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
}
.image-shadow {
  /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4); */
  border: 2px dashed #8cc63f;
  border-radius: 20px 0px;
}

/* card slider product */
.swiper-container-wrapper {
  max-width: 1200px;
  margin: auto;
}

.swiper {
  padding-bottom: 20px;
  /* Ensure space below for pagination */
}

.swiper-slide {
  width: auto; /* or let Swiper control it */
  flex-shrink: 0;
  box-sizing: border-box;
  padding: 0 10px; /* optional spacing */
}

/* .swiper-slide>div {
    padding: 0 10px;
    flex: 1;
} */

iframe {
  width: 100%;
  height: 200px;
  border-radius: 8px;
  border: none;
}

/* External pagination styling */
.custom-pagination {
  text-align: center;
  margin-top: 20px;
}

.custom-pagination .swiper-pagination-bullet {
  background-color: #ccc;
  opacity: 1;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 50%;
  display: inline-block;
  cursor: pointer;
}
.image-icon {
  width: 100px;
  height: 100px;
}
.youtube-slider {
  position: relative;
  margin-bottom: 3%;
}
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: -30px !important;
}

.custom-pagination .swiper-pagination-bullet-active {
  background-color: #8cc63f !important;
}

@media (max-width: 767px) {
  .swiper-slide {
    width: 100% !important;
  }

  iframe {
    height: 180px;
  }
  .youtube-slider {
    margin-bottom: 10%;
    margin-top: 6%;
  }
  .pbmit-footer-big-area {
    padding-top: 0px !important;
  }
  .mobile-space {
    padding-top: 60px;
  }
}

@media (min-width: 768px) {
  .swiper-slide {
    width: calc(100% / 3) !important;
  }

  iframe {
    height: 220px;
  }
}

/* circle green */
.circle-stat {
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background-color: #8cc63f;
  position: relative;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.circle-stat::before {
  content: "";
  position: absolute;
  top: 12px;
  left: 12px;
  right: 12px;
  bottom: 12px;
  border-radius: 50%;
  border: 2px dotted white;
}

.circle-content {
  text-align: center;
  color: #000;
  position: relative;
  z-index: 2;
}

.percent {
  font-size: 32px;
  font-weight: bold;
}

.label12 {
  font-size: 14px;
}
@media screen and (max-width: 768px) {
  .circle-stat {
    margin-bottom: 20px !important;
  }
}

@media screen and (max-width: 600px) {
  .circle-stat {
    width: 120px;
    height: 120px;
    padding: 33px;
  }
  .label12 {
    font-size: 12px;
  }

  .percent {
    font-size: 20px;
  }
}
/* Vertical Social Icons */
.site-footer .social-media-icons {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 15px;
}

.site-footer .social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: #f5f5f5;
  color: #333;
  border-radius: 50%;
  transition: all 0.3s ease;
}

.site-footer .social-icon:hover {
  background-color: #8cc63f !important;
  color: white !important;
}
.center-align {
  width: 78% !important;
  text-align: center !important;
}
.custom-nav {
  position: absolute;
  top: 60%;
  transform: translateY(-50%);
  z-index: 10;
  background-color: #8cc63f;
  color: white;
  font-size: 24px;

  border-radius: 50%;
  cursor: pointer;
  user-select: none;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.custom-prev {
  left: 88% !important;
}
@media (max-width: 1140px) {
  .custom-prev {
    left: 42% !important;
  }
  .custom-next {
    right: 45% !important;
  }
}
.swiper-button-next,
.swiper-button-prev {
  top: 60% !important;
}
.custom-prev,
.custom-next {
  top: 7% !important;
  padding: 25px !important;
}
.custom-swiper-prev,
.custom-swiper-next {
  background-color: #8cc63f;
}
@media (max-width: 767px) {
  .custom-swiper-prev,
  .custom-swiper-next {
    display: none !important;
  }
}

.custom-next {
  right: 10px;
}

/* Optional hover effect */
.custom-nav:hover {
  background-color: #6ea52e;
}

/* Responsive positioning if needed */
@media (max-width: 767px) {
  .custom-prev,
  .custom-next {
    padding: 8px 12px;
    font-size: 20px;
  }

  .button-align1,
  .button-align2 {
    top: 4% !important;
  }
  .button-align1 {
    left: 2% !important;
  }
  .button-align2 {
    right: 2% !important;
  }
}

body .scroll-to-top {
  display: none !important;
}
/* whatsapicon */
.whatsapp-float {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
  background-color: #25d366;
  border-radius: 50%;
  padding: 12px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}

.whatsapp-float:hover {
  transform: scale(1.1);
}

.whatsapp-float img {
  width: 32px;
  height: 32px;
}
.pointers2 {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}
.feature-item {
  display: flex;
  align-items: center;
  font-weight: bold;
  line-height: 1.4;
}

.feature-text {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  width: 100%;
}

.value {
  font-weight: bold;
}

/* Mobile responsive adjustments */
@media (max-width: 600px) {
  .whatsapp-float {
    bottom: 15px;
    right: 15px;
    padding: 10px;
  }

  .whatsapp-float img {
    width: 28px;
    height: 28px;
  }
}
@media (max-width: 400px) {
  .mobile-boxes {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .label {
    font-size: 14px;
  }
  .value {
    font-size: 14px;
  }
  .about__content ul li,
  .about__content-6 ul li,
  .about__content-3 ul li {
    padding-left: 10px !important;
    padding-bottom: 5px !important;
  }
}

.alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
}

.alert-success {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}

.alert-danger {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;
}
/* scope */
.image-frame *{ box-sizing:border-box; }
.image-frame input[type="radio"]{ display:none; }

.image-frame .ev-slider{ position:relative; width:100%; overflow:hidden; }

/* Track + slides */
/* Track + slides */
.image-frame .ev-track{
  display:flex;
  gap:0;
  will-change:transform;
  /* remove CSS keyframe autoplay; JS handle karega */
  animation: none !important;
  transition: transform .6s ease;
}

.image-frame .ev-slide{ flex:0 0 100%; }
.image-frame .ev-slide img{ width:100%; height:auto; display:block; object-fit:cover; }

/* Dots */
.image-frame .ev-dots{
  display:flex; justify-content:center; gap:10px;
  margin:14px 0 0;
}
.image-frame .ev-dot{
  width:10px; height:10px; border-radius:999px;
  background:#cfcfcf; opacity:.7; cursor:pointer; transition:.25s;
}
.image-frame .ev-dot:hover{ opacity:1; }

/* Active dot color */
.image-frame input#ev1:checked ~ .ev-dots label[for="ev1"],
.image-frame input#ev2:checked ~ .ev-dots label[for="ev2"],
.image-frame input#ev3:checked ~ .ev-dots label[for="ev3"],
.image-frame input#ev4:checked ~ .ev-dots label[for="ev4"],
.image-frame input#ev5:checked ~ .ev-dots label[for="ev5"]{
  background:#0a7cff; opacity:1;
}

/* ❌ REMOVE these if present:
.image-frame input#evX:checked ~ .ev-track { transform: ... }
They permanently override animation. 
*/


/* ❌ Do NOT pause on focus-within (mobile me focus stick hota hai)
.image-frame:has(.ev-dots:focus-within) .ev-track { animation-play-state: paused; }
.image-frame:has(.ev-thumbs:focus-within) .ev-track { animation-play-state: paused; }
*/

/* Autoplay: one full slide every 4s (5 slides = 20s) */
@keyframes evAutoplay{
  0%   { transform: translateX(0%); }
  18%  { transform: translateX(0%); }
  20%  { transform: translateX(-100%); }

  38%  { transform: translateX(-100%); }
  40%  { transform: translateX(-200%); }

  58%  { transform: translateX(-200%); }
  60%  { transform: translateX(-300%); }

  78%  { transform: translateX(-300%); }
  80%  { transform: translateX(-400%); }

  98%  { transform: translateX(-400%); }
  100% { transform: translateX(0%); }
}

/* Thumbnails row (mobile-friendly scroll) */
.image-frame .ev-thumbs{
  display:flex;
  flex-wrap:nowrap;
  gap:10px;
  margin:14px auto 0;
  padding:0 8px 8px;
  overflow-x:auto;
  /* mobile momentum + snap */
  -webkit-overflow-scrolling: touch;
  scroll-snap-type:x proximity;
  /* remove center-justify so it can actually scroll */
  justify-content:center;
  align-items:center;
  /* fade edges hint */
  mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
}
.image-frame .ev-thumbs::-webkit-scrollbar{ height:6px; }
.image-frame .ev-thumbs::-webkit-scrollbar-thumb{ background:#ddd; border-radius:999px; }
@media (max-width:768px){
  /* optionally hide scrollbar on mobile */
  .image-frame .ev-thumbs::-webkit-scrollbar{ display:none; }
}

.image-frame .ev-thumb{
  width:90px; min-width:90px;
  aspect-ratio:16/9;
  border-radius:8px; overflow:hidden; cursor:pointer;
  border:2px solid transparent; transition:.2s;
  scroll-snap-align:start;
}
.image-frame .ev-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.image-frame .ev-thumb:hover{ border-color:#bbb; }

/* Active thumb highlight */
.image-frame input#ev1:checked ~ .ev-thumbs label[for="ev1"],
.image-frame input#ev2:checked ~ .ev-thumbs label[for="ev2"],
.image-frame input#ev3:checked ~ .ev-thumbs label[for="ev3"],
.image-frame input#ev4:checked ~ .ev-thumbs label[for="ev4"],
.image-frame input#ev5:checked ~ .ev-thumbs label[for="ev5"]{
  border-color:#0a7cff;
}

/* responsive sizes */
@media (max-width:768px){
  .image-frame .ev-dot{ width:9px; height:9px; }
  .image-frame .ev-thumb{ width:72px; min-width:72px; }
}

/* accessibility: user prefers reduced motion */
@media (prefers-reduced-motion: reduce){
  .image-frame .ev-track{ animation: none; transform: translateX(0%); }
}