/* DOŁADOWANIE FONTU – aby mobile miały pewne źródło */
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@400;600&display=swap');

/* Wersja „twarda” tylko na homepage – odporna na nadpisywanie */
#container.main_page .main_slider{
  position:relative !important;
  left:50% !important;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:-50vw !important;
  margin-right:-50vw !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  z-index:0 !important;
  height:clamp(660px,55vh,850px) !important;
  margin-bottom:14px !important; /* EDYTUJ TU: odstęp slider↔kafle */
}
#container.main_page .main_slider .slide,
#container.main_page .main_slider .swiper-slide,
#container.main_page .main_slider .owl-item,
#container.main_page .main_slider .item{
  width:100% !important; height:100% !important; display:block !important;
}
#container.main_page .main_slider img,
#container.main_page .main_slider .slide img,
#container.main_page .main_slider .swiper-slide img,
#container.main_page .main_slider .owl-item img{
  width:100% !important; height:100% !important; object-fit:cover !important; display:block !important;
}
@media (max-width:768px){
  #container.main_page .main_slider{
    left:0 !important; width:100% !important; margin-left:0 !important; margin-right:0 !important;
    height:clamp(280px,40vw,350px) !important;
  }
}

/* Full-bleed banery (HERO / pojedyncze zdjęcie na całą szerokość) */
#container.main_page .custom-fullwidth-banner,
#container.main_page .full-bleed{
  position:relative !important;
  left:50% !important; width:100vw !important; max-width:100vw !important;
  margin-left:-50vw !important; margin-right:-50vw !important;
  overflow:hidden !important; box-sizing:border-box !important; z-index:0 !important;
}
#container.main_page .custom-fullwidth-banner img{
  width:100% !important; height:auto !important; display:block !important; object-fit:cover !important;
}
@media (max-width:768px){
  #container.main_page #hero-ubierz,
  #container.main_page #hero-caption,
  #container.main_page #hero-plain{
    left:0 !important; width:100% !important; margin-left:0 !important; margin-right:0 !important;
  }
}

/* Kafle 1+2 / 1+2 (z overlayem i CTA) – 4:3 */
#container.main_page .stack-banners{
  display:grid !important; grid-template-columns:1fr !important;
  gap:24px !important; margin:24px 0 40px !important;
}
@media (min-width:769px){
  #container.main_page .stack-banners{ grid-template-columns:1fr 1fr !important; }
}
#container.main_page .stack-banner{
  position:relative !important; overflow:hidden !important; width:100% !important;
  aspect-ratio:4/3 !important;
}
#container.main_page .stack-banner img{
  position:absolute !important; inset:0 !important;
  width:100% !important; height:100% !important; object-fit:cover !important;
  display:block !important; transition:transform .5s ease !important;
}
#container.main_page .stack-banner:hover img{ transform:scale(1.05) !important; }

#container.main_page .stack-banner .content{
  position:absolute !important; left:40px !important; bottom:60px !important;
  z-index:2 !important; text-align:left !important; max-width:90% !important;
  color:#fff !important; text-transform:uppercase !important;
  font-family:'Lexend Deca',sans-serif !important;
  text-shadow:0 0 10px rgba(0,0,0,.5) !important;
  /* EDYTUJ TU: wartości left/bottom */
}
@media (max-width:1024px){
  #container.main_page .stack-banner .content{ left:28px !important; bottom:40px !important; }
}
@media (max-width:768px){
  #container.main_page .stack-banner .content{ left:16px !important; bottom:24px !important; }
}

#container.main_page .stack-banner h2{
  margin:0 0 10px !important; color:#fff !important; font-weight:600 !important;
}
@media (min-width:1200px){
  #container.main_page .stack-banner h2{ font-size:20px !important; }  /* EDYTUJ TU: desktop */
}
@media (min-width:992px) and (max-width:1199.98px){
  #container.main_page .stack-banner h2{ font-size:20px !important; }
}
@media (min-width:768px) and (max-width:991.98px){
  #container.main_page .stack-banner h2{ font-size:18px !important; }
}
@media (min-width:481px) and (max-width:767.98px){
  #container.main_page .stack-banner h2{ font-size:16px !important; }
}
@media (max-width:480.98px){
  #container.main_page .stack-banner h2{ font-size:16px !important; }
}

#container.main_page .stack-banner .btn{
  background:#3d8041 !important; color:#fff !important;
  font-family:'Lexend Deca',sans-serif !important; font-weight:600 !important;
  text-transform:uppercase !important; text-decoration:none !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  padding:10px 20px !important; width:180px !important; max-width:100% !important;
  border-radius:10px !important; transition:background-color .3s ease !important; white-space:nowrap !important;
}
#container.main_page .stack-banner .btn:hover{ background:#8bae80 !important; }

