.wpcf7 .screen-reader-response{position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;margin:-1px;padding:0;border:0;word-wrap:normal!important}.wpcf7 form .wpcf7-response-output{margin:2em .5em 1em;padding:.2em 1em;border:2px solid #00a0d2}.wpcf7 form.init .wpcf7-response-output,.wpcf7 form.resetting .wpcf7-response-output,.wpcf7 form.submitting .wpcf7-response-output{display:none}.wpcf7 form.sent .wpcf7-response-output{border-color:#46b450}.wpcf7 form.failed .wpcf7-response-output,.wpcf7 form.aborted .wpcf7-response-output{border-color:#dc3232}.wpcf7 form.spam .wpcf7-response-output{border-color:#f56e28}.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.unaccepted .wpcf7-response-output,.wpcf7 form.payment-required .wpcf7-response-output{border-color:#ffb900}.wpcf7-form-control-wrap{position:relative}.wpcf7-not-valid-tip{color:#dc3232;font-size:1em;font-weight:400;display:block}.use-floating-validation-tip .wpcf7-not-valid-tip{position:relative;top:-2ex;left:1em;z-index:100;border:1px solid #dc3232;background:#fff;padding:.2em .8em;width:24em}.wpcf7-list-item{display:inline-block;margin:0 0 0 1em}.wpcf7-list-item-label::before,.wpcf7-list-item-label::after{content:" "}.wpcf7-spinner{visibility:hidden;display:inline-block;background-color:#23282d;opacity:.75;width:24px;height:24px;border:none;border-radius:100%;padding:0;margin:0 24px;position:relative}form.submitting .wpcf7-spinner{visibility:visible}.wpcf7-spinner::before{content:'';position:absolute;background-color:#fbfbfc;top:4px;left:4px;width:6px;height:6px;border:none;border-radius:100%;transform-origin:8px 8px;animation-name:spin;animation-duration:1000ms;animation-timing-function:linear;animation-iteration-count:infinite}@media (prefers-reduced-motion:reduce){.wpcf7-spinner::before{animation-name:blink;animation-duration:2000ms}}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes blink{from{opacity:0}50%{opacity:1}to{opacity:0}}.wpcf7 input[type="file"]{cursor:pointer}.wpcf7 input[type="file"]:disabled{cursor:default}.wpcf7 .wpcf7-submit:disabled{cursor:not-allowed}.wpcf7 input[type="url"],.wpcf7 input[type="email"],.wpcf7 input[type="tel"]{direction:ltr}


/* my changes */

/* Flex utility (you already use this, just make sure it's defined) */
.flex {
    display: flex;
    align-items: center;
  }
  
  .flex.row {
    flex-direction: row;
    gap: 10px;
  }
  
  @media (max-width: 768px) {
    .logo_text {
      font-size: 16px;
    }
  
    .logo_wrapper img {
      width: 180px;
    }
  }

  .logo_container {
    display: flex;
    align-items: center;
  }
  
  .logo_align {
    display: flex;
    align-items: center;
  }
  
  .logo_wrapper {
    display: flex;
    align-items: center;
    text-decoration: none;
  }
  
  /* Logo Image */
  .logo_img {
  width: 120px; /* Default size for mobile */
  height: auto;
  transition: all 0.3s ease;
}
  /* Logo Text */
.logo_text {
  font-size: 24px;
  font-weight: 700;
  margin-left: 15px;
  color: #333; /* Adjust color to match your design */
  white-space: nowrap;
  transition: all 0.3s ease;
}


/* Desktop Sizes */
@media (min-width: 992px) {
  .logo_img {
    width: 160px; /* Larger for desktop */
  }
  .logo_text {
    font-size: 28px;
    margin-left: 20px;
  }
}

/* Large Desktop Sizes */
@media (min-width: 1200px) {
  .logo_img {
    width: 200px; /* Even larger for big screens */
  }
  .logo_text {
    font-size: 32px;
  }
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .logo_img {
    width: 100px;
  }
  .logo_text {
    font-size: 20px;
    margin-left: 10px;
  }
}


  rs-module-wrap {
    max-width: 100%;
    height: auto;
  }
   .services-section {
      background-color: rgb(37, 71, 6);
     
    }

    .service-box {
      text-align: center;
    }

    .service-icon {
      /* font-size: 40px; */
      margin-bottom: 15px;
  
      
    }

    .service-title {
      font-weight: bold;
      font-size: 20px;
      color: #fff;
    }

    .underline {
      width: 40px;
      height: 1px;
      background-color: #fff;
      margin: 10px auto 20px auto;
    }

    .btn-dark {
      font-size: 14px;
      padding: 6px 12px;
    }


    .video-container {
      position: relative;
      width: 100%;
      max-width: 600px;
      margin: auto;
    }
  
    .video-container video {
      width: 100%;
      height: auto;
      border-radius: 10px;
      object-fit: cover;
    }
  
    /* Center play button */
    .center-play-btn {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: rgba(0, 0, 0, 0.6);
      border: none;
      border-radius: 50%;
      padding: 20px;
      font-size: 40px;
      color: white;
      cursor: pointer;
      z-index: 2;
      transition: background 0.3s ease;
    }
  
    .center-play-btn:hover {
      background: rgba(0, 0, 0, 0.8);
    }
  
    .video-controls {
      width: 100%;
      background: rgba(0, 0, 0, 0.85);
      color: white;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px;
      position: absolute;
      bottom: 0;
      left: 0;
      border-radius: 0 0 10px 10px;
    }
  
    .video-controls button {
      background: none;
      border: none;
      color: white;
      font-size: 18px;
      cursor: pointer;
      padding: 5px;
    }
  
    .video-controls input[type="range"] {
      flex: 1;
      margin: 0 10px;
    }
  
    .time-label {
      font-size: 14px;
      min-width: 50px;
      text-align: center;
    }
    /* Custom CSS to reduce the height of the slide */
#rev_slider_1_1_wrapper {
  height: 550px !important; /* Adjust this value as per your requirement */
}

