html {
  font-size: 100%;
}

body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}

p,
li,
dd {
  line-height: 1.9;
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-heading);
  text-wrap: balance;
}

.hero-en,
.big-en,
.page-hero h1,
.hero-copy h1,
.profile-title h2,
.contact h2,
.coming-soon h2,
.side-word {
  font-family: var(--font-display);
}

.section {
  padding-top: clamp(var(--space-6), 8vw, var(--space-7));
  padding-bottom: clamp(var(--space-6), 8vw, var(--space-7));
}

.section-label,
.section-head {
  margin-bottom: clamp(var(--space-5), 5vw, var(--space-6));
}

.about-copy p,
.intro-copy p,
.mvv-copy p,
.article-body > p,
.article-body > ul,
.article-body > ol,
.article-body > h2,
.article-body > h3 {
  max-width: var(--measure);
}

.article-body {
  max-width: 58rem;
}

.article-body > p,
.article-body li {
  font-size: var(--text-base);
}

.article-body > h2 {
  margin-top: var(--space-6);
  margin-bottom: var(--space-3);
}

.contact-inner {
  gap: clamp(var(--space-4), 3.5vw, var(--space-5));
}

@media (max-width: 760px) {
  body {
    font-size: 100%;
  }

  .about-copy p,
  .intro-copy p,
  .mvv-copy p,
  .value-card p,
  .company-table dd,
  .article-body p,
  .article-body li {
    font-size: 0.9375rem;
  }

  .section {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .article-body {
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }
}
