@layer pages{
  main.contact{display:flex;flex-direction:column;min-height:var(--view-height);
    --page-content-gap:var(--space-3)}
  main.contact>.page-body{flex:1;display:grid;place-items:center}
  .contact-box{width:min(100%,640px)}
  .contact-form{width:100%;box-sizing:border-box}
  .trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
  .contact-foot{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}
  .contact-foot .notice{margin:0;flex:1 1 14ch}
  .contact-hint{margin:var(--space-3) 0 0;padding-top:var(--space-3);
    background:var(--rule-top);
    font-size:14px;line-height:1.55;color:var(--text-muted)}
  .contact-hint a{color:var(--text);text-decoration:underline;text-decoration-color:var(--rule-line)}
  .contact-hint a:hover{color:var(--heading)}
  @media (max-width:900px){
    .contact-box{width:auto}
    main.contact{min-height:0}
    main.contact>.page-body{display:block}
  }
}