.s3-search-modal{--s3-primary:var(--e-global-color-primary,   #0054CD);--s3-secondary:var(--e-global-color-secondary, #01214E);--s3-light-text:var(--e-global-color-3b317d9,   #F0F4F7);--s3-light-border:var(--e-global-color-8210c03,   #E6EEFA);--s3-accent:var(--e-global-color-accent,    #FF9900);position:fixed;inset:0;z-index:99999}.s3-search-modal[hidden]{display:none}html,body{overflow-x:hidden}.cpel-switcher__icon.fa-caret-down{display:inline-block;width:8px;height:8px;margin-left:4px;vertical-align:middle;background-color:currentColor;clip-path:polygon(100% 0,0 0,50% 100%)}.cpel-switcher__icon.fa-caret-down::before{content:""!important}.elementor-widget-theme-post-title .elementor-heading-title a:hover,.elementor-widget-theme-post-title .elementor-heading-title a:focus{text-decoration:underline!important}a.kafel-link:hover .elementor-widget-theme-post-title .elementor-heading-title,a.kafel-link:hover .elementor-widget-heading .elementor-heading-title{text-decoration:underline!important}.tytul-link:hover>div>a{text-decoration:underline!important;text-decoration-color:var(--e-global-color-accent);color:var(--e-global-color-accent)}a.kafel-link:hover #f7809d0 .elementor-heading-title{text-decoration:underline!important}.s3-search-modal__backdrop{position:absolute;inset:0;background:rgb(1 33 78 / .75)}.s3-search-modal__box{position:relative;max-width:680px;margin:14vh auto 0;padding:0 16px}.s3-search-modal__form{display:flex;align-items:stretch;background:var(--s3-light-text);border:1px solid var(--s3-secondary);box-shadow:0 14px 44px rgb(1 33 78 / .4)}.s3-search-modal__form button{background:var(--e-global-color-v4-s3_surface_page)!important}.s3-search-modal__form input[type=search]{flex:1;min-width:0;border:0;padding:14px 18px;font-size:17px;background:#fff0;color:var(--s3-secondary);outline:none;transition:box-shadow .15s ease}.s3-search-modal__form input[type=search]::placeholder{color:var(--s3-secondary);opacity:.5}.s3-search-modal__form input[type=search]:focus{box-shadow:inset 0 -2px 0 var(--s3-primary)}.s3-search-modal__form button{border:0;border-left:1px solid var(--s3-light-border);background:var(--s3-light-border);padding:0 22px;cursor:pointer;display:flex;align-items:center;transition:background .15s ease}.s3-search-modal__form button:hover,.s3-search-modal__form button:focus{background:var(--s3-primary)}.s3-search-modal__form button:hover img,.s3-search-modal__form button:focus img{filter:brightness(0) invert(1)}.s3-search-modal__form button:focus-visible{outline:2px solid var(--s3-secondary);outline-offset:-2px}.s3-search-modal__form button:active{background:var(--s3-secondary)}body.s3-search-open{overflow:hidden}.e-n-tab-title[aria-selected="true"] .e-n-tab-title-text,.galeria-foto .e-n-tab-title-text:hover{font-weight:700!important}.karta-pliki .elementor-cta:hover .elementor-cta__content{background-color:var(--e-global-color-v4-s3_surface_sufrace_soft_blue)!important}.karta-pliki .elementor-cta:hover .elementor-cta__title{color:var(--e-global-color-v4-s3_brand_blue)!important}.karta-pliki .elementor-cta:hover .elementor-cta__button{color:var(--e-global-color-v4-s3_brand_blue)!important;border-color:var(--e-global-color-v4-s3_brand_blue)!important;background-color:var(--e-global-color-v4-s3_surface_sufrace_white)!important}:is(.btn-std,.btn-alt,.btn-thr,.btn-wht,.nagrania-last){--arrow-light:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%23E6EEFA" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%23E6EEFA" stroke-width="1.5"/></svg>');
    --arrow-primary: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>');
    --arrow-bright: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%23F0F4F7" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%23F0F4F7" stroke-width="1.5"/></svg>');
}


/* ==========================================================================
   2. TOKENY WARIANTÓW — wyłącznie kolorystyka
   ========================================================================== */

/* 2.1 .btn-std — przezroczyste tło -> ciemne tło na hover */
.btn-std {
    --btn-bg: transparent;
    --btn-border: var(--e-global-color-8210c03);
    --btn-text: var(--e-global-color-8210c03);
    --btn-arrow: var(--arrow-light);

    --btn-hover-bg: var(--e-global-color-secondary);
    --btn-hover-border: var(--e-global-color-primary);
    --btn-hover-text: var(--e-global-color-3b317d9);
    --btn-hover-arrow: var(--arrow-bright);
}

/* 2.2 .btn-alt — przezroczyste tło -> niebieskie tło na hover */
.btn-alt {
    --btn-bg: transparent;
    --btn-border: var(--e-global-color-primary);
    --btn-text: var(--e-global-color-primary);
    --btn-arrow: var(--arrow-primary);

    --btn-hover-bg: var(--e-global-color-primary);
    --btn-hover-border: var(--e-global-color-8210c03);
    --btn-hover-text: var(--e-global-color-8210c03);
    --btn-hover-arrow: var(--arrow-light);
}

/* 2.3 .btn-thr — niebieskie tło + ciemna ramka -> akcent na hover */
.btn-thr {
    --btn-bg: var(--e-global-color-primary);
    --btn-border: var(--e-global-color-secondary);
    --btn-text: var(--e-global-color-3b317d9);
    --btn-arrow: var(--arrow-light);

    --btn-hover-bg: var(--e-global-color-accent);
    --btn-hover-border: var(--e-global-color-primary);
    --btn-hover-text: var(--e-global-color-primary);
    --btn-hover-arrow: var(--arrow-primary);
}

/* 2.4 .btn-wht — białe tło + niebieska ramka -> niebieskie tło na hover */
.btn-wht {
    --btn-bg: #FFFFFF;
    --btn-border: var(--e-global-color-primary);
    --btn-text: var(--e-global-color-primary);
    --btn-arrow: var(--arrow-primary);

    --btn-hover-bg: var(--e-global-color-accent);
    --btn-hover-border: var(--e-global-color-primary);
    --btn-hover-text: var(--e-global-color-primary);
    --btn-hover-arrow: var(--arrow-primary);
}


/* ==========================================================================
   3. WSPÓLNA STRUKTURA — .btn-std / .btn-alt / .btn-thr / .btn-wht
   ========================================================================== */
:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button {
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button-content-wrapper {
    display: flex !important;
    align-items: center;
    width: 100%;
    gap: 0 !important;
    background-color: var(--btn-bg);
    transition: background-color 0.3s ease;
}

:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button-text {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 12px 16px;
    height: 45px;
    box-sizing: border-box;
    border: 1px solid var(--btn-border);
    color: var(--btn-text);
    background-color: transparent;
    transition: all 0.3s ease;
}

:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button-content-wrapper::after {
    content: '';
    display: flex;
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 45px;
    flex-shrink: 0;
    box-sizing: border-box;
    border-top: 1px solid var(--btn-border);
    border-right: 1px solid var(--btn-border);
    border-bottom: 1px solid var(--btn-border);
    background-color: transparent;
    background-image: var(--btn-arrow);
    background-repeat: no-repeat;
    background-position: center;
    transition: all 0.3s ease;
}

/* Stany hover / focus — wspólne dla wszystkich wariantów */
:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button:hover .elementor-button-content-wrapper,
:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button:focus .elementor-button-content-wrapper {
    background-color: var(--btn-hover-bg);
}

:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button:hover .elementor-button-text,
:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button:focus .elementor-button-text {
    border-color: var(--btn-hover-border);
    color: var(--btn-hover-text);
}

:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button:hover .elementor-button-content-wrapper::after,
:is(.btn-std, .btn-alt, .btn-thr, .btn-wht) .elementor-button:focus .elementor-button-content-wrapper::after {
    border-top-color: var(--btn-hover-border);
    border-right-color: var(--btn-hover-border);
    border-bottom-color: var(--btn-hover-border);
    background-image: var(--btn-hover-arrow);
}


/* ==========================================================================
   4. Przycisk .btn — generyczny układ tekst + ikona Elementora
   ========================================================================== */

/* Reset paddingu oraz przekazanie koloru ramki z Elementora do wewnątrz */
.btn .elementor-button {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.btn .elementor-button-content-wrapper {
    border-color: inherit; /* Wymusza przekazanie koloru ramki buttona do dzieci */
}

.btn .elementor-button-text {
    padding: 12px 0;
}

/* Sekcja ikony — pobiera kolor ramki bezpośrednio z rodzica */
.btn .elementor-button-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 55px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    border-left: 1px solid !important;
    border-left-color: inherit !important;
}

/* Skalowanie SVG i czyszczenie sztywnego koloru ze stylu inline SVG */
.btn .elementor-button-icon svg {
    width: 24px !important;
    height: 12px !important;
}

.btn .elementor-button-icon svg path {
    stroke: currentColor !important;
}


/* ==========================================================================
   5. CTA na pełną szerokość — .btn-thr / .nagrania-last
   ========================================================================== */

/* 5.1 Usunięcie podkreślenia tekstu w całym kontenerze */
.nagrania-last a,
.nagrania-last .elementor-cta__title,
.nagrania-last .elementor-cta__button,
.nagrania-last:hover a,
.nagrania-last:hover .elementor-cta__title,
.nagrania-last:hover .elementor-cta__button {
    text-decoration: none !important;
}

/* 5.2 Rozciągnięcie wrappera przycisku */
.nagrania-last .elementor-cta__button-wrapper,
.btn-thr .elementor-cta__button-wrapper {
    width: 100% !important;
    display: block !important;
}

/* 5.3 Główny korpus przycisku (100% szerokości) */
.nagrania-last .elementor-cta__button,
.btn-thr .elementor-cta__button {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    height: 45px !important;
    padding: 0 16px !important;
    padding-right: calc(55px + 16px) !important; /* Rezerwacja miejsca na boks ze strzałką */
    box-sizing: border-box !important;
    border: 1px solid var(--e-global-color-secondary) !important;
    background-color: var(--e-global-color-primary) !important;
    color: var(--e-global-color-3b317d9) !important;
    border-radius: 0 !important;
    transition: all 0.3s ease !important;
}

/* 5.4 Boks ze strzałką dołączony do prawej krawędzi */
.nagrania-last .elementor-cta__button::after,
.btn-thr .elementor-cta__button::after {
    content: '' !important;
    position: absolute !important;
    top: -1px !important;
    right: -1px !important;
    width: 55px !important;
    height: 45px !important;
    box-sizing: border-box !important;
    border: 1px solid var(--e-global-color-secondary) !important;
    background-color: transparent !important;
    background-image: var(--arrow-light) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    transition: all 0.3s ease !important;
}

/* 5.5 Efekt hover / focus */
.btn-thr:hover .elementor-cta__button,
.nagrania-last:hover .elementor-cta__button,
.btn-thr .elementor-cta__button:hover {
    background-color: var(--e-global-color-accent) !important;
    border-color: var(--e-global-color-primary) !important;
    color: var(--e-global-color-primary) !important;
}

.btn-thr:hover .elementor-cta__button::after,
.nagrania-last:hover .elementor-cta__button::after,
.btn-thr .elementor-cta__button:hover::after {
    border-color: var(--e-global-color-primary) !important;
    background-image: var(--arrow-primary) !important;
}

.mark-blue mark {
	color:var(--e-global-color-primary);
	background-color:transparent;
}

.okladka-post img {
    height: auto;
    aspect-ratio: 671 / 462;
}

.proxima-archivo .elementor-post-info > li:first-child .elementor-post-info__item--type-author {
    font-family: var(--e-global-typography-primary-font-family), sans-serif !important;
	font-size:14px !important}

.proxima-archivo .elementor-post-info {
    display: flex !important;
    align-items: center !important;
}
/* ==========================================================================
   6. Przyciski submit (.e-form-submit-button-base)
      Warianty: .btn-std (jasne tło, niebieskie detale)
                .btn-scd (tło primary #0054CD, navy jako ramka)
                .btn-frt (jak .btn-scd, ale na białym tle — navy hover)
   ========================================================================== */

:root {
    --arrow-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='14' viewBox='0 0 24 14' fill='none'><path d='M0 7H23' stroke='black' stroke-width='1.5'/><path d='M16 1L22 7L16 13' stroke='black' stroke-width='1.5'/></svg>");
}

/* 6.0 Tokeny wariantów — separator, strzałka + kolory hover całego przycisku */
.elementor .e-form-submit-button-base.btn-std {
    --submit-sep: var(--S3_Brand_Blue, var(--e-global-color-primary));
    --submit-arrow: var(--S3_Brand_Blue, var(--e-global-color-primary));
    --submit-sep-hover: var(--btn-hover-border);
    --submit-arrow-hover: var(--btn-hover-text);
    --submit-bg-hover: var(--btn-hover-bg);            /* #01214E */
    --submit-border-hover: var(--btn-hover-border);    /* #0054CD */
    --submit-text-hover: var(--btn-hover-text);        /* #F0F4F7 */
}

.elementor .e-form-submit-button-base.btn-scd {
    --submit-sep: var(--e-global-color-secondary);   /* ciemny navy #01214E */
    --submit-arrow: var(--e-global-color-3b317d9);   /* jasna strzałka na niebieskim tle */
    --submit-sep-hover: var(--e-global-color-secondary);
    --submit-arrow-hover: var(--e-global-color-primary);
    --submit-bg-hover: var(--e-global-color-accent);
    --submit-border-hover: var(--e-global-color-primary);
    --submit-text-hover: var(--e-global-color-primary);
}

.elementor .e-form-submit-button-base.btn-frt {
    /* baza jak .btn-scd — kontrast liczy się względem tła przycisku */
    --submit-sep: var(--e-global-color-3b317d9);
    --submit-arrow: var(--e-global-color-3b317d9);
    --submit-sep-hover: var(--e-global-color-secondary);
    --submit-arrow-hover: var(--e-global-color-3b317d9);
    /* hover pod białe tło: navy zamiast akcentu, jasny tekst i strzałka */
    --submit-bg-hover: var(--e-global-color-secondary);
    --submit-border-hover: var(--e-global-color-primary);
    --submit-text-hover: var(--e-global-color-3b317d9);
}

/* 6.1 Geometria — wspólna dla wszystkich wariantów */
.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt) {
    position: relative !important;
    min-height: 45px !important;
    padding-inline-end: calc(55px + 16px) !important;
    box-sizing: border-box !important;
    transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
}

/* 6.2 SEPARATOR — kolor z tokena wariantu */
.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt)::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 55px !important;
    width: 1px !important;
    border-left: 1px solid transparent !important;
    box-sizing: content-box !important;
    background-color: var(--submit-sep) !important;
    background-clip: content-box !important;
    transition: background-color 0.3s ease;
}

/* 6.3 STRZAŁKA — kolor z tokena wariantu */
.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt)::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    width: 55px !important;
    background-color: var(--submit-arrow);
    -webkit-mask-image: var(--arrow-mask);
    mask-image: var(--arrow-mask);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 24px 14px;
    mask-size: 24px 14px;
    transition: background-color 0.3s ease;
}

/* 6.4 Hover / focus — nadpisuje domyślny #323232 z base-desktop.css */
.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt):hover,
.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt):focus-visible {
    background-color: var(--submit-bg-hover) !important;
    border-color: var(--submit-border-hover) !important;
    color: var(--submit-text-hover) !important;
}

.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt):hover::before,
.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt):focus-visible::before {
    background-color: var(--submit-sep-hover) !important;
}

.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt):hover::after,
.elementor .e-form-submit-button-base:is(.btn-std, .btn-scd, .btn-frt):focus-visible::after {
    background-color: var(--submit-arrow-hover);
}

/* ==========================================================
   Widoczność elementów Loop Item według WordPress post type
   Elementy otrzymują klasy:
   show-cpt show-cpt--{slug-post-type}
   ========================================================== */

/* Każdy wariant jest domyślnie ukryty */
.e-loop-item .show-cpt {
    display: none !important;
}

/* Zwykłe wpisy WP */
.e-loop-item.type-post .show-cpt--post {
    display: flex !important;
}

/* CPT: Podcast */
.e-loop-item.type-podcast .show-cpt--podcast {
    display: flex !important;
}

/* CPT: Wideo */
.e-loop-item.type-video .show-cpt--video {
    display: flex !important;
}

/* CPT: Aktualności */
.e-loop-item.type-aktualnosci .show-cpt--aktualnosci {
    display: flex !important;
}

/* CPT: E-learning */
.e-loop-item.type-e-learning .show-cpt--elearning {
    display: flex !important;
}

/* CPT: Wiedza */
.e-loop-item.type-wiedza .show-cpt--wiedza {
    display: flex !important;
}

/* ikona play pod wideo */
/* Płynne przejście dla ikony SVG */
.aftermovie .play-arrow .elementor-icon svg {
  transition: filter 0.3s ease, transform 0.3s ease;
}

/* Efekt poświaty po najechaniu na kontener nadrzędny .aftermovie */
.aftermovie:hover .play-arrow .elementor-icon svg {
  filter: drop-shadow(0px 4px 15px rgba(0, 233, 165, 0.7)) 
          drop-shadow(0px 0px 25px rgba(0, 233, 165, 0.4));
}