#rev_slider_1_1 {
  height: 550px !important; /* Adjust this value as well */
}

.rs-slide {
  height: 550px !important; /* Ensure each slide respects the height */
}


      /* Responsive Navigation */

/* Mobile menu toggle */
#mobile_nav_icon {
  display: none;
}

@media (max-width: 991px) {
  #mobile_nav_icon {
    display: block;
  }
  #main_menu {
    display: none;
  }
}

    /* responsive logo */

    .logo_img {
      max-width: 100%;
      height: auto;
      width: 85px; /* Default size */
    }
    
    @media (min-width: 768px) {
      .logo_img {
        width: 120px;
      }
    }


    /* Slider Height Adjustment */

    /* Slider height for different devices */
#rev_slider_1_1_wrapper,
#rev_slider_1_1,
.rs-slide {
  height: 300px !important;
}

@media (min-width: 768px) {
  #rev_slider_1_1_wrapper,
  #rev_slider_1_1,
  .rs-slide {
    height: 500px !important;
  }
}

@media (min-width: 992px) {
  #rev_slider_1_1_wrapper,
  #rev_slider_1_1,
  .rs-slide {
    height: 550px !important;
  }
}

    /* About us section */

    /* About section responsive layout */
.ppb_card_two_cols_with_image .inner {
  flex-direction: column;
}

@media (min-width: 768px) {
  .ppb_card_two_cols_with_image .inner {
    flex-direction: row;
  }
}

    /* Program card */

    /* Program cards responsive layout */
.ppb_image_boxed {
  flex: 0 1 100%;
  margin-bottom: 20px;
}

@media (min-width: 576px) {
  .ppb_image_boxed {
    flex: 0 1 calc(50% - 20px);
  }
}

@media (min-width: 992px) {
  .ppb_image_boxed {
    flex: 0 1 calc(33.333% - 20px);
  }
}


/* Service section */

/* Services responsive layout */
.service-box {
  flex: 0 1 100%;
  /* margin-bottom: 30px; */
}

@media (min-width: 576px) {
  .service-box {
    flex: 0 1 calc(50% - 20px);
  }
}

@media (min-width: 768px) {
  .service-box {
    flex: 0 1 calc(25% - 20px);
  }
}

      /* Font Size */

      /* Services responsive layout */
.service-box {
  flex: 0 1 100%;
  margin-bottom: 30px;
}

@media (min-width: 576px) {
  .service-box {
    flex: 0 1 calc(50% - 20px);
  }
}

