/* Distill Works design system, CONTACT page. Loaded with ds-core. Scoped to body.page-contact. */

body.page-contact .contact-hero{padding:64px 0 8px; text-align:center;}
body.page-contact .contact-hero h1{font-size:clamp(34px,4.4vw,50px); line-height:1.06; margin-bottom:16px;}
body.page-contact .contact-hero p{font-size:18px; color:var(--ink-soft); max-width:54ch; margin:0 auto;}

body.page-contact .contact-body{padding:52px 0 80px;}
body.page-contact .contact-grid{display:grid; grid-template-columns:1fr 1.1fr; gap:56px; align-items:start;}
body.page-contact .contact-info h2,body.page-contact .contact-form-card h2{font-size:22px; margin-bottom:24px;}

body.page-contact .contact-detail{margin-bottom:22px;}
body.page-contact .contact-detail strong{display:block; font-size:12.5px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); margin-bottom:4px;}
body.page-contact .contact-detail a,body.page-contact .contact-detail span{font-size:16px; color:var(--ink-soft);}
body.page-contact .contact-detail a{color:var(--green);}

body.page-contact .what-happens{margin-top:30px; padding-top:26px; border-top:1px solid var(--hair);}
body.page-contact .what-happens h3{font-size:16px; margin-bottom:14px;}
body.page-contact .what-happens ol{margin:0; padding-left:20px;}
body.page-contact .what-happens li{font-size:15px; color:var(--ink-soft); margin-bottom:10px;}

body.page-contact .contact-form-card{border:1px solid var(--hair); border-radius:8px; padding:32px 30px; background:var(--card);}
body.page-contact #char-count{display:block; text-align:right; font-size:12px; color:var(--muted); margin-top:6px;}

@media (max-width:880px){
  body.page-contact .contact-grid{grid-template-columns:1fr; gap:36px;}
}