/* * * * * * * * * * * * * * * * * * * *
 *
 *   @page		Severso
 *   @name		custom.css
 *   @author	Sitte.pl
 *   @created	07.2026
 *   @licence	copyright (c) by Sitte.pl
 *   @version	1.0.0
 *
 */

:root {
	--bRad: 12px; /*domyślne zaokrąglenia*/
	--main-color1: #000; /*ciemny tekst*/
	--main-color2: #004879; /*granat*/ 
	--main-color3: #fff; /*jasne tło2*/
	--font1: 'VT323';
	--font2: 'Space Grotesk', sans-serif;
}
html { font-size: 18px; /*sp page builder deklaruje ale dla body co powoduje że nie działają rem-y dlatego tutaj deklaruje ponownie*/}
p:last-child { margin: 0; } /*nie chcemy odstępu po ostatnim paragrafie*/
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin: 0 0 0.2em 0; text-transform: uppercase; }
p, td{text-align:justify; break-inside: avoid;}
@media (max-width: 765px) {p, td, div{text-align:left} } /*dla małych ekranów text-align:justify sie nie sprawdza wiec albo do lewej albo środkujemy*/

/* domyslne marginesy sekcji - to ważne, zwykle usuwamy paddingi i marginesy sekcji tak aby działały domyślne*/
.sppb-section { padding: 100px 0; }
	@media (max-width: 767px) { .sppb-section { padding: 50px 0; } }
.top0{padding-top:0;} /*tymi klasami restujemy aby 2 sekcje które mają takie samo tło nie wyglądały jak podwójny margines. JEśli 2 sekcji po kolei mają to samo tło to jedna z nich nie powinna mieć marginesu. jako margines nazwyam zastępowalnie padding albo margines, zwykle korzystamy z paddingu*/
.bottom0{padding-bottom:0;} /*j.w.*/
.sppb-section .sppb-section { padding: 0 0; } /*zagnieżdżone sekcje nie mają mieć dodatkowych paddingów domyślnie*/

.s-font2, .s-font2 h1, .s-font2 h2, .s-font2 h3, .s-font2 h4, .s-font2 h5, .s-font2 h6 { font-family: var(--font2); }

/* DOMYśLNa / JASNA */
.bg-light1{background-color:var(--main-color3); /*color:var(--main-color1);*/} 
	.bg-light1 .sppb-addon-title span:not([class*="editable-element"]){/*color:var(--main-color2);*/}
	/* .sppb-section .sppb-btn, .sppb-section .sppb-btn.sppb-btn-primary, .bg-light1 .sppb-btn{background-color:var(--main-color3); color:var(--main-color1);} */
		/* .sppb-section .sppb-btn:hover, .sppb-section .sppb-btn.sppb-btn-primary:hover, .bg-light1 .sppb-btn:hover, */
		/* .sppb-section .sppb-btn:focus, .sppb-section .sppb-btn.sppb-btn-primary:focus, .bg-light1 .sppb-btn:focus{background-color:var(--main-color1); color:var(--main-color3); border-color:var(--main-color2);} */

/* SEKCJA CIEMNA */	
.bg-dark1{background-color:var(--main-color2); color:var(--main-color3);}
	.bg-dark1 *{color:var(--main-color3);}
	/* .bg-dark1 .sppb-addon-title span:not([class*="editable-element"]){color:var(--main-color3);} */
	/* .bg-dark1 .sppb-btn, .bg-dark1 .sppb-btn.sppb-btn-secondary{background-color:var(--main-color1); color:var(--main-color3);} */
		/* .bg-dark1 .sppb-btn:hover, .bg-dark1 .sppb-btn.sppb-btn-secondary:hover, */
		/* .bg-dark1 .sppb-btn:focus, .bg-dark1 .sppb-btn.sppb-btn-secondary:focus{background-color:var(--main-color3); color:var(--main-color1); border-color:var(--main-color2);} */


.scols .sppb-addon-content{column-count:3; }
@media (max-width:1400px) { .scols .sppb-addon-content{column-count:2;}}
@media (max-width:992px) { .scols .sppb-addon-content{column-count:1;}}


