/*
 * Kruidenbuurt Kerst: vallende sneeuw, kerstlichtjes onder de menubalk, "Fijne feestdagen!" in de logobalk,
 * kerstmuts op het logo, besneeuwde heuvels met kerstbomen en een sneeuwpop boven de voet. theme.php zet de site op
 * licht en geeft de kleuren (kerstrood, crème). Sneeuw en lichtjes bewegen in de SVG zelf (uit bij
 * prefers-reduced-motion). Plaatjes met een absoluut pad (kleine kind.css staat inline).
 */

:root {
    --ks-rood: #e01b24;
    --ks-rood-donker: #a3121a;
    --ks-groen: #1d5c34;
    --ks-goud: #e8b323;
}

/* Winterlucht bovenaan, daaronder crème; sneeuw valt over de hele kop */
body {
    position: relative;
}

/* Achtergrond alleen in licht: 'bg' in theme.php gold ook in de donkere modus (lichte achtergrond, lichte tekst) */
html:not([data-bs-theme=dark]) {
    --page-bg: #faf6ee;
}

html:not([data-bs-theme=dark]) body {
    background-color: var(--page-bg);
    background-image: linear-gradient(180deg, #dbe9f6 0, #eef4fa 110px, rgba(250, 246, 238, 0) 300px);
    background-repeat: no-repeat;
}

body::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 140px;
    background: url("/themes/kruidenbuurt-kerst/assets/sneeuw.svg") repeat-x left top / 400px 140px;
    pointer-events: none;
    z-index: 3;
}

/* Kerstmuts op het logo (was de seizoensversiering) */
.navbar-brand {
    position: relative;
    --deco-k: 1;
}

.navbar-brand::after {
    content: "";
    position: absolute;
    aspect-ratio: 1;
    background: url("/themes/kruidenbuurt-kerst/assets/kerstmuts.svg") no-repeat center / contain;
    pointer-events: none;
    height: calc(34px * var(--deco-k));
    left: calc(-20px * var(--deco-k)); /* half buiten het embleem, anders valt hij weg in de tekst */
    top: -8px;
    transform: rotate(-14deg);
    filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, 0.4));
}

/* "Fijne feestdagen!" midden in de logobalk (desktop) */
.kop-logobalk {
    position: relative;
}

.kop-logobalk::after {
    content: "\2744\FE0E  Fijne feestdagen!  \2744\FE0E";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--heading-font);
    font-weight: 700;
    font-size: 1.35rem;
    white-space: nowrap;
    color: var(--ks-rood);
    text-shadow: 0 1px 0 #fff, 0 0 10px rgba(255, 255, 255, 0.9);
    pointer-events: none;
}

.header-cta .btn {
    background: linear-gradient(135deg, var(--ks-rood), var(--ks-rood-donker)) !important;
    box-shadow: 0 4px 14px rgba(224, 27, 36, 0.35) !important;
}

/* Kerstlichtjes onder de rode menubalk */
html .main-nav {
    position: relative;
    border-bottom: 3px solid var(--ks-groen);
}

html .main-nav::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 1px);
    height: 26px;
    background: url("/themes/kruidenbuurt-kerst/assets/lichtjes.svg") repeat-x left top / 120px 26px;
    pointer-events: none;
    z-index: 2;
}

/* Koppen rood, hoofdtitel met een groene schaduwrand; pictogrammen in rode bolletjes */
:is(h1, .h1) {
    color: var(--ks-rood) !important;
}

:is(h2, .h2, .text-success) {
    color: var(--ks-groen) !important;
}

/* Icoonbolletjes als kerstbal (assets/kerstbal.svg): hangt aan zijn oog en schommelt zacht; bij aanwijzen van het blok
   tolt hij even. Het icoon wit in het midden van de bal. */
.icon-circle.bg-success {
    background: url("/themes/kruidenbuurt-kerst/assets/kerstbal.svg") no-repeat center / contain !important;
    border-radius: 0;
    filter: drop-shadow(0 4px 8px rgba(160, 20, 30, 0.35));
    transform-origin: 50% 2%;
    animation: ks-bal-schommel 4s ease-in-out infinite;
}

.icon-circle.bg-success i {
    top: 59%;
    color: #fff !important;
    text-shadow: 0 0 6px rgba(255, 215, 106, 0.8);
}

