/* ============================================
   1. OPTYMALIZACJA CZCIONEK - PRELOAD FALLBACK
   ============================================ */

/* Szybkie wyświetlanie - czcionki systemowe jako fallback */
body {
    font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
    font-display: swap;
}

/* Zapobiega FOUT (Flash of Unstyled Text) */
.hero-desc,
.hero-left h1 {
    font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
    font-display: swap;
}

/* Nagłówki szeryfowe (H1-H3) */
h1, h2, h3 {
    font-family: "Source Serif 4", Georgia, "Times New Roman", serif;
    font-display: swap;
}

/* Nagłówki bezszeryfowe (H4-H6) */
h4, h5, h6 {
    font-family: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-display: swap;
}

/* Kod */
code, pre, kbd, samp {
    font-family: "Courier Prime", "Courier New", monospace;
}

/* ============================================
   2. ZMIENNE CSS
   ============================================ */

:root {
    --rerxer-noc: var(--wp--preset--color--pp-noc);
    --rerxer-noc-glab: var(--wp--preset--color--pp-noc-glab);
    --rerxer-kosc: var(--wp--preset--color--pp-kosc);
    --rerxer-atrament: var(--wp--preset--color--pp-atrament);
    --rerxer-zloto: var(--wp--preset--color--pp-zloto);
    --rerxer-kzloto:var(--wp--preset--color--pp-kzloto);
    --rerxer-fiolet: var(--wp--preset--color--pp-fiolet);
    --rerxer-szary: var(--wp--preset--color--pp-szary-cieply);
    --rerxer-tresc: #FAF5EA;
    --rerxer-zielen: var(--wp--preset--color--pp-zielen);
    --rerxer-zielen-ciemna: var(--wp--preset--color--pp-zielen-ciemna);
    
    /* Fonty */
    --rx-font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
    --rx-font-sans: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --rx-font-mono: "Courier Prime", "Courier New", monospace;
}

/* ============================================
   3. PANEL RERXER
   ============================================ */

.rerxer-panel {
    background-color: var(--rerxer-tresc);
    border-top: 3px solid var(--rerxer-zloto);
    border-radius: 0 0 10px 10px;
    padding: var(--wp--preset--spacing--40);
    height: 100%;
}

.rerxer-panel h2 {
    font-size: var(--wp--preset--font-size--large);
    margin-block: 0.6rem 0.3rem;
    font-family: var(--rx-font-serif);
}

.rerxer-panel h2 a {
    text-decoration: none;
    color: var(--rerxer-atrament);
}

.rerxer-panel h2 a:hover {
    color: var(--rerxer-fiolet);
}

.rerxer-panel p {
    color: var(--rerxer-szary);
    font-size: var(--wp--preset--font-size--small);
    line-height: 1.45;
}

.rerxer-panel svg {
    display: block;
}

/* ============================================
   4. SZABLON WPISÓW
   ============================================ */

body:not(.home) .wp-block-post-template > li {
    background: none;
    padding: 0;
    list-style: none;
}

.wp-block-post-template {
    list-style: none;
    padding-left: 0;
}

.wp-block-post-template > li {
    background-color: var(--rerxer-tresc);
    border-left: 4px solid var(--rerxer-zloto);
    border-radius: 0 8px 8px 0;
    padding: var(--wp--preset--spacing--40);
    margin-block-end: var(--wp--preset--spacing--40);
    transition: border-left-color 0.15s ease;
}

.wp-block-post-template > li:hover {
    border-left-color: var(--rerxer-fiolet);
}

.wp-block-post-template > li .wp-block-post-title {
    font-size: var(--wp--preset--font-size--x-large);
    line-height: 1.15;
    margin: 0 0 0.5rem;
    font-family: var(--rx-font-serif);
}

.wp-block-post-template > li .wp-block-post-title a {
    color: var(--rerxer-atrament);
    text-decoration: none;
}

