/* =========================================================================
   Contact, /contact/ (page-contact.php). Rebuilt 5 Nov 2026.
   Tokens from patterns.css. Zero radius, no shadows on fields.
   ========================================================================= */

.shq-contact{ padding:56px 0 104px; }
.shq-contact__grid{ display:grid; grid-template-columns:minmax(0, 1.5fr) minmax(0, 1fr); gap:72px; align-items:start; }

.shq-contact__title{ margin:0 0 28px; font-family:var(--shq-display); font-weight:700; font-size:clamp(1.5rem, 2.2vw, 1.875rem); letter-spacing:-.02em; color:var(--shq-ink); }
.shq-contact__pair{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:0 24px; }

.shq-field{ margin:0 0 22px; }
.shq-field label{ display:flex; justify-content:space-between; gap:12px; margin:0 0 8px; font-size:15px; font-weight:600; color:var(--shq-ink); }
.shq-field__req{ font-family:var(--shq-data); font-size:11px; font-weight:400; color:var(--shq-graphite); }
.shq-field__hint{ margin:-2px 0 10px; font-size:14px; line-height:1.5; color:var(--shq-ink-soft); }
.shq-field input,
.shq-field textarea{
  display:block; width:100%; box-sizing:border-box; margin:0; padding:13px 14px;
  font:inherit; font-size:16px; line-height:1.4; color:var(--shq-ink);
  background:#fff; border:1px solid var(--shq-rule); border-radius:0;
  transition:border-color 150ms ease;
}
.shq-field textarea{ resize:vertical; min-height:150px; }
.shq-field input:focus,
.shq-field textarea:focus{ border-color:var(--shq-ink); outline:2px solid var(--shq-ink); outline-offset:1px; }
.shq-field [aria-invalid="true"]{ border-color:var(--shq-trace); }

.shq-contact__acts{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 24px; margin-top:8px; }
.shq-contact__acts .shq-btn[disabled]{ opacity:.6; cursor:progress; }
.shq-contact__note{ margin:0; font-size:11px; color:var(--shq-graphite); max-width:36ch; }
.shq-contact__note a{ color:inherit; }

.shq-contact__alert{ margin:0 0 24px; padding:14px 16px; border-left:3px solid var(--shq-trace); background:var(--shq-paper-2); font-size:15px; color:var(--shq-ink); }
.shq-contact__done{ padding:8px 0 0 24px; border-left:2px solid var(--shq-trace); outline:none; }
.shq-contact__done .shq-mono{ margin:0 0 10px; font-size:11px; color:var(--shq-graphite); }
.shq-contact__done .shq-sec-h{ margin:0 0 12px; }

.shq-contact__card{ padding:24px; background:var(--shq-paper-2); border-top:2px solid var(--shq-ink); }
.shq-contact__card .shq-mono{ margin:0 0 10px; font-size:11px; color:var(--shq-trace); }
.shq-contact__card p:last-child{ margin:0; font-size:15px; line-height:1.55; color:var(--shq-ink-soft); }
.shq-contact__chan{ margin:28px 0 0; }
.shq-contact__chan div{ padding:14px 0; border-top:1px solid var(--shq-rule-soft); }
.shq-contact__chan dt{ font-size:11px; color:var(--shq-graphite); margin:0 0 4px; }
.shq-contact__chan dd{ margin:0; font-size:15px; line-height:1.5; color:var(--shq-ink); }
.shq-contact__chan a{ color:var(--shq-ink); }

@media (hover: hover) and (pointer: fine){
  .shq-field input:hover,
  .shq-field textarea:hover{ border-color:var(--shq-graphite); }
}
@media (max-width:900px){
  .shq-contact{ padding:40px 0 72px; }
  .shq-contact__grid{ grid-template-columns:minmax(0, 1fr); gap:48px; }
}
@media (max-width:600px){
  .shq-contact__pair{ grid-template-columns:minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce){
  .shq-field input, .shq-field textarea{ transition:none; }
}