/* Pozycje i fonty w HERO (overlay) */
#container.main_page #hero-ubierz,
#container.main_page #hero-caption,
#container.main_page #hero-plain{
  position:relative !important;
}
#container.main_page #hero-ubierz.custom-fullwidth-banner > .content,
#container.main_page #hero-ubierz.custom-fullwidth-banner .banner-caption,
#container.main_page #hero-caption.custom-fullwidth-banner > .content,
#container.main_page #hero-caption.custom-fullwidth-banner .banner-caption,
#container.main_page #hero-plain.custom-fullwidth-banner > .content,
#container.main_page #hero-plain.custom-fullwidth-banner .banner-caption{
  position:absolute !important; left:180px !important; bottom:120px !important;
  right:auto !important; top:auto !important; transform:none !important;
  color:#fff !important; text-transform:uppercase !important;
  font-family:'Lexend Deca',sans-serif !important;
  text-shadow:0 0 10px rgba(0,0,0,.45) !important;
  /* EDYTUJ TU: overlay HERO left/bottom */
}
@media (max-width:1024px){
  #container.main_page #hero-ubierz.custom-fullwidth-banner > .content,
  #container.main_page #hero-ubierz.custom-fullwidth-banner .banner-caption,
  #container.main_page #hero-caption.custom-fullwidth-banner > .content,
  #container.main_page #hero-caption.custom-fullwidth-banner .banner-caption,
  #container.main_page #hero-plain.custom-fullwidth-banner > .content,
  #container.main_page #hero-plain.custom-fullwidth-banner .banner-caption{
    left:80px !important; bottom:100px !important;
  }
}
@media (max-width:768px){
  #container.main_page #hero-ubierz.custom-fullwidth-banner > .content,
  #container.main_page #hero-ubierz.custom-fullwidth-banner .banner-caption,
  #container.main_page #hero-caption.custom-fullwidth-banner > .content,
  #container.main_page #hero-caption.custom-fullwidth-banner .banner-caption,
  #container.main_page #hero-plain.custom-fullwidth-banner > .content,
  #container.main_page #hero-plain.custom-fullwidth-banner .banner-caption{
    left:16px !important; bottom:28px !important;
  }
}

#container.main_page #hero-ubierz.custom-fullwidth-banner h2,
#container.main_page #hero-caption.custom-fullwidth-banner h2,
#container.main_page #hero-plain.custom-fullwidth-banner h2{
  line-height:1.1 !important; margin:0 !important; color:#fff !important;
}
@media (min-width:1200px){
  #container.main_page #hero-ubierz.custom-fullwidth-banner h2,
  #container.main_page #hero-caption.custom-fullwidth-banner h2,
  #container.main_page #hero-plain.custom-fullwidth-banner h2{ font-size:36px !important; } /* EDYTUJ TU */
}
@media (min-width:992px) and (max-width:1199.98px){
  #container.main_page #hero-ubierz.custom-fullwidth-banner h2,
  #container.main_page #hero-caption.custom-fullwidth-banner h2,
  #container.main_page #hero-plain.custom-fullwidth-banner h2{ font-size:36px !important; }
}
@media (min-width:768px) and (max-width:991.98px){
  #container.main_page #hero-ubierz.custom-fullwidth-banner h2,
  #container.main_page #hero-caption.custom-fullwidth-banner h2,
  #container.main_page #hero-plain.custom-fullwidth-banner h2{ font-size:32px !important; }
}
@media (min-width:481px) and (max-width:767.98px){
  #container.main_page #hero-ubierz.custom-fullwidth-banner h2,
  #container.main_page #hero-caption.custom-fullwidth-banner h2,
  #container.main_page #hero-plain.custom-fullwidth-banner h2{ font-size:24px !important; }
}
@media (max-width:480.98px){
  #container.main_page #hero-ubierz.custom-fullwidth-banner h2,
  #container.main_page #hero-caption.custom-fullwidth-banner h2,
  #container.main_page #hero-plain.custom-fullwidth-banner h2{ font-size:22px !important; }
}

/* Globalne — zostawiamy bez prefiksu */
html,body{ overflow-x:clip; }
#contact_map { display: none !important; }
.contact_stocks { display: none !important; }

/* ukrucie liczby towarów */
.projector_buy__number_amounts { display: none !important; }
#projector_amount { display: none !important; }

/* Przybliżenie produktu */
.product > a img { transition: all .3s ease-in-out !important; }
.product:hover > a img { transform: scale(1.05); }

/* Powiększenie grafiki dla wariantów w formie kafelków dla wersji desktopowej */
@media (min-width: 757px) {
  .projector_details .projector_versions__gfx img { width: 90px; }
}

/* ——— PATCH MOBILE: wymuś Lexend na overlayu i przycisku ——— */
@media (max-width:768px){
  #container.main_page .stack-banner .content,
  #container.main_page .stack-banner .content *,
  #container.main_page .stack-banner .btn{
    font-family:'Lexend Deca',sans-serif !important;
    font-weight:600 !important; /* przycisk/napisy jak na desktopie */
  }
}
/* === TABLET TUNE (769–1024 px) === */
@media (min-width: 769px) and (max-width: 1024px){

  /* slider niech będzie niższy na tabletach */
  #container.main_page .main_slider{
    height: clamp(420px, 48vh, 560px) !important;
    margin-bottom: 12px !important;
  }

  /* trochę inny kadr, żeby mniej „ucinało” dół (dostosuj w razie potrzeby) */
  #container.main_page .main_slider img,
  #container.main_page .main_slider .slide img,
  #container.main_page .main_slider .swiper-slide img,
  #container.main_page .main_slider .owl-item img{
    object-position: center 40% !important; /* 0% = góra, 50% = środek, 100% = dół */
  }

  /* jeśli masz overlay/napisy na sliderze – lekko je podnieś i przybliż */
  #container.main_page #hero-ubierz.custom-fullwidth-banner > .content,
  #container.main_page #hero-ubierz.custom-fullwidth-banner .banner-caption,
  #container.main_page #hero-caption.custom-fullwidth-banner > .content,
  #container.main_page #hero-caption.custom-fullwidth-banner .banner-caption,
  #container.main_page #hero-plain.custom-fullwidth-banner > .content,
  #container.main_page #hero-plain.custom-fullwidth-banner .banner-caption{
    left: 64px !important;
    bottom: 72px !important;
  }
  #container.main_page #hero-ubierz.custom-fullwidth-banner h2,
  #container.main_page #hero-caption.custom-fullwidth-banner h2,
  #container.main_page #hero-plain.custom-fullwidth-banner h2{
    font-size: 30px !important;
  }
}