/* ============================================================
   Gravity Forms 3.x, dressed in the Steelspace brand.

   GF 3 ships the "orbital" theme framework, which drives every colour,
   radius and spacing through CSS custom properties. Overriding individual
   declarations means fighting its specificity on every GF release, so this
   file re-declares the variables instead and only adds structure where GF
   has no variable for it.

   Tokens come from lp.css, enqueued first.
   ============================================================ */

.fcard .gform_wrapper{
  /* buttons */
  --gf-ctrl-btn-bg-color-primary:var(--azure);
  --gf-ctrl-btn-bg-color-hover-primary:#1B8DF0;
  --gf-ctrl-btn-border-color-primary:transparent;
  --gf-ctrl-btn-color-primary:#fff;
  --gf-ctrl-btn-radius:2px;
  --gf-ctrl-btn-font-size:15px;
  --gf-ctrl-btn-padding-x:26px;
  --gf-ctrl-btn-padding-y:15px;

  /* inputs */
  --gf-ctrl-bg-color:var(--field);
  --gf-ctrl-border-color:var(--rule);
  --gf-ctrl-border-color-hover:#C9C5C0;
  --gf-ctrl-border-color-focus:var(--azure);
  --gf-ctrl-radius:2px;
  --gf-ctrl-color:var(--ink);
  --gf-ctrl-font-size:15px;
  --gf-ctrl-padding-x:13px;
  --gf-ctrl-padding-y:12px;

  /* labels and descriptions */
  --gf-ctrl-label-color-primary:var(--ink);
  --gf-ctrl-label-color-secondary:var(--ink-2);
  --gf-ctrl-label-font-size:13px;
  --gf-ctrl-desc-color:var(--ink-3);
  --gf-ctrl-desc-font-size:12px;

  /* accents and state */
  --gf-color-primary:var(--azure);
  --gf-color-primary-contrast:#fff;
  --gf-color-danger:#C4302B;

  /* rhythm */
  --gf-form-gap-y:22px;
  --gf-field-gap-y:16px;
  --gf-field-gap-x:16px;
}

/* ---------- structure GF has no variable for ---------- */

.fcard .gform_wrapper{margin:0}
.fcard .gform_wrapper form{margin:0}
.fcard .gform_heading{display:none}

/* the submit button spans the card */
.fcard .gform_wrapper .gform_footer{margin:22px 0 0;padding:0;display:block}
.fcard .gform_wrapper .gform_footer .gform_button{
  width:100%;
  font-family:var(--ff-body);
  font-weight:700;
  letter-spacing:-.005em;
  cursor:pointer;
}
.fcard .gform_wrapper .gform_footer .gform_button:active{transform:translateY(1px)}

/* labels keep the brand weight */
.fcard .gform_wrapper .gfield_label{font-weight:600;letter-spacing:0;margin-bottom:7px}
.fcard .gform_wrapper .gfield_required{color:var(--azure)}
.fcard .gform_wrapper .gfield_required .gfield_required_text{display:none}
/* Optional marker, injected from plugin.php off the field's isRequired flag.
   Muted so the label still reads as the label, not as two competing labels. */
.fcard .gform_wrapper .sslp-opt{font-weight:400;font-size:.86em;color:var(--ink-3);letter-spacing:0;text-transform:none}

.fcard .gform_wrapper textarea{min-height:112px;resize:vertical}

/* validation summary, toned to the palette */
.fcard .gform_wrapper .gform_validation_errors{
  background:#FDF2F1;border:1px solid #EFC9C6;border-radius:2px;
  box-shadow:none;padding:14px 16px;margin:0 0 20px;
}
.fcard .gform_wrapper .gform_validation_errors h2{
  font-family:var(--ff-body);font-size:14px;font-weight:600;
  color:#A32620;margin:0;letter-spacing:0;
}
.fcard .gform_wrapper .gform_validation_errors h2::before,
.fcard .gform_wrapper .gform_validation_errors .gform-icon{display:none}

/* captcha: the label adds nothing for a v3 invisible widget */
.fcard .gform_wrapper .gfield--type-captcha .gfield_label{display:none}

/* hidden fields and the honeypot must never take layout space */
.fcard .gform_wrapper .gform_validation_container,
.fcard .gform_wrapper .gfield--type-hidden{display:none !important}

/* ---------- budget: the number field becomes a range slider ----------
   lp.js hides the native number input (it stays as the submitted value)
   and inserts the readout, the range and the scale. */
.fcard .gfield.sslp-budget .ginput_container_number{position:relative}
.fcard .sslp-budget-native{
  position:absolute;opacity:0;width:1px;height:1px;
  padding:0;border:0;pointer-events:none;
}
.fcard .sslp-rng-top{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;margin:0 0 12px;
}
.fcard .sslp-rng-out{
  font-family:var(--ff-display);font-weight:700;font-size:1.2rem;
  letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;
}
.fcard input[type=range].sslp-rng{
  -webkit-appearance:none;appearance:none;
  width:100%;height:22px;padding:0;margin:0;
  background:transparent;border:0;box-shadow:none;cursor:pointer;
}
.fcard input[type=range].sslp-rng::-webkit-slider-runnable-track{height:4px;background:var(--rule);border-radius:2px}
.fcard input[type=range].sslp-rng::-moz-range-track{height:4px;background:var(--rule);border-radius:2px}
.fcard input[type=range].sslp-rng::-moz-range-progress{height:4px;background:var(--azure);border-radius:2px}
.fcard input[type=range].sslp-rng::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:20px;height:20px;margin-top:-8px;border-radius:50%;
  background:var(--white);border:2px solid var(--azure);
  box-shadow:0 1px 3px rgba(20,19,18,.2);
}
.fcard input[type=range].sslp-rng::-moz-range-thumb{
  width:16px;height:16px;border-radius:50%;
  background:var(--white);border:2px solid var(--azure);
  box-shadow:0 1px 3px rgba(20,19,18,.2);
}
.fcard input[type=range].sslp-rng:focus-visible{outline:2px solid var(--azure);outline-offset:4px}
.fcard .sslp-rng-scale{
  display:flex;justify-content:space-between;
  font-size:12px;color:var(--ink-3);margin-top:9px;
  font-variant-numeric:tabular-nums;
}

