.contact-page {
  min-height: 680px;
  display: grid;
  grid-template-columns: minmax(310px, .78fr) minmax(0, 1.22fr);
  align-items: start;
  gap: clamp(52px, 7.5vw, 104px);
  padding-block: clamp(62px, 8vw, 96px) clamp(82px, 9vw, 116px);
}

.contact-intro { max-width: 500px; padding-top: 18px; }
.contact-intro h1 { max-width: 500px; margin-bottom: 22px; font-size: clamp(46px, 4.6vw, 64px); }
.contact-lead { max-width: 470px; margin-bottom: 31px; color: #464b4a; font-size: 17px; line-height: 1.65; }

.volume-note {
  max-width: 455px;
  padding: 20px 22px;
  border-top: 2px solid var(--terracotta);
  background: #f1ede7;
}

.volume-note p { margin: 0; color: #414645; font-size: 14px; line-height: 1.55; }
.volume-note p + p { margin-top: 7px; color: #565a58; font-size: 12px; }
.volume-note strong { color: var(--terracotta-dark); }

.inquiry-panel { min-width: 0; }
.contact-form { padding: clamp(28px, 4vw, 46px); border: 0; border-radius: 12px; background: #fffdf9; box-shadow: 0 16px 38px rgba(73, 61, 49, .09); }
.form-grid { gap: 19px 22px; }
.form-field label,
.checkbox-field legend { color: var(--ink); font-size: 13px; font-weight: 750; }
.checkbox-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.checkbox-field legend { padding: 0; }
.required-cue { margin-left: 7px; color: var(--terracotta-dark); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.field-help { margin: 4px 0 10px; color: #595d5b; font-size: 12px; line-height: 1.5; }

.checkbox-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.checkbox-options label { min-height: 48px; display: flex; align-items: center; gap: 11px; padding: 10px 12px; border: 1px solid #aaa39a; border-radius: 6px; background: #fff; cursor: pointer; }
.checkbox-options label:has(input:checked) { border-color: var(--teal-dark); background: rgba(42, 157, 143, .08); }
.checkbox-options input { width: 21px; height: 21px; flex: 0 0 auto; margin: 0; accent-color: var(--teal-dark); }
.checkbox-options input:focus-visible { outline: 3px solid rgba(42, 157, 143, .3); outline-offset: 3px; }
.checkbox-options span { font-size: 14px; font-weight: 600; }
.checkbox-field[aria-invalid="true"] .checkbox-options { outline: 2px solid #9e382f; outline-offset: 3px; border-radius: 5px; }

.quantity-field input { max-width: 190px; }
.form-field textarea { min-height: 142px; }
.field-error { display: flex; align-items: center; min-height: 19px; margin-top: 4px; line-height: 1.4; }
.field-error:not(:empty)::before { content: "!"; width: 17px; height: 17px; display: inline-grid; place-items: center; flex: 0 0 auto; margin-right: 6px; border-radius: 50%; background: #8b2f28; color: #fff; font-size: 11px; font-weight: 800; }

.form-field input[type="file"] { padding: 10px; font-size: 14px; }
.field-help a { color: var(--teal-dark); font-weight: 700; }
.submit-reassurance { max-width: 300px; margin: 0; color: #595d5b; font-size: 12px; line-height: 1.5; }
.form-status { min-height: 23px; margin: 10px 0 0; }
.privacy-note { margin: 9px 0 0; color: #5b5e5c; font-size: 12px; }
.privacy-note a { color: var(--teal-dark); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }

.form-success { min-height: 420px; padding: clamp(42px, 7vw, 76px); border-radius: 12px; background: #f1ede7; box-shadow: 0 16px 38px rgba(73, 61, 49, .09); }
.form-success h2 { margin-bottom: 15px; font-size: clamp(40px, 4vw, 54px); }
.form-success > p:not(.eyebrow) { max-width: 430px; margin-bottom: 0; color: #484d4c; font-size: 16px; line-height: 1.65; }
[hidden] { display: none !important; }

@media (max-width: 980px) {
  .contact-page { min-height: auto; grid-template-columns: 1fr; gap: 47px; padding-block: 64px 92px; }
  .contact-intro { max-width: 680px; padding-top: 0; }
  .contact-intro h1 { max-width: 650px; }
  .contact-lead { max-width: 620px; }
  .volume-note { max-width: 620px; }
}

@media (max-width: 620px) {
  .contact-page { gap: 38px; padding-block: 50px 74px; }
  .contact-intro h1 { font-size: clamp(41px, 12vw, 52px); }
  .contact-lead { margin-bottom: 25px; font-size: 16px; }
  .volume-note { padding: 17px 18px; }
  .contact-form { padding: 25px 18px 27px; }
  .checkbox-options { grid-template-columns: 1fr 1fr; gap: 8px; }
  .checkbox-options label { padding-inline: 10px; }
  .quantity-field input { max-width: none; }
  .form-submit { align-items: stretch; flex-direction: column; gap: 10px; margin-top: 19px; }
  .form-submit .button { width: 100%; }
  .submit-reassurance { max-width: none; }
  .form-success { min-height: 360px; padding: 43px 26px; }
}
