/*
 * Blokstijlen (v9.7) — geladen op de site én in de pagina-editor.
 *
 * Alles hier hangt aan een "Stijl" die je in de editor rechts bij een blok
 * kiest (Kolommen, Lijst, Knop, Alinea). Zo kun je de opmaak zelf toepassen
 * op nieuwe blokken, zonder code. De tekst is gewone, bewerkbare tekst.
 */

:root{
  --salie:      #6F7656;
  --salie-tint: #E6E7DC;
  --bes:        #8E5566;
  --bes-tint:   #F2E4E7;
}

/* ---------------------------------------------------------
   Alinea: bovenkopje  ("WAT ER VAAK" boven een kop)
   --------------------------------------------------------- */
.is-style-mdc-bovenkop{
  font-family:var(--font-body, "Open Sans", Arial, sans-serif);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--rose-light, #B08B82);
  margin:0 0 .5em;
}
.is-style-mdc-bovenkop + h2,
.is-style-mdc-bovenkop + h3{ margin-top:0; }

/* Alinea: groot nummer (01, 02, 03) */
.is-style-mdc-nummer{
  font-family:var(--font-head, Roboto, Arial, sans-serif);
  font-style:italic;
  font-weight:300;
  font-size:2.7rem;
  line-height:1;
  color:var(--rose-light, #B08B82);
  margin:0 0 .3em;
}
.is-style-mdc-nummer::after{
  content:"";
  display:block;
  width:42px; height:1px;
  margin:.45em auto 0;
  background:currentColor;
  opacity:.45;
}

/* ---------------------------------------------------------
   Kolommen: tekst en beeld
   Breedte per kolom stel je in de editor in (kolom selecteren →
   Breedte). Op een telefoon komen de kolommen onder elkaar, en
   een kolom met alleen een foto komt dan bovenaan.
   --------------------------------------------------------- */
.wp-block-columns.is-style-mdc-tekst-beeld{
  gap:clamp(2rem, 5vw, 4.5rem);
  align-items:center;
  margin-top:var(--sp-5, 5rem);
  margin-bottom:var(--sp-5, 5rem);
}
.is-style-mdc-tekst-beeld > .wp-block-column > :first-child{ margin-top:0; }
.is-style-mdc-tekst-beeld > .wp-block-column > :last-child{ margin-bottom:0; }
.is-style-mdc-tekst-beeld .wp-block-image{ margin:0; }
.is-style-mdc-tekst-beeld .wp-block-image img{
  width:100%;
  height:auto;
  border-radius:4px 4px 4px 64px;
  display:block;
}
.is-style-mdc-tekst-beeld > .wp-block-column:last-child .wp-block-image img{
  border-radius:4px 4px 64px 4px;
}
@media (max-width:781px){
  .wp-block-columns.is-style-mdc-tekst-beeld{
    margin-top:var(--sp-4, 3rem);
    margin-bottom:var(--sp-4, 3rem);
  }
  .is-style-mdc-tekst-beeld > .wp-block-column:has(> .wp-block-image:only-child){ order:-1; }
  .is-style-mdc-tekst-beeld .wp-block-image img{ max-height:440px; object-fit:cover; }
}

/* ---------------------------------------------------------
   Kolommen: kaarten (gelijke hoogte, knop onderaan)
   --------------------------------------------------------- */
.wp-block-columns.is-style-mdc-kaarten{
  gap:1.5rem;
  align-items:stretch !important;
  margin-top:var(--sp-4, 3rem);
  margin-bottom:var(--sp-4, 3rem);
}
.is-style-mdc-kaarten > .wp-block-column{
  background:var(--surface, #fff);
  border:1px solid var(--rose-border, #CBB0AA);
  border-radius:var(--radius, 14px);
  padding:2.4rem 1.75rem 2rem;
  display:flex;
  flex-direction:column;
  text-align:center;
  align-self:stretch !important;
}
.is-style-mdc-kaarten > .wp-block-column > *{ margin-left:0; margin-right:0; }
.is-style-mdc-kaarten > .wp-block-column > :first-child{ margin-top:0; }
.is-style-mdc-kaarten h3{ margin:.1em 0 .2em; font-size:1.55rem; line-height:1.2; }
.is-style-mdc-kaarten > .wp-block-column > .wp-block-buttons:last-child{
  margin-top:auto;
  padding-top:1.4rem;
  justify-content:center;
}
/* Accentkleur per kaart: salie, oudroze, bes */
.is-style-mdc-kaarten > .wp-block-column:nth-child(3n+1) :is(.is-style-mdc-nummer, h3){ color:var(--salie); }
.is-style-mdc-kaarten > .wp-block-column:nth-child(3n+2) :is(.is-style-mdc-nummer, h3){ color:var(--rose); }
.is-style-mdc-kaarten > .wp-block-column:nth-child(3n+3) :is(.is-style-mdc-nummer, h3){ color:var(--bes); }

/* ---------------------------------------------------------
   Kolommen: kerncijfers (rij met scheidingslijnen)
   --------------------------------------------------------- */
.wp-block-columns.is-style-mdc-cijfers{
  gap:0;
  background:var(--surface, #fff);
  border-radius:var(--radius, 14px);
  padding:2.25rem 0;
  margin-top:var(--sp-4, 3rem);
  margin-bottom:var(--sp-4, 3rem);
}
.is-style-mdc-cijfers > .wp-block-column{
  text-align:center;
  padding:0 1.5rem;
  border-left:1px solid var(--rose-tint, #F1E5E0);
}
.is-style-mdc-cijfers > .wp-block-column:first-child{ border-left:0; }
.is-style-mdc-cijfers h3{
  font-size:clamp(1.35rem, 2.2vw, 1.9rem);
  font-weight:500;
  line-height:1.15;
  color:var(--salie);
  margin:0 0 .45em;
}
.is-style-mdc-cijfers p{
  font-size:.92rem;
  line-height:1.55;
  color:var(--text-soft, #8A8582);
  margin:0;
}
@media (max-width:781px){
  .wp-block-columns.is-style-mdc-cijfers{ padding:.5rem 1.25rem; }
  .is-style-mdc-cijfers > .wp-block-column{
    border-left:0;
    border-top:1px solid var(--rose-tint, #F1E5E0);
    padding:1.4rem 0;
  }
  .is-style-mdc-cijfers > .wp-block-column:first-child{ border-top:0; }
}

/* ---------------------------------------------------------
   Lijst: herkenningskaartjes (zachte, ronde vlakken onder elkaar)
   --------------------------------------------------------- */
.is-style-mdc-pillen{
  list-style:none;
  padding:0;
  margin:1.5rem auto;
  max-width:30rem;
  display:flex;
  flex-direction:column;
  gap:1.4rem;
}
.is-style-mdc-pillen li{
  position:relative;
  margin:0;
  padding:1.05rem 1.75rem;
  border-radius:2.2rem;
  background:var(--rose-tint, #F1E5E0);
  text-align:center;
  line-height:1.55;
}
.is-style-mdc-pillen li:nth-child(3n+2){ background:#F4E9E2; }
.is-style-mdc-pillen li:nth-child(3n+3){ background:#F6EDE0; }
.is-style-mdc-pillen li + li::before{
  content:"";
  position:absolute;
  top:-.75rem; left:50%;
  width:30px; height:1px;
  background:var(--rose-border, #CBB0AA);
  transform:translateX(-50%);
}

/* ---------------------------------------------------------
   Lijst: met genummerde cirkels en scheidingslijnen
   (oudroze, en een variant in salie)
   --------------------------------------------------------- */
.is-style-mdc-cirkels,
.is-style-mdc-cirkels-salie{
  list-style:none;
  padding:0;
  margin:1.25rem 0;
  counter-reset:mdc-cirkel;
}
.is-style-mdc-cirkels li,
.is-style-mdc-cirkels-salie li{
  counter-increment:mdc-cirkel;
  display:grid;
  grid-template-columns:2.9rem minmax(0,1fr);
  gap:1.1rem;
  align-items:center;
  margin:0;
  padding:.8rem 0;
  border-bottom:1px solid var(--rose-tint, #F1E5E0);
  text-align:left;
  line-height:1.5;
}
.is-style-mdc-cirkels li:last-child,
.is-style-mdc-cirkels-salie li:last-child{ border-bottom:0; }
.is-style-mdc-cirkels li::before,
.is-style-mdc-cirkels-salie li::before{
  content:counter(mdc-cirkel, decimal-leading-zero);
  width:2.9rem; height:2.9rem;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--rose-tint, #F1E5E0);
  color:var(--rose, #9E7F70);
  font-family:var(--font-head, Roboto, Arial, sans-serif);
  font-size:.85rem;
}
.is-style-mdc-cirkels-salie li{ border-bottom-color:var(--salie-tint); }
.is-style-mdc-cirkels-salie li::before{
  background:var(--salie-tint);
  color:var(--salie);
}

/* ---------------------------------------------------------
   Lijst: vinkjes in twee kolommen
   --------------------------------------------------------- */
.is-style-mdc-vinkjes{
  list-style:none;
  padding:0;
  margin:1.75rem 0 0;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:1rem 2.75rem;
}
.is-style-mdc-vinkjes li{
  position:relative;
  margin:0;
  padding-left:2.2rem;
  text-align:left;
  line-height:1.55;
}
.is-style-mdc-vinkjes li::before{
  content:"";
  position:absolute;
  left:0; top:.1em;
  width:1.45rem; height:1.45rem;
  border-radius:50%;
  background:var(--surface, #fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 62% no-repeat;
  border:1px solid var(--rose-border, #CBB0AA);
}
@media (max-width:781px){
  .is-style-mdc-vinkjes{ grid-template-columns:minmax(0,1fr); }
}

/* ---------------------------------------------------------
   Genummerde lijst: stappen (6 fases) als kaartjes in een raster
   Per punt: vetgedrukte titel, tekst en (cursief) een korte noot.
   --------------------------------------------------------- */
.is-style-mdc-stappen{
  list-style:none;
  padding:0;
  margin:1.75rem 0;
  counter-reset:mdc-stap;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1.25rem;
}
.is-style-mdc-stappen li{
  counter-increment:mdc-stap;
  margin:0;
  padding:1.5rem 1.4rem 1.35rem;
  background:var(--surface, #fff);
  border-radius:var(--radius, 14px);
  text-align:left;
  line-height:1.6;
  font-size:.95rem;
}
.is-style-mdc-stappen li::before{
  content:counter(mdc-stap, decimal-leading-zero);
  display:grid;
  place-items:center;
  width:2.6rem; height:2.6rem;
  border-radius:50%;
  margin-bottom:.9rem;
  background:var(--salie);
  color:#fff;
  font-family:var(--font-head, Roboto, Arial, sans-serif);
  font-size:.8rem;
}
.is-style-mdc-stappen li:nth-child(even)::before{ background:var(--rose-light, #B08B82); }
.is-style-mdc-stappen li > strong:first-child{
  display:block;
  margin-bottom:.3em;
  font-family:var(--font-head, Roboto, Arial, sans-serif);
  font-weight:500;
  font-size:1.05rem;
  color:var(--rose, #9E7F70);
}
.is-style-mdc-stappen li em{
  display:block;
  margin-top:.65em;
  font-style:normal;
  font-size:.8rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-soft, #8A8582);
}
@media (max-width:900px){
  .is-style-mdc-stappen{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:600px){
  .is-style-mdc-stappen{ grid-template-columns:minmax(0,1fr); }
}

/* ---------------------------------------------------------
   Knop: "Ik wil meer weten →"  (tekst met lijnen en pijl)
   --------------------------------------------------------- */
.is-style-mdc-pijl .wp-block-button__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.9em;
  background:transparent;
  color:var(--text, #666563);
  border:0;
  border-top:1px solid var(--rose-border, #CBB0AA);
  border-bottom:1px solid var(--rose-border, #CBB0AA);
  border-radius:0;
  padding:.95em .3em;
  font-size:.78rem;
  letter-spacing:.18em;
}
.is-style-mdc-pijl .wp-block-button__link::after{
  content:"\2192";
  font-size:1.25em;
  letter-spacing:0;
  transition:transform .35s var(--ease, ease);
}
.is-style-mdc-pijl .wp-block-button__link:hover{
  background:transparent;
  color:var(--rose, #9E7F70);
  border-color:var(--rose, #9E7F70);
  box-shadow:none;
  transform:none;
}
.is-style-mdc-pijl .wp-block-button__link:hover::after{ transform:translateX(5px); }
.is-style-mdc-kaarten .wp-block-button.is-style-mdc-pijl,
.is-style-mdc-kaarten .is-style-mdc-pijl .wp-block-button__link{ width:100%; }

/* ---------------------------------------------------------
   Kader in een kolom vult de hele kolomhoogte
   (dan staan kaders naast elkaar even hoog)
   --------------------------------------------------------- */
.wp-block-column > .is-style-mdc-kader:only-child,
.wp-block-column > .is-style-mdc-vlak:only-child{ height:100%; box-sizing:border-box; }
.is-style-mdc-kader > :first-child,
.is-style-mdc-vlak > :first-child{ margin-top:0; }
.is-style-mdc-kader > :last-child,
.is-style-mdc-vlak > :last-child{ margin-bottom:0; }

/* Een kop direct boven kolommen: kleinere tussenruimte */
.mdc-sectiekop{ text-align:center; max-width:46rem; margin:0 auto; }
.mdc-sectiekop > :last-child{ margin-bottom:0; }
.mdc-sectiekop + .wp-block-columns{ margin-top:var(--sp-3, 1.75rem); }
.mdc-sectie{ margin-top:var(--sp-5, 5rem); margin-bottom:var(--sp-5, 5rem); }
@media (max-width:781px){
  .mdc-sectie{ margin-top:var(--sp-4, 3rem); margin-bottom:var(--sp-4, 3rem); }
}

/* ---------------------------------------------------------
   Lijst: gecentreerd met lijntjes (punten in een kaart)
   --------------------------------------------------------- */
.is-style-mdc-streepjes{
  list-style:none;
  padding:0;
  margin:1.25rem 0 0;
  border-top:1px solid var(--rose-border, #CBB0AA);
}
.is-style-mdc-streepjes li{
  margin:0;
  padding:.7rem .5rem;
  border-bottom:1px solid var(--rose-tint, #F1E5E0);
  text-align:center;
  line-height:1.45;
}

/* Grote uitspraak gecentreerd: het lijntje ook in het midden */
.is-style-mdc-groot:has(.has-text-align-center)::before{ margin-left:auto; margin-right:auto; }
.is-style-mdc-groot{ max-width:46rem; margin-left:auto; margin-right:auto; }

/* ---------------------------------------------------------
   Uitlijning: een vlak of cijferbalk op brede breedte valt
   precies gelijk met de inhoud van brede kolommen erboven.
   --rand volgt de zijmarge die het thema aan brede blokken geeft.
   --------------------------------------------------------- */
:root{ --mdc-rand:var(--sp-4, 3rem); }
@media (max-width:768px){ :root{ --mdc-rand:var(--sp-3, 1.75rem); } }
@media (max-width:600px){ :root{ --mdc-rand:1.25rem; } }
@media (max-width:380px){ :root{ --mdc-rand:1rem; } }

.wp-block-group.alignwide.is-style-mdc-vlak,
.wp-block-group.alignwide.is-style-mdc-kader,
.wp-block-columns.alignwide.is-style-mdc-cijfers{
  box-sizing:border-box;
  width:calc(100% - 2 * var(--mdc-rand));
  max-width:calc(1180px - 2 * var(--mdc-rand));
  margin-left:auto;
  margin-right:auto;
}
/* Binnen een pagina met .wrap heeft breed geen extra zijmarge */
.wrap .wp-block-group.alignwide.is-style-mdc-vlak,
.wrap .wp-block-group.alignwide.is-style-mdc-kader,
.wrap .wp-block-columns.alignwide.is-style-mdc-cijfers{
  width:100%;
  max-width:1180px;
}
/* Een vlak of kader houdt altijd zijn eigen binnenmarge */
.wp-block-group.is-style-mdc-vlak.alignwide,
.wrap .wp-block-group.is-style-mdc-vlak.alignwide{ padding:var(--sp-4, 3rem); }
@media (max-width:600px){
  .wp-block-group.is-style-mdc-vlak.alignwide,
  .wrap .wp-block-group.is-style-mdc-vlak.alignwide{ padding:var(--sp-3, 1.75rem) 1.35rem; }
}
/* Cijferbalk binnen een vlak: geen extra zijmarge */
.is-style-mdc-vlak .wp-block-columns.is-style-mdc-cijfers{ width:100%; max-width:none; }

/* Kaders naast elkaar even hoog */
.wp-block-columns:has(> .wp-block-column > :is(.is-style-mdc-kader, .is-style-mdc-vlak):only-child){
  align-items:stretch !important;
}
.wp-block-columns:has(> .wp-block-column > :is(.is-style-mdc-kader, .is-style-mdc-vlak):only-child) > .wp-block-column{
  align-self:stretch !important;
}

/* Eerste blok direct onder de paginatitel: niet te veel witruimte */
.rise > .wp-block-columns.is-style-mdc-tekst-beeld:first-child,
.rise > .mdc-sectiekop:first-child,
.rise > .wp-block-group:first-child > .wp-block-columns.is-style-mdc-tekst-beeld:first-child{ margin-top:var(--sp-3, 1.75rem); }

/* Bovenkopje in een smalle kaart: minder letterafstand, zodat het niet midden in een woord afbreekt */
.is-style-mdc-kaarten .is-style-mdc-bovenkop{ letter-spacing:.14em; font-size:.72rem; }

/* =========================================================
   ICONEN (v9.8) — dezelfde lijn-iconen als in de oude ontwerpen.
   Gebruik: geef een lijstpunt of een kolom de extra CSS-klasse
   "mdc-icoon-<naam>" (Blok → Geavanceerd → Extra CSS-klasse(n)).
   Namen: bliksem, ballonnen, verboden, klok, pauze, vraag, oog, oor, ballon-hart, ballon, schild, kringloop, lotus, mensen, groep, persoon, hoed, ster, hand-hart, kalender, boek, schuifjes, plant, hart, huis, harten, lamp
   ========================================================= */
.mdc-icoon-bliksem{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7l1-8z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7l1-8z'/%3E%3C/svg%3E");}
.mdc-icoon-ballonnen{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5h11a1 1 0 0 1 1 1V12a1 1 0 0 1-1 1H8.5L5 16v-3H3a1 1 0 0 1-1-1V5.5a1 1 0 0 1 1-1z'/%3E%3Cpath d='M18 9h3a1 1 0 0 1 1 1v6.5a1 1 0 0 1-1 1h-1.5V20l-3-2.5H12a1 1 0 0 1-1-1V15.5'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4.5h11a1 1 0 0 1 1 1V12a1 1 0 0 1-1 1H8.5L5 16v-3H3a1 1 0 0 1-1-1V5.5a1 1 0 0 1 1-1z'/%3E%3Cpath d='M18 9h3a1 1 0 0 1 1 1v6.5a1 1 0 0 1-1 1h-1.5V20l-3-2.5H12a1 1 0 0 1-1-1V15.5'/%3E%3C/svg%3E");}
.mdc-icoon-verboden{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M5.6 18.4 18.4 5.6'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M5.6 18.4 18.4 5.6'/%3E%3C/svg%3E");}
.mdc-icoon-klok{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12a8.5 8.5 0 1 0 2.6-6.1L3.5 8.5'/%3E%3Cpath d='M3.5 3.5v5h5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12a8.5 8.5 0 1 0 2.6-6.1L3.5 8.5'/%3E%3Cpath d='M3.5 3.5v5h5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");}
.mdc-icoon-pauze{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6v12M15 6v12'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6v12M15 6v12'/%3E%3C/svg%3E");}
.mdc-icoon-vraag{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.5 16.5a4 4 0 0 1-.9-7.9 5.6 5.6 0 0 1 10.8-.4 4.1 4.1 0 0 1 .1 8.3z'/%3E%3Ccircle cx='6' cy='19.5' r='1.1'/%3E%3Ccircle cx='3.6' cy='21.6' r='.6'/%3E%3Cpath d='M10.6 10.3a1.7 1.7 0 1 1 2.4 1.6c-.6.3-1 .7-1 1.3'/%3E%3Cpath d='M12 14.6v.1'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.5 16.5a4 4 0 0 1-.9-7.9 5.6 5.6 0 0 1 10.8-.4 4.1 4.1 0 0 1 .1 8.3z'/%3E%3Ccircle cx='6' cy='19.5' r='1.1'/%3E%3Ccircle cx='3.6' cy='21.6' r='.6'/%3E%3Cpath d='M10.6 10.3a1.7 1.7 0 1 1 2.4 1.6c-.6.3-1 .7-1 1.3'/%3E%3Cpath d='M12 14.6v.1'/%3E%3C/svg%3E");}
.mdc-icoon-oog{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");}
.mdc-icoon-oor{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9a6 6 0 1 1 12 0c0 3.6-3 4.6-3 7.6a3.5 3.5 0 0 1-6.6 1.6'/%3E%3Cpath d='M9.2 9.3a2.8 2.8 0 0 1 5.6 0c0 1.5-1.5 2-1.5 3.5'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9a6 6 0 1 1 12 0c0 3.6-3 4.6-3 7.6a3.5 3.5 0 0 1-6.6 1.6'/%3E%3Cpath d='M9.2 9.3a2.8 2.8 0 0 1 5.6 0c0 1.5-1.5 2-1.5 3.5'/%3E%3C/svg%3E");}
.mdc-icoon-ballon-hart{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.5 8.5 0 0 1-12.4 7.6L3 21l1.9-5.6A8.5 8.5 0 1 1 21 11.5z'/%3E%3Cpath d='M12 15.3s-3.4-2-3.4-4.3a1.8 1.8 0 0 1 3.4-.9 1.8 1.8 0 0 1 3.4.9c0 2.3-3.4 4.3-3.4 4.3z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.5 8.5 0 0 1-12.4 7.6L3 21l1.9-5.6A8.5 8.5 0 1 1 21 11.5z'/%3E%3Cpath d='M12 15.3s-3.4-2-3.4-4.3a1.8 1.8 0 0 1 3.4-.9 1.8 1.8 0 0 1 3.4.9c0 2.3-3.4 4.3-3.4 4.3z'/%3E%3C/svg%3E");}
.mdc-icoon-ballon{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4.5h16a1 1 0 0 1 1 1V16a1 1 0 0 1-1 1h-9l-5 4v-4H4a1 1 0 0 1-1-1V5.5a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4.5h16a1 1 0 0 1 1 1V16a1 1 0 0 1-1 1h-9l-5 4v-4H4a1 1 0 0 1-1-1V5.5a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");}
.mdc-icoon-schild{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.5c0 4.6 3.2 8.4 7.5 9.5 4.3-1.1 7.5-4.9 7.5-9.5V6L12 3z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v5.5c0 4.6 3.2 8.4 7.5 9.5 4.3-1.1 7.5-4.9 7.5-9.5V6L12 3z'/%3E%3C/svg%3E");}
.mdc-icoon-kringloop{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.8L4 8'/%3E%3Cpath d='M4 3v5h5'/%3E%3Cpath d='M4 13a8 8 0 0 0 14.3 4.8L20 16'/%3E%3Cpath d='M20 21v-5h-5'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.3-4.8L4 8'/%3E%3Cpath d='M4 3v5h5'/%3E%3Cpath d='M4 13a8 8 0 0 0 14.3 4.8L20 16'/%3E%3Cpath d='M20 21v-5h-5'/%3E%3C/svg%3E");}
.mdc-icoon-lotus{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20c-4 0-8-2-9-6 3-.5 6 .5 9 3 3-2.5 6-3.5 9-3-1 4-5 6-9 6z'/%3E%3Cpath d='M12 17c-2-2-3-4.5-3-7.5C10.5 7 11.2 5.5 12 4c.8 1.5 1.5 3 3 5.5 0 3-1 5.5-3 7.5z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20c-4 0-8-2-9-6 3-.5 6 .5 9 3 3-2.5 6-3.5 9-3-1 4-5 6-9 6z'/%3E%3Cpath d='M12 17c-2-2-3-4.5-3-7.5C10.5 7 11.2 5.5 12 4c.8 1.5 1.5 3 3 5.5 0 3-1 5.5-3 7.5z'/%3E%3C/svg%3E");}
.mdc-icoon-mensen{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3.5 19.5a5.5 5.5 0 0 1 11 0'/%3E%3Ccircle cx='16.5' cy='9' r='2.5'/%3E%3Cpath d='M15.5 13.7a4.5 4.5 0 0 1 5 4.8'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3.5 19.5a5.5 5.5 0 0 1 11 0'/%3E%3Ccircle cx='16.5' cy='9' r='2.5'/%3E%3Cpath d='M15.5 13.7a4.5 4.5 0 0 1 5 4.8'/%3E%3C/svg%3E");}
.mdc-icoon-groep{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7.5' r='2.8'/%3E%3Cpath d='M7 19.5a5 5 0 0 1 10 0'/%3E%3Ccircle cx='5' cy='10' r='2'/%3E%3Cpath d='M1.8 18a3.4 3.4 0 0 1 4.4-3.3'/%3E%3Ccircle cx='19' cy='10' r='2'/%3E%3Cpath d='M22.2 18a3.4 3.4 0 0 0-4.4-3.3'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7.5' r='2.8'/%3E%3Cpath d='M7 19.5a5 5 0 0 1 10 0'/%3E%3Ccircle cx='5' cy='10' r='2'/%3E%3Cpath d='M1.8 18a3.4 3.4 0 0 1 4.4-3.3'/%3E%3Ccircle cx='19' cy='10' r='2'/%3E%3Cpath d='M22.2 18a3.4 3.4 0 0 0-4.4-3.3'/%3E%3C/svg%3E");}
.mdc-icoon-persoon{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 21a7.5 7.5 0 0 1 15 0'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 21a7.5 7.5 0 0 1 15 0'/%3E%3C/svg%3E");}
.mdc-icoon-hoed{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9.5 12 5l10 4.5L12 14 2 9.5z'/%3E%3Cpath d='M6.5 11.5V16c0 1.4 2.5 3 5.5 3s5.5-1.6 5.5-3v-4.5'/%3E%3Cpath d='M22 9.5V15'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9.5 12 5l10 4.5L12 14 2 9.5z'/%3E%3Cpath d='M6.5 11.5V16c0 1.4 2.5 3 5.5 3s5.5-1.6 5.5-3v-4.5'/%3E%3Cpath d='M22 9.5V15'/%3E%3C/svg%3E");}
.mdc-icoon-ster{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5l2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.9l-5.2 2.7 1-5.8L3.5 9.7l5.9-.9L12 3.5z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5l2.6 5.3 5.9.9-4.3 4.1 1 5.8L12 16.9l-5.2 2.7 1-5.8L3.5 9.7l5.9-.9L12 3.5z'/%3E%3C/svg%3E");}
.mdc-icoon-hand-hart{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 11.3s-3.4-2-3.4-4.3a1.8 1.8 0 0 1 3.4-.9 1.8 1.8 0 0 1 3.4.9c0 2.3-3.4 4.3-3.4 4.3z'/%3E%3Cpath d='M2 14.5h3l3.8 2.8h5.4a1.5 1.5 0 0 0 0-3H11'/%3E%3Cpath d='M14.5 14.5h2.7l3.3-2.3a1.4 1.4 0 0 1 1.7 2.2L17 19H9.5'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 11.3s-3.4-2-3.4-4.3a1.8 1.8 0 0 1 3.4-.9 1.8 1.8 0 0 1 3.4.9c0 2.3-3.4 4.3-3.4 4.3z'/%3E%3Cpath d='M2 14.5h3l3.8 2.8h5.4a1.5 1.5 0 0 0 0-3H11'/%3E%3Cpath d='M14.5 14.5h2.7l3.3-2.3a1.4 1.4 0 0 1 1.7 2.2L17 19H9.5'/%3E%3C/svg%3E");}
.mdc-icoon-kalender{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='2'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='2'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E");}
.mdc-icoon-boek{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 6.5C10 5 7 4.5 3 5v13c4-.5 7 0 9 1.5 2-1.5 5-2 9-1.5V5c-4-.5-7 0-9 1.5z'/%3E%3Cpath d='M12 6.5v13'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 6.5C10 5 7 4.5 3 5v13c4-.5 7 0 9 1.5 2-1.5 5-2 9-1.5V5c-4-.5-7 0-9 1.5z'/%3E%3Cpath d='M12 6.5v13'/%3E%3C/svg%3E");}
.mdc-icoon-schuifjes{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h10M18 7h2M4 12h4M12 12h8M4 17h12'/%3E%3Ccircle cx='16' cy='7' r='2'/%3E%3Ccircle cx='10' cy='12' r='2'/%3E%3Ccircle cx='18' cy='17' r='2'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h10M18 7h2M4 12h4M12 12h8M4 17h12'/%3E%3Ccircle cx='16' cy='7' r='2'/%3E%3Ccircle cx='10' cy='12' r='2'/%3E%3Ccircle cx='18' cy='17' r='2'/%3E%3C/svg%3E");}
.mdc-icoon-plant{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21v-8'/%3E%3Cpath d='M12 13c0-4 3-7 8-7 0 5-3 7-8 7z'/%3E%3Cpath d='M12 15c0-3-2.5-5.5-7-5.5 0 4 2.5 5.5 7 5.5z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21v-8'/%3E%3Cpath d='M12 13c0-4 3-7 8-7 0 5-3 7-8 7z'/%3E%3Cpath d='M12 15c0-3-2.5-5.5-7-5.5 0 4 2.5 5.5 7 5.5z'/%3E%3C/svg%3E");}
.mdc-icoon-hart{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-8-4.6-8-10.2A4.3 4.3 0 0 1 12 7.4a4.3 4.3 0 0 1 8 2.4C20 15.4 12 20 12 20z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-8-4.6-8-10.2A4.3 4.3 0 0 1 12 7.4a4.3 4.3 0 0 1 8 2.4C20 15.4 12 20 12 20z'/%3E%3C/svg%3E");}
.mdc-icoon-huis{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 11 12 4l8.5 7'/%3E%3Cpath d='M5.5 9.5V20h13V9.5'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 11 12 4l8.5 7'/%3E%3Cpath d='M5.5 9.5V20h13V9.5'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E");}
.mdc-icoon-harten{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 17.5s-6-3.5-6-7.7A3.2 3.2 0 0 1 9 8.1a3.2 3.2 0 0 1 6 1.2'/%3E%3Cpath d='M15 21s-6-3.5-6-7.7a3.2 3.2 0 0 1 6-1.7 3.2 3.2 0 0 1 6 1.7C21 17.5 15 21 15 21z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 17.5s-6-3.5-6-7.7A3.2 3.2 0 0 1 9 8.1a3.2 3.2 0 0 1 6 1.2'/%3E%3Cpath d='M15 21s-6-3.5-6-7.7a3.2 3.2 0 0 1 6-1.7 3.2 3.2 0 0 1 6 1.7C21 17.5 15 21 15 21z'/%3E%3C/svg%3E");}
.mdc-icoon-lamp{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4'/%3E%3Cpath d='M12 3a6 6 0 0 0-3.5 10.9c.6.5 1 1.2 1 2.1h5c0-.9.4-1.6 1-2.1A6 6 0 0 0 12 3z'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4'/%3E%3Cpath d='M12 3a6 6 0 0 0-3.5 10.9c.6.5 1 1.2 1 2.1h5c0-.9.4-1.6 1-2.1A6 6 0 0 0 12 3z'/%3E%3C/svg%3E");}

/* Icoon in plaats van nummer in de lijsten met cirkels */
:is(.is-style-mdc-cirkels, .is-style-mdc-cirkels-salie) li[class*="mdc-icoon-"]::before{
  content:"";
  background:var(--rose-tint, #F1E5E0) var(--icoon) center / 52% no-repeat;
}
.is-style-mdc-cirkels-salie li[class*="mdc-icoon-"]::before{
  background:var(--salie-tint) var(--icoon-groen) center / 52% no-repeat;
}

/* Icoon boven een kerncijfer (kolom met klasse mdc-icoon-...) */
.is-style-mdc-cijfers > .wp-block-column[class*="mdc-icoon-"]::before{
  content:"";
  display:block;
  width:4.4rem; height:4.4rem;
  margin:0 auto 1rem;
  border-radius:50%;
  background:var(--salie-tint) var(--icoon-groen) center / 50% no-repeat;
}
.is-style-mdc-cijfers > .wp-block-column[class*="mdc-icoon-"]:nth-child(even)::before{
  background:var(--rose-tint, #F1E5E0) var(--icoon) center / 50% no-repeat;
}

/* =========================================================
   ANIMATIE BIJ SCROLLEN (v9.8)
   Alleen actief als JavaScript draait (klasse mdc-anim op <html>)
   en de bezoeker geen "minder beweging" heeft ingesteld. In de
   editor staat alles gewoon stil en zichtbaar.
   ========================================================= */
.mdc-anim :is(.is-style-mdc-cirkels, .is-style-mdc-cirkels-salie, .is-style-mdc-vinkjes, .is-style-mdc-stappen, .is-style-mdc-streepjes) > li,
.mdc-anim :is(.is-style-mdc-kaarten, .is-style-mdc-cijfers) > .wp-block-column{
  opacity:0;
  translate:0 18px;
  transition:opacity .7s var(--ease, ease), translate .7s var(--ease, ease);
  transition-delay:calc(var(--mdc-i, 0) * 140ms);
}
/* Herkenningskaartjes ploppen op als ballonnetjes */
.mdc-anim .is-style-mdc-pillen > li{
  opacity:0;
  scale:.86;
  translate:0 12px;
  transition:opacity .6s var(--ease, ease), scale .6s cubic-bezier(.34,1.56,.64,1), translate .6s var(--ease, ease);
  transition-delay:calc(var(--mdc-i, 0) * 220ms);
}
.mdc-anim .is-zichtbaar > li,
.mdc-anim .is-zichtbaar > .wp-block-column{
  opacity:1;
  translate:0 0;
  scale:1;
}

/* Het icoon/nummer popt er zacht in, net na het punt zelf */
.mdc-anim :is(.is-style-mdc-cirkels, .is-style-mdc-cirkels-salie, .is-style-mdc-vinkjes, .is-style-mdc-stappen) > li::before,
.mdc-anim .is-style-mdc-cijfers > .wp-block-column::before{
  scale:.3;
  transition:scale .55s cubic-bezier(.34,1.56,.64,1);
  transition-delay:calc(var(--mdc-i, 0) * 140ms + .18s);
}
.mdc-anim .is-zichtbaar > li::before,
.mdc-anim .is-zichtbaar > .wp-block-column::before{ scale:1; }

/* Tekst- en gedachteballonnetjes zweven daarna rustig */
@keyframes mdc-zweef{
  0%, 100%{ translate:0 0; }
  50%     { translate:0 -4px; }
}
.mdc-anim .is-zichtbaar > :is(.mdc-icoon-ballonnen, .mdc-icoon-vraag, .mdc-icoon-ballon-hart, .mdc-icoon-ballon)::before{
  animation:mdc-zweef 3.6s ease-in-out infinite;
  animation-delay:calc(var(--mdc-i, 0) * 140ms + .8s);
}

@media (prefers-reduced-motion: reduce){
  .mdc-anim :is(.is-style-mdc-cirkels, .is-style-mdc-cirkels-salie, .is-style-mdc-vinkjes, .is-style-mdc-stappen, .is-style-mdc-streepjes, .is-style-mdc-pillen) > li,
  .mdc-anim :is(.is-style-mdc-kaarten, .is-style-mdc-cijfers) > .wp-block-column,
  .mdc-anim li::before,
  .mdc-anim .wp-block-column::before{
    opacity:1 !important; translate:none !important; scale:none !important;
    transition:none !important; animation:none !important;
  }
}

/* =========================================================
   v9.9 — kaartvarianten, audio, aanmeldknop
   ========================================================= */

/* Kleine kaarten (bijv. opleidingen): compacter, alle koppen in accentkleur */
.is-style-mdc-kaarten.mdc-kaarten-klein{ gap:1.1rem; margin-top:1.1rem; margin-bottom:1.1rem; }
.is-style-mdc-kaarten.mdc-kaarten-klein > .wp-block-column{ padding:1.6rem 1.25rem 1.4rem; justify-content:center; }
.is-style-mdc-kaarten.mdc-kaarten-klein h3{ font-size:1.12rem !important; color:var(--rose, #9E7F70) !important; margin-bottom:.35em; }
.is-style-mdc-kaarten.mdc-kaarten-klein p{ font-size:.9rem; color:var(--text-soft, #8A8582); margin:0; }
.mdc-sectiekop + .mdc-kaarten-klein{ margin-top:var(--sp-3, 1.75rem); }
.mdc-kaarten-klein + .mdc-kaarten-klein{ margin-top:0; }

/* Kaarten met een icoon bovenaan (kolom met klasse mdc-icoon-...) */
.is-style-mdc-kaarten > .wp-block-column[class*="mdc-icoon-"]::before{
  content:"";
  display:block;
  flex:0 0 auto;
  width:4rem; height:4rem;
  margin:0 auto 1.1rem;
  border-radius:50%;
  background:var(--salie-tint) var(--icoon-groen) center / 50% no-repeat;
}
.is-style-mdc-kaarten > .wp-block-column[class*="mdc-icoon-"]:nth-child(even)::before{
  background:var(--rose-tint, #F1E5E0) var(--icoon) center / 50% no-repeat;
}
.mdc-kaarten-icoon + .mdc-kaarten-icoon{ margin-top:0; }
/* Rij van twee kaarten onder een rij van drie: even breed als die kaarten */
@media (min-width:782px){
  .mdc-kaarten-icoon + .mdc-kaarten-icoon:has(> .wp-block-column:nth-child(2):last-child){
    max-width:calc((min(100%, 1180px) * 2 - 1.5rem) / 3);
  }
}
.mdc-anim .is-style-mdc-kaarten > .wp-block-column::before{
  scale:.3;
  transition:scale .55s cubic-bezier(.34,1.56,.64,1);
  transition-delay:calc(var(--mdc-i, 0) * 140ms + .18s);
}

/* Audiospeler netjes over de hele breedte */
.wp-block-audio{ margin:1.25rem 0 0; }
.wp-block-audio audio{ width:100%; display:block; }

/* Aanmeldknop onder de opening van de homepage */
.mdc-aanmelden{ margin-top:var(--sp-3, 1.75rem); margin-bottom:var(--sp-4, 3rem); }
.mdc-aanmelden .wp-block-button__link{ font-size:.95rem; padding:1.05em 2.8em; }

/* Afbeelding in een kader: afgeronde hoek, geen extra marge */
.is-style-mdc-kader .wp-block-image{ margin:1rem 0 0; }
.is-style-mdc-kader .wp-block-image img{ border-radius:10px; width:100%; height:auto; }
.mdc-anim .is-style-mdc-kaarten.is-zichtbaar > .wp-block-column::before{ scale:1; }

/* Twee formulieren naast elkaar (e-boek en nieuwsbrief) */
.wp-block-columns.mdc-formulieren{ margin-top:var(--sp-3, 1.75rem); margin-bottom:0; gap:1.5rem; align-items:stretch !important; }
.mdc-formulieren > .wp-block-column{ align-self:stretch !important; display:flex; flex-direction:column; }
.mdc-formulieren > .wp-block-column > *{ flex:1 1 auto; margin:0 !important; max-width:none !important; width:100%; box-sizing:border-box; }

/* Kleine kaarten (opleidingen) op de telefoon twee naast elkaar */
@media (max-width:781px){
  .wp-block-columns.mdc-kaarten-klein:not(.is-not-stacked-on-mobile) > .wp-block-column{
    flex-basis:calc(50% - .55rem) !important;
    padding:1.2rem .8rem 1.1rem;
  }
  .mdc-kaarten-klein + .mdc-kaarten-klein{ margin-top:-.0rem; }
}

/* =========================================================
   v10.2 — Navigatiebalk licht doorzichtig (matglas)
   Doorzichtigheid instelbaar: Aanpassen → Kleuren →
   "Navigatiebalk: doorzichtigheid". Bovenaan de voorpagina
   blijft de balk helemaal doorzichtig, zoals voorheen.
   ========================================================= */
.site-header,
.home.mdc-scrolled .site-header{
  background:rgba(255,255,255,var(--nav-dekking, .7));
  -webkit-backdrop-filter:blur(14px) saturate(1.15);
  backdrop-filter:blur(14px) saturate(1.15);
}
.home:not(.mdc-scrolled) .site-header{
  background:transparent;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
/* Browsers zonder vervaging: iets minder doorzichtig, zodat het menu leesbaar blijft */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .site-header,
  .home.mdc-scrolled .site-header{ background:rgba(255,255,255,max(var(--nav-dekking, .7), .9)); }
}

/* =========================================================
   v10.3 — Paginatitel gecentreerd op pagina's met volle breedte
   (Aanbod, Methode, Over Ilse, Inspiratie, E-boek). Een pagina
   met een uitgelichte afbeelding houdt titel + beeld naast elkaar.
   ========================================================= */
:is(.page-template-template-breed, .page-template-page-plaats) .paginakop:not(:has(.kopbeeld)){
  padding:clamp(3.5rem, 8vw, 5.5rem) 0 0;
  text-align:center;
}
:is(.page-template-template-breed, .page-template-page-plaats) .paginakop:not(:has(.kopbeeld)) .wrap{
  display:block;
}
:is(.page-template-template-breed, .page-template-page-plaats) .paginakop:not(:has(.kopbeeld)) h1{
  margin:0 auto;
  max-width:30ch;
  letter-spacing:.01em;
}
:is(.page-template-template-breed, .page-template-page-plaats) .paginakop:not(:has(.kopbeeld)) h1::after{
  content:"";
  display:block;
  width:56px; height:1px;
  margin:.55em auto 0;
  background:var(--rose-border, #CBB0AA);
}
:is(.page-template-template-breed, .page-template-page-plaats) .paginakop:not(:has(.kopbeeld)) .lead{
  margin:1rem auto 0;
  text-align:center;
}
/* De inhoud sluit direct aan op de titel */
:is(.page-template-template-breed, .page-template-page-plaats) .paginakop:not(:has(.kopbeeld)) + .wrap .layout{ padding-top:0; margin-top:0; }
:is(.page-template-template-breed, .page-template-page-plaats) .rise > :first-child{ margin-top:var(--sp-3, 1.75rem) !important; }
:is(.page-template-template-breed, .page-template-page-plaats) .rise > .mdc-sectiekop:first-child h2{
  font-size:clamp(1.15rem, 1.8vw, 1.4rem);
  color:var(--rose-light, #B08B82);
}

/* Extra iconen (v10.5): auto, trein */
.mdc-icoon-auto{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 16.5V12l2-5h12l2 5v4.5'/%3E%3Cpath d='M3.5 12h17'/%3E%3Cpath d='M4 16.5h16v2H4z'/%3E%3Ccircle cx='7.5' cy='14.3' r='.9'/%3E%3Ccircle cx='16.5' cy='14.3' r='.9'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 16.5V12l2-5h12l2 5v4.5'/%3E%3Cpath d='M3.5 12h17'/%3E%3Cpath d='M4 16.5h16v2H4z'/%3E%3Ccircle cx='7.5' cy='14.3' r='.9'/%3E%3Ccircle cx='16.5' cy='14.3' r='.9'/%3E%3C/svg%3E");}
.mdc-icoon-trein{--icoon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239E7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='3.5' width='12' height='13' rx='3'/%3E%3Cpath d='M6 10h12'/%3E%3Ccircle cx='9' cy='13.3' r='.9'/%3E%3Ccircle cx='15' cy='13.3' r='.9'/%3E%3Cpath d='M8.5 20.5 10 16.5M15.5 20.5 14 16.5'/%3E%3C/svg%3E");--icoon-groen:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F7656' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='3.5' width='12' height='13' rx='3'/%3E%3Cpath d='M6 10h12'/%3E%3Ccircle cx='9' cy='13.3' r='.9'/%3E%3Ccircle cx='15' cy='13.3' r='.9'/%3E%3Cpath d='M8.5 20.5 10 16.5M15.5 20.5 14 16.5'/%3E%3C/svg%3E");}

/* Footer: rij met plaatsen (werkgebied) */
.footer-plaatsen{
  margin:var(--sp-3, 1.75rem) auto 0;
  padding-top:var(--sp-3, 1.75rem);
  border-top:1px solid rgba(203,176,170,.45);
  max-width:60rem;
  text-align:center;
  font-size:.85rem;
  line-height:2;
  color:var(--text-soft, #8A8582);
}
.footer-plaatsen a{ color:var(--text-soft, #8A8582); text-decoration:none; white-space:nowrap; }
.footer-plaatsen a:hover{ color:var(--rose, #9E7F70); }
.footer-plaatsen-kop{ display:block; font-weight:600; letter-spacing:.06em; }
.footer-plaatsen-kop a{ color:var(--rose, #9E7F70); }

/* Plaatspagina: buurplaatsen als kleine knoppen */
.mdc-plaats-slot .wp-block-buttons .is-style-mdc-omlijnd .wp-block-button__link{ font-size:.75rem; padding:.7em 1.4em; }
.mdc-plaats-slot .is-style-mdc-bovenkop{ margin-top:var(--sp-4, 3rem); }
/* Overzicht werkgebied: plaatsnaam als link in de kaart */
.mdc-kaarten-klein h3 a{ color:inherit; text-decoration:none; }
.mdc-kaarten-klein h3 a::after{ content:""; position:absolute; inset:0; }
.mdc-kaarten-klein > .wp-block-column{ position:relative; transition:border-color .25s, transform .25s; }
.mdc-kaarten-klein > .wp-block-column:has(h3 a):hover{ border-color:var(--rose, #9E7F70); transform:translateY(-2px); }

/* Lege opvulkaarten zodat een onvolledige laatste rij even breed blijft */
.mdc-kaarten-klein > .wp-block-column.mdc-leeg{ visibility:hidden; border:0; background:none; }
@media (max-width:781px){ .mdc-kaarten-klein > .wp-block-column.mdc-leeg{ display:none; } }
