.contact-page { overflow: hidden; color: #f4f2ee; background: #090909; }
.contact-page .menu-toggle { border-color: rgb(0 0 0 / .12); color: var(--color-black); background: rgb(255 255 255 / .92); box-shadow: 0 8px 28px rgb(0 0 0 / .08); }
.contact-page .menu-toggle:hover { background: rgb(255 255 255 / 1); }
.contact-page .contact-wordmark { top: 0; left: 0; color: var(--color-black); --dock-progress: 1; --morph-font-size: clamp(18px, 1.45vw, 23px); --morph-gap: .21em; --morph-tracking: .01em; --morph-accent-tracking: .01em; --morph-weight: 700; --morph-x: var(--gutter); --morph-y: calc((var(--header-height) - 1.05rem) / 2); visibility: visible; pointer-events: auto; transform: translate3d(var(--morph-x), var(--morph-y), 0); }
.contact-page .contact-wordmark::before { border-color: rgb(0 0 0 / .12); background: rgb(255 255 255 / .92); box-shadow: 0 8px 28px rgb(0 0 0 / .08); }
.contact-main { min-height: 100vh; }
.contact-hero, .contact-form-section { width: min(100% - (var(--gutter) * 2), var(--content-max)); margin-inline: auto; }
.contact-hero { display: grid; min-height: min(82vh, 58rem); grid-template-columns: minmax(0, 1.35fr) minmax(16rem, .65fr); gap: clamp(2rem, 8vw, 9rem); align-items: end; padding-block: clamp(8rem, 16vh, 13rem) clamp(5rem, 10vw, 9rem); border-bottom: 1px solid rgb(255 255 255 / .16); }
.contact-eyebrow { color: #ed1b2f; font: 800 .7rem/1 var(--font-heading); letter-spacing: .14em; text-transform: uppercase; }
.contact-eyebrow span { color: rgb(255 255 255 / .48); }
.contact-hero h1 { max-width: 10ch; margin-top: 2.5rem; color: #f4f2ee; font-size: clamp(4.2rem, 10vw, 11rem); letter-spacing: -.09em; line-height: .82; }
.contact-hero h1 em { color: #ed1b2f; font-style: normal; }
.contact-lead { max-width: 27rem; margin-top: 2.5rem; color: rgb(255 255 255 / .65); font-size: clamp(1rem, 1.4vw, 1.25rem); line-height: 1.45; }
.contact-details { padding-bottom: .4rem; }
.contact-email { display: inline-flex; gap: 1rem; align-items: center; color: #f4f2ee; font-size: clamp(1.2rem, 2vw, 2rem); font-weight: 700; letter-spacing: -.04em; }
.contact-email span { color: #ed1b2f; font-size: .8em; transition: transform 300ms var(--ease-out); }
.contact-email:hover span { transform: translate(.3rem, -.3rem); }
.contact-details p { max-width: 19rem; margin-top: 1.5rem; color: rgb(255 255 255 / .48); font-size: .85rem; line-height: 1.55; }
.contact-form-section { display: grid; min-height: 100svh; grid-template-columns: .7fr 1.3fr; gap: clamp(2rem, 9vw, 10rem); align-items: start; padding-block: clamp(14rem, 22vh, 18rem) 3rem; }
.contact-form-heading h2 { max-width: none; margin-top: 0; color: #f4f2ee; font-size: clamp(4rem, 7vw, 8rem); letter-spacing: -.075em; line-height: .84; text-transform: uppercase; }
.contact-form-heading h2 span, .contact-form-heading h2 em { display: block; }
.contact-form-heading h2 em { color: #ed1b2f; font-style: normal; }
.contact-form-contact { display: grid; gap: .7rem; margin-top: 3rem; }
.contact-form-contact > span { color: rgb(255 255 255 / .5); font: 800 .62rem/1 var(--font-heading); letter-spacing: .12em; text-transform: uppercase; }
.contact-form-contact a { display: inline-flex; gap: .8rem; align-items: center; color: #f4f2ee; font-size: clamp(1rem, 1.5vw, 1.35rem); font-weight: 700; }
.contact-form-contact i { color: #f4f2ee; font-size: .9em; font-style: normal; transition: color 220ms ease, transform 300ms var(--ease-out); }
.contact-form-contact a:hover { color: #ed1b2f; }
.contact-form-contact a:hover i { color: #ed1b2f; transform: translate(.25rem, -.25rem); }
.contact-form { display: grid; gap: 1.25rem; }
.contact-form label { display: grid; gap: .65rem; }
.contact-form label span { color: rgb(255 255 255 / .5); font: 800 .62rem/1 var(--font-heading); letter-spacing: .12em; text-transform: uppercase; }
.contact-form input, .contact-form textarea { width: 100%; border: 0; border-bottom: 1px solid rgb(255 255 255 / .3); border-radius: 0; padding: .65rem 0; outline: 0; resize: vertical; color: #f4f2ee; background: transparent; font: inherit; transition: border-color 220ms ease; }
.contact-form input:focus, .contact-form textarea:focus { border-color: #ed1b2f; }
.contact-submit { display: inline-flex; width: fit-content; min-height: 3.25rem; gap: 2rem; align-items: center; justify-content: space-between; margin-top: .25rem; border: 1px solid #ed1b2f; padding: .8rem 1.2rem; color: #f4f2ee; background: #ed1b2f; font: 800 .68rem/1 var(--font-heading); letter-spacing: .12em; text-transform: uppercase; transition: color 240ms ease, background 240ms ease; }
.contact-submit i { font-size: 1.3rem; font-style: normal; transition: transform 300ms var(--ease-out); }
.contact-submit:hover { color: #ed1b2f; background: transparent; }
.contact-submit:hover i { transform: translate(.3rem, -.3rem); }
@media (max-width: 767px) { .contact-form-section { display: block; min-height: 100svh; padding-block: 14rem 2rem; } .contact-form-heading h2 { margin-bottom: 2rem; } .contact-form { gap: 1rem; } }