/* General Styles */
:root {
  --primary-color: #5ba395;
  --bg-color: #f9f3ea;
  --text-color: #333;
  --heading-color: #333;
  --light-green: #c9e4d6;
  --light-orange: #f0d9b5;
  --light-blue: #b8d8e8;
  --light-beige: #e4d9c9;
  --pastel-pink: #f8d7e3;
  --pastel-yellow: #f8f0c6;
}

body {
  font-family: "Montserrat", sans-serif;
  color: var(--text-color);
  background-color: var(--bg-color);
  overflow-x: hidden;
  line-height: 1.6;
  font-size: 16px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--heading-color);
  font-weight: 600;
}

.text-dark{
  text-decoration: none;
 }

#mobileMenu a.text-dark {
  color: #333 !important;
  font-weight: 400 !important;
  transition: background-color 0.3s ease, color 0.3s ease;
  text-decoration: none;
}

#mobileMenu a.text-dark:hover {
  background-color: rgba(255,255,255,0.4);
  color: #000;
}

section {
  padding: 60px 0;
  position: relative;
  overflow: hidden;
}

.content-container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 15px;
  position: relative;
  z-index: 2;
}

.btn-pink {
  background-color: var(--pastel-pink);
  border-color: var(--pastel-pink);
  padding: 10px 20px;
  font-weight: 500;
  transition: all 0.3s ease;
}
.btn-pink:hover {
  background-color: #f3cee8;
  border-color: #d6afca;
}

.btn-primary {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  padding: 10px 25px;
  font-weight: 500;
  transition: all 0.3s ease;
}

.btn-primary:hover {
  background-color: #4a8f82;
  border-color: #4a8f82;
}

/* Modern Plant Backgrounds with Clear Leaf Shapes */
.hero-section {
  background-color: var(--bg-color);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3Cstyle%3E.leaf-1{fill:%23c9e4d6;opacity:0.2;}.leaf-2{fill:%23b8d8e8;opacity:0.15;}.leaf-3{fill:%23f0d9b5;opacity:0.15;}.leaf-4{fill:%23e4d9c9;opacity:0.2;}.leaf-5{fill:%23f8d7e3;opacity:0.15;}.leaf-6{fill:%23f8f0c6;opacity:0.15;}%3C/style%3E%3C/defs%3E%3Cpath class='leaf-1' d='M100,200 C120,150 160,130 200,150 C240,170 260,220 240,270 C220,320 180,340 140,320 C100,300 80,250 100,200 Z'/%3E%3Cpath class='leaf-2' d='M900,600 C920,550 960,530 1000,550 C1040,570 1060,620 1040,670 C1020,720 980,740 940,720 C900,700 880,650 900,600 Z'/%3E%3Cpath class='leaf-3' d='M300,700 C330,660 380,650 420,680 C460,710 470,760 440,800 C410,840 360,850 320,820 C280,790 270,740 300,700 Z'/%3E%3Cpath class='leaf-4' d='M800,100 C830,60 880,50 920,80 C960,110 970,160 940,200 C910,240 860,250 820,220 C780,190 770,140 800,100 Z'/%3E%3Cpath class='leaf-5' d='M500,400 C530,360 580,350 620,380 C660,410 670,460 640,500 C610,540 560,550 520,520 C480,490 470,440 500,400 Z'/%3E%3Cpath class='leaf-6' d='M1100,300 C1130,260 1180,250 1220,280 C1260,310 1270,360 1240,400 C1210,440 1160,450 1120,420 C1080,390 1070,340 1100,300 Z'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  padding: 80px 0;
  position: relative;
}

