/* お問い合わせの入力と確認。枠・文字・ボタンは既存の下層ページと共通。 */
.contact-notice { margin: 1.5rem 0; padding: 1rem 1.25rem; border-left: 2px solid var(--gold); color: var(--muted); background: rgb(245 195 75 / .06); }
.contact-steps { display: flex; flex-wrap: wrap; gap: 1rem 2rem; margin: 2rem 0; padding: 0 0 1.25rem; border-bottom: 1px solid var(--line); list-style: none; color: var(--muted); }
.contact-steps li { transition: color .25s var(--ease); }
.contact-steps li[aria-current] { color: var(--gold); }
.contact-steps span { margin-right: .5rem; font-family: var(--mincho); }
.contact-required-note, .contact-field-note { color: var(--muted); font-size: .88rem; }
.contact-field { margin-top: 1.75rem; }
.contact-field label { display: block; margin-bottom: .65rem; font-weight: 700; }
.contact-required { margin-left: .6rem; color: var(--gold); font-size: .76rem; font-weight: 400; }
.contact-field input, .contact-field select, .contact-field textarea { display: block; width: 100%; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: 0; color: var(--paper); background: var(--night); transition: border-color .25s var(--ease), outline-color .25s var(--ease); }
.contact-field textarea { resize: vertical; }
.contact-field input:hover, .contact-field select:hover, .contact-field textarea:hover { border-color: var(--muted); }
.contact-field input:focus-visible, .contact-field select:focus-visible, .contact-field textarea:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-color: var(--gold); }
.contact-field [aria-invalid="true"] { border-color: var(--lantern); }
.contact-field-note { margin: .5rem 0 0; }
.contact-field-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem 1rem; }
.contact-field-error, .contact-error-summary { margin: .5rem 0 0; color: var(--lantern); }
.contact-error-summary { padding: 1rem; border: 1px solid currentColor; }
.contact-form-actions { margin-top: 2rem; }
.contact-confirm h2 { font-family: var(--mincho); font-size: clamp(1.6rem, 3vw, 2.5rem); }
.contact-review { margin: 2rem 0; border-top: 1px solid var(--line); }
.contact-review > div { padding: 1.25rem 0; border-bottom: 1px solid var(--line); }
.contact-review dt { margin-bottom: .5rem; color: var(--gold); font-weight: 700; }
.contact-review dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.contact-work-link { margin-top: 2rem; color: var(--muted); }
.contact-work-link a { color: var(--gold); text-underline-offset: .25em; transition: color .25s var(--ease); }
.contact-work-link a:hover, .contact-work-link a:focus-visible { color: var(--paper); }
.contact-page [hidden] { display: none; }