@media (min-width: 768px) {
  .service-box {
    flex: 0 1 calc(25% - 20px);
  }
}

/* Padding/Marging Adjustment */

/* Section padding adjustments */
.ppb_header {
  padding: 35px 0px 0px 0px !important
}

@media (min-width: 768px) {
  .ppb_header {
   padding-top: 30px !important;
  }
}


    /* Footer */

    /* Footer responsive layout */
#footer .sidebar_widget {
  flex-direction: column;
}

@media (min-width: 768px) {
  #footer .sidebar_widget {
    flex-direction: row;
    justify-content: space-between;
  }
  
  #footer .widget {
    flex: 0 1 30%;
  }
}


/* Full Responsive */

/* Responsive Base Styles */
@media (max-width: 767px) {
  /* Mobile menu */
  .mobile_menu_wrapper {
    width: 100%;
  }
  
  /* Slider text adjustments */
  .hero-title {
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
  }
  
  /* About section */
  .ppb_card_two_cols_with_image .inner > div {
    flex: 0 0 100% !important;
    margin-bottom: 0px;
  }
  
  /* Program cards */
  .ppb_image_boxed {
    flex: 0 0 100% !important;
  }
  
  /* Parallax section */
  .parallax {
    height: auto !important;
    padding: 60px 20px !important;
  }
  
  /* Services */
  .service-box {
    flex: 0 0 100% !important;
    margin-bottom: 30px;
  }
  
  /* Footer widgets */
  #footer .widget {
    margin-bottom: 30px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  /* Tablet styles */
  .ppb_image_boxed {
    flex: 0 0 calc(50% - 20px) !important;
  }
  
  .service-box {
    flex: 0 0 calc(50% - 20px) !important;
  }
}

/* Fluid scaling approach */
.logo_img {
  width: clamp(100px, 12vw, 200px); /* Min 100px, scales with viewport, max 200px */
}

.logo_text {
  font-size: clamp(20px, 2.5vw, 32px); /* Min 20px, scales with viewport, max 32px */
  margin-left: clamp(10px, 1.5vw, 20px);
}

/* When header is sticky/scrolled */
.header-scrolled .logo_img {
  width: 120px;
}

.header-scrolled .logo_text {
  font-size: 24px;
}


.logo_text {
  font-family: 'Rubik', sans-serif; /* Or your preferred font */
}


.logo_wrapper {
  align-items: center;
  display: flex;
}

.logo_img {
  align-self: center; /* Adjust vertical alignment if needed */
}

.logo_wrapper:hover .logo_img {
  transform: scale(1.05);
}

/* .logo_wrapper:hover .logo_text {
  color: ;
} */


/* Header Container */
.top_bar {
  padding: 15px 0;
}

/* Logo Wrapper */
#logo_wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

/* Logo Container */
.logo_container {
  flex: 1;
}

/* Logo Image */
.logo_img {
  max-height: 50px; /* Adjust based on your logo proportions */
  width: auto;
}

/* Mobile Menu Button */
.mobile-menu-right {
  display: block;
}

.navbar-toggler {
  background: none;
  border: none;
  padding: 8px;
  font-size: 24px;
  color: #333; /* Match your design */
}

/* Desktop View - Hide mobile button */
@media (min-width: 992px) {
  .mobile-menu-right {
    display: none;
  }
}

/* Mobile View Adjustments */
@media (max-width: 991px) {
  #logo_wrapper {
    padding: 0 15px;
  }
  
  .logo_img {
    max-height: 40px; /* Slightly smaller for mobile */
  }
  
  .navbar-toggler {
    font-size: 20px;
  }
}

@media (max-width: 360px) {
  .logo_img {
    max-height: 35px;
  }
  .navbar-toggler {
    font-size: 18px;
    padding: 5px;
  }
}


/* Services Section Styling */
.services-section {

  background-color: rgb(37, 71, 6);
}

.service-box {
  text-align: center;
  padding: 60px 20px;
  transition: all 0.3s ease;
}

.service-box:hover {
  transform: translateY(-5px);
}

.service-icon img {
  width: 60px;
  height: 60px;
  margin-bottom: 20px;
  transition: transform 0.3s ease;
}