.about-section {
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3Cstyle%3E.leaf-1{fill:%23c9e4d6;opacity:0.1;}.leaf-2{fill:%23b8d8e8;opacity:0.1;}.leaf-3{fill:%23f0d9b5;opacity:0.1;}.leaf-4{fill:%23e4d9c9;opacity:0.1;}.leaf-5{fill:%23f8d7e3;opacity:0.1;}.leaf-6{fill:%23f8f0c6;opacity:0.1;}%3C/style%3E%3C/defs%3E%3Cpath class='leaf-1' d='M50,100 C80,50 130,30 180,50 C230,70 250,130 220,180 C190,230 140,250 90,230 C40,210 20,150 50,100 Z'/%3E%3Cpath class='leaf-2' d='M1150,700 C1180,650 1230,630 1280,650 C1330,670 1350,730 1320,780 C1290,830 1240,850 1190,830 C1140,810 1120,750 1150,700 Z'/%3E%3Cpath class='leaf-3' d='M200,600 C230,550 280,530 330,550 C380,570 400,630 370,680 C340,730 290,750 240,730 C190,710 170,650 200,600 Z'/%3E%3Cpath class='leaf-4' d='M900,200 C930,150 980,130 1030,150 C1080,170 1100,230 1070,280 C1040,330 990,350 940,330 C890,310 870,250 900,200 Z'/%3E%3Cpath class='leaf-5' d='M600,500 C630,450 680,430 730,450 C780,470 800,530 770,580 C740,630 690,650 640,630 C590,610 570,550 600,500 Z'/%3E%3Cpath class='leaf-6' d='M1000,400 C1030,350 1080,330 1130,350 C1180,370 1200,430 1170,480 C1140,530 1090,550 1040,530 C990,510 970,450 1000,400 Z'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  position: relative;
}

.services-section {
  background-color: var(--bg-color);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3Cstyle%3E.leaf-1{fill:%23c9e4d6;opacity:0.2;}.leaf-2{fill:%23b8d8e8;opacity:0.15;}.leaf-3{fill:%23f0d9b5;opacity:0.15;}.leaf-4{fill:%23e4d9c9;opacity:0.2;}.leaf-5{fill:%23f8d7e3;opacity:0.15;}.leaf-6{fill:%23f8f0c6;opacity:0.15;}%3C/style%3E%3C/defs%3E%3Cpath class='leaf-1' d='M150,300 C180,250 230,230 280,250 C330,270 350,330 320,380 C290,430 240,450 190,430 C140,410 120,350 150,300 Z'/%3E%3Cpath class='leaf-2' d='M950,500 C980,450 1030,430 1080,450 C1130,470 1150,530 1120,580 C1090,630 1040,650 990,630 C940,610 920,550 950,500 Z'/%3E%3Cpath class='leaf-3' d='M350,600 C380,550 430,530 480,550 C530,570 550,630 520,680 C490,730 440,750 390,730 C340,710 320,650 350,600 Z'/%3E%3Cpath class='leaf-4' d='M750,200 C780,150 830,130 880,150 C930,170 950,230 920,280 C890,330 840,350 790,330 C740,310 720,250 750,200 Z'/%3E%3Cpath class='leaf-5' d='M550,400 C580,350 630,330 680,350 C730,370 750,430 720,480 C690,530 640,550 590,530 C540,510 520,450 550,400 Z'/%3E%3Cpath class='leaf-6' d='M1050,300 C1080,250 1130,230 1180,250 C1230,270 1250,330 1220,380 C1190,430 1140,450 1090,430 C1040,410 1020,350 1050,300 Z'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  position: relative;
}

.contact-section {
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3Cstyle%3E.leaf-1{fill:%23c9e4d6;opacity:0.1;}.leaf-2{fill:%23b8d8e8;opacity:0.1;}.leaf-3{fill:%23f0d9b5;opacity:0.1;}.leaf-4{fill:%23e4d9c9;opacity:0.1;}.leaf-5{fill:%23f8d7e3;opacity:0.1;}.leaf-6{fill:%23f8f0c6;opacity:0.1;}%3C/style%3E%3C/defs%3E%3Cpath class='leaf-1' d='M100,400 C130,350 180,330 230,350 C280,370 300,430 270,480 C240,530 190,550 140,530 C90,510 70,450 100,400 Z'/%3E%3Cpath class='leaf-2' d='M1100,600 C1130,550 1180,530 1230,550 C1280,570 1300,630 1270,680 C1240,730 1190,750 1140,730 C1090,710 1070,650 1100,600 Z'/%3E%3Cpath class='leaf-3' d='M300,500 C330,450 380,430 430,450 C480,470 500,530 470,580 C440,630 390,650 340,630 C290,610 270,550 300,500 Z'/%3E%3Cpath class='leaf-4' d='M800,300 C830,250 880,230 930,250 C980,270 1000,330 970,380 C940,430 890,450 840,430 C790,410 770,350 800,300 Z'/%3E%3Cpath class='leaf-5' d='M500,200 C530,150 580,130 630,150 C680,170 700,230 670,280 C640,330 590,350 540,330 C490,310 470,250 500,200 Z'/%3E%3Cpath class='leaf-6' d='M1000,700 C1030,650 1080,630 1130,650 C1180,670 1200,730 1170,780 C1140,830 1090,850 1040,830 C990,810 970,750 1000,700 Z'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
  position: relative;
}

