


:root {
            /* Primary Colors */
            --deep-brown: #4E342E; /* #5D4037; */
            --terracotta: #A86B55;
            --soft-beige: #F5F0E6;
			--burnt-orange: #E97451;
            
            /* Accent Colors */
            --muted-gold: #D4B483;
            --sage-green: #7D8C75;
            --cerise-pink: #B5446E;
            
            /* Font Families */
            --header-font: 'Playfair Display', serif;
            --body-font: 'Poppins', sans-serif;
        }
		
		/* Page-specific hero background overrides */
		body.home .hero {
		/*ackground-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_home.png');*/
		}
		body.about .hero {
		background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_about.png');
		}
		body.bookings .hero {
			background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_treatments.png');
		}
		body.retreat .hero {
			background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_retreat.png');
		}
		body.corporate .hero {
		background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_corporate.png');
		}
		body.specials .hero {
			background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_specials.png');
		}
		body.blog .hero {
			background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_blog.png');
		}
		body.contact .hero {
			background-image: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url('../images/hero_contact.png');
		}
        
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        body {
            font-family: var(--body-font);
            color: var(--deep-brown);
            background-color: white;
            line-height: 1.6;
        }
        
        h1, h2, h3, h4, h5, h6 {
            font-family: var(--header-font);
            font-weight: 600;
            color: var(--deep-brown);
            margin-bottom: 1rem;
        }
        
        h1 {
            font-size: 2.5rem;
        }
        
        h2 {
            font-size: 2rem;
            position: relative;
            padding-bottom: 0.5rem;
        }
        
        h2::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: 0;
            width: 80px;
            height: 3px;
            background-color: var(--cerise-pink);
        }
        
        h3 {
            font-size: 1.5rem;
        }
        
        p {
            margin-bottom: 1rem;
        }
        
        a {
            color: var(--cerise-pink);
            text-decoration: none;
            transition: color 0.3s ease;
        }
        
        a:hover {
            color: var(--terracotta);
        }
        
        .container {
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 1rem;
        }
        
        .btn {
            display: inline-block;
            background-color: var(--cerise-pink);
            color: white;
            padding: 0.8rem 1.5rem;
            border-radius: 30px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 1px;
            transition: all 0.3s ease;
            border: none;
            cursor: pointer;
        }
        
        .btn:hover {
            background-color: var(--deep-brown);
            color: white;
            transform: translateY(-2px);
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }
        
        .btn-secondary {
            background-color: var(--cerise-pink);
            color: var(--cerise-pink);
            border: 2px solid var(--cerise-pink);
        }
        
        .btn-secondary:hover {
            background-color: var(--cerise-pink);
            color: white;
        }
		
		/*Indenting Bullets*/
		ul {
			margin-left: 1.5rem; /* Indent the entire list */
		}
		
		.custom-link {
		  text-decoration: none;   /* Removes underline */
		  color: inherit;          /* Inherits color from parent or use a specific color */
		  cursor: pointer;         /* Optional: makes it feel clickable */
		}

		/* Optional: on hover, make it subtly styled */
		.custom-link:hover {
		  text-decoration: none;
		  color: #a15700;  /* Example: terracotta or brand-aligned */
		}

        
        /* Header Styles */
        .header {
            background-color: var(--sage-green);
			color: white;
            /*box-shadow: 0 2px 10px rgba(0,0,0,0.1);*/
            position: fixed;
            width: 100%;
            z-index: 1000;
			transition: all 0.3s ease;
        }
        
        .header-container {
            display: grid;
			grid-template-columns: 1fr auto 1fr;
			align-items: center;
			padding: 1rem;
			position: relative;
		}
        
        .logo {
            justify-self: start;
			height: 50px;
        }
		
		.logo img {
			height: 100%;
			width: auto;
		}
		
		.nav-wrapper {
			justify-self: center;
		}
        
        .nav-menu {
			display: flex;
			list-style: none;
			gap: 2rem;
		}

		.nav-menu li a {
			color: var(--deep-brown);
			font-weight: 500;
			position: relative;
		}

		.nav-menu li a::after {
			content: '';
			position: absolute;
			width: 0;
			height: 2px;
			bottom: -5px;
			left: 0;
			background-color: var(--cerise-pink);
			transition: width 0.3s ease;
		}

		.nav-menu li a:hover::after,
		.nav-menu li a.active::after {
			width: 100%;
		}

		.nav-menu li a.active {
			color: var(--cerise-pink);
		} 
		
	
		
		.header-cta {
			justify-self: end;
			grid-column: 3; /* Ensure it stays in the third column */
		}


        .mobile-menu-btn {
            display: none;
            background: none;
            border: none;
            font-size: 1.5rem;
            cursor: pointer;
            color: var(--deep-brown);
        }
		
		/* Keep the header CTA visible on small screens */
		@media (max-width: 768px) {
		  .header-cta { display: block !important; position: relative; z-index: 1001; }
		  .header-cta .btn { padding: .3rem .65rem; font-size: .85rem; }
		}
		
		/* HERO SECTION */
		
		/* Neutralize page-specific hero image when we’re using a video */
		body.home .hero.hero-video {
		  background-image: none !important;
		}

		/* Base hero stays full-viewport with centered content */
		.hero {
		  position: relative;
		  height: 100vh;
		  background-size: cover;
		  background-position: center;
		  display: flex;
		  align-items: center;
		  justify-content: center; /* center horizontally too */
		  text-align: center;
		  color: white;
		  padding-top: 80px; /* keeps content clear of fixed header */
		  overflow: hidden;  /* ensures no overflow on mobile safe areas */
		}

		/* Video fills the section */
		.hero-video .hero-video-media {
		  position: absolute;
		  inset: 0;               /* top:0;right:0;bottom:0;left:0 */
		  width: 100%;
		  height: 100%;
		  object-fit: cover;      /* preserves aspect ratio, crops as needed */
		  z-index: 1;
		}

		/* Optional dark scrim for legibility over busy footage */
		.hero-video .hero-scrim {
		  position: absolute;
		  inset: 0;
		  background: linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.35));
		  z-index: 2;
		}

		/* Text sits above video and scrim */
		.hero-video .hero-content {
		  position: relative;
		  z-index: 3;
		  max-width: 1000px;
		  margin: 0 auto;
		  padding: 2rem;
		}

		/* Preserve your typography scale */
		.hero h1 {
		  font-size: 3.5rem;
		  margin-bottom: 1rem;
		  color: #fff;
		}
		.hero p {
		  font-size: 1.2rem;
		  margin-bottom: 2rem;
		}

		/* Mobile adjustments */
		@media (max-width: 768px) {
		  .hero {
			padding-top: 100px; /* fixed header often taller on mobile */
		  }
		  .hero h1 { font-size: 2.4rem; }
		  .hero p  { font-size: 1rem; }
		}

		/* Respect users who prefer reduced motion */
		@media (prefers-reduced-motion: reduce) {
		  .hero-video .hero-video-media {
			animation: none;
		  }
		  .hero-video .hero-video-media[autoplay] {
			/* Pause the video if you want to fully honor reduced motion */
			/* Most browsers won't auto-pause a background video via CSS, but this signals intent */
		  }
		}
        
        /* Section Styles */
        section {
            padding: 5rem 0;
        }
        
        .section-title {
            text-align: center;
            margin-bottom: 3rem;
        }
        
        .section-title h2 {
            display: inline-block;
        }
        
        .section-title h2::after {
            left: 50%;
            transform: translateX(-50%);
            width: 100px;
        }
		
		/* Content Sections */
		.content-section {
			background-color: var(--soft-beige);
			padding: 4rem 0;
		}

		.alternate-section {
			background-color: white;
		}

		/* Index Main Section - Card */
		/* Cards */
		.card {
		  position: relative; /* Make the card the positioned parent */
		  display: flex;
		  flex-direction: column; /* Stack content vertically */
		  justify-content: space-between;
		  align-items: flex-start;
		  padding: 1rem;
		  margin: 10px auto;
		  border-radius: 30px;
		  border: 1px solid var(--muted-gold);
		  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
		  /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); Optional: Shadow for styling */
		  background-color: #fff; /* Background color */
		  height: 300px; /* Fixed height to maintain card consistency */
		}

		.card-content {
		  flex: 1; /* Allow content to take up available space */
		}

		.card-image {
		  position: absolute; /* Position image inside the card */
		  bottom: 10px; /* 10px from the bottom */
		  right: 10px; /* 10px from the right */
		  z-index: 1; /* Ensure the image stays above content */
		}

		.card-image img {
		  width: 80px; /* Fixed size for the image */
		  height: 100px; /* Maintain the aspect ratio */
		  border-radius: 50%; /* Make the image circular */
		  object-fit: cover; /* Ensures the image covers the box without stretching */
		}

		.card:hover {
			transform: translateY(-5px);
			box-shadow: 0 8px 24px rgba(0,0,0,0.12);
		}
		

		.card:hover .card-image img {
			transform: scale(1.05);
		}

		/*.card-content {
			flex: 1;
			padding: 1.5rem;
		}*/

		.card-title {
			color: var(--deep-brown);
			margin-bottom: 0.5rem;
			
        }
		
        /* Introduction Section */
        .intro {
            background-color: white;
        }
        
        .intro-content {
            display: flex;
            align-items: center;
            gap: 2rem;
        }
        
        .intro-text {
            flex: 1;
        }
        
        .intro-image {
            flex: 1;
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        }
        
        .intro-image img {
            width: 100%;
            height: auto;
            display: block;
        }
		
		.centered-section {
		  display: flex;
		  justify-content: center;   /* Horizontal */
		  align-items: center;       /* Vertical */
		  min-height: 70vh;         /* Full viewport height */
		}
        
		/*About Page and Sections */
		/* Philosophy Section */
		.philosophy-section {
		  display: flex;
		  flex-wrap: wrap;
		  justify-content: center;
		  align-items: flex-start;
		  gap: 100px;
		  padding: 30px 20px;
		  margin: 10px auto;
		  border-radius: 30px;
		  border: 1px solid var(--muted-gold);
		  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
		  background-color: #f9f5f0; /* soft beige */
		}

		.philosophy-column {
		  flex: 1 1 45%;
		  max-width: 600px;
		  font-family: 'Georgia', serif;
		  color: #4b2e1e; /* deep brown */
		}

		.philosophy-quote {
		  font-size: 1.4rem;
		  font-style: italic;
		  line-height: 1.6;
		  color: #6a4e42; /* earthy tone */
		  margin-bottom: 20px;
		  border-left: 4px solid #bc6c25; /* burnt orange */
		  padding-left: 20px;
		}

		.philosophy-text {
		  flex: 1 1 500px;
		  max-width: 500px;
		  font-family: var(--body-font);
		  font-size: 1.05rem;
		  line-height: 1.8;
		  justify-content: center;
		  color: var(--deep-brown);
		}
		
		.ethos-section {
		  background-color: white;
		  padding: 30px 20px;
		  margin: 0px auto;
		  border-radius: 30px;
		  border: 1px solid var(--muted-gold);
		  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
		}

		.ethos-content {
		  display: flex;
		  flex-wrap: wrap;
		  justify-content: center;
		  gap: 50px;
		  align-items: flex-start;
		}

		.ethos-text {
		  flex: 1 1 500px;
		  max-width: 500px;
		  font-family: var(--body-font);
		  font-size: 1.05rem;
		  line-height: 1.8;
		  justify-content: center;
		  color: var(--deep-brown);
		}

		.ethos-text p {
		  margin-bottom: 1.2rem;
		}

		.ethos-highlight {
		  color: var(--cerise-pink);
		  font-weight: 600;
		}

		.ethos-image {
		  flex: 1 1 400px;
		  max-width: 350px;
		}

		.ethos-image img {
		  width: 100%;
		  border-radius: 12px;
		  box-shadow: 0 6px 18px rgba(0,0,0,0.1);
		}
		
		/*Meet the Team Section */
		.team-section {
		  display: flex;
		  flex-direction: column;
		  align-items: center;
		  justify-content: center;
		  text-align: center;
		}
		
		/* Rounded gold border utility (already used) */
		.rounded-gold {
		  border: 1px solid var(--muted-gold);
		  border-radius: 20px;
		  padding: 2rem;
		  background-color: var(--soft-beige);
		  margin-bottom: 3rem;
		}

		/* Team Grid Layout */
		.team-grid {
		  display: grid;
		  /*grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));*/
		  grid-template-columns: repeat(3, 1fr);
		  gap: 1rem;
		  margin-top: 2rem;
		}

		/* Team Member Card */
		.team-member {
		  text-align: center;
		  background-color: white;
		  border-radius: 15px;
		  padding: 1rem;
		  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
		  transition: transform 0.3s ease;
		}
		
		/* Responsive Breakpoints */
		@media (max-width: 992px) {
		  .team-grid {
			grid-template-columns: repeat(2, 1fr);
		  }
		}

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

		.team-member:hover {
		  transform: translateY(-5px);
		}

		.team-member img {
		  width: 100%;
		  max-width: 180px;
		  height: auto;
		  border-radius: 50%;
		  margin-bottom: 1rem;
		  border: 3px solid var(--sage-green);
		}

		.team-member h3 {
		  margin-bottom: 0.3rem;
		  font-size: 1.2rem;
		  color: var(--deep-brown);
		}
		
		.healing-spaces {
		  margin: 4rem auto;
		  background-color: var(--soft-beige);
		  padding: 2rem;
		  border-radius: 20px;
		  border: 1px solid var(--muted-gold);
		  text-align: center;
		}

		.healing-spaces h2 {
		  color: var(--deep-brown);
		  margin-bottom: 0.5rem;
		}

		.healing-spaces .intro {
		  font-style: italic;
		  color: var(--terracotta);
		  margin-bottom: 1.5rem;
		}

		.carousel {
		  position: relative;
		  overflow: hidden;
		}

		.carousel-track {
		  display: flex;
		  gap: 1rem;
		  overflow-x: auto;
		  scroll-behavior: smooth;
		  padding-bottom: 1rem;
		}

		.carousel-track img {
		  flex: 0 0 auto;
		  width: 450px;
		  height: 300px;
		  object-fit: cover;
		  border-radius: 15px;
		  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
		}

		.carousel-btn {
		  position: absolute;
		  top: 50%;
		  transform: translateY(-50%);
		  background-color: var(--muted-gold);
		  border: none;
		  border-radius: 50%;
		  width: 40px;
		  height: 40px;
		  font-size: 1.5rem;
		  color: white;
		  cursor: pointer;
		  z-index: 2;
		  transition: background-color 0.3s;
		}

		.carousel-btn:hover {
		  background-color: var(--deep-brown);
		}

		.carousel-btn.prev {
		  left: 10px;
		}

		.carousel-btn.next {
		  right: 10px;
		}
		
		/* Fade-in animation */
		@keyframes fadeInUp {
		  from {
			opacity: 0;
			transform: translateY(40px);
		  }
		  to {
			opacity: 1;
			transform: translateY(0);
		  }
		}

		.call-to-action {
		  background-color: var(--sage-green);
		  padding: 4rem 2rem;
		  border-radius: 20px;
		  margin: 4rem auto;
		  text-align: center;
		  color: white;
		  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
		  position: relative;
		  overflow: hidden;
		  animation: fadeInUp 1.5s ease-out;
		}

		/* Decorative leaf-like shapes */
		.call-to-action::before,
		.call-to-action::after {
		  content: '';
		  position: absolute;
		  width: 150px;
		  height: 150px;
		  background: url('../images/leaf-decor.png') no-repeat center center / contain;
		  opacity: 0.1;
		  animation: floatLeaf 10s infinite ease-in-out;
		  z-index: 0;
		}

		.call-to-action::before {
		  top: -40px;
		  left: -30px;
		}

		.call-to-action::after {
		  bottom: -40px;
		  right: -30px;
		  animation-delay: 5s;
		}

		/* Floating animation for background decor */
		/* Leaf Animation Container */
		.leaf-container {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			overflow: hidden;
			pointer-events: none;
			z-index: 0;
		}

		.leaf {
			position: absolute;
			width: 50px;
			height: 50px;
			background-image: url('../images/leaf-decor.png');
			background-size: contain;
			background-repeat: no-repeat;
			opacity: 0.6;
		}

		/* Keyframes for Floating Motion */
		@keyframes floatLeaf {
			0% {
				transform: translateY(0) rotate(0deg);
				opacity: 0;
			}
			50% {
				opacity: 0.8;
			}
			100% {
				transform: translateY(100vh) rotate(360deg);
				opacity: 0;
			}
		}
		@keyframes floatLeaf1 {
		  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 0; }
		  50% { opacity: 0.7; }
		  100% { transform: translate(-30vw, 100vh) rotate(360deg) scale(1.2); opacity: 0; }
		}

		@keyframes floatLeaf2 {
		  0% { transform: translate(0, 0) rotate(0deg) scale(0.9); opacity: 0; }
		  50% { opacity: 0.7; }
		  100% { transform: translate(20vw, 100vh) rotate(-360deg) scale(1.1); opacity: 0; }
		}

		@keyframes floatLeaf3 {
		  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 0; }
		  50% { opacity: 0.7; }
		  100% { transform: translate(-10vw, 100vh) rotate(720deg) scale(1.3); opacity: 0; }
		}

		/* CTA content */
		.cta-content {
		  position: relative;
		  z-index: 1;
		}

		.cta-content h2 {
		  font-family: var(--header-font);
		  font-size: 2.2rem;
		  margin-bottom: 1rem;
		  color: white;
		}

		.cta-content p {
		  font-size: 1.1rem;
		  max-width: 800px;
		  margin: 0 auto 2rem auto;
		  color: #f5f0e6;
		  line-height: 1.7;
		}
		
		.cta-list {
		  list-style: none;
		  padding: 0;
		  margin: 1rem 0 2rem;
		}
		.cta-list li {
		  margin: 0.5rem 0;
		}

		.call-to-action .btn {
		  background-color: var(--cerise-pink);
		  color: white;
		  padding: 1rem 2rem;
		  border-radius: 30px;
		  font-weight: 600;
		  font-size: 1rem;
		  transition: all 0.3s ease;
		  text-transform: uppercase;
		}

		.call-to-action .btn:hover {
		  background-color: var(--deep-brown);
		  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
		}

		/* Mobile responsiveness */
		@media (max-width: 768px) {
		  .call-to-action {
			padding: 3rem 1rem;
		  }

		  .cta-content h2 {
			font-size: 1.8rem;
		  }

		  .cta-content p {
			font-size: 1rem;
		  }
		}
		
        /* Retreat Experience Section */
        .experience {
            background-color: var(--soft-beige);
        }
        
        .experience-content {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 2rem;
        }
        
        .experience-card {
            background-color: white;
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            transition: transform 0.3s ease;
        }
        
        .experience-card:hover {
            transform: translateY(-5px);
        }
        
        .experience-card img {
            width: 100%;
            height: 250px;
            object-fit: cover;
        }
        
        .experience-card-content {
            padding: 1.5rem;
        }
        
        /* Programs Section */
        .programs {
            background-color: white;
        }
        
        .program-cards {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
        }
        
        .program-card {
            background-color: var(--soft-beige);
            border-radius: 10px;
            padding: 2rem;
            text-align: center;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            transition: transform 0.3s ease;
        }
        
        .program-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0,0,0,0.1);
        }
        
        .program-card h3 {
            color: var(--terracotta);
        }
        
        .program-price {
            font-size: 1.8rem;
            font-weight: 700;
            color: var(--deep-brown);
            margin: 1rem 0;
        }
        
        .program-price span {
            font-size: 1rem;
            font-weight: 400;
        }
        
        .program-features {
            list-style: none;
            margin-bottom: 1.5rem;
        }
        
        .program-features li {
            margin-bottom: 0.5rem;
            position: relative;
            padding-left: 1.5rem;
        }
        
        .program-features li::before {
            content: '✓';
            position: absolute;
            left: 0;
            color: var(--sage-green);
        }
        
        /* Activities Section */
        .activities {
            background-color: var(--soft-beige);
        }
        
        .activities-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
        }
        
        .activity-card {
            background-color: white;
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            transition: all 0.3s ease;
        }
        
        .activity-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0,0,0,0.1);
        }
        
        .activity-icon {
            height: 80px;
            width: 80px;
            margin: 0 auto;
            background-color: var(--soft-beige);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-top: 0px;
            margin-bottom: 1rem;
            border: 5px solid white;
            color: var(--terracotta);
            font-size: 2rem;
        }
        
        .activity-content {
            padding: 1.5rem;
            text-align: center;
        }
        
        /* Treatments Section */
        .treatments {
            background-color: white;
            padding: 5rem 0;
        }
        
        .treatments-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1.5rem;
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 1rem;
        }
        
        .treatment-item {
            position: relative;
            overflow: hidden;
            border-radius: 8px;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            aspect-ratio: 16/9;
            cursor: pointer;
        }
        
        .treatment-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }
        
        .treatment-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(93, 64, 55, 0.8);
            color: white;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 1.5rem;
            text-align: center;
            opacity: 0;
            transition: opacity 0.5s ease;
        }
        
        .treatment-item:hover .treatment-overlay {
            opacity: 1;
        }
        
        .treatment-item:hover .treatment-image {
            transform: scale(1.1);
        }
        
        .treatment-title {
            font-family: var(--header-font);
            font-size: 1.5rem;
            font-weight: 600;
            margin-bottom: 0.5rem;
            color: white;
        }
        
        .treatment-description {
            font-size: 0.9rem;
            line-height: 1.4;
        }
        
        /* Testimonials Section */
        .testimonials {
            background-color: var(--soft-beige);
            text-align: center;
        }
        
        .testimonial-card {
            background-color: white;
            border-radius: 10px;
            padding: 2rem;
            margin: 0 auto;
            max-width: 800px;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
        }
        
        .testimonial-text {
            font-style: italic;
            margin-bottom: 1.5rem;
            position: relative;
        }
        
        .testimonial-text::before,
        .testimonial-text::after {
            content: '"';
            font-size: 2rem;
            color: var(--muted-gold);
        }
        
        .testimonial-author {
            font-weight: 600;
            color: var(--terracotta);
        }
        
        /* Why Choose Us Section */
        .why-us {
            background-color: white;
        }
        
        .why-us-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 2rem;
        }
        
        .why-us-item {
            display: flex;
            gap: 1rem;
            align-items: flex-start;
        }
        
        .why-us-icon {
            background-color: var(--soft-beige);
            color: var(--terracotta);
            width: 50px;
            height: 50px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            flex-shrink: 0;
        }
        
        /* Booking Section */
        .booking {
            background-color: var(--soft-beige);
        }
        
        .booking-content {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 2rem;
        }
        
        .booking-form {
            background-color: white;
            border-radius: 10px;
            padding: 2rem;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
        }
        
        .form-group {
            margin-bottom: 1.5rem;
        }
        
        .form-group label {
            display: block;
            margin-bottom: 0.5rem;
            font-weight: 500;
        }
        
        .form-group input,
        .form-group select,
        .form-group textarea {
            width: 100%;
            padding: 0.8rem;
            border: 1px solid #ddd;
            border-radius: 5px;
            font-family: var(--body-font);
        }
        
        .form-group textarea {
            height: 120px;
            resize: vertical;
        }
        
        .booking-info {
            background-color: var(--deep-brown);
            color: white;
            border-radius: 10px;
            padding: 2rem;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
        }
        
        .booking-info h3 {
            color: white;
        }
        
        .booking-info-item {
            margin-bottom: 1.5rem;
        }
        
        .booking-info-item h4 {
            color: var(--muted-gold);
            margin-bottom: 0.5rem;
        }
		
		/*Corporate wellness page*/
		.problem-statement {
		  background-color: var(--soft-beige);
		  padding: 4rem 2rem;
		  text-align: center;
		  border: 1px solid var(--muted-gold);
		  border-radius: 30px;
		  margin-top: 3rem;
		  margin-bottom: 3rem;
		}

		.problem-statement h2 {
		  color: var(--burnt-orange);
		  margin-bottom: 2rem;
		}

		.problem-statement .lead {
		  font-size: 1.2rem;
		  color: var(--deep-brown);
		  margin-bottom: 2rem;
		  max-width: 800px;
		  margin-left: auto;
		  margin-right: auto;
		}

		.problem-list {
		  display: grid;
		  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
		  gap: 2rem;
		  margin-bottom: 2rem;
		}

		.problem h3 {
		  color: var(--cerise-pink);
		  margin-bottom: 0.5rem;
		  font-size: 1.1rem;
		}

		.problem p {
		  font-size: 0.95rem;
		  color: var(--deep-brown);
		}

		.problem-statement .cta {
		  font-weight: 500;
		  font-size: 1.1rem;
		  color: var(--sage-green);
		  margin-top: 2rem;
		}
		
		.offerings {
		  padding: 4rem 0;
		  text-align: center;
		}

		.section-intro {
		  max-width: 800px;
		  margin: 0 auto 2.5rem;
		  font-size: 1.1rem;
		  color: var(--deep-brown);
		}

		.offering-grid {
		  display: grid;
		  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		  gap: 2rem;
		}

		.offering-card {
		  background-color: white;
		  border: 1px solid var(--muted-gold);
		  border-radius: 15px;
		  padding: 1rem;
		  text-align: left;
		  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
		  transition: transform 0.3s ease;
		}

		.offering-card:hover {
		  transform: translateY(-5px);
		}

		.offering-card img {
		  width: 100%;
		  border-radius: 12px;
		  margin-bottom: 1rem;
		}

		.offering-card h3 {
		  color: var(--deep-brown);
		  font-size: 1.4rem;
		  margin-bottom: 0.5rem;
		}

		.offering-card ul {
		  margin-top: 1rem;
		  list-style: none;
		  padding-left: 0;
		}

		.offering-card ul li {
		  margin-bottom: 0.5rem;
		  color: var(--sage-green);
		  font-weight: 500;
		}
		
		/*corporate testimonials*/
		.trust-section {
		  text-align: center;
		  padding: 4rem 1rem;
		  background-color: var(--soft-beige);
		  border-top: 2px solid var(--muted-gold);
		  border-bottom: 2px solid var(--muted-gold);
		  border-radius: 20px;
		  margin-bottom: 3rem;
		}

		.trust-section h2 {
		  color: var(--deep-brown);
		}

		.section-intro {
		  font-family: var(--body-font);
		  color: var(--deep-brown);
		  max-width: 800px;
		  margin: 1rem auto 2rem auto;
		}

		.testimonial-carousel {
		  display: flex;
		  flex-direction: column;
		  gap: 2rem;
		}

		.testimonial-carousel blockquote {
		  font-style: italic;
		  background-color: white;
		  padding: 1.5rem;
		  border-left: 5px solid var(--cerise-pink);
		  border-radius: 10px;
		  max-width: 900px;
		  margin: 0 auto;
		  box-shadow: 0 4px 6px rgba(0,0,0,0.05);
		}

		.testimonial-carousel cite {
		  display: block;
		  margin-top: 1rem;
		  font-style: normal;
		  font-weight: bold;
		  color: var(--terracotta);
		}
		
		/* Contact us page */
		
		.contact-info {
		  background-color: #fefdf9;
		  padding: 3rem 1rem;
		  text-align: center;
		}

		.contact-info .section-title {
		  font-family: 'Playfair Display', serif;
		  color: #ae6f43;
		  font-size: 2rem;
		  margin-bottom: 0.5rem;
		}

		.contact-info .section-subtitle {
		  font-size: 1rem;
		  color: #6e5747;
		  margin-bottom: 2rem;
		}

		.contact-grid {
		  display: flex;
		  flex-wrap: wrap;
		  gap: 2rem;
		  justify-content: center;
		}

		.contact-card {
		  background-color: #fff;
		  border: 1px solid #e2d8cf;
		  border-left: 5px solid #ae6f43;
		  border-radius: 10px;
		  padding: 1.5rem;
		  max-width: 300px;
		  text-align: left;
		  box-shadow: 0 2px 8px rgba(0,0,0,0.03);
		}

		.contact-card h3 {
		  font-size: 1.2rem;
		  margin-bottom: 0.75rem;
		  color: #6b4c3b;
		}

		.contact-card a {
		  color: #ae6f43;
		  text-decoration: none;
		}
		.contact-card a:hover {
		  text-decoration: underline;
		}
		
		.contact-form {
		  background-color: #fffdf8;
		  padding: 3rem 1rem;
		  text-align: center;
		}

		.contact-form .section-title {
		  font-family: 'Playfair Display', serif;
		  color: #ae6f43;
		  font-size: 2rem;
		  margin-bottom: 0.5rem;
		}

		.contact-form .section-subtitle {
		  font-size: 1rem;
		  color: #6e5747;
		  margin-bottom: 2rem;
		}

		.form-grid {
		  max-width: 700px;
		  margin: 0 auto;
		  display: grid;
		  grid-template-columns: 1fr;
		  gap: 1rem;
		}

		.form-grid input,
		.form-grid select,
		.form-grid textarea {
		  padding: 0.8rem;
		  border: 1px solid #d8cfc6;
		  border-radius: 6px;
		  font-family: 'Open Sans', sans-serif;
		  font-size: 1rem;
		  width: 100%;
		}

		.form-grid select {
		  background-color: #fff;
		}

		.form-grid textarea {
		  resize: vertical;
		}

		.consent-label {
		  font-size: 0.9rem;
		  text-align: left;
		  color: #555;
		}

		.submit-button {
		  background-color: #ae6f43;
		  color: #fff;
		  padding: 0.75rem 2rem;
		  font-weight: bold;
		  border: none;
		  border-radius: 30px;
		  cursor: pointer;
		  transition: background-color 0.3s ease;
		}

		.submit-button:hover {
		  background-color: #8d5736;
		}
		
		.map-section {
		  padding: 60px 20px;
		  background-color: #f9f6f1;
		  text-align: center;
		}

		.map-section h2 {
		  font-size: 2.5rem;
		  margin-bottom: 40px;
		  color: #4d3c2d;
		}

		.map-container {
		  display: flex;
		  flex-direction: column;
		  gap: 40px;
		  max-width: 1200px;
		  margin: 0 auto;
		}

		.map-block h3 {
		  font-size: 1.25rem;
		  margin-bottom: 10px;
		  color: #6c4c35;
		}

		@media (min-width: 768px) {
		  .map-container {
			flex-direction: row;
			justify-content: space-between;
			gap: 20px;
		  }

		  .map-block {
			flex: 1;
		  }
		}
        
        /* Footer */
        footer {
            background-color: var(--deep-brown);
            color: white;
            padding: 3rem 0;
        }
        
        .footer-content {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
        }
        
        .footer-logo img {
            height: 60px;
            margin-bottom: 1rem;
        }
        
        .footer-links h3,
        .footer-contact h3,
        .footer-social h3 {
            color: white;
            margin-bottom: 1.5rem;
        }
        
        .footer-links ul,
        .footer-social ul {
            list-style: none;
        }
        
        .footer-links li,
        .footer-social li {
            margin-bottom: 0.5rem;
        }
        
        .footer-links a,
        .footer-social a {
            color: #ddd;
        }
        
        .footer-links a:hover,
        .footer-social a:hover {
            color: var(--muted-gold);
        }
        
        .footer-contact p {
            margin-bottom: 0.5rem;
        }
        
        .footer-bottom {
            text-align: center;
            padding-top: 2rem;
            margin-top: 2rem;
            border-top: 1px solid rgba(255,255,255,0.1);
        }
		
		/*-----------------------*/
		/***** Whatsapp Integration *****/
		/*-----------------------
		.whatsapp {
			position: fixed;
			right: 0px;
			top: 52%;
		}
		.whatsapp h5 {
			color: white;
			background: #B5446E;
			padding: 13px;
			border-radius: 10px;
		}
		.whatsapp2 {
			position: fixed;
			right: 0px;
			top: 59%;
		}
		.whatsapp2 h5 {
			color: white;
			background: #B5446E;
			padding: 13px;
			border-radius: 10px;
		}*/
        
		/*Specials*/
		.specials-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 2rem;
            margin-top: 2rem;
        }
        
        .special-card {
            background: white;
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            transition: transform 0.3s ease;
        }
        
        .special-card:hover {
            transform: translateY(-5px);
        }
        
        .special-image {
            width: 100%;
            height: auto;
            display: block;
        }
        
        .special-content {
            padding: 1.5rem;
        }
        
        .special-title {
            color: #9d6a89;
            margin-bottom: 1rem;
            font-size: 1.5rem;
            text-align: center;
        }
        
        .special-description {
            margin-bottom: 1rem;
            text-align: justify;
        }
        
        .special-price {
            font-weight: bold;
            color: #9d6a89;
            font-size: 1.2rem;
            margin: 1rem 0;
        }
        
        .special-terms {
            font-size: 0.9rem;
            color: #666;
            border-top: 1px solid #eee;
            padding-top: 1rem;
            margin-top: 1rem;
        }
		
		/*Call Button */
		.call-btn {
		  position: fixed;
		  bottom: 20px;
		  right: 20px;
		  background-color: #b24a67;
		  color: #fff;
		  padding: 14px 20px;
		  border-radius: 40px;
		  box-shadow: 0 3px 6px rgba(0,0,0,0.2);
		  font-weight: bold;
		  text-decoration: none;
		  font-size: 14px;
		  z-index: 1000;
		}
		
		.whatsapp-btn a,
		.whatsapp2-btn a {
		  display: inline-block;
		  background-color: #b24a67;
		  color: #fff;
		  padding: 14px 20px;
		  border-radius: 40px;
		  box-shadow: 0 3px 6px rgba(0,0,0,0.2);
		  font-weight: bold;
		  text-decoration: none;
		  font-size: 14px;
		}

		.whatsapp-btn {
		  position: fixed;
		  bottom: 80px;
		  right: 20px;
		  z-index: 1000;
		}

		.whatsapp2-btn {
		  position: fixed;
		  bottom: 140px;
		  right: 20px;
		  z-index: 1000;
		}
		
		
        /* Responsive Styles */
        @media (max-width: 992px) {
            .intro-content,
            .treatments-content {
                flex-direction: column;
            }
            
            .program-cards,
            .activities-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .booking-content {
                grid-template-columns: 1fr;
            }
            
            .footer-content {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .treatments-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }
        
        @media (max-width: 768px) {
			
			.header-container {
				grid-template-columns: 1fr auto;
			}

			.nav-wrapper {
				justify-self: start;
				grid-column: span 2;
				width: 100%;
			}
			
            .nav-menu {
				display: none;
				flex-direction: column;
				width: 100%;
				background-color: white;
				padding: 1rem;
				box-shadow: 0 5px 10px rgba(0,0,0,0.1);
				position: absolute;
				top: 80px;
				left: 0;
				z-index: 999;
			}
            
            .nav-menu.active {
                display: flex;
            }
            
            .nav-menu li {
                margin: 0.5rem 0;
            }
            
            .mobile-menu-btn {
                display: block;
            }
			
			.header-cta {
			display: none;
			}
            
            .hero h1 {
                font-size: 2.5rem;
            }
            
            .experience-content,
            .program-cards,
            .activities-grid,
            .why-us-grid {
                grid-template-columns: 1fr;
            }
            
            .treatments-grid {
                grid-template-columns: 1fr;
            }
			
			.mobile-menu-btn {
				display: block;
				background: none;
				border: none;
				font-size: 2rem;
				justify-self: end;
				color: var(--deep-brown);
				cursor: pointer;
			}
        }
        
        @media (max-width: 576px) {
            .footer-content {
                grid-template-columns: 1fr;
            }
            
            .hero h1 {
                font-size: 2rem;
            }
            
            .hero p {
                font-size: 1rem;
            }
            
            .section-title h2 {
                font-size: 1.8rem;
            }
            
            .treatment-title {
                font-size: 1.2rem;
            }
            
            .treatment-description {
                font-size: 0.8rem;
            }
        }
    </style>








