/* ════════════════════════════════════════════════════════════
   GLOBAL BODY PATTERN — subtelny dot pattern w tle wszystkich podstron.

   Pattern dziedziczy kremowe tło z theme.json (#f4f1ec) i nakłada
   warstwę dotsów (radial-gradient circle 1px, 12px×12px grid).
   Mask-image robi delikatny fade na górze i dole, żeby pattern
   nie ciął ostro przy headerze i footerze.

   Wyłączamy na:
   - .home / .page-template-front-page — strona główna ma własne sekcje
     z opinionated tłami i ten pattern by tylko dodawał szum
   ════════════════════════════════════════════════════════════ */

body {
    position: relative;

    /* Pseudo-element jako tło — z-index: 0 + main content z-index: 1
       (przez position:relative) żeby zawsze siedział pod treścią. */
    &::before {
        content: "";
        position: fixed;
        inset: 0;
        background-image: radial-gradient(circle, rgba(10, 22, 40, 0.18) 1px, transparent 1.5px);
        background-size: 12px 12px;
        opacity: 0.35;
        pointer-events: none;
        z-index: 0;

        /* Fade-out na górze i dole — nie kolizja z headerem i footerem. */
        mask-image: linear-gradient(to bottom,
            transparent 0%,
            #000 10%,
            #000 90%,
            transparent 100%);
        -webkit-mask-image: linear-gradient(to bottom,
            transparent 0%,
            #000 10%,
            #000 90%,
            transparent 100%);
    }
}

/* Treść (header, main, footer) MUSI być nad pseudo-elementem.
   .wp-site-blocks to root WP FSE wrapper — wszystko siedzi w środku. */
body>.wp-site-blocks,
body>.skip-link {
    position: relative;
    z-index: 1;
}

/* Wyłącz pattern na home i front-page — mają własne ciemne sekcje. */
body.home::before,
body.page-template-front-page::before {
    display: none;
}