/*
Theme Name: Zeszyty Dębickie 2
Theme URI: ---
Author: TM / Grafista.pl
Version: 2025
Requires at least: 5.2
Tested up to: 6.8
Requires PHP: 7.4
License: (c) TM / Grafista.pl

zeszyty2 WordPress Theme 2011-2025
zeszyty2 is distributed under the terms of the GNU GPL
*/

/* 
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{scroll-behavior:smooth}body{line-height:1}a{text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}input[type="search"]{-webkit-appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;-webkit-clip-path:none;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}
*/

/* */
/* Stary CSS starej strony Zeszytów */
/* */


/* MOJE */

/*

#ffff33; złoty
#ffff9a; złoty 50%;
#ffffbf; złoty 25%
#ffffe5; złoty 10%

#e2e6e5; mysi
#cb5e2e; herbaciany

#e94c3d; pomidorowy
#e9cac7; pomidorowy 20%

#2d2926; pseudoczarny

*/

/* ŁAMANIE WYRAZÓW */

body
{
font-kerning: normal;
font-variant: common-ligatures tabular-nums proportional-nums;
font-feature-settings: "kern", "liga", "clig", "onum", "pnum";

/* hyphens: auto; */
/* word-break: break-word; */
/* overflow-wrap: anywhere; */

-webkit-hyphens: auto;
-webkit-hyphenate-limit-before: 3;
-webkit-hyphenate-limit-after: 3;
-webkit-hyphenate-limit-chars: 6 3 3;
-webkit-hyphenate-limit-lines: 2;
-webkit-hyphenate-limit-last: always;
-webkit-hyphenate-limit-zone: 8%;
-moz-hyphens: auto;
-moz-hyphenate-limit-chars: 6 3 3;
-moz-hyphenate-limit-lines: 2;
-moz-hyphenate-limit-last: always;
-moz-hyphenate-limit-zone: 8%;
-ms-hyphens: auto;
-ms-hyphenate-limit-chars: 6 3 3;
-ms-hyphenate-limit-lines: 2;
-ms-hyphenate-limit-last: always;
-ms-hyphenate-limit-zone: 8%;
hyphenate-limit-chars: 6 3 3;
hyphenate-limit-lines: 2;
hyphenate-limit-last: always;
hyphenate-limit-zone: 8%;
}

*, body
{
font-family: 'Cabin', sans-serif;
font-variant-numeric: lining-nums;
font-variant-ligatures: none;

--font-size-sm: 0.85rem;   /* 12px ?? */
--font-size-root: 1rem;    /* 16px, root */
--font-size-base: 1.1rem;    /* 16px, ?? base */
--font-size-md: 1.25rem;   /* 20px */
--font-size-lg: 1.5rem;    /* 24px */
--font-size-xl: 1.75rem;   /* 28px */
--font-size-xxl: 2rem;     /* 32px */
--font-size-xxxl: 2.25rem; /* 36px */
font-size: var(--font-size-base);

--line-height-sm: 1;
--line-height-base: 1.5;
--line-height-md: 1.75;
--line-height-lg: 2;
--line-height-xl: 2.5;
--line-height-xxl: 3;
line-height: var(--line-height-base);

letter-spacing: 0px;

--color_accent1: #e94c3d; /* #5d9bcc; */
--color_accent2: #e9cac7; /* #e3e4e6; */
--color_accent3: #ffd933;
--color_accent4: #ffec99;
--color_accent5: #dadbdc;
--color_accent6: #70201f;
--color_accent7: #870121;
--color_accent7: #e94c3d;
--color_accent8: #c9e0e9;
--color_accent9: #c9e9c8;

--color_black: #000000;

}

/* FOCUS 2025 - JEDNOLITY DLA WSZYSTKICH ELEMENTÓW */
:focus {
    outline: none;
    box-shadow: 
        0 0 0 2px var(--color_white),
        0 0 0 4px var(--color_accent3),
        0 4px 12px rgba(255, 217, 51, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transform: translateY(-1px);
}


/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    :focus {
        transition: none;
    }
}


a
{
color: var(--color_accent6);
text-decoration-color: var(--color_black);
text-decoration: underline;
}

a:hover
{
color: var(--color_accent7);
text-decoration: underline;
text-decoration-thickness: 0.1em;
text-decoration-color: var(--color_black);
text-underline-offset: 0.2rem;
}

small
{
font-size: var(--font-size-sm);
}

sup 
{
vertical-align: sup;
font-size: var(--font-size-sm);
}

sub 
{
vertical-align: sub;
font-size: var(--font-size-sm);
}

i
{
font-style: italic;
}

b
{
font-weight: 600;
}

p
{
margin-bottom: 1em;
/*text-indent: 1.5em;*/
}

/*
p:first-child 
{
text-indent: 0;
}

.akapitZwykly p
{
text-indent: 0;
}
*/

blockquote
{
font-family: 'Bona Nova', serif;
margin: 8px;
padding: 16px;
border-left: 0.75em solid var(--color_accent9);
margin-bottom: 1em;
}

blockquote:before {
}

blockquote:after {
}

pre
{
font-family: Consolas,Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace,serif;
white-space: pre-wrap;
width: auto;
margin-top: 1em;
margin-bottom: 1em;
}

hr
{
margin-top: 16px;
margin-bottom: 16px;
color: #e94c3d;
border: 1px solid;
width: 66%;
}

fieldset
{
}

legend
{
}

table
{
margin: 8px;
border: 1px solid #e94c3d;
margin-bottom: 1em;
}

th
{
font-family: 'Bona Nova', serif;
font-weight: 600;
border: 1px dashed #e94c3d;
}

thead > tr
{
border: 1px dashed #e94c3d;
padding: 16px;
}

table td
{
border: 1px dotted #e94c3d;
padding: 8px;
}

h6
{
font-family: 'Cabin', sans-serif;
font-weight: 600;
font-size: var(--font-size-base);
margin-bottom: 1rem;
}

h5
{
font-family: 'Cabin', sans-serif;
font-weight: 600;
font-size: var(--font-size-md);
margin-bottom: 1rem;
}

h4
{
font-family: 'Cabin', sans-serif;
font-weight: 600;
font-size: var(--font-size-lg);
margin-bottom: 1rem;
}

h3
{
font-family: 'Cabin', sans-serif;
font-weight: 600;
font-size: var(--font-size-xl);
margin-bottom: 1rem;
}

h2
{
font-family: 'Cabin', sans-serif;
font-weight: 600;
font-size: var(--font-size-xxl);
margin-bottom: 1rem;
}

h1
{
font-family: 'Cabin', sans-serif;
font-weight: 600;
font-size: var(--font-size-xxxl);
margin-bottom: 1rem;
}

.entry-content li
{
font-family: 'Bona Nova', serif;
}

.entry-content ol 
{
  counter-reset: numbers;
  padding-left: 32px;
}
.entry-content ol li 
{
  counter-increment: numbers;
}
.entry-content ol li:before 
{
  content: counters(numbers, '.') ' ';
  /* Whatever custom styles you want here */
  color: #e94c3d;
  font-weight: bold;
	white-space: nowrap;
}

.entry-content ol 
{
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

.entry-content ol > li 
{
  display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

.entry-content ol > li:before 
{
  content: counters(item, ".") " ";
	/* content: counters(item, ".") ". "; */
  display: table-cell;
  padding-right: 0.6em;    
}

.entry-content li ol > li 
{
  margin: 0;
}

.entry-content li ol > li:before 
{
  content: counters(item, ".") " ";
}

.entry-content ul 
{
  margin: 0;
  padding: 0;
}

.entry-content ul:nth-of-type(1) 
{
  list-style-type: disc;
}

.entry-content ul:nth-of-type(2) {
  list-style-type: circle;
}

.entry-content ul:nth-of-type(3) {
  list-style-type: square;
}


.entry-content ul > ul {
  margin: 0;
  padding: 0;
}

.entry-content ul > li {
  display: table;
  margin-bottom: 0.6em;
}

.entry-content ul > li:before {
  content: "•";
  display: table-cell;
  padding-right: 0.6em;    
}

.entry-content li ul > li {
  margin: 0;
}

.entry-content li ul > li:before {
  content: "◦";
}

.entry-content li li ul > li:before {
  content: "▪";
}

.clearBoth
{
clear: both;
}

body::-webkit-scrollbar {
  width: calc(18px + .2em);               /* width of the entire scrollbar */
}

body::-webkit-scrollbar-track {
  background: darkgrey;        /* color of the tracking area */
  border: 1px solid #000000;  /* creates padding around scroll thumb */
}

body::-webkit-scrollbar-thumb {
  background-color: #ffffff;    /* color of the scroll thumb */
  border-radius: 12px;       /* roundness of the scroll thumb */
  border: 1px solid #000000;  /* creates padding around scroll thumb */
}
*,
*::before,
*::after {
/*
  box-sizing: border-box;
*/
}

strong
{
font-weight: 700;
}

em
{
font-style: italic;
}

/* FIELDSET, głównie widok strony REDAKCJA */

fieldset {
  border: none;
  position: relative;
  margin-top: 1em;
  margin-bottom: 1em;
  padding-left: 1em;
  margin-bottom: 1em;
}

fieldset::before {
  content: "";
  position: absolute;
  left: -8px; /* szerokość obramowania */
  top: -30px; /* przesunięcie w górę */
  height: calc(100% + 16px); /* wysokość z uwzględnieniem przesunięcia */
  width: 0.75em; /* szerokość obramowania */
  background-color: var(--color_accent5);
}

legend
{
font-family: 'Bona Nova', serif;
font-weight: 600;
padding: 8px;
}


/* */
/* */
/* CIASTECZKA INFO */
/* */
/* */

.cookies-infobar 
{
font-size: var(--font-size-root);
border: 1px solid black;
box-shadow: inset 0px 1px 0px 0px #ffffff;
background: rgba(0, 0, 0, 0.9);
color: #fff;
position: fixed;
width: 100%;
left: 0;
right: 0;
bottom: 0;
padding: 0.25em;
text-align: center;
}

.cookies-infobar.cookies-infobar_accepted 
{
display: none;
}

.cookies-infobar_wrapper 
{
padding: 0.15em;
}

.cookies-infobar a 
{
color: inherit;
}

.cookies-text
{
margin: 0.75em;
}

.cookies-infobar_btn 
{
padding: 0.5em;
display: inline-block;
background: #e94c3d;
text-decoration: none;
border-radius: 0.25em;
color: #fff;
text-transform: uppercase;
font-size: var(--font-size-root);
}

.cookies-infobar_btn:hover
{
background-color: #ffffff;
color: #8B008B;
}


/* LIGHT BOX IMG OVERLAY */

@media (max-width: 1000px) {
  #lightbox-image {
    max-width: 80%;
    max-height: 80%;
  }
}

#lightbox-overlay {
  z-index: 100;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
}

#lightbox-image {
  max-width: 90%;
  max-height: 90%;
  cursor: pointer;
}

#lightbox-close {
  position: absolute;
  top: 10px;
  right: 10px;
  background: transparent;
  color: #fff;
  border: none;
  font-size: 4rem;
  cursor: pointer;
}


/* Mój CSS / 2025 (c) TM */

/* Reset i podstawowe style */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Cabin', sans-serif;
    background-color: #f5f5f5;
    color: #2d2926;
    line-height: 1.6;
}

/* Kolory z poprzedniego motywu */
:root {
    --color_accent1: #e94c3d;
    --color_accent2: #e9cac7;
    --color_accent3: #ffd933;
    --color_accent4: #ffec99;
    --color_accent5: #dadbdc;
    --color_accent6: #70201f;
    --color_accent7: #870121;
    --color_black: #000000;
    --color_white: #ffffff;
}

/* Header */
#header {
    width: 100%;
    background: var(--color_white);
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    position: relative;
    z-index: 1000;
}

.header-container {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

/* Logo Row */
/* Logo Row - NORMALNY UKŁAD (podstrony) */
.logo-row {
    width: 100%;
    text-align: center;
    padding: 20px 0;
}

.logo-container {
    display: inline-block;
}

.logo-image {
    width: 100%;
    height: auto;
    max-width: 100%;
}

/* Logo Row Home - DWUKOLUMNOWY UKŁAD (strona główna) */
.logo-row-home {
    width: 100%;
    display: flex;
    align-items: stretch; /* Kolumny mają jednakową wysokość */
    padding: 20px 0;
    gap: 20px;
}

.logo-column {
    flex: 0 0 66%; /* 66% szerokości */
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-column .logo-container {
    display: block;
    width: 100%;
    text-align: center;
}

.logo-column .logo-image {
    width: 100%;
    height: auto;
    max-width: 100%;
}

.reklama-column {
    flex: 0 0 33%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    min-height: 200px;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1); /* Bardzo subtelna ramka w kolorze accent6 */
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    position: relative;
    overflow: hidden;
}

.reklama-column::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}