.icon-circle.bg-success i.fa-2x {
    font-size: 1.55em;
}

.hover-card:hover .icon-circle.bg-success {
    animation: ks-bal-tol 0.9s ease-in-out;
}

@keyframes ks-bal-schommel { 0%, 100% { rotate: -3deg; } 50% { rotate: 3deg; } }
@keyframes ks-bal-tol { 0% { rotate: 0deg; } 30% { rotate: -16deg; } 60% { rotate: 11deg; } 85% { rotate: -4deg; } 100% { rotate: 0deg; } }

.hover-card:hover {
    box-shadow: 0 0 0 2px var(--ks-goud), 0 8px 22px rgba(0, 0, 0, 0.12) !important;
}

/* Voet: dennengroen, met besneeuwde heuvels, kerstbomen en een sneeuwpop erboven */
.footer {
    position: relative;
    margin-top: 96px;
    background-color: #12391f !important;
}

.footer::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -90px;
    height: 91px;
    background: url("/themes/kruidenbuurt-kerst/assets/winter.svg") repeat-x left bottom / 300px 90px;
    pointer-events: none;
}

.footer::after {
    content: "";
    position: absolute;
    right: max(16px, calc(50% - 560px));
    top: -96px;
    width: 64px;
    height: 92px;
    background: url("/themes/kruidenbuurt-kerst/assets/sneeuwpop.svg") no-repeat center bottom / contain;
    cursor: pointer; /* paasei: klik voor een kerstmop (functions.php) */
}

.footer.ks-zonder-wortel::after {
    background-image: url("/themes/kruidenbuurt-kerst/assets/sneeuwpop-zonder-wortel.svg");
}

.footer-kop {
    color: #ffd76a !important;
}

/* Tablet en mobiel: geen aparte menubalk onder het logo (zoals Halloween en Oud en nieuw). De balk (daar staan
   dan alleen het hamburgerknopje en het zoekicoon; het menu zelf is een uitschuifpaneel) schuift omhoog over de
   logobalk, knoppen rechts. 61px = hoogte logobalk (logo 45px in header.css + py-2). Doorzichtig, laat kliks door
   behalve op de knoppen en het paneel. Hamburger en zoekicoon rood (op de lichte logobalk). */
@media (max-width: 991.98px) {
    .navbar-brand { --deco-k: 0.75; }
    /* Minder ver naar links: de container heeft hier maar 12px marge tot de schermrand */
    .navbar-brand::after { left: -10px; }

    html .main-nav {
        margin-top: -61px;
        height: 61px;
        background-color: transparent;
        pointer-events: none;
    }

    html .main-nav > .container {
        justify-content: flex-end;
        align-items: center;
        height: 100%;
    }

    html .main-nav .navbar-toggler,
    html .main-nav .mobile-search-toggle,
    html .main-nav .offcanvas {
        pointer-events: auto;
    }

    html .main-nav .mobile-search-toggle {
        order: 1;
        margin-right: 6px;
        --bs-btn-color: var(--ks-rood);
        --bs-btn-hover-color: var(--ks-rood-donker);
        --bs-btn-active-color: var(--ks-rood-donker);
    }

    html .main-nav .navbar-toggler {
        order: 2;
        background-color: var(--ks-rood);
        border-color: var(--ks-rood);
    }

    .header-cta {
        margin-right: 72px;
    }

    .kop-logobalk::after {
        display: none;
    }
}

/* Op 24-26 december (functions.php zet body.ks-kerstdag) */
.ks-kerstdag .kop-logobalk::after {
    content: "\2744\FE0E  Vrolijk kerstfeest!  \2744\FE0E";
}

/* ---- Op een bericht (functions.php, hook post.after_content) ---- */
.pagina-posts-blog-single article { position: relative; }

/* Kerstbal aan een rood lint rechtsboven; zakt bij het laden, schommelt; aanwijzen of klikken: tollen (paasei: de
   vijfde klik laat hem vallen, functions.php) */
.ks-hangbal { position: absolute; top: 0; right: 6%; z-index: 3; display: flex; flex-direction: column; align-items: center;
    transform-origin: 50% 0; animation: ks-hang-zak 1.8s cubic-bezier(.3, 1.4, .5, 1) .5s both, ks-bal-schommel 4.5s ease-in-out 2.3s infinite; }