.wp-block-post-template > li .wp-block-post-title a:hover {
    color: var(--rerxer-fiolet);
}

.wp-block-post-template > li .wp-block-post-author,
.wp-block-post-template > li .wp-block-post-date {
    display: inline-block;
    margin: 0 0.75rem 0.5rem 0;
    font-size: var(--wp--preset--font-size--meta);
    letter-spacing: 0.04em;
    color: var(--rerxer-szary);
    font-family: var(--rx-font-sans);
}

.wp-block-post-template > li .wp-block-post-excerpt {
    color: var(--rerxer-atrament);
    margin-top: 0.4rem;
    font-family: var(--rx-font-serif);
    font-size: var(--wp--preset--font-size--medium);
    line-height: 1.7;
}

.wp-block-post-template > li .wp-block-post-excerpt__more-link {
    font-size: var(--wp--preset--font-size--meta);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--rerxer-atrament);
    text-decoration: underline;
    text-decoration-color: var(--rerxer-zloto);
    font-family: var(--rx-font-sans);
    font-weight: 600;
}

.wp-block-post-template > li .wp-block-post-excerpt__more-link:hover {
    color: var(--rerxer-fiolet);
    text-decoration-color: var(--rerxer-fiolet);
}

/* ============================================
   5. PAGINACJA
   ============================================ */

.wp-block-query-pagination {
    font-size: var(--wp--preset--font-size--small);
    margin-block-start: var(--wp--preset--spacing--50);
    font-family: var(--rx-font-sans);
}

.wp-block-query-pagination a {
    color: var(--rerxer-atrament);
    text-decoration: underline;
    text-decoration-color: var(--rerxer-zloto);
}

.wp-block-query-pagination a:hover {
    color: var(--rerxer-fiolet);
}

/* ============================================
   6. PRZYCISKI CTA
   ============================================ */

.rerxer-cta .wp-element-button,
.rerxer-cta.wp-element-button,
.wp-block-button.rerxer-cta .wp-block-button__link {
    background-color: var(--rerxer-zielen);
    color: var(--rerxer-kosc);
    border: 0;
    font-family: var(--rx-font-sans);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
   /* border-radius: 2px;*/
}

.rerxer-cta .wp-element-button:hover,
.rerxer-cta.wp-element-button:hover,
.wp-block-button.rerxer-cta .wp-block-button__link:hover {
    background-color: var(--rerxer-zielen-ciemna);
    color: var(--rerxer-kosc);
}

/* ============================================
   7. LINKI W TREŚCI
   ============================================ */

