.hero {
        text-align: center;
      padding: 4rem 1rem 2rem;
      animation: fadeInDown 1s ease-in-out;
      min-height: 40vh; /* You can increase this to 80vh or 100vh */
      padding: 2rem 1rem 1rem 1rem;
      background-color: #ffffff;
      animation: fadeInDown 1s ease-in-out;
}

.hero h1 {
  font-weight: 700;
  font-size: 2.5rem;
  font-weight: 700;
}

.hero p {
  color: #555;
  margin-top: 1rem;
}


    .contact-section {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      padding: 2rem 1rem;
      gap: 2rem;
    }

    .form-box {
        position: relative;
        z-index: 2;
      background-color: #f7ebdf;
      padding: 2rem;
      border-radius: 1rem;
      box-shadow: 0 4px 10px rgba(0,0,0,0.1);
      flex: 1;
      min-width: 300px;
      max-width: 500px;
      animation: fadeInLeft 1s ease-in-out;
    }

    .form-control, .btn {
      border-radius: 0.5rem;
    }

    .submit-btn {
      background-color: #3a2d29;
      color: #fff;
      padding: 0.6rem 1.2rem;
      border: none;
      transition: background-color 0.3s ease;
    }

    .submit-btn:hover {
      background-color: #6b6767;
      color: #3a2d29;
    }

    .contact-image {
        position: relative;
        z-index: 1;
        top: 30px; /* Push down a bit */
      max-width: 400px;
      border-radius: 8px;
      animation: fadeInRight 1s ease-in-out;
      
    }
    .thank-you-message {
  background-color: #f7ebdf;
  padding: 2rem;
  border-radius: 1rem;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}


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

    @keyframes fadeInLeft {
      0% {
        opacity: 0;
        transform: translateX(-30px);
      }
      100% {
        opacity: 1;
        transform: translateX(0);
      }
    }

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

     
    }
    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .fade-in{
         animation: fadeIn 1s ease-in-out;
    }

    .section-padding {
      padding: 2rem 1rem;
      
    }
    .section-padding h3,h2{
        font-weight: 700;
        font-size: 40px;
    }
    

    .map-responsive iframe {
      border: none;
      width: 100%;
      height: 300px;
      border-radius: 0.75rem;
    }

    .feature-image {
      width: 100%;
      border-radius: 1rem;
      object-fit: cover;
      height: 65vh;
    }