/* privacy line under the button */
.fcard .sslp-fnote{
  font-size:12px;color:var(--ink-3);
  margin:12px 0 0;text-align:center;line-height:1.45;
}
.fcard .sslp-fnote a{color:var(--ink-2)}

/* ============================================================
   Element-level overrides.

   Some GF variables are declared deeper than the wrapper, so setting them
   above has no effect. Rather than guess where, these rules target the
   elements directly at (0,3,x) specificity, which beats every framework
   selector GF ships without needing !important.
   ============================================================ */

.fcard .gform_wrapper.gform-theme .gform_fields{
  row-gap:16px;
  column-gap:16px;
}

.fcard .gform_wrapper.gform-theme input[type=text],
.fcard .gform_wrapper.gform-theme input[type=email],
.fcard .gform_wrapper.gform-theme input[type=tel],
.fcard .gform_wrapper.gform-theme input[type=number],
.fcard .gform_wrapper.gform-theme textarea{
  background:var(--field);
  border:1px solid var(--rule);
  border-radius:2px;
  color:var(--ink);
  font-family:var(--ff-body);
  font-size:15px;
  line-height:1.4;
  padding:12px 13px;
  height:auto;
  min-height:0;
  box-shadow:none;
  transition:border-color .16s var(--ease),background .16s var(--ease);
}
.fcard .gform_wrapper.gform-theme input[type=text]:hover,
.fcard .gform_wrapper.gform-theme input[type=email]:hover,
.fcard .gform_wrapper.gform-theme input[type=tel]:hover,
.fcard .gform_wrapper.gform-theme textarea:hover{border-color:#C9C5C0}
.fcard .gform_wrapper.gform-theme input[type=text]:focus,
.fcard .gform_wrapper.gform-theme input[type=email]:focus,
.fcard .gform_wrapper.gform-theme input[type=tel]:focus,
.fcard .gform_wrapper.gform-theme textarea:focus{
  background:var(--white);
  border-color:var(--azure);
  outline:2px solid var(--azure);
  outline-offset:2px;
}
.fcard .gform_wrapper.gform-theme textarea{min-height:112px}

.fcard .gform_wrapper.gform-theme .gfield_label{
  color:var(--ink);
  font-family:var(--ff-body);
  font-size:13px;
  font-weight:600;
  letter-spacing:0;
  margin:0 0 7px;
  line-height:1.35;
}
.fcard .gform_wrapper.gform-theme .gfield_description{
  color:var(--ink-3);
  font-size:12px;
  line-height:1.45;
  padding:6px 0 0;
}
.fcard .gform_wrapper.gform-theme .gfield_validation_message,
.fcard .gform_wrapper.gform-theme .validation_message{
  background:none;border:0;padding:6px 0 0;margin:0;
  font-size:12px;color:#C4302B;
}

.fcard .gform_wrapper.gform-theme .gform_footer{
  display:block;
  margin:22px 0 0;
  padding:0;
}
.fcard .gform_wrapper.gform-theme .gform_footer .gform_button{
  display:block;
  width:100%;
  background:var(--azure);
  color:#fff;
  border:1px solid transparent;
  border-radius:2px;
  font-family:var(--ff-body);
  font-size:15px;
  font-weight:700;
  letter-spacing:-.005em;
  padding:15px 26px;
  height:auto;
  min-height:0;
  cursor:pointer;
  transition:background .18s var(--ease),transform .18s var(--ease);
}
.fcard .gform_wrapper.gform-theme .gform_footer .gform_button:hover{background:#1B8DF0}
.fcard .gform_wrapper.gform-theme .gform_footer .gform_button:active{transform:translateY(1px)}

/* ------------------------------------------------------------
   The submit button, and only the submit button, needs !important.

   Diagnosed on GF 3.0.3: the theme reset ships mega-selectors of the form
   :where(:not(html):not(iframe)...) carrying !important. :where() adds no
   specificity, so no normal declaration can win, however specific. The
   variable route and a (0,5,1) element rule were both tried first and both
   lost. Four properties, scoped to this one element.
   ------------------------------------------------------------ */
.fcard .gform_wrapper.gform-theme .gform_footer .gform_button{
  display:block !important;
  width:100% !important;
  font-size:15px !important;
  padding:15px 26px !important;
  line-height:1.2 !important;
  height:auto !important;
}

/* dropdown: added when "How did you hear about us?" became a select */
.fcard .gform_wrapper.gform-theme select{
  width:100%;
  background:var(--field);
  border:1px solid var(--rule);
  border-radius:2px;
  color:var(--ink);
  font-family:var(--ff-body);
  font-size:15px;
  line-height:1.4;
  padding:12px 34px 12px 13px;
  height:auto;min-height:0;box-shadow:none;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%237A7A7A' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 13px center;
  background-size:11px;
  transition:border-color .16s var(--ease),background-color .16s var(--ease);
}
.fcard .gform_wrapper.gform-theme select:hover{border-color:#C9C5C0}
.fcard .gform_wrapper.gform-theme select:focus{
  background-color:var(--white);border-color:var(--azure);
  outline:2px solid var(--azure);outline-offset:2px;
}