/* WŁASNE DEFINICJE */
.s-blok1 { position: relative; background-color: var(--main-color2); color: var(--main-color3); margin-bottom: 20px; overflow: hidden; text-align: left !important; transition:1.3s }
.s-blok1:hover{background-color: var(--main-color1); transition:0.3s}
.s-blok1::after { content: ""; position: absolute; top: 24px; right: 24px; width: 82px; aspect-ratio: 1; border: 2px solid rgba(255, 255, 255, 0.55); border-radius: 50%; pointer-events: none; transition: border-width 0.4s ease, transform 0.4s ease;}
.s-blok1:hover::after { border-width: 14px; transform: scale(1.06); }
.s-blok1 .sppb-addon-content { display: flex; flex-direction: column; font-family: var(--font2); text-align: left !important; }
.s-blok1 .sppb-addon-title { order: 1; margin: 0; /*padding: 50px 100px 0 50px;*/ font-family: var(--font2); font-size: clamp(28px, 2.8vw, 46px); font-weight: 400; line-height: 1.08; letter-spacing: -0.035em; }
.s-blok1 .sppb-addon-title a { color: inherit; }
.s-blok1 .sppb-media-content { order: 2; /*padding: 18px 100px 34px 50px;*/ font-family: var(--font2); }
.s-blok1 .sppb-img-container { order: 3; line-height: 0; }
.s-blok1 .sppb-img-container img { display: block !important; width: 100%; height: auto; }
.s-blok1 .sppb-addon-title, .s-blok1 .sppb-addon-title a, .s-blok1 .sppb-addon-title span:not([class*="editable-element"]), .s-blok1 .sppb-addon-text, .s-blok1 .sppb-addon-text * { color: var(--main-color3); }
@media (min-width: 1600px) {
	.s-blok1 .sppb-addon-title { padding: 50px 100px 0 50px; }
	.s-blok1 .sppb-media-content { padding: 18px 100px 34px 50px; }
}
@media (max-width: 1599.9007px) {
	.s-blok1 .sppb-addon-title { padding: clamp(15px, 2.25vw, 50px) clamp(30px, 5vw, 100px) 0 clamp(15px, 2.25vw, 50px); }
	.s-blok1 .sppb-media-content { padding: clamp(15px, 1vw, 18px) clamp(30px, 5vw, 100px) clamp(15px, 3vw, 34px) clamp(15px, 2.25vw, 50px); }
}

@media (max-width: 767px) {
	.s-blok1::after { top: 18px; right: 18px; width: 62px; }
	.s-blok1 .sppb-addon-title { padding: 26px 24px 0; font-size: clamp(26px, 8vw, 38px); }
	.s-blok1 .sppb-media-content { padding: 14px 24px 26px; font-size: 17px; }
}

@media (max-width: 1199.9007px) { .s-moduly .sppb-row > div { max-width: 50%; flex-basis: 50%; }}
@media (max-width:  991.9007px) { .s-moduly .sppb-row > div { max-width: 100%; flex-basis: 100%; }}




/* WŁASNE DEFINICJE */
.s-blok1 { position: relative; background-color: var(--main-color2); color: var(--main-color3); margin-bottom: 20px; overflow: hidden; text-align: left !important; transition: 1.3s; }
.s-blok1:hover { background-color: var(--main-color1); transition: 0.3s; }
.s-blok1::after { content: ""; position: absolute; top: 24px; right: 24px; width: 82px; aspect-ratio: 1; border: 2px solid rgba(255, 255, 255, 0.55); border-radius: 50%; pointer-events: none; transition: border-width 0.4s ease, transform 0.4s ease; }
.s-blok1:hover::after { border-width: 14px; transform: scale(1.06); }
.s-blok1 .sppb-addon-content { display: flex; flex-direction: column; font-family: var(--font2);  }
	.s-blok1 .sppb-addon-content p{text-align: left;}
