/* ==========================================================================
   Corentiq - poprawki nalozone na motyw Safebyte.

   UWAGA: Elementor wstrzykuje czesc swoich stylow jako <style> w <body>,
   czyli PO tym pliku. Przy rownej specyficznosci wygralyby one z nami,
   dlatego reguly nadpisujace motyw maja prefiks "body" (podnosi
   specyficznosc o 1 element, bez uciekania sie do !important).
   ========================================================================== */

/* --- 1. Logo -------------------------------------------------------------
   Motyw ograniczal logo do 38 px (naglowek) i 42 px (stopka). Sam max-height
   nie wystarcza: kolumna z logo ma szerokosc procentowa i to ona ogranicza
   obrazek, wiec poszerzamy tez kolumne - kosztem bardzo szerokiej kolumny
   z menu.                                                                  */
body .elementor-9783 .elementor-element.elementor-element-97faaeb .pxl-logo img {
  max-height: 58px;
}
/* pasek przyklejony przy przewijaniu to osobny szablon Elementora (12427) */
body .elementor-12427 .elementor-element.elementor-element-f7bf164 .pxl-logo img {
  max-height: 50px;
}
body .elementor-502 .elementor-element.elementor-element-f569ba4 .pxl-logo img {
  max-height: 56px;
}
body .pxl-logo-mobile img,
body .pxl-header-branding img {
  max-height: 46px;
  width: auto;
}

@media screen and (min-width: 1025px) {
  /* pasek glowny: logo | menu | prawa strona */
  body .elementor-9783 .elementor-element.elementor-element-7e7b1b7 { width: 18.5%; }
  body .elementor-9783 .elementor-element.elementor-element-10df6ae { width: 66%; }
  body .elementor-9783 .elementor-element.elementor-element-42f6761 { width: 15.5%; }
  /* pasek przyklejony */
  body .elementor-12427 .elementor-element.elementor-element-bfd9e85 { width: 16%; }
  body .elementor-12427 .elementor-element.elementor-element-9efd960 { width: 62%; }
  body .elementor-12427 .elementor-element.elementor-element-d1dcfde { width: 22%; }
  /* 7 pozycji menu przy odstepie 32 px nie miescilo sie w jednej linii */
  body .pxl-nav-menu ul.pxl-menu-primary > li { margin-right: 24px; }
  body .pxl-nav-menu ul.pxl-menu-primary > li:last-child { margin-right: 0; }
}

/* na waskich ekranach logo nie moze rozpychac paska */
@media screen and (max-width: 767px) {
  body .elementor-9783 .elementor-element.elementor-element-97faaeb .pxl-logo img,
  body .pxl-logo-mobile img,
  body .pxl-header-branding img {
    max-height: 40px;
  }
}

/* --- 2. Karuzela produktow ------------------------------------------------
   Elementor ma tu margin-top:-116px, bo w oryginalnym ukladzie karuzela
   wsuwala sie pod wysoki naglowek z grafika. U nas poprzedza ja niski pasek,
   przez co rzad filtrow nachodzil na podtytul sekcji.                       */
body .elementor-9781 .elementor-element.cq-products {
  margin-top: 0;
}
body .elementor-9781 .elementor-element.cq-products .pxl-inner-top {
  margin-bottom: 40px;
}
body .elementor-9781 .elementor-element.cq-products .pxl-grid-filter {
  padding-top: 6px;
}

/* --- 3. Karuzela obszarow zastosowan (bez rzedu filtrow) ----------------- */
body .elementor-9781 .elementor-element.cq-usecases {
  margin-top: 0;
}

/* --- 3b. Odstepy miedzy slowami w przyciskach ----------------------------
   Motyw animuje przyciski litera po literze; kazda litera to osobny
   inline-block. Separator slow zawiera tylko spacje, a ta w inline-block
   jest zwijana do zera - na hover slowa sklejaly sie w jeden ciag
   ("Asketanexpert"). Nadajemy separatorowi realna szerokosc.               */
body .pxl--btn-text > span.spacer {
  display: inline-block;
  width: 0.34em;
}

/* --- 4. Karty produktow: lista parametrow -------------------------------- */
.pxl-post--specs {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  text-align: left;
}
.pxl-post--specs li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 13px;
  line-height: 1.6;
  border-top: 1px solid rgba(13, 38, 101, 0.10);
  padding: 5px 0;
}
.pxl-post--specs li span {
  color: #6b7a99;
}
.pxl-post--specs li strong {
  color: #0d2665;
  font-weight: 600;
  text-align: right;
}

/* --- 5. Lista parametrow w akordeonie technologii ----------------------- */
.pxl-accordion--list {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}
.pxl-accordion--list li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 6px;
  font-size: 15px;
}
.pxl-accordion--list li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #164ac8;
}

