/* ============================================================
   Contact Page
   Page: #contact
   Single-column form, centered, max-width for readability.
   ============================================================ */

/* max-width via main.narrow (04-layout.css) gesetzt
   Card-Look für form/fieldset/legend kommt zentral aus 03-forms.css
   (main.narrow form:has(fieldset) etc.) — hier nur noch page-spezifische
   Layouts (2-col Personal-Data Grid, Submit-Position, Legal-Override). */

/* Descendant (nicht > ): bei beigefügten Sections steckt der Header im
   .narrow-Wrapper, ist also kein direktes Kind von #contact mehr. */
#contact header {
  margin-block-end: var(--gap-section);
}

/* --- Two-column field grid on tablet+ --- */

@media (min-width: 45rem) {
  #contact fieldset[data-section="personal-data"] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2) var(--gap-inline);
  }

  /* Grid-Items: keine eigenen Margins, das Grid-Gap stellt den Abstand —
     überschreibt label+input/label-Regeln aus 03-forms.css. */
  #contact fieldset[data-section="personal-data"] > * {
    margin-block-end: 0;
  }

  /* Legend + salutation span full width */
  #contact fieldset[data-section="personal-data"] legend,
  #contact fieldset[data-section="personal-data"] > label:first-of-type,
  #contact fieldset[data-section="personal-data"] > label:first-of-type + select,
  #contact fieldset[data-section="personal-data"] > div[data-field="company"] {
    grid-column: 1 / -1;
  }
}

/* Legal-Fieldset-Style ist jetzt global in 03-forms.css — der lokale
   #contact-Override wurde entfernt (war Redundanz). */

/* --- Submit button: linksbündig, kompakt --- */

#contact button[type="submit"] {
  align-self: flex-start;
  min-width: 12rem;
}

/* Result-Message-Styling jetzt global in 03-forms.css (.form-result + .success/.error) */