.s-blok1 .sppb-addon-title { order: 1; margin: 0; padding: 50px 100px 0 50px; font-family: var(--font2); font-size: 40px; font-weight: 400; line-height: 1.08; letter-spacing: -0.035em; }
.s-blok1 .sppb-addon-title a { color: inherit; }
.s-blok1 .sppb-media-content { order: 2; padding: 18px 100px 34px 50px; font-family: var(--font2); }
.s-blok1 .sppb-img-container { order: 3; line-height: 0; }
.s-blok1 .sppb-img-container img { display: block !important; width: 100%; height: auto; }
.s-blok1 .sppb-addon-title, .s-blok1 .sppb-addon-title a, .s-blok1 .sppb-addon-title span:not([class*="editable-element"]), .s-blok1 .sppb-addon-text, .s-blok1 .sppb-addon-text * { color: var(--main-color3); }
@media (max-width: 1599px) {
	.s-blok1 .sppb-addon-title { padding: 35px 70px 0 35px; font-size: 30px; }
	.s-blok1 .sppb-media-content { padding: 18px 35px 30px 35px; }
}
@media (max-width: 767px) {
	.s-blok1::after { top: 18px; right: 18px; width: 62px; }
	.s-blok1 .sppb-addon-title { padding: 26px 24px 0; font-size: 32px; }
	.s-blok1 .sppb-media-content { padding: 14px 24px 26px; font-size: 17px; }
}
@media (max-width: 1199px) {
	.s-moduly .sppb-row > div { max-width: 50%; flex-basis: 50%; }
}
@media (max-width: 991px) {
	.s-moduly .sppb-row > div { max-width: 100%; flex-basis: 100%; }
}







