/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 24 2026 | 20:19:17 */
/* =====================================================
 * Herbwise — Seizoenskleuren
 * Gesynchroniseerd met Figma Design Library
 * Laatste sync: maart 2026
 *
 *
 * Seizoensindeling (jaarfeesten):
 *   Lente:  21 mrt – 20 jun  (Ostara → Litha)
 *   Zomer:  21 jun – 22 sep  (Litha → Mabon)
 *   Herfst: 23 sep – 20 dec  (Mabon → Yule)
 *   Winter: 21 dec – 20 mrt  (Yule → Ostara)
 * ===================================================== */


/* =====================================================
 * 1. RUWE KLEURSCHALEN
 * ===================================================== */

:root {

  /* --- Winter --- */
  --winter-blauw-100:  #F3F5FB;
  --winter-blauw-200:  #CDD6F0;
  --winter-blauw-300:  #9EB1E8;
  --winter-blauw-400:  #7E96DC;
  --winter-blauw-500:  #5575D4;
  --winter-blauw-600:  #2F56C8;
  --winter-blauw-700:  #2444A2;
  --winter-blauw-800:  #19337B;
  --winter-blauw-900:  #102153;
  --winter-blauw-1000: #07102B;

  --winter-creme-100:  #F9F7F4;
  --winter-creme-200:  #EFE7DA;
  --winter-creme-300:  #DACAB1;
  --winter-creme-400:  #CBB48F;
  --winter-creme-500:  #BD9E6B;
  --winter-creme-600:  #AD874A;
  --winter-creme-700:  #8C6D3A;
  --winter-creme-800:  #6A522B;
  --winter-creme-900:  #47371C;
  --winter-creme-1000: #241C0E;

  --winter-roze-100:   #F9F5F5;
  --winter-roze-200:   #E7D3D2;
  --winter-roze-300:   #D5B7B6;
  --winter-roze-400:   #C49896;
  --winter-roze-500:   #B47875;
  --winter-roze-600:   #A15956;
  --winter-roze-700:   #824744;
  --winter-roze-800:   #623432;
  --winter-roze-900:   #422321;
  --winter-roze-1000:  #221110;

  --winter-bruin-100:  #F9F7F5;
  --winter-bruin-200:  #E6DED6;
  --winter-bruin-300:  #D5C6B7;
  --winter-bruin-400:  #C3AD97;
  --winter-bruin-500:  #AF8F6E;
  --winter-bruin-600:  #9F7C58;
  --winter-bruin-700:  #816345;
  --winter-bruin-800:  #614B33;
  --winter-bruin-900:  #413222;
  --winter-bruin-1000: #211911;

  /* --- Lente --- */
  --lente-paars-100:   #F5F1FC;
  --lente-paars-200:   #D6C6F7;
  --lente-paars-300:   #B696F7;
  --lente-paars-400:   #966BEF;
  --lente-paars-500:   #763CED;
  --lente-paars-600:   #5711E6;
  --lente-paars-700:   #450BBB;
  --lente-paars-800:   #33068E;
  --lente-paars-900:   #220361;
  --lente-paars-1000:  #110032;

  --lente-geel-100:    #FCFBF2;
  --lente-geel-200:    #F3F1C9;
  --lente-geel-300:    #ECE89F;
  --lente-geel-400:    #ECE67C;
  --lente-geel-500:    #E1D947;
  --lente-geel-600:    #D8CE1F;
  --lente-geel-700:    #AFA716;
  --lente-geel-800:    #867F0F;
  --lente-geel-900:    #5A5609;
  --lente-geel-1000:   #2E2C04;

  --lente-groen-100:   #F8FAF3;
  --lente-groen-200:   #E5F2D1;
  --lente-groen-300:   #CCE3A9;
  --lente-groen-400:   #B6D882;
  --lente-groen-500:   #A0CE5B;
  --lente-groen-600:   #8AC136;
  --lente-groen-700:   #6F9C2A;
  --lente-groen-800:   #54771E;
  --lente-groen-900:   #385013;
  --lente-groen-1000:  #1C2909;

  --lente-blauw-100:   #F5F5F9;
  --lente-blauw-200:   #D5D8E7;
  --lente-blauw-300:   #B5BBD6;
  --lente-blauw-400:   #949DC6;
  --lente-blauw-500:   #737EB5;
  --lente-blauw-600:   #505D9C;
  --lente-blauw-700:   #424D84;
  --lente-blauw-800:   #313A64;
  --lente-blauw-900:   #202643;
  --lente-blauw-1000:  #101322;

  /* --- Zomer --- */
  --zomer-oranje-100:  #FDF7F1;
  --zomer-oranje-200:  #FADDC3;
  --zomer-oranje-300:  #F8C393;
  --zomer-oranje-400:  #FC9D47;
  --zomer-oranje-500:  #F88F30;
  --zomer-oranje-600:  #F47603;
  --zomer-oranje-700:  #C65E00;
  --zomer-oranje-800:  #954700;
  --zomer-oranje-900:  #642F00;
  --zomer-oranje-1000: #321800;

  --zomer-salie-100:   #F5F8F7;
  --zomer-salie-200:   #D8E4E0;
  --zomer-salie-300:   #BBD0C8;
  --zomer-salie-400:   #91B7A9;
  --zomer-salie-500:   #7FAA9A;
  --zomer-salie-600:   #629682;
  --zomer-salie-700:   #4E7869;
  --zomer-salie-800:   #3A5B4F;
  --zomer-salie-900:   #263D35;
  --zomer-salie-1000:  #131F1B;

  --zomer-blauw-100:   #F2F6FC;
  --zomer-blauw-200:   #C9DBF4;
  --zomer-blauw-300:   #9FBFED;
  --zomer-blauw-400:   #73A4E7;
  --zomer-blauw-500:   #4788E2;
  --zomer-blauw-600:   #1E6DD9;
  --zomer-blauw-700:   #1657B0;
  --zomer-blauw-800:   #154B95;
  --zomer-blauw-900:   #082B5B;
  --zomer-blauw-1000:  #03162F;

  --zomer-groen-100:   #F5F9F5;
  --zomer-groen-200:   #D5E8D5;
  --zomer-groen-300:   #B4D7B6;
  --zomer-groen-400:   #93C695;
  --zomer-groen-500:   #72B775;
  --zomer-groen-600:   #4C984F;
  --zomer-groen-700:   #418544;
  --zomer-groen-800:   #306532;
  --zomer-groen-900:   #1F4421;
  --zomer-groen-1000:  #0F2310;

  /* --- Herfst --- */
  --herfst-olijf-100:  #F8F8F6;
  --herfst-olijf-200:  #E3E2D9;
  --herfst-olijf-300:  #CECDBD;
  --herfst-olijf-400:  #BAB8A0;
  --herfst-olijf-500:  #A8A685;
  --herfst-olijf-600:  #908E67;
  --herfst-olijf-700:  #747252;
  --herfst-olijf-800:  #58563D;
  --herfst-olijf-900:  #3B3A28;
  --herfst-olijf-1000: #1E1D14;

  --herfst-bruin-100:  #FAF7F3;
  --herfst-bruin-200:  #EEDDCF;
  --herfst-bruin-300:  #E1C4AA;
  --herfst-bruin-400:  #D6AA84;
  --herfst-bruin-500:  #CC915D;
  --herfst-bruin-600:  #BE7839;
  --herfst-bruin-700:  #8C582A;
  --herfst-bruin-800:  #754820;
  --herfst-bruin-900:  #4F3014;
  --herfst-bruin-1000: #28180A;

  --herfst-paars-100:  #F6F6F8;
  --herfst-paars-200:  #DCDAE3;
  --herfst-paars-300:  #C1BDCE;
  --herfst-paars-400:  #A7A0BA;
  --herfst-paars-500:  #8C83A5;
  --herfst-paars-600:  #716790;
  --herfst-paars-700:  #5B5274;
  --herfst-paars-800:  #433D55;
  --herfst-paars-900:  #2D293B;
  --herfst-paars-1000: #17141E;

  --herfst-roze-100:   #F9F6F4;
  --herfst-roze-200:   #E9D9D4;
  --herfst-roze-300:   #D8BBB3;
  --herfst-roze-400:   #C69485;
  --herfst-roze-500:   #BA806F;
  --herfst-roze-600:   #A9634F;
  --herfst-roze-700:   #884F3E;
  --herfst-roze-800:   #673B2E;
  --herfst-roze-900:   #45271E;
  --herfst-roze-1000:  #23130F;
}


