.site-footer #splide01 .splide__arrow--prev {
	left: -50px;
	background: transparent !important;
}

.site-footer #splide01 .splide__arrow--next {
	right: -50px;
	background: transparent !important;
}




@media (max-width: 1024px) {
.site-footer	#splide01 .splide__arrow {
		width: 50px !important;
		height: 50px !important;
	}

.site-footer	#splide01 .splide__arrow svg {
		width: 25px !important;
		height: 25px !important;
	}
}


.page-container {
	max-width: 1340px;
	padding: 0 20px;
	margin: 0 auto;
}




/**testowanie nagłówków**/
/* ==========================================================================
   1. BAZA DLA NAGŁÓWKÓW Z IKONAMI (DESKTOP)
   ========================================================================== */
h2[class^="iko-"], h3[class^="iko-"], h4[class^="iko-"], h5[class^="iko-"],
h2[class*=" iko-"], h3[class*=" iko-"], h4[class*=" iko-"], h5[class*=" iko-"] {
    position: relative;          
    padding-left: 0 !important;  /* Na desktopie tekst od krawędzi */
    font-weight: 300 !important; 
    display: inline-block;  
	     
}

/* Automatyczne formatowanie b oraz strong */
h2[class^="iko-"] strong, h3[class^="iko-"] strong, h4[class^="iko-"] strong, h5[class^="iko-"] strong,
h2[class^="iko-"] b, h3[class^="iko-"] b, h4[class^="iko-"] b, h5[class^="iko-"] b,
h2[class*=" iko-"] strong, h3[class*=" iko-"] strong, h4[class*=" iko-"] strong, h5[class*=" iko-"] strong,
h2[class*=" iko-"] b, h3[class*=" iko-"] b, h4[class*=" iko-"] b, h5[class*=" iko-"] b {
    font-weight: 700 !important; 
    text-transform: uppercase;       
}

/* Wspólne ustawienia dla wszystkich ikon (DESKTOP) */
h2[class^="iko-"]::before, h3[class^="iko-"]::before, h4[class^="iko-"]::before, h5[class^="iko-"]::before,
h2[class*=" iko-"]::before, h3[class*=" iko-"]::before, h4[class*=" iko-"]::before, h5[class*=" iko-"]::before {
    content: '';
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top;
	top: var(--iko-top, 0);                
 	width: var(--iko-size, 38px); 
    height: var(--iko-size, 38px);
    left: var(--iko-left, -47px);

}

h2 {
    --iko-size: 34px;
    --iko-left: -48px; /* Większa ikona potrzebuje więcej miejsca z lewej */
	--iko-top: -1px;
}

h3 {
    --iko-size: 30px;  /* Twoja dotychczasowa bazowa wielkość */
    --iko-left: -42px;
	--iko-top: 1px;  
}

h4 {
    --iko-size: 32px;
    --iko-left: -40px;
	--iko-top: 2px; 
}

h5 {
    --iko-size: 32px;
    --iko-left: -45px;
	--iko-top: -5px; 
}



/* ==========================================================================
   2. REAKCJA NA MOBILE (EKRANY PONIŻEJ 1024px)
   ========================================================================== */
@media (max-width: 1024px) {
    /* Dodajemy wewnętrzny odstęp nagłówkowi, aby zrobił miejsce ikonie */
    h2[class^="iko-"], h3[class^="iko-"], h4[class^="iko-"], h5[class^="iko-"],
    h2[class*=" iko-"], h3[class*=" iko-"], h4[class*=" iko-"], h5[class*=" iko-"] {
        padding-left: 32px !important; 
  
	
		 

    }

    /* Przesuwamy ikonę do wewnątrz, na bezpieczną pozycję zero */
    h2[class^="iko-"]::before, h3[class^="iko-"]::before, h4[class^="iko-"]::before, h5[class^="iko-"]::before,
    h2[class*=" iko-"]::before, h3[class*=" iko-"]::before, h4[class*=" iko-"]::before, h5[class*=" iko-"]::before {
        left: -10px !important; 

    }

    /* NOWOŚĆ: Wymuszamy, aby na mobile pogrubiony tekst lądował w osobnym wersie */
    h2[class^="iko-"] strong, h3[class^="iko-"] strong, h4[class^="iko-"] strong, h5[class^="iko-"] strong,
    h2[class^="iko-"] b, h3[class^="iko-"] b, h4[class^="iko-"] b, h5[class^="iko-"] b,
    h2[class*=" iko-"] strong, h3[class*=" iko-"] strong, h4[class*=" iko-"] strong, h5[class*=" iko-"] strong,
    h2[class*=" iko-"] b, h3[class*=" iko-"] b, h4[class*=" iko-"] b, h5[class*=" iko-"] b {
               /* Zrzuca tekst do nowego wersu */
        margin-top: 0px;  
       /* Opcjonalnie: minimalny odstęp pionowy między wersami */
    }
}

/* ==========================================================================
   3. DEFINICJE POSZCZEGÓLNYCH IKON (KOLOR #f2622d)
   ========================================================================== */

