/**
 * Stippenpatroon als achtergrond van de hele site. De stippen worden door
 * assets/dot-grid.js op een canvas getekend; hier staan de instellingen.
 */

:root {
    /* --- Hier tune je het patroon --- */
    --dots-color: #0C2B3B;       /* kleur van de stippen */
    --dots-size: 3px;            /* doorsnede van een stip */
    --dots-gap: 26.67px;         /* afstand tussen de stippen */
    --dots-opacity: .1;          /* dekking zonder muis (touchscreen, muis buiten beeld) */
    --dots-opacity-max: .15;     /* dekking met muis, ver van de cursor vandaan */
    --dots-radius: 440px;        /* hoe ver het donkerder worden rond de cursor doorloopt */
    --dots-spot: 0;              /* dekking onder de cursor, als deel van
                                    --dots-opacity-max (0 = helemaal weg) */
    --dots-content-margin: 24px; /* vrije ruimte rond tekst, beeld en knoppen */
    --dots-content-fade: 48px;   /* zachte overgang daarna */
}

.thn-dots {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -1;                 /* achter de pagina-inhoud */
    pointer-events: none;
}