.reklama-top-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 8px;
}

.reklama-top-tekst {
    width: 100%;
}

.reklama-top-tekst h2,
.reklama-top-tekst h3,
.reklama-top-tekst h4 {
    color: var(--color_accent6);
    font-family: 'Bona Nova', serif;
    margin-bottom: 10px;
}

.reklama-top-tekst p {
    color: var(--color_black);
    font-size: 14px;
    line-height: 1.4;
    margin: 0;
}

.reklama-top-grafika {
    width: 100%;
    max-width: 200px;
}

.reklama-top-grafika img {
    width: 100%;
    height: auto;
	max-height: 125px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* Responsive - ukryj reklamę na małych ekranach */
@media (max-width: 1000px) {
    .logo-row-home {
        flex-direction: column;
    }
    
    .logo-column {
        flex: 1;
        width: 100%;
    }
    
    .reklama-column {
        display: none; /* UKRYJ CAŁKOWICIE */
    }
}

@media (max-width: 768px) {
    .logo-row-home {
        padding: 15px 0;
    }
}


/* Navigation Row */
.nav-row {
    width: 100%;
    display: flex;
    flex-wrap: wrap; /* Wszystko może się zawijać */
    align-items: flex-start;
    gap: 8px;
    padding: 20px 0;
    justify-content: center;
}

/* Search */
.search-container {
    flex: 0 0 auto;
    width: 160px; /* Stała szerokość */
    height: 64px; /* Stała wysokość jak ikony */
    display: flex;
    align-items: top;
    margin-top: 4px;
}

.search-form {
    width: 100%;
    height: 100%;
}

.search-input-container {
    display: flex;
    align-items: center;
    background: #f8f9fa; /* ZMIANA - szare tło zamiast żółtego */
    border: 2px solid var(--color_accent5); /* ZMIANA - szara ramka */
    border-radius: 20px; /* ZMIANA - bardziej zaokrąglone jak typowe search */
    padding: 6px 8px;
    transition: all 0.3s ease;
    height: 64px;
    width: 160px;
    box-sizing: border-box;
}

.search-input-container:focus-within {
    background: #ffffff; /* ZMIANA - białe tło przy focus */
    border-color: var(--color_accent1); /* Czerwona ramka przy focus */
    box-shadow: 0 0 0 2px rgba(233, 76, 61, 0.2); /* Subtelny cień */
}

.search-icon {
    color: var(--color_accent6);
    font-size: 24px;
    margin-right: 6px;
    flex-shrink: 0; /* Nie kurczy się */
}

.search-field {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: 16px;
    color: var(--color_black);
    min-width: 0; /* Pozwala się kurczyć */
    width: auto;
}

.search-field::placeholder {
    color: var(--color_accent6);
    opacity: 0.7;
}

.search-submit {
    background: var(--color_accent1);
    border: none;
    border-radius: 50%;
    width: 22px; /* Mniejszy */
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin-left: 6px;
    flex-shrink: 0; /* Nie kurczy się */
}

.search-submit:hover {
    background: var(--color_accent7);
}

.search-submit .material-icons-outlined {
    color: var(--color_white);
    font-size: 16px; /* Mniejszy */
}

/* Desktop Menu */
.menu-items {
    display: flex !important; /* ZMIANA z display: block */
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 24px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.menu-items li {
    flex: 0 0 auto; /* Jak search-container */
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
}

.menu-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: var(--color_accent6);
    padding: 8px;
    border-radius: 8px;
    transition: all 0.3s ease;
    width: 72px; /* Zmniejszone z 80px */
    text-align: center;
}

.menu-link:hover {

    color: var(--color_accent7);
    text-decoration: none;
}

.menu-icon-container {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color_accent4);
    border-radius: 8px;
    margin-bottom: 6px;
    transition: background-color 0.3s ease;
}

.menu-link:hover .menu-icon-container {
    background: var(--color_accent3);
}

.menu-icon {
    font-size: 24px;
    color: var(--color_accent6);
}

.menu-text {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    hyphens: auto;
    max-width: 72px;
    text-align: center;
    margin: 0;
    padding: 0;
}


/* Mobile Menu Toggle - LEPSZY DESIGN */
.mobile-menu-toggle {
    display: none;
    cursor: pointer;
    padding: 12px;
    border-radius: 8px;
    background: var(--color_accent1);
    transition: background-color 0.3s ease;
    flex: 0 0 auto;
    height: 48px;
    width: 48px;
    align-items: center;
    justify-content: center;
}

.mobile-menu-toggle:hover {
    background: var(--color_accent7);
}

.mobile-menu-toggle .menu-icon {
    color: var(--color_white);
    font-size: 24px;
}

/* Mobile Menu Overlay - NOWY DESIGN */
.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    z-index: 9999;
    display: none;
    overflow-y: auto;
}

.mobile-menu-overlay.active {
    display: block;
}

.mobile-menu-content {
    position: relative;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    padding: 20px;
    min-height: 100vh;
    background: linear-gradient(135deg, var(--color_accent6) 0%, var(--color_accent7) 100%);
}

.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px 0;
    border-bottom: 2px solid rgba(255, 255, 255, 0.2);
}

.mobile-menu-title {
    color: var(--color_white);
    font-size: 24px;
    font-weight: 600;
    font-family: 'Bona Nova', serif;
}

.close-btn {
    color: var(--color_white);
    font-size: 32px;
    cursor: pointer;
    padding: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    transition: background-color 0.3s ease;
}

.close-btn:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* Mobile Menu Items - NOWY ELEGANCKI DESIGN */
.mobile-menu-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mobile-menu-items li {
    margin: 0 0 8px 0;
}

.mobile-menu-items a {
    display: flex;
    align-items: center;
    color: var(--color_white);
    text-decoration: none;
    font-size: 18px;
    font-weight: 500;
    padding: 16px 20px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-menu-items a:hover {
    background: rgba(255, 255, 255, 0.2);
    color: var(--color_accent3);
    transform: translateX(5px);
    border-color: var(--color_accent3);
}

.mobile-menu-items a .material-icons-outlined {
    margin-right: 15px;
    font-size: 20px;
    color: var(--color_accent3);
}

/* Responsive - POPRAWIONE */
@media (max-width: 768px) {
.menu-items li
{
display: none;
}

    .nav-row {
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;
    }
    
    .search-container {
        flex: 1;
        margin-right: 15px;
        width: auto;
        height: 48px; /* Dopasowane do wysokości toggle */
    }
    
    .search-input-container {
        width: auto;
        height: 48px; /* Dopasowane */
        background: var(--color_white);
        border: 2px solid var(--color_accent5);
        border-radius: 25px;
        padding: 8px 15px;
    }
    
    .search-field {
        font-size: 14px;
    }
    
    .menu-items {
        display: none; /* Ukryj desktop menu */
    }
    
    .mobile-menu-toggle {
        display: flex; /* Pokaż mobile toggle */
    }
}

@media (max-width: 480px) {
    .mobile-menu-content {
        padding: 15px;
    }
    
    .mobile-menu-items a {
        font-size: 16px;
        padding: 14px 16px;
    }
    
    .mobile-menu-title {
        font-size: 20px;
    }
}


/* Container */
#container {
    max-width: 1280px;
    width: 100%;
    margin: 20px auto;
    background: var(--color_white);
    box-shadow: 0 0 20px rgba(0,0,0,0.1);
    border-radius: 8px;
    overflow: hidden;
}

#content {
    padding: 40px;
}

/* Responsive */
@media (max-width: 768px) {
    .nav-row {
        flex-wrap: nowrap;
        justify-content: space-between;
    }
    
    .search-container {
        flex: 1;
        margin-right: 15px;
    }
    
    .search-input-container {
        width: auto;
        height: auto;
        background: #f8f9fa;
        border-radius: 25px;
    }
    
    .menu-items {
        display: none; /* Ukryj desktop menu */
    }
    
    .mobile-menu-toggle {
        display: block;
    }
    #content {
        padding: 8px;
    }
}

@media (max-width: 480px) {
    .header-container {
        padding: 0 15px;
    }
    
    .search-input-container {
        padding: 6px 12px;
    }
    
    .search-field {
        font-size: 14px;
    }
    
    #content {
        padding: 4px;
    }
}


/* */
/* STRONA GŁÓWNA */
/* */

/* Sekcja Promowanych Postów */
.promowane-posty-sekcja {
    width: 100%;
    padding: 40px 0;
    background: #f8f9fa;
}

.promowane-posty-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    gap: 20px;
}

.glowny-promowany-post {
    flex: 0 0 50%;
}

.siatka-najnowszych-postow {
    flex: 0 0 50%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

/* Karty postów - PODSTAWOWE STYLE */
.promowany-post-link {
    text-decoration: none;
    color: inherit;
}

.promowany-post-card {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: all 0.3s ease;
}

/* STYLE DOMYŚLNE - tylko dla mini i dodatkowych postów */
.promowany-post-card.mini-post,
.promowany-post-card.dodatkowy-post {
    border: 1px solid rgba(112, 32, 31, 0.1);
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    border-radius: 12px;
    overflow: hidden;
}

.promowany-post-card.mini-post::before,
.promowany-post-card.dodatkowy-post::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
    z-index: 2;
}

.promowany-post-card.mini-post:hover,
.promowany-post-card.dodatkowy-post:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.15);
}

/* GŁÓWNY POST - STYL PAPIEROWY - KOMPLETNY */
.glowny-post-papierowy {
    position: relative;
    aspect-ratio: 57 / 40;
    min-height: 300px;
    
    /* PRAWDZIWY STYL PAPIEROWY - IDENTYCZNY JAK REKLAMA */
    background: var(--color_white) !important;
    border: 1px solid var(--color_accent5) !important;
    border-radius: 4px !important;
    box-shadow:
        0 1px 3px rgba(0,0,0,0.1),
        0 0 0 1px rgba(112, 32, 31, 0.03),
        inset 0 1px 0 rgba(255,255,255,0.8) !important;
    
    overflow: hidden;
    transition: all 0.3s ease;
}

/* Obrazek wewnętrzny */
.glowny-post-papierowy .post-image {
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 2px;
    z-index: 1;
}

/* Wewnętrzna przerywana ramka - KLUCZOWA! */
.glowny-post-papierowy::after {
    content: '';
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    border: 1px dashed rgba(112, 32, 31, 0.1) !important;
    border-radius: 2px;
    pointer-events: none;
    z-index: 3;
}

/* Hover dla papierowego posta */
.glowny-post-papierowy:hover {
    box-shadow: 
        0 4px 8px rgba(0,0,0,0.15),
        0 0 0 1px rgba(112, 32, 31, 0.08),
        inset 0 1px 0 rgba(255,255,255,0.9) !important;
    transform: translateY(-1px);
}

/* Overlay dla papierowego posta */
.glowny-post-papierowy .promowany-post-overlay {
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 50%,
        rgba(0,0,0,0.3) 70%,
        rgba(0,0,0,0.8) 100%
    );
    z-index: 2;
}

/* Tekst dla papierowego posta */
.glowny-post-papierowy .promowany-post-content {
    position: absolute;
    bottom: 8px;
    left: 8px;
    right: 8px;
    padding: 20px;
    color: white;
    z-index: 4;
}

/* Mini posty w siatce */
.mini-post {
    aspect-ratio: 57 / 40;
    min-height: 140px;
}

/* Dodatkowe posty w układzie 4x1 */
.dodatkowy-post {
    aspect-ratio: 57 / 40;
    min-height: 180px;
}

/* Overlay z gradientem dla normalnych postów */
.promowany-post-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 50%,
        rgba(0,0,0,0.3) 70%,
        rgba(0,0,0,0.8) 100%
    );
    z-index: 1;
}

/* Zawartość tekstowa dla normalnych postów */
.promowany-post-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    color: white;
    z-index: 2;
}

.mini-post .promowany-post-content {
    padding: 15px;
}

