/* Alpine: verberg x-cloak-elementen tot Alpine geladen is (universeel, head-loaded) */
    [x-cloak]{display:none!important}
    /* Poppins — zelf gehost (latin + latin-ext), gewicht 400 / 600 / 800 */
    @font-face { font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap;
        src:url('../fonts/poppins/poppins-400-latin.woff2') format('woff2');
        unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap;
        src:url('../fonts/poppins/poppins-400-latin-ext.woff2') format('woff2');
        unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
    @font-face { font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap;
        src:url('../fonts/poppins/poppins-600-latin.woff2') format('woff2');
        unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap;
        src:url('../fonts/poppins/poppins-600-latin-ext.woff2') format('woff2');
        unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
    @font-face { font-family:'Poppins'; font-style:normal; font-weight:800; font-display:swap;
        src:url('../fonts/poppins/poppins-800-latin.woff2') format('woff2');
        unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family:'Poppins'; font-style:normal; font-weight:800; font-display:swap;
        src:url('../fonts/poppins/poppins-800-latin-ext.woff2') format('woff2');
        unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

    :root {
        /* Kleuren — huisstijl */
        --sjk-koraal:      #ff6b6b;   /* hoofdaccent / vrolijk */
        --sjk-koraal-diep: #f2564f;   /* knoppen / grote cijfers (AA) */
        --sjk-indigo:      #5457e5;   /* anker / structuur */
        --sjk-diep:        #1b1740;   /* tekst / donkere vlakken / contrast */
        --sjk-inkt:        #26243f;   /* bodytekst */
        --sjk-grijs:       #6b6a80;   /* secundaire tekst */
        --sjk-rozetint:    #fff1ef;   /* warme vlakken */
        --sjk-lavendel:    #f2f1fc;   /* koele vlakken */
        --sjk-lijn:        #e9e8fb;   /* randen */
        --sjk-wit:         #ffffff;   /* achtergrond */

        /* Typografie */
        --sjk-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

        /* Vorm — ronde hoeken + zachte schaduw */
        --sjk-radius-btn:  14px;
        --sjk-radius-card: 20px;
        --sjk-shadow:      0 8px 24px rgba(27,23,64,.08);
        --sjk-shadow-sm:   0 2px 8px rgba(27,23,64,.06);

        /* Premium-laag — elevatie-ladder (meerlaags, zachter licht van boven) */
        --sjk-el-1: 0 1px 2px rgba(27,23,64,.05), 0 1px 1px rgba(27,23,64,.04);
        --sjk-el-2: 0 2px 4px rgba(27,23,64,.05), 0 4px 10px -2px rgba(27,23,64,.08);
        --sjk-el-3: 0 6px 12px -4px rgba(27,23,64,.10), 0 14px 28px -8px rgba(27,23,64,.14);
        --sjk-el-4: 0 12px 24px -8px rgba(27,23,64,.14), 0 32px 56px -18px rgba(27,23,64,.22);
        --sjk-el-koraal: 0 12px 28px -8px rgba(242,86,79,.45);
        --sjk-el-indigo: 0 12px 28px -8px rgba(84,87,229,.40);

        /* Bewegingscurves */
        --sjk-ease-out:    cubic-bezier(.22,.61,.36,1);
        --sjk-ease-spring: cubic-bezier(.34,1.56,.64,1);
        --sjk-ease-inout:  cubic-bezier(.65,.05,.36,1);

        /* Vloeiende typografie-schaal (mobiel → desktop). Eén ladder voor home én contentpagina's,
           zodat koppen overal in verhouding staan en netjes meeschalen op mobiel. */
        --sjk-fs-eyebrow: .8rem;
        --sjk-fs-h1:      clamp(2rem, 1.1rem + 4.4vw, 3.6rem);   /* home-hero (display) */
        --sjk-fs-title:   clamp(1.9rem, 1.3rem + 2.5vw, 2.9rem); /* paginatitel content-hero */
        --sjk-fs-h2:      clamp(1.5rem, 1rem + 2.4vw, 2.4rem);   /* sectiekop home */
        --sjk-fs-h2-sub:  clamp(1.4rem, 1.12rem + 1.25vw, 1.9rem); /* artikelkop in lopende tekst */
        --sjk-fs-h3:      clamp(1.1rem, 1.01rem + .4vw, 1.28rem);  /* sub-kop + kaarttitels */
        --sjk-fs-lead:    clamp(1rem, .93rem + .5vw, 1.22rem);   /* introzin */

        /* Ritme + focus */
        --sjk-section-y: clamp(2.6rem, 6vw, 4.8rem);
        --sjk-focus:     0 0 0 3px rgba(84,87,229,.35);

        /* Merk-gradiënten (voor mesh, tekst-gradient, banden) */
        --sjk-grad-warm:  linear-gradient(135deg, var(--sjk-koraal) 0%, var(--sjk-koraal-diep) 100%);
        --sjk-grad-brand: linear-gradient(120deg, var(--sjk-koraal-diep) 0%, var(--sjk-indigo) 100%);
        --sjk-grad-navy:  linear-gradient(165deg, #1b1740 0%, #201a4a 55%, #14102f 100%);

        /* Fijne ruis (grain) als data-URI — subtiele textuur over donkere vlakken */
        --sjk-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
    }