.contact-page {
    --contact-ink: #101114;
    --contact-muted: #555b65;
    --contact-rule: #d9dce2;
    --contact-panel: #f7f7f8;
    --contact-accent: #002fa7;
    background: #fff;
    color: var(--contact-ink);
}

.contact-page main { overflow: hidden; }

.contact-hero { padding: clamp(7rem, 10vw, 9rem) 0 clamp(3rem, 5vw, 4.5rem); border-bottom: 1px solid var(--contact-rule); }
.contact-hero__grid, .contact-main__grid { display: grid; grid-template-columns: minmax(20rem, .9fr) minmax(0, 1.1fr); gap: clamp(3rem, 7vw, 7rem); }
.contact-hero__grid { align-items: end; }
.contact-hero h1 { max-width: 12ch; margin: 0; font-size: clamp(3rem, 7vw, 6.6rem); line-height: .92; letter-spacing: -.055em; }
.contact-hero__grid > div:last-child p { max-width: 38rem; color: var(--contact-muted); font-size: clamp(1rem, 1.6vw, 1.15rem); line-height: 1.7; }
.contact-hero__grid > div:last-child p:last-child { margin-bottom: 0; padding-top: 1rem; border-top: 1px solid var(--contact-rule); font-size: .9rem; }

.contact-main { padding: clamp(4.5rem, 9vw, 8rem) 0; }
.contact-main__grid { align-items: start; }
.contact-main__aside { position: sticky; top: 7rem; }
.contact-main__aside h2 { max-width: 13ch; margin: 0; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1; letter-spacing: -.04em; }
.contact-main__aside ul { margin: 2.5rem 0; padding: 0; border-top: 1px solid var(--contact-ink); list-style: none; }
.contact-main__aside li { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--contact-rule); font-size: .88rem; font-weight: 700; line-height: 1.5; }
.contact-main__aside li span { color: var(--contact-accent); }
.contact-main__aside address { display: grid; gap: .6rem; font-style: normal; }
.contact-main__aside address a { width: fit-content; color: var(--contact-accent); font-weight: 700; text-decoration: underline; text-underline-offset: .3em; }

.contact-form-panel { padding: clamp(2rem, 5vw, 4rem); border: 1px solid var(--contact-rule); background: var(--contact-panel); }
.contact-form-panel__heading { margin-bottom: 2rem; padding-bottom: 2rem; border-bottom: 1px solid var(--contact-rule); }
.contact-form-panel__heading h2 { margin: 0; font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1; letter-spacing: -.04em; }
.contact-form-panel__heading > p:last-child { margin: 1rem 0 0; color: var(--contact-muted); font-size: .84rem; }

.contact-status { margin-bottom: 2rem; padding: 1rem 1.25rem; border: 1px solid var(--contact-rule); border-left-width: .35rem; background: #fff; line-height: 1.6; }
.contact-status--success { border-left-color: #147a45; }
.contact-status--error { border-left-color: #b42318; }
.contact-status--warning { border-left-color: #9a6700; }
.contact-status:focus { outline: .2rem solid var(--contact-accent); outline-offset: .2rem; }

#digital-buckeye-contact-form { display: grid; gap: 1.6rem; }
.contact-field { min-width: 0; }
.contact-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.contact-field label, .contact-captcha > p { display: block; margin: 0 0 .35rem; color: var(--contact-ink); font-size: .86rem; font-weight: 700; }
.contact-optional { margin-left: .45rem; color: var(--contact-muted); font-size: .72rem; font-weight: 500; text-transform: uppercase; }
.contact-help, .contact-error, .contact-submit-note { margin: 0 0 .55rem; font-size: .78rem; line-height: 1.55; }
.contact-help, .contact-submit-note { color: var(--contact-muted); }
.contact-error { margin-top: .55rem; color: #9f1710; font-weight: 700; }

.contact-field input, .contact-field select, .contact-field textarea { width: 100%; min-height: 3.25rem; padding: .75rem .9rem; border: 1px solid #777d87; border-radius: 0; background: #fff; color: var(--contact-ink); font: inherit; line-height: 1.4; }
.contact-field textarea { min-height: 12rem; resize: vertical; }
.contact-field input:hover, .contact-field select:hover, .contact-field textarea:hover { border-color: var(--contact-ink); }
.contact-field input:focus-visible, .contact-field select:focus-visible, .contact-field textarea:focus-visible { border-color: var(--contact-accent); outline: .2rem solid var(--contact-accent); outline-offset: .15rem; }
.contact-field [aria-invalid="true"] { border-color: #b42318; box-shadow: inset .25rem 0 0 #b42318; }

.contact-captcha { padding-top: .25rem; }
.contact-captcha__frame { min-height: 5.375rem; max-width: 100%; overflow-x: auto; padding: .25rem 0; }
.contact-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-submit-note { margin: -.75rem 0 0; }
#digital-buckeye-contact-form > .db-button { width: fit-content; min-width: 12rem; }

@media (max-width: 61.998rem) {
    .contact-hero__grid, .contact-main__grid { grid-template-columns: 1fr; }
    .contact-main__aside { position: static; }
}

@media (max-width: 47.998rem) {
    .contact-hero { padding-top: 8rem; }
    .contact-form-panel { margin-inline: calc(var(--db-page-gutter) * -1); border-inline: 0; }
    .contact-field-row { grid-template-columns: 1fr; }
    #digital-buckeye-contact-form > .db-button { width: 100%; }
}