/* Marketing Lead final form hardening — 2026-09-06
   Loaded after all legacy/page styles. Keeps every consultation form vertical, readable and responsive. */
:root{--ml-form-orange:#e88932;--ml-form-orange2:#f59a45;--ml-form-pink:#ef6ba8;--ml-form-purple:#765de8;--ml-form-ink:#101828;--ml-form-muted:#6f7181;--ml-form-border:#e4e1e6}

/* Shell must never inherit horizontal flex rules from legacy panels. */
.ml-form-shell,
#contact .elg-panel.ml-form-shell,
#contact .dev-panel.ml-form-shell,
#contact .sem-panel.ml-form-shell,
#contact .smm-panel.ml-form-shell,
.ml-consult-card.ml-form-shell,
.lead-card.ml-form-shell,
.lead-form-card.ml-form-shell{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  padding:30px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  border:1px solid rgba(232,137,50,.26)!important;
  border-radius:26px!important;
  background:linear-gradient(155deg,#fff 0%,#fffdfb 60%,#faf7ff 100%)!important;
  box-shadow:0 24px 60px rgba(16,24,40,.10)!important;
}
.ml-form-shell:before{content:""!important;display:block!important;position:absolute!important;inset:0 0 auto!important;height:3px!important;background:linear-gradient(90deg,var(--ml-form-purple),var(--ml-form-pink),var(--ml-form-orange))!important}
.ml-form-shell{position:relative!important}

.ml-panel-form-intro{display:block!important;width:100%!important;max-width:none!important;margin:0 0 20px!important;padding:0!important}
.ml-panel-form-intro .ml-form-kicker{display:inline-flex!important;margin:0 0 10px!important}
.ml-panel-form-intro h3{display:block!important;width:100%!important;max-width:none!important;margin:0 0 8px!important;color:var(--ml-form-ink)!important;font-size:clamp(24px,2.2vw,30px)!important;line-height:1.18!important;letter-spacing:-.035em!important}
.ml-panel-form-intro p{display:block!important;width:100%!important;max-width:none!important;margin:0!important;color:var(--ml-form-muted)!important;font-size:14px!important;line-height:1.7!important}

form.ml-consultation-form,
form[data-ml-form="consultation"],
form[action*="send-mail"]{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:14px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  position:relative!important;
  align-items:start!important;
  align-content:start!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}

/* Honeypot stays outside layout. */
form[data-ml-form="consultation"]>div[aria-hidden="true"],
form[action*="send-mail"]>div[aria-hidden="true"]{
  position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;
  padding:0!important;margin:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;
}

form[data-ml-form="consultation"]>label,
form[action*="send-mail"]>label{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important
}

form.ml-consultation-form input:not([type="hidden"]),
form.ml-consultation-form select,
form.ml-consultation-form textarea,
form[data-ml-form="consultation"] input:not([type="hidden"]),
form[data-ml-form="consultation"] select,
form[data-ml-form="consultation"] textarea,
form[action*="send-mail"] input:not([type="hidden"]),
form[action*="send-mail"] select,
form[action*="send-mail"] textarea{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  box-sizing:border-box!important;
  border:1px solid var(--ml-form-border)!important;
  border-radius:14px!important;
  background:#fff!important;
  color:var(--ml-form-ink)!important;
  font:500 15px/1.45 Poppins,Arial,sans-serif!important;
  box-shadow:0 4px 14px rgba(16,24,40,.035)!important;
  outline:none!important;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
}
form.ml-consultation-form input:not([type="hidden"]),
form.ml-consultation-form select,
form[data-ml-form="consultation"] input:not([type="hidden"]),
form[data-ml-form="consultation"] select,
form[action*="send-mail"] input:not([type="hidden"]),
form[action*="send-mail"] select{height:58px!important;padding:0 16px!important}
form.ml-consultation-form textarea,
form[data-ml-form="consultation"] textarea,
form[action*="send-mail"] textarea{min-height:160px!important;height:160px!important;padding:15px 16px!important;resize:vertical!important;overflow:auto!important}
form.ml-consultation-form input::placeholder,form.ml-consultation-form textarea::placeholder,
form[data-ml-form="consultation"] input::placeholder,form[data-ml-form="consultation"] textarea::placeholder,
form[action*="send-mail"] input::placeholder,form[action*="send-mail"] textarea::placeholder{color:#8b8793!important;opacity:1!important}
form.ml-consultation-form input:focus,form.ml-consultation-form select:focus,form.ml-consultation-form textarea:focus,
form[data-ml-form="consultation"] input:focus,form[data-ml-form="consultation"] select:focus,form[data-ml-form="consultation"] textarea:focus,
form[action*="send-mail"] input:focus,form[action*="send-mail"] select:focus,form[action*="send-mail"] textarea:focus{
  border-color:rgba(232,137,50,.82)!important;box-shadow:0 0 0 4px rgba(232,137,50,.10),0 6px 18px rgba(16,24,40,.04)!important
}

/* Full-width fields after the first name/phone row. */
form.ml-consultation-form input[name="email"],
form.ml-consultation-form input[name="website"],
form.ml-consultation-form select,
form.ml-consultation-form textarea,
form.ml-consultation-form button[type="submit"],
form[data-ml-form="consultation"] input[name="email"],
form[data-ml-form="consultation"] input[name="website"],
form[data-ml-form="consultation"] select,
form[data-ml-form="consultation"] textarea,
form[data-ml-form="consultation"] button[type="submit"],
form[action*="send-mail"] input[name="email"],
form[action*="send-mail"] input[name="website"],
form[action*="send-mail"] select,
form[action*="send-mail"] textarea,
form[action*="send-mail"] button[type="submit"]{grid-column:1/-1!important}

form.ml-consultation-form button[type="submit"],
form[data-ml-form="consultation"] button[type="submit"],
form[action*="send-mail"] button[type="submit"]{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;
  width:100%!important;min-width:0!important;min-height:58px!important;height:auto!important;margin:0!important;padding:14px 20px!important;
  border:0!important;border-radius:14px!important;color:#fff!important;background:linear-gradient(100deg,#f6a047 0%,#ef8b31 52%,#ff6577 100%)!important;
  font:750 15px/1.25 Poppins,Arial,sans-serif!important;text-align:center!important;white-space:normal!important;cursor:pointer!important;
  box-shadow:0 16px 30px rgba(232,137,50,.22)!important
}
form.ml-consultation-form button[type="submit"]:hover,
form[data-ml-form="consultation"] button[type="submit"]:hover,
form[action*="send-mail"] button[type="submit"]:hover{transform:translateY(-1px)!important;box-shadow:0 20px 36px rgba(232,137,50,.28)!important}

.ml-form-privacy{
  display:block!important;width:100%!important;max-width:none!important;margin:11px 0 0!important;padding:0!important;
  text-align:center!important;color:#777181!important;font:500 11px/1.55 Poppins,Arial,sans-serif!important;float:none!important;position:static!important
}
.ml-form-privacy a{color:var(--ml-form-purple)!important;font-weight:700!important;text-decoration:none!important}

/* Expert Leads and other hub split sections: keep copy and card balanced, but never compress the form. */
@media(min-width:981px){
  #contact .elg-split,#contact .dev-split,#contact .sem-split,#contact .smm-split{align-items:start!important}
  #contact .elg-panel.ml-form-shell,#contact .dev-panel.ml-form-shell,#contact .sem-panel.ml-form-shell,#contact .smm-panel.ml-form-shell{align-self:start!important;height:auto!important}
  #contact .elg-panel.ml-form-shell{min-width:0!important}
}
@media(max-width:760px){
  .ml-form-shell,#contact .elg-panel.ml-form-shell,#contact .dev-panel.ml-form-shell,#contact .sem-panel.ml-form-shell,#contact .smm-panel.ml-form-shell{padding:22px!important;border-radius:22px!important}
  form.ml-consultation-form,form[data-ml-form="consultation"],form[action*="send-mail"]{grid-template-columns:1fr!important;gap:12px!important}
  form.ml-consultation-form input:not([type="hidden"]),form.ml-consultation-form select,form.ml-consultation-form textarea,form.ml-consultation-form button[type="submit"],
  form[data-ml-form="consultation"] input:not([type="hidden"]),form[data-ml-form="consultation"] select,form[data-ml-form="consultation"] textarea,form[data-ml-form="consultation"] button[type="submit"],
  form[action*="send-mail"] input:not([type="hidden"]),form[action*="send-mail"] select,form[action*="send-mail"] textarea,form[action*="send-mail"] button[type="submit"]{grid-column:1!important}
  .ml-panel-form-intro h3{font-size:24px!important}
}

/* MASTER PROMPT: defeat higher-specificity legacy panel flex rules. */
#contact.elg-section .elg-panel.ml-form-shell,
#contact.dev-section .dev-panel.ml-form-shell,
#contact.sem-section .sem-panel.ml-form-shell,
#contact.smm-section .smm-panel.ml-form-shell,
#contact.ml-consult-section .ml-consult-card.ml-form-shell,
#contact .elg-panel.ml-form-shell,
#contact .dev-panel.ml-form-shell,
#contact .sem-panel.ml-form-shell,
#contact .smm-panel.ml-form-shell{
  display:block!important;
  flex-direction:initial!important;
  align-items:initial!important;
  justify-content:initial!important;
}
#contact.elg-section .elg-panel.ml-form-shell form[data-ml-form="consultation"],
#contact.dev-section .dev-panel.ml-form-shell form[data-ml-form="consultation"],
#contact.sem-section .sem-panel.ml-form-shell form[data-ml-form="consultation"],
#contact.smm-section .smm-panel.ml-form-shell form[data-ml-form="consultation"],
#contact.ml-consult-section .ml-consult-card.ml-form-shell form[data-ml-form="consultation"]{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}


/* COMPACT NATURAL-HEIGHT FORMS — 2026-09-06
   Remove dead vertical space while preserving the approved two-column desktop layout. */
form.ml-consultation-form input:not([type="hidden"]),
form.ml-consultation-form select,
form[data-ml-form="consultation"] input:not([type="hidden"]),
form[data-ml-form="consultation"] select,
form[action*="send-mail"] input:not([type="hidden"]),
form[action*="send-mail"] select{height:54px!important;padding:0 15px!important}
form.ml-consultation-form textarea,
form[data-ml-form="consultation"] textarea,
form[action*="send-mail"] textarea{height:132px!important;min-height:132px!important;padding:14px 15px!important}
form.ml-consultation-form button[type="submit"],
form[data-ml-form="consultation"] button[type="submit"],
form[action*="send-mail"] button[type="submit"]{min-height:54px!important;padding:13px 18px!important}
.ml-form-shell,
#contact .elg-panel.ml-form-shell,
#contact .dev-panel.ml-form-shell,
#contact .sem-panel.ml-form-shell,
#contact .smm-panel.ml-form-shell,
.ml-consult-card.ml-form-shell,
.lead-card.ml-form-shell,
.lead-form-card.ml-form-shell{height:auto!important;min-height:0!important;padding:28px!important;align-self:start!important}
.ml-form-privacy{margin:8px 0 0!important;padding:0!important}
/* Contact page: do not stretch the form card to the height of the copy column. */
.hero .hero-grid>.form-box.ml-form-shell{
  align-self:start!important;height:auto!important;min-height:0!important;max-height:none!important;
}
.hero .hero-grid>.form-box.ml-form-shell form[data-ml-form="consultation"]{height:auto!important;min-height:0!important;flex:none!important}
/* Generic two-column consultation sections should size to their content, not the taller copy column. */
.ml-consult-wrap{align-items:start!important}
.ml-consult-wrap>.ml-form-shell{align-self:start!important;height:auto!important;min-height:0!important}
/* Hub forms remain natural-height. */
#contact .elg-split,#contact .dev-split,#contact .sem-split,#contact .smm-split{align-items:start!important}
#contact .elg-panel.ml-form-shell,#contact .dev-panel.ml-form-shell,#contact .sem-panel.ml-form-shell,#contact .smm-panel.ml-form-shell{align-self:start!important;height:auto!important;min-height:0!important}
/* Do not use auto margins to manufacture balanced height inside any form card. */
.ml-form-shell .ml-form-privacy{margin-top:8px!important}
@media(max-width:760px){
  .ml-form-shell,#contact .elg-panel.ml-form-shell,#contact .dev-panel.ml-form-shell,#contact .sem-panel.ml-form-shell,#contact .smm-panel.ml-form-shell{padding:20px!important}
  form.ml-consultation-form textarea,form[data-ml-form="consultation"] textarea,form[action*="send-mail"] textarea{height:120px!important;min-height:120px!important}
}


/* FINAL DEAD-SPACE REMOVAL — 2026-09-06
   Service hero forms often use .lead-form-box#contact rather than .form-box. */
.hero .hero-grid>.lead-form-box.ml-form-shell,
.hero .hero-grid>div#contact.lead-form-box.ml-form-shell{
  align-self:start!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}
.hero .hero-grid>.lead-form-box.ml-form-shell form[data-ml-form="consultation"],
.hero .hero-grid>div#contact.lead-form-box.ml-form-shell form[data-ml-form="consultation"]{
  height:auto!important;
  min-height:0!important;
  flex:none!important;
}
/* Override older high-specificity generic-card padding and paragraph margins. */
.ml-consult-card.ml-form-shell{padding:26px!important;height:auto!important;min-height:0!important}
.ml-form-shell>p.ml-form-privacy,
#contact .ml-form-shell>p.ml-form-privacy,
.ml-consult-card.ml-form-shell>p.ml-form-privacy,
.lead-form-box.ml-form-shell>p.ml-form-privacy{
  margin:8px 0 0!important;
  padding:0!important;
}
