.get-quote-section {
  background-color: #5f0f40;
  color: #f5f5dc;
  max-width: 600px;
  margin: 100px auto;
  margin-bottom: 0px;
  padding: 55px 25px; /* 100px se kam kiya */
  border-radius: 8px;
  font-family: Arial, sans-serif;
}
html, body {
  height: 100%;
  margin: 0;
}

/* 2) Make the Get Quote page a column flex layout */
body.page-template-GetQuote {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* 3) Stretch & color the main section */
.get-quote-section {
  flex: 1;                      /* fill all available space */
  background-color: #6f124b;    /* your purple */
  padding: 2rem;                /* optional spacing */
}

/* 4) Push footer to the bottom */
footer.site-footer {
  margin-top: auto;
}

.get-quote-form {
  display: flex;
  flex-wrap: wrap;
  gap: 20px; /* fields ke beech gap */
}

.get-quote-form label {
  width: 100%; /* label hamesha full width */
  margin-bottom: 6px;
  font-weight: bold;
  color: #f5f5dc;
}

/* Each input + label group ko ek container mein wrap karenge */
.get-quote-form .form-group {
  flex: 1 1 45%; /* do columns with 45% width and flexibility */
  min-width: 250px; /* chhote screen ke liye minimum width */
  display: flex;
  flex-direction: column;
  margin-bottom: 18px;
}

.get-quote-form textarea {
  flex: 1 1 100%;
  min-width: 100%;
  resize: vertical;
  min-height: 100px;
}

/* Submit button full width and centered */
.get-quote-form input[type="submit"] {
  flex: 1 1 100%;
  background-color: #f5f5dc;
  color: #5f0f40;
  font-weight: bold;
  border: none;
  padding: 14px 24px;
  cursor: pointer;
  border-radius: 0px;
  font-size: 18px;
  transition: background-color 0.3s ease;
  margin-top: 10px;
  max-width: 200px;
  align-self: center;
}

.get-quote-form input[type="submit"]:hover {
  background-color: #e4d9b9;
}
/* Mobile Responsive Overrides */
@media (max-width: 599px) {
  .get-quote-section {
    padding: 60px 15px;
    margin: 60px 0px;
	font-size: 26px;
    margin-bottom: 0px;
    border: none;
border-radius: 0px;
  }

  .get-quote-form .form-group {
    flex: 1 1 100% !important;
    min-width: 100% !important;
	font-weight: bold;
	font-size: 14px;
  }

  .get-quote-form textarea {
    min-width: 100% !important;
  }

  .get-quote-form input[type="submit"] {
    max-width: 100% !important;
    width: 100% !important;
    padding: 14px 0;
    margin-top: 15px;
  }
}
/* Get Quote Form Input Background */
.get-quote-form input,
.get-quote-form textarea,
.get-quote-form select {
  background-color: #f5f5dc;
}

body.page-template-Get-Quote {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color: #6f124b; /* your purple */
}

body.page-template-Get-Quote .site-content {
  flex: 1;   /* let the content area grow */
}

html, body {
  height: 100%;
  margin: 0;
}
body.page-template-GetQuote {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* ==========================================================================
   3. Stretch the purple section full-width, fill the space between header/footer,
      and center its children vertically & horizontally
   ========================================================================== */
body.page-template-GetQuote .get-quote-section {
  flex: 1;                           /* fill between header & footer */
  width: 100% !important;            /* override any theme max-width */
  max-width: none !important;
  display: flex;
  flex-direction: column;
  justify-content: center;           /* vertical centering */
  align-items: center;               /* horizontal centering */
  background-color: #6f124b;
  padding-top: 100px;                /* adjust if your header is taller/shorter */
  box-sizing: border-box;
  margin: 0;
}

/* ==========================================================================
   4. Center and constrain the H1 & form
   ========================================================================== */
body.page-template-GetQuote .get-quote-section h1,
body.page-template-GetQuote .get-quote-section form {
  width: 100%;
  max-width: 800px;                  /* form container width */
  margin: 0 auto 1.5rem;             /* center + spacing below */
  text-align: center;                /* center the heading */
  box-sizing: border-box;
  padding: 0 1rem;                   /* small side-gutters on mobile */
}

/* Stretch inputs/textareas inside the form to its width */
body.page-template-GetQuote .get-quote-section form input[type="text"],
body.page-template-GetQuote .get-quote-section form input[type="email"],
body.page-template-GetQuote .get-quote-section form textarea {
  width: 100% !important;
  box-sizing: border-box;
}

/* ==========================================================================
   5. Pin the footer to the bottom
   ========================================================================== */
body.page-template-GetQuote footer.site-footer {
  margin-top: auto;
}

