:root {
	--wd-text-font: "Inter", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(189,185,174);
	--wd-text-font-size: 16px;
	--wd-title-font: "Cinzel Decorative", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 400;
	--wd-title-transform: uppercase;
	--wd-title-color: rgb(241,184,44);
	--wd-entities-title-font: "Cinzel Decorative", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 400;
	--wd-entities-title-transform: uppercase;
	--wd-entities-title-color: rgb(245,238,222);
	--wd-entities-title-color-hover: rgb(241, 184, 44);
	--wd-alternative-font: "Cinzel Decorative", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Cinzel Decorative", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 400;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: rgb(189,185,174);
	--wd-widget-title-font-size: 20px;
	--wd-header-el-font: "Inter", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 400;
	--wd-header-el-transform: none;
	--wd-header-el-font-size: 14px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(241,184,44);
	--wd-alternative-color: rgb(106,52,175);
	--btn-default-font-family: "Inter", Arial, Helvetica, sans-serif;
	--btn-default-font-weight: 400;
	--btn-default-transform: uppercase;
	--btn-default-bgcolor: rgb(106,52,175);
	--btn-default-bgcolor-hover: rgb(65,22,120);
	--btn-accented-bgcolor: rgb(245,238,222);
	--btn-accented-bgcolor-hover: rgb(241,184,44);
	--wd-form-brd-width: 1px;
	--notices-success-bg: rgb(245,238,222);
	--notices-success-color: rgb(245,238,222);
	--notices-warning-bg: rgb(245,238,222);
	--notices-warning-color: #fff;
	--wd-link-color: rgb(245,238,222);
	--wd-link-color-hover: rgb(241,184,44);
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: #111111;
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: #ffffff;
	background-image: none;
}
html .wd-nav.wd-nav-main > li > a {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 18px;
	text-transform: none;
	color: rgb(245,238,222);
}
html .wd-nav.wd-nav-main > li:hover > a, html .wd-nav.wd-nav-main > li.current-menu-item > a {
	color: rgb(241,184,44);
}
.wd-nav-main .wd-dropdown-menu a {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 18px;
	text-transform: none;
	color: rgb(245,238,222);
}
.wd-nav-main .wd-dropdown-menu a:hover {
	color: rgb(241,184,44);
}
.single-post .wd-post-author a, .single-post .wp-block-latest-posts__post-title, .single-post .wp-block-categories a, .single-post .wd-page-nav-btn .wd-label {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	text-transform: none;
	color: rgb(189,185,174);
}
.single-post .wd-post-author a:hover, .single-post .wp-block-latest-posts__post-title:hover, .single-post .wp-block-categories a:hover, .single-post .wd-page-nav-btn .wd-label:hover {
	color: rgb(245,238,222);
}
.single-post .wd-post-author, .single-post .wd-post-date, .single-post .wp-block-search__label {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	text-transform: none;
	color: rgb(245,238,222);
}
.single-post .wd-post-author:hover, .single-post .wd-post-date:hover, .single-post .wp-block-search__label:hover {
	color: rgb(245,238,222);
}
.blog-post-loop .wd-post-author > a.author, .blog-post-loop .read-more-section a, .sidebar-container .widget_recent_entries a, .sidebar-container .wp-block-latest-posts__post-title, .sidebar-container .widget_categories a, .sidebar-container .wp-block-categories a {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	text-transform: none;
	color: rgb(189,185,174);
}
.blog-post-loop .wd-post-author > a.author:hover, .blog-post-loop .read-more-section a:hover, .sidebar-container .widget_recent_entries a:hover, .sidebar-container .wp-block-latest-posts__post-title:hover, .sidebar-container .widget_categories a:hover, .sidebar-container .wp-block-categories a:hover {
	color: rgb(245,238,222);
}
.blog-post-loop .wd-post-author > span, .sidebar-container .widget_search .widget-title, .sidebar-container .wp-block-search__label {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	text-transform: none;
	color: rgb(189,185,174);
}
.blog-post-loop .wd-post-author > span:hover, .sidebar-container .widget_search .widget-title:hover, .sidebar-container .wp-block-search__label:hover {
	color: rgb(245,238,222);
}
.blog-post-loop .wd-post-cat > a, .single-post .wd-single-post-header .wd-post-cat > a {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 22px;
	text-transform: none;
	color: rgb(245,238,222);
}
.blog-post-loop .wd-post-cat > a:hover, .single-post .wd-single-post-header .wd-post-cat > a:hover {
	color: rgb(241,184,44);
}
.mobile-nav .wd-nav-mobile > li > a {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	text-transform: none;
	color: rgb(189,185,174);
}
.mobile-nav .wd-nav-mobile > li > a:hover {
	color: rgb(245,238,222);
}
.mobile-nav .wd-nav-mobile .wd-sub-menu li > a {
	font-family: "Inter", Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 18px;
	text-transform: none;
	color: rgb(189,185,174);
}
.mobile-nav .wd-nav-mobile .wd-sub-menu li > a:hover {
	color: rgb(245,238,222);
}
:is(.page, .search-no-results, .error404) :is(.wd-page-content, .whb-header) {
	background-color: rgb(0,0,0);
	background-image: url(https://iluzjonista.linkdoczegos.pl/wp-content/uploads/2026/07/tlo-general.jpg);
}
.woodmart-archive-shop:not(.single-product) :is(.wd-page-content, .whb-header) {
	background-color: rgb(0,0,0);
	background-image: none;
}
.single-product :is(.wd-page-content, .whb-header) {
	background-color: rgb(0,0,0);
	background-image: none;
}
.woodmart-archive-blog :is(.wd-page-content, .whb-header) {
	background-color: rgba(0,0,0,0);
	background-image: url(https://iluzjonista.linkdoczegos.pl/wp-content/uploads/2026/07/tlo-blogi-scaled.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center center;
}
.single-post :is(.wd-page-content, .whb-header) {
	background-color: rgba(0,0,0,0);
	background-image: url(https://iluzjonista.linkdoczegos.pl/wp-content/uploads/2026/07/tlo-blogi-scaled.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	background-position: center center;
}
.woodmart-archive-portfolio :is(.wd-page-content, .whb-header) {
	background-color: rgb(0,0,0);
	background-image: none;
}
.single-portfolio :is(.wd-page-content, .whb-header) {
	background-color: rgb(0,0,0);
	background-image: none;
}
body, [class*=color-scheme-light], [class*=color-scheme-dark], .wd-search-form[class*="wd-header-search-form"] form.searchform, .wd-el-search .searchform {
	--wd-form-color: rgb(189,185,174);
	--wd-form-placeholder-color: rgb(189,185,174);
	--wd-form-brd-color: rgb(141,126,147);
	--wd-form-brd-color-focus: rgb(245,238,222);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
:root{
--wd-container-w: 1222px;
--wd-form-brd-radius: 0px;
--btn-default-color: #fff;
--btn-default-color-hover: #fff;
--btn-accented-color: #333;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 0px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-default-box-shadow-active: none;
--btn-default-bottom: 0px;
--btn-accented-brd-radius: 5px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
--wd-brd-radius: 8px;
}

@media (min-width: 1222px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: #0a0a0a;
}

/* =========================================================
   KLASY UŻYWANE W GLOBALNYM CSS
   ========================================================= */

/*
   KLASY DODAWANE RĘCZNIE W ELEMENTORZE:

   .heading-reveal
   — klasa dla widżetów nagłówków z animacją odsłonięcia tekstu.

   .reveal-up
   — klasa dla kontenerów i widżetów pojawiających się od dołu.

   .bw-gallery
   — klasa dla galerii czarno-białej, która odzyskuje kolory po najechaniu.

   .fit-cards
   — klasa dla głównego kontenera, w którym znajdują się nakładające się karty.

   .fit-card
   — klasa dla każdej pojedynczej karty wewnątrz kontenera .fit-cards.
*/

/*
   KLASY SYSTEMOWE WORDPRESSA, ELEMENTORA I MOTYWU WOODMART:

   body.single-post
   — pojedynczy wpis blogowy.

   .wp-block-search
   — blok wyszukiwarki WordPressa.

   .whb-header
   — główny nagłówek motywu WoodMart.

   .whb-main-header
   — główna część nagłówka WoodMart.

   .whb-overcontent
   — nagłówek umieszczony na treści strony.

   .whb-sticked
   — nagłówek przyklejony po przewinięciu strony.

   .mobile-nav
   — panel menu mobilnego WoodMart.

   .wd-close-side
   — przyciemnione tło za otwartym menu mobilnym.

   .wd-nav-mobile
   — lista pozycji menu mobilnego.

   .elementor-invisible
   — klasa dodawana przez Elementor przed uruchomieniem animacji.

   .animated
   — klasa dodawana przez Elementor po uruchomieniu animacji.
*/


/* =========================================================
   1. WPISY BLOGOWE — UKRYCIE OBRAZKA WYRÓŻNIAJĄCEGO
   ========================================================= */

/* 1.1 UKRYCIE GŁÓWNEGO OBRAZKA NA POJEDYNCZYM WPISIE */
body.single-post .blog-post-single .post-img-wrapp,
body.single-post .blog-post-single .entry-thumbnail,
body.single-post .post-single-page .post-img-wrapp,
body.single-post .post-single-page .entry-thumbnail,
body.single-post article.post img.wp-post-image {
  display: none !important;
}


/* =========================================================
   2. WYSZUKIWARKA WORDPRESSA — UKŁAD POLA I PRZYCISKU
   ========================================================= */

/* 2.1 USTAWIENIE POLA I PRZYCISKU JEDEN POD DRUGIM */
.wp-block-search .wp-block-search__inside-wrapper {
  display: block;
}

/* 2.2 ODSTĘP NAD PRZYCISKIEM WYSZUKIWANIA */
.wp-block-search .wp-block-search__button {
  margin: 8px 0 0 !important;
}


/* =========================================================
   3. NAGŁÓWEK STRONY — TŁO, SZKŁO I ZAOKRĄGLENIA
   ========================================================= */

/* 3.1 PŁYNNE PRZEJŚCIE MIĘDZY STANAMI NAGŁÓWKA */
.whb-header .whb-main-header {
  transition:
    background-color .3s ease,
    box-shadow .3s ease,
    backdrop-filter .3s ease;
}

/* 3.2 TŁO ZWYKŁEGO ORAZ PRZYKLEJONEGO NAGŁÓWKA */
.whb-header:not(.whb-overcontent) .whb-main-header,
.whb-header.whb-sticked .whb-main-header {
  background: rgba(34, 15, 47, .72) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  border-radius: 0 0 40px 40px;
  box-shadow: 0 12px 35px rgba(12, 4, 18, .35);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
  backdrop-filter: blur(18px) saturate(145%);
}

/* 3.3 USUNIĘCIE TŁA Z WEWNĘTRZNYCH WIERSZY NAGŁÓWKA */
.whb-header:not(.whb-overcontent) .whb-main-header > .whb-row,
.whb-header.whb-sticked .whb-main-header > .whb-row {
  background: transparent !important;
}

/* 3.4 PRZEZROCZYSTY NAGŁÓWEK OVERLAP PRZED PRZEWIJANIEM */
.whb-header.whb-overcontent:not(.whb-sticked) .whb-main-header,
.whb-header.whb-overcontent:not(.whb-sticked) .whb-main-header > .whb-row {
  background: transparent !important;
  border-color: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* 3.5 TABLET — MNIEJSZE ZAOKRĄGLENIE NAGŁÓWKA */
@media (max-width: 1024px) {
  .whb-header:not(.whb-overcontent) .whb-main-header,
  .whb-header.whb-sticked .whb-main-header {
    border-radius: 0 0 28px 28px;
  }
}

/* 3.6 TELEFON — MNIEJSZE ZAOKRĄGLENIE NAGŁÓWKA */
@media (max-width: 767px) {
  .whb-header:not(.whb-overcontent) .whb-main-header,
  .whb-header.whb-sticked .whb-main-header {
    border-radius: 0 0 20px 20px;
  }
}


/* =========================================================
   4. MENU MOBILNE — ANIMACJA, TŁO I WYGLĄD POZYCJI
   ========================================================= */

@media (max-width: 1024px) {

  /* 4.1 ZAMKNIĘTY PANEL MENU — POZYCJA POCZĄTKOWA */
  .mobile-nav.wd-side-hidden {
    background:
      linear-gradient(
        180deg,
        rgba(35, 16, 48, .98),
        rgba(10, 8, 14, .99)
      );
    border-left: 1px solid rgba(255, 255, 255, .1);
    border-radius: 30px 0 0 30px;
    box-shadow: -20px 0 50px rgba(0, 0, 0, .4);

    opacity: 0;
    transform: translate3d(105%, 0, 0) scale(.98);
    transition:
      transform .55s cubic-bezier(.22, 1, .36, 1),
      opacity .35s ease;
  }

  /* 4.2 OTWARTY PANEL MENU — WJAZD Z PRAWEJ STRONY */
  .mobile-nav.wd-side-hidden.wd-opened {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }

  /* 4.3 TŁO ZA ZAMKNIĘTYM MENU */
  .wd-close-side {
    background: rgba(12, 4, 18, 0);
    -webkit-backdrop-filter: blur(0);
    backdrop-filter: blur(0);
    transition:
      background-color .4s ease,
      backdrop-filter .4s ease;
  }

  /* 4.4 PRZYCIEMNIENIE I ROZMYCIE STRONY ZA OTWARTYM MENU */
  .wd-close-side.wd-close-side-opened {
    background: rgba(12, 4, 18, .62);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }

  /* 4.5 POZYCJE MENU PRZED URUCHOMIENIEM ANIMACJI */
  .mobile-nav .wd-nav-mobile > li,
  .mobile-nav .wd-nav-mobile .wd-sub-menu > li {
    opacity: 0;
    transform: translateX(16px);
    transition:
      opacity .35s ease,
      transform .45s cubic-bezier(.22, 1, .36, 1);
  }

  /* 4.6 POJAWIENIE SIĘ POZYCJI PO OTWARCIU MENU */
  .mobile-nav.wd-opened .wd-nav-mobile.wd-active > li,
  .mobile-nav.wd-opened
    .wd-nav-mobile.wd-active
    .wd-sub-menu > li {
    opacity: 1;
    transform: translateX(0);
  }

  /* 4.7 STOPNIOWE OPÓŹNIENIE KOLEJNYCH POZYCJI MENU */
  .mobile-nav .wd-nav-mobile li:nth-child(1) {
    transition-delay: .04s;
  }

  .mobile-nav .wd-nav-mobile li:nth-child(2) {
    transition-delay: .07s;
  }

  .mobile-nav .wd-nav-mobile li:nth-child(3) {
    transition-delay: .10s;
  }

  .mobile-nav .wd-nav-mobile li:nth-child(4) {
    transition-delay: .13s;
  }

  .mobile-nav .wd-nav-mobile li:nth-child(5) {
    transition-delay: .16s;
  }

  .mobile-nav .wd-nav-mobile li:nth-child(6) {
    transition-delay: .19s;
  }

  .mobile-nav .wd-nav-mobile li:nth-child(7) {
    transition-delay: .22s;
  }

  .mobile-nav .wd-nav-mobile li:nth-child(8) {
    transition-delay: .25s;
  }
}

@media (max-width: 1024px) {

  /* 4.8 GŁÓWNE TŁO PANELU MENU MOBILNEGO */
  .mobile-nav {
    background: #010101 !important;
  }

  /* 4.9 WEWNĘTRZNE ODSTĘPY LISTY MENU */
  .mobile-nav .wd-nav-mobile {
    padding: 24px 22px;
  }

  /* 4.10 USUNIĘCIE DOMYŚLNYCH LINII, TŁA I CIENI */
  .mobile-nav .wd-nav-mobile li,
  .mobile-nav .wd-nav-mobile li > a,
  .mobile-nav .wd-nav-mobile .wd-sub-menu,
  .mobile-nav .wd-nav-mobile .wd-nav-opener {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* 4.11 ODSTĘPY POMIĘDZY GŁÓWNYMI POZYCJAMI MENU */
  .mobile-nav .wd-nav-mobile > li {
    position: relative;
    margin-bottom: 4px;
  }

  /* 4.12 WYMIARY I ODSTĘPY GŁÓWNYCH LINKÓW MENU */
  .mobile-nav .wd-nav-mobile > li > a {
    min-height: 58px;
    padding: 0 54px 0 18px;
    border-radius: 12px;
    transition:
      color .25s ease,
      background-color .25s ease,
      padding-left .25s ease;
  }

  /* 4.13 WYGLĄD AKTYWNEJ, OTWARTEJ LUB NAJECHANEJ POZYCJI */
  .mobile-nav .wd-nav-mobile > li:hover > a,
  .mobile-nav .wd-nav-mobile > li.wd-opened > a,
  .mobile-nav .wd-nav-mobile > li.current-menu-item > a {
    color: #f1b82c !important;
    background: #121212 !important;
    padding-left: 24px;
  }

  /* 4.14 PIONOWY ZŁOTY AKCENT PRZY POZYCJI MENU */
  .mobile-nav .wd-nav-mobile > li > a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 4px;
    width: 3px;
    height: 0;
    border-radius: 3px;
    background: #f1b82c;
    transform: translateY(-50%);
    transition: height .25s ease;
  }

  /* 4.15 ROZWINIĘCIE ZŁOTEGO AKCENTU PRZY AKTYWNEJ POZYCJI */
  .mobile-nav .wd-nav-mobile > li:hover > a::before,
  .mobile-nav .wd-nav-mobile > li.wd-opened > a::before,
  .mobile-nav .wd-nav-mobile > li.current-menu-item > a::before {
    height: 26px;
  }

  /* 4.16 SZEROKOŚĆ I KOLOR STRZAŁKI PODMENU */
  .mobile-nav .wd-nav-mobile .wd-nav-opener {
    width: 50px;
    color: #f1b82c;
  }

  /* 4.17 ODSTĘPY WEWNĄTRZ PODMENU */
  .mobile-nav .wd-nav-mobile .wd-sub-menu {
    padding: 4px 0 12px 20px;
  }

  /* 4.18 WYGLĄD LINKÓW W PODMENU */
  .mobile-nav .wd-nav-mobile .wd-sub-menu li > a {
    min-height: auto;
    padding: 11px 16px;
    color: rgba(255, 255, 255, .7);
    transition:
      color .25s ease,
      padding-left .25s ease;
  }

  /* 4.19 PRZESUNIĘCIE LINKU PODMENU PO NAJECHANIU */
  .mobile-nav .wd-nav-mobile .wd-sub-menu li > a:hover {
    color: #fff;
    padding-left: 22px;
  }
}


/* =========================================================
   5. NAGŁÓWKI ELEMENTORA — TEATRALNE ODSŁONIĘCIE TEKSTU
   KLASA DODAWANA RĘCZNIE: heading-reveal
   ========================================================= */

/* 5.1 UKRYCIE NAGŁÓWKA PRZED URUCHOMIENIEM ANIMACJI */
.heading-reveal.elementor-invisible {
  opacity: 0;
}

/* 5.2 WYŁĄCZENIE DOMYŚLNEJ ANIMACJI ELEMENTORA */
.heading-reveal.animated {
  opacity: 1;
  animation: none !important;
}

/* 5.3 UKRYCIE TEKSTU WYCHODZĄCEGO POZA OBSZAR WIDŻETU */
.heading-reveal .elementor-widget-container {
  overflow: hidden;
}

/* 5.4 URUCHOMIENIE WŁASNEJ ANIMACJI NAGŁÓWKA */
.heading-reveal.animated .elementor-heading-title {
  animation: heading-stage-reveal 2.2s cubic-bezier(.16, 1, .3, 1) both;
  will-change: transform, opacity, filter, clip-path;
}

/* 5.5 KLATKI ANIMACJI ODSŁONIĘCIA NAGŁÓWKA */
@keyframes heading-stage-reveal {
  from {
    opacity: 0;
    filter: blur(3px);
    clip-path: inset(0 100% 0 0);
    transform: translateY(14px) skewX(-1.5deg);
  }

  to {
    opacity: 1;
    filter: blur(0);
    clip-path: inset(0 0 0 0);
    transform: translateY(0) skewX(0);
  }
}

/* 5.6 WYŁĄCZENIE ANIMACJI PRZY OGRANICZENIU RUCHU */
@media (prefers-reduced-motion: reduce) {
  .heading-reveal.animated .elementor-heading-title {
    animation: none;
  }
}


/* =========================================================
   6. KONTENERY ELEMENTORA — POJAWIANIE SIĘ OD DOŁU
   KLASA DODAWANA RĘCZNIE: reveal-up
   ========================================================= */

/* 6.1 UKRYCIE KONTENERA PRZED URUCHOMIENIEM ANIMACJI */
.reveal-up.elementor-invisible {
  opacity: 0;
}

/* 6.2 USTAWIENIA CZASU I PŁYNNOŚCI ANIMACJI */
.reveal-up.animated {
  animation-name: reveal-up !important;
  animation-duration: 1.15s !important;
  animation-timing-function: cubic-bezier(.22, 1, .36, 1) !important;
  animation-fill-mode: both !important;
}

/* 6.3 KLATKI ANIMACJI POJAWIANIA SIĘ OD DOŁU */
@keyframes reveal-up {
  from {
    opacity: 0;
    transform: translate3d(0, 14px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* 6.4 WYŁĄCZENIE ANIMACJI PRZY OGRANICZENIU RUCHU */
@media (prefers-reduced-motion: reduce) {
  .reveal-up.animated {
    animation: none !important;
  }
}


/* =========================================================
   7. GALERIA — ZDJĘCIA CZARNO-BIAŁE Z KOLOREM PO NAJECHANIU
   KLASA DODAWANA RĘCZNIE: bw-gallery
   ========================================================= */

/* 7.1 DOMYŚLNY CZARNO-BIAŁY WYGLĄD ZDJĘĆ */
.bw-gallery img {
  filter: grayscale(100%);
  transition:
    filter .45s ease,
    transform .45s ease;
}

/* 7.2 PRZYWRÓCENIE KOLORU I LEKKIE POWIĘKSZENIE ZDJĘCIA */
.bw-gallery a:hover img,
.bw-gallery .gallery-item:hover img,
.bw-gallery .elementor-image-gallery .gallery-item:hover img {
  filter: grayscale(0%);
  transform: scale(1.02);
}


/* =========================================================
   8. KARTY — NAKŁADANIE PODCZAS PRZEWIJANIA
   KLASY DODAWANE RĘCZNIE: fit-cards ORAZ fit-card
   ========================================================= */

/* 8.1 TABLET I TELEFON — UKŁAD GŁÓWNEGO KONTENERA KART */
@media (max-width: 1024px) {
  .fit-cards {
    --card-top: 110px;
    display: flex;
    flex-direction: column;
    gap: 28px;
    overflow: visible !important;
  }

  /* 8.2 TABLET I TELEFON — PRZYKLEJENIE POJEDYNCZEJ KARTY */
  .fit-card {
    position: sticky !important;
    top: var(--card-top) !important;
    width: 100%;
    margin: 0 !important;
  }

  /* 8.3 PIERWSZA KARTA — NAJNIŻSZA WARSTWA */
  .fit-card:nth-child(1) {
    z-index: 1;
  }

  /* 8.4 DRUGA KARTA — WARSTWA NAD PIERWSZĄ */
  .fit-card:nth-child(2) {
    z-index: 2;
  }

  /* 8.5 TRZECIA KARTA — WARSTWA NAD DRUGĄ */
  .fit-card:nth-child(3) {
    z-index: 3;
  }

  /* 8.6 CZWARTA KARTA — WARSTWA NAD TRZECIĄ */
  .fit-card:nth-child(4) {
    z-index: 4;
  }

  /* 8.7 PIĄTA KARTA — NAJWYŻSZA WARSTWA */
  .fit-card:nth-child(5) {
    z-index: 5;
  }
}

/* 8.8 TELEFON — WYŻSZA POZYCJA PRZYKLEJENIA KART */
@media (max-width: 767px) {
  .fit-cards {
    --card-top: 90px;
  }
}

/* =========================================================
   9. BLOG — UKRYCIE NAPISU CLOSE NA URZĄDZENIACH MOBILNYCH
   ========================================================= */
@media (max-width: 1024px) {
  body.blog .close-side-widget .wd-action-text,
  body.single-post .close-side-widget .wd-action-text,
  body.archive .close-side-widget .wd-action-text {
    display: none !important;
  }

  body.blog .close-side-widget .wd-action-icon,
  body.single-post .close-side-widget .wd-action-icon,
  body.archive .close-side-widget .wd-action-icon {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.blog .close-side-widget > a,
  body.single-post .close-side-widget > a,
  body.archive .close-side-widget > a {
    gap: 0 !important;
  }
}

/* =========================================================
   10. PŁYNNE PRZEWIJANIE DO SEKCJI
   ========================================================= */
html {
  scroll-behavior: smooth;
}