/* ═══════════════════════════════════════════════════════════════════════
   Superburen — groen thema + leesbaarheid (WCAG 2.2 AA)
   Wordt als laatste geladen en overschrijft style.css en paginastijlen.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  /* Merkkleur: donkergroen uit het logo. Wit hierop = 5,6:1 */
  --blue-9: #06402A;
  --blue-8: #095C3C;     /* hover */
  --blue-7: #0B774C;     /* knoppen, links, actief filter */
  --blue-6: #0B774C;
  --blue-5: #23A645;     /* accentranden */
  --blue-4: #6CC58A;
  --blue-2: #A7DDB9;
  --blue-1: #D3F0DC;
  --blue-0: #EEF9F1;
  --green-dark: #04301F;
  /* Grijze tekst donkerder voor leesbaarheid (7,6:1 op wit) */
  --g5: #475569;
  --g7: #1E293B;
}

/* ── Basistekst groter ─────────────────────────────────────────────── */
body { font-size: 1.125rem; line-height: 1.65; }

/* ── Skip-link ─────────────────────────────────────────────────────── */
.skip-link {
  position: absolute; left: 12px; top: -100px; z-index: 10000;
  background: var(--blue-7); color: #fff; font-weight: 700;
  padding: 12px 18px; border-radius: 10px; font-size: 1rem;
}
.skip-link:focus { top: 12px; }
.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ── Toetsenbordfocus ──────────────────────────────────────────────── */
:focus-visible { outline: 3px solid var(--blue-7); outline-offset: 3px; border-radius: 6px; }
.partners-hero :focus-visible, .sub-hero :focus-visible,
.manifesto :focus-visible, .footer :focus-visible { outline-color: #FCD34D; }

/* ── Navigatie ─────────────────────────────────────────────────────── */
.nav-links a { font-size: 1rem; color: var(--g7); }
.nav-mobile a { font-size: 1.05rem; }
.btn { font-size: 1rem; }

/* ── Kop bovenaan (homepage + aanmelden) ───────────────────────────── */
.partners-hero, .sub-hero {
  background: linear-gradient(135deg, var(--green-dark) 0%, #06452C 55%, #0B5E3C 100%);
}
.partners-hero-eyebrow, .sub-eyebrow { font-size: .875rem; color: #fff; letter-spacing: .02em; }
.partners-hero-quote { font-size: 1.2rem; }
.partners-hero-sub, .sub-lead { font-size: 1.15rem; color: rgba(255,255,255,.9); max-width: 640px; }

/* ── Filters ───────────────────────────────────────────────────────── */
.filter-label { font-size: .875rem; color: var(--g7); letter-spacing: .03em; }
.filter-btn { font-size: .95rem; padding: 8px 16px; color: var(--g7); border-color: var(--g3); }
.filter-btn.active { background: var(--blue-7); border-color: var(--blue-7); color: #fff; }
.filter-btn:hover { background: var(--blue-0); border-color: var(--blue-5); }

/* ── Lijst ─────────────────────────────────────────────────────────── */
.list-title { font-family: var(--font-d); font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 800; color: var(--navy); letter-spacing: -.02em; margin: 36px 0 0; }
.count-bar { padding-top: 8px; }
.count-label { font-size: 1.05rem; color: var(--g5); }
.count-updated { font-size: .9rem; color: var(--g5); }
.partner-table thead th { font-size: .875rem; color: var(--g7); letter-spacing: .03em; }
.partner-name { font-size: 1.2rem; }
.bereik-label { font-size: .9rem; font-weight: 600; color: var(--g5); margin-top: 4px; }
.bereik-meerdere { color: #1D4ED8; }
.bereik-lokaal { color: #9A3412; }
.partner-url { font-size: .9rem; color: var(--blue-7); text-decoration: underline; text-underline-offset: 2px; }
.td-name { min-width: 200px; }
.td-desc { font-size: 1.0625rem; line-height: 1.65; color: var(--g7); max-width: 600px; }
.td-link a { font-size: 1rem; padding: 9px 16px; color: var(--blue-7); border-color: var(--blue-2); }
.no-results { font-size: 1.05rem; }

/* Categoriebadges: groter, geen hoofdletters, donkerdere tekst */
.cat-badge { font-size: .875rem; text-transform: none; letter-spacing: 0; font-weight: 600; padding: 5px 12px; }
.cat-platform   { background: #EEF4FF; color: #1E40AF; }
.cat-evenement  { background: #FFF1E6; color: #9A3412; }
.cat-fonds      { background: #ECFDF3; color: #166534; }
.cat-duurzaam   { background: #ECFDF3; color: #14532D; }
.cat-mobiliteit { background: #F3EEFF; color: #5B21B6; }
.cat-kennis     { background: #F1F5F9; color: #1E293B; }
.cat-maaltijden { background: #FFF0F2; color: #9F1239; }
.cat-spullen    { background: #FFF8E6; color: #92400E; }
.cat-voedsel    { background: #F4FBE6; color: #3F6212; }
.cat-gebaren    { background: #FDF0F7; color: #9D174D; }
.cat-maatjes    { background: #E9FBFD; color: #155E75; }

/* ── Aanmeld-oproep ────────────────────────────────────────────────── */
.cta-card { background: linear-gradient(135deg, #EEF9F1 0%, #F7FBF4 100%); border-color: var(--blue-2); }
.cta-eyebrow { font-size: .875rem; color: var(--blue-7); }
.cta-text { font-size: 1.1rem; }
.cta-option-title { font-size: 1.05rem; }
.cta-option-text { font-size: 1rem; color: var(--g5); }

/* ── Buurtbemiddeling (inline stijlen via klassen) ─────────────────── */
.botert-lead { color: var(--g5) !important; font-size: 1.05rem !important; }
.botert-text { color: var(--g7) !important; font-size: 1.05rem !important; }
.botert-url  { font-size: .95rem !important; color: var(--g5) !important; text-decoration: underline !important; }
.botert-link { font-size: 1rem !important; color: #92400E !important; }

/* ── Over ons ──────────────────────────────────────────────────────── */
.manifesto { background: var(--green-dark); }
.manifesto::before { background: radial-gradient(circle, rgba(35,166,69,.25) 0%, transparent 70%); }
.manifesto-body { font-size: 1.1rem; color: rgba(255,255,255,.88); }
.mv-label { font-size: 1.05rem; }
.mv-desc { font-size: .98rem; color: rgba(255,255,255,.8); }

/* ── Aanmeldpagina ─────────────────────────────────────────────────── */
.s-lead { font-size: 1.1rem; color: var(--g5); }
.benefit-title { font-size: 1.1rem; }
.benefit-text, .step-text { font-size: 1rem; color: var(--g5); }
.step-title { font-size: 1.05rem; }
.checklist li { font-size: 1.05rem; }
.mail-box { border-color: var(--blue-2); box-shadow: 0 8px 30px rgba(11,119,76,.08); }
.mail-alt { font-size: 1rem; color: var(--g5); }

/* ── Footer (donkerblauw voor rust) ────────────────────────────────── */
.footer { color: rgba(255,255,255,.85); }
.footer-mark { background: var(--blue-7); }
.footer-desc { font-size: 1rem; color: rgba(255,255,255,.78); }
.footer-col-title { font-size: .875rem; letter-spacing: .04em; }
.footer-links a { font-size: 1rem; color: rgba(255,255,255,.82); }
.footer-links a:hover { color: #fff; text-decoration: underline; }
.footer-bottom { font-size: .95rem; color: rgba(255,255,255,.72); border-top-color: rgba(255,255,255,.15); }

/* ── Minder beweging ───────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ── Mobiel ────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .td-desc { font-size: 1.0625rem; }
  .td-name { min-width: 0; }
  .partner-table td { padding: 5px 0; }
}

/* Minder witruimte tussen filters en lijst */
.gids > .section { padding-top: 12px; }

/* Actieve filterknop blijft leesbaar bij hover (wit op donkerder groen = 7,4:1) */
.filter-btn.active:hover,
.filter-btn.active:focus-visible { background: var(--blue-8); border-color: var(--blue-8); color: #fff; }

/* Vinkje in lijst niet laten voorlezen */
.checklist li::before { content: '✓'; content: '✓' / ''; }
