@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');

:root {
  --font-body: "Inter", Arial, Helvetica, sans-serif;
  --font-display: "Manrope", "Inter", Arial, Helvetica, sans-serif;
}

body {
  font-family: var(--font-body);
  letter-spacing: -0.006em;
}

h1,
h2,
h3,
.wordmark,
.eyebrow,
.tag,
.button,
.nav-contact,
.activity > a,
.trade-line,
.brand-caption,
address span {
  font-family: var(--font-display);
}

.wordmark {
  font-weight: 800;
  letter-spacing: -0.055em;
}

.wordmark span {
  font-weight: 700;
  letter-spacing: 0.22em;
}

nav a,
.contact-bar {
  font-weight: 500;
}

h1 {
  font-weight: 800;
  line-height: 1.04;
  letter-spacing: -0.045em;
}

h2,
.export-heading h2 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.035em;
}

h3,
.fruit-caption h3 {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -0.025em;
}

.lead {
  line-height: 1.68;
}

.eyebrow,
.tag,
.trade-line,
.brand-caption,
address span {
  letter-spacing: 0.13em;
}

.button,
.nav-contact,
.activity > a {
  font-weight: 700;
  letter-spacing: -0.01em;
}

.email {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.035em;
}

@media (max-width: 700px) {
  h1 {
    font-size: clamp(2.35rem, 12vw, 2.9rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
  }

  h2,
  .export-heading h2 {
    letter-spacing: -0.03em;
  }
}