/* Modern Plant Leaf Elements */
.hero-section::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 40%;
  height: 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 400'%3E%3Cpath fill='%23c9e4d6' d='M150,50 C200,80 220,150 180,200 C140,250 70,230 50,180 C30,130 50,60 100,40 C120,30 140,40 150,50 Z'/%3E%3Cpath fill='%23b8d8e8' d='M120,220 C170,250 190,320 150,370 C110,420 40,400 20,350 C0,300 20,230 70,210 C90,200 110,210 120,220 Z' opacity='0.7'/%3E%3Cpath fill='%23f0d9b5' d='M180,150 C230,180 250,250 210,300 C170,350 100,330 80,280 C60,230 80,160 130,140 C150,130 170,140 180,150 Z' opacity='0.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;
  opacity: 0.7;
  z-index: 1;
}

.about-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 30%;
  height: 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 400'%3E%3Cpath fill='%23e4d9c9' d='M50,50 C0,80 -20,150 20,200 C60,250 130,230 150,180 C170,130 150,60 100,40 C80,30 60,40 50,50 Z'/%3E%3Cpath fill='%23f8d7e3' d='M80,220 C30,250 10,320 50,370 C90,420 160,400 180,350 C200,300 180,230 130,210 C110,200 90,210 80,220 Z' opacity='0.7'/%3E%3Cpath fill='%23c9e4d6' d='M20,150 C-30,180 -50,250 -10,300 C30,350 100,330 120,280 C140,230 120,160 70,140 C50,130 30,140 20,150 Z' opacity='0.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  opacity: 0.7;
  z-index: 1;
}

.services-section::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 150px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200'%3E%3Cpath fill='%23f0d9b5' d='M0,100 C200,150 400,50 600,100 C800,150 1000,50 1200,100 L1200,200 L0,200 Z' opacity='0.3'/%3E%3Cpath fill='%23c9e4d6' d='M0,120 C200,170 400,70 600,120 C800,170 1000,70 1200,120 L1200,200 L0,200 Z' opacity='0.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: cover;
  z-index: 1;
}

.contact-section::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 30%;
  height: 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 400'%3E%3Cpath fill='%23b8d8e8' d='M150,50 C200,80 220,150 180,200 C140,250 70,230 50,180 C30,130 50,60 100,40 C120,30 140,40 150,50 Z' opacity='0.5'/%3E%3Cpath fill='%23f8f0c6' d='M120,220 C170,250 190,320 150,370 C110,420 40,400 20,350 C0,300 20,230 70,210 C90,200 110,210 120,220 Z' opacity='0.5'/%3E%3Cpath fill='%23c9e4d6' d='M180,150 C230,180 250,250 210,300 C170,350 100,330 80,280 C60,230 80,160 130,140 C150,130 170,140 180,150 Z' opacity='0.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;
  opacity: 0.7;
  z-index: 1;
}

/* Remove the old decoration elements since we now have better backgrounds */
.decoration-elements {
  display: none;
}

/* Hero Section */
.hero-section {
  min-height: 80vh;
  display: flex;
  align-items: center;
}

.hero-content {
  position: relative;
  z-index: 2;
  padding: 20px 0;
}

.hero-content h1 {
  font-size: 2.6rem;
  margin-bottom: 20px;
  line-height: 1.2;
  font-weight: 700;
}

.hero-content p {
  font-size: 1rem;
  margin-bottom: 25px;
  max-width: 90%;
}

.hero-illustration {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-illustration img {
  max-width: 100%;
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-20px);
  }
  100% {
    transform: translateY(0px);
  }
}

/* About Section */
.about-section h2 {
  font-size: 2.2rem;
  margin-bottom: 10px;
}

.about-section h3 {
  font-size: 1.8rem;
  margin-bottom: 5px;
}

.profession {
  color: var(--primary-color);
  font-size: 1.1rem;
  margin-bottom: 15px;
}

.about-image {
  width: 400px;
  height: 400px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.about-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-text {
  margin-top: 20px;
  text-align: justify;
}

.about-text p {
  margin-bottom: 15px;
}

.heart-icon {
  color: #ff6b6b;
}

/* Services Section */
.services-section h2 {
  font-size: 2.2rem;
  margin-bottom: 30px;
}

.service-card {
  position: relative;
  z-index: 2;
  height: 100%;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
  transition: all 0.4s ease;
  background: #fff;
  margin-bottom: 30px;
}

.service-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

.service-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--light-green) 0%, var(--light-blue) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: -1;
}

