/* extensions/messages — the contact form, in the site's own tokens */
.block--contact .block__header { text-align: center; margin-bottom: 2rem; }
.contact__intro { max-width: 40rem; margin-left: auto; margin-right: auto; }
.contact__form { max-width: 40rem; margin: 0 auto; display: flex; flex-direction: column; gap: 1.1rem; }
.contact__row { display: grid; grid-template-columns: 1fr; gap: 1.1rem; }
@media (min-width: 640px) { .contact__row { grid-template-columns: 1fr 1fr; } }
.contact__field { display: flex; flex-direction: column; gap: 0.4rem; }
.contact__label { font-family: var(--font-ui); font-size: 0.85rem; letter-spacing: 0.02em; color: var(--color-neutral-600); }
.contact__input { font-family: var(--font-ui); font-size: 1rem; padding: 0.8rem 0.9rem; border: 1px solid var(--color-neutral-300); border-radius: var(--radius); background: var(--color-surface); color: var(--color-neutral-800); }
.contact__input:focus { outline: none; border-color: var(--color-primary-600); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary-500) 15%, transparent); }
.contact__textarea { resize: vertical; min-height: 9rem; }
.contact__hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.contact__thanks { text-align: center; font-family: var(--font-display); font-size: 1.25rem; color: var(--color-primary-800); max-width: 36rem; margin: 0 auto; }
.contact__error { text-align: center; color: var(--color-danger-700); background: var(--color-danger-50); border: 1px solid var(--color-danger-200); border-radius: var(--radius); padding: 0.7rem 1rem; }
.block--section-bg-dark .contact__label { color: var(--color-neutral-300); }
.block--section-bg-dark .contact__thanks { color: var(--color-on-primary); }

/* ── What a form can also ask: boxes to tick, occasional updates, consent ──── */
.contact__choices { border: 0; padding: 0; margin: 0; display: grid; gap: 0.4rem; }
.contact__choices .contact__label { margin-bottom: 0.4rem; }
.contact__check { display: flex; align-items: flex-start; gap: 0.6rem; font-size: 0.95rem; color: var(--color-neutral-700); cursor: pointer; }
.contact__check input { margin-top: 0.3rem; accent-color: var(--color-primary-700); }
.block--section-bg-dark .contact__check { color: var(--color-on-primary); }
