:root {
           --primary: #33a9b1;
           --accent: #1f3d3f;
           --dark: #0f2a1e;
           --light: #f8f9fa;
           --gray: #e9ecef;
         }

         h2, h5, h3 {
           font-family: "Roboto", sans-serif;
         }


         h2, h5 {
           color: var(--accent);
           font-weight: 600;
         }

         html {
           scroll-behavior: smooth;
         }

         /* main heading css  */
         .main-heading {
           line-height: 1.2;
           margin-bottom: 25px;
           color: var(--accent);
         }

         .main-heading span {
           color: var(--primary);
         }

         /* ---------------------------------- */
         /* ---------------------------------- */

         /* short top heading css  */
         .banner-title {
           display: flex;
           align-items: center;
           gap: 12px;
           color: #fff;
           font-family: Arial, sans-serif;
         }

         .banner-title .line {
           width: 80px;
           height: 2px;
           background: var(--primary)
         }

         .banner-title .dot {
           width: 12px;
           height: 12px;
           background: var(--primary);
           border-radius: 50%;
         }

         /* ---------------------------------------- */
         /* ---------------------------------------- */

         /* navbar css  */
         .top-bar {
           background-color: var(--accent);
           padding: 10px 40px 10px 40px;

         }

         .fix-nav {
           position: absolute;
           width: 100%;

           z-index: 99999;
         }

         .navbar {
           z-index: 9999;
           transition: all 0.3s ease;
           border-radius: 50px;
           margin: 20px 20px 0 20px;
           background-color: #fff;

         }

         .navbar.scrolled {
           box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
           padding-top: 5px !important;
           padding-bottom: 5px !important;
         }



         /* Hover dropdown show */
         .nav-item.dropdown:hover .dropdown-menu {
           display: block;
           margin-top: 0;
         }

         /* Smooth fade animation */
         .fade-menu {
           animation: fadeIn 0.25s ease-in-out;
         }

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

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

         /* Menu spacing */
         .nav-link {
           padding: 10px 18px !important;
           color: #000 !important;
         }

         /* Active hover effect */
         .nav-link:hover {
           /* color: #00bcd4 !important; */
           color: var(--accent) !important;
         }

         /* Dropdown menu styling */
         .dropdown-menu {
           border-radius: 8px;
           padding: 10px 0;
         }

                     /* Default dropdown item */
            .dropdown-menu .dropdown-item {
                transition: all 0.3s ease;
            }

            /* Hover effect */
            .dropdown-menu .dropdown-item:hover {
                background-color: var(--accent);
                color: #ffffff;
            }

            /* Active / focus */
            .dropdown-menu .dropdown-item:focus,
            .dropdown-menu .dropdown-item.active {
                background-color: #094b9c;
                color: #fff;
            }
         /* ============================================ */
         /* ============================================ */

         /* heading section for all  */
         .section-header {
           display: flex;
           justify-content: space-between;
           align-items: center;
           flex-wrap: wrap;
           text-align: left;
         }

         /* =============================================== */
         /* =============================================== */

         /* Footer CSS */
         /* MAIN FOOTER */
         .main-footer {
           background: var(--accent);
           padding: 70px 20px 20px;
           color: #000;
           font-family: "Poppins", sans-serif;
         }

         .footer-container {
           display: grid;
           grid-template-columns: repeat(4, 1fr);
           gap: 40px;
           max-width: 1300px;
           margin: auto;
         }

         .footer-col h2 {
           color: #fff;
           font-size: 22px;
           margin-bottom: 20px;
         }

         .footer-col p {
           line-height: 1.7;
           opacity: 0.8;
         }


         /* USEFUL LINKS */
         .footer-col ul {
           padding: 0;
           list-style: none;
         }

         .footer-col h6 {
           color: var(--primary);
         }

         .footer-col p a {
           color: #fff;
         }

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

         .footer-col ul li i {
           color: var(--primary);
         }

         .footer-col ul li a {
           color: #fff;
           text-decoration: none;
           transition: .3s;
         }

         .footer-col ul li a:hover {
           color: var(--primary);
         }

         .footer-col .foot-icon {
           background: var(--primary);
           color: var(--accent);
           width: 35px;
           height: 35px;
           border-radius: 50%;
           display: flex;
           justify-content: center;
           align-items: center;
         }

         /* FOOTER BOTTOM */
         .footer-bottom {
           text-align: center;
           margin-top: 40px;
           border-top: 1px solid #333;
           padding-top: 20px;
           opacity: .8;
         }

         .footer-bottom a {
           color: #fff;
           font-weight: bold;
         }

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

         @media (max-width: 600px) {
           .footer-container {
             grid-template-columns: 1fr;
           }
         }

         /* ====================================================== */
         /* ====================================================== */

         /* main button css  */
         .button1 {
           line-height: 1;
           text-decoration: none;
           display: inline-flex;
           align-items: center;
           gap: 0.75rem;
           background-color: var(--primary);
           color: #fff;
           border-radius: 10rem;
           font-weight: 600;
           padding: 0.75rem 1.5rem;
           padding-left: 20px;
           white-space: nowrap;
           overflow: hidden;
           text-overflow: ellipsis;
           transition: background-color 0.3s;
         }

         .button1__icon-wrapper {
           flex-shrink: 0;
           width: 25px;
           height: 25px;
           position: relative;
           color: #000;
           background-color: #fff;
           border-radius: 50%;
           display: grid;
           place-items: center;
           overflow: hidden;
         }

         .button1:hover {
           background-color: var(--accent);
           color: #fff;
         }

         .button1:hover .button1__icon-wrapper {
           color: #fff;
           background-color: var(--primary);
         }

         .button1__icon-svg--copy {
           position: absolute;
           transform: translate(-150%, 150%);
         }

         .button1:hover .button1__icon-svg:first-child {
           transition: transform 0.3s ease-in-out;
           transform: translate(150%, -150%);
         }

         .button1:hover .button1__icon-svg--copy {
           transition: transform 0.3s ease-in-out 0.1s;
           transform: translate(0);
         }

         /* ======================================================= */
         /* ======================================================= */

         /* Social icons for header and footer  */
         .icons {
           width: 30px;
           height: 30px;
           background: #fff;
           border-radius: 50%;
           cursor: pointer;
           display: flex;
           align-items: center;
           justify-content: center;
           box-shadow: 2px 2px 3px #6e6d6dce;
         }

         .icons i {
           color: var(--accent);
         }

         /* ================================================== */
         /* ================================================== */

         /* About section css  */

         .about-section {
           background: #eaf1ec;
         }

         /* IMAGE SIDE */
         .about-images {
           position: relative;
         }

         .about-images img {
           width: 100%;
           height: 100%;
           object-fit: cover;
           border-radius: 30px;
         }

         .img-big {
           height: 500px;
         }

         .img-top {
           height: 238px;
         }

         .img-bottom {
           height: 238px;
         }

         .exp-circle {
           position: absolute;
           top: 50%;
           left: 55%;
           transform: translate(-50%, -50%);
           width: 150px;
           height: 150px;
           background: #0f2e2b;
           border-radius: 50%;
           border: 12px solid #eaf1ec;
           color: #fff;
           display: flex;
           flex-direction: column;
           justify-content: center;
           align-items: center;
           text-align: center;
         }

         .exp-circle h3 {
           font-size: 38px;
           margin: 0;
         }

         .exp-circle span {
           font-size: 12px;
           letter-spacing: 1px;
         }

         blockquote {
           margin: 30px 0;
           font-style: italic;
           color: #333;
           max-width: 520px;
         }

         .doctor-info {
           display: flex;
           align-items: center;
           gap: 14px;
           margin-bottom: 30px;
         }

         .doctor-info img {
           width: 48px;
           height: 48px;
           border-radius: 50%;
         }

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

           .img-top,
           .img-bottom {
             display: none;
           }

           .exp-circle {
             position: absolute;
             transform: none;
             left: 0;
             top: 60%;
           }

           .about-content h2 {
             font-size: 30px;
           }
         }


         /* =============================================== */
         /* =============================================== */

         /* Hero-slider Css   */
         .slider-img {
           height: 70vh;
           object-fit: cover;
         }

         .carousel-overlay {
           position: absolute;
           top: 0;
           left: 0;
           width: 100%;
           height: 100%;
           background: rgba(0, 0, 0, 0.25);
           display: flex;
           align-items: center;
           justify-content: center;
           text-align: center;
           z-index: 5;
         }

         .carousel-overlay h1 {
           color: #fff;
           font-size: 40px;
           font-weight: bold;
         }

         .breadcrumb-text {
           color: #fff;
           font-size: 18px;
         }

         .breadcrumb-text a {
           color: #fff;
         }

         /* =============================================== */
         /* =============================================== */

         /* Services Cards CSS start */
         /* MAIN WRAPPER */
         .destinations-section {
           font-family: 'Inter', sans-serif;
         }

         /* CARD */
         .dest-card a{
          text-decoration: none;
          color: var(--accent);
         }
         .dest-card {
           background: #fff;
           border: 2px solid #ededed;
           border-radius: 22px;
           padding: 15px 15px 25px;
           overflow: hidden;
           position: relative;
           transition: .35s ease;
           cursor: pointer;
         }

         .dest-card:hover {
           border-color: var(--primary);
           box-shadow: 0px 12px 30px rgba(0, 0, 0, 0.12);
         }

         /* IMAGE */
         .dest-img {
           height: 260px;
           overflow: hidden;
           border-radius: 18px;
         }

         .dest-img img {
           width: 100%;
           height: 100%;
           object-fit: cover;
           transition: .45s ease;
         }

         .dest-card:hover .dest-img img {
           transform: scale(1.1) translateY(-6px);
           filter: brightness(0.9);
         }

         /* TEXT */
         .dest-card .title {
           font-size: 22px;
           font-weight: 700;
           margin-top: 15px;
           transition: .3s;
         }

         .dest-card:hover .title {
           color: var(--primary);
         }

         .dest-card .sub {
           color: #777;
           margin-top: 4px;
         }

         /* ARROW BOX */
         .arrow-box {
           width: 40px;
           height: 40px;
           border: 2px solid var(--primary);
           border-radius: 50%;
           display: flex;
           justify-content: center;
           align-items: center;
           font-size: 18px;
           color: var(--primary);
           transition: .3s;
         }

         .dest-card:hover .arrow-box {
           background: var(--primary);
           color: #fff;
           transform: rotate(45deg);
         }

         .package-card:hover .arrow-box {
           background: var(--primary);
           color: #fff;
           transform: rotate(45deg);
         }

         /* =============================================== */
         /* =============================================== */

         /* Blogs Cards CSS */
         /* CARD */
         .package-card a{
text-decoration: none;
color: var(--accent);
         }
         .package-card {
           background: #fff;
           border-radius: 20px;
           overflow: hidden;
           border: 2px solid #eee;
           transition: 0.4s;
         }

         .package-card:hover {
           border-color: var(--primary);
           box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
         }

         /* IMAGE */
         .card-img {
           position: relative;
           overflow: hidden;
         }

         .card-img img {
           width: 100%;
           height: 260px;
           object-fit: cover;
           border-bottom: 1px solid #eee;
           transition: transform 0.5s ease;
         }

         /* IMAGE PUSH BACK */
         .package-card:hover .card-img img {
           transform: scale(1.08);
         }

         /* TITLE COLOR CHANGE */
         .package-card:hover h5 {
           color: var(--primary);
         }

         @media (max-width: 600px) {
           .card-img img {
             height: 220px;
           }
         }

         /* ============================================= */
         /* ============================================= */

         /* mission / vision css  */
         .fold-card {
           background: #ffffff;
           border-radius: 28px;
           padding: 40px;
           position: relative;
           overflow: hidden;
           height: 100%;
           transition: transform .35s ease;
         }

         .fold-card:hover {
           transform: translateY(-6px);
         }

         /* Folded background */
         .fold-card::before {
           content: "";
           position: absolute;
           inset: 0;
           background: var(--primary);
           transform: scaleY(0);
           transform-origin: bottom;
           transition: transform .55s ease;
           z-index: 0;
           border-radius: 28px;
         }

         .fold-card:hover::before {
           transform: scaleY(1);
         }

         /* Soft paper highlight */
         .fold-card::after {
           content: "";
           position: absolute;
           inset: 0;
           background: linear-gradient(180deg,
               rgba(255, 255, 255, .25),
               rgba(0, 0, 0, .08));
           opacity: 0;
           transition: opacity .45s ease;
           z-index: 1;
         }

         .fold-card:hover::after {
           opacity: 1;
         }

         /* Content */
         .fold-card * {
           position: relative;
           z-index: 2;
         }

         .icon-box {
           width: 54px;
           height: 54px;
           border-radius: 14px;
           background: #e6f2ef;
           display: flex;
           align-items: center;
           justify-content: center;
           font-size: 24px;
           color: var(--primary);
           margin-bottom: 20px;
           transition: all .45s ease;
         }

         .fold-card h4 {
           transition: color .45s ease;
         }

         .fold-card p {
           transition: color .45s ease;
         }

         /* Hover text & icon */
         .fold-card:hover h4,
         .fold-card:hover p {
           color: #ffffff;
         }

         .fold-card:hover .icon-box {
           background: #ffffff;
           color: var(--primary);
         }

         /* CTA BOX */
         .cta-box {
           background: #ffffff;
           border-radius: 30px;
           padding: 40px;
           /* margin-top: 50px; */
           display: flex;
           justify-content: space-between;
           align-items: center;
           flex-wrap: wrap;
         }

         /* Responsive */
         @media (max-width: 768px) {
           .section-title {
             font-size: 34px;
           }
         }

         /* =============================================== */
         /* =============================================== */

         /* marque css  */
         .info-ticker {
           background: #eaf1ec;
           overflow: hidden;
           white-space: nowrap;
           padding: 14px 0;
         }

         .ticker-track {
           display: inline-flex;
           gap: 50px;
           animation: scrollTicker 30s linear infinite;
         }

         .ticker-track span {
           font-size: 17px;
           font-weight: 500;
           color: #0f3f3c;
           display: flex;
           align-items: center;
         }

         .info-ticker:hover .ticker-track {
           animation-play-state: paused;
         }

         /* Smooth infinite scroll */
         @keyframes scrollTicker {
           from {
             transform: translateX(0);
           }

           to {
             transform: translateX(-50%);
           }
         }

         /* Mobile */
         @media (max-width: 768px) {
           .ticker-track span {
             font-size: 15px;
           }
         }

         /* ================================================== */
         /* ================================================== */

         /* therapy process css / */
         .therapy-process {
           background: #eaf1ec;
           ;
         }

         /* Wrapper */
         .process-wrapper {
           margin-top: 80px;
         }

         /* SVG path */
         .process-path {
           position: absolute;
           top: 0;
           left: 0;
           width: 100%;
           height: 200px;
           z-index: 0;
         }

         /* Steps */
         .process-step {
           position: relative;
           z-index: 2;
         }

         .step-1 {
           margin-top: 40px;
         }

         .step-2 {
           margin-top: -3px;
         }

         .step-3 {
           margin-top: 40px;
         }

         /* Circle */
         .step-circle {
           width: 120px;
           height: 120px;
           border: 2px dashed var(--primary);
           border-radius: 50%;
           margin: auto;
           display: flex;
           align-items: center;
           justify-content: center;
           position: relative;
           background: #fff;
         }

         .step-circle img {
           width: 40px;
           /* filter: invert(23%) sepia(92%) saturate(3200%) hue-rotate(220deg); */
         }

         /* Number */
         .step-number {
           position: absolute;
           top: -12px;
           left: -12px;
           width: 34px;
           height: 34px;
           border-radius: 50%;
           background: #fff;
           border: 2px solid var(--primary);
           display: flex;
           align-items: center;
           justify-content: center;
           font-size: 14px;
           font-weight: 600;
         }

         /* Mobile */
         @media (max-width: 991px) {
           .process-path {
             display: none;
           }

           .process-step {
             margin-top: 40px !important;
           }

           .process-title {
             font-size: 30px;
           }
         }

         /* ============================================ */
         /* =============================================== */

         /* testimonial css  */
         /* Section with moving background */
         .testimonial-section {
           position: relative;
           padding: 100px 0;
           background: url("{{ asset('front_assets/images/testimonial-bg.svg') }}") center/cover no-repeat;
           background-attachment: fixed;
           overflow: hidden;
         }

         /* Overlay */
         .testimonial-section::before {
           content: "";
           position: absolute;
           inset: 0;
           background: rgba(51, 169, 177, 0.15);
           /* #33a9b1 transparent */
           z-index: 1;
         }

         /* Content above overlay */
         .testimonial-section .container {
           position: relative;
           z-index: 2;
         }

         .section-title {
           font-size: 44px;
           font-weight: 700;
           color: #143c2f;
         }

         .section-title span {
           color: #7fb7a3;
         }

         /* Card */
         .testimonial-card {
           background: #ffffff;
           border-radius: 25px;
           padding: 35px;
           height: 100%;
         }

         .stars {
           color: #f4a100;
           font-size: 18px;
           margin-bottom: 15px;
         }

         .testimonial-card p {
           font-size: 15px;
           color: #5f7a73;
           line-height: 1.7;
         }

         /* Client */
         .client {
           display: flex;
           align-items: center;
           margin-top: 25px;
         }

         .client img {
           width: 48px;
           height: 48px;
           border-radius: 50%;
           margin-right: 12px;
         }

         .client h6 {
           margin: 0;
           font-weight: 600;
         }

         .client span {
           font-size: 14px;
           color: #7a9a91;
         }

         /* Swiper dots */
         .swiper-pagination-bullet {
           background: #7fb7a3;
           opacity: .4;
         }

         .swiper-pagination-bullet-active {
           opacity: 1;
         }

         /* Responsive */
         @media (max-width: 768px) {
           .section-title {
             font-size: 32px;
           }
         }

         /* =============================================== */
         /* =============================================== */

         /* popup form css  */
         .popup-form {
           display: none;
           position: fixed;
           top: 0;
           left: 0;
           width: 100%;
           height: 100%;
           background: rgba(0, 0, 0, 0.7);
           z-index: 99999;
         }

         .popup-content {
           background: var(--primary);
           padding: 30px;
           border-radius: 10px;
           width: 90%;
           max-width: 500px;
           position: fixed;
           top: 50%;
           left: 50%;
           transform: translate(-50%, -50%);
           animation: popupZoom 0.3s ease;
           color: #fff;
         }

         .popup-content h2 {
           font-family: 'Playfair Display', serif;
         }

         .popup-content label {
           display: block;
           margin-top: 5px;
           margin-bottom: 5px;
           font-size: 14px;
           font-weight: 500;
           color: var(--accent);
         }

         .popup-content input,
         .popup-content select,
         .popup-content textarea {
           width: 100%;
           padding: 7px;
           border: none;
           border-radius: 5px;
           margin-bottom: 2px;
           font-size: 14px;
         }

         .popup-content textarea {
           resize: none;
         }


         /* Animation */
         @keyframes popupZoom {
           0% {
             transform: translate(-50%, -50%) scale(0.5);
             opacity: 0;
           }

           100% {
             transform: translate(-50%, -50%) scale(1);
             opacity: 1;
           }
         }

         /* =======================================================/ */
         /* ======================================================= */