.service-box:hover .service-icon img {
  transform: scale(1.1);
}

.service-title {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 15px;
}

.underline {
  width: 50px;
  height: 2px;
  background-color: #fff;
  margin: 0 auto 20px;
}

.service-btn {
  background-color: #f79468;
  color: #fff;
  padding: 8px 20px;
  border-radius: 4px;
  border: none;
  transition: all 0.3s ease;
}

.service-btn:hover {
  background-color: #e07d55;
  color: #fff;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
  .service-box {
    margin-bottom: 30px;
  }
}

@media (max-width: 767px) {
  .services-section {
    /* padding: 40px 0; */
  }
  
  .service-box {
    padding: 25px 15px;
  }
  
  .service-icon img {
    width: 50px;
    height: 50px;
  }
  
  .service-title {
    font-size: 18px;
  }
}


/* Force white background on all devices */
.white-bg-section {
  background-color: white !important;
}

/* If there's any media query overriding this, make sure to reset it */
@media (max-width: 767px) {
  .white-bg-section {
    background-color: white !important;
  }
}

/* If text color needs to be adjusted */
.white-bg-section .ppb_title {
  color: #646a7c !important; /* Your existing gray color */
}

.white-bg-section p {
  color: #333 !important; /* Standard dark text color */
}


/* Base styles */
.parallax-section {
  position: relative;
  background-image: url('images/AD/index-bg-middle.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 0;
  /* margin-bottom: 20px; */
  
}

.parallax-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
}

.parallax-content {
  position: relative;
  z-index: 2;
  color: white;
  text-align: center;
  width: 90%;
  max-width: 1200px;
  padding: 30px;
  border-radius: 10px;
}

.parallax-content h2 {
  font-size: 2rem;
  /* margin-bottom: 20px; */
  line-height: 1.3;
}

.subtitle {
  font-size: 1.5rem;
  /* margin-bottom: 30px; */
}

.features-list {
  margin: 0 auto 30px;
  max-width: 800px;
}

.feature-item {
  margin-bottom: 20px;
}

.feature-item p {
  font-size: 1.1rem;
  line-height: 1.6;
  /* margin-bottom: 15px; */
}

.divider {
  height: 1px;
  background: rgba(255, 255, 255, 0.3);
  width: 100px;
  margin: 0 auto;
}

.additional-info p {
  font-size: 1rem;
  line-height: 1.7;
  /* margin-bottom: 20px; */
}

/* Mobile responsive styles */
@media (max-width: 768px) {
  .parallax-section {
    background-attachment: scroll;
    min-height: auto;
    padding: 30px 0;
  }
  
  .parallax-content {
    padding: 20px 15px;
    width: 95%;
  }
  
  .parallax-content h2 {
    font-size: 1.5rem;
  }
  
  .subtitle {
    font-size: 1.2rem;
    margin-bottom: 20px;
  }
  
  .feature-item p,
  .additional-info p {
    font-size: 1rem;
  }
  
  .divider {
    width: 60px;
  }
}

@media (max-width: 480px) {
  .parallax-content h2 {
    font-size: 1.3rem;
  }
  
  .subtitle {
    font-size: 1.1rem;
  }
}

.middle-color{
  background-color: rgb(46, 39, 39);
}
@media (max-width: 768px) {
  #footer .sidebar_widget {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  #footer .widget {
    margin-bottom: 20px;
  }

  #footer .textwidget p {
    justify-content: center;
  }

  .footer_bar_wrapper {
    flex-direction: column;
    text-align: center;
  }
}
@media (max-width: 768px) {
  /* For the main footer content */
  #footer .sidebar_widget {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  #footer .widget {
    margin-bottom: 20px;
  }

  #footer .textwidget p {
    justify-content: center;
  }

  /* For the bottom copyright bar */
  .footer_bar_wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: auto;
    padding: 10px 0;
    text-align: center;
  }

  .footer_bar_wrapper #copyright {
    justify-content: center !important;
    text-align: center !important;
    display: flex !important;

  }
}
/* Initial hidden state */
.slide-from-right, .slide-from-left {
  opacity: 0;
  transform: translateX(100px);
  transition: all 1s ease;
}

.slide-from-left {
  transform: translateX(-100px);
}