/* =====================================================
 * 2. SEMANTISCHE VARIABELEN PER SEIZOEN
 * Exact gesynchroniseerd met Figma / Semantisch collectie
 *
 * Gebruik altijd deze variabelen in je WordPress blokken:
 *
 *   Paginaachtergrond    → var(--kleur-achtergrond)
 *   Zachte vlakken       → var(--kleur-achtergrond-zacht)
 *   Primaire kleur       → var(--kleur-primair)
 *   Hoofdtekst           → var(--kleur-text)
 *   Accentkleur          → var(--kleur-accent)
 *   Tekst op accent      → var(--kleur-on-accent)
 *   Lichte accentvlakken → var(--kleur-accent-licht)
 *   Tekst op licht accent→ var(--kleur-on-accent-licht)
 *   Lichtste kleur       → var(--kleur-lightest)
 *   Donkerste kleur      → var(--kleur-darkest)
 * ===================================================== */

body.seizoen-winter {
  --kleur-achtergrond:       var(--winter-blauw-200);
  --kleur-achtergrond-zacht: var(--winter-blauw-100);
  --kleur-primair:           var(--winter-blauw-500);
  --kleur-text:              var(--winter-blauw-800);
  --kleur-accent:            var(--winter-blauw-400);
  --kleur-on-accent:         var(--winter-blauw-1000);
  --kleur-accent-licht:      var(--winter-roze-200);
  --kleur-on-accent-licht:   var(--winter-blauw-600);
  --kleur-lightest:          var(--winter-blauw-100);
  --kleur-darkest:           var(--winter-blauw-1000);
}

