.contact-page { --contact-paper: #e5e0d6; --contact-ink: #11110f; }

.contact-hero { display: grid; grid-template-columns: .88fr 1.12fr; min-height: 100svh; padding-top: 77px; }
.contact-intro { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: clamp(100px, 11vw, 175px) var(--pad) 80px; background: var(--black); }
.contact-eyebrow { display: flex; align-items: center; gap: 14px; margin: 0 0 46px; font-size: 9px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; }
.contact-eyebrow > span { width: 38px; height: 1px; background: var(--gold); }
.contact-intro h1 { margin: 0; font-family: var(--display); font-size: clamp(78px, 9vw, 148px); font-weight: 300; line-height: .76; letter-spacing: -.06em; }
.contact-intro h1 em { display: inline-block; margin-left: clamp(25px, 5vw, 80px); color: var(--paper); font-weight: 300; }
.contact-lede { max-width: 540px; margin: 50px 0 0 clamp(15px, 4vw, 70px); color: rgba(255, 255, 255, .6); font-family: var(--display); font-size: clamp(19px, 1.55vw, 24px); line-height: 1.52; }

.direct-contact { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 18px; margin-top: auto; padding-top: clamp(70px, 9vw, 135px); }
.direct-contact > div { padding-top: 15px; border-top: 1px solid rgba(255, 255, 255, .2); }
.direct-contact span { display: block; margin-bottom: 9px; color: rgba(255, 255, 255, .38); font-size: 8px; letter-spacing: .15em; text-transform: uppercase; }
.direct-contact a, .direct-contact p { margin: 0; color: rgba(255, 255, 255, .8); font-family: var(--display); font-size: clamp(15px, 1.2vw, 18px); }
.direct-contact a { display: inline-block; border-bottom: 1px solid transparent; transition: border-color .25s ease; }
.direct-contact a:hover { border-color: rgba(255, 255, 255, .45); }

.inquiry-panel { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: clamp(85px, 9vw, 145px) clamp(30px, 6vw, 105px) clamp(75px, 8vw, 120px); color: var(--contact-ink); background: var(--contact-paper); }
.inquiry-heading > p:first-child { display: flex; justify-content: space-between; margin: 0 0 35px; color: #777068; font-size: 8px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.inquiry-heading h2 { margin: 0; font-family: var(--display); font-size: clamp(48px, 5vw, 82px); font-weight: 300; line-height: .9; letter-spacing: -.05em; }
.inquiry-heading h2 em { color: #837b71; font-weight: 300; }
.inquiry-context { margin: 22px 0 0; padding: 12px 14px; color: #625c55; border-left: 2px solid var(--gold); background: rgba(255, 255, 255, .26); font-family: var(--display); font-size: 16px; }

.inquiry-form { margin-top: clamp(48px, 6vw, 82px); }
.field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); }
.inquiry-form label { display: block; min-width: 0; margin-bottom: 34px; }
.inquiry-form label > span { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; color: #6e675f; font-size: 8px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.inquiry-form label b { color: #8f6c42; font-weight: 500; }
.inquiry-form label small { color: #9b948b; font-size: 7px; }
.inquiry-form input, .inquiry-form select, .inquiry-form textarea { width: 100%; margin: 0; padding: 8px 0 13px; color: var(--contact-ink); border: 0; border-bottom: 1px solid rgba(17, 17, 15, .28); border-radius: 0; outline: 0; background: transparent; font: 300 18px/1.4 var(--display); transition: border-color .25s ease; }
.inquiry-form input:focus, .inquiry-form select:focus, .inquiry-form textarea:focus { border-color: var(--contact-ink); }
.inquiry-form select { cursor: pointer; }
.inquiry-form textarea { min-height: 110px; resize: vertical; }
.inquiry-form textarea::placeholder { color: #928b82; opacity: 1; }
.message-field { margin-top: 5px; }
.form-actions { display: flex; align-items: center; gap: 24px; margin-top: 10px; }
.form-actions button, .client-entry-copy .client-login-link { display: flex; align-items: center; justify-content: space-between; gap: 50px; min-width: 250px; padding: 18px 20px; color: white; border: 0; background: var(--contact-ink); font-size: 9px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; cursor: pointer; transition: background .25s ease; }
.form-actions button:hover { background: var(--violet); }
.form-actions p { max-width: 160px; margin: 0; color: #817a72; font-size: 10px; line-height: 1.5; }

.client-entry { display: grid; grid-template-columns: 1.35fr .65fr; align-items: end; gap: clamp(55px, 9vw, 150px); padding: clamp(100px, 12vw, 185px) var(--pad); border-top: 1px solid var(--line); background: var(--black); }
.client-entry h2 { margin: 0; font-family: var(--display); font-size: clamp(58px, 7vw, 112px); font-weight: 300; line-height: .86; letter-spacing: -.055em; }
.client-entry h2 em { color: var(--paper); font-weight: 300; }
.client-entry-copy > p { max-width: 430px; margin: 0 0 32px; color: rgba(255, 255, 255, .6); font-family: var(--display); font-size: clamp(18px, 1.6vw, 23px); line-height: 1.5; }
.client-entry-copy .client-login-link { width: 100%; color: var(--black); background: var(--ivory); }
.client-entry-copy .client-login-link:hover { color: white; background: var(--violet); }
.client-entry-copy small { display: block; margin-top: 12px; color: rgba(255, 255, 255, .36); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }

@media (max-width: 1100px) {
  .contact-hero { grid-template-columns: .8fr 1.2fr; }
  .direct-contact { grid-template-columns: 1fr; }
  .client-entry { grid-template-columns: 1fr 320px; }
}

@media (max-width: 820px) {
  .contact-hero { display: block; padding-top: 69px; }
  .contact-intro { min-height: 760px; padding-top: 115px; }
  .contact-intro h1 { font-size: clamp(80px, 21vw, 120px); }
  .contact-lede { margin-left: 0; }
  .direct-contact { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 100px; padding-top: 0; }
  .inquiry-panel { padding-top: 95px; }
  .client-entry { grid-template-columns: 1fr; }
  .client-entry-copy { max-width: 520px; }
}

@media (max-width: 560px) {
  .contact-intro { min-height: 720px; }
  .contact-intro h1 { font-size: clamp(74px, 23vw, 100px); }
  .contact-intro h1 em { margin-left: 22px; }
  .direct-contact { grid-template-columns: 1fr; gap: 25px; margin-top: 85px; }
  .inquiry-panel { padding-right: var(--pad); padding-left: var(--pad); }
  .inquiry-heading h2 { font-size: 52px; }
  .field-row { grid-template-columns: 1fr; gap: 0; }
  .form-actions { align-items: flex-start; flex-direction: column; }
  .form-actions button { width: 100%; }
  .form-actions p { max-width: none; }
  .client-entry h2 { font-size: 59px; }
  .client-entry-copy .client-login-link { min-width: 0; }
}
