/* Class-based overrides also size the ID-free section-transition snapshots. */
.contact.section {
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  column-gap:clamp(36px,4vw,76px);
  row-gap:44px;
  align-items:center;
  align-content:center;
  height:auto;
  min-height:calc(100svh - var(--header-height,85px));
  padding:clamp(32px,4svh,56px) clamp(24px,3.5vw,84px);
}
.contact > div,
.contact > form { min-width:0; }
.contact h2 {
  font-size:clamp(64px,7.3vw,140px);
  line-height:1.01;
  letter-spacing:-.015em;
}
.contact > div > p:not(.eyebrow) {
  max-width:580px;
  margin-top:clamp(22px,2.5svh,32px);
  font-size:clamp(19px,1.55vw,24px);
  line-height:1.5;
}
.contact .contact-number {
  max-width:100%;
  margin-top:clamp(24px,3svh,36px);
  padding-bottom:8px;
  font-size:clamp(26px,2.1vw,38px);
  line-height:1.35;
}
.contact > form { width:100%; max-width:none; }
.contact .form-title {
  margin-bottom:clamp(20px,2.5svh,28px);
  font-size:clamp(28px,2.4vw,38px);
  line-height:1.2;
}
.contact form label {
  gap:8px;
  margin-bottom:clamp(14px,1.8svh,20px);
  font-size:clamp(14px,1.05vw,17px);
  line-height:1.35;
}
.contact .form-row {
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:20px;
}
.contact input,
.contact select,
.contact textarea {
  min-width:0;
  min-height:clamp(54px,6.3svh,64px);
  padding:14px 16px;
  font-size:clamp(17px,1.3vw,20px);
  line-height:1.35;
}
.contact textarea {
  min-height:clamp(104px,13svh,144px);
  resize:vertical;
}
.contact form > .button {
  min-height:clamp(58px,7svh,70px);
  padding:17px 22px;
  font-size:clamp(17px,1.35vw,21px);
  line-height:1.25;
}
.contact form > .button span { font-size:28px; }
.contact :focus-visible {
  outline:3px solid var(--ink);
  outline-offset:3px;
}
.contact .form-result { padding:24px; }
.contact .form-result p,
.contact .form-result .text-link,
.contact .form-result button { font-size:16px; line-height:1.45; }
.contact .form-result button { min-height:44px; padding:10px 14px; }
.contact .form-result textarea { min-height:180px; font-size:16px; }

/* Fit the unsubmitted form below the fixed header on shorter desktop screens. */
@media (min-width:1001px) and (max-height:850px) {
  .contact.section { padding-block:20px; }
  .contact h2 { font-size:clamp(58px,6.4vw,110px); }
  .contact > div > p:not(.eyebrow) { font-size:18px; margin-top:18px; }
  .contact .contact-number { font-size:26px; margin-top:22px; }
  .contact .form-title { font-size:28px; margin-bottom:14px; }
  .contact form label { font-size:14px; line-height:1.25; gap:5px; margin-bottom:10px; }
  .contact input,
  .contact select,
  .contact textarea { min-height:46px; padding:10px 14px; font-size:16px; line-height:1.3; }
  .contact textarea { min-height:84px; }
  .contact form > .button { min-height:50px; padding:13px 18px; font-size:17px; }
  .contact .form-result textarea { min-height:160px; }
}

/* The footer shares the final scene, including its transition snapshot. */
@media (min-width:800px) {
  .contact.section {
    --contact-gutter:clamp(24px,3.5vw,84px);
    padding:clamp(20px,3svh,40px) var(--contact-gutter) 0;
    grid-template-rows:1fr auto;
    row-gap:20px;
    align-content:stretch;
    min-height:calc(100dvh - var(--header-height));
  }
  .contact > footer {
    grid-column:1/-1;
    align-self:end;
    margin-inline:calc(-1 * var(--contact-gutter));
    padding:14px var(--contact-gutter);
    gap:12px 20px;
  }
  .contact > footer > .brand > span { display:none; }
  .contact > footer > div { flex-wrap:wrap; gap:12px 20px; }
  .contact > footer a:focus-visible { outline-color:var(--cream); }
}

@media (max-width:1000px) {
  .contact.section {
    grid-template-columns:minmax(0,1fr);
    gap:40px;
    padding:48px clamp(22px,5vw,50px);
  }
  .contact h2 { font-size:clamp(60px,10vw,100px); }
  .contact > div > p:not(.eyebrow) { max-width:640px; font-size:20px; }
  .contact .contact-number { font-size:28px; }
  .contact .form-title { font-size:30px; }
  .contact form label { font-size:15px; }
  .contact input,
  .contact select,
  .contact textarea { font-size:17px; }
}

@media (max-width:720px) {
  .contact.section {
    min-height:calc(100svh - var(--header-height,72px));
    padding:40px 22px 48px;
    gap:34px;
  }
  .contact h2 { font-size:clamp(46px,11.8vw,80px); }
  .contact > div > p:not(.eyebrow) { margin-top:22px; font-size:18px; }
  .contact .contact-number { margin-top:22px; font-size:25px; }
  .contact .form-title { font-size:27px; }
  .contact .form-row { grid-template-columns:minmax(0,1fr); gap:0; }
  .contact input,
  .contact select,
  .contact textarea { font-size:16px; padding:13px 14px; }
  .contact form > .button { gap:16px; font-size:17px; }
  .contact .form-result { padding:18px; }
}

@media (min-width:800px) and (max-width:1000px) {
  .contact.section { padding-inline:var(--contact-gutter); padding-bottom:0; grid-template-rows:auto auto auto; }
}
/* Submission states are shared by desktop and phone layouts. */
.contact .contact-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.contact form > .button:disabled { opacity:.5; cursor:not-allowed; box-shadow:none; transform:none; }
.contact .form-status { margin:10px 0 0; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
.contact .form-status[data-kind="error"] { font-weight:700; }
.contact .form-status[hidden] { display:none; }