/* ==========================================================================
   Contact — Contact page
   ========================================================================== */

/* ---- Page layout ---- */
.contact-page .main-wrapper {
  padding-top: 12px;
}

.contact-body {
  background: var(--blue-200);
  overflow: hidden;
  width: 100%;
}

/* ---- Contact content area ---- */
.contact-content {
  padding: 80px 120px 200px;
  display: flex;
  flex-direction: column;
  gap: 60px;
  width: 100%;
}

/* ---- Title ---- */
.contact-content__title {
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 6rem; /* 96px */
  line-height: 1.05;
  letter-spacing: -2.88px;
  color: var(--green-1200);
  max-width: 1178px;
}

/* ---- Two-column layout ---- */
.contact-columns {
  display: flex;
  gap: 142px; /* 720 - 120 (padding) - 458 (left col) = 142 */
}

/* ---- Left: CTA ---- */
.contact-cta {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: flex-start;
  width: 458px;
  flex-shrink: 0;
}

.contact-cta__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.contact-cta__heading {
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 2.375rem; /* 38px */
  line-height: 1.2;
  letter-spacing: -0.76px;
  color: var(--green-1200);
}

.contact-cta__heading--accent {
  color: #017D66;
}

.contact-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px;
  background: var(--base-100);
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 1.125rem; /* 18px */
  line-height: 1.3;
  letter-spacing: -0.18px;
  color: var(--green-1200);
  white-space: nowrap;
}

/* ---- Right: Contact details ---- */
.contact-details {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  width: 580px;
  flex-shrink: 0;
}

.contact-details__group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}

.contact-details__label {
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 1.625rem; /* 26px */
  line-height: 1.4;
  letter-spacing: -0.13px;
  color: var(--green-1200);
}

.contact-details__value {
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 1.625rem; /* 26px */
  line-height: 1.4;
  letter-spacing: -0.13px;
  color: var(--green-1200);
}

.contact-details__link {
  font-family: var(--font-primary);
  font-weight: var(--fw-medium);
  font-size: 1.625rem; /* 26px */
  line-height: 1.4;
  letter-spacing: -0.13px;
  color: #017D66;
}