.elementor-7426 .elementor-element.elementor-element-50fc3dce:not(.elementor-motion-effects-element-type-background), .elementor-7426 .elementor-element.elementor-element-50fc3dce > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://zagrodakociewska.pl/wp-content/uploads/2026/01/deska-4.png");background-position:center center;background-repeat:no-repeat;background-size:contain;}.elementor-7426 .elementor-element.elementor-element-50fc3dce{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:7em;margin-bottom:0em;padding:3em 0em 3em 0em;}.elementor-7426 .elementor-element.elementor-element-50fc3dce > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-7426 .elementor-element.elementor-element-1a0b8794 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-7426 .elementor-element.elementor-element-7567f55e > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-7426 .elementor-element.elementor-element-7567f55e{text-align:center;}.elementor-7426 .elementor-element.elementor-element-7567f55e .elementor-heading-title{font-size:46px;font-weight:900;-webkit-text-stroke-width:1px;stroke-width:1px;-webkit-text-stroke-color:#000;stroke:#000;color:#FFFFFF;}.elementor-7426 .elementor-element.elementor-element-55c753b3 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-7426 .elementor-element.elementor-element-55c753b3{text-align:center;}.elementor-7426 .elementor-element.elementor-element-55c753b3 .elementor-heading-title{font-size:27px;font-weight:900;-webkit-text-stroke-width:0px;stroke-width:0px;-webkit-text-stroke-color:#000;stroke:#000;text-shadow:0px 0px 0px rgba(0,0,0,0.3);color:#FFFFFFE0;}.elementor-7426 .elementor-element.elementor-element-41090a10{--display:flex;}.elementor-7426 .elementor-element.elementor-element-58ec462d{text-align:start;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-7426 .elementor-element.elementor-element-50fc3dce{margin-top:0em;margin-bottom:-2em;}}@media(max-width:767px){.elementor-7426 .elementor-element.elementor-element-50fc3dce{margin-top:-2em;margin-bottom:-2em;padding:0em 0em 0em 0em;}.elementor-7426 .elementor-element.elementor-element-1a0b8794 > .elementor-element-populated{margin:124px 0px 95px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:-2px 0px 0px 0px;}.elementor-7426 .elementor-element.elementor-element-7567f55e > .elementor-widget-container{margin:0px 0px -17px 0px;padding:0px 0px 0px 0px;}.elementor-7426 .elementor-element.elementor-element-7567f55e .elementor-heading-title{font-size:28px;}.elementor-7426 .elementor-element.elementor-element-55c753b3 > .elementor-widget-container{margin:0px 0px 17px 0px;padding:0px 0px 0px 0px;}.elementor-7426 .elementor-element.elementor-element-55c753b3 .elementor-heading-title{font-size:25px;}.elementor-7426 .elementor-element.elementor-element-41090a10{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS *//* =========================================
   REZERWUJ – deska z prawej (statyczna, nie wysuwa się)
   - wystaje tylko “języczek” z napisem pionowo
   - klik przenosi do /rezerwacja-wycieczek/
   - CSS wklejany na konkretnej stronie
   ========================================= */

:root{
  /* UŻYJ TEJ SAMEJ DESKI CO KONTAKT (albo wstaw inną) */
  --zk-rezerwuj-bg-image: url(https://zagrodakociewska.pl/wp-content/uploads/2026/01/deska-6.png);

  /* rozmiar elementu (całej deski w tle) */
  --zk-rezerwuj-w: clamp(180px, 22vw, 280px);
  --zk-rezerwuj-h: clamp(200px, 22vw, 320px);

  /* ile ma wystawać (szerokość “języczka”) */
  --zk-rezerwuj-tab-w: 120px;

  /* pozycja na ekranie */
  --zk-rezerwuj-top: 28%;

  /* przesunięcie napisu w lewo/prawo na języczku */
  --zk-rezerwuj-tab-x: 18px;

  /* tło (żeby nie kadrowało/nie “wygładzało”) */
  --zk-rezerwuj-bg-size: contain;
  --zk-rezerwuj-bg-position: right center;
}

.zk-rezerwuj-board{
  position: fixed;
  top: var(--zk-rezerwuj-top);
  right: 0;

  width: var(--zk-rezerwuj-w);
  height: var(--zk-rezerwuj-h);

  /* STATYCZNIE: tylko wystaje języczek (bez hover wysuwania) */
  transform: translateY(-50%) translateX(calc(100% - var(--zk-rezerwuj-tab-w)));
  will-change: transform;

  z-index: 99998;
  pointer-events: auto;

  text-decoration: none;
  outline: none;

  /* ważne: tło przeniesione na ::before (żeby móc pulsować bez psucia transform) */
  background: none;
}

/* tło deski jako warstwa (pulsuje na hover) */
.zk-rezerwuj-board::before{
  content: "";
  position: absolute;
  inset: 0;

  background-image: var(--zk-rezerwuj-bg-image);
  background-repeat: no-repeat;
  background-size: var(--zk-rezerwuj-bg-size);
  background-position: var(--zk-rezerwuj-bg-position);

  transform-origin: right center;
  pointer-events: none;
  z-index: 0;
}

/* PULS na hover (bez wysuwania) */
.zk-rezerwuj-board:hover::before{
  animation: zkRezerwujPulse .85s ease-in-out infinite;
}

@keyframes zkRezerwujPulse{
  0%   { transform: scale(1);    filter: brightness(1); }
  50%  { transform: scale(1.03); filter: brightness(1.06); }
  100% { transform: scale(1);    filter: brightness(1); }
}

/* pionowy napis – wyśrodkowany w języczku */
.zk-rezerwuj-tab{
  position: absolute;
  left: var(--zk-rezerwuj-tab-x);
  top: 0;
  bottom: 4px;
  width: var(--zk-rezerwuj-tab-w);

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

  writing-mode: vertical-rl;
  transform: rotate(180deg);

  font-family: "Grandstander", sans-serif;
  font-weight: 900;
  font-size: clamp(16px, 1.8vw, 26px);
  letter-spacing: .10em;
  text-transform: uppercase;

  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,.55);
  user-select: none;
  cursor: pointer;

  /* KLUCZ do centrowania REZERWUJ / ONLINE */
  text-align: center;
  line-height: 1.05;

  z-index: 1; /* nad tłem */
}

/* mobile – trochę węższy języczek */
@media(max-width: 480px){
  :root{
    --zk-rezerwuj-tab-w: 48px;
    --zk-rezerwuj-top: 50%;
    --zk-rezerwuj-tab-x: 8px;
  }
}

/* NAPIS – pulsuje razem z deską */
.zk-rezerwuj-board:hover .zk-rezerwuj-tab{
  animation: zkRezerwujTextPulse .85s ease-in-out infinite;
}

@keyframes zkRezerwujTextPulse{
  0%   { transform: rotate(180deg) scale(1);    opacity: 1; }
  50%  { transform: rotate(180deg) scale(1.06); opacity: .95; }
  100% { transform: rotate(180deg) scale(1);    opacity: 1; }
}/* End custom CSS */