/* When in view */
.show {
  opacity: 1;
  transform: translateX(0);
}
/* Default position for the text */
.slide-text-left {
  transform: translateX(-100px);
  opacity: 0;
  transition: all 1s ease-out;
}

/* When the text is in view, it will slide in and become visible */
.slide-text-left.visible {
  transform: translateX(0);
  opacity: 1;
}
@media (max-width: 600px) {
  #slider-1-slide-1-logo {
    max-width: 25vw;
    max-height: 25vw;
    min-width: 90px !important;
    min-height: 90px !important ;
    margin-top: 90px !important;
  }
}
@media (max-width: 768px) {
  #slider-1-slide-1-layer-1 {
      font-size: 16px !important; 
      line-height: 28px !important;
      text-align: center !important;
      left: 50% !important; 
      transform: translateX(-50%) !important;
      margin-top: 100px !important;
      padding-top: 15px;
      width: 240px !important; 
      white-space: normal !important; 
  }
}
.extra-padding{
  margin-top: 250px;
}
 /* Remove extra padding on mobile */
@media (max-width: 768px) {
  .extra-padding {
      margin-top: 0;  /* Removes the margin-top on mobile */
  }
}
.icon-class{
  margin-top: 30px;
}
@media (max-width: 768px) {

  .icon-class{
    margin-top: 10px;
  }

}


/* popup */

/* Popup Background */
.popup {
  display: none; 
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  z-index: 999;
  justify-content: center;
  align-items: center;
}

/* Popup Box */
.popup-content {
  background: #fff;
  padding: 30px;
  border-radius: 10px;
  width: 90%;
  max-width: 500px;
  text-align: center;
  animation: popupFade 0.5s ease-out, popupZoom 0.5s ease-out;
  position: relative;
}

/* Popup Title & Text Animation */
.popup-content h2, .popup-content p {
  animation: textSlide 0.7s ease forwards;
}

/* Special Bigger Width for Popup2 */
#popup2 .popup-content {
  max-width: 800px; /* Wider for popup2 only */
  width: 90%; /* Allow it to shrink on small screens */
  text-align: left; /* Optional: text alignment to match your paragraph style */
}

/* Close Button */
.close-btn {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 24px;
  cursor: pointer;
}

/* Animations */
@keyframes popupFade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes popupZoom {
  from { transform: scale(0.7); }
  to { transform: scale(1); }
}

@keyframes textSlide {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Responsive + Scrollable Popup */
@media (max-width: 768px) {
  .popup-content,
  #popup2 .popup-content {
    width: 90%;
    max-width: 90%;
    max-height: 80vh; /* 👈 set max-height to 80% of screen */
    overflow-y: auto; /* 👈 enable vertical scroll inside popup */
    font-size: 14px;
  }
}

/* Optional: Hide scrollbar style for better look */
.popup-content::-webkit-scrollbar {
  width: 6px;
}

.popup-content::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 5px;
}


/* New-Life */

.custom-list {
  list-style-type: none;
  padding: 0;
}

.custom-list li {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  opacity: 0;  /* Initially hide the items */
  transform: translateX(-30px);  /* Start position for the sliding animation */
  animation: slideIn 0.5s ease-out forwards;  /* Apply slide-in animation */
  animation-delay: var(--delay);  /* Delay for each item */
}

.circle-arrow {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #254706;
  border-radius: 50%;
  margin-right: 10px;
  position: relative;
  opacity: 0;  /* Initially hide the arrow */
  animation: bounce 0.5s ease-in-out forwards;  /* Add bouncing effect to the arrow */
  animation-delay: var(--delay);  /* Same delay as list item */
}

.circle-arrow::before {
  content: "→";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 12px;
}

