@media (min-width: 1600px) {
   .container {
     max-width: 1400px;
   }
 }

 @media (min-width: 1400px) and (max-width: 1599px) {
   .container {
     max-width: 1300px;
   }
 }

 /*
========= Container Section Ends =======
*/

 @media (max-width: 430px) {
   header .container {
     padding-left: 5px;
     padding-right: 0;
   }
 }


 /* Soul Space */
 .soul-space {
   background: #0f172a;
   color: #bfdbfe;
   font-family: 'Montserrat', sans-serif;
   padding: 3rem 0;
   min-height: 100vh;
 }

 /* Breath Entry */
 .breath-entry {
   text-align: center;
   padding: 2rem 1.5rem;
   border-bottom: 2px solid #22d3ee;
   max-width: 1200px;
   margin: 0 auto;
 }

 .entry-chant {
   font-size: 2.8rem;
   font-weight: 700;
   color: #ffffff;
   margin-bottom: 0.5rem;
 }

 .entry-path {
   font-size: 1.1rem;
   opacity: 0.9;
 }

 /* Yoga Ribbon */
 .ribbon-call {
   font-size: 2.2rem;
   font-weight: 500;
   color: #22d3ee;
   text-align: center;
   margin: 2.5rem 0 1.5rem;
 }

 .ribbon-flow {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
   gap: 1.5rem;
   max-width: 1300px;
   margin: 0 auto;
   padding: 0 1rem;
 }

 .flow-hex {
   background: #1e293b;
   padding: 1.2rem;

   transition: filter 0.3s ease;
 }

 .flow-hex:hover {
   filter: brightness(1.2) drop-shadow(0 0 10px rgba(34, 211, 238, 0.3));
 }

 .service-image img {
   width: 100%;
   height: auto;
   display: block;
   border-radius: 8px;
   clip-path: polygon(25% 0%, 100% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
 }

 .hex-visual {
   height: 180px;

   background: #334155;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 0.9rem;
   color: #bfdbfe;
   margin-bottom: 1rem;
   clip-path: polygon(25% 0%, 100% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
 }

 .hex-chant {
   font-size: 1.6rem;
   font-weight: 500;
   color: #ffffff;
   text-align: center;
   margin-bottom: 0.8rem;
 }

 .hex-tale {
   color: #ffffff;
   font-size: 0.95rem;
   line-height: 1.5;
   margin-bottom: 1rem;
 }

 .hex-cost {
   font-size: 1rem;
   color: #22d3ee;
   text-align: center;
   margin-bottom: 1rem;
 }

 .UX3hpE9yE3 {
   display: block;
   text-align: center;
   background: #22d3ee;
   color: #0f172a;
   padding: 0.8rem;
   text-decoration: none;
   font-weight: 500;
   transition: background 0.3s ease, transform 0.3s ease;
 }

 .UX3hpE9yE3:hover {
   background: #06b6d4;
   transform: translateY(-2px);
 }

 /* Plan Horizon */
 .ZUgrKgOz2U {
   font-size: 2.2rem;
   font-weight: 500;
   color: #22d3ee;
   text-align: center;
   margin: 2.5rem 0 1.5rem;
 }

 .horizon-line {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
   gap: 1.5rem;
   max-width: 1300px;
   margin: 0 auto;
   padding: 0 1rem;
 }

 .UiHpZM6X63 {
   background: #1e293b;
   padding: 1.2rem;

   transition: filter 0.3s ease;
 }

 .UiHpZM6X63:hover {
   filter: brightness(1.2) drop-shadow(0 0 10px rgba(34, 211, 238, 0.3));
 }

 .point-title {
   font-size: 1.5rem;
   font-weight: 500;
   color: #ffffff;
   text-align: center;
   margin-bottom: 0.8rem;
 }

 .point-gifts {
   list-style: none;
   padding: 0;
   margin-bottom: 1rem;
 }

 .point-gifts li {
   color: #fff;
   font-size: 0.95rem;
   margin-bottom: 0.5rem;
   padding-left: 1.5rem;
   position: relative;
 }

 .point-gifts li::before {
   content: '🌿';
   position: absolute;
   left: 0;
   font-size: 1.1rem;
 }

 .point-cost {
   font-size: 1.1rem;
   color: #22d3ee;
   text-align: center;
   margin-bottom: 1rem;
 }

 .sVwX0sFuMs {
   display: block;
   text-align: center;
   background: #22d3ee;
   color: #0f172a;
   padding: 0.8rem;
   text-decoration: none;
   font-weight: 500;
   transition: background 0.3s ease, transform 0.3s ease;
 }

 .sVwX0sFuMs:hover {
   background: #06b6d4;
   transform: translateY(-2px);
 }

 /* Echo Field */
 .field-call {
   font-size: 2.2rem;
   font-weight: 500;
   color: #22d3ee;
   text-align: center;
   margin: 2.5rem 0 1.5rem;
 }

 .xzJ9tAmfPW {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
   gap: 1.5rem;
   max-width: 1300px;
   margin: 0 auto;
   padding: 0 1rem;
 }

 .wave-voice {
   background: #1e293b;
   padding: 1.2rem;

   transition: filter 0.3s ease;
 }

 .wave-voice:hover {
   filter: brightness(1.2) drop-shadow(0 0 10px rgba(34, 211, 238, 0.3));
 }

 .voice-text {
   color: #fff;
   font-size: 0.95rem;
   line-height: 1.5;
   margin-bottom: 1rem;
 }

 .sIpUcMELwW {
   display: flex;
   justify-content: space-between;
 }

 .kWA0LfAvUy {
   font-weight: 500;
   color: #ffffff;
 }

 .root-stars {
   color: #facc15;
 }

 /* Responsive Adjustments */
 @media (max-width: 992px) {

   .ribbon-flow,
   .horizon-line,
   .xzJ9tAmfPW {
     grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
   }
 }

 @media (max-width: 768px) {
   .entry-chant {
     font-size: 2.2rem;
   }

   .ribbon-call,
   .ZUgrKgOz2U,
   .field-call {
     font-size: 1.8rem;
   }

   .flow-hex,
   .UiHpZM6X63,
   .wave-voice {
     clip-path: none;
   }
 }

 @media (max-width: 480px) {
   .soul-space {
     padding: 2rem 0;
   }

   .hex-visual {
     height: 150px;
   }

   .hex-chant,
   .point-title {
     font-size: 1.4rem;
   }

   .hex-tale,
   .point-gifts li,
   .voice-text {
     font-size: 0.9rem;
   }
 }

 html {
   scroll-behavior: smooth;
 }

 #preloader {
   background: black no-repeat center;
   height: 100vh;
   width: 100%;
   position: fixed;
   z-index: 1000;
 }

 .preloader {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
 }

 .preloader-img {
   width: 200px;
   height: 100px;
 }

 /*
==== General Section =====
*/

 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 a,
 li,
 p {
   color: #55fff2;
   font-family: Poppins;
 }

 h1 {
   font-size: 3.5rem;
 }

 h2 {
   font-size: 3.125rem;
   font-weight: 700;
   margin-bottom: 1.88rem;
   line-height: 3.75rem;
 }

 h4 {
   font-size: 1.75rem;
   font-weight: 700;
 }

 h3 {
   font-family: Poppins;
   font-size: 2.375rem;
   font-style: normal;
   font-weight: 700;
   line-height: 3rem;
   /* 126.316% */
 }

 h5 {
   font-size: 1.5rem;
   font-weight: 700;
   line-height: 2.125rem;
   letter-spacing: 0.045rem;
 }

 h6 {
   text-align: center;
   font-size: 1.25rem;
   font-weight: 700;
   line-height: 2.125rem;
   letter-spacing: 0.045rem;
 }

 p {
   font-weight: 400;
   font-size: 1rem;
   margin-bottom: 1.87rem;
   line-height: 1.625rem;
   color: #cfcccc;
 }

 a {
   line-height: 1.625rem;
   text-decoration: none;
 }

 #hero h1 {
   text-align: left;
   font-family: Rubik;
   font-style: normal;
   font-weight: 600;
   line-height: 2.3rem;
   text-transform: capitalize;
   font-size: 2rem;

   color: white;
   z-index: 2;
 }

 a:hover {
   color: darkorange;
 }

 li {
   color: #c3c1c1;
   font-family: Rubik;
   font-size: 1rem;
   font-style: normal;
   font-weight: 400;
   line-height: 1.625rem;
   /* 162.5% */
   letter-spacing: 0.03rem;
   list-style: none;
   margin-bottom: 1rem;
 }

 @media (min-width: 1200px) and (max-width: 1399px) {
   h2 {
     font-size: 2.7rem;
     font-weight: 700;
     margin-bottom: 1.88rem;
     line-height: 3.25rem;
   }
 }

 @media (min-width: 320px) and (max-width: 430px) {
   #hero h1 {
     font-size: 2.5rem;
   }

   h2 {
     font-size: 2rem;
     font-weight: 700;
     margin-bottom: 1.88rem;
     line-height: 3.25rem;
   }
 }

 @media (max-width: 319px) {
   #hero h1 {
     font-size: 3rem;
   }

   h2 {
     font-size: 1.7rem;
     font-weight: 700;
     margin-bottom: 1.88rem;
     line-height: 3.25rem;
   }
 }


 textarea.mIlHKLKrEW {
   border-radius: 0;
 }

 /*
==== General Section Ends =====
*/

 /*
==== Common Class Section ====
*/
 header .navbar>.container {
   padding: 0;
 }

 .dropdown-item:active {
   color: white !important;
   background-color: darkorange;
 }

 #main-header.sticky-top {
   position: fixed;
   top: 0;
   width: 100%;
   z-index: 1000;
   /* Add any other styling you need for the sticky header */
   background-color: #ffffff;
   /* ... (other styles) ... */
 }

 .navbar-toggler {
   border: 1px solid darkorange;
 }

 .navbar-toggler:focus {
   text-decoration: none;
   outline: 0;
   box-shadow: 0 0 0 darkorange;
 }

 .card {
   cursor: pointer;
   border: none !important;
   /* Other styles for the card */
 }

 .card:hover {
   /* Styles for the card when hovered */
   background-color: white;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
 }

 .p-color {
   color: darkorange;
   font-family: Poppins;
   font-size: 1.25rem;
   font-style: normal;
   font-weight: 700;
   line-height: 1.875rem;
   /* 150% */
   letter-spacing: 0.0375rem;
   margin-bottom: 1rem;
 }

 .p-color-small {
   color: darkorange;
   font-family: Poppins;
   font-size: 0.75rem;
   font-style: normal;
   font-weight: 700;
   line-height: 1.875rem;
   /* 150% */
   letter-spacing: 0.0375rem;
   margin-bottom: 1rem;
 }

 .ht-btn {
   box-sizing: border-box;
   border: 1px solid darkorange;
   background: darkorange;
   border-radius: 3.5625rem;
   padding: 1.25rem 1.88rem;
   color: white;
   text-align: center;
   font-family: Poppins;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 1rem;
 }

 .ht-btn-light {
   background: white;
   border-radius: 3.5625rem;
   padding: 1.25rem;
   color: darkorange;
   font-family: Poppins;
   display: flex;
   align-items: center;
   gap: 1rem;
 }

 .ht-btn-light::after {
   content: "\F138";
   font-family: "bootstrap-icons";
   color: white;
   font-size: 1.5rem;
   background-color: darkorange;
   border-radius: 50%;
   padding: 0.4rem 0.38rem;
 }

 .ht-btn-light:hover {
   background-color: darkorange;
   color: white;
 }

 .ht-btn-light:hover::after {
   background-color: white;
   color: darkorange;
 }

 .ht-btn-top {
   background: darkorange;
   color: #fff;
   padding: 10px 20px;
   font-family: Poppins;
   font-size: 0.75rem;
   font-style: normal;
   font-weight: 400;
   line-height: 1.625rem;
   letter-spacing: 0.0225rem;
   border-radius: 3.5625rem;
   display: flex;
   gap: 1.25rem;
   align-items: center;
   justify-content: center;
 }

 .ht-btn-top:hover {
   border: 1px solid darkorange;
   background-color: white;
   color: darkorange;
 }

 /* .ht-btn-top::after {
  content: "\F138";
  font-family: "bootstrap-icons";
  color: white;
  font-size: 1.5rem;
}
.ht-btn::after {
  content: "\F138";
  font-family: "bootstrap-icons";
  color: white;
  font-size: 1.5rem;
} */
 .ht-btn:hover {
   border: 1px solid darkorange;
   background: white;
   color: darkorange;
 }

 .ht-btn:hover::after {
   color: darkorange;
 }

 .ht-category-btn {
   display: flex;
   padding: 0.625rem 1.25rem;
   justify-content: center;
   align-items: center;
   gap: 0.625rem;
   border-radius: 1.6875rem;
   border: 2px solid darkorange;
   color: darkorange;
 }

 .ht-category-btn:hover {
   background-color: darkorange;
   color: white;
 }

 .ht-category-btn.active {
   background-color: darkorange;
   color: white;
 }

 .ph-no {
   display: flex;
   gap: 0.62rem;
 }

 .ph-no::before {
   content: "\F5C1";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 .gwijR2IS1I {
   display: flex;
   gap: 0.62rem;
 }



 .clock {
   display: flex;
   gap: 0.62rem;
 }

 .clock::before {
   content: "\F102";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 /* Section Styling */
 .contact-section {

   color: #fff;
 }

 .section-title {

   font-size: 2.5rem;
   font-weight: 800;
   background: linear-gradient(90deg, #ffffff, #ffdede);
   -webkit-background-clip: text;

 }

 .section-subtitle {
   color: #000000;
   font-size: 1.1rem;
   opacity: 0.9;
 }

 /* Cards */
 .contact-card,
 .info-card,
 .L0Dh484oYF {
   transition: all 0.4s ease;
 }

 .contact-card:hover,
 .info-card:hover,
 .L0Dh484oYF:hover {
   transform: translateY(-6px);
 }

 /* Buttons */
 .btn-gradient {
   background: linear-gradient(90deg, #ff416c, #22d3ee);
   color: #fff;
   border: none;
   border-radius: 50px;
   transition: all 0.3s ease;
 }

 .btn-gradient:hover {
   transform: translateY(-3px);
   box-shadow: 0 12px 25px rgba(0, 0, 0, 0.2);
 }



 /* Map zoom effect */
 .L0Dh484oYF iframe {
   transition: transform 0.6s ease;
 }

 .L0Dh484oYF:hover iframe {
   transform: scale(1.03);
 }

 .likes,
 .views,
 .author,
 .date,
 .reply {
   display: flex;
   gap: 0.62rem;
   cursor: pointer;
 }

 .reply::before {
   content: "\F253";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 .reply:hover::before {
   content: "\F24E";
   font-family: "bootstrap-icons";
   color: rgb(116, 116, 224);
 }

 .date::before {
   content: "\F20C";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 .author::before {
   content: "\F4E1";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 .views::before {
   content: "\F341";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 .likes::before {
   content: "\F417";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 .likes:hover::before {
   content: "\F415";
   font-family: "bootstrap-icons";
   color: red;
 }

 .KUGJk2hmZZ {
   display: flex;
   align-items: start;
   gap: 0.5rem;
 }



 .healthCare,
 .healing-hand,
 .experience {
   display: flex;
   align-items: center;
   gap: 0.62rem;
 }

 .year-exp {
   display: flex;
   align-items: center;
   gap: 1.1rem;
 }

 .healing-hand::before {
   content: url(../img/About/healing-hand.svg);
 }

 .healthCare::before {
   content: url(../img/About/healthCare.svg);
 }

 .experience::before {
   content: url(../img/About/experience.svg);
 }

 .year-exp::before {
   content: url(../img/About/year-exp.svg);
 }

 .small_square_frame {
   display: flex;
   justify-content: center;
   max-width: 5.9375rem;
   max-height: 5.9375rem;
   flex-shrink: 0;
 }

 .drop-square-frame {
   border: 1px solid black;
 }

 .circle-container {
   width: 100px;
   /* Adjust the width as needed */
   height: 100px;
   overflow: hidden;
   padding: 0;
   border-radius: 50%;
   margin: 0 auto;
   background-color: grey;
 }

 .circle-container img {
   object-fit: cover;
   /* Ensure the image covers the circular area */
   width: 100%;
   height: 100%;
 }

 /*
==== Common Class Section Ends ====
*/

 /*
====Swiper Media Queries =====*/
 .swiper-slide {
   display: flex;
   justify-content: center;
 }

 @media (max-width: 767px) {
   .swiper-slide {
     display: flex;
     justify-content: center;
   }
 }

 /*
==== Header Top =====
*/

 .header-top {
   background-color: #dae5ff;
   padding-block: 0.75rem;
   display: flex;
   align-items: center;
 }

 .header-top ul>li {
   padding: 0;
   list-style: none;
 }

 header li {
   margin-bottom: 0;
 }

 ul {
   padding: 0;
 }

 .header-top ul,
 .header-top li {
   margin-bottom: 0;
 }

 .ht-top-right {
   margin-bottom: 0;
 }

 @media (max-width: 991px) {
   .ht-top-right {
     margin-top: 25px;
   }
 }

 @media (min-width: 1400px) {
   .ht-top-left {
     display: flex;
     gap: 25px;
     align-items: center;
     margin-bottom: 0;
   }

   .header-top .ht-btn-top {
     text-align: center;

     margin-bottom: 0;
   }
 }

 @media (min-width: 1200px) and (max-width: 1399px) {
   .header-top .ht-btn-top {
     text-align: center;
   }
 }

 @media (min-width: 992px) and (max-width: 1199px) {
   .header-top .ht-btn-top {
     text-align: center;
   }
 }

 @media (min-width: 768px) and (max-width: 991px) {
   .ht-top-left {
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: left;
     justify-content: center;
   }

   .header-top .ht-btn-top {
     text-align: center;
   }
 }

 @media (min-width: 576px) and (max-width: 767px) {
   .ht-top-left {
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: left;
     justify-content: center;
   }

   .header-top .ht-btn-top {
     text-align: center;
   }
 }

 @media (min-width: 420px) and (max-width: 575px) {
   .ht-top-left {
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: left;
     justify-content: center;
   }

   .header-top .ht-btn-top {
     text-align: center;
   }
 }

 @media (min-width: 320px) and (max-width: 419px) {
   .ht-top-left {
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     justify-content: center;
     word-wrap: break-word;
   }

   .header-top .ht-btn-top {
     text-align: center;
   }
 }

 /*
==== Header Top Ends =====
*/

 /*
======== 2)HEADER-SECTION  ========
*/

 header {
   padding-block: 2rem;
   background-color: white;
 }

 header .nav-item a {
   color: black;
 }

 .sticky-top {
   padding-block: 1.88rem;
   /* Adjust the initial padding */
   transition: padding ease-in 0.3s;
   /* Add a smooth transition effect */
 }

 .sticky-top.scrolled {
   padding: 10px 0;
   /* Adjust the padding when scrolled */
 }

 header .nav-item a:hover {
   color: darkorange;
 }

 .nav-item .dropdown-menu .nav-item .k8ilUizItA {
   padding: 0 !important;
   padding-left: 1rem !important;
 }

 header .nav-item .k8ilUizItA.active {
   text-align: left;
   padding: 0.44rem 0.94rem;
   border-radius: 1.8125rem;
   color: darkorange;
   border: 1px solid darkorange;
 }

 @media (max-width: 991px) {
   header .nav-item .k8ilUizItA.active {
     width: 30%;
   }
 }

 .pro-drop:hover .dropdown-menu {
   display: block;
 }

 .pro-drop:hover .pro-drop-2 .dropdown-menu {
   display: none;
 }

 .pro-drop:hover .pro-drop-2:hover .dropdown-menu {
   display: block;
   display: block;
   position: absolute;
   left: 100%;
   top: 0;
 }

 @media (min-width: 992px) {
   .pro-drop-1 {
     display: none;
   }

   .pro-drop-3 {
     display: none;
   }
 }

 @media (max-width: 991px) {
   .pro-drop {
     display: none;
   }

   .dropdown-menu .dropdown-menu.show {
     display: block;
   }
 }

 .bi.bi-search {
   font-size: 26px;
   cursor: pointer;
 }

 .search-container {
   position: relative;
 }

 .search-tab {
   display: none;
   position: absolute;
   top: 45px;
   left: -10px;
   /* Adjust the width as needed */
   padding: 10px;
   margin: 10px;
   margin-right: 10px;
   background-color: white;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
   border-radius: 5px;
   z-index: 39;
 }

 #search-icon:hover+#search-tab {
   display: block;
 }

 #search-tab:hover {
   display: block;
 }

 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
   background-color: darkorange !important;
 }

 .swiper-pagination-bullet {
   width: 15px;
   height: 15px;
 }

 header select {
   cursor: pointer;
 }

 .menu-icon {
   cursor: pointer;
 }

 /*
  ======== HEADER-SECTION ENDS ========
  */
 /*
=== HomePage Hero ===
*/

 /*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/

 #hero {
   background: linear-gradient(135deg, #2a2a4d, #4a90e2);
 }

 #hero svg {
   margin-bottom: 1.88rem;
 }

 #hero h2 {
   margin-bottom: 1.5rem;
 }

 #hero p {

   margin-bottom: 1rem;
 }

 .hero-left {
   padding-top: 6.25rem;
 }

 #hero .ht-btn {
   margin-bottom: 5rem;
 }

 .breadcrumb-item {
   cursor: pointer;
 }

 .breadcrumb-item a:hover {
   color: darkorange;
 }

 .gYGSzSVZ05 {
   position: relative;
   z-index: 2;
   bottom: 30%;
   display: flex;
   flex-direction: column;
 }

 #hero .breadcrumb {

   background: #22d3ee;
   padding-inline: 1.88rem;
   padding-block: 0.62rem;
   color: black;

   z-index: 2;
 }

 #hero li {
   margin-bottom: 0;
 }

 .breadcrumb-item a {
   font-family: Poppins;
   font-size: 1rem;
   color: black;
 }

 .breadcrumb-item.active {
   color: darkorange;
   font-size: 1rem;
 }

 .breadcrumb-item+.breadcrumb-item::before {
   float: left;
   padding-right: var(--bs-breadcrumb-item-padding-x);
   color: black;
   content: var(--bs-breadcrumb-divider, "/");
 }

 .hero-img {
   position: relative;
   bottom: 0;
   margin-top: auto;
 }

 /*
  ===== Home Page services section =====
  */
 #home-services {
   padding-block: 6.25rem;
 }

 #home-services .card {
   display: flex;
   align-items: center;
   text-align: center;
 }

 #home-services .swiper-pagination {
   margin-top: 3rem;
   position: static;
 }

 #home-services .card {
   background: #f7f9ff;
 }

 /*
======= HomePage Banner =====
*/


 /*
======= HomePage Banner Ends =====
*/

 /*
======= HomePage Welcome =====
*/
 #welcome {
   padding-top: 6.25rem;
 }

 .homePage-blog-categoreis {
   margin-bottom: 1.88rem;
 }

 /*
======= HomePage Welcome Ends =====
*/
 /*
======= HomePage Blog  =====
*/
 #homePage-Blog {
   padding-block: 6.25rem;
 }

 #homePage-Blog .swiper-pagination {
   position: static;
   margin-top: 3rem;
 }

 #homePage-Blog h6 {
   text-align: start;
 }

 .homePage-blog-categoreis {
   cursor: pointer;
 }

 #homePage-blog .card {
   border: 1px solid black !important;
   border-radius: 0rem 0rem 0.625rem 0.625rem;
   background: #fff;
   box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.15);
 }

 @media (max-width: 767px) {
   .homePage-blog-categoreis {
     flex-wrap: wrap;
     justify-content: flex-start;
   }
 }

 /*
======= HomePage Blog Ends =====
*/
 /*
======= HomePage Appointment =====
*/
 .homePage-appointment-right {
   position: relative;
 }

 .homePage_appointment-img-1 {
   position: absolute;
   top: 0;
   left: 0;
 }

 .homePage_appointment-img-2 {
   position: absolute;
   right: 0;
 }

 /*
======= HomePage Appointment Ends =====
*/

 /*
====== HomePage Tesimonial ======
*/
 #homePage-testimonial {
   padding-block: 6.25rem;
   background: #f7f9ff;
   position: relative;
   z-index: 1;
 }

 #homePage-testimonial .card {
   position: relative;
   z-index: 2;
 }

 #homePage-testimonial .circle-container {
   position: absolute;

   top: -40px;
   left: 50%;
   transform: translateX(-50%);
 }

 #homePage-testimonial .card-title {
   margin-top: 4.13rem;
 }

 .swiper-slide {
   position: relative;
   z-index: 2;
 }

 #homePage-testimonial .swiper-pagination {
   position: static;
   margin-top: 7rem;
 }

 /* Optional: Add transition for a smoother effect */
 .swiper-slide:hover .circle-container {
   top: -30px;
   /* Adjust this value as needed */
   transition: top 0.3s ease;
   /* Adjust duration and timing function as needed */
 }

 .choose-card {
   padding-block: 1.88rem;
   padding-inline: 2.06rem;
   text-align: center;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   border-radius: 0.625rem;
   background: #f7f9ff;
 }

 .choose-img {
   margin-bottom: 1.93rem;
 }

 #homePage-appointment {
   padding-top: 6.25rem;
 }

 #homePage-about,
 #homePage-choose {
   padding-block: 6.25rem;
 }

 .homePage-about-mission h6,
 .homePage-about-vision h6 {
   margin-bottom: 20px;
 }

 .homePage-about-mission h6::before {
   content: url(../img/HomePage/homePage-about-icon-1.png);
 }

 .homePage-about-vision h6::before {
   content: url(../img/HomePage/homePage-about-icon-2.svg);
 }

 .homePage-appointment-img-1 {
   position: absolute;
   top: 0;
   left: 0;
 }

 .homePage-appointment-img-2 {
   position: absolute;
   bottom: 0;
   right: 0;
 }

 @media (max-width: 991px) {
   .homePage-appointment-img-1 {
     position: relative;
     margin-top: 4rem;
   }

   .homePage-appointment-img-2 {
     position: absolute;
     bottom: -150px;
     right: 0;
   }
 }

 @media (max-width: 576px) {
   .homePage-appointment-img-1 {
     position: relative;
     margin-top: 4rem;
   }

   .homePage-appointment-img-2 {
     position: absolute;
     bottom: -280px;
     right: 0;
     margin-bottom: 4rem;
   }
 }

 .appointment-schedule {
   display: flex;
   align-items: center;
   gap: 0.94rem;
 }

 .appointment-people {
   display: flex;
   gap: 0.56rem;
 }

 .appointment-schedule::before {
   content: "\F20C";
   font-family: "bootstrap-icons";
   color: darkorange;
 }

 .appointment-people::before {
   content: url(../img/HomePage/group-person.svg);

   color: darkorange;
 }

 .homePage-about-img-1 {
   max-width: 60%;
   position: absolute;
   top: 0;
   right: 30px;
 }

 .homePage-about-img-2 {
   max-width: 60%;
   position: absolute;
   bottom: -50px;
   left: 0;
 }

 @media (min-width: 430px) and (max-width: 991px) {
   .homePage-about-right {
     margin-top: 7rem;
   }
 }

 @media (min-width: 320px) and (max-width: 419px) {
   .homePage-about-right {
     margin-top: 10rem;
   }
 }

 @media (max-width: 1199px) {

   .homepage-about-image-1,
   .homePage-about-img-2 {
     position: relative;
   }
 }

 @media (min-width: 992px) and (max-width: 1199px) {
   .homepage-about-image-1 {
     position: relative;
   }

   .homePage-about-img-2 {
     bottom: -150px;
     margin-bottom: 3rem;
   }
 }

 #homePage-testimonial .swiper-wrapper {
   height: 18rem;
 }

 #homePage-testimonial .swiper-slide {
   margin-top: 3rem;
 }

 @media (min-width: 992px) and (max-width: 1199px) {
   #homePage-testimonial .swiper-wrapper {
     height: 18rem;
   }
 }

 @media (min-width: 768px) and (max-width: 991px) {
   #homePage-testimonial .swiper-wrapper {
     height: 20rem;
   }
 }

 /*
  ====== HomePage Tesimonial Ends ======
  */

 /*==========================================================*/
 #procedurePage .hero {
   background: linear-gradient(135deg, #2a2a4d, #4a90e2);
 }

 :root {
   --primary-color: #1e40af;
   /* Deep blue for calm */
   --secondary-color: #06b6d4;
   /* Cyan for energy */
   --accent-color: #fbbf24;
   /* Warm orange for highlights */
   --text-color: #f3f4f6;
   /* Light gray for readability on dark */
   --bg-color: #0f172a;
   /* Dark slate background */
   --shadow-color: rgba(0, 0, 0, 0.2);
   /* Soft shadow */
   --hover-shadow: rgba(6, 182, 212, 0.3);
   /* Cyan glow on hover */
 }

 body {
   background: var(--bg-color);
   color: var(--text-color);
   font-family: 'Montserrat', sans-serif;
 }

 .zen-hero {
   background: linear-gradient(to bottom, var(--primary-color), var(--bg-color));
   padding: 6rem 0;
   box-shadow: 0 4px 20px var(--shadow-color);
   animation: fadeIn 1.5s ease-out;
 }

 .zen-left h1 {
   color: #ffffff;
   font-weight: 700;
   text-shadow: 0 2px 4px var(--shadow-color);
 }

 .zen-left h2 {
   color: var(--accent-color);
 }

 .zen-left p {
   color: var(--text-color);
   margin-bottom: 2rem;
 }

 .zen-btn {
   background: var(--secondary-color);
   color: #ffffff;
   padding: 1rem 2rem;
   border: none;
   border-radius: 50px;
   font-weight: 600;
   transition: background 0.3s, transform 0.3s, box-shadow 0.3s;
 }

 .zen-btn:hover {
   background: darken(var(--secondary-color), 10%);
   transform: translateY(-3px);
   box-shadow: 0 4px 15px var(--hover-shadow);
 }

 .WRXFrC30xT {
   border-radius: 20px;
   box-shadow: 0 8px 30px var(--shadow-color);
   animation: float 3s ease-in-out infinite;
 }

 @keyframes fadeIn {
   from {
     opacity: 0;
     transform: translateY(20px);
   }

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

 @keyframes float {

   0%,
   100% {
     transform: translateY(0);
   }

   50% {
     transform: translateY(-10px);
   }
 }

 .serene-features {
   padding: 4rem 0;
 }

 .serene-scroll {
   display: flex;
   overflow-x: auto;
   gap: 1.5rem;
   padding: 1rem;
   scroll-snap-type: x mandatory;
 }

 .uRKm3i46Ly {
   background: var(--primary-color);
   border-radius: 15px;
   padding: 1.5rem;
   min-width: 300px;
   box-shadow: 0 6px 25px var(--shadow-color);
   transition: transform 0.3s, box-shadow 0.3s;
   scroll-snap-align: start;
 }

 .uRKm3i46Ly:hover {
   transform: scale(1.05);
   box-shadow: 0 10px 35px var(--hover-shadow);
 }

 .uRKm3i46Ly h6 {
   color: var(--accent-color);
   font-weight: 600;
 }

 .uRKm3i46Ly p {
   color: var(--text-color);
 }

 #welcome-haven {
   padding: 4rem 0;
   background: linear-gradient(to right, var(--bg-color), var(--primary-color));
   box-shadow: inset 0 0 20px var(--shadow-color);
 }

 #welcome-haven p {
   color: var(--text-color);
   margin-bottom: 1.5rem;
   animation: slideInLeft 1s ease-out;
 }

 .KeVEdUvVVl {
   background: var(--accent-color);
   color: #0f172a;
   padding: 1rem 2rem;
   border-radius: 50px;
   font-weight: 600;
   transition: background 0.3s, transform 0.3s, box-shadow 0.3s;
 }

 .KeVEdUvVVl:hover {
   background: darken(var(--accent-color), 10%);
   transform: translateY(-3px);
   box-shadow: 0 4px 15px rgba(251, 191, 36, 0.3);
 }

 .haven-img {
   border-radius: 20px;
   box-shadow: 0 8px 30px var(--shadow-color);
   animation: fadeInRight 1s ease-out;
 }

 @keyframes slideInLeft {
   from {
     opacity: 0;
     transform: translateX(-30px);
   }

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

 @keyframes fadeInRight {
   from {
     opacity: 0;
     transform: translateX(30px);
   }

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

 #insight-scroll {
   padding: 4rem 0;
 }

 .insight-scroll {
   display: flex;
   overflow-x: auto;
   gap: 1.5rem;
   padding: 1rem;
   scroll-snap-type: x mandatory;
 }

 .insight-card {
   min-width: 300px;
   background: var(--primary-color);
   border-radius: 15px;
   overflow: hidden;
   box-shadow: 0 6px 25px var(--shadow-color);
   transition: transform 0.3s, box-shadow 0.3s;
   scroll-snap-align: start;
   padding: 10px;
 }

 .insight-card:hover {
   transform: scale(1.05);
   box-shadow: 0 10px 35px var(--hover-shadow);
 }

 .insight-card img {
   object-fit: cover;
   height: 200px;
 }

 .insight-card h6 {
   color: var(--accent-color);
   font-weight: 600;
   margin-top: 1rem;
 }

 .insight-card p {
   color: var(--text-color);
 }

 #essence-overview {
   padding: 4rem 0;
   background: var(--bg-color);
 }

 #essence-overview p {
   color: var(--text-color);
   margin-bottom: 1.5rem;
 }

 #insight-grid {
   padding: 4rem 0;
 }

 .insight {
   margin-bottom: 2rem;
 }

 .insight .card {
   background: var(--primary-color);
   border-radius: 15px;
   overflow: hidden;
   box-shadow: 0 6px 25px var(--shadow-color);
   transition: transform 0.3s, box-shadow 0.3s;
 }

 .insight .card:hover {
   transform: scale(1.05);
   box-shadow: 0 10px 35px var(--hover-shadow);
 }

 .insight .card img {
   object-fit: cover;
   height: 220px;
 }

 .insight .card h6 {
   color: var(--accent-color);
   font-weight: 600;
   margin-top: 1rem;
 }

 .insight .card p {
   color: var(--text-color);
 }

 #comingSoonPage .hero,
 #errorPage .hero,
 #faqPage .hero,
 #blogdetailPage .hero,
 #blogPage .hero,
 #doctordetailPage .hero,
 #doctorPage .hero,
 #contactPage .hero,
 #dentalinplantPage .hero,
 #procedurePage .hero {
   color: white;
   position: relative;
   width: 100%;
   min-height: 73px;
   background-size: cover;
   overflow: hidden;
   background-attachment: fixed;
   transition: transform 0.5s ease;
 }

 .breadcrumb {

   background: #dae5ff;
 }

 #comingSoonPage .hero::after,
 #errorPage .hero::after,
 #faqPage .hero::after,
 #blogPage .hero::after,
 #blogdetailPage .hero::after,
 #doctordetailPage .hero::after,
 #doctorPage .hero::after,
 #contactPage .hero::after,
 #dentalinplantPage .hero::after,
 #procedurePage .hero::after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(116, 32, 146, 0.5);
   pointer-events: none;
 }

 /*
=====Procedure Page ===========
*/

 #procedure-section {
   padding-top: 6.25rem;
   padding-bottom: 1.25rem;
 }

 #procedure-section .mIlHKLKrEW {
   border-radius: 1.6875rem;
 }

 #filter:focus-visible {
   outline: none !important;
 }

 .procedure-search {
   position: relative;
 }

 .procedure-search input {
   border: 1px solid darkorange;
   padding: 10px;
   padding-left: 76px;
   display: flex;
   border-radius: 1.6875rem;
   align-items: start;
 }

 .item {
   position: relative;
 }

 .procedure-img {
   position: absolute;
   right: 0;
   bottom: 0;
 }

 .filter-container {
   border: 1px solid darkorange;
   padding: 0.625rem 1.25rem;
   display: flex;
   border-radius: 1.6875rem;
   align-items: start;
 }

 .filter-container select>option::before {
   content: url(../img/Procedure/filter-icon.svg);
 }

 .filter-container select,
 .filter-container select option {
   border: none !important;
 }

 @media (max-width: 768px) {
   #procedure-section .container .row {
     padding-right: 0;
   }

   .procedure-list.row>* {
     padding-right: 0;
   }
 }

 /* Hide items that don't have the 'show' class */

 .item.show {
   display: none;
 }

 #procedurePage .ht-btn {
   padding: 1rem;
 }

 #procedurePage .card {
   border-radius: 0;
   background: rgba(241, 241, 241, 1);
 }

 .procedure-category-filter {
   display: flex;
   gap: 1rem;
 }

 .procedure-detail {
   display: none;
 }

 .procedure:hover .procedure-detail {
   display: show;
 }

 @media (max-width: 575px) {
   .procedure-img {
     position: static;
   }
 }

 /*
===== Procedure Detail Section =====
*/
 #procedure-detail-section {
   padding-block: 6.25rem;
 }

 #procedure-detail-section .mIlHKLKrEW {
   border-radius: 3.5625rem;
   border: 2px solid darkorange;
 }

 #procedure-detail-section .mIlHKLKrEW::placeholder::before {
   content: "hi";
 }

 #procedure-detail-section .mIlHKLKrEW::placeholder::before {
   content: "hi";
   color: red;
 }

 .procedure-detail-heading::before {
   margin-right: 1.25rem;
   content: url(../img/Procedure/procedure-detail-teeth.svg);
 }

 .health-part ul li {
   display: flex;
   align-items: center;
 }

 .health-part ul li::before {
   content: "\F309";
   font-family: "bootstrap-icons";
   color: darkorange;
   font-size: 2rem;
 }

 .health-part {
   margin-bottom: 5.25rem;
 }

 .procedure-quotes {
   background: #f0c4ff;
   padding: 1.62rem 4.69rem;
   border-left: 1rem solid darkorange;
 }

 .procedure-quotes p {
   margin-bottom: 0;
 }

 #procedure-detail-section .ht-category-btn {
   color: white;
   background-color: darkorange;
   padding: 0;
   padding: 0.25rem;
 }

 .specialit-read-btn {
   text-align: center;
   border-radius: 3.5625rem;
   border: 1px solid darkorange;
   color: black;
   padding: 0.35rem;
 }

 .specialit-read-btn:hover {
   background-color: darkorange;
 }

 .procedure-short-specialist h4,
 .procedure-opening-hours h4,
 .procedure-head-department h4,
 .procedure-other-departments h4 {
   background: darkorange;
   padding: 1.25rem 1.88rem;
   color: white;
 }

 .specialist-square-frame {
   max-width: 179px;
   max-height: 199px;
 }

 .passion-points {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
 }

 .p-points {
   display: flex;
   align-items: center;
 }

 @media (max-width: 767px) {
   .pp-1 {
     flex-direction: column;
   }
 }

 .p-points::before {
   content: "";
   /* Add this line to generate the pseudo-element content */
   width: 1rem;
   height: 1rem;
   flex-shrink: 0;
   border-radius: 50%;
   /* Use '50%' for a circle */
   background: darkorange;
   display: inline-block;
   /* Added to make it a block element */
   margin-right: 0.5rem;
   /* Adjust the margin as needed */
 }

 .accordion-button::after {
   flex-shrink: 0;
   width: 1.25rem;
   height: 1.25rem;
   margin-left: auto;

   background-image: url(../../Procedure/plus.svg);
   background-repeat: no-repeat;
   background-size: 1.25rem;
   transition: transform 0.2s ease-in-out;
 }

 .accordion-button {
   font-size: 1.5rem;
   font-weight: 700;
   background-color: #f1f1f1;
 }

 .accordion-button:focus {
   background-color: darkorange;
   color: white;
   border-color: transparent !important;
   outline: none;
   box-shadow: none;
 }

 .accordion-button:not(.collapsed)::after {
   background-image: url(../img/Procedure/minus.svg);
 }

 .accordion-item {
   font-size: 1.5rem;
   background-color: white !important;
 }

 .accordion-button:not(.collapsed) {
   color: white;
   background-color: darkorange;
   box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.125);
 }

 .form {
   position: relative;
 }

 .form-input {
   padding: 0.62rem 1.25rem;
 }

 .search-input {
   padding: 10px;
   font-size: 16px;
   border: 1px solid #ccc;
   border-radius: 4px;
   width: 200px;
 }

 .fa.fa-search {
   position: absolute;
   top: 50%;
   left: 1.88rem;
   transform: translateY(-50%);
   color: darkorange;
 }

 @media (max-width: 430px) {
   .procedure-quotes {
     background: #f0c4ff;
     padding: 1rem;
     border-left: 1rem solid darkorange;
   }
 }

 /*
===== Procedure Detail Section Ends =====
*/

 /*
===== Contact Page ======
*/
 #getinTouch {
   padding-block: 6.25rem;
 }

 .getinTouchPart {
   padding: 6.25rem;
   background: #f2ccff;
 }

 #getinTouch input {
   padding-block: 1.09rem;
   padding-left: 1.9rem;
   border-radius: 0;
 }

 #getinTouch label {
   display: flex;
 }

 #getinTouch {
   background: url(../img/Contact/contact-get-in-bg.jpg);
 }

 #quick-contact {
   padding-block: 6.25rem;
 }

 @media (max-width: 575px) {
   .getinTouchPart {
     padding: 0.35rem;
   }

   #quick-contact {
     padding-block: 1rem;
   }
 }

 /*
========== Doctor Page ====
*/
 #doctors {
   padding-block: 6.25rem;
 }

 .doctor-list .card {
   border: none;
   background: none !important;
   border-radius: 0rem 0rem 6.25rem 0rem;
 }

 .doctor-list .card img {
   overflow: hidden;
 }

 .doctor-detail-list {
   margin-top: 4.38rem;
 }

 .doctor-detail-list {
   position: relative;
 }

 .overlay {
   position: absolute;
   top: 0;
   left: 10;
   width: 95%;
   height: 100%;
   border-radius: 0rem 0rem 6.25rem 0rem;
   background: rgba(116, 32, 146, 0.7);
   opacity: 0;
   transition: opacity 0.3s ease;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 1rem;
 }

 .doctor-detail-list:hover .overlay {
   opacity: 1;
 }

 .doctor-detail-list:hover .doctor-detail-list .overlay i {
   color: white;
   font-size: 24px;
 }

 .doctor-detail-list:hover .card-img-overlay {
   z-index: 99;
   left: 0;
   right: 0;
   bottom: -36px !important;
   padding: 0;
 }

 .doctor-list .card:hover {
   box-shadow: none;
 }

 .doctor-list1 .card {
   border-bottom-right-radius: 6.25rem;
 }

 .doctor-list .card-img-overlay {
   top: auto;
   padding-right: 0;
   padding-left: 12rem;
   right: 0;
   bottom: 100px !important;
   z-index: 2;
 }

 .doctor-list1 .card-img-overlay {
   top: auto;
   padding-inline: 2.56rem;
   right: 0;
   bottom: -50px !important;
   z-index: 2;
 }

 @media (min-width: 992px) and (max-width: 1199px) {
   .doctor-list1 .card-img-overlay {
     padding-inline: 0rem;
   }
 }

 .doctor-detail {
   border-radius: 0rem 0rem 0rem 2.625rem;
   background: #f2ccff;
   padding: 1.31rem 1.5rem 1.25rem 1.43rem;
 }

 .doctor-detail .doctor-rating p {
   margin-bottom: 0;
   color: white;
 }

 .doctor-detail .doctor-rating h3 {
   margin-bottom: 0;
   color: white;
 }

 .doctor-speciality p,
 .doctor-speciality h6 {
   text-align: right;
   margin-bottom: 0;
   color: black;
 }

 .doctor-pagination {
   margin-top: 5rem;
   display: flex;
 }

 .doctor-pagination .pagination {
   gap: 1.88rem;
 }

 @media (max-width: 430px) {
   .doctor-pagination .pagination {
     gap: 0.5rem;
   }
 }

 .doctor-pagination .page-link {
   display: flex;
   justify-content: center;
   gap: 1.88rem;
   align-items: center;
   width: 3.125rem;
   height: 3.125rem;
   border: 1px solid darkorange;
   background-color: white;
   color: darkorange;
   border-bottom-left-radius: 50%;
   border-radius: 50%;
 }

 .doctor-pagination .page-link:hover {
   background-color: darkorange;
   color: white;
 }

 .doctor-pagination .page-link.active {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 3.125rem;
   height: 3.125rem;
   border: none;
   background-color: darkorange;
   color: white;
   border-bottom-left-radius: 50%;
   border-radius: 50%;
 }

 .page-item:first-child .page-link {
   border-top-left-radius: 50%;
   border-bottom-left-radius: 50%;
 }

 .page-item:last-child .page-link {
   border-top-right-radius: 50%;
   border-bottom-right-radius: 50%;
 }

 @media (max-width: 430px) {
   .doctor-detail {
     flex-direction: column;
     align-items: start !important;
     text-align: left !important;
     justify-content: start;
   }

   .doctor-speciality {
     margin-left: 0;
   }

   .doctor-speciality p,
   .doctor-speciality h6 {
     text-align: left;
     margin-bottom: 0;
     color: black;
   }
 }

 @media (max-width: 480px) {
   .doctor-list1 .card-img-overlay {
     padding: 0;
   }

   .doctor-list .card-img-overlay {
     text-align: right;
     bottom: 30px !important;

     padding-left: 2rem;
   }

   .doctor-detail {
     justify-content: end !important;
   }
 }

 @media (min-width: 480px) and (max-width: 992px) {
   #doctor-client-test .card {
     max-width: 26.375rem;
     max-height: 26.375rem;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
   }

   #doctor-client-test .swiper .swiper-wrapper .swiper-slide.swiper-slide-active .col {
     display: flex;
     justify-content: center;
     align-items: center;
   }
 }

 #doctor-client-test .card-img-overlay {
   padding-block: 3rem;
   padding-left: 2rem;
   bottom: 10%;
 }

 #doctor-client-test .leaf-container {
   position: absolute;
   bottom: 0;
   right: 0;
 }

 #doctor-client-test .card {
   margin-top: 4.38rem;
 }

 #doctor-client-test .card:hover {
   box-shadow: none;
 }

 #doctor-client-test .swiper-pagination {
   margin-top: 6.25rem;
 }

 .leaf-container {
   max-width: 9.0625rem;
   max-height: 9.0625rem;
   border-radius: 20.28119rem 20.28119rem 0 20.28119rem;
   border: 5px solid darkorange;
   overflow: hidden;
 }

 .client-test-leaf-img {
   overflow: hidden;
 }

 #doctor-client-test .card {
   border: none;
   position: relative;
   background-color: white !important;
 }

 #doctor-client-test {
   padding-block: 6.25rem;
 }

 #doctor-client-test .doc-quote-icon {
   position: absolute;
   top: 23%;
   left: 20px;
 }

 #doctor-client-test .doc-quote-icon-1 {
   position: absolute;
   bottom: 25%;
   right: 23%;
 }

 #doctor-client-test .swiper-pagination {
   position: static;
 }

 @media (min-width: 1200px) and (max-width: 1399px) {
   #doctor-client-test .card-img-overlay {
     padding-block: 1rem;
     padding-left: 2rem;
     bottom: 10%;
   }

   #doctor-client-test .doc-quote-icon {
     position: absolute;
     top: 17%;
     left: 20px;
   }

   #doctor-client-test .doc-quote-icon-1 {
     position: absolute;
     bottom: 17%;
     right: 21%;
   }

   #doctor-client-test .leaf-container {
     position: absolute;
     bottom: -25px;
     right: 0;
   }
 }

 @media (min-width: 992px) and (max-width: 1199px) {
   #doctor-client-test .card-img-overlay {
     padding-block: 0.5rem;
     padding-left: 2rem;
     bottom: 10%;
   }

   #doctor-client-test .doc-quote-icon {
     position: absolute;
     top: 15%;
     left: 20px;
   }

   #doctor-client-test .doc-quote-icon-1 {
     position: absolute;
     bottom: 20%;
     right: 10%;
   }

   #doctor-client-test .leaf-container {
     position: absolute;
     bottom: -70px;
     right: 0;
   }
 }

 @media (max-width: 430px) {
   #doctor-client-test .card-img-overlay {
     padding-block: 0.5rem;
     padding-left: 2rem;
     bottom: 10%;
   }

   #doctor-client-test .doc-quote-icon {
     position: absolute;
     top: 15%;
     left: 20px;
   }

   #doctor-client-test .doc-quote-icon-1 {
     position: absolute;
     bottom: 15%;
     right: 14%;
   }

   #doctor-client-test .leaf-container {
     position: absolute;
     bottom: -40px;
     left: auto;
   }

   #doctor-client-test .card-text {
     margin-top: 2rem;
   }

   .leaf-container {
     max-width: 6.0625rem;
     max-height: 6.0625rem;
     border-radius: 20.28119rem 20.28119rem 0 20.28119rem;
     border: 5px solid darkorange;
     overflow: hidden;
   }
 }

 /*
=======Doctor Details Page =====
*/

 #about-doctor {
   padding-top: 6.25rem;
 }

 #playButton {
   cursor: pointer;
 }

 .popup {
   display: none;
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.7);
   z-index: 999;
 }

 .popup-content {
   position: relative;
   display: flex;
   justify-content: center;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   padding: 20px;
   /* background-color: #fff; */
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
 }

 .close {
   position: absolute;

   font-size: 32px;
   cursor: pointer;
   color: white;
 }

 @media (min-width: 1400px) {
   .close {
     position: absolute;

     font-size: 32px;
   }
 }

 @media (max-width: 390px) {
   .popup-content {
     position: absolute;
     width: 80%;
   }

   .popp {
     justify-content: right;
   }
 }

 #about-doctor h2,
 #about-doctor p {
   margin-bottom: 0.62rem;
 }

 .doctor-chat .ht-btn {
   padding: 10px 15px;
   gap: 0.52rem;
 }

 .doctor-chat .ht-btn::before {
   content: "\F252";
   font-family: "bootstrap-icons";
 }

 .category-specialist {
   margin-block: 1.87rem;
   padding: 1.88rem 1.87rem;
   background: #f1f1f1;
 }

 .doctor-contact .ht-btn {
   padding: 0.62rem 1.25rem;
 }

 .doctor-contact li {
   margin-bottom: 0;
 }

 #doctor-experience,
 #doctor-experience .nav-pills {
   background: #dae5ff;
 }

 #doctor-experience li {
   padding-block: 1.88rem;
   margin-bottom: 0;
 }

 #doctor-experience-content {
   background: #f1f1f1;
   padding: 4.38rem;
 }

 #doctor-experience .k8ilUizItA {
   color: #000;
 }

 #doctor-experience .k8ilUizItA.active {
   color: darkorange;
   border-bottom: 1px solid darkorange;
   border-radius: 0%;
   font-weight: 700;
   background-color: transparent !important;
 }

 .doctor-experience-detail {
   padding-block: 6.25rem;
 }

 .card-img-overlay-1 {
   position: absolute;
   top: -50px;
   right: -50px;
 }

 @media (min-width: 768px) and (max-width: 813px) {
   .card-img-overlay-1 {
     position: absolute;
     top: -50px;
     right: -10px;
   }
 }

 @media (max-width: 767px) {
   .doctor-data {
     margin-top: 5rem;
   }

   .doctor-contact {
     align-items: start;
     gap: 1rem;
   }

   .card-img-overlay-1 {
     position: absolute;
     top: -50px;
     right: -10px;
   }
 }

 @media (max-width: 575px) {
   #doctor-experience-content {
     padding: 2rem;
   }
 }

 /*
======= Blog =======
*/

 #blog-list {
   padding-block: 6.25rem;
 }

 .blog-date {
   color: #474747;
   border: 0.5px solid darkorange;
   padding: 0.2rem 0.81rem;
   font-family: Poppins;
   font-size: 0.875rem;
   font-style: normal;
   font-weight: 400;
   line-height: 1.5rem;
   /* 171.429% */
   letter-spacing: 0.36313rem;
   text-transform: uppercase;
   margin-bottom: 1rem;
 }

 .ht-btn.read-more {
   padding: 0.62rem 1.25rem;
 }

 .ht-btn.read-more:hover {
   border: 1px solid darkorange;
 }

 .blog {
   margin-top: 4.38rem;
 }

 /*
====== Blog-detail-page=====
*/
 #blog-detail-part {
   padding-block: 6.25rem;
 }

 .blog-detail-data {
   margin-top: 2.06rem;
   gap: 1.87rem;
 }

 @media (max-width: 575px) {
   .blog-detail-data {
     gap: 0.8rem;
     flex-direction: column;
   }
 }

 .blog-important {
   padding-top: 6.25rem;
 }

 .blog-quotes {
   padding-block: 4.38rem;
 }

 .blogQuote {
   border-left: 8px solid darkorange;
   padding: 1.62rem 4.69rem;
   background: #f0c4ff;
 }

 @media (max-width: 480px) {
   .blogQuote {
     border-left: 8px solid darkorange;
     padding: 1.5rem;
     background: #f0c4ff;
   }
 }

 .blog-author-details {
   background: #f1f1f1;
   padding: 1.88rem;
 }

 #blog-comments {
   padding-block: 6.25rem;
 }

 .search-bar {
   position: relative;
 }

 .blog-detail-right .mIlHKLKrEW {
   padding-left: 4rem;
   border-radius: 3.5625rem;
   border: 2px solid darkorange;
 }

 .blog-recent-posts .p-color {
   font-size: 1rem;
   font-weight: 400;
 }

 .blog-recent-posts {
   margin-block: 4.38rem;
 }

 .blog-recent-posts h4 {
   color: #fff;
   font-family: Poppins;
   font-size: 1.75rem;
   font-style: normal;
   font-weight: 700;
   line-height: 2.375rem;
   /* 135.714% */
   letter-spacing: 0.0525rem;
   display: flex;

   padding: 1.25rem 1.875rem;
   align-items: center;
   gap: 6.25rem;
   background: darkorange;
 }

 .blog-recent-posts .card,
 .blog-recent-posts .card-body {
   border: 0;
   padding: 0;
 }

 .blog-recent-posts p {
   margin-bottom: 0;
 }

 .blog-recent-posts h6 {
   color: #000;
   text-align: left;
   font-family: Poppins;
   font-size: 1.25rem;
   font-style: normal;
   font-weight: 700;
   line-height: 1.875rem;
   /* 150% */
   margin-bottom: 0;
 }

 .blog-opening-hours {
   background: url(../img/Blog/short-blog-opening-hours.svg) bottom center no-repeat;
   background-repeat: no-repeat;
 }

 .blog-opening-hours {
   margin-block: 4.38rem;
   text-align: center;
   padding: 4.25rem 4.13rem;
 }

 .opening-hours-container {
   background: rgba(255, 255, 255, 0.86);
   display: flex;
   text-align: center;
   padding: 2.875rem 1.9375rem;
   flex-direction: column;

   gap: 0.625rem;
   flex-shrink: 0;
 }

 .short-blog-ad {
   text-align: center;
   background: darkorange;
   color: white;
   padding: 5rem 3.97rem;
 }

 .short-blog-ad h2,
 .short-blog-ad p {
   text-align: center;
   color: white;
 }

 .more-question {
   color: black;
   padding: 1.06rem 3.5rem;
   background: #dae5ff;
 }

 @media (max-width: 480px) {
   .more-question {
     padding: 1rem;
   }

   .blog-opening-hours {
     padding: 2rem;
   }
 }

 #leave-comment {
   color: white;
   position: relative;
   width: 100%;

   background-size: cover;
   overflow: hidden;
   background-attachment: fixed;
 }

 #leave-comment h2 {
   position: relative;
   z-index: 2;
 }

 #leave-comment::after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(218, 229, 255, 0.8);
   pointer-events: none;
 }

 #leave-comment .form {
   border-radius: 0;
   margin-bottom: 1.87rem;
   position: relative;
   z-index: 2;
 }

 #leave-comment .mIlHKLKrEW {
   margin-bottom: 1.87rem;
 }

 #leave-comment {
   padding-block: 6.25rem;
   color: black;
   background: url(../img/Blog/blog-leave-comment.svg) bottom center no-repeat;
 }

 #leave-comment input {
   border-radius: 0;
   padding-block: 1.09rem;
   padding-left: 2.25rem;
 }

 #leave-comment textarea {
   padding-left: 2.25rem;
 }

 /*
===== Faq Page ====
*/
 #faq-section {
   padding-block: 6.25rem;
 }

 #accordionExample1 .accordion-item {
   margin-bottom: 1.88rem;
 }

 #accordionExample1 button {
   font-size: 1.25rem;
 }

 #accordionExample1 .accordion-button {
   padding: 1.06rem 1.1rem 1.56rem;
 }

 #accordionExample1 .accordion-body p {
   font-size: 1rem;
   margin-bottom: 0;
 }

 /*
===== 404 Page ====
*/

 #error {
   position: relative;
   background: url(../img/404-top-bg.png) center no-repeat;
 }

 .error-detail {
   display: flex;
   justify-content: center;
   flex-direction: column;
   align-items: center;
   position: relative;
 }

 #error .container {
   padding: 10rem;
 }

 #error .error-heading {
   color: darkorange;
   text-align: center;
   font-family: Poppins;
   font-size: 12.8125rem;
   font-style: normal;
   font-weight: 700;
   line-height: normal;
   margin-bottom: 0;
 }

 @media (max-width: 429px) {
   #error .error-heading {
     font-size: 3.8125rem;
   }
 }

 /*
===About Page ====
*/

 #about-welcome,
 #about-why-us {
   padding-block: 6.25rem;
 }

 #about-speciality {
   padding-top: 0;
 }

 /* #about-why-us  li::before
{
  content: url(../img/About/abou-choose-before.svg);
} */

 .about-welcome-left {
   position: relative;
 }

 .about-welcome-img-1 {
   position: absolute;
   top: 0;
   left: 0;
 }

 .about-welcome-img-2 {
   position: absolute;
   bottom: 0;
   right: 0;
 }

 @media (min-width: 1200px) and (max-width: 1399px) {
   .about-welcome-img-2 {
     position: absolute;
     bottom: 20px;
     right: 0;
   }
 }

 @media (min-width: 992px) and (max-width: 1199px) {
   .about-welcome-img-2 {
     position: absolute;
     bottom: 60px;
     right: 0;
   }
 }

 @media (max-width: 992px) {
   .about-welcome-left {
     margin-bottom: 6.25rem;
   }

   .about-welcome-img-1 {
     margin-bottom: 3rem;
     position: static;
     left: 0;
     margin-right: auto;
   }
 }

 @media (max-width: 767px) {
   .about-welcome-img-2 {
     position: absolute;
     bottom: -80px;
     right: -19px;
   }
 }

 @media (max-width: 575px) {
   .about-welcome-img-2 {
     position: absolute;
     bottom: -100px;
     right: 0;
   }
 }

 @media (max-width: 480px) {
   .about-welcome-img-2 {
     position: absolute;
     bottom: -150px;
     right: 0;
   }

   .about-welcome-left {
     margin-bottom: 6.25rem;
   }

   .V4h4EcjSuk {
     margin-top: 4rem;
   }

   .speciality {
     flex-direction: column;
   }
 }

 #comingSoon {
   padding-block: 6.25rem;
   background: url(../img/coming-soon-bg.svg) bottom right no-repeat;
 }

 #comingSoon input {
   border-radius: 3.1875rem;
   padding-left: 1.19rem;
   padding-block: 1.13rem;
   border: 1px solid #000;
 }

 .tick-group {
   background-color: darkorange;
   padding: 1.5rem;
   color: white;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   margin-right: 1rem;
   border-radius: 0.5rem;
 }

 .tick-label {
   border-top: 2px soldi white;
   margin-top: 1rem;
   color: white !important;
 }

 .tick-flip {
   border-bottom: 2px solid white;
   margin: 0 !important;
   padding-bottom: 1rem;
   margin-bottom: 1rem;
   border-radius: 0 !important;
 }

 .tick-flip-back {
   display: none;
 }

 .tick-flip-card-shadow {
   display: none;
 }

 .tick-flip-panel {
   color: rgb(255, 255, 255) !important;
 }

 .tick-flip-panel {
   background-color: transparent;
 }

 .countdown a {
   display: none;
 }

 @media (max-width: 480px) {
   .tick-group {
     padding: 1rem;
   }
 }

 @media (max-width: 430px) {
   .tick-group {
     margin-right: 0.4rem;

     padding: 0.5rem;
   }
 }

 /*
====== Footer ======
*/
 #footer {
   padding-top: 2.25rem;
   padding-bottom: 4.25rem;
   background: #6c8eff;
 }

 .social-icons .facebook,
 .social-icons .twitter,
 .social-icons .instagram {
   transition: all ease-in 0.3s;
 }

 .social-icons .facebook:hover,
 .social-icons .twitter:hover,
 .social-icons .instagram:hover {
   cursor: pointer;
   transform: scale(1.1);
 }

 #footer .mIlHKLKrEW {
   background: transparent;
   color: white;
   border-radius: 3.125rem 0rem 0rem 3.125rem;
   border: 2px solid #fff;
 }

 #footer .mIlHKLKrEW::placeholder {
   font-family: Poppins;
   padding-left: 2rem;
   color: white;
 }

 .footer-btn {
   background: transparent;
   color: white;
   padding: 1.06rem 1.88rem;
   border: 1px solid white;
   border-radius: 0rem 3.5625rem 3.5625rem 0rem;
 }

 @media (max-width: 430px) {
   .footer-btn {
     padding: 1rem 1rem;
   }
 }

 a.footer-btn:hover {
   background: white;
   color: darkorange;
 }

 footer h6,
 footer p,
 footer li {
   color: rgb(0, 0, 0);
 }

 footer h6 {
   text-align: left;
   margin-bottom: 1.88rem;
 }

 footer li {
   display: flex;
   align-items: center;
   gap: 0.31rem;
   cursor: pointer;
   line-height: 1.1rem;
 }

 footer li:hover {
   color: #2af598;
 }

 footer .footer-about li::before {
   content: url(../img/Footer/footer-about-before.svg);
 }

 .footer-service li {
   display: flex;
   align-items: center;
 }

 footer .footer-service li::before {
   content: url(../img/Footer/footer-service-before.svg);
 }

 footer .footer-pages li::before {
   content: url(../img/Footer/footer-pages-before.svg);
 }

 footer .footer-links li::before {
   content: url(../img/Footer/footer-link-before.svg);
 }

 @media (max-width: 991px) {
   .footer-logo {
     margin-top: 0rem;
   }

   .footer-about h6,
   .footer-service h6,
   .footer-links h6,
   .footer-pages h6,
   .footer-contact h6 {
     margin-top: 2rem;
   }
 }

 #progress {
   position: fixed;
   bottom: 20px;
   right: 10px;
   height: 70px;
   width: 70px;
   display: none;
   z-index: 219;
   place-items: center;
   border-radius: 50%;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
   cursor: pointer;
   transition: all 0.3s;
 }

 #progress-value:hover {
   background: linear-gradient(#2af598, #009efd);
 }

 #progress-value:hover .bi.bi-rocket {
   color: white;
 }

 .bi.bi-rocket:hover {
   transform: translateZ(1.2px);
 }

 #progress-value {
   display: block;
   height: calc(100% - 15px);
   width: calc(100% - 15px);
   background-color: white;
   border-radius: 50%;
   display: grid;
   place-items: center;
   font-size: 35px;
   color: black;
 }

 .bi.bi-rocket {
   color: darkorange;
   transition: all ease-in 0.3s;
 }

 .bi.bi-rocket:hover {
   transform: translate(1.2px);
 }

 body {
   font-family: 'Futura', sans-serif;
   /* Sleek, modern font */

   /* Dark teal for depth */
   color: #e0e0ff;
   /* Light lavender text */
   overflow-x: hidden;
 }

 header {
   position: relative;
   height: 70px;
   /* Compact for mobile-first */
   background: linear-gradient(135deg, #2a2a4d, #4a90e2);
   /* Gradient for futuristic vibe */
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 0 5vw;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
 }

 /* Logo with diagonal slant */
 .logo {
   font-size: clamp(1.6rem, 4vw, 2.4rem);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 2px;
   transform: skewX(-15deg);
   /* Diagonal flair */
   color: #e0e0ff;
   transition: transform 0.3s ease;
 }

 /* Burger menu checkbox hack */
 .menu-toggle {
   display: none;
 }

 .burger {
   cursor: pointer;
   width: 30px;
   height: 20px;
   position: relative;
   z-index: 20;
 }

 .burger span {
   position: absolute;
   height: 3px;
   width: 100%;
   background: #e0e0ff;
   transition: all 0.3s ease;
 }

 .burger span:nth-child(1) {
   top: 0;
 }

 .burger span:nth-child(2) {
   top: 50%;
   transform: translateY(-50%);
 }

 .burger span:nth-child(3) {
   bottom: 0;
 }

 .menu-toggle:checked~.burger span:nth-child(1) {
   transform: rotate(45deg) translate(5px, 5px);
 }

 .menu-toggle:checked~.burger span:nth-child(2) {
   opacity: 0;
 }

 .menu-toggle:checked~.burger span:nth-child(3) {
   transform: rotate(-45deg) translate(7px, -7px);
 }

 /* Nav menu with slide-in effect */
 nav {
   position: fixed;
   top: 0;
   right: -250px;
   /* Off-screen by default */
   width: 250px;
   height: 100vh;
   background: rgba(42, 42, 77, 0.95);
   padding: 80px 20px 20px;
   transition: right 0.3s ease;
   z-index: 10;
 }

 .menu-toggle:checked~nav {
   right: 0;
   /* Slide in when checked */
 }

 .k8ilUizItA {
   display: block;
   text-decoration: none;
   color: #e0e0ff;
   font-size: clamp(1rem, 2.5vw, 1.2rem);
   font-weight: 500;
   padding: 10px 15px;
   margin-bottom: 10px;
   background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.1));
   border-left: 2px solid #4a90e2;
   transition: background 0.3s ease, color 0.3s ease;
 }

 .k8ilUizItA:hover {
   background: rgba(255, 255, 255, 0.2);
   color: #ffffff;
 }

 /* Diagonal accent lines */
 .rlNneqmCvN {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: repeating-linear-gradient(45deg,
       transparent,
       transparent 20px,
       rgba(74, 144, 226, 0.1) 20px,
       rgba(74, 144, 226, 0.1) 40px);
   z-index: -1;
   opacity: 0.5;
 }

 /* Responsive adjustments */
 @media (min-width: 768px) {
   .menu-toggle {
     display: none;
   }

   .burger {
     display: none;
   }

   nav {
     position: static;
     width: auto;
     height: auto;
     background: none;
     display: flex;
     gap: 15px;
     padding: 0;
   }

   .k8ilUizItA {
     display: inline-block;
     margin: 0;
     border: none;
     background: none;
     padding: 5px 10px;
   }

   .k8ilUizItA:hover {
     background: rgba(255, 255, 255, 0.1);
     border-radius: 5px;
   }
 }

 @media (max-width: 480px) {
   .logo {
     font-size: clamp(1.4rem, 3.5vw, 1.8rem);
   }

   nav {
     width: 200px;
   }

   .k8ilUizItA {
     font-size: clamp(0.9rem, 2vw, 1rem);
   }
 }

 .bQp6tAGEcp {
   margin-top: 15px;
 }

 .bQp6tAGEcp a {
   display: inline-block;
   margin-right: 12px;
   transition: transform 0.3s ease, opacity 0.3s ease;
 }

 .bQp6tAGEcp a img {
   width: 30px;
   height: 30px;
   filter: grayscale(0.5);
   transition: filter 0.3s ease;
 }

 .bQp6tAGEcp a:hover img {
   transform: scale(1.2);
   filter: grayscale(0);
 }