.promowany-post-title {
    font-family: 'Cabin', sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 1.2;
    margin: 0 0 10px 0;
    color: white;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

.mini-post .promowany-post-title {
    font-size: 16px;
    margin: 0;
}

.promowany-post-excerpt {
    font-size: 14px;
    line-height: 1.3;
    opacity: 0.9;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

/* Widget fallback */
.promowany-widget-fallback {
    height: 100%;
    min-height: 300px;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.promowany-widget-fallback::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

/* Sekcja Dodatkowych Postów 4x1 */
.dodatkowe-posty-sekcja {
    width: 100%;
    padding: 40px 0;
    background: white;
}

.dodatkowe-posty-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

.siatka-dodatkowych-postow {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

/* Sekcja pozostałej zawartości */
.pozostala-zawartosc-sekcja {
    width: 100%;
    background: white;
}

.pozostala-zawartosc-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Responsive */
@media (max-width: 1280px) {
    .promowane-posty-container {
        flex-direction: column;
    }
    
    .glowny-promowany-post,
    .siatka-najnowszych-postow {
        flex: 1;
        width: 100%;
    }
    
    .glowny-post-papierowy {
        min-height: 250px;
    }
}

@media (max-width: 1024px) {
    .siatka-dodatkowych-postow {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .siatka-najnowszych-postow {
        grid-template-columns: 1fr;
    }
    
    .promowane-posty-sekcja {
        padding: 20px 0;
    }
    
    .promowane-posty-container {
        padding: 0 15px;
        gap: 15px;
    }
    
    .glowny-post-papierowy {
        min-height: 200px;
    }
    
    .mini-post {
        min-height: 150px;
    }
    
    .siatka-dodatkowych-postow {
        grid-template-columns: 1fr;
    }
    
    .dodatkowe-posty-sekcja {
        padding: 20px 0;
    }
    
    .dodatkowy-post {
        min-height: 200px;
    }
}


/* TEST - STYL PAPIEROWY - NAJWYŻSZY PRIORYTET */
.test-papierowy {
    background: var(--color_white) !important;
    border: 3px solid var(--color_accent5) !important;
    border-radius: 4px !important;
    box-shadow:
        0 1px 3px rgba(0,0,0,0.1),
        0 0 0 1px rgba(112, 32, 31, 0.03),
        inset 0 1px 0 rgba(255,255,255,0.8) !important;
    position: relative !important;
}

.test-papierowy::after {
    content: '';
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    border: 0px dashed rgba(112, 32, 31, 0.5) !important;
    border-radius: 2px;
    pointer-events: none;
    z-index: 999 !important;
}

.test-papierowy:hover {
    box-shadow: 
        0 4px 8px rgba(0,0,0,0.15),
        0 0 0 1px rgba(112, 32, 31, 0.08),
        inset 0 1px 0 rgba(255,255,255,0.9) !important;
    transform: translateY(-1px);
}


/* WIDGET FALLBACK - STYL PAPIEROWY */
.promowany-widget-fallback.test-papierowy {
    height: 100%;
    min-height: 300px;
    background: var(--color_white) !important;
    border: 3px solid var(--color_accent5) !important;
    border-radius: 4px !important;
    box-shadow:
        0 1px 3px rgba(0,0,0,0.1),
        0 0 0 1px rgba(112, 32, 31, 0.03),
        inset 0 1px 0 rgba(255,255,255,0.8) !important;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.promowany-widget-fallback.test-papierowy::before {
    display: none !important; /* Usuń górną kolorową linię */
}

.promowany-widget-fallback.test-papierowy::after {
    content: '';
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    border: 0px dashed rgba(112, 32, 31, 0.5) !important;
    border-radius: 2px;
    pointer-events: none;
    z-index: 999 !important;
}


/* Etykietka dla plików do pobrania */
.download-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    background: var(--color_accent1);
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Cabin', sans-serif;
    z-index: 5;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

/* Specjalne style dla postów-plików */
.download-post {
    border-left: 3px solid var(--color_accent3) !important; /* Żółty akcent */
}

/* Dostosowanie obrazka dla okładek (contain zamiast cover) */
.download-post .post-image,
.download-post {
    background-size: contain !important;
    background-color: #f8f9fa !important;
}



/* KOMUNIKAT OD REDAKCJI - SEKCJA REDAKCYJNA */

.redakcyjny-komunikat-sekcja {
    width: 100%;
    padding: 50px 0;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 50%, #f0f2f5 100%);
    position: relative;
    overflow: hidden;
}

/* Dekoracyjne tło */
.redakcyjny-komunikat-sekcja::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 30% 70%, rgba(233, 76, 61, 0.03) 0%, transparent 50%),
                radial-gradient(circle at 70% 30%, rgba(255, 217, 51, 0.03) 0%, transparent 50%);
    z-index: 1;
    pointer-events: none;
}

.redakcyjny-komunikat-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 2;
}

.redakcyjny-komunikat-content {
    background: var(--color_white);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0,0,0,0.08);
    position: relative;
}

/* Styl papierowy dla komunikatu */
.redakcyjny-komunikat-content::after {
    content: '';
    position: absolute;
    top: 12px;
    left: 12px;
    right: 12px;
    bottom: 12px;

    border-radius: 8px;
    pointer-events: none;
    z-index: 1;
}

/* Górna kolorowa linia */
.redakcyjny-komunikat-content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3), var(--color_accent1));
    border-radius: 16px 16px 0 0;
    z-index: 2;
}

/* NAGŁÓWEK KOMUNIKATU */
.komunikat-header {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 30px 30px 20px 30px;
    position: relative;
    z-index: 2;
    border-bottom: 1px solid rgba(112, 32, 31, 0.1);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 249, 250, 0.9) 100%);
}

.komunikat-icon {
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--color_accent1), var(--color_accent7));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(233, 76, 61, 0.3);
}

.komunikat-icon .material-icons-outlined {
    color: white;
    font-size: 28px;
}

.komunikat-title-area {
    flex: 1;
}

.komunikat-title {
    font-family: 'Bona Nova', serif;
    font-size: 28px;
    font-weight: 700;
    color: var(--color_accent6);
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.komunikat-subtitle {
    font-size: 16px;
    color: #666;
    margin: 0;
    font-style: italic;
}

/* TREŚĆ KOMUNIKATU */
.komunikat-body {
    padding: 30px;
    position: relative;
    z-index: 2;
    font-family: 'Cabin', sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: var(--color_black);
}

.komunikat-body h2,
.komunikat-body h3,
.komunikat-body h4 {
    font-family: 'Bona Nova', serif;
    color: var(--color_accent6);
    margin: 25px 0 15px 0;
    line-height: 1.3;
}

.komunikat-body h2 {
    font-size: 24px;

    padding-left: 15px;
}

.komunikat-body h3 {
    font-size: 20px;

    padding-left: 12px;
}

.komunikat-body p {
    margin: 0 0 20px 0;
    text-align: justify;
}

.komunikat-body blockquote {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-left: 4px solid var(--color_accent1);
    border-radius: 0 8px 8px 0;
    padding: 20px 25px;
    margin: 25px 0;
    font-style: italic;
    position: relative;
}

.komunikat-body ul,
.komunikat-body ol {
    margin: 20px 0;
    padding-left: 30px;
}

.komunikat-body li {
    margin: 8px 0;
}

/* Obrazki w komunikacie */
.komunikat-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    border: 1px solid rgba(112, 32, 31, 0.1);
    padding: 8px;
    background: white;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

.komunikat-body img:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.komunikat-image-link {
    display: inline-block;
    margin: 10px 0;
}

/* Placeholder gdy brak treści */
.komunikat-placeholder {
    text-align: center;
    color: #999;
    font-style: italic;
    padding: 40px 20px;
}

/* STOPKA KOMUNIKATU */
.komunikat-footer {
    padding: 20px 30px 30px 30px;
    border-top: 1px solid rgba(112, 32, 31, 0.1);
    background: rgba(248, 249, 250, 0.5);
    position: relative;
    z-index: 2;
}

.komunikat-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #666;
    flex-wrap: wrap;
    gap: 15px;
}

.komunikat-date,
.komunikat-author {
    display: flex;
    align-items: center;
    gap: 6px;
}

.komunikat-date .material-icons-outlined,
.komunikat-author .material-icons-outlined {
    font-size: 16px;
    color: var(--color_accent1);
}

.komunikat-author {
    font-weight: 600;
    color: var(--color_accent6);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .redakcyjny-komunikat-sekcja {
        padding: 30px 0;
    }
    
    .redakcyjny-komunikat-container {
        padding: 0 15px;
    }
    
    .komunikat-header {
        flex-direction: column;
        text-align: center;
        gap: 15px;
        padding: 25px 20px 15px 20px;
    }
    
    .komunikat-icon {
        width: 50px;
        height: 50px;
    }
    
    .komunikat-icon .material-icons-outlined {
        font-size: 24px;
    }
    
    .komunikat-title {
        font-size: 24px;
    }
    
    .komunikat-subtitle {
        font-size: 14px;
    }
    
    .komunikat-body {
        padding: 20px;
        font-size: 15px;
    }
    
    .komunikat-footer {
        padding: 15px 20px 25px 20px;
    }
    
    .komunikat-meta {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 10px;
    }
}

@media (max-width: 480px) {
    .komunikat-header {
        padding: 20px 15px 15px 15px;
    }
    
    .komunikat-title {
        font-size: 20px;
    }
    
    .komunikat-body {
        padding: 15px;
    }
    
    .komunikat-footer {
        padding: 15px;
    }
}

/* ANIMACJA WEJŚCIA */
.redakcyjny-komunikat-content {
    animation: slideInFromBottom 0.6s ease-out;
}

@keyframes slideInFromBottom {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* PRINT STYLES */
@media print {
    .redakcyjny-komunikat-sekcja {
        background: white;
        padding: 20px 0;
    }
    
    .komunikat-icon {
        background: #ddd;
    }
    
    .komunikat-footer {
        border-top: 2px solid #000;
    }
}




/* BIBLIOTECZKA - NOWOCZESNY DESIGN */

.biblioteczka-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* Nagłówek */
.biblioteczka-header {
    text-align: center;
    margin-bottom: 40px;
}

.biblioteczka-title {
    font-family: 'Bona Nova', serif;
    font-size: 36px;
    color: var(--color_accent6);
    margin-bottom: 20px;
}

.biblioteczka-description {
    font-size: 16px;
    color: #666;
    max-width: 800px;
    margin: 0 auto;
}

/* Informacje o wynikach */
.biblioteczka-info {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.biblioteczka-info::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

/* Siatka plików */
.biblioteczka-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 30px;
    margin-bottom: 40px;
}

/* Element biblioteczki - STYL PAPIEROWY */
.biblioteczka-item {
    background: var(--color_white);
    border: 1px solid var(--color_accent5);
    border-radius: 4px;
    box-shadow: 
        0 1px 3px rgba(0,0,0,0.1),
        0 0 0 1px rgba(112, 32, 31, 0.03),
        inset 0 1px 0 rgba(255,255,255,0.8);
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

.biblioteczka-item::after {
    content: '';
    position: absolute;
    top: 8px;
    left: 8px;
    right: 8px;
    bottom: 8px;
    border: 1px dashed rgba(112, 32, 31, 0.1);
    border-radius: 2px;
    pointer-events: none;
    z-index: 1;
}

.biblioteczka-item:hover {
    box-shadow: 
        0 4px 8px rgba(0,0,0,0.15),
        0 0 0 1px rgba(112, 32, 31, 0.08),
        inset 0 1px 0 rgba(255,255,255,0.9);
    transform: translateY(-2px);
}

/* Obrazek */
.biblioteczka-item-image {
    position: relative;
    height: 200px;
    margin: 8px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #f8f9fa;
    border-radius: 2px;
    overflow: hidden;
}

.biblioteczka-item-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.biblioteczka-item:hover .biblioteczka-item-overlay {
    opacity: 1;
}

.biblioteczka-download-btn {
    background: var(--color_accent1);
    color: white;
    padding: 12px 20px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: background-color 0.3s ease;
}

.biblioteczka-download-btn:hover {
    background: var(--color_accent7);
    color: white;
    text-decoration: none;
}

/* Etykietka liczby pobrań */
.biblioteczka-download-count {
    position: absolute;
    top: 8px;
    left: 8px;
    background: var(--color_accent3);
    color: var(--color_accent6);
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    z-index: 2;
}

/* Treść */
.biblioteczka-item-content {
    padding: 20px;
    position: relative;
    z-index: 2;
}

.biblioteczka-item-title {
    font-family: 'Bona Nova', serif;
    font-size: 18px;
    margin-bottom: 15px;
    line-height: 1.3;
}

.biblioteczka-item-title a {
    color: var(--color_accent6);
    text-decoration: none;
    transition: color 0.3s ease;
}

.biblioteczka-item-title a:hover {
    color: var(--color_accent1);
}

.biblioteczka-item-meta {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
    font-size: 12px;
    color: #666;
}

.biblioteczka-meta-item {
    display: flex;
    align-items: center;
    gap: 4px;
	font-size: 14px;
}

.biblioteczka-meta-item .material-icons-outlined {
    font-size: 14px;
}

.biblioteczka-item-description {
    font-size: 14px;
    color: #555;
    line-height: 1.4;
}

/* Paginacja - NOWOCZESNA */
.biblioteczka-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.pagination-btn,
.pagination-number {
    padding: 10px 15px;
    background: white;
    border: 1px solid var(--color_accent5);
    border-radius: 8px;
    text-decoration: none;
    color: var(--color_accent6);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: all 0.3s ease;
}

.pagination-btn:hover,
.pagination-number:hover {
    background: var(--color_accent2);
    color: var(--color_accent7);
    text-decoration: none;
    transform: translateY(-1px);
}

.pagination-number.active {
    background: var(--color_accent1);
    color: white;
    border-color: var(--color_accent1);
}

.pagination-numbers {
    display: flex;
    gap: 5px;
}

/* Stan pusty */
.biblioteczka-empty {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

.biblioteczka-empty-icon {
    font-size: 64px;
    color: var(--color_accent5);
    margin-bottom: 20px;
}

.biblioteczka-empty-icon .material-icons-outlined {
    font-size: 64px;
}

/* Responsive */
@media (max-width: 768px) {
    .biblioteczka-container {
        padding: 20px 15px;
    }
    
    .biblioteczka-title {
        font-size: 28px;
    }
    
    .biblioteczka-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .biblioteczka-pagination {
        flex-direction: column;
        gap: 15px;
    }
    
    .pagination-numbers {
        order: 2;
    }
    
    .pagination-btn {
        order: 1;
    }
}

@media (max-width: 480px) {
    .biblioteczka-item-meta {
        flex-direction: column;
        gap: 8px;
    }
    
    .pagination-btn {
        padding: 8px 12px;
        font-size: 14px;
    }
}




/* SEKCJA LOSOWE PLIKI Z BIBLIOTECZKI - STRONA GŁÓWNA */

.losowe-pliki-sekcja {
    width: 100%;
    padding: 50px 0;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 50%, #f8f9fa 100%);
    border-top: 1px solid rgba(112, 32, 31, 0.1);
    border-bottom: 1px solid rgba(112, 32, 31, 0.1);
}

.losowe-pliki-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Nagłówek sekcji */
.losowe-pliki-header {
    text-align: center;
    margin-bottom: 40px;
}

.losowe-pliki-title {
    font-family: 'Bona Nova', serif;
    font-size: 32px;
    color: var(--color_accent6);
    margin-bottom: 10px;
    position: relative;
}

.losowe-pliki-title::after {

}

.losowe-pliki-subtitle {
    font-size: 16px;
    color: #666;
    margin-top: 20px;
}

/* Siatka plików */
.losowe-pliki-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-bottom: 40px;
}

/* Element pliku - STYL GÓRNEJ RAMKI */
.losowy-plik-item {
    background: var(--color_white);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
}

.losowy-plik-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
    z-index: 2;
}

.losowy-plik-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.15);
}

