/* House of Zejd — one layout for every inquiry form (gifting, franchise, activities, contact).
   Header: title · form name · lead.  Card: 1080px, centred.
   Each group is a row: group title on the left, fields on the right in a two-column grid. */

/* header */
#inquire .hz-form-head { text-align: center; max-width: 760px; margin: 0 auto var(--space-8); }
#inquire .hz-form-head .hz-display { font-size: clamp(34px, 3.4vw, 46px); line-height: 1.1; margin: 0 0 var(--space-3); }
#inquire .hz-form-head .hz-eyebrow { display: block; margin: 0 0 var(--space-2); }
#inquire .hz-form-head .hz-lead { font-size: 17px; line-height: 27px; margin: 0; }
#inquire .hz-form-head .hz-fr-form-title { margin-top: var(--space-4); font-size: 16px; line-height: 22px; }
#inquire .hz-form-wrap { max-width: none; }

/* card */
.hz-xform.hz-form-card { max-width: 1080px; margin: 0 auto; padding: var(--space-6) var(--space-10, 40px) var(--space-8); background: var(--surface); border: 1px solid var(--line); }

/* wrappers from older markup should not create their own layout */
.hz-xform .hz-fs-pair, .hz-xform .hz-act-form-row { display: contents; }

/* a group = one row: title left, fields right */
.hz-xform .hz-fs { display: flow-root; margin: 0; padding: var(--space-6) 0; border: 0; border-bottom: 1px solid var(--line); }
.hz-xform .hz-fs:last-of-type { border-bottom: 0; }
.hz-xform .hz-fs > legend { float: left; width: 220px; margin: 0; padding: 4px 0 0; border: 0; font: 400 19px/26px var(--font-display); color: var(--ink); }
.hz-xform .hz-fs > :not(legend) { margin-left: 252px; }
.hz-xform .hz-fs > * + :not(legend) { margin-top: var(--space-4); }

/* the field grid inside a row */
.hz-xform .hz-form, .hz-xform .hz-fr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-5, 20px); }
.hz-xform .hz-field { display: flex; flex-direction: column; gap: 6px; }
.hz-xform .hz-field.full, .hz-xform .hz-q, .hz-xform .hz-fs > .hz-field { grid-column: 1 / -1; }
.hz-xform .hz-field label, .hz-xform .qlabel { font: 700 10px/14px var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.hz-xform .hz-q > .qlabel { display: block; margin-bottom: var(--space-3); }
.hz-xform .hz-field label i, .hz-xform .qlabel i { font-style: normal; color: var(--olive); }
.hz-xform .hz-input { width: 100%; font: 400 15px/22px var(--font-sans); padding: 9px var(--space-3); color: var(--ink); background: var(--surface); border: 1px solid var(--line-strong); border-radius: 2px; }
.hz-xform .hz-input:focus { outline: 2px solid var(--focus); outline-offset: 1px; border-color: var(--focus); }
.hz-xform textarea.hz-input { min-height: 88px; resize: vertical; }
.hz-xform .hz-input:disabled { background: var(--paper-alt); }
.hz-xform .is-off { opacity: .45; }

/* choices: always a horizontal, wrapping row */
.hz-xform .hz-checks { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); margin: 0; }
.hz-xform .hz-check { display: inline-flex; align-items: center; gap: var(--space-2); font-size: 15px; color: var(--ink); cursor: pointer; }
.hz-xform .hz-check input[type="checkbox"], .hz-xform .hz-check input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: var(--olive); }
.hz-xform .hz-check .other { width: 140px; border: 0; border-bottom: 1px solid var(--line-strong); background: transparent; font: inherit; color: var(--ink); padding: 2px 4px; }
.hz-xform .hz-consent { display: flex; flex-direction: column; gap: var(--space-3); }
.hz-xform .hz-consent .hz-check { align-items: flex-start; }
.hz-xform .hz-consent .hz-check input { margin-top: 3px; }

/* actions aligned with the field column */
.hz-xform .hz-form-actions { display: flex; align-items: center; gap: var(--space-6); flex-wrap: wrap; margin: var(--space-6) 0 0 252px; }

/* thank-you */
#inquire .hz-success { max-width: 1080px; margin: var(--space-6) auto 0; }
#inquire .hz-success[hidden] { display: none; }

@media (max-width: 860px) {
  .hz-xform.hz-form-card { padding: var(--space-4) var(--space-4) var(--space-6); }
  .hz-xform .hz-fs > legend { float: none; width: auto; margin-bottom: var(--space-4); }
  .hz-xform .hz-fs > :not(legend) { margin-left: 0; }
  .hz-xform .hz-form, .hz-xform .hz-fr-grid { grid-template-columns: 1fr; }
  .hz-xform .hz-form-actions { margin-left: 0; }
}