.site-header nav a:hover,
.site-header nav .nav-active {
  color: var(--orange);
}

.contact-page {
  min-height: calc(100vh - 160px);
  padding: 90px max(5vw, 24px) 110px;
  background: radial-gradient(circle at 88% 8%, rgba(213, 243, 101, .55), transparent 24%);
}

.contact-intro {
  max-width: 760px;
  margin-bottom: 46px;
}

.contact-intro h1 {
  margin: 10px 0 20px;
  font: 500 clamp(3rem, 7vw, 6rem)/.95 Georgia, serif;
  letter-spacing: -.045em;
}

.contact-intro > p:last-child {
  max-width: 650px;
  color: var(--muted);
  font-size: 1.14rem;
}

.contact-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr;
  gap: 18px;
}

.contact-card {
  min-height: 320px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background: var(--white);
  border: 1px solid var(--line);
}

.contact-card-primary {
  background: var(--lime);
}

.contact-card h2 {
  margin: 10px 0;
  font: 500 2rem/1.05 Georgia, serif;
}

.contact-card p:not(.card-kicker) {
  color: var(--muted);
}

.contact-card .button,
.contact-card .text-link {
  margin-top: auto;
}

@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; }
  .contact-card { min-height: 250px; }
}

@media (max-width: 650px) {
  .site-header nav .nav-contact { display: block; }
  .site-header nav { gap: 10px; }
  .site-header nav .nav-contact { font-size: .78rem; }
}