/* Website, 10 september 2026: Inter sluit aan op de app.
   Na de paginaspecifieke stijlen laden. Kleuren, beelden en indeling blijven behouden. */
:root,
:root[data-theme] {
  --font-display: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

body {
  font-family: var(--font-sans);
  font-optical-sizing: auto;
}

button, input, select, textarea {
  font-family: var(--font-sans);
}

h1, h2, h3, h4, .display {
  font-family: var(--font-display);
  text-wrap: balance;
  overflow-wrap: break-word;
}

.hero h1, .pricehead h1, .arthead h1, .blog-head h1, .kop h1,
.sec-head h2, .problem h2, .final h2, article h2 {
  font-weight: 650;
  letter-spacing: -.03em;
  line-height: 1.12;
}

.hero h1 {
  font-size: clamp(2.5rem, 5.1vw, 4.25rem);
  letter-spacing: -.035em;
  line-height: 1.08;
}

.hero h1 em {
  font-style: normal;
}

.brand, .stage-center span {
  font-weight: 750;
  letter-spacing: -.04em;
}

.tier .amt {
  font-weight: 700;
  letter-spacing: -.035em;
}

.lede, .pull {
  font-family: var(--font-sans);
}

.arthead .lede, article p, article li {
  line-height: 1.7;
}

@media (max-width: 480px) {
  nav .brand {
    font-size: 22px;
  }

  .hero h1 {
    font-size: clamp(2.125rem, 9.7vw, 2.5rem);
  }
}

@media (max-width: 360px) {
  /* Dezelfde actie blijft in het menu en direct onder de hoofdkop bereikbaar. */
  .nav-cta-mobiel {
    display: none;
  }
}