@keyframes slideIn {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes bounce {
  0% {
    opacity: 0;
    transform: translateY(-10px);  /* Start from above */
  }
  50% {
    opacity: 1;
    transform: translateY(0);  /* Bounce to original position */
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}


/* Basic Flex Layout */
.flex {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  margin-top: 20px;
  margin-bottom: 20px;
}

.list-container {
  flex: 1;
  min-width: 250px; /* Ensures the list does not shrink too much */
}

.custom-list {
  list-style: none;
  padding: 0;
}

.custom-list li {
  font-size: 16px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

.circle-arrow {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #254706; /* Arrow circle color */
  border-radius: 50%;
  margin-right: 10px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  /* Stack the lists vertically on smaller screens */
  .flex {
      flex-direction: column;
      align-items: center;
  }

  .list-container {
      width: 100%; /* Ensures each list container takes full width */
      margin-bottom: 20px; /* Adds space between the lists */
  }

  .custom-list li {
      font-size: 14px; /* Slightly smaller font for mobile */
  }
}

/* Additional mobile adjustments (optional) */
@media (max-width: 480px) {
  .custom-list li {
      font-size: 12px; /* Adjust further for very small screens */
  }
}



/* inner pages banner */

/* Default height for larger screens (Desktop/Tablets) */
#page_caption {
  height: 400px;  /* Adjust this height to your desired size for desktop/tablet */
  background-size: cover;  /* Ensure background image covers */
  background-position: center;  /* Keep the background centered */
}

/* Increase height on mobile screens */
@media only screen and (max-width: 767px) {
  #page_caption {
      height: 600px;
      margin-top: 75px;  /* Adjust this height for mobile screens */
  }
}


/* AI-GUT CLEANSE */

/* Base styles */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px;
  box-sizing: border-box;
}

.row {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.column {
  flex: 1;
  min-width: 0; /* Prevent overflow */
  padding: 10px;
  box-sizing: border-box;
}

.content-wrapper {
  padding: 20px 20px;
  height: 100%;
  display: flex;
  align-items: center;
}

.or-divider {
  display: flex;
  align-items: center;
  justify-content: center;
}

.or-divider span {
  background: #fff;
  color: #000;
  border: 2px solid #000;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  position: relative;
  z-index: 1;
}

/* Desktop styles */
@media (min-width: 768px) {
  .row {
    flex-wrap: nowrap;
  }
  
  .desktop-only {
    display: flex;
  }
  
  .mobile-only {
    display: none;
  }
  
  .or-divider {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    height: 100%;
  }
  
  .left-column {
    padding-right: 50px;
  }
  
  .right-column {
    padding-left: 50px;
  }
}

/* Mobile styles */
@media (max-width: 767px) {
  .column {
    flex: 0 0 100%;
  }
  
  .desktop-only {
    display: none;
  }
  
  .mobile-only {
    display: flex;
    width: 100%;
    padding: 20px 0;
  }
  
  .content-wrapper {
    padding: 40px 20px;
  }
}

 /* Base styles */
 .image-text-pair {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 60px;
  width: 100%;
}

.image-half, .text-half {
  flex: 1;
  min-width: 300px;
}

.image-half img {
  width: 100%;
  height: auto;
  display: block;
}

.text-content {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 40px;
  box-sizing: border-box;
}

/* Desktop specific styles */
@media (min-width: 768px) {
  .image-text-pair {
    flex-wrap: nowrap;
  }
  
  .reverse {
    flex-direction: row-reverse;
  }
  
  .text-content {
    padding: 0 40px;
  }
}

/* Mobile specific styles */
@media (max-width: 767px) {
  .image-text-pair {
    margin-bottom: 40px;
  }
  
  .text-content {
    padding: 30px 20px;
    text-align: center;
  }
  
  .image-half, .text-half {
    flex: 0 0 100%;
  }
  
  .reverse {
    flex-direction: column;
  }
}

.mb-0{
  margin-bottom: 0px;
}
.pb-0{
  padding-bottom: 0px;
}


/* Inner pages icons and text */

#page_caption {
  background-size: cover;
  background-position: center;
  position: relative;
  text-align: center;
  padding: 40px 20px;
  min-height: 300px;
}

#page_caption_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  z-index: 1;
}

.page_title_wrapper,
.standard_wrapper,
.page_title_inner,
.page_title_content {
  position: relative;
  z-index: 2;
  margin-top: 30px;
}

.page_title_content img {
  max-width: 100%;
  height: auto;
  width: 140px;
}

.page_title_content h1 {
  font-weight: 500;
  font-size: 28px;
  color: white;
  margin-top: 15px;
}

@media (max-width: 600px) {
  #page_caption {
    min-height: 350px;
    padding: 60px 10px;
  }

  .page_title_content img {
    width: 100px;
  }

  .page_title_content h1 {
    font-size: 24px;
  }
}