.losowy-plik-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.losowy-plik-link:hover {
    text-decoration: none;
    color: inherit;
}

/* Obrazek */
.losowy-plik-image {
    position: relative;
    height: 180px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #f8f9fa;
    overflow: hidden;
}

.losowy-plik-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.losowy-plik-item:hover .losowy-plik-overlay {
    opacity: 1;
}

.losowy-plik-download-icon {
    color: white;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    padding: 15px;
    transform: scale(0.8);
    transition: transform 0.3s ease;
}

.losowy-plik-item:hover .losowy-plik-download-icon {
    transform: scale(1);
}

.losowy-plik-download-icon .material-icons-outlined {
    font-size: 32px;
}

/* Etykietka pobrań */
.losowy-plik-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: var(--color_accent3);
    color: var(--color_accent6);
    padding: 6px 10px;
    border-radius: 20px;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.losowy-plik-badge .material-icons-outlined {
    font-size: 20px;
}

/* Treść */
.losowy-plik-content {
    padding: 20px;
}

.losowy-plik-title {
    font-family: 'Bona Nova', serif;
    font-size: 18px;
    color: var(--color_accent6);
    margin-bottom: 12px;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.losowy-plik-meta {
    display: flex;
    gap: 15px;
    margin-bottom: 12px;
    font-size: 12px;
    color: #666;
    flex-wrap: wrap;
}

.losowy-plik-date,
.losowy-plik-size {
    display: flex;
    align-items: center;
    gap: 4px;
	font-size: 14px;
}

.losowy-plik-meta .material-icons-outlined {
    font-size: 14px;
}

.losowy-plik-excerpt {
    font-size: 14px;
    color: #555;
    line-height: 1.4;
    margin: 0;
}

/* Przycisk "Zobacz więcej" */
.losowe-pliki-footer {
    text-align: center;
}

.losowe-pliki-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 30px;
    background: linear-gradient(135deg, var(--color_accent1), var(--color_accent7));
    color: white;
    text-decoration: none;
    border-radius: 25px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(233, 76, 61, 0.3);
}

.losowe-pliki-more-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(233, 76, 61, 0.4);
    text-decoration: none;
    color: white;
}

.losowe-pliki-more-btn .material-icons-outlined {
    transition: transform 0.3s ease;
}

.losowe-pliki-more-btn:hover .material-icons-outlined:last-child {
    transform: translateX(3px);
}

/* Stan pusty */
.losowe-pliki-brak {
    grid-column: 1 / -1;
    text-align: center;
    padding: 40px;
    color: #666;
    font-style: italic;
}

/* Responsive */
@media (max-width: 768px) {
    .losowe-pliki-sekcja {
        padding: 30px 0;
    }
    
    .losowe-pliki-container {
        padding: 0 15px;
    }
    
    .losowe-pliki-title {
        font-size: 26px;
    }
    
    .losowe-pliki-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .losowy-plik-image {
        height: 150px;
    }
    
    .losowe-pliki-more-btn {
        padding: 12px 24px;
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .losowy-plik-content {
        padding: 15px;
    }
    
    .losowy-plik-title {
        font-size: 16px;
    }
    
    .losowy-plik-meta {
        flex-direction: column;
        gap: 8px;
    }
}



/* UKŁAD DZIENNIKARSKI - POSTY I STRONY */

.post-dziennikarski,
.page-dziennikarska {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Kontener główny */
.post-container {
    display: flex;
    gap: 40px;
    margin: 40px 0;
}

/* Główna treść */
.post-main-content {
    flex: 1;
    min-width: 0; /* Dla prawidłowego zawijania */
}

/* Prawy pasek */
.post-sidebar-right {
    flex: 0 0 300px;
    width: 300px;
}

/* Dolny pasek (ukryty na desktop) */
.post-sidebar-bottom {
    display: none;
    margin-top: 40px;
}

/* NAGŁÓWEK POSTA */
.post-header {
    margin-bottom: 30px;
    position: relative;
}

/* Tytuł z obramowaniem lewym i górnym */
.post-title {
    font-family: 'Bona Nova', serif;
    font-size: 32px;
    font-weight: 700;
    color: var(--color_accent6);
    line-height: 1.2;
    margin: 0 0 20px 0;
    padding: 20px 0 0 20px;
    position: relative;
    
    /* Obramowanie lewe */
    border-left: 4px solid var(--color_accent1);
    
    /* Obramowanie górne */
    border-top: 0px solid var(--color_accent1);
    
    /* Narożnik */
    border-top-left-radius: 4px;
}

/* Meta informacje */
.post-meta {
    text-align: right;
    font-size: 14px;
    color: #666;
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: flex-end;
}

.post-meta-updated {
    color: darkgreen;
    font-weight: 500;
}

.post-meta-published {
    color: var(--color_accent6);
    font-weight: 500;
}

/* Separator */
.post-separator {
    border: none;
    height: 2px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    margin: 0 0 30px 0;
    border-radius: 1px;
}

/* TREŚĆ POSTA */
.post-content {
    font-family: 'Cabin', sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: var(--color_black);
}

.post-content h2,
.post-content h3,
.post-content h4 {
    font-family: 'Bona Nova', serif;
    color: var(--color_accent6);
    margin: 30px 0 15px 0;
    line-height: 1.3;
}

.post-content h2 {
    font-size: 24px;
    border-left: 3px solid var(--color_accent1);
    padding-left: 15px;
}

.post-content h3 {
    font-size: 20px;
    border-left: 2px solid var(--color_accent3);
    padding-left: 12px;
}

.post-content h4 {
    font-size: 18px;
    color: var(--color_accent7);
}

.post-content p {
    margin: 0 0 20px 0;
    text-align: justify;
}

.post-content blockquote {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-left: 4px solid var(--color_accent1);
    border-radius: 0 8px 8px 0;
    padding: 20px 25px;
    margin: 30px 0;
    font-style: italic;
    position: relative;
}

.post-content blockquote::before {
    content: '"';
    font-size: 48px;
    color: var(--color_accent2);
    position: absolute;
    top: 10px;
    left: 15px;
    font-family: 'Bona Nova', serif;
}

.post-content ul,
.post-content ol {
    margin: 20px 0;
    padding-left: 30px;
}

.post-content li {
    margin: 8px 0;
}

.post .aligncenter
{
display: block;
align-items: center;
text-align: center!important;
margin: 0 auto!important;
}


/* DZIENNIKARSKIE PODPISY DO OBRAZKÓW */

/* Podpisy pod obrazkami wyśrodkowanymi */
.post-content p:has(img.aligncenter) + p[style*="text-align: center"],
.post-content p:has(a > img.aligncenter) + p[style*="text-align: center"] {
    font-family: 'Bona Nova', serif; /* Czcionka serif dla podpisów */
    font-style: italic;
    font-size: 0.85em;
    color: var(--color_accent6);
    text-align: center;
    margin: -35px auto 25px auto;
    max-width: 800px;
    padding: 12px 20px;
    
    /* Dziennikarski styl ramki */
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.15);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    
    /* Górna linia akcentująca */
    border-top: 2px solid var(--color_accent3);
    
    position: relative;
}

/* Ozdobny element przed podpisem */
.post-content p:has(img.aligncenter) + p[style*="text-align: center"]::before,
.post-content p:has(a > img.aligncenter) + p[style*="text-align: center"]::before {
    content: "📷";
    font-size: 12px;
    margin-right: 6px;
    opacity: 0.6;
}

/* Alternatywnie z ikoną Material */
/* 
.post-content p:has(img.aligncenter) + p[style*="text-align: center"]::before,
.post-content p:has(a > img.aligncenter) + p[style*="text-align: center"]::before {
    content: "";
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 24 24" width="14" fill="%23666"><path d="M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/></svg>') no-repeat;
    width: 14px;
    height: 14px;
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
} */

/* Hover effect dla podpisów */
.post-content p:has(img.aligncenter) + p[style*="text-align: center"]:hover,
.post-content p:has(a > img.aligncenter) + p[style*="text-align: center"]:hover {
    border-top-color: var(--color_accent1);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* ULEPSZONY STYL OBRAZKÓW */
.post-content img {
    max-width: 100%;
    height: auto;
    box-sizing: border-box;
    
    /* Dziennikarski styl ramki */
    border: 1px solid rgba(112, 32, 31, 0.2);
    box-shadow: 
        0 4px 12px rgba(0,0,0,0.15),
        inset 0 1px 0 rgba(255,255,255,0.8);
    
    /* Białe passepartout */
    padding: 12px;
    background: white;
    
    /* Zaokrąglone rogi */
    border-radius: 4px;
    
    transition: all 0.3s ease;
}

/* Hover effect dla obrazków */
.post-content img:hover {
    box-shadow: 
        0 8px 20px rgba(0,0,0,0.2),
        inset 0 1px 0 rgba(255,255,255,0.9);
    transform: translateY(-2px);
}

/* Specjalne style dla obrazków w linkach */
.post-content a img {
    cursor: pointer;
}

.post-content a img:hover {
    border-color: var(--color_accent1);
}

/* Style dla różnych rozmiarów obrazków */
.post-content .alignleft img,
.post-content .alignright img {
    max-width: 300px;
    margin: 0 20px 20px 0;
}

.post-content .alignright img {
    margin: 0 0 20px 20px;
}

.post-content .aligncenter img {
    display: block;
    margin: 25px auto;
}

/* Responsywne dostosowania */
@media (max-width: 768px) {
    .post-content p:has(img.aligncenter) + p[style*="text-align: center"],
    .post-content p:has(a > img.aligncenter) + p[style*="text-align: center"] {
        margin-left: 15px;
        margin-right: 15px;
        padding: 10px 15px;
        font-size: 0.8em;
        margin-top: -30px;
    }
    
    .post-content img {
        padding: 8px;
    }
    
    .post-content .alignleft img,
    .post-content .alignright img {
        max-width: 200px;
        margin: 0 15px 15px 0;
    }
    
    .post-content .alignright img {
        margin: 0 0 15px 15px;
    }
}

@media (max-width: 480px) {
    .post-content .alignleft img,
    .post-content .alignright img {
        float: none !important;
        display: block;
        margin: 15px auto;
        max-width: 100%;
    }
}


/* STOPKA POSTA */
.post-footer {
    margin-top: 40px;
    padding: 20px 0;
    border-top: 1px solid var(--color_accent5);
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.post-categories,
.post-tags,
.post-author {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #666;
}

.post-categories .material-icons-outlined,
.post-tags .material-icons-outlined,
.post-author .material-icons-outlined {
    font-size: 18px;
    color: var(--color_accent1);
}

.post-categories a,
.post-tags a {
    color: var(--color_accent6);
    text-decoration: none;
    transition: color 0.3s ease;
}

.post-categories a:hover,
.post-tags a:hover {
    color: var(--color_accent1);
}

/* PRAWY PASEK */
.post-sidebar-widgets {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 25px;
    position: sticky;
    top: 20px;
    /* Styl górnej ramki */
    position: relative;
    overflow: hidden;
}

.post-sidebar-widgets::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

.post-sidebar-widgets h2,
.post-sidebar-widgets h3 {
    font-family: 'Bona Nova', serif;
    color: var(--color_accent6);
    margin-bottom: 15px;
    font-size: 18px;
}

.post-sidebar-widgets ul {
    list-style: none;
    padding: 0;
}

.post-sidebar-widgets li {
    padding: 8px 0;
    border-bottom: 1px solid rgba(112, 32, 31, 0.1);
}

.post-sidebar-widgets li:last-child {
    border-bottom: none;
}

.post-sidebar-widgets a {
    color: var(--color_accent6);
    text-decoration: none;
    transition: color 0.3s ease;
}

.post-sidebar-widgets a:hover {
    color: var(--color_accent1);
}

/* RESPONSIVE - POPRAWIONE */
@media (max-width: 1000px) {
    .post-container {
        flex-direction: column;
        gap: 0;
    }
    
    .post-sidebar-right {
        display: none;
    }
    
    .post-sidebar-bottom {
        display: block;
    }
    
    /* MOBILE - UKŁAD KOLUMNOWY */
    .post-sidebar-bottom .post-navigation-sidebar,
    .post-sidebar-bottom .post-sidebar-widgets-mobile {
        margin-bottom: 30px;
    }
    
    .post-sidebar-bottom .post-sidebar-widgets-mobile:last-child {
        margin-bottom: 0;
    }
    
    .post-sidebar-widgets-mobile {
        background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
        border: 1px solid rgba(112, 32, 31, 0.1);
        border-radius: 12px;
        padding: 25px;
        position: relative;
        overflow: hidden;
    }
    
    .post-sidebar-widgets-mobile::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
        border-radius: 12px 12px 0 0;
    }
    
    /* MOBILE - NAWIGACJA W GRID */
    .post-navigation-sidebar .navigation-sections-wrapper {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
    
    .navigation-title {
        grid-column: 1 / -1; /* Tytuł na pełną szerokość */
        font-size: 20px;
        margin-bottom: 25px;
    }
    
    .navigation-section-title {
        font-size: 16px;
        margin-bottom: 15px;
    }
    
    .navigation-post-title {
        font-size: 15px;
    }
    
    .navigation-post-date {
        font-size: 13px;
    }
    
    .post-title {
        font-size: 28px;
        padding: 15px 0 0 15px;
    }
}

@media (max-width: 768px) {
    /* TABLET - JEDNA KOLUMNA */
    .post-navigation-sidebar .navigation-sections-wrapper {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .post-dziennikarski,
    .page-dziennikarska {
        padding: 0 15px;
    }
    
    .post-container {
        margin: 20px 0;
    }
    
    .post-title {
        font-size: 24px;
    }
    
    .post-content {
        font-size: 15px;
    }
    
    .post-meta {
        font-size: 12px;
    }
    
    .post-footer {
        flex-direction: column;
        gap: 10px;
    }
}



/* NAWIGACJA MIĘDZY POSTAMI */

.post-navigation-bottom {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 20px;
}

.post-navigation-container {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 16px;
    padding: 30px;
    position: relative;
    overflow: hidden;
}

/* Styl górnej ramki jak w widgetach */
.post-navigation-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 16px 16px 0 0;
}

/* Tytuł nawigacji */
.post-navigation-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: 'Bona Nova', serif;
    font-size: 20px;
    color: var(--color_accent6);
    margin-bottom: 25px;
    text-align: center;
}

.post-navigation-title .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 24px;
}

/* Linki nawigacji */
.post-navigation-links {
    display: flex;
    align-items: stretch;
    gap: 20px;
    margin-bottom: 25px;
}

.post-nav-item {
    flex: 1;
    min-height: 120px;
}

.post-nav-link {
    display: block;
    height: 100%;
    text-decoration: none;
    color: inherit;
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 20px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.post-nav-link:hover {
    background: rgba(233, 202, 199, 0.3);
    border-color: var(--color_accent1);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
    text-decoration: none;
    color: inherit;
}

/* Kierunek nawigacji */
.post-nav-direction {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--color_accent1);
}

.post-nav-previous .post-nav-direction {
    justify-content: flex-start;
}

.post-nav-next .post-nav-direction {
    justify-content: flex-end;
}

.post-nav-direction .material-icons-outlined {
    font-size: 16px;
}

/* Zawartość nawigacji */
.post-nav-content {
    display: flex;
    align-items: center;
    gap: 15px;
}

.post-nav-previous .post-nav-content {
    flex-direction: row;
}

.post-nav-next .post-nav-content {
    flex-direction: row-reverse;
}

.post-nav-thumbnail {
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(112, 32, 31, 0.1);
}

.post-nav-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-nav-details {
    flex: 1;
    min-width: 0;
}

.post-nav-previous .post-nav-details {
    text-align: left;
}

.post-nav-next .post-nav-details {
    text-align: right;
}

.post-nav-title {
    font-family: 'Bona Nova', serif;
    font-size: 18px;
    font-weight: 600;
    color: var(--color_accent6);
    margin: 0 0 5px 0;
    line-height: 1.3;

}

.post-nav-date {
    font-size: 12px;
    color: #666;
    font-weight: 500;
}

/* Separator środkowy */
.post-nav-separator {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
}

.post-nav-separator .material-icons-outlined {
    color: var(--color_accent3);
    font-size: 24px;
}

/* Placeholder gdy brak posta */
.post-nav-placeholder {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.05);
    border: 1px dashed rgba(112, 32, 31, 0.2);
    border-radius: 12px;
    padding: 20px;
    color: #999;
}

