/* contact.css — page-only rules, every selector prefixed .contact- (design-system.md §8.1).
   Layout from specs/contact.md §2.2 / §5: one boxed section (max 1440, padding 50/20 → 50/30 ≤1366 → 40/30 ≤1200
   → 30/20 ≤767) holding two 50/50 columns: info text (Elementor 10px inner padding) and the form card.
   Columns stack at ≤767, info first. Typography and the form controls come from the shared classes in main.css. */

.contact-main{max-width:var(--container-max);margin:0 auto;padding:50px var(--container-pad)}
.contact-main__inner{display:flex;align-items:stretch}
.contact-info{flex:0 0 50%;min-width:0;padding:10px}
.contact-info > *{margin:0}                              /* Elementor widgets: no own margins ... */
.contact-info > * + *{margin-top:var(--widget-gap)}     /* ... 20px widget spacing between them */
.contact-info__link{line-height:1.4}
.contact-info .arrow-link:focus-visible span{text-decoration:underline}
.contact-main__form{flex:0 0 50%;min-width:0}

@media (max-width:1200px){
  .contact-main{padding-block:40px}
}
@media (max-width:767px){
  .contact-main{padding-block:30px}
  .contact-main__inner{flex-direction:column}
  .contact-info,.contact-main__form{flex:0 0 auto;width:100%}
  .contact-main__form{margin-top:20px}
}