/* Contact uses the approved editorial tokens; no separate palette or fonts. */
.contact-main {
  display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1fr);
  gap:clamp(40px,8vw,112px); align-items:start; padding-block:64px 80px;
}
.contact-eyebrow { color:var(--muted); font:var(--type-label); margin-bottom:16px; }
.contact-copy h1 { font:var(--type-display); letter-spacing:-.035em; }
.contact-copy>p:not(.contact-eyebrow) { max-width:28ch; color:var(--soft); margin-top:20px; font-size:18px; }
.contact-back { display:inline-flex; align-items:center; min-height:44px; margin-top:26px; color:var(--accent); font-size:14px; }
.contact-back:hover { text-decoration:underline; text-underline-offset:5px; }
.contact-panel { min-width:0; }
.contact-return { padding-block:6px 24px; border-top:1px solid var(--rule); }
.contact-return[hidden],#contact-form[hidden],.contact-restore[hidden] { display:none; }
.contact-return-mark { display:block; color:var(--accent); font-size:32px; margin:18px 0 20px; }
.contact-return h2 { font:var(--type-project); letter-spacing:-.025em; margin-bottom:18px; }
.contact-return h2:focus { outline:none; }
.contact-return>p { max-width:43ch; color:var(--soft); line-height:1.7; }
.contact-return-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; margin-top:28px; }
.contact-restore { min-height:44px; padding:8px 0; border:0; background:transparent; color:var(--muted); font:inherit; font-size:13px; text-align:left; text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
.contact-restore:hover { color:var(--ink); }
.contact-error { padding:14px 16px; border:1px solid var(--rule); border-radius:var(--radius-small); margin-bottom:28px; color:var(--soft); font-size:14px; }
.contact-trap { display:none; }
.contact-field { margin-bottom:24px; }
.contact-field label { display:block; margin-bottom:8px; font-size:15px; font-weight:500; }
.contact-field label span { color:var(--muted); font-size:13px; font-weight:400; margin-left:4px; }
.contact-field input,.contact-field textarea {
  display:block; width:100%; min-width:0; min-height:48px; padding:11px 13px;
  color:var(--ink); background:var(--surface); border:1px solid var(--rule);
  border-radius:var(--radius-small); font:var(--type-body);
}
.contact-field textarea { resize:vertical; min-height:176px; }
.contact-field input:focus-visible,.contact-field textarea:focus-visible {
  outline:2px solid var(--focus); outline-offset:2px; border-color:var(--focus);
}
.contact-hint { margin-top:7px; color:var(--muted); font-size:12px; }
.contact-send { display:flex; align-items:center; gap:18px; padding-top:4px; }
.contact-send button { gap:12px; flex:none; }
.contact-send button:disabled { opacity:.5; cursor:not-allowed; }
.contact-send button:disabled:hover { background:var(--ink); border-color:var(--ink); color:var(--page); }
#contact-privacy { max-width:25ch; color:var(--muted); font-size:12px; line-height:1.5; }
#contact-privacy a { text-decoration:underline; text-underline-offset:3px; }
.contact-page .site-nav a[aria-current] { color:var(--ink); }
@media (max-width:760px) {
  .contact-main { grid-template-columns:1fr; gap:32px; padding-block:36px 48px; }
  .contact-copy>p:not(.contact-eyebrow) { max-width:34ch; font-size:16px; margin-top:14px; }
  .contact-back { margin-top:12px; }
  .contact-send { align-items:flex-start; }
  .contact-page .site-header { gap:16px; }
  .contact-page .site-nav { gap:16px; }
  .contact-page .site-nav a { display:inline-flex; }
  .contact-page .theme-control { padding-left:0; }
  .contact-page #theme-label { display:none; }
}
@media (max-width:400px) {
  .contact-send { flex-direction:column; gap:12px; }
  #contact-privacy { max-width:none; }
}