.post-nav-placeholder .post-nav-direction {
    color: #999;
    margin: 0;
}

/* Powrót do kategorii */
.post-nav-category-back {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid rgba(112, 32, 31, 0.1);
}

.category-back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--color_accent6);
    text-decoration: none;
    font-weight: 500;
    padding: 12px 20px;
    border: 1px solid var(--color_accent5);
    border-radius: 25px;
    transition: all 0.3s ease;
    font-size: 14px;
}

.category-back-link:hover {
    background: var(--color_accent2);
    border-color: var(--color_accent1);
    color: var(--color_accent7);
    text-decoration: none;
    transform: translateY(-1px);
}

.category-back-link .material-icons-outlined {
    font-size: 16px;
    transition: transform 0.3s ease;
}

.category-back-link:hover .material-icons-outlined:last-child {
    transform: translateX(3px);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .post-navigation-bottom {
        padding: 30px 15px;
    }
    
    .post-navigation-container {
        padding: 20px;
    }
    
    .post-navigation-title {
        font-size: 20px;
        margin-bottom: 20px;
    }
    
    .post-navigation-links {
        flex-direction: column;
        gap: 15px;
    }
    
    .post-nav-separator {
        display: none;
    }
    
    .post-nav-content {
        gap: 12px;
    }
    
    .post-nav-thumbnail {
        width: 50px;
        height: 50px;
    }
    
    .post-nav-title {
        font-size: 14px;
    }
    
    .post-nav-date {
        font-size: 11px;
    }
    
    /* Na mobile wszystkie teksty do lewej */
    .post-nav-next .post-nav-details {
        text-align: left;
    }
    
    .post-nav-next .post-nav-content {
        flex-direction: row;
    }
    
    .category-back-link {
        font-size: 13px;
        padding: 10px 16px;
    }
}

@media (max-width: 480px) {
    .post-navigation-container {
        padding: 15px;
        border-radius: 12px;
    }
    
    .post-nav-link {
        padding: 15px;
    }
    
    .post-nav-title {
        font-size: 18px;
    }
    
    .post-nav-direction {
        font-size: 11px;
    }
}




/* SEKCJA NAWIGACYJNA W PRAWYM PASKU */

.post-navigation-sidebar {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}

/* Górna kolorowa linia */
.post-navigation-sidebar::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

/* Główny tytuł */
.navigation-title {
    font-family: 'Bona Nova', serif;
    color: var(--color_accent6);
    font-size: 18px;
    margin-bottom: 20px;
    text-align: center;
    position: relative;
}

.navigation-title::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 2px;

    border-radius: 1px;
}

/* Sekcje (Nowsze/Starsze) */
.navigation-section {
    margin-bottom: 25px;
}

.navigation-section:last-child {
    margin-bottom: 0;
}

.navigation-section-title {
    font-family: 'Cabin', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: var(--color_accent7);
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Lista postów */
.navigation-posts-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.navigation-post-item {
    margin-bottom: 12px;
    position: relative;
    padding-left: 15px;
}

.navigation-post-item:last-child {
    margin-bottom: 0;
}

/* Punktor */
.navigation-post-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 6px;
    height: 6px;
    background: var(--color_accent1);
    border-radius: 50%;
    transition: all 0.3s ease;
}

.navigation-post-item:hover::before {
    background: var(--color_accent3);
    transform: scale(1.2);
}

/* Link posta */
.navigation-post-link {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
    padding: 5px 0;
}

.navigation-post-link:hover {
    color: var(--color_accent1);
    text-decoration: none;
    padding-left: 5px;
}

/* Tytuł posta */
.navigation-post-title {
    display: block;
    font-size: 18px;
    line-height: 1.3;
    color: var(--color_accent6);
    margin-bottom: 3px;
    transition: color 0.3s ease;
}

.navigation-post-link:hover .navigation-post-title {
    color: var(--color_accent1);
}

/* Data posta */
.navigation-post-date {
    display: block;
    font-size: 14px;
    color: #999;
    text-align: right;
    font-weight: 500;
    font-family: 'Cabin', sans-serif;
}

/* Stan pusty */
.navigation-empty {
    text-align: center;
    padding: 20px;
    color: #666;
    font-style: italic;
    font-size: 14px;
}

/* Responsive */
@media (max-width: 1000px) {
    .post-navigation-sidebar {
        margin-bottom: 20px;
    }
    
    .navigation-title {
        font-size: 16px;
    }
    
    .navigation-post-title {
        font-size: 14px;
    }
    
    .navigation-post-date {
        font-size: 12px;
    }
}




/* ARCHIWUM - UNIWERSALNA TEMPLATKA */

.archive-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 20px;
    display: flex;
    gap: 40px;
}

.archive-main-content {
    flex: 1;
    min-width: 0;
}

.archive-sidebar {
    flex: 0 0 300px;
    width: 300px;
}

/* NAGŁÓWEK ARCHIWUM */
.archive-header {
    margin-bottom: 40px;
}

.archive-title {
    font-family: 'Bona Nova', serif;
    font-size: 32px;
    font-weight: 700;
    color: var(--color_accent6);
    margin: 0 0 20px 0;
    padding: 20px 0 0 20px;
	text-align: center;
    border-top-left-radius: 4px;
}

.archive-description {
    font-size: 16px;
    color: #666;
    margin-bottom: 20px;
}

.archive-separator {
    border: none;
    height: 0px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    margin: 0;
    border-radius: 1px;
}

/* INFO O WYNIKACH */
.archive-info {

    border-radius: 8px;
    padding: 15px 20px;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.archive-info::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 8px 8px 0 0;
}

/* POSTY W ARCHIWUM */
.archive-post-item {
    margin-bottom: 40px;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    transition: all 0.3s ease;
}

.archive-post-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

.archive-post-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
}

.archive-post-header {
    padding: 25px 25px 15px 25px;
}

.archive-post-title {
    font-family: 'Bona Nova', serif;
    font-size: 24px;
    margin: 0 0 10px 0;
    line-height: 1.3;
}

.archive-post-title a {
    font-size: 24px;
    color: var(--color_accent6);
    text-decoration: none;
    transition: color 0.3s ease;
}

.archive-post-title a:hover {
    color: var(--color_accent1);
}

.archive-post-meta {
    display: flex;
    gap: 15px;
    font-size: 14px;
    color: #666;
    flex-wrap: wrap;
}

.archive-post-content {
    padding: 0 25px 25px 25px;
    display: flex;
    gap: 20px;
}

.archive-post-thumbnail {
    flex: 0 0 200px;
    width: 200px;
}

.archive-post-thumbnail img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    border: 1px solid rgba(112, 32, 31, 0.1);
}

