/*** Spinner Start ***/
/*** Spinner ***/
#spinner {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-out, visibility 0s linear 0.5s;
  z-index: 99999;
}

#spinner.show {
  transition: opacity 0.5s ease-out, visibility 0s linear 0s;
  visibility: visible;
  opacity: 1;
}
/*** Spinner End ***/

.back-to-top {
  position: fixed;
  right: 30px;
  bottom: 30px;
  transition: 0.5s;
  z-index: 99;
}

/*** Button Start ***/
.btn {
  font-weight: 600;
  transition: 0.5s;
}

.btn-square {
  width: 32px;
  height: 32px;
}

.btn-sm-square {
  width: 34px;
  height: 34px;
}

.btn-md-square {
  width: 44px;
  height: 44px;
}

.btn-lg-square {
  width: 56px;
  height: 56px;
}

.btn-xl-square {
  width: 66px;
  height: 66px;
}

.btn-square,
.btn-sm-square,
.btn-md-square,
.btn-lg-square,
.btn-xl-square {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: normal;
}

.btn.btn-primary {
  border: none;
}

.btn.btn-primary:hover {
  background: var(--bs-secondary);
}

.btn.btn-secondary {
  color: var(--bs-white);
  border: none;
  background-color: #2c563f;
}

.marquee-container {
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.marquee {
  display: inline-block;
  padding-left: 100%;
  animation: marquee 15s linear infinite;
  font-weight: 500;
  color: #fff;
  font-size: 0.95rem;
}

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

.btn.btn-secondary:hover {
  background: var(--bs-primary);
}
/*** Topbar Start ***/
.topbar {
  padding: 2px 10px 2px 20px;
  background: var(--bs-primary);
}
/*** Topbar End ***/

.banner-title {
  font-size: 1.6rem;
  font-weight: 800;
  color: #2c563f;
  text-transform: uppercase;
  letter-spacing: 0.2rem;
  border-bottom: 4px solid #2c563f;
  width: fit-content;
  padding-bottom: 0.2rem;
}

/*** Navbar ***/
.sticky-top {
  transition: 1s;
}

.navbar .navbar-nav .nav-item.nav-link,
.navbar .navbar-nav .nav-link {
  color: var(--bs-dark);
}

.navbar .navbar-nav .nav-link {
  position: relative;
  padding: 10px;
  font-weight: 400;
  font-family: "Playfair Display", serif;
  font-size: 17px;
  transition: 0.5s;
  z-index: 99;
}

.navbar .navbar-nav .nav-item {
  margin: 0 5px;
}

.navbar .navbar-nav .nav-item::before,
.navbar .navbar-nav .nav-item::after {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  border: 2px solid #2c5640;
  opacity: 0;
  transition: 0.5s;
  z-index: 2 !important;
}

.navbar .navbar-nav .nav-item::before {
  top: 0;
  left: 0;
  border-bottom: 0;
  border-right: 0;
}
.navbar .navbar-nav .nav-item::after {
  bottom: 0;
  right: 0;
  border-top: 0;
  border-left: 0;
}

.navbar .navbar-nav .nav-item:hover::after,
.navbar .navbar-nav .nav-item:hover::before,
.navbar .navbar-nav .nav-item.active::after,
.navbar .navbar-nav .nav-item.active::before {
  width: 50%;
  height: 50%;
  opacity: 1;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link.active,
.sticky-top .navbar .navbar-nav .nav-link:hover,
.sticky-top .navbar .navbar-nav .nav-link.active {
  color: #2c5640;
}

.navbar .dropdown-toggle::after {
  border: none;
  content: "\f107" !important;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  vertical-align: middle;
}

.navbar .navbar-toggler {
  padding: 8px 15px;
  color: #fff;
  background-color: #2c5640;
}

.nav-bar .navbar-toggler {
  color: #fff;
  box-shadow: none !important;
}

.navbar .nav-item:hover .dropdown-menu {
  transform: rotateX(0deg);
  visibility: visible;
  background: var(--bs-light);
  transition: 0.5s;
  opacity: 1;
}

.navbar .nav-item .dropdown-menu {
  background: var(--bs-light);
  transition: 0.5s;
}

.navbar .nav-item .dropdown-menu .dropdown-item {
  transition: 0.5s;
}

.dropdown .dropdown-menu .dropdown-item:hover,
.dropdown .dropdown-menu .dropdown-item.active {
  background: var(--bs-secondary);
  color: #2c563f;
}
.navbar .nav-link.active {
  color: #2c563f !important;
  font-weight: 600;
}

.dropdown-item.active {
  background-color: #2c563f;
  color: #fff;
}

@media (min-width: 992px) {
  .navbar .nav-item .dropdown-menu {
    display: block;
    visibility: hidden;
    top: 100%;
    margin-top: 15% !important;
    transform: rotateX(-75deg);
    transform-origin: 0 0;
    border: 0;
    transition: 0.5s;
    opacity: 0;
    z-index: 9;
  }
}

@media (max-width: 991px) {
  .navbar .nav-item .dropdown-menu {
    position: relative;
    margin-top: 0;
    transition: 0.5s;
  }

  .navbar .navbar-nav .nav-item::after,
  .navbar .navbar-nav .nav-item::before {
    display: none;
  }

  .navbar .navbar-nav .nav-item:hover::after,
  .navbar .navbar-nav .nav-item:hover::before,
  .navbar .navbar-nav .nav-item.active::after,
  .navbar .navbar-nav .nav-item.active::before {
    display: none;
  }

  .navbar .navbar-nav .nav-link {
    padding: 12px 0;
  }

  .navbar .navbar-nav .nav-item {
    margin: 0;
  }

  .navbar .navbar-nav .nav-item.nav-link {
    padding: 12px 0;
  }
}
/*** Navbar End ***/

/* Page Banner image responsive */
.page-banner {
  width: 100%;
  overflow: hidden;
}

.page-banner img {
  width: 100%;
  height: 350px;
  object-fit: cover;
  display: block;
}

/* Responsive height adjustments */
@media (max-width: 1024px) {
  .page-banner img {
    height: 300px;
  }
}
@media (max-width: 768px) {
  .page-banner img {
    height: 250px;
  }
}
@media (max-width: 480px) {
  .page-banner img {
    height: 200px;
  }
}

/* Breadcrumb Styling */
.breadcrumb-wrapper {
  width: 100%;
  text-align: center;
  margin-top: -25px;
}

.breadcrumb-custom {
  list-style: none;
  display: inline-flex;
  gap: 20px;
  padding: 10px 22px;
  background: #ffffff;
  border-radius: 6px;
  font-size: 18px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.breadcrumb-custom li {
  position: relative;
  font-weight: 500;
  color: #0c0b0b;
}

.breadcrumb-custom li:not(:last-child)::after {
  content: ">";
  margin-left: 10px;
  color: #110d0d;
}

.breadcrumb-custom li a {
  text-decoration: none;
  color: #446752;
  transition: 0.3s;
}
.breadcrumb-custom li a:hover {
  color: #000;
}
.breadcrumb-custom li.active {
  color: #000;
  font-weight: 600;
}

/* Responsive breadcrumb */
@media (max-width: 768px) {
  .breadcrumb-custom {
    font-size: 16px;
    padding: 8px 18px;
    gap: 14px;
  }
}
@media (max-width: 480px) {
  .breadcrumb-custom {
    font-size: 14px;
    padding: 6px 14px;
    gap: 10px;
  }
}

/*** Single Page Hero Header End ***/

/* doctor start */
.doctor-section {
  padding: 40px 15px;
  background: #f7fdfb;
}

/* MAIN CARD */
.appointment-3d-over {
  max-width: 1300px;
  margin: auto;
  background: linear-gradient(135deg, #a9dfb4, #8deece);
  padding: 50px 50px 50px 280px; /* left space for image */
  border-radius: 20px;
  display: flex;
  align-items: center;
  position: relative;
  overflow: visible;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

/* CONTENT */
.appoint-left {
     flex: 1;
    position: relative;
    z-index: 2;
    margin-left: 107px;
}

.appoint-left h2 {
  font-size: 30px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.appoint-left p {
  color: #090808;
  line-height: 1.6;
  max-width: 850px;
}

/* BUTTON */
.appoint-btn {
  margin-top: 20px;
  padding: 12px 30px;
  border-radius: 30px;
  border: 2px solid #2c5740;
  color: #2c5740;
  background: #ffffff70;
  backdrop-filter: blur(6px);
  cursor: pointer;
  font-weight: 600;
  transition: all 0.3s ease;
}

.appoint-btn:hover {
  background: #2c5740;
  color: #fff;
}

/* 3D DOCTOR IMAGE */
.doctor-popout {
 width: 375px;
    /* height: 400px; */
    position: absolute;
    left: 1px;
    bottom: -39px;
    border-radius: 21px;
    z-index: 5;
    transform: translateY(-40px);
    transition: transform 0.5s ease;
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .appointment-3d-over {
    padding-left: 240px;
  }

  .doctor-popout {
    width: 260px;
  }
}

@media (max-width: 768px) {
  .appointment-3d-over {
    flex-direction: column;
    padding: 30px;
    text-align: center;
  }

  .doctor-popout {
    position: relative;
    left: 0;
    bottom: 0;
    transform: none;
    margin-bottom: 20px;
    width: 220px;
  }

  .appointment-3d-over:hover .doctor-popout {
    transform: none;
  }

  .appoint-left h2 {
    justify-content: center;
  }
}

@media (max-width: 480px) {
  .appoint-left h2 {
    font-size: 24px;
  }

  .appoint-btn {
    padding: 10px 24px;
  }
}

/* RESPONSIVE */
@media (max-width: 768px) {

  .navbar-brand h2 {
    display: none;
  }
}

/*** About Start ***/
.about-home {
  padding: 6rem 0;
  position: relative;
  overflow: hidden;
}

.about-text {
  color: #080606;
  line-height: 1.7;
}

/* Feature List */
.about-features {
  list-style: none;
  padding: 0;
}

.about-features li {
  color: #080606;
  margin-bottom: 0.8rem;
  display: flex;
  align-items: center;
  transition: transform 0.3s ease, color 0.3s ease;
}

.about-features li i {
  color: #2c5740;
  margin-right: 10px;
}

/* Hover effect for features */
.about-features li:hover {
  transform: translateX(10px);
  color: #2c5740;
}

/* Button Styling */
.btn-primary {
  background-color: #2c5740;
  border: none;
  border-radius: 50px;
  font-weight: 600;
  transition: all 0.3s ease;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.btn-primary:hover {
  background-color: #218838;
  transform: translateY(-3px) scale(1.05);
}

/* IMAGE STYLING */
.about-image img {
  max-width: 100%;
  border-radius: 20px;
  box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
  transition: transform 0.5s ease, box-shadow 0.5s ease, filter 0.5s ease;
  border: 2px solid #218838;
}

.about-image img:hover {
  box-shadow: 0 15px 50px rgba(0, 0, 0, 0.15);
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .about-title {
    font-size: 1.7rem;
    text-align: center;
  }
  .about-text,
  .about-features {
    text-align: center;
  }
  .about-image {
    margin-top: 2rem;
    text-align: center;
  }
}

/* ANIMATIONS */
@keyframes fadeInLeftCustom {
  0% {
    opacity: 0;
    transform: translateX(-50px) rotate(-5deg);
  }
  100% {
    opacity: 1;
    transform: translateX(0) rotate(0);
  }
}

@keyframes fadeInRightCustom {
  0% {
    opacity: 0;
    transform: translateX(50px) rotate(5deg);
  }
  100% {
    opacity: 1;
    transform: translateX(0) rotate(0);
  }
}

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

.about-home .wow.fadeInLeft {
  animation-name: fadeInLeftCustom !important;
  animation-duration: 1s;
  animation-fill-mode: both;
}

.about-home .wow.fadeInRight {
  animation-name: fadeInRightCustom !important;
  animation-duration: 1s;
  animation-fill-mode: both;
}

.about-home .wow.fadeInUp {
  animation-name: fadeInUpCustom !important;
  animation-duration: 1s;
  animation-fill-mode: both;
}

/* Decorative floating shapes */
.about-home::before,
.about-home::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(40, 167, 69, 0.1);
  z-index: 0;
}

.about-home::before {
  width: 200px;
  height: 200px;
  top: -50px;
  left: -50px;
  animation: floatShape 6s ease-in-out infinite alternate;
}

.about-home::after {
  width: 200px;
  height: 200px;
  bottom: -50px;
  right: -50px;
  animation: floatShape 8s ease-in-out infinite alternate-reverse;
}

@keyframes floatShape {
  0% {
    transform: translateY(0) translateX(0);
  }
  50% {
    transform: translateY(20px) translateX(10px);
  }
  100% {
    transform: translateY(0) translateX(0);
  }
}

/*** About End ***/

/*** Features Start ***/
.feature .feature-item {
  position: relative;
  transition: 0.5s;
}
.feature .feature-item:hover {
  background: var(--bs-white);
  border: 1px solid transparent;
  box-shadow: 0 0 45px rgba(0, 0, 0, 0.1);
}

.feature .feature-item:hover a {
  transition: 0.5s;
}

.feature .feature-item:hover a:hover {
  color: var(--bs-secondary);
}

.feature .feature-item .feature-img img {
  border: transparent;
  transition: 0.5s;
}

.feature .feature-item:hover .feature-img img {
  border: 1px solid var(--bs-secondary);
}
/*** Features End ***/

/*** Services Start ***/
.service .service-item {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
  transition: 0.5s;
  z-index: 1;
}

.service .service-item .service-img img {
  transition: 0.5s;
}

.service .service-item:hover .service-img img {
  transform: scale(1.2);
}

.service .service-item::after {
  content: "";
  width: 100%;
  height: 0;
  position: absolute;
  top: 0;
  left: 0;
  transition: 0.5s;
  z-index: 2;
}

.service .service-item:hover:after {
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
}

.service .service-item .service-content {
  position: absolute;
  width: 100%;
  height: auto;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  transition: 0.5s;
  opacity: 0;
  z-index: 3;
}

.service .service-item:hover .service-content {
  opacity: 1;
}

.service .service-item:hover .service-content a.fs-4 {
  color: var(--bs-white);
  transition: 0.5s;
}

.service .service-item:hover .service-content a.fs-4:hover {
  color: var(--bs-secondary);
}

.service .service-item .service-title {
  position: absolute;
  width: 100%;
  height: 80px;
  bottom: 0;
  right: 0;
  background: var(--bs-light);
  display: flex;
  transition: 0.5s;
  z-index: 3;
}

.service .service-item:hover .service-title {
  margin-right: -100%;
}
/*** Services End ***/

/* counter start */
.glass-counter-section {
  background: url("../img/counter.jpg") no-repeat center/cover;
  padding: 73px 20px;
  position: relative;
  overflow: hidden;
}

.counter-container {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(5, 1fr); /* Force 5 boxes in one row */
  gap: 25px;
  max-width: 1400px;
  margin: auto;
  padding: 20px 0;
}

.counter-box {
  padding: 35px 25px;
  background: white;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(12px);
  text-align: center;
  color: #0f0a0a;
  transition: 0.3s ease;
}

.counter-box:hover {
  transform: translateY(-8px);
  background: rgba(255, 255, 255, 0.25);
}
.counter-icon ion-icon {
  color: #fff;
  font-size: 34px;
}

.counter-icon {
  width: 60px;
  height: 60px;
  margin: 0 auto 12px;
  border-radius: 50%;
  background: #2c5740;
  backdrop-filter: blur(5px);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  animation: iconPulse 3s infinite ease-in-out;
}

@keyframes iconPulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}

.counter-number {
  font-size: 42px;
  font-weight: 700;
}

.counter-title {
  font-size: 18px;
  letter-spacing: 0.5px;
  margin-top: 5px;
}
/* counter end */

/* faq start */
.faq-section {
  padding: 6rem 0;
}

.faq-image img {
  max-width: 100%;
  border-radius: 20px;
  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
    rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
  transition: transform 0.5s ease, box-shadow 0.5s ease;
}

/* FAQ text and items */
.faq-title {
  font-size: 2rem;
  font-weight: 700;
  color: #222;
  margin-bottom: 0.5rem;
}

.faq-subtitle {
  font-size: 1rem;
  color: #0d0c0c;
  margin-bottom: 2rem;
}

.faq-wrapper {
  max-width: 100%;
}

.faq-item {
  background: #fff;
  border-radius: 15px;
  margin-bottom: 1.5rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  transition: transform 0.3s ease;
}

.faq-item:hover {
  transform: translateY(-5px);
}

.faq-question {
  padding: 1.5rem 2rem;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(90deg, #e6f5eb, #fff);
  transition: background 0.3s ease;
}

.faq-question:hover {
  background: #28a7451a;
}

.faq-icon {
  font-size: 1.5rem;
  color: #28a745;
  transition: transform 0.3s ease;
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  padding: 0 2rem;
  font-size: 1rem;
  color: #555;
  line-height: 1.7;
  transition: all 0.5s ease;
  opacity: 0;
}

/* Active FAQ */
.faq-item.active .faq-answer {
  max-height: 500px;
  padding: 1rem 2rem 2rem;
  opacity: 1;
}

.faq-item.active .faq-icon {
  transform: rotate(45deg);
}

/* Responsive */
@media (max-width: 991px) {
  .faq-section .row {
    flex-direction: column-reverse;
  }
  .faq-title {
    font-size: 1.7rem;
    text-align: center;
  }
  .faq-subtitle {
    text-align: center;
  }
}

/* faq end */

/*** why choose us Start ***/
.kh-why-choose {
  padding: 60px 0;
  text-align: center;
  font-family: "Poppins", sans-serif;
}

/* LAYOUT */
.kh-choose-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 40px;
  gap: 30px;
}

/* LEFT + RIGHT PANEL */
.kh-left-panel,
.kh-right-panel {
  width: 30%;
  padding: 40px 20px;
  border-radius: 0 100px 100px 0;
  color: #000;
  background: linear-gradient(
    to bottom,
    rgba(0, 170, 150, 0.4),
    rgba(0, 180, 160, 0.15)
  );
}

.kh-right-panel {
  border-radius: 100px 0 0 100px;
  background: linear-gradient(
    to bottom,
    rgba(0, 150, 220, 0.4),
    rgba(0, 150, 240, 0.15)
  );
}

.kh-left-panel .kh-item,
.kh-right-panel .kh-item {
  margin-bottom: 40px;
}

.kh-icon-circle {
  font-size: 32px;
  width: 60px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  margin-bottom: 15px;
}

.kh-green-icon {
  background-color: #2c5740;
  color: #fff;
}

.kh-item h4 {
  font-weight: 600;
  margin-bottom: 5px;
}

.kh-item p {
  font-size: 14px;
  opacity: 0.8;
}

/* CENTER CIRCLE */
.kh-center-circle {
  width: 450px;
  height: 450px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset,
    rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px;
}

.kh-center-circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.kh-center-circle img:hover {
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px,
    rgba(0, 0, 0, 0.22) 0px 10px 10px;
}
/* ANIMATIONS */
.kh-fade-left {
  opacity: 0;
  animation: khFadeLeft 1s forwards;
}
.kh-fade-right {
  opacity: 0;
  animation: khFadeRight 1s forwards;
}
.kh-zoom-in {
  opacity: 0;
  animation: khZoomIn 1s forwards;
}

@keyframes khFadeLeft {
  from {
    transform: translateX(-60px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes khFadeRight {
  from {
    transform: translateX(60px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes khZoomIn {
  from {
    transform: scale(0.6);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .kh-choose-wrapper {
    flex-direction: column;
  }
  .kh-left-panel,
  .kh-right-panel {
    width: 100%;
    border-radius: 40px;
  }
  .kh-center-circle {
    margin: 20px 0;
  }
}
/*** why choos us End ***/

/*** Contact Start ***/
.contact-section {
  padding: 60px 0;
}

/* LEFT CONTACT FORM */
.contact-form {
  background: white;
  padding: 25px;
  border-radius: 10px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset,
    rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}

.contact-form input,
.contact-form textarea,
.contact-form select {
  border: 1.5px solid #cccccc;
  transition: 0.3s;
}

.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus {
  border-color: #2c563f;
  box-shadow: 0 0 8px rgba(44, 86, 63, 0.4);
}

/* CONTACT IMG RESPONSIVE */
.contact-img {
  width: 100%;
  max-width: 629px;
  display: block;
  margin: 0 auto 15px;
  box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px,
    rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px,
    rgba(0, 0, 0, 0.09) 0px 32px 16px;
  border-radius: 10px;
}

/* SUBMIT BUTTON */
.submit-btn {
  background: #2c563f;
  color: white;
  font-weight: 600;
  border: none;
  padding: 10px 0;
  transition: 0.3s;
}

.submit-btn:hover {
  background: #224632;
  transform: translateY(-2px);
}

.info-box {
  margin-top: 56px;
  background: #cbeedb;
  color: rgb(9, 8, 8);
  padding: 30px;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 2px 8px;
}

.info-box h4 {
  font-weight: 700;
}

.tick-list {
  list-style: none;
  padding: 0;
  margin-top: 12px;
}

.tick-list li {
  margin-bottom: 6px;
}

.tick-list li::before {
  content: "✚ ";
  font-weight: bold;
}

/* MAP */
.map-container {
  margin-top: 8px;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: rgba(9, 30, 66, 0.25) 0px 1px 1px,
    rgba(9, 30, 66, 0.13) 0px 0px 1px 1px;
}

/* ---------------------------------------------------------
ANIMATION ON SCROLL
---------------------------------------------------------- */
[data-animate] {
  opacity: 0;
  transform: translateY(35px);
  transition: all 0.8s ease;
}

[data-animate].show {
  opacity: 1;
  transform: translateY(0px);
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .info-box {
    text-align: center;
  }

  .top-banner h1 {
    font-size: 2rem;
  }

  .contact-img {
    max-width: 200px;
  }
}

@media (max-width: 480px) {
  .contact-img {
    max-width: 160px;
  }
}
/*** Contact End ***/

/* what we offer */
.offer-section {
  width: 100%;
  padding: 60px 5%;
  box-sizing: border-box;
  background: url("../img/aboutbg.avif") no-repeat center/cover;
}

.offer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: flex-start;
  gap: 40px;
}

.offer-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
  background: #fff;
  padding: 20px;
  border-radius: 12px;
  text-align: center;
}

/* ROTATING CIRCLE + IMAGE */
.offer-circle-wrapper {
  position: relative;
  width: 260px;
  height: 260px;
  margin-top: 10px;
}

.offer-circle-anim {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/slider-shape.webp") no-repeat center/cover;
  animation: rotateOffer 6s linear infinite;
  z-index: 2;
}

@keyframes rotateOffer {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.offer-img-wrapper {
  position: absolute;
  top: 15px;
  left: 15px;
  width: 230px;
  height: 230px;
  border-radius: 50%;
  overflow: hidden;
  z-index: 3;
}

.offer-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* CONTENT */
.offer-info h3 {
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #2c563f;
}

.offer-info ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
  line-height: 1.8;
  font-size: 18px;
  color: #333;
  text-align: left;
}

.offer-info ul li {
  padding-left: 28px;
  position: relative;
}

.offer-info ul li:before {
  content: "✚";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 0;
  color: #2c563f;
  font-size: 18px;
}

/* ANIMATION */
.fade-item {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUpOffer 1s ease forwards;
}

@keyframes fadeUpOffer {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .offer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .offer-grid {
    grid-template-columns: 1fr;
  }
}

/* certificate */
.cert-area {
  padding: 60px 0;
}
.cert-title {
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 30px;
}

/* -------- Images Row -------- */
.cert-row {
  display: flex;
  gap: 20px;
  flex-wrap: nowrap; /* shows all in one line desktop */
  overflow-x: auto; /* scroll if many */
  padding-bottom: 10px;
}

.cert-row::-webkit-scrollbar {
  height: 6px;
}
.cert-row::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 10px;
}

.cert-img {
  width: 300px; /* adjust image width */
  height: 380px;
  object-fit: contain;
  background: #fff;
  padding: 10px;
  border: 1px solid #ddd;
}

/* Responsive */
@media (max-width: 768px) {
  .cert-img {
    width: 240px;
    height: 300px;
  }
}
@media (max-width: 500px) {
  .cert-img {
    width: 200px;
    height: 260px;
  }
  .cert-title {
    font-size: 28px;
  }
}

/* mission and vision */
.mission-vision-section {
  max-width: 1120px;
  margin: 0 auto;
  padding: 1.5rem;
}

.mission-vision-boxes {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

@media (min-width: 768px) {
  .mission-vision-boxes {
    flex-direction: row;
  }

  .mission-vision-boxes > .mission-vision-box {
    flex: 1;
  }
}

/* Individual boxes */
.mission-vision-box {
  background-color: #ffffff;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border-radius: 0.75rem;
  padding: 1.5rem;
}

@media (max-width: 768px) {
  .mission-vision-box {
    padding: 1rem;
  }
}

/* Box header */
.box-header {
  font-weight: 600;
  font-size: 1.125rem;
  padding: 0.5rem 0;
  margin-bottom: 1rem;
  border-radius: 0.375rem;
  color: #ffffff;
  text-align: center;
}

.vision-box .box-header {
  background-color: #14b8a6; /* teal */
}

.mission-box .box-header {
  background-color: #fb923c; /* orange */
}

/* Icon circle */
.iconss-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  color: #ffffff;
  font-size: 1.25rem;
  margin: 0 auto 1rem;
}

.teal-iconss {
  background-color: #14b8a6;
}

.orange-iconss {
  background-color: #fb923c;
}

@media (max-width: 768px) {
  .iconss-circle {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1rem;
  }
}

/* Box text */
.box-text {
  color: #050505;
}

/* about us */
.info-section {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 90vh;
  overflow: hidden;
  background: #f4f5ef;
  position: relative;
  padding: 60px 0;
}

/* LEFT IMAGE BLOCK */
.photo-box {
  flex: 1;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.photo-box img {
  width: 100%;
  height: 90vh;
  object-fit: cover;
  border-radius: 12px;
  animation: fadeIn 1.4s ease forwards;
}

.text-panel {
  flex: 1;
  background: #5d7135;
  padding: 37px 23px;
  color: white;
  border-radius: 12px;
  animation: slideRight 1.4s ease forwards;
  position: relative;
  right: 45px;
  z-index: 2;
}

.main-heading {
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #fff;
}

.info-text {
  font-size: 17px;
  line-height: 1.8;
  opacity: 0.95;
}

/* Animations */
@keyframes slideRight {
  from {
    transform: translateX(100px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .info-section {
    flex-direction: column;
    padding: 40px 20px;
  }
  .photo-box img {
    width: 100%;
    height: 50vh;
  }
  .text-panel {
    position: relative;
    right: 0;
    margin-top: -40px; /* keeps partial overlap on mobile */
    width: 90%;
    text-align: center;
    padding: 40px 30px;
  }
  .main-heading {
    font-size: 32px;
  }
}

/* about us content */
.vmv-image-exact {
  padding: 80px 20px;
  max-width: 1300px;
  margin: auto;
}

.vmv-row {
  display: flex;
  align-items: center;
  margin-bottom: 45px;
  gap: 50px;
}

.vmv-left-box {
  width: 240px;
  padding: 28px 20px;
  text-align: center;
  color: #fff;
  font-weight: bold;
  position: relative;
  border-radius: 3px;
  box-shadow: 0 14px 22px rgba(0, 0, 0, 0.25);
}

.vmv-left-box::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: #cfcfcf;
  top: -14px;
  left: -18px;
  z-index: -1;
  border-radius: 3px;
}

.vision {
  background: #2c5740;
}
.mission {
  background: #4a78c9;
}
.values {
  background: #444;
}

.vmv-left-box h3 {
  margin: 0;
  font-size: 17px;
  letter-spacing: 1px;
}

.vmv-text {
  flex: 1;
  font-size: 15px;
  color: #120e0e;
  line-height: 1.8;
  background: #fff;
  padding: 22px 25px;
  border-left: 5px solid #2c5740;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
  border-radius: 4px;
}

/* Animation */
.reveal {
  opacity: 0;
  transform: translateY(35px);
  transition: 0.9s ease;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 900px) {
  .vmv-row {
    flex-direction: column;
    text-align: center;
  }

  .vmv-left-box {
    width: 90%;
  }
}

.boxes {
  max-width: 1300px;
  margin: auto;
  padding: 40px 20px;
}
.center-circle {
  width: 220px;
  height: 220px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
  animation: fadeIn 1s ease-in-out;
}

.center-circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 58px;
  margin-top: 40px;
}

.box {
  background: #fff;
  padding: 25px;
  border-radius: 12px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
  position: relative;
  animation: slideUp 1s ease;
}

.box:hover {
  transform: translateY(-8px);
  box-shadow: rgba(50, 50, 93, 0.35) 0px 40px 80px -16px inset,
    rgba(0, 0, 0, 0.4) 0px 24px 48px -24px inset;
}

.box h3 {
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: bold;
  color: #2c5740;
}

.box p {
  margin: 0;
  line-height: 1.6;
  color: #333;
}

.iconss {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  background: #2c5740;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 26px;
  position: absolute;
  top: -35px;
  left: 20px;
  animation: popIn 0.8s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(25px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes popIn {
  from {
    opacity: 0;
    transform: scale(0.5);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* healthcare services */
.wrapper {
  max-width: 1200px;
  margin: auto;
  padding: 50px 20px;
}

.health-heading {
  color: #2c5740;
  font-weight: 800;
  margin-bottom: 15px;
  font-size: 36px;
}
.health-about-section {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
  margin-bottom: 60px;
}

.health-about-img {
  flex: 1;
  min-width: 300px;
  border-radius: 20px;
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}

.health-about-text {
  flex: 2;
  line-height: 1.7;
}

.health-service-block {
  display: flex;
  align-items: flex-start;
  background: #fff;
  border-left: 6px solid #2c5740;
  border-radius: 18px;
  padding: 30px 25px;
  margin-bottom: 35px;
  box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.health-service-block:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 35px rgba(0, 0, 0, 0.18);
}

.health-service-icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: #2c5740;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 25px;
  flex-shrink: 0;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.health-service-icon i {
  color: #fff;
  font-size: 28px;
}

.health-service-content .health-service-title {
  margin: 0 0 10px 0;
  font-size: 22px;
  font-weight: 800;
  color: #000;
}

.health-service-content .health-service-desc,
.health-service-content .health-icon-list {
  margin: 0;
  line-height: 1.6;
  color: #000 !important;
}

.health-icon-list {
  padding-left: 20px;
  list-style: none;
}

.health-icon-list li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 8px;
  color: #000;
}

.health-icon-list li::before {
  content: "✙";
  position: absolute;
  left: 0;
  top: 4px;
  width: 16px;
  height: 16px;
}

@media (max-width: 900px) {
  .health-about-section,
  .health-service-block {
    flex-direction: column;
    text-align: center;
  }

  .health-service-block {
    border-left: none;
    border-top: 6px solid #2c5740;
    padding: 25px 15px;
  }

  .health-service-icon {
    margin: 0 0 15px 0;
  }
}

/* disclaimer privacy policy terms and conditions*/
.disclaimer-section {
  background: #f6fff6;
  padding: 60px 20px;
}

.disclaimer-container {
  max-width: 900px;
  margin: auto;
  background: #ffffff;
  padding: 30px;
  border-radius: 12px;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.08);
  border-left: 6px solid #2e8b57;
}

/* Headings Responsive */
.disc-title {
  color: #2e8b57;
  font-size: 32px;
  margin-bottom: 15px;
  font-weight: 700;
}

.disc-subtitle {
  color: #2e8b57;
  margin-top: 25px;
  font-size: 22px;
  font-weight: 600;
}

.disc-heading {
  color: #2e8b57;
  font-weight: 600;
  margin-top: 18px;
  font-size: 18px;
}

.disc-text {
  font-size: 16px;
  line-height: 1.7;
  color: #333;
  margin-bottom: 10px;
}

.disc-contact {
  font-size: 16px;
  margin: 10px 0;
  line-height: 1.6;
}

/* Responsive Design */
@media (max-width: 768px) {
  .disclaimer-container {
    padding: 20px;
  }
  .disc-title {
    font-size: 26px;
  }
  .disc-subtitle {
    font-size: 20px;
  }
  .disc-heading {
    font-size: 16px;
  }
  .disc-text,
  .disc-contact {
    font-size: 15px;
  }
}

/* sitemap */
.sitemap-wrapper {
  max-width: 900px;
  margin: 40px auto;
  background: #fff;
  padding: 40px;
  border-radius: 15px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}
.sitemap-title {
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #2c5740;
  text-align: center;
}
.tree {
  list-style: none;
  padding-left: 25px;
  position: relative;
}
.tree li {
  padding: 10px 0 10px 20px;
  position: relative;
  font-size: 18px;
  background: #fff;
}
.tree li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 2px;
  height: 100%;
  background: #2c5740;
}
.tree li:after {
  content: "";
  position: absolute;
  left: 0;
  top: 22px;
  width: 20px;
  height: 2px;
  background: #2c5740;
}
.tree ul {
  margin-left: 20px;
  padding-left: 20px;
  border-left: 2px solid #2c5740;
}
.tree a {
  text-decoration: none;
  color: #2c5740;
  font-weight: 600;
}
.tree a:hover {
  text-decoration: underline;
}
/* footer */
.custom-footer {
  position: relative;
  background-color: #ede9e9;
  color: #000000;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* Top-left circle */
.footer-bg-circle {
  position: absolute;
  top: -100px;
  left: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, #2c5740, #3d09c0);
  border-radius: 50%;
  opacity: 0.2;
  z-index: 0;
  animation: floatCircle 5s ease-in-out infinite alternate;
}

/* Bottom-right circle */
.footer-bg-circle-right {
  position: absolute;
  bottom: -100px;
  right: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, #2c5740, #3d09c0);
  border-radius: 50%;
  opacity: 0.2;
  z-index: 0;
  animation: floatCircle2 6s ease-in-out infinite alternate;
}

.footer-logo {
  max-width: 150px;
}

.custom-footer h5 {
  font-size: 18px;
  font-weight: 600;
  color: #2c5741;
  margin-bottom: 18px;
  text-transform: uppercase;
  letter-spacing: 1px;
  position: relative;
  padding-bottom: 8px;
}

/* nice underline effect */
.custom-footer h5::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 35px;
  height: 3px;
  background: linear-gradient(90deg, #2c5740, #3d09c0);
  border-radius: 3px;
  transition: width 0.3s ease;
}

/* hover animation */
.custom-footer h5:hover::after {
  width: 60px;
}

.footer-brand p {
  line-height: 1.6;
}

/* ICON ANIMATION */
.footer-social a {
  display: inline-block;
  color: #f8f2f2;
  transition: color 0.3s ease, transform 0.4s ease;
}

.footer-social a:hover {
  color: #2c5740;
  transform: translateY(-4px) scale(1.2);
}

/* LINKS */
.footer-links {
  list-style: none;
  padding: 0;
}

.footer-links li {
  margin-bottom: 10px;
}

.footer-links a {
  color: #050605;
  text-decoration: none;
  transition: color 0.3s ease, padding-left 0.3s ease;
}

.footer-links a:hover {
  color: #2c5740;
  padding-left: 6px;
}

/* LEGAL */
.footer-legal a {
  color: #050605;
  margin: 0 5px;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-legal a:hover {
  color: #2c5740;
}

.footer-bottom {
  background-color: #1a1a1a;
  color: #23f685;
}

/* Fade Up Animation */
.animate-up {
  opacity: 0;
  transform: translateY(30px);
  animation: fadeUp 0.6s forwards;
  animation-delay: var(--delay, 0s);
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Floating background animation */
@keyframes floatCircle {
  0% {
    transform: translateY(0) scale(1);
  }
  100% {
    transform: translateY(30px) scale(1.1);
  }
}

@keyframes floatCircle2 {
  0% {
    transform: translateY(0) scale(1);
  }
  100% {
    transform: translateY(-30px) scale(1.15);
  }
}

/* LINK GLOW EFFECT */
.footer-links a:hover {
  text-shadow: 0 0 10px rgba(44, 167, 40, 0.7);
}

/* SOCIAL ICON PULSE */
.footer-social a:hover {
  animation: pulse 0.5s ease forwards;
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.2);
  }
}

/* Responsive */
@media (max-width: 768px) {
  .footer-bg-circle,
  .footer-bg-circle-right {
    width: 250px;
    height: 250px;
    top: -50px;
    left: -50px;
    bottom: -50px;
    right: -50px;
  }

  .footer-logo {
    max-width: 120px;
  }

  .custom-footer h5 {
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .footer-social a {
    margin-right: 6px;
    font-size: 14px;
  }

  .footer-links li {
    margin-bottom: 6px;
  }
}

/* button enquiry */
.btn-quote {
  background-color: var(--brand-red);
  color: #fff;
  font-weight: 600;
  border: none;
  border-radius: 50px;
  padding: 10px 30px;
  letter-spacing: 0.5px;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.btn-quote:hover {
  background-color: #2c563f;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.25);
}

.btn-quote:active {
  transform: translateY(0);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}

.btn-quote:focus {
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(86, 136, 107, 0.4);
}
.br-wrapper{max-width:1200px;margin:30px auto;padding:20px;}

.br-main-title{
    background:#2c563f;
    padding:25px;
    color:#fff;
    border-radius:12px;
    text-align:center;
    margin-bottom:30px;
    font-size:32px;
    font-weight:600;
}

.br-section{
    background:#fff;
    margin-bottom:25px;
    padding:25px 30px;
    border-left:6px solid #2c563f;
    border-radius:12px;
    box-shadow:0 4px 12px rgba(0,0,0,0.05);
}

.br-section-title{
    font-size:24px;
    font-weight:600;
    color:#2c563f;
    margin-bottom:12px;
}

.br-text{margin-bottom:15px;font-size:16px; color: #000;}

.br-list{list-style:none;margin:10px 0;padding-left:0;}
.br-list li{
    padding-left:28px;
    margin:6px 0;
    position:relative;
    color: #000;
}
.br-list li::before{
    content:"✔";
    color:#2c563f;
    position:absolute;
    left:0;
    top:2px;
    font-weight:600;
}

@media(max-width:600px){
    .br-main-title{font-size:26px;padding:18px;}
    .br-section{padding:18px;}
    .br-section-title{font-size:20px;}
}