/* Contact form section appended by build.py.
   Visually matches the SuccessPath palette:
     --color-m04go011: #FFFCFB  (page bg)
     --color-m03o3as7: #494C99  (deep purple text/heading)
     --color-m03nyz9d: #FE9D5D  (CTA orange) */

.sp-contact {
  background: #FFFCFB;
  color: #494C99;
  padding: 80px 20px;
  font-family: Questrial, Montserrat, system-ui, sans-serif;
}
.sp-contact-inner {
  max-width: 640px;
  margin: 0 auto;
}
.sp-contact h2 {
  font-size: 2.25rem;
  margin: 0 0 12px;
  color: #494C99;
  font-weight: 400;
  line-height: 1.2;
}
.sp-contact > .sp-contact-inner > p {
  margin: 0 0 32px;
  font-size: 1.05rem;
  opacity: 0.85;
}
.sp-contact form { display: grid; gap: 18px; }
.sp-contact label {
  display: grid;
  gap: 6px;
  font-size: 0.95rem;
  font-weight: 600;
}
.sp-contact label > span:first-child { color: #494C99; }
.sp-contact input[type="text"],
.sp-contact input[type="email"],
.sp-contact input[type="tel"],
.sp-contact textarea {
  font: inherit;
  padding: 12px 14px;
  border: 2px solid #E2E0F0;
  border-radius: 8px;
  background: #fff;
  color: #494C99;
  outline: none;
  transition: border-color 0.15s;
  width: 100%;
  box-sizing: border-box;
}
.sp-contact input:focus,
.sp-contact textarea:focus { border-color: #FE9D5D; }
.sp-contact textarea { resize: vertical; min-height: 110px; }
.sp-contact .sp-consent {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: start;
  font-weight: 400;
  font-size: 0.875rem;
  opacity: 0.9;
}
.sp-contact .sp-consent input { margin-top: 4px; }
.sp-contact button[type="submit"] {
  font: inherit;
  font-weight: 600;
  padding: 14px 28px;
  background: #FE9D5D;
  color: #fff;
  border: 2px solid #FE9D5D;
  border-radius: 8px;
  cursor: pointer;
  width: max-content;
  transition: background 0.15s, transform 0.05s;
}
.sp-contact button[type="submit"]:hover { background: #FE8346; border-color: #FE8346; }
.sp-contact button[type="submit"]:active { transform: translateY(1px); }
.sp-contact-fallback {
  margin: 24px 0 0;
  font-size: 0.9rem;
  opacity: 0.7;
}
.sp-contact-fallback a { color: #494C99; }
.sp-contact-thanks {
  padding: 32px;
  border: 2px solid #FE9D5D;
  border-radius: 12px;
  background: #fff;
  text-align: center;
}
.sp-contact-thanks h3 { margin: 0 0 8px; color: #494C99; font-weight: 400; }
.sp-contact-thanks p { margin: 0; color: #494C99; opacity: 0.8; }
.sp-contact-error { margin: 0; color: #C0392B; font-size: 0.95rem; }
.sp-contact-error a { color: #C0392B; }

/* FontAwesome 5 Solid, self-hosted. Used by bullet-list ::marker rules that
   embed FA glyph codepoints (fa-check-circle \f058, fa-times-circle \f057,
   fa-circle \f111) via list-style-type. */
@font-face {
  font-family: "Font Awesome 5 Free";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("/assets/fonts/fa-solid-900.woff2") format("woff2");
}

/* The only FA class used in markup is .fa-times (mobile-nav close button).
   We don't ship the FA class CSS, so render an inline close glyph instead. */
.fa-times::before { content: "\00d7"; font-size: 1.25em; line-height: 1; }

/* --- FAQ accordion (toggle JS lives in main.js) --- */
.hl-faq-child-heading { cursor: pointer; }
.hl-faq-child-panel { transition: height .25s ease, opacity .25s ease; }
.hl-faq-child-heading-icon.fa::before {
  content: "\f078"; /* chevron-down */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  display: inline-block;
  transition: transform .25s ease;
}
.hl-faq-child-heading.active .hl-faq-child-heading-icon.fa::before {
  transform: rotate(180deg);
}

/* --- Footer contact row: Office/Phone/Email blocks are vertically centered in
   equal-height columns, so a value wrapping to two lines (the street address)
   pushes its title out of line with the others. Give the three blocks a common
   min-height so their titles sit on the same baseline. Desktop only — on
   mobile the columns stack and the extra height would just add gaps. */
@media (min-width: 768px) {
  #image-feature-RDOOxZ9-yT,
  #image-feature-rqK6ZYaOcs,
  #image-feature-TsHt1Q1L1S { min-height: 110px; }
}

/* Reveal-on-scroll (replaces GHL's animation runtime) */
[data-animation-class] { opacity: 0; transform: translateY(12px); transition: opacity .6s ease, transform .6s ease; }
[data-animation-class].in-view { opacity: 1; transform: none; }

/* --- Footer bottom row: stack Privacy/PSL + copyright vertically, centered.
   Original layout was a 3-column row (privacy | copyright | "built with"),
   the third column is now empty after we removed the StickyDollar attribution. */
#row-oMGOgwGaC- > .inner {
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px;
}
#row-oMGOgwGaC- > .inner > div {
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
}
/* The "built with StickyDollar" column is now empty — hide it entirely. */
#col-1D2efCVmkp { display: none !important; }
/* Center text inside both remaining columns. */
.cparagraph-SrxPxO8Iyc,
.cparagraph-seRHq4K68b { text-align: center !important; }