/* Klasa: .iko-pytanie (? w kółku) */
.iko-pytanie::before {
   background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f2622d" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M9.5 9a2.5 2.5 0 1 1 4.3 1.7c-.8.8-1.8 1.4-1.8 2.8"/><path d="M12 17h.01"/></svg>');
}

/* Klasa: .iko-serwis (Zębatka) */
.iko-serwis::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f2622d" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.2a1.7 1.7 0 0 0-1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.2a1.7 1.7 0 0 0 1.5-1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3h0A1.7 1.7 0 0 0 10 3.2V3a2 2 0 1 1 4 0v.2a1.7 1.7 0 0 0 1 1.5h0a1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8v0a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.2a1.7 1.7 0 0 0-1.4 1z"/></svg>');
}

/* Klasa: .iko-info (i w kółku) */
.iko-info::before {
   background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f2622d" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M12 10v5"/><path d="M12 7h.01"/></svg>');
}

/* Klasa: .iko-kontakt (Koperta/Email) */
.iko-kontakt::before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f2622d" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.9v3a2 2 0 0 1-2.2 2A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7l.4 2.6a2 2 0 0 1-.6 1.8l-1.3 1.3a16 16 0 0 0 6.8 6.8l1.3-1.3a2 2 0 0 1 1.8-.6l2.6.4A2 2 0 0 1 22 16.9z"/></svg>');
}

/* Klasa: .iko-puchar (Trofeum) */
.iko-puchar::before {
    background-image: url('/wp-content/uploads/2026/05/ICO2.png');
}

/* Klasa: .iko-puchar (Trofeum) */
.iko-zarowka::before {
	background-image: url('/wp-content/uploads/2026/05/ico_1.png');
}









/*koniec testów*/



.wp-block-group {
	margin-bottom: 0!important;
}




.mail, .tel, .pin {
	margin-bottom: 1px;
	margin-top: 1px;
	margin-left: -2px !important;
	margin-right: 5px !important;
  	background-repeat: no-repeat;
    background-position: 10px center;
  	background-size: 18px;
  	display: inline-block; /* lub block, zależnie od układu */
  	text-decoration:none;
	color: #163282;
	transition: background-color 0.2s ease;
	background-color: #f3622dt;
	border: solid #dfdfdf 1.5px;
	border-radius: 0px 5px 15px 5px;
	background-color: #fff;
	font-size: 0.90em;
	padding: 5px 15px 5px 35px !important;
}