.ks-hangbal__lint { width: 3px; height: 70px; background: linear-gradient(90deg, #a3121a, #ff5a60 50%, #a3121a); }
.ks-hangbal img { display: block; cursor: pointer; margin-top: -4px; filter: drop-shadow(0 4px 6px rgba(120, 10, 20, .35)); }
.ks-hangbal:hover img, .ks-hangbal--tol img { animation: ks-bal-draai 1s ease-in-out; }
.ks-hangbal--valt img { animation: ks-bal-val .65s cubic-bezier(.5, 0, 1, .6) forwards; }
@keyframes ks-hang-zak { from { transform: translateY(-130px); } to { transform: translateY(0); } }
@keyframes ks-bal-draai { 0% { transform: rotateY(0); } 100% { transform: rotateY(720deg); } }
@keyframes ks-bal-val { 0% { transform: translateY(0); } 99% { transform: translateY(240px) rotate(40deg); opacity: 1; } 100% { transform: translateY(240px); opacity: 0; } }

/* Snoer kerstlichtjes bovenin: gaat aan naarmate je verder leest */
.ks-lichtsnoer { position: fixed; left: 0; right: 0; top: 0; height: 12px; z-index: 1090; pointer-events: none; --ks-lees: 0%;
    background: linear-gradient(#2c3e2f, #2c3e2f) 0 2px / 100% 1px no-repeat,
        radial-gradient(circle at 10px 7px, #c9c2b8 0 3px, transparent 3.5px) 0 0 / 20px 12px repeat-x; }
.ks-lichtsnoer__aan { position: absolute; left: 0; top: 0; bottom: 0; width: var(--ks-lees); overflow: hidden;
    background: radial-gradient(circle at 10px 7px, #ff3b3b 0 3px, transparent 3.5px) 0 0 / 80px 12px repeat-x,
        radial-gradient(circle at 30px 7px, #ffd23f 0 3px, transparent 3.5px) 0 0 / 80px 12px repeat-x,
        radial-gradient(circle at 50px 7px, #3fd16b 0 3px, transparent 3.5px) 0 0 / 80px 12px repeat-x,
        radial-gradient(circle at 70px 7px, #4aa8ff 0 3px, transparent 3.5px) 0 0 / 80px 12px repeat-x;
    filter: drop-shadow(0 0 3px rgba(255, 220, 120, .9)); animation: ks-snoer-flonker 1.6s steps(2) infinite; }
@keyframes ks-snoer-flonker { 50% { filter: drop-shadow(0 0 5px rgba(255, 220, 120, 1)) brightness(1.15); } }

/* Rode beginletter met een sneeuwkapje (niet zwevend: een korte eerste alinea duwt dan geen tekst opzij) */
.pagina-posts-blog-single .blog-content > p:first-of-type::first-letter {
    font-size: 2.1em; line-height: 1; font-family: Georgia, "Times New Roman", serif; font-style: normal; color: var(--ks-rood);
    text-shadow: 0 -3px 0 #fff, 0 -4px 2px rgba(127, 179, 224, .6), 0 2px 3px rgba(0, 0, 0, .15); }

/* ---- Vlokjes en sterretjes (typen, verzenden, cadeautjes) ---- */
.ks-vlok { position: fixed; z-index: 1095; pointer-events: none; line-height: 1; margin: -6px 0 0 -5px;
    text-shadow: 0 0 3px rgba(255, 255, 255, .9); animation: ks-vlok 1.5s ease-out forwards; }
@keyframes ks-vlok { 0% { transform: translate(0, 0) rotate(0) scale(.4); opacity: 0; } 15% { opacity: 1; transform: translate(calc(var(--dx) * .2), calc(var(--dy) * .1)) scale(1); }
    100% { transform: translate(var(--dx), var(--dy)) rotate(var(--r)) scale(.7); opacity: 0; } }

/* ---- Arrenslee door de logobalk ---- */
.ks-slee-lucht { position: fixed; left: 0; right: 0; overflow: hidden; pointer-events: none; z-index: 1030; }
.ks-slee { position: absolute; top: 2px; left: -200px; width: 180px; animation: ks-slee-vlucht 8s cubic-bezier(.35, .1, .65, .9) forwards; }
.ks-slee svg { display: block; width: 100%; height: auto; overflow: visible; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .25)); animation: ks-slee-dobber 1.2s ease-in-out infinite alternate; }
.ks-slee__poten { animation: ks-slee-galop .3s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 50% 0; }
.ks-slee__neus { animation: ks-neus 0.6s ease-in-out infinite alternate; }
.ks-slee__spoor { position: absolute; right: 100%; top: 72%; width: 160px; height: 8px; margin-right: -8px; border-radius: 4px;
    background: radial-gradient(circle, #ffd76a 0 1.5px, transparent 2px) 0 0 / 12px 8px, linear-gradient(90deg, transparent, rgba(232, 179, 35, .55));
    filter: drop-shadow(0 0 3px rgba(232, 179, 35, .8)); }
.ks-slee__hoho { position: absolute; left: 96%; top: 16px; font: italic 700 1.05rem/1 Georgia, serif; color: var(--ks-rood); white-space: nowrap;
    text-shadow: 0 1px 0 #fff, 0 0 8px #fff; opacity: 0; animation: ks-slee-hoho 8s linear forwards; }
@keyframes ks-slee-vlucht { 0% { left: -200px; transform: translateY(26px); } 50% { transform: translateY(0); } 100% { left: calc(100% + 220px); transform: translateY(14px); } }
@keyframes ks-slee-dobber { from { transform: translateY(0) rotate(-2deg); } to { transform: translateY(-5px) rotate(1deg); } }
@keyframes ks-slee-galop { from { transform: rotate(-8deg); } to { transform: rotate(8deg); } }
@keyframes ks-neus { from { filter: none; } to { filter: drop-shadow(0 0 4px #ff2a2a); } }
@keyframes ks-slee-hoho { 0%, 30% { opacity: 0; transform: translateY(4px); } 36%, 58% { opacity: 1; transform: translateY(-6px); } 66%, 100% { opacity: 0; transform: translateY(-14px); } }

/* ---- Roodborstje op een kaart (nieuws, archieven, FAQ) ---- */
.ks-vogel-vak { position: relative; }
.ks-roodborstje { position: absolute; z-index: 4; width: 44px; margin: -38px 0 0 -22px; pointer-events: none; animation: ks-roodborstje 6s ease-in-out forwards; }
.ks-roodborstje--links .ks-roodborstje__lijf { transform: scaleX(-1); }
.ks-roodborstje__lijf { display: block; }
.ks-roodborstje svg { display: block; overflow: visible; animation: ks-huppel 6s ease-in-out forwards; transform-origin: 50% 100%; }
.ks-roodborstje__vleugel { transform-box: fill-box; transform-origin: 30% 50%; animation: ks-vleugel .12s ease-in-out 0s 9 alternate, ks-vleugel .12s ease-in-out 5.1s 8 alternate; }
.ks-roodborstje__tjilp { position: absolute; left: 70%; top: -14px; font: italic 700 .8rem/1 Georgia, serif; color: var(--ks-groen); white-space: nowrap;
    opacity: 0; animation: ks-tjilp 6s linear forwards; }
@keyframes ks-roodborstje {
    0% { transform: translate(-90px, -70px); opacity: 0; } 4% { opacity: 1; } 16% { transform: translate(0, 0); }
    82% { transform: translate(0, 0); opacity: 1; } 100% { transform: translate(110px, -90px); opacity: 0; } }
@keyframes ks-huppel {
    0%, 18% { transform: none; } 22% { transform: translateY(-8px); } 26% { transform: none; } 30% { transform: translateY(-8px); } 34% { transform: none; }
    44% { transform: rotate(-12deg); } 52% { transform: rotate(6deg); } 60%, 100% { transform: none; } }
@keyframes ks-vleugel { from { transform: rotate(0); } to { transform: rotate(-35deg) scaleY(1.3); } }
@keyframes ks-tjilp { 0%, 46% { opacity: 0; transform: translateY(0); } 50%, 64% { opacity: 1; transform: translateY(-6px); } 70%, 100% { opacity: 0; transform: translateY(-12px); } }

/* ---- /links: cadeautjes (plugin links, eigen <style> in de view; body.pagina-plugin-links-index weegt zwaarder) ----
   Elk blok is een ingepakt cadeau: papier (vier soorten om en om), een lint met strik aan de rechterkant; de kop is het
   deksel en tilt op bij aanwijzen; de links staan op een crème kaartje in het pakje. */
body.pagina-plugin-links-index .row.row-cols-1 { --bs-gutter-y: 2.75rem; --bs-gutter-x: 1.75rem; margin-top: 0; }
body.pagina-plugin-links-index .border-bottom h3.mb-0::after { content: " \1F381"; font-size: .9em; }
body.pagina-plugin-links-index .category-box { --ks-papier: #c4161c; --ks-patroon: radial-gradient(circle, rgba(255, 255, 255, .28) 0 2px, transparent 2.5px) 0 0 / 18px 18px;
    position: relative; overflow: visible; border: 0; border-radius: 4px; padding: 0 12px 12px; background: var(--ks-patroon), var(--ks-papier);
    box-shadow: 0 8px 18px rgba(60, 20, 20, .22), inset 0 -6px 0 rgba(0, 0, 0, .12); transition: transform .25s ease; }
body.pagina-plugin-links-index .row-cols-1 > .col:nth-child(4n+2) .category-box { --ks-papier: #1d5c34;
    --ks-patroon: repeating-linear-gradient(45deg, rgba(255, 255, 255, .1) 0 8px, transparent 8px 16px); }
body.pagina-plugin-links-index .row-cols-1 > .col:nth-child(4n+3) .category-box { --ks-papier: #1f4e8c;
    --ks-patroon: radial-gradient(circle, rgba(255, 255, 255, .35) 0 1.5px, transparent 2px) 0 0 / 14px 14px, radial-gradient(circle, rgba(255, 255, 255, .2) 0 1px, transparent 1.5px) 7px 7px / 14px 14px; }
body.pagina-plugin-links-index .row-cols-1 > .col:nth-child(4n+4) .category-box { --ks-papier: #7a1f4f;
    --ks-patroon: repeating-linear-gradient(90deg, rgba(255, 215, 106, .22) 0 3px, transparent 3px 22px); }
/* Lint over het pakje (onder het kaartje door) */
body.pagina-plugin-links-index .category-box::after { content: ""; position: absolute; top: 0; bottom: 0; left: calc(78% - 7px); width: 14px; pointer-events: none;
    background: linear-gradient(90deg, #c8960f, #ffe08a 45%, #c8960f); }
body.pagina-plugin-links-index .category-box:hover { transform: translateY(-2px); }
/* Deksel: iets breder dan het pakje, met hetzelfde papier en het lint; tilt op bij aanwijzen; strik erop */
body.pagina-plugin-links-index .category-header { position: relative; z-index: 2; margin: 0 -6px; padding: 12px 16px; border: 0; border-radius: 4px;
    background: linear-gradient(90deg, transparent calc(78% - 10.4px), #c8960f calc(78% - 10.4px), #ffe08a calc(78% - 3.4px), #c8960f calc(78% + 3.6px), transparent calc(78% + 3.6px)),
        var(--ks-patroon), var(--ks-papier);
    box-shadow: 0 4px 0 rgba(0, 0, 0, .18), inset 0 -2px 0 rgba(0, 0, 0, .15); color: #fff; font: 700 1rem/1.3 var(--heading-font, inherit);
    text-shadow: 0 1px 2px rgba(0, 0, 0, .45); transform-origin: 10% 100%; transition: transform .3s cubic-bezier(.3, 1.5, .5, 1); }
body.pagina-plugin-links-index .category-header i { color: #fff !important; filter: drop-shadow(0 0 4px rgba(255, 215, 106, .9)); }
body.pagina-plugin-links-index .category-header::before { content: ""; position: absolute; top: -26px; left: calc(78% - 36px); width: 66px; height: 36px;
    background: url("/themes/kruidenbuurt-kerst/assets/strik.svg") no-repeat center / contain; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25)); pointer-events: none; }
body.pagina-plugin-links-index .category-box:hover .category-header { transform: translateY(-7px) rotate(-2deg); }
/* Kaartje met de links */
body.pagina-plugin-links-index .links-list { position: relative; z-index: 1; margin: 12px 0 0; padding: 4px 0; background: #fffdf8; border-radius: 3px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .18); }
body.pagina-plugin-links-index .links-list li { border-bottom: 1px dashed #eadfcf; }
body.pagina-plugin-links-index .links-list li:last-child { border-bottom: 0; }
body.pagina-plugin-links-index .links-list li a { color: #2b2b2b; }
body.pagina-plugin-links-index .links-list li a:hover { background: #fdf1e6; color: var(--ks-rood); }
body.pagina-plugin-links-index .links-list li a:hover .link-bullet { color: var(--ks-goud); transform: rotate(72deg) scale(1.3); }
body.pagina-plugin-links-index .link-bullet { transition: transform .25s ease, color .15s ease; }

/* ---- Paaseieren (functions.php) ---- */
.ks-wolkje { position: fixed; z-index: 1100; max-width: min(320px, calc(100vw - 16px)); padding: 10px 14px; border-radius: 14px; background: #fff;
    color: #2b2b2b; font: 600 .9rem/1.35 var(--body-font, system-ui), sans-serif; box-shadow: 0 6px 20px rgba(0, 0, 0, .2), 0 0 0 2px var(--ks-rood);
    animation: ks-wolkje-in .3s cubic-bezier(.3, 1.5, .5, 1); transition: opacity .4s ease, transform .4s ease; }
.ks-wolkje::after { content: ""; position: absolute; left: 50%; bottom: -8px; margin-left: -8px; border: 8px solid transparent; border-bottom: 0; border-top-color: #fff;
    filter: drop-shadow(0 2px 0 var(--ks-rood)); }
.ks-wolkje--weg { opacity: 0; transform: translateY(-8px); }
@keyframes ks-wolkje-in { from { opacity: 0; transform: translateY(8px) scale(.9); } to { opacity: 1; transform: none; } }
.ks-wortel { position: fixed; z-index: 1099; width: 12px; height: 5px; pointer-events: none; background: #ff8a1f; clip-path: polygon(0 0, 100% 50%, 0 100%);
    animation: ks-wortel 1.6s cubic-bezier(.5, 0, 1, .5) forwards; }
@keyframes ks-wortel { 0% { transform: translate(0, 0) rotate(0); } 100% { transform: translate(30px, 110px) rotate(560deg); opacity: .8; } }
.ks-scherf { position: fixed; z-index: 1099; width: 7px; height: 5px; pointer-events: none; clip-path: polygon(0 0, 100% 30%, 40% 100%);
    animation: ks-scherf 1.2s cubic-bezier(.2, .6, .4, 1) forwards; }
@keyframes ks-scherf { 0% { transform: translate(0, 0) rotate(0); } 40% { transform: translate(calc(var(--dx) * .6), var(--dy)) rotate(calc(var(--r) * .5)); }
    100% { transform: translate(var(--dx), 30px) rotate(var(--r)); opacity: 0; } }
.ks-storm { position: fixed; inset: 0; z-index: 1098; pointer-events: none; overflow: hidden; background: rgba(219, 233, 246, .25); transition: opacity 1.2s ease; }
.ks-storm span { position: absolute; top: -30px; color: #fff; text-shadow: 0 0 3px rgba(127, 179, 224, .9); animation: ks-storm linear infinite; }
.ks-storm--weg { opacity: 0; }
@keyframes ks-storm { from { transform: translate(0, 0) rotate(0); } to { transform: translate(var(--dx), 110vh) rotate(360deg); } }
.ks-storm__kop { position: absolute; left: 50%; top: 38%; transform: translate(-50%, -50%); font: 700 clamp(1.8rem, 6vw, 3.6rem)/1 var(--heading-font, Georgia), serif;
    color: var(--ks-rood); white-space: nowrap; text-shadow: 0 2px 0 #fff, 0 0 18px #fff, 0 0 30px rgba(127, 179, 224, .9); animation: ks-wolkje-in .6s cubic-bezier(.3, 1.5, .5, 1); }

@media (prefers-reduced-motion: reduce) {
    .icon-circle.bg-success, .ks-hangbal, .ks-hangbal img, .ks-lichtsnoer__aan { animation: none !important; }
    .ks-slee-lucht, .ks-roodborstje, .ks-vlok, .ks-scherf, .ks-wortel { display: none !important; }
    body.pagina-plugin-links-index .category-header { transition: none; }
}
@media print {
    .ks-hangbal, .ks-lichtsnoer, .ks-slee-lucht, .ks-roodborstje, .ks-vlok, .ks-wolkje, .ks-storm, .ks-scherf, .ks-wortel { display: none !important; }
}