/* T&D Tree — GoHighLevel form styling (add to master/417.css).
   The GHL form renders inside an <iframe class="td-ghl-form">, so most inner
   styling must be set in the GHL form builder (Styles tab). Match these:
     - Font: Inter; Field bg #fff; Border #e2d6bf 1px; radius 10px
     - Label color #242220; Input text #242220; placeholder #8a877e
     - Submit button bg #c0392b (red), hover #9c2b20, text #fff, radius 100px, bold
     - Field spacing 14px; form max-width 100%
   The wrapper styling below is what you control on the page. */
.td-formcard{background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:clamp(22px,4vw,38px);box-shadow:0 18px 50px -22px rgba(23,23,23,.28)}
.td-formcard h3{font-family:var(--serif);font-size:1.5rem;color:#171717;margin:0 0 6px}
.td-formcard p.sub{color:#67645d;margin:0 0 20px;font-size:.95rem}
.td-ghl-form{width:100%;min-height:620px;border:none;border-radius:12px;display:block;background:#fbf9f3}
/* If you embed via GHL's <div> + script instead of iframe, these hit the real fields: */
.td-ghl input,.td-ghl textarea,.td-ghl select{width:100%;font-family:var(--sans);font-size:16px;
  color:#242220;background:#fff;border:1px solid #e2d6bf;border-radius:10px;padding:13px 15px;margin-bottom:14px;transition:border-color .2s,box-shadow .2s}
.td-ghl input:focus,.td-ghl textarea:focus,.td-ghl select:focus{outline:none;border-color:#c0392b;box-shadow:0 0 0 3px rgba(192,57,43,.15)}
.td-ghl label{display:block;font-size:13px;font-weight:600;color:#242220;margin-bottom:6px}
.td-ghl button[type=submit],.td-ghl .btn{width:100%;background:#c0392b;color:#fff;border:0;
  border-radius:100px;padding:16px;font-family:var(--sans);font-size:16px;font-weight:700;cursor:pointer;transition:.2s}
.td-ghl button[type=submit]:hover,.td-ghl .btn:hover{background:#9c2b20;transform:translateY(-1px)}