.archive-post-text {
    flex: 1;
}

.archive-post-excerpt {
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 20px;
}

/* PLIKI DO POBRANIA */
.download-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: var(--color_accent3);
    color: var(--color_accent6);
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    margin-right: 10px;
}

.archive-file-info {
    color: var(--color_accent1);
    font-weight: 500;
}

.archive-download-actions {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.archive-download-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--color_accent1);
    color: white;
    padding: 10px 20px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.3s ease;
}

.archive-download-btn:hover {
    background: var(--color_accent7);
    text-decoration: none;
    color: white;
}

.archive-details-btn {
    color: var(--color_accent6);
    text-decoration: none;
    padding: 10px 15px;
    border: 1px solid var(--color_accent5);
    border-radius: 25px;
    transition: all 0.3s ease;
}

.archive-details-btn:hover {
    background: var(--color_accent2);
    text-decoration: none;
}

.archive-read-more {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--color_accent1);
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.archive-read-more:hover {
    color: var(--color_accent7);
    text-decoration: none;
    transform: translateX(5px);
}

/* PAGINACJA */
.archive-pagination {
    margin-top: 40px;
    text-align: center;
}

.archive-pagination .page-numbers {
    display: inline-block;
    padding: 10px 15px;
    margin: 0 5px;
    background: white;
    border: 1px solid var(--color_accent5);
    border-radius: 6px;
    color: var(--color_accent6);
    text-decoration: none;
    transition: all 0.3s ease;
}

.archive-pagination .page-numbers:hover,
.archive-pagination .page-numbers.current {
    background: var(--color_accent1);
    color: white;
    border-color: var(--color_accent1);
}

/* PRAWY PASEK ARCHIWUM */
.archive-sidebar-widget {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden;
}

.archive-sidebar-widget::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

.archive-sidebar-widget h3 {
    font-family: 'Bona Nova', serif;
    color: var(--color_accent6);
    font-size: 18px;
    margin-bottom: 20px;
}

.archive-search-input-container {
    display: flex;
    background: white;
    border: 2px solid var(--color_accent5);
    border-radius: 25px;
    padding: 8px 15px;
}

.archive-search-field {
    flex: 1;
    border: none;
    outline: none;
    font-size: 14px;
}

.archive-search-submit {
    background: var(--color_accent1);
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-left: 10px;
}

.archive-search-submit .material-icons-outlined {
    color: white;
    font-size: 16px;
}

.archive-categories-list,
.archive-monthly-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.archive-categories-list li,
.archive-monthly-list li {
    margin-bottom: 10px;
    padding: 8px;
    border-bottom: 1px solid rgba(112, 32, 31, 0.1);
}

.archive-categories-list a,
.archive-monthly-list a {
    color: var(--color_accent6);
    text-decoration: none;
    transition: color 0.3s ease;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.archive-categories-list a:hover,
.archive-monthly-list a:hover {
    color: var(--color_accent1);
}

.category-count {
    background: var(--color_accent5);
    color: var(--color_accent6);
    padding: 2px 6px;
    border-radius: 10px;
    font-size: 12px;
}

/* STAN PUSTY */
.archive-no-posts {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

.archive-empty-icon {
    font-size: 64px;
    color: var(--color_accent5);
    margin-bottom: 20px;
}

.archive-empty-icon .material-icons-outlined {
    font-size: 64px;
}

.back-to-home {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--color_accent1);
    text-decoration: none;
    margin-top: 20px;
    padding: 10px 20px;
    border: 1px solid var(--color_accent1);
    border-radius: 25px;
    transition: all 0.3s ease;
}

.back-to-home:hover {
    background: var(--color_accent1);
    color: white;
    text-decoration: none;
}

/* RESPONSIVE */
@media (max-width: 1000px) {
    .archive-container {
        flex-direction: column;
        gap: 30px;
    }
    
    .archive-sidebar {
        flex: 1;
        width: 100%;
    }
    
    .archive-post-content {
        flex-direction: column;
    }
    
    .archive-post-thumbnail {
        flex: none;
        width: 100%;
        max-width: 300px;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .archive-container {
        padding: 20px 15px;
    }
    
    .archive-title {
        font-size: 24px;
        padding: 15px 0 0 15px;
    }
    
    .archive-post-header,
    .archive-post-content {
        padding: 20px;
    }
    
    .archive-post-meta {
        flex-direction: column;
        gap: 8px;
    }
    
    .archive-download-actions {
        flex-direction: column;
    }
    
    .archive-download-btn,
    .archive-details-btn {
        text-align: center;
        justify-content: center;
    }
}


/* Autor wyciągnięty z treści */
.archive-post-content-author {
    color: var(--color_accent1);
    font-weight: 600;
    font-style: italic;
    position: relative;
}

.archive-post-content-author::before {
    font-style: normal;
    margin-right: 5px;
}

/* Stylizacja meta informacji */
.archive-post-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    color: #666;
    flex-wrap: wrap;
    gap: 10px;
}

.archive-post-date {
    color: var(--color_accent6);
    font-weight: 500;
}

.archive-post-author {
    color: #999;
}

.archive-post-content-author {
    text-align: right;
    flex: 1;
    min-width: fit-content;
}

/* Responsive */
@media (max-width: 768px) {
    .archive-post-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .archive-post-content-author {
        text-align: right;
        width: 100%;
    }
}



/* PDF EMBED - PROFESJONALNY STYL */

.pdf-embed-container {
    margin: 30px 0;
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    position: relative;
}

/* Górna kolorowa linia */
.pdf-embed-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

/* NAGŁÓWEK PDF */
.pdf-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: rgba(112, 32, 31, 0.05);
    border-bottom: 1px solid rgba(112, 32, 31, 0.1);
}

.pdf-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Bona Nova', serif;
    font-weight: 600;
    color: var(--color_accent6);
    font-size: 16px;
}

.pdf-title .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 20px;
}

.pdf-controls {
    display: flex;
    gap: 10px;
}

.pdf-fullscreen-btn,
.pdf-download-btn-small {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--color_accent1);
    color: white;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.pdf-fullscreen-btn:hover,
.pdf-download-btn-small:hover {
    background: var(--color_accent7);
    transform: scale(1.05);
    text-decoration: none;
    color: white;
}

/* DESKTOP - IFRAME */
.pdf-iframe-wrapper {
    position: relative;
    width: 100%;
    background: white;
}

.pdf-iframe {
    width: 100%;
    height: 600px;
    border: none;
    display: block;
    background: white;
}

/* Responsywny iframe dla różnych rozmiarów */
@media (min-width: 1200px) {
    .pdf-iframe {
        height: 700px;
    }
}

@media (max-width: 768px) {
    .pdf-iframe {
        height: 500px;
    }
}

@media (max-width: 480px) {
    .pdf-iframe {
        height: 400px;
    }
}

/* MOBILE - ALTERNATYWNY WIDOK */
.pdf-mobile-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 20px;
    font-family: 'Bona Nova', serif;
    font-weight: 600;
    color: var(--color_accent6);
    font-size: 18px;
    text-align: center;
    justify-content: center;
}

.pdf-mobile-header .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 24px;
}

.pdf-mobile-content {
    padding: 0 20px 25px 20px;
    text-align: center;
}

.pdf-mobile-description {
    color: #666;
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 25px;
}

.pdf-mobile-actions {
    display: flex;
    flex-direction: column;
    gap: 15px;
    max-width: 300px;
    margin: 0 auto;
}

.pdf-download-btn,
.pdf-view-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.pdf-download-btn {
    background: var(--color_accent1);
    color: white;
}

.pdf-download-btn:hover {
    background: var(--color_accent7);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(233, 76, 61, 0.3);
    text-decoration: none;
    color: white;
}

.pdf-view-btn {
    background: transparent;
    color: var(--color_accent6);
    border: 2px solid var(--color_accent5);
}

.pdf-view-btn:hover {
    background: var(--color_accent2);
    border-color: var(--color_accent1);
    text-decoration: none;
    color: var(--color_accent6);
}

/* FALLBACK */
.pdf-fallback {
    padding: 15px 20px;
    background: rgba(255, 235, 59, 0.1);
    border-top: 1px solid rgba(255, 235, 59, 0.3);
    text-align: center;
    font-size: 13px;
    color: #666;
}

.pdf-fallback a {
    color: var(--color_accent1);
    text-decoration: none;
    font-weight: 500;
}

.pdf-fallback a:hover {
    color: var(--color_accent7);
    text-decoration: underline;
}



.pdf-iframe:not([src=""]) + .pdf-iframe-wrapper::before {
    display: none;
}



.pdf-iframe[src] ~ .pdf-iframe-wrapper::after {
    display: none;
}

@keyframes spin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .pdf-header {
        padding: 12px 15px;
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }
    
    .pdf-controls {
        justify-content: center;
    }
    
    .pdf-mobile-actions {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .pdf-embed-container {
        margin: 20px -15px; /* Wyjdź poza padding kontenera */
        border-radius: 0;
    }
    
    .pdf-embed-container::before {
        border-radius: 0;
    }
    
    .pdf-mobile-content {
        padding: 0 15px 20px 15px;
    }
}

/* DARK MODE (opcjonalnie) */
@media (prefers-color-scheme: dark) {
    .pdf-embed-container {
        background: linear-gradient(135deg, #2a2a2a 0%, #1e1e1e 100%);
        border-color: rgba(255, 255, 255, 0.1);
    }
    
    .pdf-header {
        background: rgba(255, 255, 255, 0.05);
        border-bottom-color: rgba(255, 255, 255, 0.1);
    }
    
    .pdf-title {
        color: #e0e0e0;
    }
    
    .pdf-mobile-description,
    .pdf-fallback {
        color: #b0b0b0;
    }
}



/* STRONY URZĘDOWE - PROFESSIONALNY DESIGN */

.page-urzedowa {
    background: #f8f9fa;
    min-height: calc(100vh - 200px);
}

.page-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 20px;
}

.page-main-content {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    overflow: hidden;
}

/* NAGŁÓWEK STRONY */
.page-header {
    background: linear-gradient(135deg, var(--color_accent6) 0%, #5a1b1a 100%);
    color: white;
    padding: 40px;
    position: relative;
}

.page-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,255,255,0.05)" stroke-width="0.5"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');
    opacity: 0.3;
}

.page-header-content {
    position: relative;
    z-index: 2;
}

.page-title {
    font-family: 'Bona Nova', serif;
    font-size: 36px;
    font-weight: 700;
    margin: 0 0 20px 0;
    color: white;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

/* Breadcrumbs */
.page-breadcrumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    font-size: 14px;
    opacity: 0.9;
}

.page-breadcrumbs a {
    color: var(--color_accent3);
    text-decoration: none;
    transition: color 0.3s ease;
}

.page-breadcrumbs a:hover {
    color: white;
}

.breadcrumb-separator {
    opacity: 0.6;
    margin: 0 4px;
}

.breadcrumb-current {
    opacity: 0.8;
}

/* Meta informacje */
.page-meta {
    display: flex;
    gap: 25px;
    font-size: 14px;
    opacity: 0.9;
    flex-wrap: wrap;
}

.page-meta-updated,
.page-meta-published {
    display: flex;
    align-items: center;
    gap: 6px;
}

.page-meta .material-icons-outlined {
    font-size: 16px;
}

/* SPIS TREŚCI */
.page-toc-container {
    margin: 30px 40px;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.page-toc-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 20px;
    background: #e9ecef;
    border-bottom: 1px solid #dee2e6;
}

.page-toc-header h3 {
    margin: 0;
    font-size: 16px;
    color: var(--color_accent6);
    display: flex;
    align-items: center;
    gap: 8px;
}

.toc-toggle {
    background: none;
    border: none;
    color: var(--color_accent1);
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

.toc-toggle:hover {
    background: rgba(233, 76, 61, 0.1);
}

.page-toc-list {
    padding: 20px;
}

.page-toc-list ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.page-toc-list li {
    margin: 8px 0;
}

.page-toc-list a {
    color: var(--color_accent6);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
    display: block;
    padding: 4px 0;
}

.page-toc-list a:hover {
    color: var(--color_accent1);
}

/* TREŚĆ STRONY */
.page-content-body {
    padding: 40px;
}

.page-content {
    font-family: 'Cabin', sans-serif;
    font-size: 16px;
    line-height: 1.8;
    color: #333;
}

.page-content h2 {
    font-family: 'Bona Nova', serif;
    font-size: 28px;
    color: var(--color_accent6);
    margin: 40px 0 20px 0;
    padding: 15px 0 15px 20px;
    border-left: 4px solid var(--color_accent1);
    background: linear-gradient(90deg, rgba(233, 76, 61, 0.05) 0%, transparent 100%);
}

.page-content h3 {
    font-family: 'Bona Nova', serif;
    font-size: 22px;
    color: var(--color_accent6);
    margin: 30px 0 15px 0;
    padding: 10px 0 10px 15px;
    border-left: 3px solid var(--color_accent3);
}

.page-content h4 {
    font-family: 'Bona Nova', serif;
    font-size: 18px;
    color: var(--color_accent7);
    margin: 25px 0 10px 0;
}

.page-content p {
    margin: 0 0 20px 0;
    text-align: justify;
}

.page-content ul,
.page-content ol {
    margin: 20px 0;
    padding-left: 30px;
}

.page-content li {
    margin: 10px 0;
}

.page-content blockquote {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-left: 4px solid var(--color_accent1);
    margin: 30px 0;
    padding: 20px 25px;
    font-style: italic;
    border-radius: 0 8px 8px 0;
}

.page-content img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    border: 1px solid #dee2e6;
    padding: 8px;
    background: white;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin: 20px 0;
}