/* --- 6. Formularz kontaktowy: kula (sphere) blokowala klikanie ------------
   W sekcji #kontakt, ZA formularzem, siedzi dekoracyjny widget pxl_sphere:
   canvas 850x850 px pozycjonowany absolutnie z z-index:1. Lezal on nad
   polami formularza, wiec przegladarka kierowala do niego wszystkie klikniecia
   - nie dalo sie ani wpisac tekstu, ani wyslac wiadomosci (tak samo na
   desktopie i na telefonie). Kula ma byc wylacznie tlem, wiec przestaje
   przyjmowac zdarzenia myszy, a formularz dostaje wyzsza warstwe.          */
body .elementor-widget-pxl_sphere,
body .pxl-sphere,
body .pxl-sphere canvas {
  pointer-events: none;
}
body .pxl-contact-form,
body .elementor-widget-pxl_contact_form {
  position: relative;
  z-index: 2;
}

/* --- 7. Poziomy pasek przewijania ----------------------------------------
   Ta sama kula wystawala ok. 150 px za prawa krawedz okna (canvas 850 px w
   kolumnie 650 px), przez co cala strona dala sie przesuwac w bok. Sam okrag
   miesci sie w oknie - obcinamy tylko przezroczysty zapas canvasu. Dodatkowo
   dekoracyjne okregi .pxl-circle-2 wystaja poza siatke.                    */
html {
  overflow-x: hidden;
}
body .elementor-widget-pxl_sphere > .elementor-widget-container {
  overflow: hidden;
}

/* --- 8. Karuzele: wyrownanie kart do tekstu sekcji -----------------------
   Naglowek sekcji i rzad filtrow siedza w siatce serwisu (max 1320 px), ale
   karuzela byla pelnej szerokosci - karty startowaly 38 px na lewo od tekstu
   przy 1440 px i az 250 px na lewo przy 1920 px. Wciagamy karuzele do tej
   samej siatki: (100% - 1320px)/2 dla wewnetrznego kontenera daje dokladnie
   te sama lewa krawedz co naglowek. Ponizej ~1350 px wynik jest ujemny,
   wiec przegladarka przycina go do 0 - czyli zachowanie jak dotychczas.    */
body .elementor-9781 .cq-products .pxl-carousel-inner,
body .elementor-9781 .cq-usecases .pxl-carousel-inner {
  padding-left: calc(50% - 660px);
  padding-right: calc(50% - 660px);
}

/* --- 9. Sekcja "Szczegoly urzadzen": grafika 3 px poza siatka -------------
   Kolumna z widgetem image_scroll miala padding 18 px zamiast 15 px, wiec
   zdjecie urzadzenia startowalo 3 px dalej niz naglowek nad nim.           */
body .elementor-9781 .elementor-element.elementor-element-942609a > .elementor-widget-wrap {
  padding-left: 15px;
  padding-right: 15px;
}

/* --- 10. Sekcja #kontakt: caly blok wsuniety wzgledem siatki -------------
   Sekcje z naglowkami maja padding poziomy 15 px, ktory wyznacza odstep od
   krawedzi okna; sekcja kontaktu go nie miala, mialy go za to kolumny
   (10 px zewnetrzna + 10 px wewnetrzne). Efekt: naglowek "KONTAKT" i dane
   firmy zaczynaly sie 5 px dalej niz teksty pozostalych sekcji, a prawa
   krawedz formularza konczyla sie 5 px za wczesnie. Ustawiamy jeden poziom
   15 px na kolumnach wewnetrznych; na duzych ekranach sekcja doklada wlasne
   15 px, bo tam jej ramka wychodzi poza widoczny obszar okna.             */
body .elementor-9781 .elementor-element.elementor-element-312e77b > .elementor-widget-wrap {
  padding-left: 0;
  padding-right: 0;
}
body .elementor-9781 .elementor-element.elementor-element-fcc67bd > .elementor-widget-wrap,
body .elementor-9781 .elementor-element.elementor-element-58beb62 > .elementor-widget-wrap {
  padding-left: 15px;
  padding-right: 15px;
}
@media screen and (min-width: 1025px) {
  body .elementor-9781 .elementor-element.elementor-element-3695e71 {
    padding-left: 15px;
    padding-right: 15px;
  }
}

/* --- 11. Sekcja Blog ("wkrotce") ----------------------------------------
   Sekcja korzysta z kolumny 4a585ea po usunietych "Technologiach 5G", ktora
   miala 175 px dolnego marginesu pod akordeonem. Blok jest krotszy, wiec
   odstep do sekcji kontaktu jest mniejszy.                                 */
body .elementor-9781 .cq-blog .elementor-element.elementor-element-4a585ea > .elementor-widget-wrap {
  padding-top: 90px;
  padding-bottom: 110px;
}
