@charset "UTF-8";

.has-open-modal { overflow: hidden; }
.contact-modal { width: min(46rem,calc(100% - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; color: var(--ink); background: var(--paper); border: 3px solid var(--ink); }
.contact-modal::backdrop { background: rgb(0 0 0 / 68%); }
.contact-modal__panel { position: relative; padding: clamp(1.5rem,4vw,3rem); }
.contact-modal__close { position: absolute; top: 1rem; right: 1rem; display: grid; width: 3.4rem; height: 3.4rem; padding: 0; place-items: center; border: 3px solid var(--ink); border-radius: 50%; color: var(--ink); background: var(--paper); font-family: Arial, sans-serif; font-size: 2.5rem; line-height: 1; cursor: pointer; transition: color 180ms ease, background-color 180ms ease, transform 180ms ease; }
.contact-modal__close:hover, .contact-modal__close:focus-visible { color: var(--paper); background: var(--ink); transform: rotate(8deg); }
.contact-modal .eyebrow { margin: 0 0 1.25rem; text-transform: uppercase; font-size: .875rem; font-variation-settings: "wght" 700,"wdth" 120,"slnt" 15; }
.contact-modal h2 { margin-bottom: 2rem; }
.contact-form { display: grid; gap: .7rem; }
.contact-form label { margin-top: .55rem; text-transform: uppercase; font-size: .8rem; font-variation-settings: "wght" 700,"wdth" 120,"slnt" 15; }
.contact-form input, .contact-form textarea { width: 100%; padding: .85rem 0; color: var(--ink); background: transparent; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; font: inherit; font-size: 1rem; }
.contact-form textarea { resize: vertical; }
.contact-form input:focus, .contact-form textarea:focus { outline: 3px solid var(--focus); outline-offset: 3px; }
.contact-form__trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-form__footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.25rem; }
.contact-form__status { margin: 0; font-size: .9rem; }
.contact-form button:disabled { cursor: wait; opacity: .55; }
.contact-form.is-sent > label, .contact-form.is-sent > input, .contact-form.is-sent > textarea, .contact-form.is-sent > .contact-form__trap, .contact-form.is-sent .contact-form__footer .button { display: none; }
.contact-form.is-sent .contact-form__footer { display: block; min-height: 16rem; margin: 0; padding: clamp(2rem,6vw,5rem) 0; }
.contact-form.is-sent .contact-form__status { max-width: 36rem; font-size: clamp(2.5rem,5.5vw,5rem); line-height: .98; letter-spacing: -.04em; font-variation-settings: "wght" 300,"wdth" 120,"slnt" 6; }
.contact-modal.is-sent .contact-modal__panel { display: grid; min-height: min(32rem,calc(100dvh - 2rem)); place-items: center; }
.contact-modal.is-sent .contact-modal__panel > .eyebrow, .contact-modal.is-sent .contact-modal__panel > h2 { display: none; }
.contact-modal.is-sent .contact-form { width: 100%; }
.contact-modal.is-sent .contact-form__footer { min-height: 0; padding: 0; }
.contact-modal.is-sent .contact-form__status { margin-inline: auto; text-align: center; }

.contact-page .contact-intro { padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.contact-page .contact-intro h1 {
    color: var(--ink);
    font-size: clamp(1.785rem, 2.975vw, 2.6775rem);
    font-variation-settings: "wght" 700, "wdth" 150, "slnt" 15;
}
.contact-page .contact-intro .home-intro-description { padding-top: 0; font-size: clamp(.84rem, 1.4vw, 1.225rem); line-height: 1.25; }
.contact-page .project-kicker > span:first-child {
    color: var(--ink);
    font-variation-settings: "wght" 700, "wdth" 120, "slnt" -15;
}
.contact-page-form { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 7vw, 6.25rem); padding: clamp(1.5rem, 3vw, 2.5rem) var(--page-gutter) var(--section-space); }
.contact-page-form::before { position: absolute; top: clamp(1.5rem, 3vw, 2.5rem); bottom: var(--section-space); left: 50%; border-left: 1px solid var(--ink); content: ""; }
.contact-page-form > .contact-form { grid-column: 2; width: 100%; }
.contact-page .contact-form { gap: .15rem; }
.contact-page .contact-form label {
    margin-top: .1rem;
    font-size: 1.05rem;
    font-variation-settings: "wght" 500, "wdth" 120, "slnt" 15;
}
.contact-page .contact-form input,
.contact-page .contact-form textarea {
    padding-block: .4rem;
    font-size: 1.05rem;
    font-variation-settings: "wght" 300, "wdth" 120, "slnt" -15;
}
.contact-page .contact-form__footer { margin-top: .5rem; }
.contact-recruiter-callout { grid-column: 1; align-self: start; }
.contact-recruiter-callout h2 {
    max-width: 28rem;
    margin: 0 0 1.5rem;
    color: var(--ink);
    font-size: clamp(1.428rem, 2.975vw, 3.12375rem);
    line-height: .98;
    letter-spacing: -.04em;
    text-transform: none;
    font-variation-settings: "wght" 500, "wdth" 120, "slnt" 6;
}
.contact-recruiter-callout .button,
.contact-page .contact-form .button { min-height: 1.753rem; padding: .414rem .893rem; border-width: 1.913px; font-size: .638rem; }

@media (max-width: 768px) {
    .contact-page-form { grid-template-columns: 1fr; }
    .contact-page-form::before { display: none; }
    .contact-page-form > .contact-form { grid-column: 1; }
    .contact-recruiter-callout { grid-column: 1; }
    .contact-recruiter-callout h2 { font-size: 1.8564rem; }
    .contact-form__footer { align-items: stretch; flex-direction: column; }
    .contact-page .contact-form__footer .button { align-self: flex-start; width: auto; }
}