.hero h1,
.statement h2,
.contact h2,
.page-intro h1 {
  font-size: clamp(36px, 5vw, 72px) !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}

.hero h1 em,
.statement h2 em,
.contact h2 em,
.page-intro h1 em {
  font-family: var(--sans) !important;
  font-style: normal !important;
  letter-spacing: -0.04em !important;
}

.statement {
  display: block !important;
}

.statement h2 {
  max-width: none !important;
  margin-top: 42px !important;
  font-size: clamp(28px, 3.4vw, 48px) !important;
}

.statement-meta {
  display: grid !important;
  grid-template-columns: 1fr 3fr !important;
  margin-top: 48px !important;
}

.statement-meta p {
  max-width: none !important;
  width: 100% !important;
  font-size: 16px !important;
  grid-column: 1 / -1 !important;
}

.page-intro {
  display: block !important;
}

.page-intro h1,
.page-lead {
  max-width: none !important;
}

.about-page .page-intro h1 {
  font-size: clamp(34px, 4vw, 58px) !important;
}

.about-copy,
.detail-list,
.contact-details {
  margin-left: 0 !important;
  max-width: none !important;
}

.about-page .about-copy p {
  font-size: clamp(18px, 2vw, 28px) !important;
  font-weight: 400 !important;
}

.wordmark {
  font-size: 24px !important;
  color: var(--acid) !important;
}

.home-page .header-note {
  padding-top: 12px;
}

.hero-brand {
  position: absolute;
  top: 120px;
  left: 30px;
  z-index: 2;
  color: var(--acid);
  font-size: clamp(42px, 7vw, 106px);
  font-weight: 700;
  letter-spacing: -0.08em;
  line-height: 0.78;
}

.home-page .hero {
  padding-top: 150px;
}

.statement {
  padding-top: 70px !important;
  padding-bottom: 75px !important;
}

.statement-meta {
  margin-top: 28px !important;
  padding-top: 28px !important;
}

.projects,
.services {
  padding-top: 18px !important;
  padding-bottom: 30px !important;
}

.section-heading {
  margin-bottom: 24px !important;
}

.project-large {
  margin-bottom: 70px !important;
}

.project-grid {
  margin-bottom: 80px !important;
}

.services {
  padding-bottom: 85px !important;
}

.service {
  min-height: 82px !important;
}

.service-list {
  border-top: 0 !important;
}

.service {
  border-bottom: 0 !important;
}

.contact {
  min-height: 70vh !important;
}

.page-main {
  padding-top: 125px !important;
  padding-bottom: 70px !important;
}

.page-intro {
  padding-bottom: 60px !important;
}

.page-project img {
  height: 30vw !important;
  max-height: 400px !important;
  object-fit: cover !important;
}

.about-copy {
  padding-top: 24px !important;
}

.detail-list section {
  padding-top: 22px !important;
  padding-bottom: 26px !important;
}

@media (min-width: 701px) {
  .page-projects {
    grid-template-columns: 1fr 1fr !important;
    gap: 34px 24px !important;
  }

  .page-project:nth-child(even) {
    padding-top: 0 !important;
  }

  .projects {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 34px 24px !important;
  }

  .projects > .section-heading {
    grid-column: 1 / -1 !important;
  }

  .project-grid {
    display: contents !important;
  }

  .project-large,
  .project-wide,
  .project-grid .project {
    display: block !important;
    grid-column: auto !important;
    margin: 0 !important;
  }

  .project-info {
    padding-top: 12px !important;
    padding-bottom: 0 !important;
  }

  .project-info p {
    margin-bottom: 16px !important;
  }

  .project-large .project-image,
  .project-grid .project-image,
  .project-wide .project-image {
    height: 30vw !important;
    max-height: 400px !important;
  }
}

@media (max-width: 700px) {
  .hero-brand {
    display: none;
  }

  .wordmark {
    font-size: 20px !important;
  }

  .about-page .page-intro h1 {
    font-size: 10vw !important;
  }

  .projects {
    display: block !important;
  }

  .project-grid {
    display: block !important;
  }

  .page-project img {
    height: 110vw !important;
    max-height: none !important;
  }

  .service {
    min-height: 64px !important;
  }
}

.service h3,
.project-info h3,
.page-project h2,
.detail-list h2 {
  font-size: clamp(24px, 3vw, 42px) !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}

@media (max-width: 700px) {
  .hero h1,
  .statement h2,
  .contact h2,
  .page-intro h1 {
    font-size: 11vw !important;
  }

  .service h3,
  .project-info h3,
  .page-project h2,
  .detail-list h2 {
    font-size: 8vw !important;
  }
}