/* ==========================================================================
   Contact — /contact/ (spec §41). Red / white / deep navy; the form stays plain.
   ========================================================================== */

.contact-body {
  background: var(--color-ground);
}

.contact-body__inner {
  display: grid;
  gap: 44px;
}

.contact-aside {
  display: grid;
  align-content: start;
  gap: 16px;
}

.contact-aside__title {
  font-size: clamp(24px, 2.2vw, 40px);
  line-height: 1.45;
  color: var(--color-hero-ink);
}

.contact-aside__text {
  line-height: 2;
}

.contact-aside__tel {
  --focus: var(--color-white);
  margin-top: 10px;
  padding: 26px 28px;
  background: var(--color-navy-deep);
  color: var(--color-white);
}

.contact-aside__label {
  font-family: var(--font-sans);
  font-size: 13px;
  letter-spacing: .1em;
}

.contact-aside__tel-number {
  display: inline-block;
  margin-top: 6px;
  font-family: var(--font-en);
  font-size: clamp(28px, 2.4vw, 42px);
  font-weight: 600;
  letter-spacing: .04em;
}

.contact-aside__note {
  margin-top: 6px;
  font-family: var(--font-sans);
  font-size: 13px;
}

.contact-aside__tel .content-required {
  background: transparent;
  color: #ffd9c4;
}

.contact-aside__privacy {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 1.9;
}

.contact-aside__privacy a {
  text-decoration: underline 1px;
  text-underline-offset: .25em;
}

.contact-form {
  padding: clamp(24px, 4vw, 64px);
  border-top: 4px solid var(--color-brand);
  background: var(--color-white);
}

.contact-form .form-summary {
  margin-bottom: 30px;
}

.contact-done {
  display: grid;
  justify-items: start;
  gap: 16px;
}

.contact-done__title {
  font-size: clamp(24px, 2.2vw, 38px);
  line-height: 1.45;
  color: var(--color-hero-ink);
}

@media (min-width: 1024px) {
  .contact-body__inner {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    column-gap: 6vw;
    align-items: start;
  }

  .contact-aside {
    position: sticky;
    top: calc(var(--header-h) + var(--adminbar-h) + 32px);
  }
}