.page-image-link {
    display: inline-block;
    transition: transform 0.3s ease;
}

.page-image-link:hover {
    transform: scale(1.02);
}

/* STOPKA STRONY */
.page-footer {
    background: #f8f9fa;
    border-top: 1px solid #dee2e6;
    padding: 30px 40px;
}

.page-footer-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.page-actions {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.page-action-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    text-decoration: none;
    color: var(--color_accent6);
    font-size: 14px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.page-action-btn:hover {
    background: var(--color_accent2);
    border-color: var(--color_accent1);
    color: var(--color_accent7);
    text-decoration: none;
    transform: translateY(-1px);
}

.page-action-btn .material-icons-outlined {
    font-size: 18px;
}

.page-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 12px;
    color: #666;
}

.page-info-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.page-info .material-icons-outlined {
    font-size: 14px;
    color: var(--color_accent1);
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .page-container {
        padding: 20px 15px;
    }
    
    .page-header {
        padding: 30px 25px;
    }
    
    .page-title {
        font-size: 28px;
    }
    
    .page-meta {
        flex-direction: column;
        gap: 10px;
    }
    
    .page-toc-container {
        margin: 20px 25px;
    }
    
    .page-content-body {
        padding: 25px;
    }
    
    .page-footer {
        padding: 25px;
    }
    
    .page-footer-content {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .page-actions {
        width: 100%;
        justify-content: center;
    }
    
    .page-action-btn {
        flex: 1;
        justify-content: center;
        min-width: 120px;
    }
}

@media (max-width: 480px) {
    .page-title {
        font-size: 24px;
    }
    
    .page-content-body {
        padding: 20px;
    }
    
    .page-actions {
        flex-direction: column;
    }
    
    .page-action-btn {
        width: 100%;
    }
}

/* PRINT STYLES */
@media print {
    .page-header {
        background: white !important;
        color: black !important;
        box-shadow: none !important;
    }
    
    .page-title {
        color: black !important;
        text-shadow: none !important;
    }
    
    .page-actions {
        display: none;
    }
    
    .page-toc-container {
        page-break-inside: avoid;
    }
}




/* STRONA BŁĘDU 404 */

.error-404-container {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 50%, #f0f2f5 100%);
    min-height: calc(100vh - 200px);
}

/* HERO BŁĘDU */
.error-hero {
    padding: 80px 20px;
    text-align: center;
    background: linear-gradient(135deg, 
        rgba(233, 76, 61, 0.05) 0%, 
        rgba(255, 217, 51, 0.05) 100%);
}

.error-hero-content {
    max-width: 800px;
    margin: 0 auto;
}

.error-animation {
    position: relative;
    margin-bottom: 40px;
}

.error-number {
    font-family: 'Bona Nova', serif;
    font-size: 120px;
    font-weight: 700;
    color: var(--color_accent1);
    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
    line-height: 1;
    margin-bottom: 20px;
}

.zero-animation {
    display: inline-block;
    transition: transform 0.6s ease;
    transform-style: preserve-3d;
}

.error-illustration {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--color_accent3);
    border-radius: 50%;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: float 3s ease-in-out infinite;
}

.error-illustration .material-icons-outlined {
    font-size: 40px;
    color: var(--color_accent6);
}

@keyframes float {
    0%, 100% { transform: translate(-50%, -50%) translateY(0px); }
    50% { transform: translate(-50%, -50%) translateY(-10px); }
}

.error-title {
    font-family: 'Bona Nova', serif;
    font-size: 36px;
    color: var(--color_accent6);
    margin-bottom: 20px;
}

.error-description {
    font-size: 18px;
    color: #666;
    line-height: 1.6;
    max-width: 600px;
    margin: 0 auto;
}

/* WYSZUKIWARKA BŁĘDU */
.error-search-section {
    padding: 60px 20px;
    background: white;
}

.error-search-container {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.search-section-title {
    font-family: 'Bona Nova', serif;
    font-size: 28px;
    color: var(--color_accent6);
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.search-section-title .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 32px;
}

.error-search-form {
    max-width: 600px;
    margin: 0 auto;
}

.search-input-wrapper {
    display: flex;
    background: white;
    border: 2px solid var(--color_accent5);
    border-radius: 50px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
}

.search-input-wrapper:focus-within {
    border-color: var(--color_accent1);
    box-shadow: 0 4px 20px rgba(233, 76, 61, 0.15);
}

.error-search-field {
    flex: 1;
    border: none;
    outline: none;
    padding: 18px 25px;
    font-size: 16px;
    background: transparent;
}

.error-search-submit {
    background: linear-gradient(135deg, var(--color_accent1), var(--color_accent7));
    border: none;
    padding: 18px 30px;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.error-search-submit:hover {
    background: linear-gradient(135deg, var(--color_accent7), var(--color_accent1));
    transform: translateX(-2px);
}

/* SEKCJE OGÓLNE */
.popular-categories-section,
.recent-posts-section,
.random-downloads-section,
.helpful-links-section {
    padding: 60px 20px;
    border-bottom: 1px solid rgba(112, 32, 31, 0.05);
}

.popular-categories-section {
    background: rgba(233, 76, 61, 0.02);
}

.recent-posts-section {
    background: white;
}

.random-downloads-section {
    background: rgba(255, 217, 51, 0.02);
}

.helpful-links-section {
    background: white;
}

.categories-container,
.recent-posts-container,
.downloads-container,
.links-container {
    max-width: 1200px;
    margin: 0 auto;
}

.section-title {
    font-family: 'Bona Nova', serif;
    font-size: 28px;
    color: var(--color_accent6);
    text-align: center;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.section-title .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 32px;
}

/* KATEGORIE */
.categories-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 20px;
}

.category-card {
    display: flex;
    align-items: center;
    gap: 15px;
    background: white;
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 20px;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.category-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

.category-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    text-decoration: none;
    color: inherit;
}

.category-icon {
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, var(--color_accent1), var(--color_accent7));
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.category-icon .material-icons-outlined {
    color: white;
    font-size: 24px;
}

.category-info {
    flex: 1;
}

.category-name {
    font-family: 'Bona Nova', serif;
    font-size: 18px;
    color: var(--color_accent6);
    margin: 0 0 5px 0;
}

.category-count {
    font-size: 14px;
    color: #666;
}

/* NAJNOWSZE POSTY */
.recent-posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px;
}

.recent-post-card {
    background: white;
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
}

.recent-post-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 12px 12px 0 0;
}

.recent-post-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

.post-thumbnail {
    height: 180px;
    overflow: hidden;
}

.post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.recent-post-card:hover .post-thumbnail img {
    transform: scale(1.05);
}

.recent-post-card .post-content {
    padding: 20px;
}

.recent-post-card .post-title {
    font-family: 'Bona Nova', serif;
    font-size: 18px;
    margin-bottom: 10px;
}

.recent-post-card .post-title a {
    color: var(--color_accent6);
    text-decoration: none;
    transition: color 0.3s ease;
}

.recent-post-card .post-title a:hover {
    color: var(--color_accent1);
}

.post-meta {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 12px;
    color: #666;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.post-date {
    display: flex;
    align-items: center;
    gap: 4px;
}

.post-date .material-icons-outlined {
    font-size: 14px;
    color: var(--color_accent1);
}

.post-excerpt {
    font-size: 14px;
    line-height: 1.5;
    color: #555;
    margin: 0;
}



/* PRZYDATNE LINKI */
.links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.link-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    background: white;
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 12px;
    padding: 30px 20px;
    text-decoration: none;
    color: var(--color_accent6);
    transition: all 0.3s ease;
    text-align: center;
}

.link-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    text-decoration: none;
    color: var(--color_accent1);
}

.link-card .material-icons-outlined {
    font-size: 40px;
    color: var(--color_accent1);
    transition: transform 0.3s ease;
}

.link-card:hover .material-icons-outlined {
    transform: scale(1.1);
}

.link-text {
    font-weight: 600;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .error-number {
        font-size: 80px;
    }
    
    .error-title {
        font-size: 28px;
    }
    
    .error-description {
        font-size: 16px;
    }
    
    .search-input-wrapper {
        flex-direction: column;
        border-radius: 12px;
    }
    
    .error-search-submit {
        border-radius: 0 0 12px 12px;
        justify-content: center;
    }
    
    .categories-grid,
    .recent-posts-grid,
    .downloads-grid {
        grid-template-columns: 1fr;
    }
    
    .category-card {
        text-align: center;
        flex-direction: column;
        gap: 10px;
    }
    
    .links-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .error-hero {
        padding: 60px 20px;
    }
    
    .error-number {
        font-size: 60px;
    }
    
    .error-illustration {
        width: 60px;
        height: 60px;
    }
    
    .error-illustration .material-icons-outlined {
        font-size: 30px;
    }
    
    .links-grid {
        grid-template-columns: 1fr;
    }
}



/* NOWOCZESNA STOPKA */

.footer-main {
    background: linear-gradient(135deg, var(--color_accent6) 0%, #4a1615 100%);
    color: white;
    margin-top: 80px;
    position: relative;
    overflow: hidden;
}

.footer-main::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="footerGrid" width="20" height="20" patternUnits="userSpaceOnUse"><path d="M 20 0 L 0 0 0 20" fill="none" stroke="rgba(255,255,255,0.03)" stroke-width="0.5"/></pattern></defs><rect width="100" height="100" fill="url(%23footerGrid)"/></svg>');
    opacity: 0.5;
}

/* Główna treść stopki */
.footer-content {
    position: relative;
    z-index: 2;
    padding: 60px 0;
}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.footer-content .footer-container {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.5fr;
    gap: 40px;
}

.footer-section-title {
    font-family: 'Bona Nova', serif;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
    color: white;
    display: flex;
    align-items: center;
    gap: 8px;
}

.footer-section-title .material-icons-outlined {
    color: var(--color_accent3);
    font-size: 20px;
}

/* Logo i opis */
.footer-about .footer-logo {
    margin-bottom: 20px;
}

.footer-site-title {
    font-family: 'Bona Nova', serif;
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 15px 0;
    color: white;
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-site-title .material-icons-outlined {
    color: var(--color_accent3);
    font-size: 28px;
}

.footer-description {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255,255,255,0.8);
    margin-bottom: 25px;
}

/* Social media */
.footer-social h4 {
    font-size: 16px;
    margin-bottom: 15px;
}

.social-links {
    display: flex;
    gap: 12px;
}