.entry-content a,
.wp-block-post-content a,
main a:not(.wp-element-button) {
    color: var(--rerxer-atrament);
    text-decoration: underline;
    text-decoration-color: var(--rerxer-zloto);
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.entry-content a:hover,
.wp-block-post-content a:hover,
main a:not(.wp-element-button):hover {
    color: var(--rerxer-fiolet);
    text-decoration-color: var(--rerxer-fiolet);
}

/* ============================================
   8. METADANE
   ============================================ */

.wp-block-post-date,
.wp-block-post-author,
.wp-block-post-terms,
.rerxer-meta {
    font-family: var(--rx-font-sans);
    font-size: var(--wp--preset--font-size--meta);
    letter-spacing: 0.04em;
    color: var(--rerxer-szary);
    font-weight: 500;
}

/* ============================================
   9. NAWIGACJA
   ============================================ */

.wp-block-navigation,
.wp-block-navigation .wp-block-navigation-item__content {
    font-family: var(--rx-font-sans);
    font-size: var(--wp--preset--font-size--small);
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0.08em;
}

.wp-block-navigation .wp-block-navigation-item__content {
    text-decoration: none;
}

.wp-block-navigation .wp-block-navigation-item__content:hover {
    color: var(--rerxer-zloto);
}

/* ============================================
   10. TREŚĆ WPISU
   ============================================ */

body:not(.home) .wp-block-post-content {
    background-color: var(--rerxer-tresc);
    padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
    margin-block-end: 0;
    text-align: justify;
    text-justify: inter-word;
    font-weight: 400;
    font-family: var(--rx-font-serif);
}

/* ============================================
   11. NAGŁÓWEK STRONY (HEADER)
   ============================================ */

.site-header {
    width: 100%;
    box-sizing: border-box;
    padding: 24px 32px;
    background-color: var(--rerxer-noc);
    color: var(--rerxer-kosc);
    border-bottom: 3px solid var(--rerxer-zloto);
    font-size: var(--wp--preset--font-size--small);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-family: var(--rx-font-sans);
}

.site-header__inner {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
    align-items: center;
    column-gap: 24px;
}

.site-header .wp-block-site-logo {
    line-height: 0;
    min-width: 0;
}

.site-header .wp-block-site-logo img {
    display: block;
    max-width: 90px;
    height: auto;
}

.site-header .wp-block-site-title {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    text-align: center;
    font-size: clamp(1.5rem, 2vw, 2.25rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    font-family: var(--rx-font-serif);
}

.site-header .wp-block-site-title a {
    color: var(--rerxer-zloto);
    text-decoration: none;
    white-space: nowrap;
}

.site-header .wp-block-site-title a:hover,
.site-header .wp-block-site-title a:focus {
    color: var(--rerxer-kosc);
}

.site-header .wp-block-navigation {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-width: 0;
}

.site-header .wp-block-navigation__container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
    margin: 0;
    padding: 0;
    list-style: none;
    flex-wrap: nowrap;
}

.site-header .wp-block-navigation-item__content {
    display: inline-flex;
    align-items: center;
    color: var(--rerxer-kosc);
    text-decoration: none;
    white-space: nowrap;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.95rem;
    font-family: var(--rx-font-sans);
}

.site-header .wp-block-navigation-item__content:hover,
.site-header .wp-block-navigation-item__content:focus {
    color: var(--rerxer-zloto);
}

/* ============================================
   12. SEKCJA HERO
   ============================================ */

.rerxer-hero {
    background-color: var(--rerxer-noc);
    background-image: radial-gradient(
        120% 90% at 50% 42%,
        var(--rerxer-noc) 0%,
        var(--rerxer-noc) 45%,
        var(--rerxer-noc-glab) 100%
    );
    color: var(--rerxer-kosc);
    padding-block: var(--wp--preset--spacing--60);
    margin-block-start: 0;
    text-align: center;
    contain: layout style;
}

.rerxer-hero :where(h1, h2, h3, p) {
    color: var(--rerxer-kosc);
}

.rerxer-hero .rerxer-tagline {
    color: var(--rerxer-zloto);
    font-family: var(--rx-font-sans);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: var(--wp--preset--font-size--meta);
    font-weight: 600;
}

.rerxer-hero figure.wp-block-image,
.rerxer-hero .wp-block-image {
    margin-inline: auto !important;
    float: none !important;
    max-width: none;
    text-align: center;
}

.rerxer-hero .wp-block-image img {
    display: block;
    margin-inline: auto;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    -webkit-mask-image: radial-gradient(118% 118% at 50% 50%, #000 78%, transparent 100%);
    mask-image: radial-gradient(118% 118% at 50% 50%, #000 78%, transparent 100%);
    will-change: transform;
}

.rerxer-hero svg,
.rerxer-hero .wrap svg,
.rerxer-hero .wp-block-image img {
    transform-origin: 50% 50%;
    animation: rerxer-mandala-obrot 90s linear infinite;
    will-change: transform;
}

@keyframes rerxer-mandala-obrot {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.rerxer-hero a:not(.wp-element-button) {
    color: var(--rerxer-zloto);
    text-decoration-color: var(--rerxer-zloto);
}

/* ============================================
   13. STOPKA
   ============================================ */

.rerxer-stopka,
.wp-site-blocks footer.wp-block-template-part {
    background-color: var(--rerxer-noc);
    color: var(--rerxer-kosc);
    padding-block: var(--wp--preset--spacing--20);
    border-top: 3px solid var(--rerxer-zloto);
}

.rerxer-stopka :where(h1, h2, h3, h4, p, li),
.wp-site-blocks footer.wp-block-template-part :where(h1, h2, h3, h4, p, li) {
    color: var(--rerxer-kosc);
    font-family: var(--rx-font-sans);
}

.rerxer-stopka a,
.wp-site-blocks footer.wp-block-template-part a {
    color: var(--rerxer-kosc);
    text-decoration: none;
    opacity: 0.85;
    transition: opacity 0.15s ease, color 0.15s ease;
}

.rerxer-stopka a:hover,
.wp-site-blocks footer.wp-block-template-part a:hover {
    color: var(--rerxer-zloto);
    opacity: 1;
}

.rerxer-stopka .wp-block-social-links .wp-social-link {
    color: var(--rerxer-zloto);
    background: transparent;
}

/* ============================================
   14. SEKCJA NA CIEMNYM TLE
   ============================================ */

.rerxer-sekcja-noc {
    background-color: var(--rerxer-noc);
    color: var(--rerxer-kosc);
    padding-block: var(--wp--preset--spacing--60);
    contain: layout style;
}

.rerxer-sekcja-noc :where(h1, h2, h3, p) {
    color: var(--rerxer-kosc);
}

.rerxer-sekcja-noc a:not(.wp-element-button) {
    color: var(--rerxer-zloto);
}

/* ============================================
   15. PANEL BOCZNY
   ============================================ */

.rerxer-sidebar,
body:not(.home) .wp-block-columns.alignwide > .wp-block-column:last-child {
    border-left: 0px solid var(--rerxer-zloto);  
    padding-left: var(--wp--preset--spacing--40);
	 background-color: var(--rerxer-kosc);
}

.rerxer-sidebar :where(h1, h2, h3),
body:not(.home) .wp-block-columns.alignwide > .wp-block-column:last-child :where(h1, h2, h3) {
    font-size: var(--wp--preset--font-size--large);
    line-height: 1.2;
    letter-spacing: -0.005em;
    margin-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
    font-family: var(--rx-font-serif);
}

/* ============================================
   16. LID (LEAD)
   ============================================ */

.rerxer-lid {
    font-family: var(--rx-font-serif);
    font-size: var(--wp--preset--font-size--medium);
    font-weight: 400;
    line-height: 1.7;
    color: var(--rerxer-szary);
    margin-block-end: var(--wp--preset--spacing--40);
}

/* ============================================
   17. DIAGNOSTYKA / KOD
   ============================================ */

.rerxer-diagnostyka {
    font-family: var(--rx-font-mono);
    font-size: var(--wp--preset--font-size--small);
    letter-spacing: -0.01em;
    color: var(--rerxer-szary);
}

/* ============================================
   18. DOSTĘPNOŚĆ - FOCUS
   ============================================ */

a:focus-visible,
button:focus-visible,
.wp-element-button:focus-visible {
    outline: 2px solid var(--rerxer-zloto);
    outline-offset: 2px;
}

/* ============================================
   19. REDUKCJA ANIMACJI
   ============================================ */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ============================================
   POPRAWKA DLA CIEMNEGO MOTYWU ANDROID
   ============================================ */

/* ✅ WYŁĄCZENIE INWERSJI KOLORÓW W PRZEGLĄDARCE */
* {
    forced-color-adjust: none !important;
    -webkit-forced-color-adjust: none !important;
}

/* ✅ WYMUSZENIE JASNEJ SCHEMY KOLORÓW */
html,
body,
.front-page,
.wp-block-group {
    color-scheme: light !important;
}

/* ✅ TŁA - ZAWSZE JASNE */
.quote-band,
.path-card,
.sources,
.hero-left {
    background: #EFE6D2 !important;
    background-color: #EFE6D2 !important;
}

.hero-right {
    background: #0D1B2A !important;
    background-color: #0D1B2A !important;
}

/* ✅ TEKST - ZAWSZE CIEMNY (oprócz mandali) */
.quote-band *,
.paths *:not(.mandala-stat):not(.mandala-quote),
.sources *,
.book-section *,
.signup *,
/*.hero-left * {
    color: #1A1714 !important;*/
}

/* ✅ MANDALA - ZŁOTE (zawsze widoczne) */
.mandala-stat .num,
.mandala-stat .lbl,
.mandala-quote p {
    color: #F0D080 !important;
    forced-color-adjust: none !important;
    -webkit-forced-color-adjust: none !important;
}

.mandala-quote .q-mark {
    color: #E8A878 !important;
}

/* ✅ SZARE ELEMENTY */
.hero-desc,
.path-desc,
.sources-text p,
.book-meta p,
.quote-source,
.signup-note {
    color: #5C564E !important;
}

/* ✅ ZIELONE ELEMENTY */
.sec-label,
.path-tradition {
    color: #1B6E50 !important;
}
/* ============================================
   21. OSZCZĘDZANIE DANYCH
   ============================================ */

@media (prefers-reduced-data: reduce) {
    .rerxer-hero {
        background: var(--rerxer-noc) !important;
    }
}

/* ============================================
   22. RESPONSYWNOŚĆ
   ============================================ */

@media (max-width: 900px) {
    .site-header {
        padding: 20px 16px;
    }

    .site-header__inner {
        flex-direction: column;
        row-gap: 14px;
        justify-items: center;
    }

    .site-header .wp-block-navigation__container {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px 16px;
    }
}

@media (max-width: 480px) {
    .rerxer-hero {
        padding-block: var(--wp--preset--spacing--40);
    }

    .rerxer-stopka,
    .wp-site-blocks footer.wp-block-template-part {
        padding-block: var(--wp--preset--spacing--40);
    }

    .wp-block-post-template > li {
        padding: var(--wp--preset--spacing--30);
    }

    body:not(.home) .wp-block-post-content {
        padding: var(--wp--preset--spacing--30);
    }
}

/* ============================================
   23. WYDRUK
   ============================================ */

@media print {
    .site-header,
    .rerxer-hero,
    .rerxer-stopka,
    .wp-site-blocks footer.wp-block-template-part,
    .rerxer-sekcja-noc,
    .rerxer-sidebar {
        background: none !important;
        color: #000 !important;
    }

    body {
        font-family: Georgia, "Times New Roman", serif;
        font-size: 12pt;
        line-height: 1.5;
    }

    a {
        color: #000;
        text-decoration: underline;
    }
}
/* =========================================================
   POPRAWA ODSTĘPÓW – BREADCRUMBS + TYTUŁ STRONY
   ========================================================= */

/* 1. Usuń górny margines / padding w nagłówku strony 
.entry-header {
    padding-top: 0.5rem !important;   /* minimalny odstęp od góry
    margin-top: 0 !important;
}*/
/* 2. Zmniejsz odstęp pod breadcrumbs */
.entry-header .rank-math-breadcrumb,
.entry-header .breadcrumbs,
.entry-header .yoast-breadcrumbs {
    margin-bottom: 0.1rem !important;
}

/* 3. Zmniejsz odstęp nad tytułem */
.entry-header .wp-block-post-title,
.entry-header .entry-title,
.entry-header h1 {
    margin-top: 0.1rem !important;
    margin-bottom: 0.1rem !important;
}*/

/* 4. (Opcjonalnie) dla całej strony – usuń zbędny padding
.wp-site-blocks {
    padding-top: 0 !important;
}*/

/* 5. Dla szablonów stron i wpisów – dodatkowe zabezpieczenie
.page .entry-header,
.single .entry-header {
    padding-top: 0.5rem !important;
}*/