/* --------------------------------------------------------------------------
   Gravity Forms — reskinned to match this site's hand-built form inputs
   (see .hero__form / .area__field in their respective blocks). Default GF
   CSS is disabled site-wide (rg_gforms_disable_css option) so these are the
   only form styles in play; targets GF's stable structural classes.
   -------------------------------------------------------------------------- */

.gform_wrapper { color: var(--color-ink); }
.gform_wrapper form { margin: 0; }

.gform_wrapper .gform_heading,
.gform_wrapper .gform_description { display: none; }

.gform_wrapper .gform_body { width: 100%; }

/* GF 2.5+ renders the field list as a <div class="gform_fields">, not the
   legacy <ul> — the old `ul.gform_fields` selector never matched, so every
   form's fields sat flush against each other (review comments 8/11/16).
   12-col grid so GF's own "half width" layout classes also work. */
.gform_wrapper .gform_fields {
    display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 18px 14px; list-style: none; margin: 0; padding: 0;
}

.gform_wrapper .gfield { width: 100%; min-width: 0; grid-column: 1 / -1; }
.gform_wrapper .gfield--width-half { grid-column: span 6; }
.gform_wrapper .gfield--width-third { grid-column: span 4; }
.gform_wrapper .gfield--width-quarter { grid-column: span 3; }
@media (max-width: 640px) {
    .gform_wrapper .gfield--width-half,
    .gform_wrapper .gfield--width-third,
    .gform_wrapper .gfield--width-quarter { grid-column: 1 / -1; }
}
/* Hidden / honeypot fields must not take a grid row (would add phantom gaps). */
.gform_wrapper .gfield--type-honeypot,
.gform_wrapper .gform_validation_container,
.gform_wrapper .gfield_visibility_hidden,
.gform_wrapper .gfield--type-hidden { display: none !important; }

/* Compact hero-style quick forms keep the tighter design rhythm. */
/* Form 1 "Quick Request" (home, service + city heroes) has no visible
   labels, so it keeps the tighter design rhythm wherever it appears. */
#gform_wrapper_1 .gform_fields { gap: 10px; }
#gform_wrapper_1 input,
#gform_wrapper_1 select { margin-bottom: 0 !important; }
.gform_wrapper .gform_footer { margin-top: 18px !important; }
#gform_wrapper_1 .gform_footer { margin-top: 12px !important; }
.gform_wrapper .gfield.gf_inline { display: inline-block; }

.gform_wrapper .gfield_label,
.gform_wrapper legend.gfield_label {
    letter-spacing: 0.1em; color: var(--color-navy);
    text-transform: uppercase; font-size: 12px; font-weight: 800;
    margin: 0 0 6px; display: block;
}

/* No design in this site shows a "(Required)" label suffix anywhere else —
   replace GF's default text with a small red asterisk instead, matching a
   more common, less noisy convention. */
.gform_wrapper .gfield_required_text { font-size: 0; }
.gform_wrapper .gfield_required_text::before {
    content: "*"; font-size: 13px; color: var(--color-red); margin-left: 3px;
}

/* Hero-style compact forms hide labels visually but keep them for a11y */
.gform_wrapper .hmc-form--quick .gfield_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.gform_wrapper input[type="text"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="url"],
.gform_wrapper select,
.gform_wrapper textarea {
    width: 100%; font-family: var(--font-sans); border: 1.5px solid var(--color-line);
    color:var(--color-ink) !important; background: #fbfcfe; border-radius: 9px;
    padding: 11px 12px; font-size: 13.5px; transition: border-color 0.15s, box-shadow 0.15s;
}
/* GF prints rows="10" (~250px); the design uses a compact ~110px box. */
.gform_wrapper textarea { min-height: 90px; height: 110px; resize: vertical; }

.gform_wrapper input:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
    border-color: var(--color-red); outline: none;
    box-shadow: 0 0 0 3px rgba(248,27,38,0.12);
}

/* Name field: two inputs side by side, matching the hand-built first/last row */
.gform_wrapper .ginput_complex { display: flex; gap: 10px; }
.gform_wrapper .ginput_complex > span { flex: 1; display: block; }
.gform_wrapper .ginput_complex .name_first,
.gform_wrapper .ginput_complex .name_last { margin: 0; }
.gform_wrapper .ginput_complex label { display: none; }

/* Checkboxes (adjuster form's "what to test" grid) */
.gform_wrapper .gfield_checkbox {
    grid-template-columns: repeat(2, 1fr); gap: 8px 16px; margin-top: 4px;
    list-style: none; padding: 0; display: grid;
}
.gform_wrapper .gfield_checkbox .gchoice {
    align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600;
    color: var(--color-ink); display: flex;
}
.gform_wrapper .gfield_checkbox input[type="checkbox"] {
    width: 17px; height: 17px; accent-color: var(--color-red); flex-shrink: 0;
}
.gform_wrapper .gfield_checkbox label { margin: 0; font-weight: 600; text-transform: none; letter-spacing: normal; color: var(--color-ink); font-size: 13.5px; }

/* File upload (careers form) */
.gform_wrapper .ginput_container_fileupload {
    border: 1.5px dashed var(--color-line); border-radius: 10px;
    background: #fbfcfe; padding: 14px; text-align: center;
}
.gform_wrapper .ginput_container_fileupload input[type="file"] { width: 100%; font-size: 13px; }

/* Submit button — matches the site's shared .btn.btn-red */
.gform_wrapper .gform_footer {
    margin-top: 4px; padding: 0; display: block;
}
.gform_wrapper .gform_button {
    font-family: var(--font-display); cursor: pointer; white-space: nowrap;
    text-transform: uppercase; border: none !important; border-radius: 999px;
    background: var(--color-red); color: #fff; letter-spacing: 0.12em;
    padding: 15px 28px 13px; font-size: 13px; font-weight: 800;
    box-shadow: 0 12px 26px rgba(248,27,38,0.42) !important;
    transition: transform 0.18s, box-shadow 0.18s;
    width: 100%; display: block;
}
.gform_wrapper .gform_button::before {
    content: ""; display: inline-block; vertical-align: -3px; margin-right: 10px;
    width: 16px; height: 16px; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 2L11 13'/%3E%3Cpath d='M22 2l-7 20-4-9-9-4 20-7z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 2L11 13'/%3E%3Cpath d='M22 2l-7 20-4-9-9-4 20-7z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.gform_wrapper .gform_button, .gform_wrapper .gform_button:hover, .gform_wrapper .gform_button:focus { color: #fff !important; }
.gform_wrapper .gform_button:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(248,27,38,0.55) !important; }

/* Validation */
.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error select,
.gform_wrapper .gfield_error textarea { border-color: var(--color-red); }
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message {
    color: var(--color-red); font-size: 12px; font-weight: 600; margin-top: 4px;
}
.gform_wrapper .gform_validation_errors {
    background: rgba(248,27,38,0.08); border: 1px solid var(--color-red);
    border-radius: 9px; color:var(--color-red) !important; font-size: 13px; font-weight: 600;
    padding: 12px 14px; margin-bottom: 12px;
}
.gform_wrapper .gform_confirmation_message {
    color: var(--color-navy); font-size: 15px; font-weight: 700;
    text-align: center; padding: 20px 0;
}

/* --------------------------------------------------------------------------
   Placement tweak: this site's markup put the eyebrow/heading/subhead
   OUTSIDE the form (hardcoded in each block), then the raw <form> — the GF
   shortcode replaces only that inner <form>, so no extra wrapper spacing
   is needed beyond what the surrounding block CSS already provides.
   -------------------------------------------------------------------------- */