.social-link {
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    text-decoration: none;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.social-link:hover {
    background: var(--color_accent3);
    transform: translateY(-2px);
    color: var(--color_accent6);
    text-decoration: none;
}

/* Menu stopki */
.footer-menu,
.footer-categories-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-menu li,
.footer-categories-list li {
    margin-bottom: 10px;
}

.footer-menu a,
.footer-categories-list a {
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-menu a:hover,
.footer-categories-list a:hover {
    color: var(--color_accent3);
    text-decoration: none;
}

.category-count {
    background: rgba(255,255,255,0.1);
    padding: 2px 6px;
    border-radius: 10px;
    font-size: 11px;
    color: rgba(255,255,255,0.6);
}

/* Kontakt i newsletter */
.contact-info {
    margin-bottom: 25px;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    font-size: 14px;
    color: rgba(255,255,255,0.8);
}

.contact-item .material-icons-outlined {
    color: var(--color_accent3);
    font-size: 18px;
}

.contact-item a {
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    transition: color 0.3s ease;
}

.contact-item a:hover {
    color: var(--color_accent3);
}

/* Newsletter */
.newsletter-signup {
    background: rgba(255,255,255,0.05);
    padding: 20px;
    border-radius: 12px;
    backdrop-filter: blur(10px);
}

.newsletter-title {
    font-size: 16px;
    margin-bottom: 8px;
    color: white;
}

.newsletter-description {
    font-size: 13px;
    color: rgba(255,255,255,0.7);
    margin-bottom: 15px;
}

.newsletter-input-wrapper {
    display: flex;
    background: rgba(255,255,255,0.1);
    border-radius: 25px;
    overflow: hidden;
    backdrop-filter: blur(10px);
}

.newsletter-input {
    flex: 1;
    border: none;
    background: transparent;
    padding: 12px 15px;
    color: white;
    font-size: 14px;
    outline: none;
}

.newsletter-input::placeholder {
    color: rgba(255,255,255,0.5);
}

.newsletter-submit {
    background: var(--color_accent3);
    border: none;
    padding: 12px 15px;
    color: var(--color_accent6);
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.newsletter-submit:hover {
    background: rgba(255, 217, 51, 0.8);
}

/* Statystyki */
.footer-stats {
    background: rgba(0,0,0,0.2);
    padding: 30px 0;
    border-top: 1px solid rgba(255,255,255,0.1);
    position: relative;
    z-index: 2;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.stat-item {
    display: flex;
    align-items: center;
    gap: 15px;
    text-align: left;
}

.stat-icon {
    width: 50px;
    height: 50px;
    background: var(--color_accent3);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.stat-icon .material-icons-outlined {
    color: var(--color_accent6);
    font-size: 24px;
}

.stat-content {
    flex: 1;
}

.stat-number {
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: white;
    font-family: 'Bona Nova', serif;
}

.stat-label {
    display: block;
    font-size: 12px;
    color: rgba(255,255,255,0.7);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Dolna stopka */
.footer-bottom {
    background: rgba(0,0,0,0.3);
    padding: 20px 0;
    border-top: 1px solid rgba(255,255,255,0.1);
    position: relative;
    z-index: 2;
}

.footer-bottom-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.footer-copyright {
    color: rgba(255,255,255,0.7);
    font-size: 14px;
}

.footer-tech {
    display: flex;
    align-items: center;
    gap: 20px;
}

.tech-links {
    display: flex;
    gap: 15px;
}

.tech-links a {
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    font-size: 13px;
    transition: color 0.3s ease;
}

.tech-links a:hover {
    color: var(--color_accent3);
}

.tech-info {
    font-size: 12px;
    color: rgba(255,255,255,0.5);
}

.tech-info a {
    color: rgba(255,255,255,0.6);
    text-decoration: none;
}

.tech-info a:hover {
    color: var(--color_accent3);
}

/* Scroll to top */
.scroll-to-top {
    position: relative;
}

.scroll-top-button {
    width: 45px;
    height: 45px;
    background: var(--color_accent1);
    border: none;
    border-radius: 50%;
    color: white;
    cursor: pointer;
    transition: all 0.3s ease;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
}

.scroll-top-button.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.scroll-top-button:hover {
    background: var(--color_accent7);
    transform: translateY(-2px);
}

/* RESPONSIVE */
@media (max-width: 968px) {
    .footer-content .footer-container {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }
    
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

@media (max-width: 768px) {
    .footer-content {
        padding: 40px 0;
    }
    
    .footer-content .footer-container {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .stats-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .stat-item {
        justify-content: center;
        text-align: center;
    }
    
    .footer-bottom-content {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
    
    .footer-tech {
        flex-direction: column;
        gap: 10px;
    }
    
    .social-links {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .footer-container {
        padding: 0 15px;
    }
    
    .stats-grid {
        grid-template-columns: 1fr;
    }
    
    .tech-links {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
}



/* NOWY ZESZYT - NOWOCZESNA TEMPLATKA */

.nowy-zeszyt-container {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 50%, #f0f2f5 100%);
    min-height: 100vh;
}

/* KOMUNIKAT OD REDAKCJI */
.redakcja-komunikat {
    padding: 40px 20px;
    max-width: 1200px;
    margin: 0 auto;
}

.komunikat-wrapper {
    background: var(--color_white);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

.komunikat-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
}

.komunikat-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 25px 30px 20px 30px;
    background: rgba(233, 76, 61, 0.03);
    border-bottom: 1px solid rgba(112, 32, 31, 0.1);
}

.komunikat-header .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 24px;
}

.komunikat-header h2 {
    margin: 0;
    font-family: 'Bona Nova', serif;
    color: var(--color_accent6);
    font-size: 20px;
}

.komunikat-content {
    padding: 25px 30px;
    font-size: 16px;
    line-height: 1.7;
}

/* HERO SEKCJA */
.zeszyt-hero {
    position: relative;
    padding: 60px 20px;
    overflow: hidden;
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.hero-pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 25% 25%, rgba(233, 76, 61, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 75% 75%, rgba(255, 217, 51, 0.05) 0%, transparent 50%);
}

.hero-content {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

/* OKŁADKA */
.hero-cover {
    position: relative;
}

.cover-wrapper {
    position: relative;
    max-width: 400px;
    margin: 0 auto;
}

.cover-badge {
    position: absolute;
    top: -15px;
    right: -15px;
    background: linear-gradient(135deg, var(--color_accent1), var(--color_accent7));
    color: white;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    box-shadow: 0 4px 12px rgba(233, 76, 61, 0.4);
    z-index: 10;
    transform: rotate(10deg);
}

.badge-text {
    display: block;
    font-size: 11px;
    opacity: 0.9;
}

.badge-date {
    display: block;
    font-size: 13px;
    font-weight: 700;
}

.cover-image {
    width: 100%;
    aspect-ratio: 0.7;
    background-size: cover;
    background-position: center;
    border-radius: 12px;
    box-shadow: 
        0 20px 40px rgba(0,0,0,0.15),
        0 10px 20px rgba(0,0,0,0.1);
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.cover-image:hover {
    transform: translateY(-5px) rotateY(5deg);
}

.cover-shine {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(255,255,255,0.4), 
        transparent);
    transition: left 0.6s ease;
}

.cover-image:hover .cover-shine {
    left: 100%;
}

.cover-stats {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    gap: 15px;
}

.stat-item {
    text-align: center;
    flex: 1;
    background: rgba(255,255,255,0.8);
    padding: 12px 8px;
    border-radius: 8px;
    backdrop-filter: blur(10px);
}

.stat-item .material-icons-outlined {
    display: block;
    font-size: 20px;
    color: var(--color_accent1);
    margin-bottom: 4px;
}

.stat-number {
    display: block;
    font-weight: 700;
    color: var(--color_accent6);
    font-size: 14px;
}

.stat-label {
    display: block;
    font-size: 11px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* INFORMACJE O ZESZYCIE */
.hero-info {
    padding-left: 40px;
}

.zeszyt-title {
    font-family: 'Bona Nova', serif;
    font-size: 42px;
    font-weight: 700;
    color: var(--color_accent6);
    margin: 0 0 20px 0;
    line-height: 1.2;
}

.zeszyt-description {
    font-size: 18px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 40px;
}

/* GŁÓWNY CTA */
.cta-section {
    margin-bottom: 40px;
}

.main-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 15px;
    background: linear-gradient(135deg, var(--color_accent1), var(--color_accent7));
    color: white;
    text-decoration: none;
    padding: 18px 30px;
    border-radius: 50px;
    font-weight: 600;
    box-shadow: 
        0 8px 25px rgba(233, 76, 61, 0.3),
        0 4px 10px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
}

.main-cta-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.6s ease;
}

.main-cta-btn:hover::before {
    left: 100%;
}

.main-cta-btn:hover {
    transform: translateY(-3px);
    box-shadow: 
        0 12px 35px rgba(233, 76, 61, 0.4),
        0 8px 15px rgba(0,0,0,0.2);
    text-decoration: none;
    color: white;
}

.cta-icon {
    flex: 0 0 auto;
    width: 45px;
    height: 45px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cta-text {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.cta-main {
    font-size: 18px;
    font-weight: 700;
}

.cta-sub {
    font-size: 13px;
    opacity: 0.9;
}

.cta-arrow {
    flex: 0 0 auto;
    transition: transform 0.3s ease;
}

.main-cta-btn:hover .cta-arrow {
    transform: translateX(5px);
}

/* DODATKOWE AKCJE */
.secondary-actions {
    display: flex;
    gap: 15px;
}

.secondary-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: rgba(255,255,255,0.8);
    border: 1px solid rgba(112, 32, 31, 0.2);
    border-radius: 25px;
    text-decoration: none;
    color: var(--color_accent6);
    font-weight: 500;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.secondary-btn:hover {
    background: var(--color_accent2);
    border-color: var(--color_accent1);
    text-decoration: none;
    color: var(--color_accent7);
    transform: translateY(-1px);
}

/* WYRÓŻNIKI */
.highlights {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;
}

.highlight-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #666;
    font-size: 14px;
}

.highlight-item .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 18px;
}

/* SPIS TREŚCI */
.spis-tresci-section {
    padding: 80px 20px;
    background: white;
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease;
}

.spis-tresci-section.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.spis-container {
    max-width: 1000px;
    margin: 0 auto;
}

.spis-header {
    text-align: center;
    margin-bottom: 50px;
}

.spis-title {
    font-family: 'Bona Nova', serif;
    font-size: 32px;
    color: var(--color_accent6);
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.spis-title .material-icons-outlined {
    color: var(--color_accent1);
    font-size: 36px;
}

.spis-subtitle {
    font-size: 18px;
    color: #666;
    margin: 0;
}

.spis-content {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border: 1px solid rgba(112, 32, 31, 0.1);
    border-radius: 16px;
    padding: 40px;
    position: relative;
    overflow: hidden;
}

.spis-content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color_accent1), var(--color_accent3));
    border-radius: 16px 16px 0 0;
}

.content-wrapper {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 40px;
}

.spis-cta {
    text-align: center;
    padding-top: 30px;
    border-top: 1px solid rgba(112, 32, 31, 0.1);
}

.cta-encourage {
    font-size: 18px;
    color: var(--color_accent6);
    margin-bottom: 20px;
    font-weight: 500;
}

.repeat-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--color_accent1);
    color: white;
    text-decoration: none;
    padding: 15px 30px;
    border-radius: 25px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.repeat-cta-btn:hover {
    background: var(--color_accent7);
    transform: translateY(-2px);
    text-decoration: none;
    color: white;
}

/* NEWSLETTER */
.newsletter-section {
    padding: 60px 20px;
    background: linear-gradient(135deg, var(--color_accent6) 0%, #5a1b1a 100%);
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease 0.2s;
}

.newsletter-section.animate-in {
    opacity: 1;
    transform: translateY(0);
}

.newsletter-container {
    max-width: 800px;
    margin: 0 auto;
}

.newsletter-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: white;
    gap: 40px;
}

.newsletter-info h3 {
    font-family: 'Bona Nova', serif;
    font-size: 24px;
    margin-bottom: 10px;
}

.newsletter-info p {
    opacity: 0.9;
    margin: 0;
}

.newsletter-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,0.2);
    color: white;
    text-decoration: none;
    padding: 12px 24px;
    border-radius: 25px;
    border: 1px solid rgba(255,255,255,0.3);
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.newsletter-btn:hover {
    background: rgba(255,255,255,0.3);
    text-decoration: none;
    color: white;
    transform: translateY(-1px);
}

/* BRAK NUMERU */
.no-issue-section {
    padding: 100px 20px;
    text-align: center;
}

.no-issue-content {
    max-width: 500px;
    margin: 0 auto;
}

.no-issue-icon {
    font-size: 64px;
    color: var(--color_accent5);
    margin-bottom: 30px;
}

.no-issue-icon .material-icons-outlined {
    font-size: 64px;
}

.archive-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--color_accent1);
    color: white;
    text-decoration: none;
    padding: 15px 25px;
    border-radius: 25px;
    margin-top: 20px;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .hero-grid {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    
    .hero-info {
        padding-left: 0;
        order: -1;
    }
    
    .zeszyt-title {
        font-size: 32px;
    }
    
    .cover-wrapper {
        max-width: 280px;
    }
    
    .highlights {
        justify-content: center;
    }
    
    .secondary-actions {
        justify-content: center;
    }
    
    .newsletter-content {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }
    
    .spis-content {
        padding: 25px;
    }
}

@media (max-width: 480px) {
    .main-cta-btn {
        padding: 15px 25px;
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
    
    .secondary-actions {
        flex-direction: column;
    }
    
    .highlights {
        flex-direction: column;
        align-items: center;
    }
    
    .cover-stats {
        flex-direction: column;
        gap: 10px;
    }
    
    .komunikat-header,
    .komunikat-content {
        padding: 20px;
    }
}


/* HACK na PRZYPISY do lewej */

/* Targeting całego akapitu zawierającego przypis */
p:has(a[href^="#_ftnref"]) {
    text-align: left !important;
}

/* Usunięcie problematycznego kodu powodującego nowe linie */
p a[href^="#_ftnref"],
p a[name^="_ftn"] {
    text-align: left !important;
}