.service-card:hover::before {
  opacity: 0.1;
}

.service-card-inner {
  padding: 30px 20px;
  text-align: center;
  position: relative;
  z-index: 2;
}

.service-icon-wrapper {
  width: 80px;
  height: 80px;
  margin: 0 auto 20px;
  position: relative;
}

.service-icon-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--light-green);
  border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
  animation: morph 8s ease-in-out infinite;
  transition: all 0.5s ease;
}

.service-card:nth-child(2n) .service-icon-bg {
  background-color: var(--light-blue);
  animation-delay: 1s;
}

.service-card:nth-child(3n) .service-icon-bg {
  background-color: var(--light-orange);
  animation-delay: 2s;
}

.service-card:nth-child(4n) .service-icon-bg {
  background-color: var(--pastel-pink);
  animation-delay: 3s;
}

.service-card:nth-child(5n) .service-icon-bg {
  background-color: var(--pastel-yellow);
  animation-delay: 4s;
}

.service-card:nth-child(6n) .service-icon-bg {
  background-color: var(--light-beige);
  animation-delay: 5s;
}

@keyframes morph {
  0% {
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
  }
  34% {
    border-radius: 70% 30% 50% 50% / 30% 30% 70% 70%;
  }
  67% {
    border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
  }
  100% {
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
  }
}

.service-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

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

.service-card h4 {
  font-size: 1.2rem;
  margin-bottom: 15px;
  transition: all 0.3s ease;
}

.service-card:hover h4 {
  color: var(--primary-color);
}

.service-card p {
  font-size: 0.9rem;
  color: #666;
  margin-bottom: 0;
}

.service-card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(to right, var(--light-green), var(--primary-color));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.service-card:hover::after {
  transform: scaleX(1);
}

/* Contact Section */
.contact-section h2 {
  font-size: 2.2rem;
  margin-bottom: 25px;
}

.form-control {
  padding: 12px 15px;
  border-radius: 8px;
  border: 1px solid #ddd;
  margin-bottom: 15px;
}

.form-control:focus {
  box-shadow: none;
  border-color: var(--primary-color);
}

.office-image {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  max-width: 95%;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* WhatsApp Float Button */
.whatsapp-float {
  position: fixed;
  width: 60px;
  height: 60px;
  bottom: 30px;
  right: 30px;
  background-color: #25d366;
  color: #fff;
  border-radius: 50px;
  text-align: center;
  font-size: 30px;
  box-shadow: 2px 2px 3px #999;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.3s ease;
}

.whatsapp-float:hover {
  background-color: #128c7e;
  color: #fff;
  transform: scale(1.1);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .content-container {
    max-width: 90%;
  }

  .hero-content h1 {
    font-size: 2.2rem;
  }

  .about-section h2,
  .services-section h2,
  .contact-section h2 {
    font-size: 2rem;
  }

  .about-section h3 {
    font-size: 1.6rem;
  }

  .hero-section::before,
  .about-section::before,
  .services-section::after,
  .contact-section::after {
    opacity: 0.4;
  }

  .about-image {
    width: 250px;
    height: 250px;
  }

  .hero-section {
    min-height: auto;
    padding: 60px 0;
  }
}

@media (max-width: 767px) {
  section {
    padding: 50px 0;
  }

  .hero-content h1 {
    font-size: 2rem;
  }

  .hero-content p {
    font-size: 0.9rem;
  }

  .about-image {
    width: 200px;
    height: 200px;
    margin: 0 auto 30px;
  }

  .office-image {
    margin-top: 25px;
    max-width: 100%;
  }

  .hero-section::before,
  .about-section::before,
  .services-section::after,
  .contact-section::after {
    opacity: 0.3;
  }

  .whatsapp-float {
    width: 50px;
    height: 50px;
    font-size: 25px;
    bottom: 20px;
    right: 20px;
  }

  .hero-illustration {
    margin-top: 40px;
  }
}

@media (max-width: 575px) {
  .hero-content h1 {
    font-size: 1.8rem;
  }

  .about-section h2,
  .services-section h2,
  .contact-section h2 {
    font-size: 1.8rem;
  }

  .about-section h3 {
    font-size: 1.4rem;
  }

  .profession {
    font-size: 1rem;
  }

  .hero-section::before,
  .about-section::before,
  .services-section::after,
  .contact-section::after {
    opacity: 0.2;
  }

  .about-image {
    width: 220px;
    height: 220px;
  }
}