body.seizoen-lente {
  --kleur-achtergrond:       var(--lente-groen-200);
  --kleur-achtergrond-zacht: var(--lente-groen-100);
  --kleur-primair:           var(--lente-groen-700);
  --kleur-text:              var(--lente-groen-900);
  --kleur-accent:            var(--lente-paars-300);
  --kleur-on-accent:         var(--lente-paars-1000);
  --kleur-accent-licht:      var(--lente-geel-300);
  --kleur-on-accent-licht:   var(--lente-paars-700);
  --kleur-lightest:          var(--lente-geel-100);
  --kleur-darkest:           var(--lente-blauw-1000);
}

body.seizoen-zomer {
  --kleur-achtergrond:       var(--zomer-oranje-200);
  --kleur-achtergrond-zacht: var(--zomer-oranje-100);
  --kleur-primair:           var(--zomer-salie-600);
  --kleur-text:              var(--zomer-salie-900);
  --kleur-accent:            var(--zomer-oranje-500);
  --kleur-on-accent:         var(--zomer-oranje-1000);
  --kleur-accent-licht:      var(--zomer-salie-400);
  --kleur-on-accent-licht:   var(--zomer-blauw-800);
  --kleur-lightest:          var(--zomer-groen-100);
  --kleur-darkest:           var(--zomer-salie-1000);
}

body.seizoen-herfst {
  --kleur-achtergrond:       var(--herfst-olijf-200);
  --kleur-achtergrond-zacht: var(--herfst-olijf-100);
  --kleur-primair:           var(--herfst-bruin-600);
  --kleur-text:              var(--herfst-bruin-900);
  --kleur-accent:            var(--herfst-roze-500);
  --kleur-on-accent:         var(--herfst-roze-1000);
  --kleur-accent-licht:      var(--herfst-paars-400);
  --kleur-on-accent-licht:   var(--herfst-bruin-1000);
  --kleur-lightest:          var(--herfst-paars-100);
  --kleur-darkest:           var(--herfst-paars-1000);
}


/* =====================================================
 * 3. BASIS WORDPRESS STIJLEN
 * Seizoen-onafhankelijk — passen zich automatisch aan
 * ===================================================== */

body {
  background-color: var(--kleur-achtergrond);
  color: var(--kleur-text);
}

a {
  color: var(--kleur-primair);
}

a:hover {
  color: var(--kleur-accent);
}

/* Knoppen */
.wp-block-button__link {
  background-color: var(--kleur-accent) !important;
  color:            var(--kleur-on-accent) !important;
  border: none !important;
}

.wp-block-button__link:hover {
  background-color: var(--kleur-accent-licht) !important;
  color:            var(--kleur-on-accent-licht) !important;
}

/* Uitgelichte secties / zachte achtergrondvlakken */
.has-soft-background {
  background-color: var(--kleur-achtergrond-zacht);
}

/* Scheidingslijnen */
.wp-block-separator {
  border-color: var(--kleur-accent-licht) !important;
  opacity: 1 !important;
}

/* Citaten / blockquotes */
.wp-block-quote {
  border-left-color: var(--kleur-accent) !important;
  background-color:  var(--kleur-achtergrond-zacht);
  padding: 1rem 1.5rem;
}

/* Koppen — erven de tekstkleur automatisch */
h1, h2, h3, h4, h5, h6 {
  color: var(--kleur-text);
}