/* bio-grond — merklaag: woordmerk-lockup concept 03 "met spruit"
   Bron: conceptsheet Mark vdH (03 licht / 06 donker footer-variant).
   Woordmerk = HTML-tekst + inline spruit-SVG — geen image-bestanden.
   Bouwt op tokens.css; alleen merk-specifieke tokens staan hier. */

/* Poppins 700 — latin-subset, self-hosted (geen CDN, conform huisregel).
   Alleen voor het woordmerk; de romp blijft Inter. */
@font-face {
  font-family: "Poppins";
  src: url("../fonts/Poppins-Bold-latin.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Conceptsheet-tinten (03/06) — bewust naast de site-tokens: dit is
     de merk-crème van het woordmerk, niet de surface-tint van de site. */
  --brand-creme:     #F4EFE3;
  --brand-bio-licht: #6FB23A;
  --font-wordmark:   "Poppins", var(--font-sans);
}

/* ── Lockup: spruit + woordmerk, samen één link ──────────────────── */
.bg-lockup {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
}
.bg-lockup .sprout {
  width: 42px;
  height: 42px;
  flex: none;
}
.bg-lockup:focus-visible {
  outline: 2px solid var(--color-bio);
  outline-offset: 4px;
  border-radius: var(--radius-s);
}

/* ── Woordmerk (licht, concept 03): "bio" groen, "-grond" grond-tint ─ */
.bg-wordmark {
  font-family: var(--font-wordmark);
  font-weight: 700;
  font-size: 1.45rem;
  letter-spacing: -0.01em;
  line-height: 1;
  color: var(--color-grond);
}
.bg-wordmark .wm-bio {
  color: var(--color-bio);
}

/* ── Donkere variant (06): footer / donkere secties ─────────────────
   bio -> licht groen, grond -> merk-crème; de spruit-stam wordt in de
   markup zelf licht (stroke #6FB23A). */
.bg-wordmark.is-dark {
  color: var(--brand-creme);
}
.bg-wordmark.is-dark .wm-bio {
  color: var(--brand-bio-licht);
}