.hp-contact-page { color: var(--hp-ink); }
.hp-contact-intro { display: grid; gap: 18px; padding-block: 56px 52px; border-bottom: 1px solid var(--hp-line); }
.hp-contact-intro h1 { margin: 0; font-size: clamp(36px, 7vw, 72px); font-weight: 500; line-height: 1.02; }
.hp-contact-intro > p:last-child { max-width: 560px; margin: 0; color: var(--hp-muted); font-size: 16px; line-height: 1.55; }
.hp-contact-layout { display: grid; gap: 56px; padding-block: 56px 72px; }
.hp-contact-form, .hp-contact-sidebar { min-width: 0; }
.hp-contact-form { display: grid; gap: 24px; }
.hp-contact-fields { display: grid; gap: 18px; }
.hp-contact-field { position: relative; display: grid; gap: 7px; margin: 0; }
.hp-contact-field label { order: -1; color: var(--hp-muted); font-size: 13px; line-height: 1.3; }
.hp-contact-field :is(input, select, textarea) { width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid var(--hp-line); border-radius: 0; outline: 0; background: var(--hp-paper); color: var(--hp-ink); font: inherit; font-size: 15px; }
.hp-contact-field textarea { min-height: 150px; resize: vertical; }
.hp-contact-field :is(input, select, textarea):focus { border-color: var(--hp-ink); box-shadow: 0 0 0 2px var(--hp-signal); }
.hp-contact-submit { width: fit-content; min-height: 48px; padding: 12px 22px; border: 1px solid var(--hp-ink); border-radius: 0; background: var(--hp-ink); color: var(--hp-paper); font: inherit; font-size: 13px; cursor: pointer; }
.hp-contact-submit:hover, .hp-contact-submit:focus-visible { background: var(--hp-brand); }
.hp-contact-notice { margin: 0; padding: 14px; border: 1px solid var(--hp-line); font-size: 14px; line-height: 1.5; }
.hp-contact-notice ul { margin: 8px 0 0; padding-left: 18px; }
.hp-contact-notice--success { border-color: var(--hp-brand); }
.hp-contact-notice--error { border-color: var(--hp-alert); }
.hp-contact-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.hp-contact-sidebar { display: grid; align-content: start; gap: 22px; padding-top: 1px; border-top: 1px solid var(--hp-ink); }
.hp-contact-sidebar > :first-child { margin-top: 0; }
.hp-contact-sidebar > * { margin-block: 0; }
.hp-contact-sidebar :is(h2, h3) { font-size: 22px; font-weight: 500; line-height: 1.15; }
.hp-contact-sidebar p, .hp-contact-sidebar li { color: var(--hp-muted); font-size: 15px; line-height: 1.6; }
.hp-contact-sidebar ul { display: grid; gap: 10px; margin: 0; padding-left: 18px; }
.hp-contact-sidebar a { color: var(--hp-ink); text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 760px) {
	.hp-contact-intro { padding-block: 82px 72px; }
	.hp-contact-layout { grid-template-columns: minmax(0, 1.35fr) minmax(240px, .65fr); gap: 72px; padding-block: 72px 96px; }
	.hp-contact-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 18px; }
	.hp-contact-field--full { grid-column: 1 / -1; }
}