/* Desktop-specific size */
@media (min-width: 992px) {
  .page_title_content img {
    width: 160px;
  }

  .page_title_content h1 {
    font-size: 36px;
  }
}
.dot {
  width: 8px;
  height: 8px;
  margin: 0 4px;
  border-radius: 50%;
  background-color: #bbb;
  display: inline-block;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.dot:hover {
  background-color: #f44336;
}
.dot.active {
  background-color: #f44336;
}

@keyframes slide{
  from{
    transform:translateX(0) ;
    
  }
  to{
    transform:translateX(-100%) ;
  
  }
}.logos {
  overflow: hidden;
  padding: 50px 0;
  background: transparent;
  white-space: nowrap;
  position: relative;
  width: 100%;
}

.logos:before,
.logos:after {
  content: "";
  position: absolute;
  top: 0;
  width: 150px;
  height: 100%;
  z-index: 2;
}

.logos:before {
  left: 0;
  background: linear-gradient(to left, rgba(255,255,255,0), transparent);
}

.logos:after {
  right: 0;
  background: linear-gradient(to right, rgba(255,255,255,0), transparent);
}

.logos:hover .logos-slide {
  animation-play-state: paused;
}

.logos-slide {
  display: inline-block;
  animation: 40s slide infinite linear;
}

.logos-slide img {
  height: 110px;         /* Slightly larger logos */
  margin: 0 30px;       /* Adjusted spacing to fit 5 logos */
  vertical-align: middle;
}

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

.custom-tabs {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 12px  #a58282;;
  overflow: hidden;
}

.custom-tab-nav {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: rgb(56, 6, 99);
}

.custom-tab-link {
  flex: 1;
  text-align: center;
  padding: 15px 0;
  color: white;
  cursor: pointer;
  font-weight: 100;
  transition: background 0.3s ease;
}

.custom-tab-link:hover {
  background-color: #0062a3;
}

.custom-tab-link.active {
  background-color: #005fa3;
  border-bottom: 4px solid #ffcc00;
}

.custom-tab-content {
  display: none;
  padding: 40px 30px;
  background: #ffffff;
}

.custom-tab-content.active {
  display: block;
}

.custom-container {
  max-width: 1140px;
  margin: auto;
}

.custom-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.custom-col {
  width: 100%;
  max-width: 50%;
  box-sizing: border-box;
  padding: 15px;
}

.custom-col img {
  width: 100%;
  max-width: 500px;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.custom-col p {
  color: #333;
  font-size: 16px;
  line-height: 1.7;
  /* margin-bottom: 1.2em; */
}

@media (max-width: 768px) {
  .custom-col {
    max-width: 100%;
  }

  .custom-tab-nav {
    flex-direction: column;
  }

  .custom-tab-link {
    padding: 10px;
  }
}
.main-section-heading {
  font-size: 2em;
  font-weight: bold;
  color: #333;
  margin-bottom: 30px;
}.pancha-section {
  width: 100%;
  min-height: 290px; /* Adjust depending on image height */
  background-image: url('../images/AD/long.jpg'); /* Ensure correct path */
  background-size: contain; /* Shows full image */
  background-repeat: no-repeat;
  background-position: center;
  background-color: #fff; /* Optional fallback if image doesn’t fill space */
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 60px 20px;
  box-sizing: border-box;
}
.pancha-section2 {
  width: 100%;
  min-height: 290px; /* Adjust depending on image height */
  background-color: #0b2933;  /* Ensure correct path */
  background-size: contain; /* Shows full image */
  background-repeat: no-repeat;
  background-position: center;
  background-color: #0b2933; /* Optional fallback if image doesn’t fill space */
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 60px 20px;
  box-sizing: border-box;
}

.pancha-box {
  display: flex;
  align-items: center;
  background-color: rgba(230, 244, 252, 0.95); /* Transparent so image shows */
  border-radius: 12px;
  padding: 25px 30px;
  max-width: 1000px;
  width: 100%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  font-family: 'Arial', sans-serif;
}

.icon-wrapper {
  font-size: 30px;
  color: #1e90ff;
  margin-right: 25px;
  flex-shrink: 0;
}

.text-wrapper {
  font-size: 18px;
  color: #333;
  line-height: 1.6;
}

@media screen and (max-width: 768px) {
  .pancha-box {
    flex-direction: column;
    text-align: center;
  }

  .icon-wrapper {
    margin: 0 0 15px 0;
    font-size: 40px;
  }

  .text-wrapper {
    font-size: 16px;
  }
}
.custom-bg {
  background-color: rgb(60, 15, 112) !important;
}
.ph-section {
  padding: 10px 20px;
}
.carousel-inner img {
  max-height: 300px;
  object-fit: contain;
}
.carousel-indicators {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
}
.carousel-indicators button {
  background-color: #000;
}
.fade-in {
  animation: fadeIn 1.5s ease-in-out forwards;
  opacity: 0;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}
.acidosis-tab {
  position: relative;
  flex: 1;
  display: flex;
  justify-content: center;
}

.acidosis-dot {
  width: 20px;
  height: 20px;
  background-color: #4dd0e1;
  border-radius: 50%;
  border: 4px solid white;
  cursor: pointer;
  transition: transform 0.3s ease;
  z-index: 1;
}

.acidosis-tab.active .acidosis-dot {
  transform: scale(1.4);
  background-color: #00e676;
}
@media (max-width: 768px) {
  .mobile-section h2 {
    font-size: 15px !important;
    line-height: 1.5 !important;
    padding: 0 10px;
  }
}


@media (max-width: 768px) {
  .text-extra {
    font-size: 16px; /* or any smaller size you prefer */
    line-height: 1.5;
  }
}


.card-item {
  padding: 10px;
}
.image_boxed_wrapper {
  height: 100%;
}
.mobile1{
  margin:auto; 
   max-width: 1000px;
     padding: 0 30px; 
      width: 100%;
}

@media (max-width: 768px) {
  .mobile1 {
    padding: 0px;
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  .mobile1 {
    padding: 0 10px;
  }
}
.mobile1-text{
  font-size: 27px;
  line-height: normal;
  font-weight: bold;
  color: #fff !important;
  font-family: Montserrat;
  letter-spacing: 1.5px !important;
}
/* @media (max-width: 768px) {
  .mobile1-text{
    font-size: 16px;
    line-height: normal;
    font-weight: bold;
    color: #fff !important;
    font-family: Montserrat;
    letter-spacing: 1.5px !important;
  }
}

@media (max-width: 480px) {
  .mobile1-text{
    font-size: 16px !;
    line-height: normal;
    font-weight: bold;
    color: #fff !important;
    font-family: Montserrat;
    letter-spacing: 1.5px !important;
  }
} */

.text1{

  font-size: 20px !important;
  font-weight: 500 !important; 
  font-family: Montserrat !important;
  letter-spacing: 1.5px !important;
  text-transform: none !important;
  line-height: 30px !important;
}
@media (max-width: 768px) {
  .text1{

   
  font-size: 17px !important;
  font-weight: 500 !important; 
  font-family: Montserrat !important;
  letter-spacing: 1px !important;
  text-transform: none !important;
  line-height: 30px !important;
  text-align: justify;
  hyphens: auto; 

  }

}
@media (max-width: 768px) {
  .text2{

   
  font-size: 17px !important;
  font-weight: 500 !important; 
  font-family: Montserrat !important;
padding: 0px 20px;
  text-align: justify;
  hyphens: auto; 

  }

}
@media (max-width: 768px) {
  .custom-tab-content {
    display: none;
    padding: 20px 10px;
    background: #ffffff;
    text-align: justify;
    hyphens: auto;
  }

}
@media (max-width: 768px) {
  .diabetes-section {
    padding: 20px !important;
    text-align: center !important;
    height: auto !important;
  }

  .diabetes-section h1 {
    font-size: 24px !important;
    text-align: center !important;
  }

  .diabetes-section h2 {
    font-size: 16px !important;
    text-align: center !important;
  }
}


/* Ph new changes */

  .ph-section {
    padding-left: 15px;
    padding-right: 15px;
  }

  @media (min-width: 768px) {
    .ph-section {
      padding-left: 60px;
      padding-right: 60px;
    }
  }

  .Bold-Font{
    font-size: 25px;
    font-weight: bold;
  }