.mail:hover {color: #f3622d;}
.tel:hover {color: #f3622d;}

.site-footer.mail:hover {color: #f3622d;}
.site-footer.tel:hover {color: #f3622d;}



/* Ikona 1: Koperta / Email */
.mail {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f2622d" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 7l9 6 9-6"/></svg>');

}

/* Ikona 2: Telefon */
.tel {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f2622d" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.9v3a2 2 0 0 1-2.2 2A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7l.4 2.6a2 2 0 0 1-.6 1.8l-1.3 1.3a16 16 0 0 0 6.8 6.8l1.3-1.3a2 2 0 0 1 1.8-.6l2.6.4A2 2 0 0 1 22 16.9z"/></svg>');

}

/* Ikona 3: Pinezka / Lokalizacja */
.pin {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f2622d" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 21s-6-5.3-6-11a6 6 0 1 1 12 0c0 5.7-6 11-6 11z"/><circle cx="12" cy="10" r="2"/></svg>');
  background-size: 28px !important; padding: 6px 25px 6px 45px !important;
}

/* Ikona 4: brand / Lokalizacja */
h6{
font-weight:600; text-transform:uppercase; line-height:20px; margin: -7px 0px 0px 0px  !important; color:#484848;
}






.site-footer{
	margin-top: 80px;
	line-height: 28px;
	font-size: 0.9em;
}
.site-footer a {
	color: #163282; text-decoration:none !important;
}
.site-footer .copyright a {
	margin-left: 20px;
}



.szare-boki {
    position: relative;
	background-color: #f6f6f6;
    background-size: cover;
    background-position: top center;
	padding: 60px 60px 60px 60px; 	

}



.szare-boki::before, .szare-boki::after {
	position: absolute;
	background: #f6f6f6;
	height: 100%;
	width: 60px;
	top: 0;
	content: '';
}
.szare-boki::before {
	left: -60px;
	border-top-left-radius: 25px;
	border-bottom-left-radius: 60px;
}
.szare-boki::after {
	right: -60px;
	border-top-right-radius: 25px;
	border-bottom-right-radius: 60px;
}


.szare-boki-opis {
    position: relative;
	background-color: #f6f6f6;
	padding: 50px 5px;

}




.szare-boki-opis::before, .szare-boki-opis::after {
	position: absolute;
	background: #f6f6f6;
	height: 100%;
	width: 60px;
	top: 0;
	content: '';
}
.szare-boki-opis::before {
	left: -60px;
	border-top-left-radius: 25px;
	border-bottom-left-radius: 60px;
}
.szare-boki-opis::after {
	right: -60px;
	border-top-right-radius: 25px;
	border-bottom-right-radius: 60px;
}


.szare2 {
    position: relative;
	background-color: #f6f6f6;
    background-size: cover;
    background-position: top center;
	background-image: url('/wp-content/uploads/2026/05/header_bg_2.png');
}






.szare2::before, .szare2::after {
	position: absolute;
	background: #f6f6f6;
	height: 100%;
	width: 60px;
	top: 0;
	content: '';
}
.szare2::before {
	left: -60px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 50px;
}

.szare2::after {
	right: -60px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 50px;
}





@media (max-width: 1024px) {
	.szare2 {background-image: none;}
	.site-footer{margin-top: 50px;}
	.szare-boki-opis {padding: 40px 0px;}
	.szare-boki {padding: 40px 15px;}

	

}




h2.bulb::before {
    content: '';
	position: absolute;
    width: 38px;
    height: 38px;
    background-image: url('https://cmsoft.pl/wp-content/uploads/2026/05/lightbulb.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	top: 0px;
	left: -48px;
	filter: brightness(0) saturate(100%) invert(48%) sepia(90%) saturate(2000%) hue-rotate(344deg) brightness(101%) contrast(97%);
}

h2.bulb {
	position: relative;
	display: inline-block;
}

span.light{
	font-weight: 300!important;
	display: inline-block!important;
	margin-left: 5px!important;
	color: #163282!important;
	font-size: 28px;
}

h4.bulb {
	position: relative;
	display: inline-block;
	font-weight: 800!important;
}
h4.bulb::before {
    content: '';
	position: absolute;
    width: 31px;
    height: 31px;
	color: #000;
	background-image: url('https://cmsoft.pl/wp-content/uploads/2026/05/lightbulb.svg');
  	background-size: 28px !important; padding: 6px 25px 6px 45px !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	top: 0px;
	left: -48px;
	filter: brightness(0) saturate(100%) invert(48%) sepia(90%) saturate(2000%) hue-rotate(344deg) brightness(101%) contrast(97%);
}

span.light{
	font-weight: 300!important;
	display: inline-block!important;
	margin-left: 5px!important;
	color: #163282!important;
}





@media (max-width: 1024px) {
	
	h2.bulb {
		padding-left: 40px;
	}
	
	h2.bulb::before { 
		left: -5px;	
	}
}


@media (max-width: 768px) {
	
	h2.bulb {
		padding-left: 40px;
		display: block;
		margin: 0;
	}
	
	span.light{
		display: block!important;
		padding-left: 35px;
		font-size: 0.5em;
		
	}
	
	h2.bulb::before { 
		left: 0px;
		top: 5px;
	}
	
	
	h4.bulb {	}
	
	span.light{}


}

/* MEGA MENU */
@media (min-width: 1025px) {
	
	


    .menu-item-has-children {
        display: inline-flex !important;
        align-items: center !important; 
        position: relative;
    }


    .menu-item-has-children > a {
        display: inline-flex !important;
        align-items: center !important;
        padding-right: 7px !important;
        white-space: nowrap;
    }

 
    .menu-item-has-children .kb-nav-dropdown-toggle-btn {
        position: relative !important;
        top: 0 !important;             
        transform: none !important;   
        
        display: inline-flex !important;
        align-items: center !important;  
        justify-content: center !important;
        
        height: auto !important;      
        padding: 0 !important;        
        margin-left: 0px !important;  
        color: #163282;
        z-index: 1;
    }
	
	.menu-item-has-children:hover {color: #163282 !important;}
	
.sub-menu.kb-nav-sub-menu {
    position: fixed !important;
    top: 90px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 1320px !important;
    max-width: calc(100vw - 50px);
    padding: 25px 55px !important;
    background: #fff;
    border-radius: 0 0 40px 40px!important;
    box-shadow:
        0 30px 60px rgba(0,0,0,.08)!important,
        0 10px 20px rgba(0,0,0,.04)!important;
    min-width: unset !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(320px, 1fr));
    z-index: 99;
	
	box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.1)!important;

}
	.menu-item-has-children{
    position:relative;
}

.menu-item-has-children::after{
    content:'';
    position:absolute;
    left:0;
    top:100%;
    width:100%;
    height:30px;
}


@media (max-width: 1360px) {
	
	.sub-menu.kb-nav-sub-menu {
		grid-template-columns: repeat(3, minmax(320px, 1fr));
	}
}

.sub-menu.kb-nav-sub-menu > li {
    margin: 0 !important;
    min-width: 320px;
}

.sub-menu.kb-nav-sub-menu a {
    display: block;
    width: 100%;
    white-space: nowrap;
    text-decoration: none;
    transition: .2s ease;
}

.sub-menu.kb-nav-sub-menu a:hover {
    color: #f2622d;
    transform: translateX(4px);
}

@media (max-width: 1600px) {

    .sub-menu.kb-nav-sub-menu {
        width: calc(100vw - 40px) !important;
    }

}

@media (max-width: 1200px) {

    .sub-menu.kb-nav-sub-menu {
        grid-template-columns: repeat(2, 1fr);

        gap: 18px 40px;

        padding: 35px 40px !important;
    }

.sub-menu.kb-nav-sub-menu .kb-nav-link-content {
    padding: 5px 0;
}

}