.fs2{font-size:2.2rem}
.s-border-top > .sppb-row-container { position: relative; padding-top: 30px; } .s-border-top > .sppb-row-container::before { content: ""; position: absolute; top: 0; left: 15px; right: 15px; border-top: 1px solid #000; }
.s-border-bottom > .sppb-row-container { position: relative; padding-bottom: 30px; } .s-border-bottom > .sppb-row-container::after { content: ""; position: absolute; bottom: 0; left: 15px; right: 15px; border-bottom: 1px solid #000; }

.s-sekcja1{padding-bottom:10px; padding-top:10px} .s-sekcja1 > .sppb-row-container { position: relative; padding-top: 30px; padding-bottom: 30px; } .s-sekcja1 > .sppb-row-container::before { content: ""; position: absolute; top: 0; left: 15px; right: 15px; border-top: 1px solid #000; } .s-sekcja1 > .sppb-row-container::after { content: ""; position: absolute; bottom: 0; left: 15px; right: 15px; border-bottom: 1px solid #000; }
.s-sekcja1 .addon-root-button{margin:50px 0 10px 0;}
 




/* DEFINICJE */
.sppb-section.no-bg { background-color: transparent; } 
.font2,.font2>*{color: var(--main-color2); font-size:30px;}
.font3{font-family: IBM Plex Serif; font-weight: 400; font-size: 32px; line-height: 42px; letter-spacing: -0.96px;}
.font4,.font4>*{font-family: IBM Plex Serif; font-weight: 500; font-size: 18px; }
.noise-bg .sppb-row-overlay{background-color:var(--sppb-color-primary); opacity: 0.85;}





/* PRZYCISKI */
body .sppb-btn, body .btn { text-transform: initial; text-align: left; font-size:1rem; }
@media(max-width:767px){.sppb-button-wrapper a{margin-left:auto;margin-right:auto;}} 
/* primary */
body .sppb-btn.sppb-btn-primary, body .btn.sppb-btn-primary { background: #fff; color: var(--sppb-text); border: 1px solid #fff; }
body .sppb-btn.sppb-btn-primary i, body .sppb-btn.btn-outline-primary i, body .btn.sppb-btn-primary i, body .btn.btn-outline-primary i { background: var(--sppb-text); color: #fff; }
	body .sppb-btn.sppb-btn-primary:hover, body .btn.sppb-btn-primary:hover,
	body .sppb-btn.sppb-btn-primary:active, body .btn.sppb-btn-primary:active,
	body .sppb-btn.sppb-btn-primary:focus, body .btn.sppb-btn-primary:focus
		{ background: #fff; color: var(--sppb-text); border: 1px solid #fff; }
/* secondary */
/* body .sppb-btn.sppb-btn-secondary, body .btn.sppb-btn-secondary { background: transparent; color: #fff; border: 1px solid var(--sppb-text); } */
body .sppb-btn.sppb-btn-secondary, body .btn.sppb-btn-secondary { background: transparent; color: #fff; border: 1px solid #fff; }
body .sppb-btn.sppb-btn-secondary i, body .sppb-btn.btn-outline-secondary i, body .btn.sppb-btn-secondary i, body .btn.btn-outline-secondary i { background: var(--sppb-text); color: #fff; }
	body .sppb-btn.sppb-btn-secondary:hover, body .btn.sppb-btn-secondary:hover,
	body .sppb-btn.sppb-btn-secondary:active, body .btn.sppb-btn-secondary:active,
	body .sppb-btn.sppb-btn-secondary:focus, body .btn.sppb-btn-secondary:focus
		{ background: #fff; color: var(--sppb-text); border: 1px solid #fff; }
/* fix stopka -__- */
#sp-footer .sppb-btn.sppb-btn-primary:hover, #sp-footer .sppb-btn.sppb-btn-primary:active, #sp-footer .sppb-btn.sppb-btn-primary:focus,
#sp-bottom .sppb-btn.sppb-btn-primary:hover, #sp-bottom .sppb-btn.sppb-btn-primary:active, #sp-bottom .sppb-btn.sppb-btn-primary:focus
	{ color: var(--sppb-text); }
#sp-footer .sppb-btn.sppb-btn-secondary:hover, #sp-footer .sppb-btn.sppb-btn-secondary:active, #sp-footer .sppb-btn.sppb-btn-secondary:focus,
#sp-bottom .sppb-btn.sppb-btn-secondary:hover, #sp-bottom .sppb-btn.sppb-btn-secondary:active, #sp-bottom .sppb-btn.sppb-btn-secondary:focus
	{ color: var(--sppb-text); }
/* fix template */
body .sppb-btn.sppb-btn-secondary:has(i), body .sppb-btn.btn-outline-secondary:has(i), body .btn.sppb-btn-secondary:has(i), body .btn.btn-outline-secondary:has(i) { padding: 0; }
body .sppb-btn.sppb-btn-primary i, body .sppb-btn.btn-primary i, body .sppb-btn.btn-outline-primary i, body .btn.sppb-btn-primary i, body .btn.btn-primary i, body .btn.btn-outline-primary i { min-width: 58px; min-height: 58px; }
@media (max-width: 991px) { body .sppb-btn.sppb-btn-primary i, body .sppb-btn.btn-primary i, body .sppb-btn.btn-outline-primary i, body .btn.sppb-btn-primary i, body .btn.btn-primary i, body .btn.btn-outline-primary i { min-width: 46px; min-height: 46px; }}
body .sppb-btn.sppb-btn-secondary i, body .sppb-btn.btn-outline-secondary i, body .btn.sppb-btn-secondary i, body .btn.btn-outline-secondary i { margin-left: 0; }
body .sppb-btn.sppb-btn-secondary i, body .sppb-btn.btn-secondary i, body .sppb-btn.btn-outline-secondary i, body .btn.sppb-btn-secondary i, body .btn.btn-secondary i, body .btn.btn-outline-secondary i { min-width: 58px; min-height: 58px; }
@media (max-width: 991px) { body .sppb-btn.sppb-btn-secondary i, body .sppb-btn.btn-secondary i, body .sppb-btn.btn-outline-secondary i, body .btn.sppb-btn-secondary i, body .btn.btn-secondary i, body .btn.btn-outline-secondary i { min-width: 46px; min-height: 46px; }}

/* faede8 --> fff */
/* body .sppb-btn.sppb-btn-primary, body .btn.sppb-btn-primary { background: linear-gradient(to bottom, #fff, #faede8); }  */

/* body .sppb-btn.sppb-btn-primary::after, body .btn.sppb-btn-primary::after */
	/* { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, #fff, var(--sppb-color-main1)); border-radius: 200px; transition: 0.4s; opacity: 0; z-index: -1; } */
/* body .sppb-btn.sppb-btn-primary:hover::after, body .btn.sppb-btn-primary:hover::after, */
/* body .sppb-btn.sppb-btn-primary:active::after, body .btn.sppb-btn-primary:active::after, */
/* body .sppb-btn.sppb-btn-primary:focus::after, body .btn.sppb-btn-primary:focus::after */
	/* { background: linear-gradient(to bottom, #fff, var(--sppb-color-main1)); opacity: 1; z-index: -1; } */





/* HEADER */
#sp-header, #sp-header.header-sticky { background: #fff; }
/* poprawki dostępności megamenu */
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner { padding: 0; }
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a { width: 100%; display: inline-block; padding: 20px; }
#sp-header .row{flex-wrap:nowrap;}
#sp-logo{flex-shrink:1;} 





/* SEKCJE */

/* hero (slider) */
.hero-scrolling-title img { filter: invert(1); }

/* jeśli coś chcę stylować to zwykle dodaje przedrostek s- - nazwy stosujemy po polsku, bardzo oszczędnie */
.s-oferta { padding: 0 0 30px 0; }
.s-oferta .sppb-row-container { border-bottom: 1px solid #ececec; padding-bottom: 30px; }
@media (max-width: 575px) {
	.sec-dla-kogo .s-bg-img { height: auto; }
}

/* usługi (wielokrotnie na jednej i na wielu stronach) */
.s-services1 .s-stext { border: 1px solid #000; padding: 30px; }
.s-services1 .sppb-row { margin-top: -30px; }
.s-services1 .sppb-row > div { margin-top: 30px; }
.s-stext .sppb-addon-title {font-family:var(--font2);font-size: 35px; text-transform: none; /*margin-top: 15px;*/ line-height:1.2;}
/* .s-services1 .sppb-row > div .sppb-column-addons:not(:has(div)) { background: #fee; } */
@media (max-width: 1399.9007px) {
	.s-services1 .sppb-row > div { max-width: 50%!important; flex-basis: 50%!important; }
	.s-services1 .sppb-row > div:has(> .sppb-column > .sppb-column-addons:empty) { display: none; }
}
@media (max-width: 991.9007px) {
	.s-services1 .sppb-row > div { max-width: 100%!important; flex-basis: 100%!important; }
}





/* BLOG */
.view-category .body-innerwrapper > #sp-page-title .sp-page-title .container .sp-page-title-heading { margin-bottom: 0; }
.view-category .body-innerwrapper > #sp-page-title .sp-page-title .container .sp-page-title-sub-heading { margin-top: 0; }
body.layout-blog #sp-main-body { padding-top: 0; }
.article-header h2 { text-transform: initial; display: flex; align-items: center; justify-content: flex-start; }
/* hover */
.view-category .blog .article-list .article:focus > .article-body, .view-category .blog .article-list .article:active > .article-body { background-color: #353437; }
.view-category .blog .article-list .article:focus > .article-body .article-header > h2 a,
.view-category .blog .article-list .article:active > .article-body .article-header > h2 a,
.view-category .blog .article-list .article:focus > .article-body .readmore a,
.view-category .blog .article-list .article:active > .article-body .readmore a,
.view-category .blog .article-list .article:focus > .article-body .readmore::after,
.view-category .blog .article-list .article:active > .article-body .readmore::after
	{ color: #ece7e1!important; }
.article-full-image img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }





/* FOOTER */
#sp-bottom { padding: 0; }
#sp-footer { border-color: #fff; }
.sp-copyright { color: #fff; }





/* FIXY */
.s-fix1.sppb-section .sppb-section { padding: 0 35px 25px 35px; } /* wewnętrzna sekcja w tym fixie jednak mam mieć paddingi */
.s-fix2 .sppb-addon-title {/*font-family:var(--font2);font-size:1.7rem;text-transform:none; line-height:1.2*/}
.s-fix3 .sppb-addon-title {font-family:var(--font2);font-size:1.7rem;text-transform:none; line-height:1.2}

@media (max-width: 767.9007px) { .s-fix2.sppb-section { padding-top: 100px; }} /* dla sekcji daj padding górny taki jak w normalnej sekcji pomimo wejścia w wersję mobilną */
.view-category .body-innerwrapper > #sp-page-title .sp-page-title .container::after { display: none; }







