/* contact-us.css — お問い合わせ page (ja/contact-us/) */
/* ---------- contact: context (38%) + form (62%) ---------- */
.contact{display:grid;grid-template-columns:minmax(0,38fr) minmax(0,62fr);gap:64px;align-items:start}
.contact .eyebrow{margin-bottom:16px}
.contact__help{position:sticky;top:calc(var(--header-h) + 32px);padding-top:8px}
.help{margin-top:32px;border-top:1px solid var(--line-strong)}
.help li{padding:24px 0;border-bottom:1px solid var(--line-strong)}
.help b,.offices b{display:block}
.help p,.offices p{margin-top:8px}
.contact__form{padding:48px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-panel)}
.contact__form > h2{margin-bottom:32px}

/* ---------- offices: compact, last ---------- */
.offices__head h2{margin-top:16px}
.offices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;border-top:1px solid var(--line)}
.offices li{padding:24px 0 4px}
.offices__city{display:block;color:var(--accent)}
.offices b{margin-top:12px}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .contact{grid-template-columns:1fr;gap:48px}
  .contact__help{position:static;padding-top:0}
  .contact__help h2 br{display:none}
}
@media (max-width:860px){
  /* keep the context short on phones so the form is reached quickly */
  .contact{gap:32px}
  .help{margin-top:24px}
  .help li{padding:12px 0 16px}
  .help p{display:none}
  .contact__form{padding:32px 24px;border-radius:var(--r-card)}
  .offices{grid-template-columns:1fr}
}