/* ═══════════════════════════════════════════════════════════
   style.css — Eenvoudig Groen
   Minimale gedeelde basis. Alle paginaspecifieke styling
   staat inline in de <style> blokken per pagina.
═══════════════════════════════════════════════════════════ */

/* ── FONT ─────────────────────────────────────────────── */
@font-face {
    font-family: "League Spartan";
    src: url('LeagueSpartan-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* ── CSS CUSTOM PROPERTIES ────────────────────────────── */
:root {
    --dk:   #174238;   /* donkergroen */
    --mg:   #2E6F5F;   /* middengroen */
    --lg:   #1AA374;   /* lichtgroen  */
    --yl:   #CAFF43;   /* geelgroen accent */
    --nb:   #101A35;   /* donkerblauw */
    --ow:   #F5F4EF;   /* crème/off-white achtergrond */
    --wit:  #ffffff;
    --tekst:#3d4a3d;   /* donkere tekst */
}

/* ── RESET ─────────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
}

html {
    scroll-behavior: smooth;
}

html, body {
    width: 100%;
    overflow-x: hidden;
    font-family: "League Spartan", sans-serif;
    background: var(--wit);
    color: var(--tekst);
    line-height: 1.6;
    -webkit-text-size-adjust: 100%;
}

/* Verwijder standaard list-styling */
ul, ol { list-style: none; }

/* Links zonder standaard kleur */
a { color: inherit; text-decoration: none; }

/* Afbeeldingen nooit breder dan container */
img, svg, video { max-width: 100%; display: block; }

/* Formulier-elementen erven lettertype */
input, textarea, select, button {
    font-family: inherit;
    font-size: inherit;
}

/* ── VOORKOM INLINE-STIJL CONFLICTEN ───────────────────── */
/* De oude style.css zette h2::after groene streepjes.
   Die worden hieronder geneutraliseerd zodat paginastijlen
   niet hoeven te overriden. */
h2::after, h2::before,
h1::after, h1::before,
h3::after, h3::before {
    display: none !important;
    content: none !important;
}