/* ==========================================================================
   LEAFORGE TECHNOLOGIES — CONTACT PAGE / CONTACT FORM
   PURPOSE
   -------
   Edit the Contact Us page and contact form in one place. The restored older form style is retained as the latest presentation.

   SECTION DIRECTORY
   -----------------
   01. Contact page foundations
   02. Responsive base rules
   03. Shared modern contact layout
   04. Restored older form presentation
   05. Final mobile corrections
   ========================================================================== */

/* ==========================================================================
   01. CONTACT PAGE FOUNDATIONS
   ========================================================================== */

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 20px;
}

@media (max-width: 575px) {
  .form-row {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-bottom: 18px;
  }
}

.contact-section {
  width: 100%;
  padding: 50px 0;
  background: #ffffff;
}

.contact-container {
  width: 100%;
  max-width: 1450px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 45fr) minmax(0, 55fr);
  gap: clamp(24px, 2.8vw, 40px);
  align-items: flex-start;
  padding: 0 30px;
  box-sizing: border-box;
}

.contact-form {
  width: 100%;
  min-width: 0;
}

.form-group {
  width: 100%;
}

.form-group label {
  display: block;
  font-size: 15px;
  color: #152d3d;
  margin-bottom: 6px;
}

.form-group label span {
  color: #b00020;
}

.form-group input {
  width: 100%;
  border: 1px solid #a8a8a8;
  border-radius: 3px;
  padding: 0 12px;
  font-size: 15px;
  outline: none;
  background: #ffffff;
  color: #152d3d;
  font-family: inherit;
  height: 56px;
}

.form-group select {
  width: 100%;
  border: 1px solid #a8a8a8;
  border-radius: 3px;
  padding: 0 12px;
  font-size: 15px;
  outline: none;
  background: #ffffff;
  font-family: inherit;
  height: 56px;
  color: #999999;
  appearance: auto;
}

.form-group textarea {
  width: 100%;
  border: 1px solid #a8a8a8;
  border-radius: 3px;
  font-size: 15px;
  outline: none;
  background: #ffffff;
  color: #152d3d;
  font-family: inherit;
  height: 110px;
  padding: 12px;
  resize: vertical;
}

.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  border-color: #04414b;
}

.privacy-text {
  font-size: 14px;
  line-height: 1.35;
  color: #263b48;
  margin: 0 0 22px;
}

.privacy-text a {
  color: #04414b;
  text-decoration: none;
}

.privacy-text a:hover {
  text-decoration: underline;
}

.contact-form button {
  width: 100%;
  height: 65px;
  background: #04414b;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  font-size: 19px;
  font-weight: 300;
  cursor: pointer;
  transition: 0.3s ease;
  font-family: inherit;
}

.contact-form button:hover {
  background: #04414b;
}

@media (max-width: 991px) {
  .contact-container {
    grid-template-columns: 1fr;
    gap: 35px;
  }
}

@media (max-width: 575px) {
  .contact-section {
    padding: 35px 0;
  }

  .contact-container {
    padding: 0 15px;
  }

  .contact-form button {
    height: 56px;
    font-size: 20px;
  }
}

.lf-form-status {
  display: none;
  margin: 0 0 20px;
  padding: 14px 16px;
  border: 1px solid #b8c7c1;
  border-radius: 4px;
  background: #f3f8f6;
  color: #15362f;
  font-size: 14px;
  line-height: 1.5;
}

.lf-form-status.is-visible {
  display: block;
}

.lf-form-status.is-error {
  border-color: #d6a6a6;
  background: #fff5f5;
  color: #7b1d1d;
}

.contact-form button[disabled] {
  cursor: wait;
  opacity: 0.72;
}