/* Efekt aktywnego tła dla drugiego slajdu tylko na tabletach i komputerach */
/* Rozciągnięcie elementów na całe pole siatki i wyśrodkowanie ikony wewnątrz */
.elementor-element-eb25f09 > * {
    justify-self: stretch;
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Obramowanie na krawędziach komórek siatki */
.sluchaj > *:not(:last-child) {
    border-right: 1px solid var(--e-global-color-v4-s3_brand_blue);
}

/* 1. Usunięcie podkreślenia dla wszystkich linków i tekstów w karuzeli (również na hover) */
.elementor-element-77f3d7b a,
.elementor-element-77f3d7b a:hover,
.elementor-element-77f3d7b .elementor-cta__content-item {
    text-decoration: none !important;
}

/* 2. Style aktywne (hover) wymuszone na stałe dla drugiego slajdu (.swiper-slide-next) */
@media (min-width: 768px) {
    /* Jasność i kontrast tła */
    .karuzela-home .swiper-slide-next .elementor-cta .elementor-cta__bg {
        filter: brightness(100%) contrast(100%) saturate(100%) blur(0px) hue-rotate(0deg) !important;
    }

    /* Przezroczystość nakładki tła */
    .karuzela-home .swiper-slide-next .elementor-cta .elementor-cta__bg-overlay {
        opacity: 0 !important;
    }

    /* Zmiana koloru opisu na akcentowy zielony/miętowy */
    .karuzela-home .swiper-slide-next .elementor-cta__description {
        color: var(--e-global-color-v4-s3_surface_accent_mint) !important;
    }
}

/* wymuszone dla pierwszego slajdu w mobile (.swiper-slide-next) */
@media (max-width: 768px) {
    /* Jasność i kontrast tła */
    .karuzela-home .swiper-slide-active .elementor-cta .elementor-cta__bg {
        filter: brightness(100%) contrast(100%) saturate(100%) blur(0px) hue-rotate(0deg) !important;
    }

    /* Przezroczystość nakładki tła */
    .karuzela-home .swiper-slide-active .elementor-cta .elementor-cta__bg-overlay {
        opacity: 0 !important;
    }

    /* Zmiana koloru opisu na akcentowy zielony/miętowy */
    .karuzela-home .swiper-slide-active .elementor-cta__description {
        color: var(--e-global-color-v4-s3_surface_accent_mint) !important;
    }
}
:root {
  /* Viewport-aware horizontal page margins */
  --s3-page-gutter: clamp(1.25rem, calc(1.88vw + 0.8125rem), 2.5rem);

 /* Global maximum width of the Figma-based Home canvas */
	--s3-page-canvas: 90rem; /* 1440px */
	--s3-container-wide: 85rem; /* 1360px */
	--s3-container-content: 78rem; /* 1248px */

  /* Fluid spacing scale */
  --s3-space-3xs: clamp(0.25rem, calc(0.38vw + 0.16rem), 0.5rem);
  --s3-space-2xs: clamp(0.5rem, calc(0.38vw + 0.41rem), 0.75rem);
  --s3-space-xs: clamp(0.75rem, calc(0.75vw + 0.57rem), 1.25rem);
  --s3-space-sm: clamp(1rem, calc(1.5vw + 0.65rem), 2rem);
  --s3-space-md: clamp(1.25rem, calc(1.88vw + 0.81rem), 2.5rem);
  --s3-space-lg: clamp(2rem, calc(3vw + 1.30rem), 4rem);
  --s3-space-xl: clamp(3rem, calc(4.5vw + 1.94rem), 6rem);
  --s3-space-2xl: clamp(4rem, calc(5.25vw + 2.77rem), 7.5rem);
}

mark {
    background-color: transparent;
    color: inherit;
}

/* ==========================================================================
   Sektor 3.0 — Karuzela harmonogramu (.os-czasu): bleed do prawej krawędzi
   ekranu, ODPORNY na klasę "e-widget-swiper" dodawaną przez Elementor
   dopiero PO pełnej inicjalizacji Swipera (ta klasa aktywuje natywną
   regułę ".e-con .elementor-widget.e-widget-swiper { width: 100%; }",
   która wcześniej kasowała efekt wystawania — stąd "poprawnie podczas
   ładowania, ucięte po pełnym załadowaniu").

   Zamiast ujemnego margin-right na elemencie z width:auto (niejednoznaczne
   w kontenerze flex), width jest tu wyliczana WPROST wzorem:
   100% (normalna szerokość, jak reszta treści) + połowa różnicy
   między viewportem a kontenerem = prawa krawędź dokładnie na krawędzi
   ekranu. Jawna wartość z !important wygrywa z każdą regułą width
   bez !important, niezależnie od tego, kiedy się pojawi w DOM.
   ========================================================================== */

.os-czasu {
    width: calc(100% + (100vw - 100%) / 2) !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    align-self: flex-start !important;
    margin-right: 0 !important;
    overflow: visible !important;
}

.os-czasu .e-n-carousel {
    width: 100% !important;
}

.os-czasu .e-n-carousel,
.os-czasu .swiper-wrapper {
    mask-image: none !important;
    -webkit-mask-image: none !important;
}

.os-czasu .e-n-carousel::after,
.os-czasu .e-n-carousel::before {
    content: none !important;
    display: none !important;
}

.os-czasu .swiper-slide {
    width: var(--os-czasu-slide-w, 317px) !important;
}

.os-czasu .elementor-swiper-button {
    z-index: 2;
}

/* ==========================================================================
   Sektor 3.0 — Cytat (Elementor Blockquote Widget)
   ========================================================================== */

/* 1. Reset i czyszczenie kontenera cytatu Elementora */
.elementor-widget-blockquote .elementor-blockquote {
    position: relative;
    margin: 0;
    padding: 0;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}


/* 2. Ikona cudzysłowu SVG (31x32px) z Figmy + odstęp 40px */
.elementor-blockquote--skin-quotation .elementor-blockquote:before {content: '' !important}
.elementor-widget-blockquote .elementor-blockquote::before {
    content: '';
    display: block;
    width: 31px;
    height: 32px;
    margin-bottom: 40px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="31" height="32" viewBox="0 0 31 32" fill="none"><path d="M17.3436 32V18.3448L23.8987 0H31L25.5374 17.1034H31V32H17.3436ZM0 32V18.3448L6.55507 0H13.6564L8.19383 17.1034H13.6564V32H0Z" fill="%230054CD"/></svg>');
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
}

/* 3. Treść cytatu (Proxima Nova 22px, line-height 125%, #1C1C1C) + odstęp 40px */
.elementor-widget-blockquote .elementor-blockquote__content {
    margin: 0 0 40px 0 !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 22px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    color: #1C1C1C !important;
}

/* 4. Układ stopki (Autor + Afiliacja w osobnych wierszach, gap 8px) */
.elementor-widget-blockquote .e-q-footer {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 5. Imię i nazwisko (Archivo Narrow 16px, uppercase, 0.05em spacing) */
.elementor-widget-blockquote .elementor-blockquote__author {
    font-family: 'Archivo Narrow', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 22px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

/* 6. Usunięcie domyślnych styli przycisku Tweet ze stopki */
.elementor-blockquote__tweet-button {
	align-self: unset !important;}
.elementor-widget-blockquote .elementor-blockquote__tweet-button {
    display: inline-block !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    color: var(--e-global-color-primary, #0054CD) !important;
    text-decoration: none !important;
}

.elementor-widget-blockquote .elementor-blockquote__tweet-button i,
.elementor-widget-blockquote .elementor-blockquote__tweet-button svg {
    display: none !important; /* Ukrywa ewentualną ikonę Twittera */
}

/* 7. Afiliacja / Nazwa organizacji (Proxima Nova 16px, line-height 19px) */
.elementor-widget-blockquote .elementor-blockquote__tweet-label {
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 19px !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}


/* 3. Treść cytatu bez zmian — wolna przestrzeń rozpycha się NAD autorem,
      dociskając meta do dolnej krawędzi karty */
.grid-cytaty .elementor-testimonial-wrapper {
    
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-wrap: nowrap;
    height: 100%;

}


/* ==========================================================
   Sektor 3.0 — Header / Mega Menu
   ETAP 1: stabilna struktura i przełączanie paneli
   ========================================================== */

:root {
    --s3-header-height: 5.5rem; /* 88px */
    --s3-header-height-shrink: 3.5rem; /* 56px */
    --s3-header-gutter: 2.5rem; /* 40px */
    --s3-header-content: 90rem; /* 1440px (wcześniej: 85rem / 1360px) */
    --s3-mega-content: 77.5rem; /* 1240px */
    --s3-transition: 220ms cubic-bezier(.2, .8, .2, 1);
}





/* ==========================================================
   Header
   ========================================================== */

/* Elementor ustawia position: fixed podczas sticky.
   Nie wymuszamy position: sticky, bo walczyłoby to z inline style Elementora. */

.s3-header {
    z-index: 1000;
    width: 100%;
    background-color: var(--e-global-color-315b4c2, #FFFFFF);
    transition:
        background-color var(--s3-transition),
        box-shadow var(--s3-transition),
        min-height var(--s3-transition);
}

/* Elementor dodaje tę klasę, gdy header jest przyklejony */

.s3-header.elementor-sticky--active {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    inset-inline-start: 0 !important;
}

.s3-header.is-scrolled {
    box-shadow: 0 0.25rem 1.5rem rgba(1, 33, 78, 0.08);
}

/* Reset Elementor widget spacing wyłącznie w headerze */

.s3-header .elementor-widget:not(:last-child) {
    margin-bottom: 0 !important;
}

/* Trzy kolumny: logo | menu | tools */

.elementor-element.s3-header-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    width: min(100%, var(--s3-header-content)) !important;
    min-height: var(--s3-header-height) !important;
    margin-inline: auto !important;
    padding: 1rem var(--s3-header-gutter) !important;
    box-sizing: border-box;
    column-gap: 1rem;
    transition:
        min-height var(--s3-transition),
        padding var(--s3-transition);
}

/* Standardowy header: 88px */

/* Stan normalny */

.s3-header-inner {
    min-height: var(--s3-header-height) !important;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    transition:
        min-height var(--s3-transition),
        padding var(--s3-transition);
}

.s3-header-logo--default {
    width: 4.0625rem !important; /* 65px */
    min-width: 4.0625rem;
    max-width: 4.0625rem;
	height: 3.5rem !important;     /* 56px */
    transition:
        width var(--s3-transition),
        min-width var(--s3-transition),
        max-width var(--s3-transition);
}

/* Stan po przewinięciu ponad 24px */

.s3-header.is-scrolled .s3-header-inner {
    min-height: var(--s3-header-height-shrink) !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

.s3-header.is-scrolled .s3-header-logo--default {
    width: 2.375rem !important; /* 38px */
    min-width: 2.375rem;
    max-width: 2.375rem;
}

.is-scrolled .s3-header-logo {
	height: 2rem !important;
}

/* Strefa brand */

.s3-header-brand {
    grid-column: 1;
    justify-self: start;
    display: flex !important;
    align-items: center !important;
    width: auto !important;
    min-width: 0;
}

/* Strefa nav */

.s3-header-nav {
    grid-column: 2;
    justify-self: center;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: max-content;
    gap: 2rem; /* 32px */
}

/* Strefa tools */

.s3-header-tools {
    grid-column: 3;
    justify-self: end;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: max-content;
    gap: 0.625rem; /* 10px */
    white-space: nowrap;
}

/* Logo */

.s3-header-logo {
    flex: 0 0 auto !important;
    display: block;
    width: 4.0625rem !important; /* 65px */
    min-width: 4.0625rem;
    max-width: 4.0625rem;
	height: 3.5rem !important;     /* 56px */
    transition:
        width var(--s3-transition),
        min-width var(--s3-transition),
        max-width var(--s3-transition);
}

.s3-header-logo img {
    display: block;
    width: 100%;
    height: auto;
	object-fit: contain;
}

.s3-header.is-scrolled .s3-header-logo--default {
    width: 2.375rem !important; /* 38px */
    min-width: 2.375rem;
    max-width: 2.375rem;
	height: 2rem !important;
}

/* Linki menu */

.s3-menu-trigger {
    width: auto !important;
}

.s3-menu-trigger .elementor-heading-title,
.s3-menu-trigger a {
    margin: 0;
}

.s3-menu-trigger a {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border-bottom: 1px solid transparent;
    color: var(--e-global-color-primary);
    font-family: var(--e-global-typography-1673dd6-font-family, "Archivo Narrow"), sans-serif;
    font-size: 1.125rem !important; /* 18px */
    font-weight: 400;
    line-height: 1.3529; /* 23px */
    letter-spacing: 0.05em;
    text-decoration: none !important;
    text-transform: uppercase;
    white-space: nowrap;
    transition:
        color 180ms ease,
        border-color 180ms ease;
}

.s3-menu-trigger a:hover,
.s3-menu-trigger a:focus-visible,
.s3-menu-trigger.is-active a {
    border-bottom-color: currentColor;
    color: var(--e-global-color-primary);
    outline: none;
}

/* ==========================================================
   Language Switcher
   ========================================================== */

.s3-language-switcher {
    display: block !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    flex: 0 0 auto !important;
}

.s3-language-switcher .elementor-widget-container,
.s3-language-switcher .cpel-switcher__nav {
    display: block !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
}

.s3-language-switcher .cpel-switcher__list {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    width: max-content !important;
    min-width: max-content !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    list-style: none !important;
    white-space: nowrap !important;
}

.s3-language-switcher .cpel-switcher__lang {
    display: block !important;
    width: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.s3-language-switcher .cpel-switcher__lang + .cpel-switcher__lang::before {
    display: inline-block;
    margin-inline: 0.75rem;
    color: var(--e-global-color-primary);
    content: "|";
    font-family: var(--e-global-typography-accent-font-family, "Archivo Narrow"), sans-serif;
    font-size: 0.8125rem;
    line-height: 1;
}

.s3-language-switcher .cpel-switcher__lang a {
    display: inline-block !important;
    color: var(--e-global-color-primary);
    font-family: var(--e-global-typography-accent-font-family, "Archivo Narrow"), sans-serif;
    font-size: 0.8125rem; /* 13px */
    font-weight: 400;
    line-height: 1.3846;
    letter-spacing: 0.05em;
    text-decoration: none !important;
    text-transform: uppercase;
    white-space: nowrap;
}

.s3-language-switcher .cpel-switcher__lang--active a {
    color: var(--e-global-color-secondary);
}

/* Ikona wyszukiwania */

.s3-search-trigger {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center;
    justify-content: center;
    width: 2rem !important;
    min-width: 2rem;
    height: 2rem;
}

.s3-search-trigger .elementor-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--e-global-color-primary);
}

.s3-search-trigger svg {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
}

/* ==========================================================
   Fullscreen Mega Menu
   ========================================================== */

.s3-mega-menu {
    position: fixed !important;
    inset: 0;
    z-index: 1100;
    display: block !important;
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto;
    visibility: hidden;
    background-color: var(--e-global-color-secondary, #01214E) !important;
    opacity: 0;
    pointer-events: none;
    transition:
        visibility 0s linear 240ms,
        opacity 240ms ease;
}

.s3-header.is-menu-open .s3-mega-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition:
        visibility 0s linear 0s,
        opacity 240ms ease;
}

.s3-mega-menu .elementor-widget:not(:last-child) {
    margin-bottom: 0 !important;
}

/* Wspólny wrapper: 1240px */

.s3-mega-menu__inner {
    display: flex !important;
    flex-direction: column !important;
    width: min(100%, var(--s3-mega-content)) !important;
    min-height: 100dvh;
    margin-inline: auto !important;
    padding: 2rem 0 5.625rem !important; /* 32px 0 90px */
    box-sizing: border-box;
    gap: 1rem; /* 16px */
}

/* Belka overlay */

.s3-mega-menu__bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 5.5rem; /* 88px */
    padding: 1rem 2.5rem !important;
    box-sizing: border-box;
    column-gap: 1rem;
}

.s3-mega-menu__brand {
    grid-column: 1;
    justify-self: start;
    display: flex !important;
    align-items: center;
    width: auto !important;
}

.s3-mega-menu__nav {
    grid-column: 2;
    justify-self: center;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    min-width: max-content;
    gap: 2rem;
}

.s3-mega-menu__tools {
    grid-column: 3;
    justify-self: end;
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    width: auto !important;
    min-width: max-content;
    gap: 0.625rem;
}

.s3-mega-menu .s3-menu-trigger a {
    color: var(--e-global-color-3b317d9, #F0F4F7);
}

.s3-mega-menu .s3-menu-trigger a:hover,
.s3-mega-menu .s3-menu-trigger a:focus-visible,
.s3-mega-menu .s3-menu-trigger.is-active a {
    border-bottom-color: var(--e-global-color-accent);
    color: var(--e-global-color-accent);
}

.s3-mega-menu .s3-language-switcher .cpel-switcher__lang a,
.s3-mega-menu .s3-language-switcher .cpel-switcher__lang + .cpel-switcher__lang::before,
.s3-mega-menu .s3-search-trigger .elementor-icon {
    color: var(--e-global-color-3b317d9, #F0F4F7);
}

/* X */

.s3-mega-menu__close-row {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 1rem;
    padding: 0 2.5rem !important;
    box-sizing: border-box;
}

.s3-menu-close {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 2.8125rem !important; /* SVG ma frame 45 × 44 */
    height: 2.75rem;
    cursor: pointer;
}

.s3-menu-close .elementor-icon,
.s3-menu-close a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.s3-menu-close svg {
    display: block;
    width: 2.8125rem;
    height: 2.75rem;
}

/* ==========================================================
   Panele: tylko jeden widoczny naraz
   ========================================================== */

.s3-mega-menu__body {
    display: block !important;
    width: 100%;
    flex: 1;
}

.s3-menu-panel {
    display: none !important;
    width: 100%;
}

.s3-header.is-panel-participate .s3-menu-panel--participate,
.s3-header.is-panel-knowledge .s3-menu-panel--knowledge {
    display: flex !important;   /* ZAMIAST: display: block !important; */
}

/* Panel: 100% szerokości, dzieci wyśrodkowane */

.s3-header.is-panel-about .s3-menu-panel--about {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Karty w tym panelu: sztywne 25%, bez rozrastania */

.s3-header.is-panel-about .s3-menu-panel--about .s3-menu-card {
    flex: 0 1 25% !important;
    width: 25% !important;
    max-width: 25% !important;
}
/* ==========================================================
   Dostępność i admin bar
   ========================================================== */

html.s3-menu-scroll-lock,
html.s3-menu-scroll-lock body {
    overflow: hidden;
}

.s3-header a:focus-visible,
.s3-mega-menu a:focus-visible {
    outline: 2px solid var(--e-global-color-accent);
    outline-offset: 0.25rem;
}


/* ==========================================================
   Tablet / Mobile
   ========================================================== */

@media (max-width: 767px) {
    :root {
        --s3-header-gutter: 1.25rem; /* 20px */
    }

    .s3-header-inner {
        grid-template-columns: auto auto !important;
        justify-content: space-between;
        padding-inline: var(--s3-header-gutter) !important;
    }

    .s3-header-nav {
        display: none !important;
    }

    .s3-mega-menu__inner {
        padding-top: 0 !important;
        padding-bottom: 2rem !important;
    }

    .s3-mega-menu__bar {
        grid-template-columns: auto auto !important;
        padding-inline: 1.25rem !important;
    }

    .s3-mega-menu__nav {
        display: none !important;
    }

    .s3-mega-menu__close-row {
        padding-inline: 1.25rem !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .s3-header,
    .s3-header *,
    .s3-mega-menu {
        transition: none !important;
    }
}

/* ==========================================================
   Hover: linki w kartach menu
   ========================================================== */

:root {
    --s3-hover-transition: color 160ms ease, background-color 200ms ease;
}
/* ==========================================================
   Obraz karty: zielone tło pod spodem, przygasa na hover
   Synchronizacja: Tytuł ↔ Obraz (wszystkie karty)
                   Opis ↔ Obraz (tylko karty Typu B)
   ========================================================== */

.s3-menu-card__image {
    position: relative;
    background-color: var(--e-global-color-accent);
    overflow: hidden;
}

.s3-menu-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 1;
    transition: opacity 200ms ease;
}

/* Hover bezpośrednio na obrazie */

.s3-menu-card__image:hover img,
.s3-menu-card__image:has(a:focus-visible) img {
    opacity: 0.45;
}

/* Hover na TYTULE karty przygasza obraz w TEJ SAMEJ karcie
   Działa dla wszystkich kart — Festiwal, Fundusz i pozostałe */

.s3-menu-card:has(.s3-menu-card__title a:hover) .s3-menu-card__image img,
.s3-menu-card:has(.s3-menu-card__title a:focus-visible) .s3-menu-card__image img {
    opacity: 0.45;
}

/* I odwrotnie: hover na obrazie koloruje tytuł na zielono,
   tak samo jak przy zwykłym hover na linku tytułu */

.s3-menu-card:has(.s3-menu-card__image:hover) .s3-menu-card__title a,
.s3-menu-card:has(.s3-menu-card__image a:focus-visible) .s3-menu-card__title a {
    color: var(--e-global-color-accent) !important;
}

/* Typ B: hover na OPISIE (klasa __description albo __text)
   też przygasza obraz — obie nazwy klas są wsparte */

.s3-menu-card--single-link:has(.s3-menu-card__description a:hover) .s3-menu-card__image img,
.s3-menu-card--single-link:has(.s3-menu-card__description a:focus-visible) .s3-menu-card__image img,
.s3-menu-card--single-link:has(.s3-menu-card__text a:hover) .s3-menu-card__image img,
.s3-menu-card--single-link:has(.s3-menu-card__text a:focus-visible) .s3-menu-card__image img {
    opacity: 0.45;
}

.s3-menu-card:has(.s3-menu-card__image:hover) .s3-menu-about__title a,
.s3-menu-card:has(.s3-menu-card__image a:focus-visible) .s3-menu-about__title a {
    color: var(--e-global-color-accent) !important;
}

.s3-menu-card--single-link:has(.s3-menu-card__image:hover) .s3-menu-about__contact a,
.s3-menu-card--single-link:has(.s3-menu-card__image a:focus-visible) .s3-menu-about__contact a {
    color: var(--e-global-color-accent) !important;
}

/* ==========================================================
   Rozszerzenie hover: panel "O nas" (klasy s3-menu-about__*)
   ========================================================== */

/* Bezpośredni hover — tytuł i pojedyncze podlinki kolorują się
   niezależnie, tak jak PRELEGENCI/PROGRAM w Festiwalu */

.s3-menu-about__title a,
.s3-menu-about__link a {
    transition: var(--s3-hover-transition);
}

.s3-menu-about__title a:hover,
.s3-menu-about__title a:focus-visible,
.s3-menu-about__link a:hover,
.s3-menu-about__link a:focus-visible {
    color: var(--e-global-color-accent) !important;
    outline: none;
}

/* Tytuł ↔ Obraz — obejmuje teraz też s3-menu-about__title
   (dotyczy WSZYSTKICH kart, nie tylko Typu B) */

.s3-menu-card:has(.s3-menu-about__title a:hover) .s3-menu-card__image img,
.s3-menu-card:has(.s3-menu-about__title a:focus-visible) .s3-menu-card__image img {
    opacity: 0.45;
}

.s3-menu-card:has(.s3-menu-card__image:hover) .s3-menu-card__title a,
.s3-menu-card:has(.s3-menu-card__image a:focus-visible) .s3-menu-card__title a {
    color: var(--e-global-color-accent) !important;
}

/* Opis ↔ Obraz — obejmuje teraz też s3-menu-about__contact
   (tylko karty Typu B, ze wspólnym celem) */

.s3-menu-card--single-link:has(.s3-menu-about__contact a:hover) .s3-menu-card__image img,
.s3-menu-card--single-link:has(.s3-menu-about__contact a:focus-visible) .s3-menu-card__image img {
    opacity: 0.45;
}

.s3-menu-card:has(.s3-menu-card__image:hover) .s3-menu-about__title a,
.s3-menu-card:has(.s3-menu-card__image a:focus-visible) .s3-menu-about__title a {
    color: var(--e-global-color-accent) !important;
}

/* Układ Flexbox w kontenerze głównym */
.stats .elementor-cta__content {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.5rem !important; /* Odstęp między tekstem "8,9" a ikoną */
}

/* 1. Tekst "8,9" na pierwszym miejscu */
.stats .elementor-cta__title {
  order: 1 !important;
  width: auto !important; /* Nadpisuje 100% z Elementora */
}

/* 2. Ikona SVG obok tekstu */
.stats .elementor-cta__icon {
  order: 2 !important;
  width: auto !important; /* Nadpisuje 100% z Elementora */
  margin-bottom: 0 !important;
}

/* 3. Opis pod spodem */
.stats .elementor-cta__description {
  order: 3 !important;
  width: 100% !important; /* Wymusza przejście do nowej linii */
}

/* ==========================================================
   1. Główny kontener i efekt maski
   ========================================================== */
.marquee-blocks {
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 120px, black calc(100% - 120px), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 120px, black calc(100% - 120px), transparent 100%);
}

/* ==========================================================
   2. Wiersze z tekstem — układy i animacje
   ========================================================== */
.marquee-swiper-1,
.marquee-swiper-2 {
  display: flex !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  will-change: transform;
}

/* Pierwszy wiersz: ruch w lewo */
.marquee-swiper-1 {
  animation: marquee-left 35s linear infinite !important;
}

/* Drugi wiersz: ruch w prawo */
.marquee-swiper-2 {
  animation: marquee-right 35s linear infinite !important;
}

/* Pause po najechaniu */
.marquee-swiper-1:hover,
.marquee-swiper-2:hover {
  animation-play-state: paused !important;
}

/* ==========================================================
   3. Pojedyncze bloki tekstu
   ========================================================== */
.marquee-blocks .elementor-widget-heading {
  flex-shrink: 0 !important;
  width: auto !important;
  white-space: nowrap !important;
  padding-inline: 1.5rem !important;
  margin-bottom: 0 !important;
}

/* ==========================================================
   4. Klatki animacji (Przesunięcie o -25% przy 4 kopiach)
   ========================================================== */
@keyframes marquee-left {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-25%, 0, 0);
  }
}

@keyframes marquee-right {
  0% {
    transform: translate3d(-25%, 0, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}

/* Układ kolumnowy Flexbox dla kontenera treści */
.nagrania .elementor-cta__content {
  display: flex !important;
  flex-direction: column !important;
}

/* 1. Tytuł na pierwszym miejscu */
.nagrania .elementor-cta__title {
  order: 1 !important;
  margin-bottom: 2rem !important; /* Odstęp między tekstem a ikoną */
}

/* 2. Ikona SVG na drugim miejscu (pod tekstem) */
.nagrania .elementor-cta__icon {
  order: 2 !important;
  margin-bottom:0 !important;
}

/* Płynne przejście dla efektu na ikonie */
.nagrania .elementor-cta__icon svg {
  transition: filter 0.3s ease, transform 0.3s ease;
}

/* Brak podkreślenia tekstu (zarówno zwykłego, jak i po najechaniu) */
.nagrania a,
.nagrania .elementor-cta__title {
  text-decoration: none !important;
}

.nagrania:hover a,
.nagrania:hover .elementor-cta__title {
  text-decoration: none !important;
}

/* Efekt jaskrawego cienia / poświaty pod ikoną SVG po najechaniu na kartę */
.nagrania:hover .elementor-cta__icon svg {
  filter: drop-shadow(0px 4px 15px rgba(0, 233, 165, 0.8)) 
          drop-shadow(0px 0px 25px rgba(0, 233, 165, 0.5));
  transform: translateY(-2px); /* Delikatne uniesienie ikony */
}

/* ==========================================================================
   Sektor 3.0 — Karta Pliki (Układ Grid & Pełna Wysokość) — WERSJA POPRAWIONA
   ========================================================================== */

/* 0. Rodzic-grid: wymuś, by każda karta rozciągała się na pełną wysokość wiersza */
.portal-heading.e-grid {
    align-items: stretch !important;
}

.portal-heading > .karta-pliki {
    align-self: stretch !important;
}

/* 1. Reset linku */
.elementor-kit-6 .karta-pliki a:hover {
    text-decoration: unset;
}

/* 2. Równa wysokość w pionie (łańcuch flexbox) */
.karta-pliki,
.karta-pliki .elementor-widget-container {
    height: 100% !important;
}

.karta-pliki .elementor-cta {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
}

/* 3. Główny kontener treści — CSS Grid wypełnia całą wysokość karty,
      ale sama treść (wiersze) trzyma się góry, nie rozciąga się w pionie */
.karta-pliki .elementor-cta__content {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    grid-template-rows: auto auto !important;
    align-content: start !important;   /* KLUCZOWE: blok wierszy do góry */
    align-items: start !important;     /* pojedyncze komórki też do góry */
    gap: 4px;
    flex-grow: 1 !important;
    height: 100% !important;
}

/* 4. Lewa kolumna: Tytuł (wiersz 1) i Opis (wiersz 2) */
.karta-pliki .elementor-cta__title {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    margin-bottom: 8px !important;
}

.karta-pliki .elementor-cta__description {
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    margin-bottom: 0 !important;
}

/* 5. Prawa kolumna: Przycisk (rozciągnięty na 2 wiersze, wyrównany do góry) */
.karta-pliki .elementor-cta__button-wrapper {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-self: start !important;
    margin-bottom: 0 !important;
}

/* 6. Responsywność na urządzeniach mobilnych (<= 576px) */
@media (max-width: 576px) {
    .karta-pliki .elementor-cta__content {
        grid-template-columns: 1fr !important;
        row-gap: 16px !important;
    }

    .karta-pliki .elementor-cta__button-wrapper {
        grid-column: 1 !important;
        grid-row: 3 !important;
        justify-content: flex-start !important;
    }
}


/* 1. BAZA: obramowanie ma stałą szerokość 1px, ale domyślnie jest przezroczyste.
      Transition z opóźnieniem 0.4s (=czas animacji zwijania) dotyczy TYLKO koloru. */
.karta-faq .e-n-accordion-item-title {
    border-bottom: 1px solid transparent !important;
    transition: border-color 0.01s linear 0.4s !important;
}

/* 2. ZWINIĘTY (aria-expanded="false"): kolor zmienia się na docelowy,
      ale dzięki transition-delay z pkt 1 pojawi się dopiero po 0.4s,
      czyli gdy panel jest już całkowicie zwinięty. */
.karta-faq summary[aria-expanded="false"] {
    border-bottom-color: var(--e-global-color-v4-s3_brand_blue_hover) !important;
}

/* 3. ROZWINIĘTY (aria-expanded="true"): obramowanie ma zniknąć OD RAZU,
      bez opóźnienia (bo przejmuje je .e-con) — nadpisujemy transition na "none". */
.karta-faq .e-n-accordion-item-title[aria-expanded="true"] {
    border-bottom-color: transparent !important;
    transition: none !important;
}

/* 4. Stylowanie ikony (+ / -) — bez zmian */
.karta-faq .e-n-accordion-item-title-icon {
    padding: 12px;
    border: 1px solid var(--e-global-color-v4-s3_brand_blue_hover);
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


/* ==========================================================================
   Responsywność stron budujemy w Elementor Pro
   --------------------------------------------------------------------------
   Celowo NIE ma tu reguł opartych na automatycznych ID
   .elementor-element-XXXXXXX dla Tablet/Mobile.

   Wartości kolumn, szerokości, paddingów, wysokości obrazów i typografii
   ustawiaj w Elementorze w zakładkach Tablet/Mobile. Dzięki temu edytor
   pozostaje źródłem prawdy i nie przegrywa z globalnym style.css.

   Poniżej zostają wyłącznie reguły własnych klas, które nie mają
   odpowiednika w ustawieniach Elementora.
   ========================================================================== */

@media (max-width: 767px) {
    .s3-people-break {
        min-height: 220px;
    }

    .sluchaj > *:not(:last-child) {
        border-right: none !important;
        border-bottom: 1px solid var(--e-global-color-v4-s3_brand_blue) !important;
        padding-bottom: 12px !important;
        margin-bottom: 12px !important;
    }
}


/* ==========================================================================
   Sekcja AI (.ai-section) — gradient ograniczony do boxa (e-con-inner)
   ========================================================================== */

/* 1. Kontener zewnętrzny: neutralizujemy tło "classic" z edytora,
      żeby poza boxem nic nie było malowane */
.elementor .ai-section {
    background-image: none !important;
    background-color: transparent !important;
}

/* 2. Gradient na wewnętrznym boxie — obcina się do jego krawędzi z definicji */
.elementor .ai-section .e-con-inner {
    background-image: linear-gradient(
        210.88deg,
        var(--e-global-color-3b317d9, #F0F4F7) 23.16%,
        #FFFFFF 48.49%
    ) !important;
}
@media (max-width: 767px) {
    .elementor .ai-section {
        background-image: linear-gradient(
            210.88deg,
            var(--e-global-color-3b317d9, #F0F4F7) 12%,
            #FFFFFF 38%
        ) !important;
    }
}


/* ==========================================================================
   Sektor 3.0 — Search & Filter Pro: tagi aktualności
   Zakres: wyłącznie widget Elementor z klasą .sf-kategoria-tag
   ========================================================================== */

.sf-kategoria-tag .search-filter-field,
.sf-kategoria-tag .search-filter-field__input {
    width: 100% !important;
    margin: 0 !important;
}

.sf-kategoria-tag .search-filter-input-button-group {
    position: relative !important;
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: stretch !important;
    gap: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding-right: calc(var(--sf-more-width, 140px)) !important;
    overflow: hidden !important;
    transition: max-height 420ms cubic-bezier(0.4, 0, 0.2, 1);
}

@media (prefers-reduced-motion: reduce) {
    .sf-kategoria-tag .search-filter-input-button-group {
        transition: none;
    }
}

.sf-kategoria-tag .search-filter-input-button,
.sf-kategoria-tag .sf-tags-all-button {
    position: relative !important;
    z-index: 1;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-grow: 1 !important;
    flex-shrink: 0 !important;
    flex-basis: auto !important;
    box-sizing: border-box !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 27px !important;
    border: none !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
    border-radius: 0 !important;
    outline: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-color: #FFFFFF !important;
    color: #1C1C1C !important;
    font-family: var(--e-global-typography-accent-font-family, "Archivo Narrow", sans-serif) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    opacity: 1;
    transition:
        background-color 180ms ease,
        box-shadow 180ms ease,
        color 180ms ease,
        opacity 260ms ease;
}

/* Ostatni WIDOCZNY tag (ustalany w JS) nie rozciąga się na resztę wiersza */
.sf-kategoria-tag .search-filter-input-button.sf-tag-last {
    flex-grow: 0 !important;
}

.sf-kategoria-tag .search-filter-input-button.sf-tag-revealing {
    opacity: 0 !important;
}

.sf-kategoria-tag .search-filter-input-button:hover,
.sf-kategoria-tag .search-filter-input-button:focus-visible,
.sf-kategoria-tag .sf-tags-all-button:hover,
.sf-kategoria-tag .sf-tags-all-button:focus-visible,
.sf-kategoria-tag .sf-tags-more-button:hover,
.sf-kategoria-tag .sf-tags-more-button:focus-visible {
    z-index: 2;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-8210c03, #E6EEFA) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

.sf-kategoria-tag .search-filter-input-button:focus-visible,
.sf-kategoria-tag .sf-tags-all-button:focus-visible,
.sf-kategoria-tag .sf-tags-more-button:focus-visible {
    outline: 2px solid var(--e-global-color-accent, #00E9A5) !important;
    outline-offset: 2px !important;
}

.sf-kategoria-tag .sf-tags-all-button.is-active {
    z-index: 3;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-primary, #0054CD) !important;
    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
}

.sf-kategoria-tag .search-filter-input-button.is-active,
.sf-kategoria-tag .search-filter-input-button.active,
.sf-kategoria-tag .search-filter-input-button.selected,
.sf-kategoria-tag .search-filter-input-button.is-selected,
.sf-kategoria-tag .search-filter-input-button.search-filter-input-button--active,
.sf-kategoria-tag .search-filter-input-button.search-filter-input-button--selected,
.sf-kategoria-tag .search-filter-input-button.sf-tag-is-selected,
.sf-kategoria-tag .search-filter-input-button[aria-pressed="true"],
.sf-kategoria-tag .search-filter-input-button[aria-selected="true"] {
    z-index: 3;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-primary, #0054CD) !important;
    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
}

.sf-kategoria-tag .sf-tags-more-button {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    z-index: 4;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 27px !important;
    border: none !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
    background-color: #FFFFFF !important;
    color: #1C1C1C !important;
    font-family: var(--e-global-typography-accent-font-family, "Archivo Narrow", sans-serif) !important;
    font-size: 13px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

.sf-kategoria-tag .sf-tags-more-button:hover,
.sf-kategoria-tag .sf-tags-more-button:focus-visible {
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-8210c03, #E6EEFA) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

.sf-kategoria-tag .sf-tags-more-button::after {
    width: 0;
    height: 0;
    border-top: 10px solid var(--e-global-color-8210c03, #84B6FF);
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    content: "";
    transition: transform 220ms ease, border-top-color 180ms ease;
}

/* Strzałka zmienia kolor razem z resztą przycisku na hover/focus */
.sf-kategoria-tag .sf-tags-more-button:hover::after,
.sf-kategoria-tag .sf-tags-more-button:focus-visible::after {
    border-top-color: var(--e-global-color-primary, #0054CD) !important;
}

.sf-kategoria-tag .search-filter-input-button-group.is-expanded .sf-tags-more-button::after {
    transform: rotate(180deg);
}

.sf-kategoria-tag .sf-tag-hidden {
    display: none !important;
}

@media (max-width: 767px) {
    .sf-kategoria-tag .search-filter-input-button,
    .sf-kategoria-tag .sf-tags-all-button,
    .sf-kategoria-tag .sf-tags-more-button {
        padding-right: 16px !important;
        padding-left: 16px !important;
    }
}

/* ==========================================================================
   Sektor 3.0 — Wyszukiwarka z lupą (.sf-lupa)
   Podmiana ikony + typografia placeholdera, bez ingerencji w strukturę
   pluginu (ramka, tło, padding zostają sterowane przez zmienne S&F)
   ========================================================================== */
.sf-lupa .search-filter-input-text {
    border-radius: 0 !important;
}

/* Tylko właściwa ikona lupy — nie przycisk czyszczenia (obie mają klasę .search-filter-icon) */
.sf-lupa .search-filter-input-text__icon svg {
    display: none !important;
}

.sf-lupa .search-filter-input-text__icon {
    background-image: url(https://02.sektor3-0.stronazen.pl/wp-content/uploads/2023/07/lupa-blue.svg.svg);
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
    order: 3 !important;
}

.sf-lupa .search-filter-input-text__input {
    order: 1 !important;
}

/* Przycisk czyszczenia — zachowuje własną ikonę „X”, reaguje na kursor */
.sf-lupa .search-filter-input-text__clear-button {
    order: 2 !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    transition: opacity 150ms ease;
}

.sf-lupa .search-filter-input-text__clear-button:hover,
.sf-lupa .search-filter-input-text__clear-button:focus-visible {
    opacity: 0.7 !important;
}

.sf-reset .search-filter-input-button {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 17px !important;
    text-align: center !important;
    color: var(--e-global-color-primary, #0054CD) !important;
    cursor: pointer !important;
    transition: opacity 150ms ease, text-decoration-color 150ms ease;
}

.sf-reset .search-filter-input-button:hover,
.sf-reset .search-filter-input-button:focus-visible {
    opacity: 0.7 !important;
    text-decoration: underline !important;
}

.sf-reset .search-filter-input-button:focus-visible {
    outline: 2px solid var(--e-global-color-accent, #00E9A5) !important;
    outline-offset: 2px !important;
}

/* ==========================================================================
   Sektor 3.0 — Search & Filter Pro: sortowanie (.sf-sortowanie)
   Wygląd zgodny z przyciskiem „WIĘCEJ”
   ========================================================================== */

.sf-sortowanie .search-filter-field__input {
    width: 147px !important;
    margin: 0 !important;
}

/* Zewnętrzny kontener comboboxa = korpus przycisku */
.sf-sortowanie .search-filter-component-combobox-base {
    width: 147px !important;
    height: 34px !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
    background-color: #FFFFFF !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    transition:
        background-color 180ms ease,
        box-shadow 180ms ease !important;
}

/* Kontener wewnętrzny bez własnego tła i paddingów S&F */
.sf-sortowanie .search-filter-component-combobox {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    background: transparent !important;
}

/* Dokładny odpowiednik geometrii .sf-tags-more-button */
.sf-sortowanie .search-filter-component-combobox__header {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 34px !important;
    box-sizing: border-box !important;
    padding: 0 27px !important;
    gap: 12px !important;
    cursor: pointer !important;
}

/* Pole tekstowe sortowania */
.sf-sortowanie .search-filter-component-combobox__actions {
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    min-width: 0 !important;
}

/* Ukrywa pusty obszar wyboru generowany przez plugin */
.sf-sortowanie .search-filter-component-combobox__selection {
    display: none !important;
}

/* Input wygląda jak tekst w przycisku */
.sf-sortowanie .search-filter-component-combobox__actions-input {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

/* Placeholder „NAJNOWSZE” */
.sf-sortowanie .search-filter-component-combobox__actions-input::placeholder {
    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
}

/* Separator S&F nie jest potrzebny w projekcie */
.sf-sortowanie .search-filter-component-combobox__input-divider {
    display: none !important;
}

/* Natywną strzałkę SVG zastępujemy trójkątem jak w „WIĘCEJ” */
.sf-sortowanie .search-filter-component-combobox__listbox-toggle {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: 12px !important;
    height: 12px !important;
    cursor: pointer !important;
}

.sf-sortowanie .search-filter-component-combobox__listbox-toggle svg {
    display: none !important;
}

.sf-sortowanie .search-filter-component-combobox__listbox-toggle::after {
    width: 0;
    height: 0;
    border-top: 10px solid var(--e-global-color-8210c03, #84B6FF);
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    content: "";
    transition:
        transform 220ms ease,
        border-top-color 180ms ease;
}

/* Hover/focus — identyczny schemat jak .sf-tags-more-button */
.sf-sortowanie .search-filter-component-combobox-base:hover,
.sf-sortowanie .search-filter-component-combobox-base:focus-within {
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-8210c03, #E6EEFA) !important;
}

.sf-sortowanie .search-filter-component-combobox-base:hover
.search-filter-component-combobox__actions-input,
.sf-sortowanie .search-filter-component-combobox-base:focus-within
.search-filter-component-combobox__actions-input,
.sf-sortowanie .search-filter-component-combobox-base:hover
.search-filter-component-combobox__actions-input::placeholder,
.sf-sortowanie .search-filter-component-combobox-base:focus-within
.search-filter-component-combobox__actions-input::placeholder {
    color: var(--e-global-color-primary, #0054CD) !important;
}

.sf-sortowanie .search-filter-component-combobox-base:hover
.search-filter-component-combobox__listbox-toggle::after,
.sf-sortowanie .search-filter-component-combobox-base:focus-within
.search-filter-component-combobox__listbox-toggle::after {
    border-top-color: var(--e-global-color-primary, #0054CD) !important;
}

/* Obrót strzałki po otwarciu listy */


/* Przycisk czyszczenia zaznaczonego sortowania */
.sf-sortowanie .search-filter-component-combobox__clear-selection {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
}

.sf-sortowanie .search-filter-component-combobox__clear-selection.search-filter-component-combobox--hidden {
    display: none !important;
}

.sf-sortowanie .search-filter-component-combobox__clear-button {
    cursor: pointer !important;
}

.sf-sortowanie .search-filter-component-combobox__clear-button:hover,
.sf-sortowanie .search-filter-component-combobox__clear-button:focus-visible {
    opacity: 0.7 !important;
}

.search-filter-component-combobox .search-filter-component-combobox__actions input[type=text] {
    text-overflow: unset !important;
}

/* ==========================================================================
   Sektor 3.0 — Sortowanie (.sf-sortowanie) + rozwijana lista S&F Pro
   ========================================================================== */

/* Przycisk sortowania: 147px z Figmy */
.sf-sortowanie .search-filter-field__input,
.sf-sortowanie .search-filter-component-combobox-base {
    width: 147px !important;
    min-width: 147px !important;
    max-width: 147px !important;
}

/* Układ: 27px + „NAJSTARSZE” (73px) + 10px gap + strzałka 10px + 27px = 147px */
.sf-sortowanie .search-filter-component-combobox__header {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: 34px !important;
    padding: 0 27px !important;
    gap: 10px !important;
    box-sizing: border-box !important;
}

/* Obszar tekstu ma zawsze miejsce na „NAJSTARSZE” */
.sf-sortowanie .search-filter-component-combobox__actions {
    display: flex !important;
    flex: 0 0 73px !important;
    width: 73px !important;
    min-width: 73px !important;
    max-width: 73px !important;
    align-items: center !important;
    overflow: visible !important;
}

/* Input przed wyborem oraz po wybraniu opcji */
.sf-sortowanie .search-filter-component-combobox__actions-input {
    display: block !important;
    flex: 0 0 73px !important;
    width: 73px !important;
    min-width: 73px !important;
    max-width: 73px !important;
    height: 18px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-align: left !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    cursor: pointer !important;
}

/* Tekst przed wyborem: placeholder „NAJNOWSZE” */
.sf-sortowanie .search-filter-component-combobox__actions-input::placeholder {
    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
}

/* Jeśli S&F renderuje wybrany wariant do .__selection */
.sf-sortowanie .search-filter-component-combobox__selection {
    display: block !important;
    flex: 0 0 73px !important;
    width: 73px !important;
    min-width: 73px !important;
    max-width: 73px !important;
    overflow: visible !important;
    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    white-space: nowrap !important;
    text-align: left !important;
    text-transform: uppercase !important;
}

/* Nie pokazujemy X — nie mieści się w projekcie 147px
   i dla sortowania nie jest potrzebny, bo istnieje stan domyślny „NAJNOWSZE”. */
.sf-sortowanie .search-filter-component-combobox__clear-selection {
    display: none !important;
}

/* Strzałka ma dokładnie 10px szerokości */
.sf-sortowanie .search-filter-component-combobox__listbox-toggle {
    display: inline-flex !important;
    flex: 0 0 10px !important;
    width: 10px !important;
    min-width: 10px !important;
    height: 10px !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ==========================================================================
   Dropdown / lista rozwijana
   Lista jest wstrzykiwana przez S&F poza .sf-sortowanie, dlatego celujemy
   w klasę popupu z konkretnym identyfikatorem pola: --id-6.
   ========================================================================== */
.search-filter-field__popup--id-8,
.search-filter-field__popup--id-6 {
    width: 147px !important;
    min-width: 147px !important;
    max-width: 147px !important;
    margin-top: 4px !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow:
        inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF),
        0 8px 20px rgba(1, 33, 78, 0.10) !important;
    background-color: #FFFFFF !important;
    overflow: hidden !important;
}

/* Lista bez domyślnego paddingu */
.search-filter-field__popup--id-8
.search-filter-component-combobox-base__listbox-list,
.search-filter-field__popup--id-6
.search-filter-component-combobox-base__listbox-list {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background-color: #FFFFFF !important;
}

/* Pojedyncza opcja: NAJNOWSZE / NAJSTARSZE */
.search-filter-field__popup--id-8
.search-filter-component-combobox-base__listbox-option,
.search-filter-field__popup--id-6
.search-filter-component-combobox-base__listbox-option {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 27px !important;
    border: none !important;
    border-bottom: 1px solid var(--e-global-color-8210c03, #84B6FF) !important;
    box-sizing: border-box !important;
    background-color: #FFFFFF !important;
    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-align: left !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition:
        background-color 180ms ease,
        color 180ms ease !important;
}

/* Ostatnia opcja nie potrzebuje drugiej dolnej ramki */

.search-filter-field__popup--id-8
.search-filter-component-combobox-base__listbox-option:last-child,
.search-filter-field__popup--id-6
.search-filter-component-combobox-base__listbox-option:last-child {
    border-bottom: none !important;
}

/* Hover i obsługa klawiatury */
.search-filter-field__popup--id-8
.search-filter-component-combobox-base__listbox-option:hover,
.search-filter-field__popup--id-8
.search-filter-component-combobox-base__listbox-option:focus,
.search-filter-field__popup--id-6
.search-filter-component-combobox-base__listbox-option:hover,
.search-filter-field__popup--id-6
.search-filter-component-combobox-base__listbox-option:focus {
    outline: none !important;
    background-color: var(--e-global-color-8210c03, #E6EEFA) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

/* Aktualnie wybrana opcja */

.search-filter-field__popup--id-8
.search-filter-component-combobox-base__listbox-option[aria-selected="true"],
.search-filter-field__popup--id-8
.search-filter-component-combobox-base__listbox-option--selected,
.search-filter-field__popup--id-6
.search-filter-component-combobox-base__listbox-option[aria-selected="true"],
.search-filter-field__popup--id-6
.search-filter-component-combobox-base__listbox-option--selected {
    background-color: var(--e-global-color-primary, #0054CD) !important;
    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
}

.search-filter-component-combobox--mode-single .search-filter-component-combobox__actions .search-filter-component-combobox__selection, .search-filter-component-combobox--mode-single .search-filter-component-combobox__actions input[type=text] {
    padding: 0 !important;
}

/* ==========================================================================
   Sektor 3.0 — Pole tekstowe wyszukiwarki S&F (.sf-lupa)
   Typografia inputa i placeholdera zgodna z Figmą
   ========================================================================== */
.search-filter-input-text {
border-color: var(--e-global-color-8210c03, #84B6FF) !important}

.search-filter-input-text input[type=text].search-filter-input-text__input {
	height:32px !important;}

.sf-lupa.elementor-widget.elementor-widget-shortcode > div > div {
    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
}

.sf-lupa .search-filter-input-text__input,
.sf-lupa .search-filter-input-text__input:active,
.sf-lupa .search-filter-input-text__input:focus,
.sf-lupa .search-filter-input-text__input:hover {
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    letter-spacing: normal !important;
    text-align: left !important;
    text-overflow: ellipsis !important;
}

/* Stan pustego pola — dokładnie kolor placeholdera z Figmy */
.sf-lupa .search-filter-input-text__input::placeholder {
    color: #5F6B9D !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    letter-spacing: normal !important;
    text-align: left !important;
    opacity: 1 !important;
}

/* Firefox może przywracać własną opacity placeholdera */
.sf-lupa .search-filter-input-text__input::-moz-placeholder {
    color: #5F6B9D !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    letter-spacing: normal !important;
    opacity: 1 !important;
}

/* Kolor wpisywanego tekstu w stanie focus */
.sf-lupa .search-filter-input-text:focus-within
.search-filter-input-text__input {
    color: var(--e-global-color-secondary, #01214E) !important;
}

/* ==========================================================================
   Sektor 3.0 — Paginacja Loop Grid (.elementor-element-030eb8b)
   Scope zgodny z realnie generowanym selektorem Elementora
   ========================================================================== */

.posty-wyniki .elementor-pagination {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 44px !important;
    margin-top: 48px;
    padding: 0 !important;
    text-align: initial !important;
}

/* Zerujemy marginesy generowane natywnie przez Elementora (calc(48px/2)) */
body:not(.rtl) .posty-wyniki
.elementor-pagination .page-numbers:not(:last-child),
body:not(.rtl) .posty-wyniki
.elementor-pagination .page-numbers:not(:first-child) {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

/* --------------------------------------------------------------------------
   Wspólna geometria wszystkich elementów paginacji
   -------------------------------------------------------------------------- */

.posty-wyniki
.elementor-pagination .page-numbers {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 12px 24px !important;
    border: 1px solid var(--Blue_on_dark, #84B6FF) !important;
    border-radius: 0 !important;
    background-color: #FFFFFF !important;
    color: var(--e-global-color-primary, #0054CD) !important;
    font-family: var(--e-global-typography-ff26951-font-family, "Archivo Narrow", sans-serif) !important;
    font-size: var(--e-global-typography-ff26951-font-size, 13px) !important;
    line-height: var(--e-global-typography-ff26951-line-height, 18px) !important;
    letter-spacing: var(--e-global-typography-ff26951-letter-spacing, 0.05em) !important;
    text-align: center !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease !important;
}

body:not(.rtl) .posty-wyniki .elementor-pagination .page-numbers, body:not(.rtl) .posty-wyniki .elementor-pagination .page-numbers {
	border-right: none !important;
}

#search-filter-query-instance-1 > div > nav > a.page-numbers.next:last-child, .posty-wyniki .elementor-pagination .page-numbers.next:last-child {
	border-right:  1px solid var(--Blue_on_dark, #84B6FF) !important;
}

.posty-wyniki
.elementor-pagination .elementor-screen-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Aktualna strona */
.posty-wyniki
.elementor-pagination .page-numbers.current {
    border-color: var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-primary, #0054CD) !important;
    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
    cursor: default !important;
}

.posty-wyniki
.elementor-pagination .page-numbers.dots {
    cursor: default !important;
}

/* Hover / focus numerów stron */
.posty-wyniki
.elementor-pagination a.page-numbers:not(.prev):not(.next):hover,
.posty-wyniki
.elementor-pagination a.page-numbers:not(.prev):not(.next):focus-visible {
    position: relative !important;
    z-index: 2 !important;
    background-color: var(--e-global-color-8210c03, #E6EEFA) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
    outline: none !important;
}

.posty-wyniki
.elementor-pagination a.page-numbers:focus-visible {
    outline: 2px solid var(--e-global-color-accent, #00E9A5) !important;
    outline-offset: -3px !important;
}

/* --------------------------------------------------------------------------
   Pola nawigacji: poprzednia / następna strona
   Wypełniają całą wolną przestrzeń po odjęciu numerów i wielokropka
   -------------------------------------------------------------------------- */

.posty-wyniki
.elementor-pagination .page-numbers.prev,
.posty-wyniki
.elementor-pagination .page-numbers.next {
    position: relative !important;
    flex: 1 1 0 !important;
    min-width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    background-color: #FFFFFF !important;
}

/* Ikona: maska zamiast background-image, żeby sterować kolorem przez CSS */
.posty-wyniki
.elementor-pagination .page-numbers.prev::after,
.posty-wyniki
.elementor-pagination .page-numbers.next::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 24px;
    height: 24px;
    background-color: var(--e-global-color-primary, #0054CD);
    -webkit-mask-image: url(https://02.sektor3-0.stronazen.pl/wp-content/uploads/2026/09/arrow-0.svg);
    mask-image: url(https://02.sektor3-0.stronazen.pl/wp-content/uploads/2026/09/arrow-0.svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    transform: translate(-50%, -50%);
    transition: background-color 180ms ease;
}

/* Plik wskazuje w lewo — pasuje bezpośrednio do „prev” */
.posty-wyniki
.elementor-pagination .page-numbers.prev::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

/* „next” to ten sam plik obrócony o 180° */
.posty-wyniki
.elementor-pagination .page-numbers.next::after {
    transform: translate(-50%, -50%) rotate(180deg);
}

/* Nieaktywne strzałki (span zamiast a) wyglądają identycznie, bez interakcji */
.posty-wyniki
.elementor-pagination span.page-numbers.prev,
.posty-wyniki
.elementor-pagination span.page-numbers.next {
    cursor: default !important;
    opacity: 0.55 !important;
}

/* Hover / focus aktywnych strzałek */
.posty-wyniki
.elementor-pagination a.page-numbers.prev:hover,
.posty-wyniki
.elementor-pagination a.page-numbers.next:hover,
.posty-wyniki
.elementor-pagination a.page-numbers.prev:focus-visible,
.posty-wyniki
.elementor-pagination a.page-numbers.next:focus-visible {
    position: relative !important;
    z-index: 2 !important;
    background-color: var(--e-global-color-8210c03, #E6EEFA) !important;
}

@media (max-width: 767px) {
    .posty-wyniki .elementor-pagination {
        overflow-x: auto !important;
        scrollbar-width: none;
    }

    .posty-wyniki
    .elementor-pagination::-webkit-scrollbar {
        display: none;
    }

    .posty-wyniki
    .elementor-pagination .page-numbers {
        padding-right: 16px !important;
        padding-left: 16px !important;
    }

    .posty-wyniki
    .elementor-pagination .page-numbers.prev,
    .posty-wyniki
    .elementor-pagination .page-numbers.next {
        flex: 0 0 44px !important;
    }
}

/* ==========================================================
   Sektor 3.0 — styl formularza wyszukiwania + sortowania
   dla archiwów kategorii/autora (Droga A, natywny WordPress).
   ========================================================== */
/* ==========================================================
   Pasek: wyszukiwarka z lupą + sortowanie w jednym wierszu
   ========================================================== */

.sektor-archiwum-toolbar {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    width: 100%;
    gap: 16px;
}

/* Pole zajmuje całe dostępne miejsce po odjęciu sortowania */
.sektor-search-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    height: 32px;
}

/*
 * Nadpisanie globalnych stylów:
 * input[type=text] { border: 1px solid #666; ... }
 */
.sektor-search-input-wrap input.sektor-search-input {
    width: 100% !important;
    height: 32px;
    min-height: 32px;
    margin: 0 !important;
    padding: 0 42px 0 12px !important;

    border: none !important;
    border-radius: 0 !important;
    outline: none;

    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #84B6FF;

    font-family: "Proxima Nova", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 17px;
    color: #333333;
}

.sektor-search-input-wrap input.sektor-search-input:focus {
    box-shadow: inset 0 0 0 1.5px #2A6DF4;
}

.sektor-search-input-wrap input.sektor-search-input::placeholder {
    color: #999999;
}

/*
 * Lupa jest pozycjonowana wewnątrz inputa.
 * Nie ma osobnego obramowania — dlatego znika pionowa
 * krawędź po lewej, która występowała w poprzedniej wersji.
 */
.sektor-search-submit,
.elementor-kit-6 .sektor-search-submit,
.elementor-kit-6 button.sektor-search-submit {
    position: absolute;
    top: 0;
    right: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 32px;
    min-height: 32px;
    margin: 0;
    padding: 0;

    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    border-radius: 0 !important;
    outline: none;

    background: transparent;
    box-shadow: none !important;
    cursor: pointer;
}

.sektor-search-submit:hover,
.sektor-search-submit:focus {
    background: transparent;
    outline: none;
}

.sektor-search-icon {
    width: 18px;
    height: 18px;
    color: #2A6DF4;
    pointer-events: none;
}

/* ==========================================================
   Sortowanie
   ========================================================== */

.sektor-sort-wrap {
    flex: 0 0 147px;
    width: 147px;
    height: 32px;
}

.sektor-sort-select,
.elementor-kit-6 .sektor-sort-select {
    width: 147px !important;
    height: 32px;
    min-height: 32px;
    margin: 0 !important;
    padding: 0 27px 0 12px !important;

    border: none !important;
    border-radius: 0 !important;
    outline: none;

    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #84B6FF;

    font-family: "Proxima Nova", sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 17px;
    color: #333333;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;

    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='2'><polyline points='6 9 12 15 18 9'></polyline></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 12px;
}

.sektor-sort-select:focus {
    box-shadow: inset 0 0 0 1.5px #2A6DF4;
}

/* ==========================================================
   Mobile
   ========================================================== */

@media (max-width: 767px) {
    .sektor-archiwum-toolbar {
        flex-wrap: wrap;
        gap: 12px;
    }

    .sektor-search-input-wrap {
        flex: 1 1 100%;
        width: 100%;
    }

    .sektor-sort-wrap {
        flex: 1 1 100%;
        width: 100%;
    }

    .sektor-sort-select,
    .elementor-kit-6 .sektor-sort-select {
        width: 100% !important;
    }
}

/* ==========================================================================
   Sektor 3.0 — Etykieta typu treści na widoku pojedynczego wpisu
   Domyślnie każdy wariant jest ukryty, widoczny zostaje tylko ten
   odpowiadający aktualnemu typowi posta (klasa na <body>)
   ========================================================================== */

.show-cpt {
    display: none !important;
}

/* Zwykłe wpisy WP */
body.single-post .show-cpt--post,
body.type-post .show-cpt--post {
    display: flex !important;
}

/* CPT Podcast */
body.single-podcast .show-cpt--podcast,
body.type-podcast .show-cpt--podcast {
    display: flex !important;
}

/* CPT Wideo */
body.single-video .show-cpt--video,
body.type-video .show-cpt--video {
    display: flex !important;
}

/* CPT Aktualności */
body.single-aktualnosci .show-cpt--aktualnosci,
body.type-aktualnosci .show-cpt--aktualnosci {
    display: flex !important;
}

/* CPT E-learning */
body.single-e-learning .show-cpt--elearning,
body.type-e-learning .show-cpt--elearning {
    display: flex !important;
}

/* CPT Wiedza */
body.single-wiedza .show-cpt--wiedza,
body.type-wiedza .show-cpt--wiedza {
    display: flex !important;
}

/* ==========================================================================
   Sektor 3.0 — Treść wpisu (.post-tresc)
   Klasa dodatkowa na widgecie Theme Post Content (Advanced → CSS Classes)
   ========================================================================== */

/* 1. Bazowa typografia — nadpisuje font-family/size/line-height z Global Style
      Elementora (.elementor-30800 .elementor-element-XXXXXXX) */
.post-tresc {
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    color: #1C1C1C !important;
}

.post-tresc > p {
    margin-block-start: 0 !important;
    margin-block-end: 1.5rem !important;
}

.post-tresc > p:last-child {
    margin-block-end: 0 !important;
}

.post-tresc strong,
.post-tresc b {
    font-weight: 700 !important;
}

/* --------------------------------------------------------------------------
   2. Linki w treści
   -------------------------------------------------------------------------- */

.post-tresc a:not(.elementor-button) {
    color: var(--e-global-color-primary, #0054CD) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
    transition: color 180ms ease !important;
}

.post-tresc a:not(.elementor-button):hover,
.post-tresc a:not(.elementor-button):focus-visible {
    color: var(--e-global-color-accent) !important;
}

/* --------------------------------------------------------------------------
   3. Nagłówki H2
   -------------------------------------------------------------------------- */

.post-tresc h2 {
    margin: 4.5rem 0 1.5rem 0 !important;
    font-family: var(--e-global-typography-primary-font-family, "Proxima Nova", sans-serif) !important;
    font-size: 1.75rem !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;
    color: var(--e-global-color-text) !important;
    scroll-margin-top: 6rem;
}

/* Zmniejszenie marginesu górnego H2, gdy występuje zaraz po odtwarzaczu lub kotwicy spisu */
.post-tresc h2:first-child,
.post-tresc figure.wp-block-embed + h2,
.post-tresc figure.wp-block-embed + span.elementor-menu-anchor + h2,
.post-tresc figure.wp-block-embed + .elementor-menu-anchor + h2,
.post-tresc > span.elementor-menu-anchor:first-child + h2 {
    margin-top: 1.5rem !important;
}
/* --------------------------------------------------------------------------
   4. Listy
   -------------------------------------------------------------------------- */
/* ==========================================================================
   Sektor 3.0 — Ciaśniejszy odstęp między akapitem zapowiadającym
   a bezpośrednio następującą po nim listą (typowy wzorzec: "...pytania:")
   ========================================================================== */

/* Akapit, po którym NATYCHMIAST następuje lista — mniejszy dolny margines */
.post-tresc p:has(+ ul),
.post-tresc p:has(+ ol) {
    margin-block-end: 0.5rem !important;
}

/* Sama lista, gdy poprzedza ją akapit — mniejszy górny margines */
.post-tresc p + ul,
.post-tresc p + ol {
    margin-top: 0.5rem !important;
}
.post-tresc ul,
.post-tresc ol {
    margin: 0 0 2rem 0 !important;
    padding-left: 1.5rem !important;
}

.post-tresc ul:first-child,
.post-tresc ol:first-child {
    margin-top: 0 !important;
}

.post-tresc ul:last-child,
.post-tresc ol:last-child {
    margin-bottom: 0 !important;
}

.post-tresc ul li,
.post-tresc ol li {
    margin-bottom: 0.75rem !important;
    line-height: 30px !important;
}

.post-tresc ul li:last-child,
.post-tresc ol li:last-child {
    margin-bottom: 0 !important;
}

/* --------------------------------------------------------------------------
   5. Obrazy na pełną szerokość + podpisy
   -------------------------------------------------------------------------- */

.post-tresc picture,
.post-tresc > img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
}

.post-tresc picture img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}

.post-tresc .wp-caption {
    width: 100% !important;
    margin: 3rem 0 !important;
}

.post-tresc figcaption, .post-tresc .wp-element-caption {
    font-style: unset;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}

.post-tresc .wp-caption picture {
    margin: 0 !important;
}

.post-tresc .wp-caption-text, .post-tresc .wp-element-caption {
    margin-top: 0.75rem !important;
	margin-bottom: 1em;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    color: #6D6C6C !important;
}

.wp-element-caption {
    margin-bottom: 2em;
}

/* --------------------------------------------------------------------------
   6. Cytat blokowy (<blockquote>) — styl „CYTAT”
   -------------------------------------------------------------------------- */

:root {
    --quote-mark: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='14' viewBox='0 0 16 14' fill='none'><path d='M1.00855 13.6319L0.432547 11.1839C1.64855 11.1519 2.43255 10.7359 2.78455 9.93588C3.16855 9.13588 3.36055 8.11188 3.36055 6.86388H0.000546932V-0.000120163H6.91255C6.91255 .959881 6.89655 1.88788 6.86455 2.78388C6.86455 3.67988 6.84855 4.52788 6.81655 5.32788C6.68855 8.07988 6.24055 10.1439 5.47255 11.5199C4.70455 12.8959 3.21655 13.5999 1.00855 13.6319ZM9.31255 13.6319L8.73655 11.1839C9.95255 11.1519 10.7365 10.7359 11.0885 9.93588C11.4725 9.13588 11.6645 8.11188 11.6645 6.86388H8.30455V-0.000120163H15.2165C15.2165 .959881 15.2005 1.88788 15.1685 2.78388C15.1685 3.67988 15.1525 4.52788 15.1205 5.32788C14.9925 8.07988 14.5445 10.1439 13.7765 11.5199C13.0085 12.8959 11.5205 13.5999 9.31255 13.6319Z' fill='%230054CD'/></svg>");
}

.post-tresc blockquote:not(.wp-embedded-content) {
    position: relative !important;
    display: block !important;
    margin: var(--s3-space-2xl, 4rem) 0 !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
    padding: 2.5rem 1.5rem !important;
    background: transparent !important;
    border: none !important;
}

.post-tresc blockquote:not(.wp-embedded-content)::before,
.post-tresc blockquote:not(.wp-embedded-content)::after {
    content: "" !important;
    position: absolute !important;
    width: 24px !important;
    height: 21px !important;
    background-image: var(--quote-mark) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
}

.post-tresc blockquote:not(.wp-embedded-content)::before {
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
}

.post-tresc blockquote:not(.wp-embedded-content)::after {
    bottom: 0 !important;
    left: 0 !important;
    top: auto !important;
    right: auto !important;
    transform: rotate(180deg) !important;
}

.post-tresc blockquote:not(.wp-embedded-content) p {
    margin: 0 !important;
    padding: 0 !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

.post-tresc blockquote:not(.wp-embedded-content) p + p {
    margin-top: 1rem !important;
}

.post-tresc blockquote.wp-embedded-content {
    display: none !important;
}

/* --------------------------------------------------------------------------
   7. Wyróżnienie (<mark> / .mark) — styl „WYROZNIENIE”
   -------------------------------------------------------------------------- */

.post-tresc mark,
.post-tresc .mark {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin: var(--s3-space-2xl, 4rem) 0 !important;
    padding: 2rem 2.5rem !important;
    background-color: var(--e-global-color-primary, #0054CD) !important;
    color: #FFFFFF !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 30px !important;
    text-align: center !important;
}

/* --------------------------------------------------------------------------
   8. Osadzone treści WordPress (iframe embed)
   -------------------------------------------------------------------------- */

.post-tresc iframe.wp-embedded-content {
    display: block !important;
    width: 100% !important;
    max-width: 600px !important;
    height: auto !important;
    aspect-ratio: 600 / 594 !important;
    margin: 4rem auto !important;
    border: none !important;
}

/* Likwidacja sztucznego bufora 21:9 z Gutenberga */
.post-tresc figure.wp-block-embed-spotify.wp-has-aspect-ratio .wp-block-embed__wrapper::before,
.post-tresc figure.is-provider-spotify.wp-has-aspect-ratio .wp-block-embed__wrapper::before {
    content: none !important;
    display: none !important;
    padding-top: 0 !important;
}

/* Przywrócenie pełnej skali odtwarzacza Spotify (232px) i skasowanie pustki */
.post-tresc figure.wp-block-embed-spotify,
.post-tresc figure.is-provider-spotify {
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
    width: 100% !important;
}

.post-tresc figure.wp-block-embed-spotify .wp-block-embed__wrapper,
.post-tresc figure.is-provider-spotify .wp-block-embed__wrapper {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    min-height: unset !important;
}

.post-tresc figure.wp-block-embed-spotify iframe,
.post-tresc figure.is-provider-spotify iframe {
    position: static !important;
    width: 100% !important;
    height: 232px !important;       /* Wymusza pełny, czytelny układ Spotify */
    min-height: 232px !important;
    max-height: 232px !important;
    border-radius: 12px !important;
}

/* --------------------------------------------------------------------------
   9. Mobile
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .post-tresc {
        font-size: 16px !important;
        line-height: 1.6 !important;
    }

    .post-tresc h2 {
        margin-top: 3rem !important;
        font-size: 1.5rem !important;
    }

    .post-tresc blockquote:not(.wp-embedded-content) {
        padding: 2rem 1rem !important;
    }

    .post-tresc blockquote:not(.wp-embedded-content)::before,
    .post-tresc blockquote:not(.wp-embedded-content)::after {
        width: 18px !important;
        height: 16px !important;
    }

    .post-tresc mark,
    .post-tresc .mark {
        padding: 1.5rem !important;
    }
}

/* Dodaj ramkę po lewej stronie każdego elementu listy */
.elementor-toc__list-item {
    position: relative;
    padding-left: 8px;
    /* Odstęp dla ramki */
}
.elementor-toc__list-item {
    margin-bottom: 32px !important;
}
.elementor-toc__list-item::before {
    content: '';
    position: absolute;
    left: -20px;
    top: -4px;
    bottom: -5px;
    width: 0px;
    background-color: var(--e-global-color-7447617);
    transition: all 0.3s ease;
}

/* Grubsza i ciemniejsza ramka dla aktywnego elementu */
.elementor-toc__list-item:has(.elementor-item-active)::before {
    width: 4px;
    border-radius: 0px;
    background-color: var(--e-global-color-primary);
}

.elementor-toc__list-item:has(.elementor-item-active) {
	font-weight: bold !important;
}
.elementor-toc__body .elementor-toc__list-item-text.elementor-item-active {
	text-decoration:unset !important;
}

.cc div.elementor-cta__button-wrapper.elementor-cta__content-item.elementor-content-item {
    order: 2;
    width: 45%;
    display: inline-block;
    margin: 0 3rem 0 0;
}

.cc div.elementor-cta__description.elementor-cta__content-item.elementor-content-item {
    order: 3;
    width: 35%;
    display: flex;
    margin: 0!important;
}

.cc div.elementor-content-item.elementor-cta__content-item.elementor-icon-wrapper.elementor-cta__icon.elementor-view-default {
    order: 4;
    width: 5%;
    display: flex;
    margin: 0!important;
}

/* ==========================================================================
   Sektor 3.0 — Przyciski udostępniania (.sm-share)
   Wygląd zgodny z rodziną .btn-std/.btn-alt (ramka + kolor), BEZ segmentu
   ze strzałką. Tło na hover: var(--e-global-color-accent).
   ========================================================================== */

/* 1. Korpus przycisku — nadpisuje skiny Elementora (framed / custom color) */

.elementor-share-btn__icon {
	width: 16px;
}
.sm-share .elementor-share-btn {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    height: 44px !important;
    padding: 12px 24px !important;
    box-sizing: border-box !important;
    border: 1px solid var(--e-global-color-7447617) !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    cursor: pointer !important;
    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        color 180ms ease !important;
}

/* 2. Hover / focus — tło z tokenu accent, zgodnie z prośbą */
.sm-share .elementor-share-btn:hover,
.sm-share .elementor-share-btn:focus-visible {
    background-color: var(--e-global-color-accent) !important;
    border-color: var(--e-global-color-accent) !important;
}

/* 3. Kolor tekstu i ikon — primary blue, spójnie z resztą btn-* */
.sm-share .elementor-share-btn__icon,
.sm-share .elementor-share-btn__icon svg,
.sm-share .elementor-share-btn__title {
    color: var(--e-global-color-primary, #0054CD) !important;
    fill: var(--e-global-color-primary, #0054CD) !important;
    transition: color 180ms ease, fill 180ms ease !important;
}

.sm-share .elementor-share-btn__icon svg {
    width: 17px !important;
    height: 17px !important;
}

.sm-share .elementor-share-btn__title {
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 125% !important;
    letter-spacing: -0.01em !important;
    text-align: center !important;
    white-space: nowrap !important;
}

/* --------------------------------------------------------------------------
   4. Podmiana ikony Facebooka: okrągłe „f” (e-fab-facebook) → literowe „f”
      (e-fab-facebook-f), tak jak w pozostałych ikonach social media na stronie
   -------------------------------------------------------------------------- */

.sm-share .elementor-share-btn_facebook .elementor-share-btn__icon svg {
    display: none !important;
}

.sm-share .elementor-share-btn_facebook .elementor-share-btn__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 17px !important;
    height: 17px !important;
}

.sm-share .elementor-share-btn__icon svg {
	color: var(--e-global-color-7447617) !important;
	fill: var(--e-global-color-7447617) !important;
}

.sm-share .elementor-share-btn_facebook .elementor-share-btn__icon::before {
    content: "" !important;
    display: block !important;
    width: 8px !important;
    height: 17px !important;
    background-color: var(--e-global-color-7447617) !important;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path d='M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z'/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'><path d='M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z'/></svg>");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    transition: background-color 180ms ease !important;
}

/* Kolor ikony Facebooka reaguje na hover przycisku tak samo jak reszta */
.sm-share .elementor-share-btn_facebook:hover .elementor-share-btn__icon::before,
.sm-share .elementor-share-btn_facebook:focus-visible .elementor-share-btn__icon::before {
    background-color: var(--e-global-color-primary, #0054CD) !important;
}

/* Post Info (.tag-btn) — tagi jako przyciski z linkami */

/* Kontener: układa tagi w rząd, zawija przy wąskim ekranie */
.elementor-widget-post-info.tag-btn .elementor-icon-list-items {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 !important; /* 1. Usuwamy gap, żeby ramki mogły się stykać */
    padding: 1px 0 0 1px !important; /* Drobna kompensacja dla ujemnych marginesów dzieci */
}

.elementor-widget-post-info.tag-btn .elementor-icon-list-item {
    display: inline-flex !important;
    margin: 0 !important; /* Reset domyślnych marginesów z Elementora */
}

/* Pojedynczy Tag */
.elementor-widget-post-info.tag-btn .elementor-post-info__item--type-custom a {
    position: relative !important; /* Wymagane dla poprawnego działania z-index */
    z-index: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 20px !important;
    background-color: transparent !important;
    border: 1px solid rgb(132, 182, 255) !important; 
    
    /* 2. KLUCZOWE: ujemny margines nakładający ramki na siebie (lewa i górna krawędź) */
    margin: -1px 0 -1px -1px !important; 
    
    color: var(--e-global-color-text, #1C1C1C) !important;
    font-family: var(--e-global-typography-accent-font-family, "Archivo Narrow", sans-serif) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: all 0.3s ease !important;
}

/* Stan hover / najechanie - wypełnia się kolorem i wychodzi na wierzch */
.elementor-widget-post-info.tag-btn .elementor-post-info__item--type-custom a:hover,
.elementor-widget-post-info.tag-btn .elementor-post-info__item--type-custom a:focus {
    background-color: rgb(132, 182, 255) !important;
    border-color: rgb(132, 182, 255) !important;
    color: #FFFFFF !important;
    
    /* 3. KLUCZOWE: wyciągamy aktywny przycisk nad inne, by pokazać całą jego ramkę */
    z-index: 2 !important; 
}

/* ==========================================================================
   Sektor 3.0 — Ikony social media autora (archiwum + box autora pod wpisem)
   Ukrywa widget, gdy pole URL w ACF jest puste (brak <a class="elementor-icon">)
 ========================================================================== */

.autor-www:not(:has(a.elementor-icon)),
.autor-facebook:not(:has(a.elementor-icon)),
.autor-linkedin:not(:has(a.elementor-icon)),
.autor-instagram:not(:has(a.elementor-icon)),
.autor-twitter:not(:has(a.elementor-icon)) {
    display: none !important;
}

/* Ukrycie pierwszego akapitu (leadu) w głównej treści posta */

/* artykuły */
.article .elementor-widget-theme-post-content > p:first-of-type,
.article .elementor-widget-theme-post-content > .elementor-widget-container > p:first-of-type {
    display: none;
}

/* aktualności — jeśli tam jest ten sam widget treści */
.aktualnosci .elementor-widget-theme-post-content > p:first-of-type,
.aktualnosci .elementor-widget-theme-post-content > .elementor-widget-container > p:first-of-type {
    display: none;
}

/* ==========================================================================
   5. PRZYCISKI BLOKOWE WP W TREŚCI — na wzór systemu .btn (wariant btn-alt)
   ========================================================================== */

/* 5.1 Tokeny — identyczna kolorystyka jak .btn-alt */
.post-tresc .wp-block-button__link {
    --btn-border: var(--e-global-color-primary);
    --btn-text: var(--e-global-color-primary);
    --btn-arrow: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>');

    --btn-hover-bg: var(--e-global-color-primary);
    --btn-hover-border: var(--e-global-color-8210c03);
    --btn-hover-text: var(--e-global-color-3b317d9);
    --btn-hover-arrow: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%23E6EEFA" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%23E6EEFA" stroke-width="1.5"/></svg>');
}

/* 5.2 Struktura: tekst + segment strzałki (jak .btn-text + .btn-icon) */
.post-tresc .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    height: 45px;
    box-sizing: border-box;
    width: auto;
    padding: 0 0 0 16px;
    background-color: transparent;
    border: 1px solid var(--btn-border);
    color: var(--btn-text) !important;
    text-decoration: none !important;
    font-weight: 500;
    line-height: 1.2;
    transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

/* Segment strzałki — odpowiednik .btn .elementor-button-icon */
.post-tresc .wp-block-button__link::after {
    content: '';
    display: flex;
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 100%;
    flex-shrink: 0;
    box-sizing: border-box;
    margin-left: 16px;
    border-left: 1px solid var(--btn-border);
    background-color: transparent;
    background-image: var(--btn-arrow);
    background-repeat: no-repeat;
    background-position: center;
    transition: all 0.3s ease;
}

/* 5.3 Hover / focus */
.post-tresc .wp-block-button__link:hover,
.post-tresc .wp-block-button__link:focus {
    background-color: var(--btn-hover-bg);
    border-color: var(--btn-hover-border);
    color: var(--btn-hover-text) !important;
    text-decoration: none !important;
}

.post-tresc .wp-block-button__link:hover::after,
.post-tresc .wp-block-button__link:focus::after {
    border-left-color: var(--btn-hover-border);
    background-image: var(--btn-hover-arrow);
}

:where(.wp-block-button__link) {
	border-radius: 0 !important;
	margin-bottom:2rem;
}

.post-tresc .wp-block-buttons .wp-block-button__link {
    /* ...wszystkie deklaracje z sekcji 5.2... */
    color: var(--btn-text) !important;
    text-decoration: none !important;
}

.post-tresc .wp-block-buttons .wp-block-button__link:hover,
.post-tresc .wp-block-buttons .wp-block-button__link:focus {
    /* ...deklaracje hover z 5.3... */
    color: var(--btn-hover-text) !important;
    text-decoration: none !important;
}

.article .elementor-grid-0 .elementor-grid  {
	display: flex !important;}

.obraz-blend img {
	display: block;
	width: 100%;
	height: auto;
	mix-blend-mode: multiply;
}

.obraz-blend img:hover {
	display: block;
	width: 100%;
	height: auto;
	mix-blend-mode: revert;
}

.obraz-blend-2 img:hover {
	display: block;
	width: 100%;
	height: auto;
	mix-blend-mode: luminosity;
}

@media (min-width: 768px) {
	.mapa-strony {
		align-items: stretch;
		grid-auto-rows: minmax(252px, auto);
	}

	.mapa-strony > .e-con:has(> .przycisk-strzalka) {
		display: flex;
		flex-direction: column;
		align-self: stretch;
		height: 100%;
	}

	.mapa-strony > .e-con:has(> .przycisk-strzalka) > .przycisk-strzalka {
		margin-top: auto;
	}
}

.mapa-strony .przycisk-strzalka,
.mapa-strony .przycisk-strzalka .elementor-widget-container,
.mapa-strony .przycisk-strzalka a,
.mapa-strony .przycisk-strzalka img {
	display: block;
}

/* ==========================================================================
   Sektor 3.0 — MailerLite: formularz newslettera, form_id=4
   Target: .form-stopka #mlb2-20082529
   Zakłada, że <style> wstrzykiwany przez MailerLite jest już USUNIĘTY
   filtrem do_shortcode_tag w functions.php (patrz plik
   functions-mailerlite-strip-style.php). Bez tego filtra formularz
   nadal pokaże krótkie migotanie przy pierwszym renderze.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Reset pudełek — bez własnego CSS MailerLite trzeba ustawić wszystko
   -------------------------------------------------------------------------- */

.form-stopka #mlb2-20082529.ml-form-embedContainer {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer *,
.form-stopka #mlb2-20082529.ml-form-embedContainer *::before,
.form-stopka #mlb2-20082529.ml-form-embedContainer *::after {
    box-sizing: border-box !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-align-center,
.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper.embedForm,
.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper,
.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedBody {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: initial !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedContent {
    display: none !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-block-form {
    display: flex !important;
    align-items: stretch !important;
    width: 100% !important;
    margin: 0 !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-formContent {
    display: flex !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-fieldRow {
    display: block !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-fieldRow + .ml-form-fieldRow {
    margin-left: -1px !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-field-group {
    width: 100% !important;
    margin: 0 !important;
}

/* --------------------------------------------------------------------------
   2. Pola tekstowe — tło PRZEŹROCZYSTE, ramka jasnoniebieska
   Uwaga: --e-global-color-8210c03 to udokumentowane #E6EEFA (prawie biały),
   dlatego użyty jest --Blue_on_dark. Jeśli w Site Settings -> Global Colors
   zmienna nazywa się inaczej, podmień nazwę we wszystkich miejscach poniżej
   (fallback #84B6FF zostaje jako siatka bezpieczeństwa).
   -------------------------------------------------------------------------- */

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 45px !important;
    margin: 0 !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;

    background-color: transparent !important;
    border: 1px solid var(--Blue_on_dark, #84B6FF) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    appearance: none !important;

    color: #fff !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;

    transition: border-color 180ms ease, box-shadow 180ms ease !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control::placeholder {
    font-family: 'Proxima Nova', sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    letter-spacing: -0.01em !important;
    color: var(--Blue_on_dark, #84B6FF) !important;
    opacity: 1 !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control::-moz-placeholder {
    font-family: 'Proxima Nova', sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    letter-spacing: -0.01em !important;
    color: var(--Blue_on_dark, #84B6FF) !important;
    opacity: 1 !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control:-ms-input-placeholder {
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    color: var(--Blue_on_dark, #84B6FF) !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control:focus {
    position: relative;
    z-index: 2;
    border-color: var(--e-global-color-primary, #0054CD) !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
}

/* --------------------------------------------------------------------------
   3. Przycisk CTA — niebieski, 214 px, segment strzałki 55 px
   Obrys = ten sam kolor co tło (zgodnie z Figmą: background #0054CD,
   border 1px solid #0054CD) — bez ciemniejszej navy ramki dookoła.
   Tekst źródłowy jest WIELKIMI LITERAMI ("ZAPISZ SIĘ"); text-transform:none
   tego nie cofnie, dlatego zastosowany jest trik lowercase + ::first-letter.
   -------------------------------------------------------------------------- */

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedSubmit {
    position: relative !important;
    display: block !important;
    flex: 0 0 214px !important;
    width: 214px !important;
    height: 45px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    height: 45px !important;
    min-height: 45px !important;
    margin: 0 !important;
    padding: 0 calc(55px + 16px) 0 16px !important;
    box-sizing: border-box !important;

    background-color: var(--e-global-color-primary, #0054CD) !important;
    border: 1px solid var(--e-global-color-primary, #0054CD) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    appearance: none !important;

    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;
    text-align: left !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    text-transform: lowercase !important;

    cursor: pointer !important;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary::first-letter {
    text-transform: uppercase !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedSubmit::after {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;

    display: block;
    width: 55px;
    height: 45px;
    box-sizing: border-box;

    pointer-events: none;
    content: "";

    border-left: 1px solid var(--e-global-color-secondary, #01214E);

    background-color: transparent;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%23F0F4F7" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%23F0F4F7" stroke-width="1.5"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:hover,
.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    background-color: var(--e-global-color-accent, #00E9A5) !important;
    border-color: var(--e-global-color-accent, #00E9A5) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
    outline: none !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedSubmit:hover::after,
.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedSubmit:focus-within::after {
    border-left-color: var(--e-global-color-primary, #0054CD);

    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>');
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    outline: 2px solid var(--e-global-color-primary, #0054CD) !important;
    outline-offset: 3px !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedSubmit button.loading {
    display: none !important;
}

/* --------------------------------------------------------------------------
   4. Ekran sukcesu po zapisie
   -------------------------------------------------------------------------- */

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-successBody {
    display: none;
    padding: 24px !important;
    border: 1px solid var(--Blue_on_dark, #84B6FF) !important;
    background-color: #FFFFFF !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-successContent {
    margin: 0 !important;
    text-align: left !important;
}

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-successContent p,
.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-successContent span {
    color: var(--e-global-color-primary, #0054CD) !important;
    font-family: 'Proxima Nova', sans-serif !important;
}



/* --------------------------------------------------------------------------
   5. Mobile — pola oraz przycisk jedno pod drugim
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .form-stopka #mlb2-20082529.ml-form-embedContainer .ml-block-form,
    .form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-formContent {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
    }
	
	.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control {
	border-bottom: none !important;	
	}

    .form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-fieldRow {
        width: 100% !important;
        margin: 0 !important;
    }

    .form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-fieldRow + .ml-form-fieldRow {
        margin-left: 0 !important;
    }

    .form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedSubmit {
        flex: 0 0 45px !important;
        width: 100% !important;
        margin: 0 !important;
    }
}


/* ==========================================================================
   PATCH — naprawa ::first-letter na przycisku CTA
   ----------------------------------------------------------------------------
   ::first-letter NIE działa na kontenerach display:flex (wymaga
   "block container box" wg specyfikacji CSS). Dlatego lowercase
   działał, a przywrócenie wielkiej litery — nie. Poniżej ta sama
   reguła button.primary, ale z display:block + line-height zamiast
   flex + align-items, dzięki czemu ::first-letter zaczyna działać,
   a wygląd (wyśrodkowanie tekstu w pionie, padding) zostaje identyczny.

   PODMIEŃ w form-stopka-mailerlite-final.css regułę:
     .form-stopka ... .ml-form-embedSubmit button.primary { ... }
   na wersję poniżej.
   ========================================================================== */

.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary {
    position: relative !important;
    display: block !important;

    width: 100% !important;
    height: 45px !important;
    min-height: 45px !important;
    margin: 0 !important;
    padding: 0 calc(55px + 16px) 0 16px !important;
    box-sizing: border-box !important;

    background-color: var(--e-global-color-primary, #0054CD) !important;
    border: 1px solid var(--e-global-color-primary, #0054CD) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    appearance: none !important;

    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 43px !important; /* 45px wysokości - 2x1px ramki = wyśrodkowanie w pionie */
    letter-spacing: -0.01em !important;
    text-align: left !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-transform: lowercase !important;

    cursor: pointer !important;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease !important;
}

/* Teraz działa — button.primary jest blokiem, nie flexem */
.form-stopka #mlb2-20082529.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary::first-letter {
    text-transform: uppercase !important;
}

/* ==========================================================================
   Sektor 3.0 — MailerLite: ".form-publikacja-1" — WERSJA OSTATECZNA
   Zastępuje WSZYSTKIE poprzednie fragmenty (.form-publikacja-1b, stare
   bloki z ID, "safety net" itd.) — to jest jedyne źródło prawdy dla obu
   formularzy. Nie łącz tego z żadnym starszym blokiem.

   Oba formularze: przezroczyste pola, ramka Blue_on_dark, przycisk
   PRIMARY (niebieski) domyślnie.
   Hover: #mlb2-27138772 -> accent (zielony), #mlb2-18522802 -> secondary
   (ciemny navy). To JEDYNA różnica między nimi.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Reset pudełek
   -------------------------------------------------------------------------- */

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer *,
.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer *::before,
.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer *::after {
    box-sizing: border-box !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-align-center,
.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper.embedForm,
.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper,
.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedBody {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: initial !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedContent {
    display: none !important;
}

/* --------------------------------------------------------------------------
   2. Układ PIONOWY — gap 8px
   -------------------------------------------------------------------------- */

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-block-form {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 8px !important;
    margin: 0 !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-formContent {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-fieldRow {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-field-group {
    width: 100% !important;
    margin: 0 !important;
}

/* --------------------------------------------------------------------------
   3. Pola tekstowe
   -------------------------------------------------------------------------- */

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 45px !important;
    margin: 0 !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;

    background-color: transparent !important;
    border: 1px solid var(--Blue_on_dark, #84B6FF) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    appearance: none !important;

    color: #1C1C1C !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;
    text-align: left !important;
    transition: border-color 180ms ease, box-shadow 180ms ease !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control::placeholder {
    font-family: 'Proxima Nova', sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    letter-spacing: -0.01em !important;
    color: var(--Blue_on_dark, #84B6FF) !important;
    opacity: 1 !important;
    
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control::-moz-placeholder {
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    text-align: left !important;
    letter-spacing: -0.01em !important;
    color: var(--Blue_on_dark, #84B6FF) !important;
    opacity: 1 !important;
    
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control:focus {
    position: relative;
    z-index: 2;
    border-color: var(--e-global-color-primary, #0054CD) !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
}

/* --------------------------------------------------------------------------
   4. Przycisk CTA — DOMYŚLNIE PRIMARY (niebieski) dla OBU formularzy
   -------------------------------------------------------------------------- */

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedSubmit {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 45px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary {
    position: relative !important;
    display: block !important;

    width: 100% !important;
    height: 45px !important;
    min-height: 45px !important;
    margin: 0 !important;
    padding: 0 calc(55px + 16px) 0 16px !important;
    box-sizing: border-box !important;

    background-color: var(--e-global-color-primary, #0054CD) !important;
    border: 1px solid var(--e-global-color-primary, #0054CD) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    appearance: none !important;

    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 43px !important;
    letter-spacing: -0.01em !important;
    text-align: left !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-transform: lowercase !important;

    cursor: pointer !important;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary::first-letter {
    text-transform: uppercase !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedSubmit::after {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;

    display: block;
    width: 55px;
    height: 45px;
    box-sizing: border-box;

    pointer-events: none;
    content: "";

    border-left: 1px solid var(--e-global-color-3b317d9, #F0F4F7);

    background-color: transparent;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%23F0F4F7" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%23F0F4F7" stroke-width="1.5"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    outline: 2px solid var(--e-global-color-primary, #0054CD) !important;
    outline-offset: 3px !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedSubmit button.loading {
    display: none !important;
}

/* --------------------------------------------------------------------------
   5. HOVER — TYLKO TUTAJ formularze się różnią
   5a. #mlb2-27138772 -> accent (zielony)
   -------------------------------------------------------------------------- */

.form-publikacja-1 #mlb2-27138772.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:hover,
.form-publikacja-1 #mlb2-27138772.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    background-color: var(--e-global-color-accent, #00E9A5) !important;
    border-color: var(--e-global-color-accent, #00E9A5) !important;
    color: var(--e-global-color-secondary) !important;
}

.form-publikacja-1 #mlb2-27138772.ml-form-embedContainer .ml-form-embedSubmit:hover::after,
.form-publikacja-1 #mlb2-27138772.ml-form-embedContainer .ml-form-embedSubmit:focus-within::after {
    border-left-color: var(--e-global-color-primary, #0054CD);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>');
}

/* --------------------------------------------------------------------------
   5b. #mlb2-18522802 -> secondary (ciemny navy)
   -------------------------------------------------------------------------- */

.form-publikacja-1 #mlb2-18522802.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:hover,
.form-publikacja-1 #mlb2-18522802.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    background-color: var(--e-global-color-accent, #00E9A5) !important;
    border-color: var(--e-global-color-accent, #00E9A5) !important;
    color: var(--e-global-color-secondary) !important;
}

.form-publikacja-1 #mlb2-18522802.ml-form-embedContainer .ml-form-embedSubmit:hover::after,
.form-publikacja-1 #mlb2-18522802.ml-form-embedContainer .ml-form-embedSubmit:focus-within::after {
    border-left-color: var(--e-global-color-secondary, #01214E);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%2301214E" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%2301214E" stroke-width="1.5"/></svg>');
}

/* --------------------------------------------------------------------------
   5c. #mlb2-37209071, #mlb2-37209093, #mlb2-37209056 -> accent (zielony)
   -------------------------------------------------------------------------- */

.form-publikacja-1 :is(#mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:hover,
.form-publikacja-1 :is(#mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    background-color: var(--e-global-color-accent, #00E9A5) !important;
    border-color: var(--e-global-color-accent, #00E9A5) !important;
    color: var(--e-global-color-secondary, #01214E) !important;
}

.form-publikacja-1 :is(#mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedSubmit:hover::after,
.form-publikacja-1 :is(#mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-embedSubmit:focus-within::after {
    border-left-color: var(--e-global-color-primary, #0054CD);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>');
}

/* --------------------------------------------------------------------------
   6. Ekran sukcesu
   -------------------------------------------------------------------------- */

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-successBody {
    display: none;
    padding: 24px !important;
    background-color: transparent !important;
    border: 1px solid var(--Blue_on_dark, #84B6FF) !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-successContent {
    margin: 0 !important;
    text-align: left !important;
}

.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-successContent h4,
.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-successContent p,
.form-publikacja-1 :is(#mlb2-27138772, #mlb2-18522802, #mlb2-37209071, #mlb2-37209093, #mlb2-37209056, #mlb2-46048651).ml-form-embedContainer .ml-form-successContent span {
    color: var(--e-global-color-primary, #0054CD) !important;
    font-family: 'Proxima Nova', sans-serif !important;
}

.form-publikacja-1 :is(#mlb2-18522802, #form-ceimny).ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary {
   
    background-color: var(--e-global-color-3b317d9, #F0F4F7;) !important;
    border: 1px solid var(--e-global-color-3b317d9, #F0F4F7) !important;
}



/* Pola tekstowe — biała ramka, biały tekst */
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control.form-control {
    background-color: transparent !important;
    border: 1px solid #FFFFFF !important;
    color: #FFFFFF !important;
}

#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control.form-control::placeholder {
    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
}

#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control.form-control:focus {
    border-color: var(--e-global-color-accent, #00E9A5) !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-accent, #00E9A5) !important;
}

/* Przycisk — biały, kontrastuje z niebieskim tłem sekcji */
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary.primary {
    background-color: #FFFFFF !important;
    border: 1px solid #FFFFFF !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary.primary:hover,
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary.primary:focus-visible {
    background-color: var(--e-global-color-accent, #00E9A5) !important;
    border-color: var(--e-global-color-accent, #00E9A5) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

/* Strzałka i lewa linia w ciemnej sekcji — niebieska (primary) */
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedSubmit::after {
    border-left-color: var(--e-global-color-primary, #0054CD) !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>') !important;
}

/* Stan hover/focus przycisku w ciemnej sekcji — zachowanie niebieskiej strzałki */
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedSubmit:hover::after,
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-embedSubmit:focus-within::after {
    border-left-color: var(--e-global-color-primary, #0054CD) !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>') !important;
}

/* ==========================================================================
   Sektor 3.0 — DOPISKA: obsługa formularza 6 (#mlb2-30236189)
   ----------------------------------------------------------------------------
   Dopisz na końcu istniejącego pliku. Pokrywa TYLKO brakujący numer ID —
   nie duplikuje ani nie zastępuje niczego z sekcji dla #mlb2-27138772
   ani #mlb2-18522802.

   Wariant #form-ciemny NIE wymaga zmian — jego selektory nie zależą od
   numeru #mlb2-XXXXX, więc automatycznie obejmą dolny formularz z tej
   pary (mlb2-30236189 wewnątrz #form-ciemny).

   Ta sekcja dotyczy WYŁĄCZNIE górnego formularza (bez #form-ciemny) —
   domyślny wygląd: primary niebieski, hover accent (zielony), tak samo
   jak #mlb2-27138772.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Reset pudełek
   -------------------------------------------------------------------------- */

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer *,
.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer *::before,
.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer *::after {
    box-sizing: border-box !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-align-center,
.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper.embedForm,
.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper,
.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedBody {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: initial !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedContent {
    display: none !important;
}

/* --------------------------------------------------------------------------
   2. Układ PIONOWY — gap 8px
   -------------------------------------------------------------------------- */

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-block-form {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 8px !important;
    margin: 0 !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-formContent {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-fieldRow {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-field-group {
    width: 100% !important;
    margin: 0 !important;
}

/* --------------------------------------------------------------------------
   3. Pola tekstowe
   -------------------------------------------------------------------------- */

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 45px !important;
    margin: 0 !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;

    background-color: transparent !important;
    border: 1px solid var(--Blue_on_dark, #84B6FF) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    appearance: none !important;

    color: #1C1C1C !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;
    text-align: left !important;
    transition: border-color 180ms ease, box-shadow 180ms ease !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control::placeholder {
    font-family: 'Proxima Nova', sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    letter-spacing: -0.01em !important;
    color: var(--Blue_on_dark, #84B6FF) !important;
    opacity: 1 !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control::-moz-placeholder {
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    text-align: left !important;
    letter-spacing: -0.01em !important;
    color: var(--Blue_on_dark, #84B6FF) !important;
    opacity: 1 !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-fieldRow input.form-control:focus {
    position: relative;
    z-index: 2;
    border-color: var(--e-global-color-primary, #0054CD) !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
}

/* --------------------------------------------------------------------------
   4. Przycisk CTA — domyślnie PRIMARY (niebieski)
   -------------------------------------------------------------------------- */

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedSubmit {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 45px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary {
    position: relative !important;
    display: block !important;

    width: 100% !important;
    height: 45px !important;
    min-height: 45px !important;
    margin: 0 !important;
    padding: 0 calc(55px + 16px) 0 16px !important;
    box-sizing: border-box !important;

    background-color: var(--e-global-color-primary, #0054CD) !important;
    border: 1px solid var(--e-global-color-primary, #0054CD) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    appearance: none !important;

    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 43px !important;
    letter-spacing: -0.01em !important;
    text-align: left !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-transform: lowercase !important;

    cursor: pointer !important;
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary::first-letter {
    text-transform: uppercase !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedSubmit::after {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
	color: var(--e-global-color-primary, #0054CD) !important;
    display: block;
    width: 55px;
    height: 45px;
    box-sizing: border-box;

    pointer-events: none;
    content: "";

    border-left: 1px solid var(--e-global-color-3b317d9, #F0F4F7);

    background-color: transparent;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%23F0F4F7" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%23F0F4F7" stroke-width="1.5"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    outline: 2px solid var(--e-global-color-primary, #0054CD) !important;
    outline-offset: 3px !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedSubmit button.loading {
    display: none !important;
}

/* --------------------------------------------------------------------------
   5. HOVER — accent (zielony), tak samo jak #mlb2-27138772
   -------------------------------------------------------------------------- */

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:hover,
.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedWrapper .ml-form-embedBody .ml-form-embedSubmit button.primary:focus-visible {
    background-color: var(--e-global-color-accent, #00E9A5) !important;
    border-color: var(--e-global-color-accent, #00E9A5) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedSubmit:hover::after,
.form-publikacja-1 #mlb2-30236189.ml-form-embedContainer .ml-form-embedSubmit:focus-within::after {
    border-left-color: var(--e-global-color-primary, #0054CD);
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="14" viewBox="0 0 24 14" fill="none"><path d="M0 7H23" stroke="%230054CD" stroke-width="1.5"/><path d="M16 1L22 7L16 13" stroke="%230054CD" stroke-width="1.5"/></svg>');
}

/* --------------------------------------------------------------------------
   6. Ekran sukcesu
   -------------------------------------------------------------------------- */

/* Ekran sukcesu w ciemnej sekcji (#form-ciemny) — jasne tło i kontrastowy tekst */
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-successBody {
    background-color: #FFFFFF !important;
    border: 1px solid #FFFFFF !important;
    border-radius: 0 !important;
    padding: 24px !important;
}

#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-successContent h4 {
    color: var(--e-global-color-primary, #0054CD) !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    margin: 0 0 12px 0 !important;
    text-align: left !important;
}

#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-successContent p,
#form-ciemny.form-publikacja-1 .ml-form-embedContainer .ml-form-successContent span {
    color: var(--e-global-color-secondary, #01214E) !important;
    font-family: 'Proxima Nova', sans-serif !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    text-align: left !important;
}

/* ==========================================================================
   Sektor 3.0 — Search & Filter Pro: tagi aktualności
   Tryb: Choice > Checkbox
   Zakres: wyłącznie widget Elementor z klasą .sf-kategoria-tag

   Układ:
   - „Wszystkie” oraz tagi współdzielą pierwszy wiersz.
   - Brak odstępów poziomych i pionowych między pigułkami.
   - „Więcej” pozostaje absolutnie po prawej stronie pierwszego wiersza.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Reset struktury generowanej przez Search & Filter Pro
   -------------------------------------------------------------------------- */

.sf-kategoria-tag .search-filter-field,
.sf-kategoria-tag .search-filter-field__input {
    width: 100% !important;
    margin: 0 !important;
}

.sf-kategoria-tag .search-filter-input-group {
    position: relative !important;
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: stretch !important;
    gap: 0 !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    padding-right: calc(var(--sf-more-width, 140px)) !important;
    border: 0 !important;

    overflow: hidden !important;
    transition: max-height 420ms cubic-bezier(0.4, 0, 0.2, 1);
}

@media (prefers-reduced-motion: reduce) {
    .sf-kategoria-tag .search-filter-input-group {
        transition: none !important;
    }
}

/* --------------------------------------------------------------------------
   2. Każdy tag jako element flex — reset natywnego paddingu S&F Pro
   -------------------------------------------------------------------------- */

.sf-kategoria-tag .search-filter-input-checkbox,
.sf-kategoria-tag .sf-tags-all-button {
    position: relative !important;
    z-index: 1;

    display: inline-flex !important;
    flex: 1 0 auto !important;

    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
}

/*
 * S&F Pro daje wrapperowi checkboxa własny padding-top/bottom.
 * To właśnie on tworzył widoczną przerwę między wierszami.
 */
.sf-kategoria-tag .search-filter-input-checkbox {
    padding: 0 !important;
}

/* Ostatni widoczny tag nie rozciąga się przez całą resztę wiersza */
.sf-kategoria-tag .search-filter-input-checkbox.sf-tag-last {
    flex-grow: 0 !important;
}

/* Ukryte przez mechanizm „Więcej” */
.sf-kategoria-tag .search-filter-input-checkbox.sf-tag-hidden {
    display: none !important;
}

/* Początek animacji rozwijania */
.sf-kategoria-tag .search-filter-input-checkbox.sf-tag-revealing {
    opacity: 0 !important;
}

.sf-kategoria-tag .search-filter-input-checkbox {
    opacity: 1;
    transition: opacity 260ms ease;
}

/* --------------------------------------------------------------------------
   3. Natywny checkbox ukryty wizualnie, ale dostępny dla klawiatury
   -------------------------------------------------------------------------- */

.sf-kategoria-tag .search-filter-input-checkbox__input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;

    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;

    border: 0 !important;
}

/* Checkbox ma wyglądać jak dawne pigułki — bez ptaszka SVG */
.sf-kategoria-tag .search-filter-input-checkbox__control {
    display: none !important;
}

/*
 * S&F Pro zwykle daje labelowi padding-left, width:100% i display:flex.
 * Resetujemy go, by label był dokładnie wizualną pigułką.
 */
.sf-kategoria-tag .search-filter-input-checkbox__label {
    display: inline !important;
    width: auto !important;
    padding: 0 !important;

    color: inherit !important;
    font: inherit !important;
}

/* --------------------------------------------------------------------------
   4. Wspólny wygląd pigułki: checkbox label oraz „Wszystkie”
   -------------------------------------------------------------------------- */

.sf-kategoria-tag .search-filter-input-checkbox__container,
.sf-kategoria-tag .sf-tags-all-button {
    position: relative !important;
    z-index: 1;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 27px !important;
    box-sizing: border-box !important;

    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;

    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
    background-color: #FFFFFF !important;

    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-align: center !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;

    cursor: pointer !important;
    transition:
        background-color 180ms ease,
        box-shadow 180ms ease,
        color 180ms ease;
}

/* --------------------------------------------------------------------------
   5. Hover i focus
   -------------------------------------------------------------------------- */

.sf-kategoria-tag .search-filter-input-checkbox__container:hover,
.sf-kategoria-tag .sf-tags-all-button:hover,
.sf-kategoria-tag .sf-tags-more-button:hover,
.sf-kategoria-tag .sf-tags-more-button:focus-visible {
    z-index: 2;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-8210c03, #E6EEFA) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

/* Focus klawiaturą: ukryty input → widoczny label */
.sf-kategoria-tag .search-filter-input-checkbox__input:focus-visible
    + .search-filter-input-checkbox__container,
.sf-kategoria-tag .sf-tags-all-button:focus-visible {
    z-index: 5;
    outline: 2px solid var(--e-global-color-accent, #00E9A5) !important;
    outline-offset: -2px !important;
}

/* --------------------------------------------------------------------------
   6. Stan aktywny
   -------------------------------------------------------------------------- */

.sf-kategoria-tag
    .search-filter-input-checkbox--is-active
    .search-filter-input-checkbox__container,
.sf-kategoria-tag .search-filter-input-checkbox__input:checked
    + .search-filter-input-checkbox__container,
.sf-kategoria-tag .sf-tags-all-button.is-active {
    z-index: 3;
    box-shadow: inset 0 0 0 1px var(--e-global-color-primary, #0054CD) !important;
    background-color: var(--e-global-color-primary, #0054CD) !important;
    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
}

/*
 * Aktywny tag również można ponownie kliknąć, aby go odznaczyć.
 * Hover jest subtelnie ciemniejszy, żeby zaznaczyć interaktywność.
 */
.sf-kategoria-tag
    .search-filter-input-checkbox--is-active
    .search-filter-input-checkbox__container:hover,
.sf-kategoria-tag .search-filter-input-checkbox__input:checked
    + .search-filter-input-checkbox__container:hover {
    z-index: 4;
    box-shadow: inset 0 0 0 1px var(--e-global-color-secondary, #01214E) !important;
    background-color: var(--e-global-color-secondary, #01214E) !important;
    color: var(--e-global-color-3b317d9, #F0F4F7) !important;
}

/* --------------------------------------------------------------------------
   7. Przycisk „Więcej”
   -------------------------------------------------------------------------- */

.sf-kategoria-tag .sf-tags-more-button {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    z-index: 4;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;

    height: 34px !important;
    margin: 0 !important;
    padding: 0 27px !important;
    box-sizing: border-box !important;

    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
    background-color: #FFFFFF !important;

    color: #1C1C1C !important;
    font-family: var(
        --e-global-typography-accent-font-family,
        "Archivo Narrow",
        sans-serif
    ) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;

    cursor: pointer !important;
}

.sf-kategoria-tag .sf-tags-more-button::after {
    width: 0;
    height: 0;

    border-top: 10px solid var(--e-global-color-8210c03, #84B6FF);
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;

    content: "";
    transition:
        transform 220ms ease,
        border-top-color 180ms ease;
}

.sf-kategoria-tag .sf-tags-more-button:hover::after,
.sf-kategoria-tag .sf-tags-more-button:focus-visible::after {
    border-top-color: var(--e-global-color-primary, #0054CD) !important;
}

.sf-kategoria-tag
    .search-filter-input-group.is-expanded
    .sf-tags-more-button::after {
    transform: rotate(180deg);
}

/* „Wszystkie” ma zajmować tylko szerokość swojego tekstu,
   a nie rozciągać się na cały pierwszy wiersz. */
.sf-kategoria-tag .sf-tags-all-button {
    flex: 0 0 auto !important;
    width: auto !important;
}

/* --------------------------------------------------------------------------
   8. Mobile
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .sf-kategoria-tag .search-filter-input-checkbox__container,
    .sf-kategoria-tag .sf-tags-all-button,
    .sf-kategoria-tag .sf-tags-more-button {
        padding-right: 16px !important;
        padding-left: 16px !important;
    }
}


/* --------------------------------------------------------------------------
   Trzykropek dla długich tytułów postów
   -------------------------------------------------------------------------- */
.post-tytul .elementor-icon-list-text {
    display: inline-block !important;
    max-width: 35ch !important;

    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;

    vertical-align: bottom !important;
}

/* ============================================================================
   Sektor 3.0 — Mobile Mega Menu — JEDYNY, MASTER PLIK
   ============================================================================
   USUŃ z arkusza: s3-mobile-mega-menu-final.css ORAZ
   s3-mobile-typography-and-motion-patch.css — ten plik zawiera obie
   wersje połączone, poprawione i jest jedynym źródłem prawdy.

   Kluczowa poprawka: JS owija teraz podlinki karty w dodatkowe
   elementy .s3-mobile-submenu > .s3-mobile-submenu-inner. Te wrappery
   dostają display:contents na desktopie — znikają z modelu pudełkowego,
   więc NIE MOGĄ wpłynąć na układ flex karty, niezależnie od tego,
   jakie inne reguły mobile istnieją w arkuszu. Dopiero wewnątrz
   @media (max-width: 767px) stają się prawdziwym, animowanym pudełkiem
   akordeonu.
   ============================================================================ */


/* ----------------------------------------------------------------------
   1. Elementy dodane przez JS — domyślnie "przezroczyste" dla layoutu.
      Te reguły działają na WSZYSTKICH szerokościach i są celowo
      umieszczone POZA media query, żeby żadna kolejność ładowania
      plików nie mogła ich pominąć.
   ---------------------------------------------------------------------- */

.s3-menu-back {
    display: none !important;
}

.s3-mobile-card-toggle {
    display: none !important;
}

/* KLUCZOWE: na desktopie te wrappery są "przezroczyste" —
   ich dzieci (PRELEGENCI, PROGRAM...) renderują się dokładnie tak,
   jakby .s3-mobile-submenu-inner i .s3-mobile-submenu w ogóle nie
   istniały w DOM. To gwarantuje nienaruszalność desktopu. */
.s3-mobile-submenu,
.s3-mobile-submenu-inner {
    display: contents;
}


/* ----------------------------------------------------------------------
   2. Przycisk "wstecz" — CSS chevron (kształt niezależny od breakpointu,
      widoczność steruje wyłącznie sekcja 1 i sekcja 5 poniżej)
   ---------------------------------------------------------------------- */

.s3-menu-back svg,
.s3-menu-back .elementor-icon-wrapper svg {
    display: none !important;
}

.s3-menu-back {
    position: relative !important;
    align-items: center !important;
    justify-content: center !important;
}

.s3-menu-back::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 11px;
    height: 11px;
    border-right: 1px solid var(--e-global-color-accent, #00E9A5);
    border-bottom: 1px solid var(--e-global-color-accent, #00E9A5);
    content: "";
    transform: translate(-40%, -50%) rotate(135deg);
    transition: transform 180ms ease, border-color 180ms ease;
}

.s3-menu-back:hover::after,
.s3-menu-back:focus-visible::after {
    border-color: var(--e-global-color-3b317d9, #F0F4F7);
    transform: translate(-65%, -50%) rotate(135deg);
}


/* ----------------------------------------------------------------------
   3. Przełącznik podmenu karty ("v" / "^") — kształt niezależny
      od breakpointu, widoczność steruje sekcja 1 i sekcja 5.
   ---------------------------------------------------------------------- */

.s3-mobile-card-toggle {
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 0 0 12px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: var(--e-global-color-accent, #00E9A5) !important;
    cursor: pointer !important;
}

.s3-mobile-card-toggle::after {
    width: 11px;
    height: 11px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    content: "";
    transform: translateY(-3px) rotate(45deg);
    transition: transform 180ms ease;
}

.s3-menu-card.is-mobile-expanded .s3-mobile-card-toggle::after {
    transform: translateY(3px) rotate(225deg);
}

.s3-mobile-card-toggle:focus-visible {
    outline: 2px solid var(--e-global-color-accent, #00E9A5) !important;
    outline-offset: 2px !important;
}


/* ============================================================================
   MOBILE — max-width: 767px
   ============================================================================ */

@media (max-width: 767px) {

    /* ------------------------------------------------------------------
       4. Zwykły header: logo + narzędzia + hamburger
       ------------------------------------------------------------------ */

    .s3-header-inner {
        grid-template-columns: minmax(0, 1fr) auto !important;
        min-height: 64px !important;
        padding: 14px 20px !important;
    }

    .s3-header-inner > .s3-header-nav {
        display: none !important;
    }

    .s3-header-logo--default {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
    }

    .s3-header-tools {
        display: flex !important;
        align-items: center !important;
        gap: 14px !important;
    }

    .s3-menu-burger {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 31px !important;
        min-width: 31px !important;
        height: 30px !important;
        margin: 0 !important;
        padding: 0 !important;
        cursor: pointer !important;
    }

    .s3-menu-burger .elementor-icon-wrapper,
    .s3-menu-burger .elementor-icon {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 31px !important;
        height: 30px !important;
        text-decoration: none !important;
    }

    .s3-menu-burger svg {
        display: block !important;
        width: 31px !important;
        height: 18px !important;
    }

    .s3-menu-burger:focus-visible {
        outline: 2px solid var(--e-global-color-accent, #00E9A5) !important;
        outline-offset: 3px !important;
    }


    /* ------------------------------------------------------------------
       5. Nakładka mega menu — wspólna geometria
       ------------------------------------------------------------------ */

    .s3-mega-menu {
        background-color: var(--e-global-color-secondary, #01214E) !important;
    }

    .s3-mega-menu__inner {
        width: 100% !important;
        min-height: 100dvh !important;
        padding: 0 20px 40px !important;
        gap: 0 !important;
    }

    .s3-mega-menu__bar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 68px !important;
        padding: 18px 0 !important;
        column-gap: 16px !important;
    }

    .s3-mega-menu__bar .s3-header-brand {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    .s3-mega-menu__bar .s3-header-brand img {
        display: block !important;
        width: 37px !important;
        height: auto !important;
    }

    .s3-mega-menu__bar .s3-header-tools {
        grid-column: 2 !important;
        grid-row: 1 !important;
        display: flex !important;
        width: auto !important;
        min-width: 0 !important;
        gap: 14px !important;
    }

    .s3-mega-menu .s3-menu-card__image {
        display: none !important;
    }

    .s3-mega-menu__close-row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        min-height: 44px !important;
        padding: 0 0 24px !important;
    }

    .s3-menu-close,
    .s3-menu-back {
        align-items: center !important;
        justify-content: center !important;
        width: 45px !important;
        min-width: 45px !important;
        min-height: 44px !important;
        margin: 0 !important;
        cursor: pointer !important;
    }

    .s3-menu-close {
        display: inline-flex !important;
        margin-left: auto !important;
    }


    /* ------------------------------------------------------------------
       6. Poziom 1 — trzy główne działy (WEŹ UDZIAŁ / WIEDZA / O NAS)
          Aktywowany klasą .s3-mobile-root na .s3-header
       ------------------------------------------------------------------ */

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-header-nav {
        display: flex !important;
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 38px 0 0 !important;
        gap: 0 !important;
    }

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-menu-trigger {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 74px !important;
        margin: 0 !important;
        padding: 0 0 0 16px !important;
        border-left: 1px solid var(--e-global-color-accent, #00E9A5) !important;
        box-sizing: border-box !important;
    }

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-menu-trigger + .s3-menu-trigger {
        margin-top: 22px !important;
    }

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-menu-trigger::after {
        position: absolute;
        top: 50%;
        right: 2px;
        width: 11px;
        height: 11px;
        border-top: 1px solid var(--e-global-color-accent, #00E9A5);
        border-right: 1px solid var(--e-global-color-accent, #00E9A5);
        content: "";
        transform: translateY(-50%) rotate(45deg);
    }

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-menu-trigger a {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 74px !important;
        padding: 0 !important;
        border: 0 !important;

        font-family: var(
            --e-global-typography-1673dd6-font-family,
            "Archivo Narrow",
            sans-serif
        ) !important;
        font-size: 1.375rem !important;
        font-weight: 400 !important;
        letter-spacing: 0.05em !important;
        line-height: 1.2 !important;
        text-transform: uppercase !important;
        text-decoration: none !important;
        white-space: normal !important;

        color: var(--e-global-color-3b317d9, #F0F4F7) !important;
        transition: color 180ms ease !important;
    }

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-menu-trigger:active a,
    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-menu-trigger a:focus-visible {
        color: var(--e-global-color-accent, #00E9A5) !important;
    }

    .s3-header.s3-mobile-root .s3-mega-menu__body {
        display: none !important;
    }

    .s3-header.s3-mobile-root .s3-menu-back {
        display: none !important;
    }


    /* ------------------------------------------------------------------
       7. Poziom 2 — wybrany dział i jego karty
       ------------------------------------------------------------------ */

    .s3-header:not(.s3-mobile-root).is-menu-open
        .s3-mega-menu__bar .s3-header-nav {
        display: none !important;
    }

    .s3-header:not(.s3-mobile-root).is-menu-open .s3-menu-back {
        display: inline-flex !important;
    }

    .s3-mega-menu__body {
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        padding: 0 !important;
    }

    .s3-menu-panel {
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: none !important;
        gap: 0 !important;
    }

    .s3-header.is-panel-participate .s3-menu-panel--participate,
    .s3-header.is-panel-knowledge .s3-menu-panel--knowledge,
    .s3-header.is-panel-about .s3-menu-panel--about {
        display: flex !important;
    }

    .s3-header.is-panel-about .s3-menu-panel--about .s3-menu-card,
    .s3-menu-card {
        display: block !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border-left: 1px solid var(--e-global-color-accent, #00E9A5) !important;
        box-sizing: border-box !important;
    }

    .s3-menu-card + .s3-menu-card {
        margin-top: 26px !important;
    }

    .s3-menu-card__content {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 16px !important;
        box-sizing: border-box !important;
    }

    .s3-menu-card__title,
    .s3-menu-about__title {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        min-height: 64px !important;
        margin: 0 !important;
    }

    .s3-menu-card__title .elementor-heading-title,
    .s3-menu-about__title .elementor-heading-title {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .s3-menu-card__title a,
    .s3-menu-about__title a {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 64px !important;
        padding: 0 !important;

        font-size: 1.375rem !important;
        font-weight: 800 !important;
        line-height: 1.15em !important;

        color: var(--e-global-color-v4-s3_surface_page, #F0F4F7) !important;
        text-decoration: none !important;
    }

    .s3-menu-card--single-link .s3-menu-card__title a,
    .s3-menu-card--single-link .s3-menu-about__title a {
        color: var(--e-global-color-accent, #00E9A5) !important;
    }

    .s3-menu-card__text,
    .s3-menu-about__contact {
        display: none !important;
    }

    .s3-mobile-card-toggle {
        display: inline-flex !important;
    }

    .s3-menu-card__content .btn-thr,
    .s3-menu-card__content .elementor-button {
        display: none !important;
    }


    /* ------------------------------------------------------------------
       8. Akordeon podmenu karty — TERAZ na wrapperach dodanych przez JS
          (.s3-mobile-submenu / .s3-mobile-submenu-inner), a nie na
          pojedynczych linkach. To one animują się jako JEDNA całość,
          co jest zarówno prostsze, jak i wygląda płynniej.
       ------------------------------------------------------------------ */

    .s3-mobile-submenu {
        display: block !important;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition: max-height 320ms ease, opacity 220ms ease;
    }

    .s3-mobile-submenu-inner {
        display: block !important;
        padding-top: 18px;
    }

    .s3-menu-card.is-mobile-expanded .s3-mobile-submenu {
        /* Wystarczająco dużo miejsca na max. 5 pozycji podmenu
           (np. karta Fundusz) — nie trzeba liczyć scrollHeight w JS. */
        max-height: 20rem;
        opacity: 1;
    }

    .s3-menu-card__link,
    .s3-menu-about__link {
        margin: 0 !important;
    }

    .s3-menu-card__link .elementor-heading-title,
    .s3-menu-about__link .elementor-heading-title {
        margin: 0 !important;
    }

    .s3-menu-card__link a,
    .s3-menu-about__link a {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 48px !important;
        padding: 0 !important;

        font-family: var(
            --e-global-typography-390bdd1-font-family,
            "Proxima Nova",
            sans-serif
        ) !important;
        font-size: 1.0625rem !important;
        font-weight: 400 !important;
        line-height: 1.3 !important;

        color: var(--e-global-color-v4-s3_surface_page, #F0F4F7) !important;
        text-decoration: none !important;
    }

    .s3-menu-card__link a:active,
    .s3-menu-about__link a:active,
    .s3-menu-card__link a:focus-visible,
    .s3-menu-about__link a:focus-visible {
        color: var(--e-global-color-accent, #00E9A5) !important;
    }


    /* ------------------------------------------------------------------
       9. Animacja przejścia poziom 1 → poziom 2
       ------------------------------------------------------------------ */

    @keyframes s3MobileMenuFadeIn {
        from {
            opacity: 0;
            transform: translateX(16px);
        }
        to {
            opacity: 1;
            transform: translateX(0);
        }
    }

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-header-nav,
    .s3-mega-menu__body {
        animation: s3MobileMenuFadeIn 280ms ease forwards;
    }
}


/* ----------------------------------------------------------------------
   10. Reduced motion
   ---------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .s3-menu-back::after,
    .s3-mobile-card-toggle::after {
        transition: none !important;
    }

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-header-nav,
    .s3-mega-menu__body {
        animation: none !important;
    }

    .s3-mobile-submenu {
        transition: none !important;
    }
}

/* ============================================================================
   Sektor 3.0 — Mobile Mega Menu: PATCH #2
   Dołóż na SAMYM KOŃCU arkusza (po s3-mobile-mega-menu-master.css)
   ============================================================================ */

/* ----------------------------------------------------------------------
   0. Zgodność nazw z JS: skrypt tworzy .s3-mobile-submenu__inner
      (podwójny podkreślnik), a nie .s3-mobile-submenu-inner.
      Dopisujemy poprawną nazwę, żeby display:contents faktycznie
      zadziałał na desktopie.
   ---------------------------------------------------------------------- */

.s3-mobile-submenu__inner {
    display: contents;
}

@media (max-width: 767px) {
    .s3-mobile-submenu__inner {
        display: block !important;
        padding-top: 18px;
    }
}


@media (max-width: 767px) {

    /* ------------------------------------------------------------------
       1. Poziom 1 — WEŹ UDZIAŁ / WIEDZA / O NAS
          Naprawa: .elementor-heading-title musi wypełnić całą szerokość
          triggera, inaczej <a> ma width:100% liczone z wąskiego,
          skurczonego do treści rodzica.
       ------------------------------------------------------------------ */

    .s3-header.s3-mobile-root .s3-mega-menu__bar .s3-menu-trigger .elementor-heading-title {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
    }


    /* ------------------------------------------------------------------
       2. Karty typu B (Śniadania z AI, Nagroda PAFW, Portal, E-learning,
          Publikacje, Aktualności, Kontakt) — poprawki:
          a) tytuł jest biały domyślnie, zielony dopiero po interakcji
             (tak jak na desktopie) — zamiast permanentnie zielonego
          b) opis pod tytułem jest WIDOCZNY, biały, i klikalny na całej
             szerokości swojego wiersza
       ------------------------------------------------------------------ */

    /* 2a. Cofnięcie permanentnego accentu — domyślnie biały */
    .s3-menu-card--single-link .s3-menu-card__title a,
    .s3-menu-card--single-link .s3-menu-about__title a {
        color: var(--e-global-color-v4-s3_surface_page, #F0F4F7) !important;
    }

    /* Zielony TYLKO przy realnym dotyku/fokusie — zgodnie z resztą menu */
    .s3-menu-card--single-link .s3-menu-card__title a:active,
    .s3-menu-card--single-link .s3-menu-about__title a:active,
    .s3-menu-card--single-link .s3-menu-card__title a:focus-visible,
    .s3-menu-card--single-link .s3-menu-about__title a:focus-visible {
        color: var(--e-global-color-accent, #00E9A5) !important;
    }

    
}


/* ==========================================================================
   Sektor 3.0 — Person Modal: korekta zgodna z finalną makietą
   Wklej NA KOŃCU obecnego <style id="s3-person-modal-css">
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. Popup — maks. 960 px, min. wysokość 555 px
   -------------------------------------------------------------------------- */

.s3pm-dialog {
    width: min(960px, calc(100vw - 72px)) !important;
    max-width: 960px !important;

    /*
     * Dialog może mieć większą wysokość, jeżeli bio jest długie,
     * ale nie będzie niższy niż projektowe 555 px.
     */
    min-height: 555px !important;
    max-height: min(760px, calc(100vh - 72px)) !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    color: #1C1C1C !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: #FFFFFF !important;
    box-shadow: 0 18px 42px rgba(7, 39, 89, 0.14) !important;
}

.s3pm-content {
    display: grid !important;

    /*
     * Lewa kolumna ma zawsze 294 px.
     * Prawa kolumna pobiera całą pozostałą przestrzeń.
     */
    grid-template-columns: 294px minmax(0, 1fr) !important;

    width: 100% !important;
    min-height: 555px !important;
}


/* --------------------------------------------------------------------------
   2. Lewa kolumna profilu — dokładnie 294 px
   -------------------------------------------------------------------------- */

.s3pm-profile {
    display: flex !important;
    flex-direction: column !important;

    width: 294px !important;
    min-width: 294px !important;
    max-width: 294px !important;

    background-color: #F0F6FC !important;
    border-right: 1px solid #84B6FF !important;
}


/* --------------------------------------------------------------------------
   3. Zdjęcie profilowe — dokładnie 294 × 281 px
   -------------------------------------------------------------------------- */

.s3pm-media {
    flex: 0 0 281px !important;

    width: 294px !important;
    height: 281px !important;

    overflow: hidden !important;
    background-color: #0758C9 !important;
}

.s3pm-media img {
    display: block !important;

    width: 294px !important;
    height: 281px !important;

    /*
     * Zdjęcia mogą mieć inne proporcje źródłowe.
     * object-fit: cover utrzymuje wymiar makiety bez deformowania twarzy.
     */
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center !important;
}


/* --------------------------------------------------------------------------
   4. Dane osoby — padding 24 px
   -------------------------------------------------------------------------- */

.s3pm-profile-data {
    padding: 24px !important;
}

.s3pm-profile-data h2 {
    margin: 0 0 8px !important;

    color: #1C1C1C !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 22px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
}

.s3pm-affiliation {
    margin: 0 !important;

    color: #1C1C1C !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    letter-spacing: 0 !important;
}


/* --------------------------------------------------------------------------
   5. Treść bio — Proxima Nova 18 / 26
   -------------------------------------------------------------------------- */

.s3pm-body {
    min-width: 0 !important;

    /*
     * Zostawiamy przestrzeń na ikonę zamknięcia w prawym górnym rogu.
     * Lewy padding jest mniejszy niż w poprzedniej wersji, aby przy
     * popupie 960 px tekst nie robił się zbyt wąski.
     */
    padding: 72px 56px 56px 48px !important;

    color: #1C1C1C !important;
}

.s3pm-bio {
    max-width: none !important;

    color: #1C1C1C !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 26px !important;
    letter-spacing: 0 !important;
}

.s3pm-bio p {
    margin: 0 0 26px !important;
}

.s3pm-bio > :first-child {
    margin-top: 0 !important;
}

.s3pm-bio > :last-child {
    margin-bottom: 0 !important;
}

/*
 * WordPress może generować puste <p> przed lub po rzeczywistym tekście
 * bio. Nie mogą tworzyć pustego odstępu w oknie.
 */
.s3pm-bio p:empty {
    display: none !important;
}


/* --------------------------------------------------------------------------
   6. Przycisk zamknięcia
   -------------------------------------------------------------------------- */

.s3pm-close {
    top: 24px !important;
    right: 24px !important;

    width: 42px !important;
    height: 42px !important;

    color: #0054CD !important;
    transition:
        color 180ms ease,
        transform 180ms ease !important;
}

/*
 * SVG ma w HTML sztywno wpisany stroke="#0054cd".
 * currentColor nie wystarczy, więc sterujemy liniami bezpośrednio.
 */
.s3pm-close svg line {
    stroke: #0054CD !important;
    transition: stroke 180ms ease !important;
}

.s3pm-close:hover {
    color: #01214E !important;
    transform: rotate(90deg) !important;
}

.s3pm-close:hover svg line {
    stroke: #01214E !important;
}

.s3pm-close:focus-visible {
    outline: 3px solid #00E9A5 !important;
    outline-offset: 3px !important;
}


/* --------------------------------------------------------------------------
   7. Mobile — nie dziedziczy sztywnych desktopowych wymiarów
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .s3pm-dialog {
        width: calc(100vw - 32px) !important;
        max-width: none !important;

        min-height: 0 !important;
        max-height: calc(100vh - 32px) !important;
    }

    .s3pm-content {
        grid-template-columns: 1fr !important;
        min-height: 0 !important;
    }

    .s3pm-profile {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        border-right: 0 !important;
        border-bottom: 1px solid #84B6FF !important;
    }

    .s3pm-media {
        width: 100% !important;
        height: auto !important;
        flex: 0 0 auto !important;
    }

    .s3pm-media img {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: 390px !important;

        aspect-ratio: 1.15 / 1 !important;
        object-fit: cover !important;
    }

    .s3pm-profile-data {
        padding: 24px !important;
    }

    .s3pm-profile-data h2 {
        font-size: 22px !important;
        line-height: 1.15 !important;
    }

    .s3pm-body {
        padding: 32px 24px 38px !important;
    }

    .s3pm-bio {
        font-size: 18px !important;
        line-height: 26px !important;
    }

    .s3pm-close {
        top: 12px !important;
        right: 10px !important;
    }

    .s3pm-close svg line {
        stroke: #FFFFFF !important;
    }

    .s3pm-close:hover svg line {
        stroke: #00E9A5 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .s3pm-close,
    .s3pm-close svg line {
        transition: none !important;
    }

    .s3pm-close:hover {
        transform: none !important;
    }
}

/* ==========================================================================
   Sektor 3.0 — Pole wyszukiwania S&F Pro (.szukanie-z-lupy)
   Stylizowany interfejs wyszukiwarki dopasowany do systemu projektowego
   ========================================================================== */

/* 1. Obudowa pola (kontener główny) */
.szukanie-z-lupy .search-filter-input-text {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
    border: none !important;
    border-radius: 0 !important;
    background-color: #FFFFFF !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
    transition: box-shadow 180ms ease !important;
}

/* Stan skupienia (Focus) na całym obramowaniu */
.szukanie-z-lupy .search-filter-input-text:focus-within {
    box-shadow: inset 0 0 0 1.5px var(--e-global-color-primary, #0054CD) !important;
}

/* 2. Pole tekstowe [type=text] */
.szukanie-z-lupy .search-filter-input-text__input {
    order: 1 !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    box-shadow: none !important;

    color: var(--e-global-color-secondary, #01214E) !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    text-align: left !important;
    text-overflow: ellipsis !important;
}

/* Placeholdery dla różnych przeglądarek */
.szukanie-z-lupy .search-filter-input-text__input::placeholder {
    color: #5F6B9D !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    opacity: 1 !important;
}

.szukanie-z-lupy .search-filter-input-text__input::-moz-placeholder {
    color: #5F6B9D !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    opacity: 1 !important;
}

/* 3. Przycisk czyszczenia tekstów ("X") */
.szukanie-z-lupy .search-filter-input-text__clear-button {
    order: 2 !important;
    flex: 0 0 auto !important;
    margin-left: 8px !important;
    cursor: pointer !important;
    opacity: 0.6;
    transition: opacity 150ms ease !important;
}

.szukanie-z-lupy .search-filter-input-text__clear-button:hover,
.szukanie-z-lupy .search-filter-input-text__clear-button:focus-visible {
    opacity: 1 !important;
}

/* 4. Ikona Lupy po prawej stronie (wygenerowana jako pseudo-element ::after) */
.szukanie-z-lupy .search-filter-input-text::after {
    content: "" !important;
    order: 3 !important;
    display: inline-block !important;
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    margin-left: 8px !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230054CD" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    pointer-events: none !important;
}

/* ==========================================================================
   Sektor 3.0 — Pole wyszukiwania S&F Pro (.szukanie-z-lupy) w tym Popup
   ========================================================================== */

/* 1. Obudowa pola (kontener główny) */
.szukanie-z-lupy .search-filter-input-text {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
    border: none !important;
    border-radius: 0 !important;
    background-color: #FFFFFF !important;
    box-shadow: inset 0 0 0 1px var(--e-global-color-8210c03, #84B6FF) !important;
    transition: box-shadow 180ms ease !important;
}

/* Stan skupienia (Focus) */
.szukanie-z-lupy .search-filter-input-text:focus-within {
    box-shadow: inset 0 0 0 1.5px var(--e-global-color-primary, #0054CD) !important;
}

/* 2. Pole tekstowe [type=text] */
.szukanie-z-lupy .search-filter-input-text__input {
    order: 1 !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    box-shadow: none !important;

    color: var(--e-global-color-secondary, #01214E) !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    text-align: left !important;
    text-overflow: ellipsis !important;
}

/* Placeholdery */
.szukanie-z-lupy .search-filter-input-text__input::placeholder {
    color: #5F6B9D !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    opacity: 1 !important;
}

.szukanie-z-lupy .search-filter-input-text__input::-moz-placeholder {
    color: #5F6B9D !important;
    font-family: "Proxima Nova", sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 17px !important;
    opacity: 1 !important;
}

/* 3. Przycisk czyszczenia "X" z S&F Pro */
.szukanie-z-lupy .search-filter-input-text__clear-button {
    order: 2 !important;
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    margin-left: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    opacity: 0.7 !important;
    transition: opacity 150ms ease !important;
}

.szukanie-z-lupy .search-filter-input-text__clear-button:hover,
.szukanie-z-lupy .search-filter-input-text__clear-button:focus-visible {
    opacity: 1 !important;
}

.szukanie-z-lupy .search-filter-input-text__clear-button svg {
    width: 14px !important;
    height: 14px !important;
    fill: var(--e-global-color-primary, #0054CD) !important;
    color: var(--e-global-color-primary, #0054CD) !important;
}

/* 4. Ikona Lupy po prawej (widoczna TYLKO gdy pole jest puste i nie ma ikony X) */
.szukanie-z-lupy .search-filter-input-text:not(:has(.search-filter-input-text__clear-button:not([hidden]):not([style*="display: none"]))) ::after,
.szukanie-z-lupy .search-filter-input-text__input:placeholder-shown + .search-filter-input-text__clear-button {
    /* Jeśli wtyczka ukrywa X przez style inline / atrybuty */
}

/* Sterowanie widocznością lupy: pojawia się gdy brak aktywnej ikony X */
.szukanie-z-lupy .search-filter-input-text::after {
    content: "" !important;
    order: 3 !important;
    display: inline-block !important;
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    margin-left: 8px !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230054CD" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>')!important;background-repeat:no-repeat!important;background-position:center!important;background-size:contain!important;pointer-events:none!important}.szukanie-z-lupy .search-filter-input-text:has(.search-filter-input-text__clear-button:not([style*="display: none"]):not([hidden]))::after{display:none!important}.kafel-link:hover .elementor-heading-title,.kafel-link:focus-visible .elementor-heading-title{color:var(--e-global-color-primary)!important;transition:color 180ms ease!important}@media (max-width:767px){.elementor-widget-loop-carousel .swiper{overflow:visible!important}.elementor-widget-loop-carousel .swiper-slide{width:193px!important;flex-shrink:0!important}}.sf-kategoria-tag .search-filter-input-group{overflow:hidden!important;transition:max-height 0.3s ease-in-out}.sf-kategoria-tag .search-filter-input-checkbox.sf-tag-hidden{display:none!important}.sf-tags-more-button,.sf-tags-all-button{cursor:pointer}