@media (max-width: 991px) {
  .contact-section:not(#a#b#c) {
    padding-left: 18px;
    padding-right: 18px;
  }

  .lf-contact-hero:not(#a#b#c) {
    min-height: auto;
    margin-top: 0;
    padding: 64px 18px 54px;
    background-size: cover;
    background-position: center center;
  }

  .lf-contact-hero:not(#a#b#c)::before {
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.96) 0%,
      rgba(255, 255, 255, 0.86) 100%
    );
  }

  .lf-contact-hero .lf-page-container:not(#a#b#c) {
    padding: 24px 20px;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(4, 65, 75, 0.14);
    border-radius: 22px;
    box-shadow: 0 16px 42px rgba(2, 54, 61, 0.1);
  }

  .privacy-text:not(#a#b#c) {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 575px) {
  .contact-section:not(#a#b#c) {
    padding-top: 52px;
    padding-bottom: 56px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .lf-contact-hero .lf-page-container:not(#a#b#c) {
    padding: 22px 17px;
    border-radius: 18px;
  }

  .lf-contact-hero:not(#a#b#c) {
    padding: 50px 15px 46px;
  }
}


.lf-hp-field:not(#a#b#c) {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

body:not(.home-page) .lf-inner-second-section.contact-section:not(#a#b#c) {
  margin-top: 0;
  background: #ffffff;
  background-color: #ffffff;
  color: #152d3d;
}

body:not(.home-page) .lf-inner-second-section .contact-form:not(#a#b#c) {
  background: transparent;
}

body:not(.home-page) .lf-inner-second-section.contact-section input:not(#a#b#c), body:not(.home-page) .lf-inner-second-section.contact-section select:not(#a#b#c), body:not(.home-page) .lf-inner-second-section.contact-section textarea:not(#a#b#c) {
  background: #ffffff;
  color: #152d3d;
}

.pages-contact-us .contact-form button:not(#a#b#c), body:not(.home-page) .contact-form button:not(#a#b#c), body:not(.home-page) .contact-form button[type="submit"]:not(#a#b#c), body:not(.home-page) .contact-form button:hover:not(#a#b#c), body:not(.home-page) .contact-form button:focus-visible:not(#a#b#c), body:not(.home-page) .contact-form button[type="submit"]:hover:not(#a#b#c), body:not(.home-page) .contact-form button[type="submit"]:focus-visible:not(#a#b#c) {
  background: #04414b;
  background-color: #04414b;
  color: #ffffff;
  border-color: #04414b;
}


body:not(.home-page) .lf-inner-second-section.contact-section h2:not(#a#b#c) {
  color: #0d2b3e;
}

body:not(.home-page) .lf-inner-second-section.contact-section p:not(#a#b#c), body:not(.home-page) .lf-inner-second-section.contact-section label:not(#a#b#c), body:not(.home-page) .lf-inner-second-section.contact-section .privacy-text:not(#a#b#c) {
  color: #152d3d;
}

body:not(.home-page) .lf-inner-second-section.contact-section .contact-info:not(#a#b#c), body:not(.home-page) .lf-inner-second-section.contact-section .contact-form:not(#a#b#c) {
  background: transparent;
}

/* ==========================================================================
   02. RESPONSIVE BASE CONTACT RULES
   ========================================================================== */

@media (max-width: 767px) {

  .lf-contact-hero::before {
    width: 100% !important;
    background: linear-gradient(
      180deg,
      rgba(0, 34, 40, 0.91) 0%,
      rgba(0, 34, 40, 0.83) 100%
    ) !important;
  }

  .lf-contact-hero .lf-page-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .lf-contact-hero h1 {
    margin-bottom: 18px !important;
    color: #ffffff !important;
    font-size: clamp(32px, 9vw, 42px) !important;
    line-height: 1.13 !important;
    letter-spacing: -0.7px !important;
    text-transform: none !important;
    text-shadow: 0 3px 18px rgba(0, 0, 0, 0.3) !important;
  }

  .lf-contact-hero h1 span {
    color: #f9b857 !important;
  }

  .lf-contact-hero p {
    max-width: 100% !important;
    margin-bottom: 24px !important;
    color: rgba(255, 255, 255, 0.92) !important;
    font-size: 15px !important;
    line-height: 1.68 !important;
  }
}

@media (max-width: 767px) {
  :is( .lf-v7-projects-grid, .lf-modern-card-grid, .lf-gym-about-wrap, .lf-np-studio-grid, .lf-bc-classic-grid, .lf-bc-row, .lf-benefits-container, .lf-bc-potential-grid, .lf-bc-feature-items, .lf-wd-home-split, .lf-wd-home-dark-band, .lf-wd-home-green-split, .lf-wd-process-layout, .contact-container, .lf-pricing-card-grid, .lf-pricing-cost-grid, .lf-pricing-assessment-grid, .lf-pricing-steps, .lf-pricing-faq-grid, .lf-partner-hero-inner, .lf-partner-benefit-grid, .lf-partner-service-grid, .lf-partner-model-grid, .lf-partner-commercial-grid, .lf-partner-process-grid, .lf-partner-scenarios-grid, .lf-partner-trust-grid, body.page-blog .lf-blog-card-grid, body.page-business-central-customization .lf-bc-dev-grid, body.page-business-central-implementation .lf-card-grid, body.page-business-central-implementation .bc-services-grid, body.page-business-central-implementation .lf-rapid-info-layout, body.page-business-central-implementation .lf-help-layout, body.page-business-central-implementation .lf-rapid-why-layout, body.page-business-central-implementation .lf-ri-card-grid, body.page-business-central-implementation .lf-r5-fit-grid, body.page-business-central-rapid5 .lf-rapid5-layout, body.page-business-central-rapid5 .lf-r5-steps-grid, body.page-business-central-rapid5 .lf-r5-home-style-grid, body.page-business-central-rapid8 .lf-rapid8-layout, body.page-business-central-rapid8 .lf-r8-steps-grid, body.page-business-central-rapid8 .lf-r5-home-style-grid, body.page-business-central-support .lf-bc-support-grid, body.page-business-central-support .lf-support-pro-grid-4, body.page-business-central-support .lf-support-plans-grid, body.page-business-central-support .lf-support-process-grid, body.page-business-central-support .lf-support-value-grid, body.page-smart-business-central-access .lf-sa-intro-grid, body.page-smart-business-central-access .lf-sa-cap-grid, body.page-smart-business-central-access .lf-sa-process-grid, body.page-smart-business-central-access .lf-sa-use-layout, body.page-smart-business-central-access .lf-sa-benefit-grid, body.page-smart-business-central-access .lf-sa-license-layout, body.home-page .lf-home-adviser-cta__inner, body.home-page .lf-small-business-help, #lfMegaMenu, .lf-why-grid, .lf-gym-feature-strip, body.page-leaforge365 .lf-book-demo__inner, body.home-page .lf-home-transform__inner, body.home-page .lf-home-transform__gallery, body.page-business-central-implementation .lf-smarter-erp-container, .lf-cap-overview-grid, .lf-cap-feature-grid, .lf-cap-step-grid, .lf-cap-benefits-grid, body.page-business-central-capabilities .lf-capabilities-directory__grid, body.page-business-central-rapid-packages .lf-rapid-packages-directory__grid, body.page-d365-bc-services .lf-rapid-packages-directory__grid, body.page-dynamics-365-business-central .lf-rapid-packages-directory__grid, body.page-business-central-implementation .lf-rapid-packages-directory__grid, body.home-page .lf-rapid-packages-directory__grid, body.page-leaforge365 .lf365-index-grid, body.page-leaforge365 .lf-blog-card-grid, .lf-home-why-overview, .lf-impl-showcase__panel, .lf-impl-dual-grid, .lf-impl-timeline-grid, .lf-impl-card-grid--three, .lf-impl-card-grid--four, .lf-impl-readiness-grid, .lf-impl-process-grid, .lf-impl-module-grid, .lf-impl-feature-split, .lf-impl-faq-layout, body.page-business-central-rapid5 .lf-rapid-fit-grid, body.page-business-central-rapid8 .lf-rapid-fit-grid, body.page-business-central-rapid5 .lf-r5-classic-grid, .lf-rapid-pricing-layout, .page-business-central-training .lf-training-audience-grid, .page-business-central-training .lf-training-online-grid, .page-business-central-training .lf-training-modules-grid, .page-business-central-training .lf-training-formats-layout, .page-business-central-training .lf-training-formats-grid ) {
    grid-template-columns: minmax(0, 1fr) !important;
    columns: 1 !important;
    gap: 22px !important;
  }

  :is( .lf-v7-about-wrap, .lf-gym-about-wrap, .lf-bc-row, .lf-wd-home-split, .lf-wd-home-dark-band, .lf-wd-home-green-split, .contact-container, .lf-partner-hero-inner, .lf-partner-cta-inner, .lf-rapid-info-layout, .lf-help-layout, .lf-rapid-why-layout, .lf-rapid5-layout, .lf-rapid8-layout, .lf-sa-intro-grid, .lf-sa-use-layout, .lf-sa-license-layout, .lf-impl-dual-grid, .lf-impl-feature-split, .lf-impl-faq-layout, .lf-rapid-pricing-layout, .lf-training-formats-layout ) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
  }
}

@media (max-width: 767px) {
  .form-row {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .contact-form button[type="submit"] {
    width: 100% !important;
  }
}

@media (max-width: 359px) {
  .lf-contact-hero h1 {
    font-size: 30px !important;
  }
}

/* ==========================================================================
   02A. SHARED MODERN CONTACT-PAGE LAYOUT
   ========================================================================== */

body.page-contact-us.lf-v18-page .lf-v18-contact-wrap {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 44px;
  align-items: start;
}

body.page-contact-us.lf-v18-page .lf-v18-contact-copy {
  padding: 28px;
  border-radius: 20px;
  background: #f5f8fb;
}

body.page-contact-us.lf-v18-page .lf-v18-contact-copy h2 {
  margin: 0 0 14px;
  font: 700 31px/1.2 "Poppins",sans-serif;
  color: #093c6e;
}

body.page-contact-us.lf-v18-page .lf-v18-contact-copy p {
  font: 400 15px/1.75 "Poppins",sans-serif;
  color: #53616d;
}

body.page-contact-us.lf-v18-page #contact-form {
  margin: 0;
}

@media (max-width:1000px) {
  body.page-contact-us.lf-v18-page .lf-v18-contact-wrap {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   03. RESTORED OLDER CONTACT FORM STYLE
   ========================================================================== */

body.page-contact-us .lf-contact-v30 {
  padding: 64px 0 72px;
  background: #ffffff;
}

body.page-contact-us .lf-contact-v30-container {
  display: block;
  width: min(100%, 920px);
  max-width: 920px;
  margin: 0 auto;
  padding: 0 24px;
}

body.page-contact-us .lf-contact-v30-form {
  width: 100%;
  max-width: none;
}

body.page-contact-us .lf-contact-v30-form .form-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

body.page-contact-us .lf-contact-v30-form .form-group label {
  margin-bottom: 6px;
  font-size: 15px;
  line-height: 1.35;
  color: #152d3d;
}

body.page-contact-us .lf-contact-v30-form input, body.page-contact-us .lf-contact-v30-form select {
  height: 56px;
  width: 100%;
  border: 1px solid #a8a8a8;
  border-radius: 3px;
  background: #ffffff;
  color: #152d3d;
  padding: 0 12px;
  font: 400 15px/1.4 Poppins, Arial, sans-serif;
  box-sizing: border-box;
}

body.page-contact-us .lf-contact-v30-form textarea {
  width: 100%;
  min-height: 110px;
  height: 110px;
  border: 1px solid #a8a8a8;
  border-radius: 3px;
  background: #ffffff;
  color: #152d3d;
  padding: 12px;
  font: 400 15px/1.45 Poppins, Arial, sans-serif;
  resize: vertical;
  box-sizing: border-box;
}

body.page-contact-us .lf-contact-v30-form input:focus, body.page-contact-us .lf-contact-v30-form select:focus, body.page-contact-us .lf-contact-v30-form textarea:focus {
  outline: none;
  border-color: #04414b;
  box-shadow: 0 0 0 1px rgba(4,65,75,.10);
}

body.page-contact-us .lf-contact-v30-form .privacy-text {
  margin: 0 0 22px;
  font-size: 14px;
  line-height: 1.35;
  color: #263b48;
}

body.page-contact-us .lf-contact-v30-form button[type="submit"] {
  display: flex;
  width: 100%;
  min-height: 65px;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border: 0;
  border-radius: 4px;
  background: #04414b;
  color: #ffffff;
  font: 400 19px/1.2 Poppins, Arial, sans-serif;
  text-align: center;
  cursor: pointer;
}

body.page-contact-us .lf-contact-v30-form button[type="submit"]:hover, body.page-contact-us .lf-contact-v30-form button[type="submit"]:focus-visible {
  background: #03545f;
}

body.page-contact-us .lf-contact-v30-form .lf-form-status {
  margin-bottom: 20px;
}

@media (max-width: 767.98px) {
  body.page-contact-us .lf-contact-v30 {
    padding: 42px 0 52px;
  }

  body.page-contact-us .lf-contact-v30-container {
    padding: 0 16px;
  }

  body.page-contact-us .lf-contact-v30-form .form-row {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-bottom: 14px;
  }

  body.page-contact-us .lf-contact-v30-form textarea {
    min-height: 130px;
    height: 130px;
  }

  body.page-contact-us .lf-contact-v30-form button[type="submit"] {
    min-height: 56px;
    font-size: 18px;
  }
}

/* ==========================================================================
   04. FINAL MOBILE / TABLET CONTACT RULES
   ========================================================================== */

@media (max-width: 900px) {
  .lf-contact-hero {
    background-position: center center !important;
  }

  .contact-container {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 767.98px) {

  .lf-contact-hero::before {
    width: 100% !important;
    background: linear-gradient(180deg, rgba(0,34,40,.88), rgba(0,34,40,.9)) !important;
  }
}

@media (max-width: 767.98px) {
  .form-row, .contact-container {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .contact-form {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ==========================================================================
   05. FINAL CONTACT-SPECIFIC RESPONSIVE RULES
   ========================================================================== */

@media (max-width: 900px) {
  .lf-v18-contact-wrap {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 767.98px) {
  body.lf-v18-page .lf-v18-contact-wrap {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}

@media (max-width: 767.98px) {
  .lf-v18-contact-wrap {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  #contact-form, .lf-v18-contact-copy {
    width: 100% !important;
    max-width: 100% !important;
  }
}