/*
Embed fonts families:
-------------------
// <weight>: Use a value from 200 to 800
// <uniquifier>: Use a unique and descriptive class name


.geist-<uniquifier> {
  font-family: "Geist", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

animation:
-------------------
transition: all 0.5s;

Content:
1. Main styles override
2. Contact form 7 
3. Navbar bootstrap
4. ACF elements
5. Theme styles  
6. Responsive fixes
*/

/* ============================================= */
/* 1. Main styles override                       */
/* ============================================= */

body {
	font-family: "Geist", sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 24px;
	position: relative;
}
body.admin-bar .navbar {
	margin-top: 32px;
}
body.admin-bar .sticky.navbar {
	top: 32px;
}
html {
	scroll-behavior:smooth;
	font-display: swap
}
strong {
	font-weight: 700;
}
/* Links */
a {
	transition: all 0.5s;
	text-decoration: none;
}
a:focus, a:hover {
	text-decoration: none;
	outline: 0;
}
a:focus {
	outline: 0;
	outline-offset: -2px;
}
button, button:focus, button:active {
	outline: 0;
	box-shadow: 0
}
#error header a {
	color:#000;
}
/* /Links */

/* Background classes */
.bg-glass {
	backdrop-filter: blur(10px);
	transition: all linear 0.3s;
}
.bg-test {
	background-color: rgba(255,0,0,0.5);
}

/* /Background classes */


/* Image responsive fix */
img {
	width: initial;
	max-width: 100%;
	height: auto;
}
/* /Image responsive fix */


/* Headers */
h1, h2, h3, h4, h5 {
	color:#000;
	font-weight: 500;
}
h1, .h1 {
	font-size: 50px;
	font-weight: 500;
}
h2, .h2 {
	font-size: 30px;
}

header h2, header .h2 {
	font-size: 50px;
}
h3, .h3 {
	font-size: 17px;
}
.desc-box h3, .desc-box .h3,
.service-box h3, .service-box .h3 {
	font-size: 20px;
}
.ubermenu-custom-content h3 {
	margin-top: 10px;
}
h4, .h4 {
	font-size: 22px;
}
h5, .h5 {
	font-size: 18px;
}
h6, .h6 {
	font-size: 16px;
}
@media screen and (max-width: 768px) {
	h1, .h1 {
		font-size: 40px;
	}
    header h2, header .h2 {
        font-size: 40px;
    }
}
/* /Headers */

/* =========================================
   BOOTSTRAP 5.3 - SIATKA 5-KOLUMNOWA
========================================= */

/* --- XS (Domyślnie, telefony) --- */
.col-1-5 { flex: 0 0 auto; width: 20%; }
.col-2-5 { flex: 0 0 auto; width: 40%; }
.col-3-5 { flex: 0 0 auto; width: 60%; }
.col-4-5 { flex: 0 0 auto; width: 80%; }
.col-5-5 { flex: 0 0 auto; width: 100%; }

/* --- SM (Małe urządzenia, >= 576px) --- */
@media (min-width: 576px) {
  .col-sm-1-5 { flex: 0 0 auto; width: 20%; }
  .col-sm-2-5 { flex: 0 0 auto; width: 40%; }
  .col-sm-3-5 { flex: 0 0 auto; width: 60%; }
  .col-sm-4-5 { flex: 0 0 auto; width: 80%; }
  .col-sm-5-5 { flex: 0 0 auto; width: 100%; }
}

/* --- MD (Średnie urządzenia, >= 768px) --- */
@media (min-width: 768px) {
  .col-md-1-5 { flex: 0 0 auto; width: 20%; }
  .col-md-2-5 { flex: 0 0 auto; width: 40%; }
  .col-md-3-5 { flex: 0 0 auto; width: 60%; }
  .col-md-4-5 { flex: 0 0 auto; width: 80%; }
  .col-md-5-5 { flex: 0 0 auto; width: 100%; }
}

/* --- LG (Duże urządzenia, >= 992px) --- */
@media (min-width: 992px) {
  .col-lg-1-5 { flex: 0 0 auto; width: 20%; }
  .col-lg-2-5 { flex: 0 0 auto; width: 40%; }
  .col-lg-3-5 { flex: 0 0 auto; width: 60%; }
  .col-lg-4-5 { flex: 0 0 auto; width: 80%; }
  .col-lg-5-5 { flex: 0 0 auto; width: 100%; }
}

/* --- XL (Bardzo duże urządzenia, >= 1200px) --- */
@media (min-width: 1200px) {
  .col-xl-1-5 { flex: 0 0 auto; width: 20%; }
  .col-xl-2-5 { flex: 0 0 auto; width: 40%; }
  .col-xl-3-5 { flex: 0 0 auto; width: 60%; }
  .col-xl-4-5 { flex: 0 0 auto; width: 80%; }
  .col-xl-5-5 { flex: 0 0 auto; width: 100%; }
}

/* --- XXL (Ogromne urządzenia, >= 1400px) --- */
@media (min-width: 1400px) {
  .col-xxl-1-5 { flex: 0 0 auto; width: 20%; }
  .col-xxl-2-5 { flex: 0 0 auto; width: 40%; }
  .col-xxl-3-5 { flex: 0 0 auto; width: 60%; }
  .col-xxl-4-5 { flex: 0 0 auto; width: 80%; }
  .col-xxl-5-5 { flex: 0 0 auto; width: 100%; }
}

/* POZYCJONOWANIE ELEMENTÓW */
/* Małe urządzenia (telefony w poziomie, 576px i więcej) */
@media (min-width: 576px) {
  .position-sm-static   { position: static !important; }
  .position-sm-relative { position: relative !important; }
  .position-sm-absolute { position: absolute !important; }
  .position-sm-fixed    { position: fixed !important; }
  .position-sm-sticky   { position: sticky !important; }
}

/* Średnie urządzenia (tablety, 768px i więcej) */
@media (min-width: 768px) {
  .position-md-static   { position: static !important; }
  .position-md-relative { position: relative !important; }
  .position-md-absolute { position: absolute !important; }
  .position-md-fixed    { position: fixed !important; }
  .position-md-sticky   { position: sticky !important; }
}

/* Duże urządzenia (desktopy, 992px i więcej) */
@media (min-width: 992px) {
  .position-lg-static   { position: static !important; }
  .position-lg-relative { position: relative !important; }
  .position-lg-absolute { position: absolute !important; }
  .position-lg-fixed    { position: fixed !important; }
  .position-lg-sticky   { position: sticky !important; }
}

/* Bardzo duże urządzenia (duże desktopy, 1200px i więcej) */
@media (min-width: 1200px) {
  .position-xl-static   { position: static !important; }
  .position-xl-relative { position: relative !important; }
  .position-xl-absolute { position: absolute !important; }
  .position-xl-fixed    { position: fixed !important; }
  .position-xl-sticky   { position: sticky !important; }
}

/* Ekstra duże urządzenia (ogromne monitory, 1400px i więcej) */
@media (min-width: 1400px) {
  .position-xxl-static   { position: static !important; }
  .position-xxl-relative { position: relative !important; }
  .position-xxl-absolute { position: absolute !important; }
  .position-xxl-fixed    { position: fixed !important; }
  .position-xxl-sticky   { position: sticky !important; }
}
/* Bootstrap extra spaces */
.pt-6,
.py-6 {
	padding-top: 5rem !important;
}

.pe-6,
.px-6 {
	padding-right: 5rem !important;
}

.pb-6,
.py-6 {
	padding-bottom: 5rem !important;
}

.ps-6,
.px-6 {
	padding-left: 5rem !important;
}
.mt-6,
.my-6 {
	margin-top: 5rem !important;
}

.mr-6,
.mx-6 {
	margin-right: 5rem !important;
}

.mb-6,
.my-6 {
	margin-bottom: 5rem !important;
}

.ms-6,
.mx-6 {
	margin-left: 5rem !important;
}
.py-6-fixed {
	padding-top: 4rem !important;
	padding-bottom: 7rem !important;
}
@media only screen and (max-width : 768px) {
	.py-6-fixed {
		padding-top: 4rem !important;
		padding-bottom: 7rem !important;
	}
	.pt-6,
	.py-6 {
		padding-top: 4rem !important;
	}

	.pr-6,
	.px-6 {
		padding-right: 4rem !important;
	}

	.pb-6,
	.py-6 {
		padding-bottom: 4rem !important;
	}

	.pl-6,
	.px-6 {
		padding-left: 4rem !important;
	}
	.mt-6,
	.my-6 {
		margin-top: 4rem !important;
	}

	.me-6,
	.mx-6 {
		margin-right: 4rem !important;
	}

	.mb-6,
	.my-6 {
		margin-bottom: 4rem !important;
	}

	.ms-6,
	.mx-6 {
		margin-left: 4rem !important;
	}
}
/* /Bootstrap extra spaces */

/* Bootstrap accordion */
.accordion-button:focus {
    box-shadow: none;
    border-color: rgba(0,0,0,.125);
}
.accordion .accordion-item {
	border-bottom-width: 0;
	margin-bottom: 1px;
}
.accordion .accordion-button {
	font-size: 17px;
	font-weight: 500;
	text-transform: uppercase;
	border-radius: 25px !important;
	border-bottom: 0 !important;
	background-color: #e7e7e7;
	padding: 25px 20px 25px 25px;
}
.accordion .accordion-button:not(.collapsed),
.accordion .accordion-button:hover {
	background-color: #000;
	color:#fff;
}
.accordion .accordion-button:not(.collapsed)::after,
.accordion .accordion-button:hover::after {
	filter: brightness(0) invert(1);
}

/* /Bootstrap accordion */

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
  border-color: transparent;
  box-shadow: none;
  outline: 0 none;
}
/* Buttons */
.btn-default {
	background-color: #000;
	border:1px solid #000;
	border-radius: 15px;
	font-size: 16px;
	font-weight: 400;
	color: #fff;
	padding:14px 30px;
	transition: all 0.5s;
	box-shadow: none;
	--bs-box-shadow: none;
	text-transform: uppercase;
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {
	background-color:#e75e1d;
	color: #fff;
	transition: all 0.5s;
}
.btn-text {
	font-size: 14px;
	font-weight: 400;
	color: #000;
	transition: all 0.5s;
	padding-left: 0;
	box-shadow: none;
	--bs-box-shadow: none;
	text-transform: uppercase;
}
.btn-text:hover,
.btn-text:focus,
.btn-text:active {
	color: #e75e1d;
	transition: all 0.5s;
}
.btn-big {
	color:#fff;
	background: #000;
	border-radius: 15px;
	position: relative;
	transition: all 0.5s;
	margin-left: auto;
	padding:15px;
	padding-left:25px;
	padding-right:78px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.btn-big::after {
	content:'';
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	width: 40px;
	height:40px;
	border-radius: 50%;
	background-color: #fff;
	right: 15px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8"/></svg>');
	background-repeat: no-repeat;
	background-position: center;
}
.btn-big:hover,
.btn-big:focus,
.btn-big:active {
	background-color:#e75e1d;
	color: #fff;
	transition: all 0.5s;
}

.accordions-readmore-wrapper .btn-default {
	background-color: transparent;
	border:0;
	text-transform: uppercase;
	border-radius: 50px;
	font-size: 15px;
	font-weight: 500;
	color: #000;
	padding:0;
	transition: all 0.5s;
}
.btn-arrow {
	padding-right: 50px;
	position: relative;
}

.btn-arrow::after {
	content: '';
	position: absolute;
	right: 5px;
	top: 6px;
	width: 33px;
	height: 33px;
	background-image: url(../img/arrow-right-circle-fill.svg);
	background-repeat: no-repeat;
}
.focus.btn-arrow::after {
	background-image: none;
}
.focus.btn-arrow a {
	position: relative;
	padding-right:50px !important;
}
.focus.btn-arrow a::after {
	content: '';
	position: absolute;
	right: 5px;
	top: 11px;
	width: 33px;
	height: 33px;
	background-image: url(../img/arrow-right-circle-fill.svg);
	background-repeat: no-repeat;
	transition: all 0.5s;
}
.sticky .focus.btn-arrow a::after {
	top: 8px;
}
.btn-default.btn-search {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	padding-top: 16px;
	padding-bottom: 17px;
}
.cn-button.bootstrap {
	background-color: #e75e1d !important;
	text-transform: uppercase !important;
}
.btn:focus, .btn:active {
  outline: none !important;
  box-shadow: none !important;
}
/* /Buttons */

section {
	position: relative;
}
.relative {
	position: relative;
}
.absolute {
	position: absolute;
}

/* Vertical align */
.vertical-a {
	display: flex;
	justify-content: center;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	/* IE10+ CSS styles go here */
	.vertical-align {
		display: block;
	}
}
.vertical-b {
	align-self: center;
	width: 100%;
}
/* /Vertical align */

/* Placeholder  */
::-webkit-input-placeholder {
	color:#888;
}
:-moz-placeholder {
	color:#888;
}
::-moz-placeholder {
	color:#888;
}
:-ms-input-placeholder {
	color:#888;
}
/* /Placeholder  */

/* Selection  */
::selection {
	background: #000; /* WebKit/Blink Browsers */
	color:#fff;
}
::-moz-selection {
	background: #000; /* Gecko Browsers */
	color:#fff;
}
/* /Selection */

/* Box links (often used)  */
.box-link {
	position:absolute;
	height:100%;
	width:100%;
	left:0px;
	top:0px;
	cursor: pointer;
}
/* /Box links (often used)  */


.dark, .dark p, .dark a, .dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6, .dark .h1, .dark .h2, .dark .h3, .dark .h4, .dark .h5, .dark .h6 {
	color: #fff;
}


/* Element single post box */
.post-box--img {
	width: 100%;
	height: 380px;
	position: relative;
}
.post-box--img img {
	width: 100%;
	height: 380px;
	object-fit: cover;
}
/* /Element single post box */

/* Image fill */
.fill {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}
.fill img { 
	min-height:100%; 
	min-width: 100%; 
	object-fit: cover; 
	border-radius: 15px;
}
.fill-not-100 img { 
	height: auto;
	min-height: auto;
	object-fit: cover; 
	border-radius: 15px;
}
/* /Image fill */


/* ============================================= */
/* 2. Contact form 7                             */
/* ============================================= */
.wpcf7 input[type="text"],
.wpcf7 input[type="date"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7-select,
.wpcf7 textarea {
	background-color: #fff;
	color: #303338;
	border-radius: 10px;
	border:1px solid #fff;
	padding: 15px 20px;
	font-size: 15px;
	width: 100% !important;
	color:#fff;
	
}
.wpcf7 label {
	width: 100%;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 17px;
}
.wpcf7 label input,
.wpcf7 label textarea {
	margin-top:8px;
}
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7-select:focus {
	background-color: #fff;
	color: #303338;
	box-shadow: none;
	outline: 0 none;
}
.wpcf7-form select {
	padding: 0px;
	line-height: 40px;
}
.wpcf7-list-item {
	display: block;
}

.wpcf7-list-item-label {
	color:#000; 
	font-size: 16px;
	margin-left: 20px;
	text-transform: none;
	font-weight: 300;
}

.wpcf7-list-item-label a {
	color:#fff; 
	font-weight: 500;
}

.wpcf7-form-control.wpcf7-acceptance label {
    display: flex;
    line-height: 1.2;
}

.wpcf7-form-control.wpcf7-acceptance input[type="checkbox"] {
    width: auto;
    margin-top: 2px;
    margin-right: 5px;
    align-self: start;
}
.wpcf7 .wpcf7-not-valid-tip {
	font-size: 14px;
}
.wpcf7-form-control.wpcf7-acceptance .wpcf7-list-item {
    margin-left: 0;
}
.submit-wrap {
    position: relative;
    display: inline-block;
	width: auto;
}
.submit-wrap p {
    margin:0;
	padding:0;
}

.wpcf7-submit {
    color: #fff;
    background: #000;
    border: 0;
    border-radius: 15px;
    transition: all 0.5s;
    margin-left: auto;
    padding: 15px;
    padding-left: 37px;
    padding-right: 78px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: inline-block;
    cursor: pointer;
}

.submit-wrap::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #fff;
    right: 90px;
    pointer-events: none; /* żeby klik przechodził przez kółko na input */
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
}


.wpcf7-submit:disabled {
	opacity:0.7;
}
/* Placeholder  */
::-webkit-input-placeholder {
 color:#fff;
 opacity: 0.7;
}
:-moz-placeholder {
 color:#fff;
 opacity: 0.7;
}
::-moz-placeholder {
 color:#fff;
 opacity: 0.7;
}
:-ms-input-placeholder {
 color:#fff;
 opacity: 0.7;
}
:active::-webkit-input-placeholder,
:focus::-webkit-input-placeholder {
 color:#b5b5b5;
 opacity: 1;
}
:active::-moz-placeholder,
:focus::-moz-placeholder {
 color:#b5b5b5;
 opacity: 1;
}
:active::-moz-placeholder,
:focus::-moz-placeholder {
 color:#b5b5b5;
 opacity: 1;
}
:active::-ms-input-placeholder,
:focus::-ms-input-placeholder {
 color:#b5b5b5;
 opacity: 1;
}
/* /Placeholder  */

/* ============================================= */
/* 3. Navbar (bootstrap)                         */
/* ============================================= */
#main-menu-container {
	width: 100%;
	left: 0;
}
.navbar {
	margin-top: 20px;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
	background-color: #fff !important;
	transition: background-color 0.6s cubic-bezier(0.16, 1, 0.3, 1), padding 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.sticky.navbar {
	position: fixed !important;
	top: 0;
	left: 0;
	margin-top: 0 !important;
	padding-top: 5px !important;
	padding-bottom: 5px !important;
	animation: slideDown 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes slideDown {
    0% { transform: translateY(-100%); }
    100% { transform: translateY(0); }
}
.navbar .navbar--bg {
	height: 100%;
	width: calc(100% - 6rem);
	left: 5px;
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.05);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.05);
	box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.05);
	background-color:rgb(4, 20, 27, 0.7) !important;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}
.navbar-brand {
	padding-bottom: 0;
	padding-top: 0;
	margin-right: 50px;
}
.navbar-brand img {
	transition: all linear 0.3s;
}

.sticky .navbar-brand img {
	transform:scale(0.7);
	transition: all linear 0.3s;
}

.navbar-nav .nav-link {
	color: #000000;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-size: 14px;
	font-weight: 400;
	padding:15px 0px !important;
	margin: auto 22px;
	border-bottom:2px solid transparent;
	transition: all 0.5s;
	text-align: center;
}
.navbar-nav .focus .nav-link {
	border-bottom: 0px !important;
	padding:15px 15px !important;
	line-height: 26px;
	padding-right: 55px !important;
}

#main-menu-container .focus {
	color:#fff;
	background: #000;
	border-radius: 15px;
	position: relative;
	transition: all 0.5s;
	margin-left: auto;
}
#main-menu-container .focus:hover {
	background: #e75e1d;
}
#main-menu-container .focus::after {
	content:'';
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	width: 40px;
	height:40px;
	border-radius: 50%;
	background-color: #fff;
	right: 15px;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8"/></svg>');
	background-repeat: no-repeat;
	background-position: center;
}

#main-menu-container .focus a {
	color:#fff;
	font-size: 16px;
}
#main-menu-container .focus:hover a {
	font-size: 16px;
	border-bottom:0px;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus,
.navbar-nav .show > .nav-link,
.navbar-nav .nav-link.show {
	color: #000;
	border-bottom:2px solid #000;
	transition: all 0.5s;
}
.navbar-nav .current-menu-item .active > .nav-link,
.navbar-nav .current-menu-item .nav-link.active {
	color: #000;
	border-bottom:2px solid #000;
}

@media only screen and (max-width : 991px) {
	.navbar {
		margin-top: 10px;
		border-radius: 15px;
	}
	.active > .nav-link,
	.nav-link.active {
		color: #fff !important;
		border-bottom:2px solid #fff;
	}
		
	.navbar-collapse .navbar-nav {
		background-color: #000 !important;
		border-radius: 25px;
		padding-bottom: 15px;
		margin-top: 10px;
	}
	#main-menu-container .focus {
		color:#000;
		background: #fff;
		border-radius: 15px;
		position: relative;
		transition: all 0.5s;
		margin-left: 0;
	}
	#main-menu-container .focus a {
		color:#000;
	}
	.navbar-nav .nav-link {
		color: #fff;
	}
	.navbar-nav .nav-link:hover,
	.navbar-nav .nav-link:focus,
	.navbar-nav .show > .nav-link,
	.navbar-nav .nav-link.show {
		color: #fff;
		border-bottom:2px solid #fff;
		transition: all 0.5s;
	}
	.navbar-nav .current-menu-item .active > .nav-link,
	.navbar-nav .current-menu-item .nav-link.active {
		color: #fff;
		border-bottom:2px solid #fff;
	}
	#main-menu-container .focus::after {
		
		background-color: #000;
		background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="%23fff" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8"/></svg>');
	}
}
@media only screen and (max-width : 959px) {
	#main-menu-container {
		margin-left: 20px;
		width: calc(100% - 40px);
	}
	#main-menu-container.sticky {
		margin-top:10px !important;
	}
	#main-menu-container .navbar-brand img {
		width: 140px;
	}

}
.navbar-toggler {
	transition: all 0.5s;
	background-color: #000;
	border-radius: 10px;
}
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
}

.navbar-toggler span {
	display: block;
	background-color: rgba(255,255,255,0.6);
	height: 2px;
	width: 24px;
	margin-top: 6px;
	margin-bottom: 6px;
	position: relative;
	left: 0;
	opacity: 1;
	transition: all 0.35s ease-out;
	transform-origin: center left;
}
.navbar-toggler span:nth-child(1) {
	transform: translate(0%, 0%) rotate(0deg);
}
 
.navbar-toggler span:nth-child(2) {
	opacity: 1;
}
 
.navbar-toggler span:nth-child(3) {
	transform: translate(0%, 0%) rotate(0deg);
}
.navbar-toggler span:nth-child(1) {
	margin-top: 0.3em;
}
 
.navbar-toggler:not(.collapsed) span:nth-child(1) {
	transform: translate(15%, -33%) rotate(45deg);
}
 
.navbar-toggler:not(.collapsed) span:nth-child(2) {
	opacity: 0;
}
.navbar-toggler:not(.collapsed) span:nth-child(3) {
	transform: translate(15%, 33%) rotate(-45deg);
}

.navbar .contact a.nav-link {
	background: #00465e;
	/*background: linear-gradient(0deg, rgba(33,37,41,1) 0%, rgba(0,62,83,1) 100%);*/
}
.search-activator {
	cursor: pointer;
}

.search-activator a.nav-link {
	text-indent: -9999px;
	background-image: url(../img/icon-main-menu-search.png);
	background-repeat: no-repeat;
	background-position: center;
}

.dropdown-menu {
	margin-top: -2px;
	border-radius: 15px;
	background-color: #1e1e1e;
	border:0px;
	text-transform: uppercase;
	-webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.10);
	-moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.10);
	box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.10);
}
.dropdown-menu a {
	margin: 8px 0;
	line-height: 26px !important;
}
@media only screen and (max-width : 991px) {
	.dropdown-menu a {
		text-wrap: wrap;
		line-height: 20px !important;
	}
}
.dropdown-menu[data-bs-popper] {
	margin-top: -1px;
	border-top:1px solid transparent;
}
.dropdown-menu li a.dropdown-item {
	font-size: 14px;
	line-height: 35px;
	color: #fff;
	transition: all 0.5s;
	padding-left: 22px;
	padding-right: 22px;
}


.dropdown-menu li a.dropdown-item:hover {
	color:#e75e1d;
	transition: all 0.3s;
}
.dropdown-menu li a.dropdown-item:hover,
.dropdown-menu li a.dropdown-item:focus,
.dropdown-menu li a.dropdown-item:active {
	background-color: transparent;
	transition: all 0.3s;
	border-left-color: #e75e1d;
}
.dropdown-item.active {
	background-color: transparent;
	color:#e75e1d !important;
}


/* Search window */
#search-container {
	display: none;
	position: fixed;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,0.9);
	top:0px;
	left:0px;
	max-height: 100vh;
	z-index: 999999999;
}
#search-container .d-flex {
	height: 100%;
}
#search-close {
	position: absolute;
	right: 40px;
	top:25px;
	background-image: url(../img/search-close.png);
	background-repeat: no-repeat;
	background-color: transparent;
	height: 41px;
	width: 41px;
	z-index: 100000;
	cursor: pointer;
}
#search-close span {
	position: absolute;
	right: 50px;
	top:10px;
	width: 100px;
	text-align: right;
	color: #fff
}
#search-container .vertical-align {
	height: 100%;
}
#title .form-control {
	border:0;
}
.search-btn {
	background-image: url(../img/icon-search.png);
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
}
.search-input {
	border-top-left-radius: 15px;
	border-bottom-left-radius: 15px;
	line-height:59px;
	background-color: #e7e7e7;
	height:59px;
	padding-left: 25px;
}
.search-input:focus,
.search-input:active, 
.search-input:hover {
	background-color: #fff;
	border:1px solid #e7e7e7 !important;
}
/* /Search window */

/* Open on hover for desktops only */
ul.nav li.dropdown:hover > ul.dropdown-menu {
	display: block;    
}
@media (min-width: 979px) {
	ul.nav li.dropdown:hover > ul.dropdown-menu {
		display: block;
	}
}
/* /Open on hover for desktops only */


/* ============================================= */
/* 4. ACF elements                               */
/* ============================================= */
.embed-container { 
    position: relative; 
    padding-bottom: 56.25%;
    overflow: hidden;
    max-width: 100%;
    height: auto;
} 
.embed-container iframe,
.embed-container object,
.embed-container embed { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.acf-map {
	width: 100%;
	height: 475px;
	margin-bottom: 0px;
}
/* fixes potential theme css conflict */
.acf-map img {
	max-width: inherit !important;
}
.gm-style iframe + div { border:none!important; }

/* ============================================= */
/* 5. Theme styles                               */
/* ============================================= */

/* Tiny Slider Banner */
.banner-slider-container .height-keeper {
	left: 12px;
	top: 0;
	width: 100%;
	min-height: 700px;
	overflow:hidden;
	padding-bottom: 50px;
}
.slider-container .slider-controls {
	margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;   
    top: 50%;
    transform: translatey(-50%);
    display: flex;
    align-items: center;    
    justify-content: space-between;
}
.banner-slider-container .slider-controls,
#testimonials .slider-controls {
	top: auto;
	bottom: 50px;
	left: auto;
	right: 15px;
	z-index: 40;
	transform: none;
	width: auto;
	gap: 10px;
}
#testimonials .slider-controls {
	bottom: -60px;
}
.banner-slider-container .slider-item,
#testimonials .slider-item {
	padding: 0;
	height: 826px;
	max-height: 70vh;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 15px;
}
.arrow {
	height: 40px;
	width: 40px;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
	background-color: #fff;
	border-radius: 50%;
}
#testimonials .arrow {
	height: 40px;
	width: 40px;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
	background-color: #e7e7e7;
	border-radius: 50%;
}

.arrow.arrow-left {
	background-image: url(../img/arrow-left.webp);
}
.arrow.arrow-right {
	background-image: url(../img/arrow-right.webp);
}
.tns-nav {
	position: absolute;
	left: 50%;
	bottom: -50px;
	transform: translateX(-50%);
}
.tns-nav button {
	background-color: #cfcfcf;
	border:0;
	margin: auto 5px;
	border-radius: 50%;
	width: 12px;
	height: 12px;
}
.tns-nav button.tns-nav-active {
	background-color: #000;
	border:0;
	margin: auto 5px;
	border-radius: 50%;
	width: 12px;
	height: 12px;
}
/* /Tiny Slider Banner */

.line {
	display: inline-block;
	width: 70px;
	height: 2px;
	background-color: #000;
	vertical-align: middle;
	margin: 0 10px;
}
.dark .line {
	background-color: #fff;
}
.kicker,
.banner-slider-desc--scene-no {
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 0.04em;
	font-weight: 400;
	background-image: url(../img/bg-kicker.webp);
	background-repeat: no-repeat;
	background-position: center left;
	display: inline-block;
	padding-left: 50px;
	margin-bottom: 8px;
}
.step-no.kicker {
	opacity:0.5;
}
.banner-slider-desc--scene-no {
	background-image: url(../img/bg-kicker-light.webp);
}
.custom--padding {
	padding: 15px 15px 0px 15px;
	transition: all linear 0.3s;
}
/* Stan początkowy elementu (ukryty i przesunięty w dół) */
.animate {
    opacity: 0;
    transform: translateY(40px); /* Zmień wartość, aby kontrolować dystans "wypłynięcia" */
    
    /* Krzywa cubic-bezier nadająca animacji charakter premium */
    transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), 
                transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
                
    /* Wskazówka dla przeglądarki, aby sprzętowo przyspieszyć te właściwości */
    will-change: opacity, transform; 
}

/* Stan końcowy elementu (widoczny i na swoim miejscu) */
.animate.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Opcjonalnie: Klasy pomocnicze do opóźniania animacji (np. dla siatki elementów) */
.animate.delay-100 { transition-delay: 100ms; }
.animate.delay-200 { transition-delay: 200ms; }
.animate.delay-300 { transition-delay: 300ms; }

/* Zapewnia właściwe zachowanie nagłówka przed i w trakcie łamania linii */
.text-reveal-mask {
    visibility: hidden; /* Ukrywa tekst zanim skrypt JS go przetworzy */
}

/* Kiedy JS jest gotowy, pokazujemy nagłówek, ale słowa nadal są ukryte głębiej */
.text-reveal-mask.ready {
    visibility: visible;
}

/* Zewnętrzny kontener słowa - MASKA */
.text-reveal-mask .word-wrapper {
    display: inline-block; /* Aby słowa zachowywały się jak tekst */
    overflow: hidden;      /* To jest nasza MASKA. Odcina dolną krawędź */
    vertical-align: bottom; /* Ważne dla poprawnego wyrównania słów w linii */
    
    /* Mały hack, aby kropki nad 'i' czy ogonki (ą, ę) nie zostały ucięte */
    padding-bottom: 0.1em;
    margin-bottom: -0.1em;
}

/* Wewnętrzny element zawierający samo SŁOWO - to on się porusza */
.text-reveal-mask .word-inner {
    display: block;
    
    /* Stan początkowy: Schowany poniżej dolnej krawędzi maski */
    transform: translateY(110%);
    opacity: 0; /* Dodajemy lekkie fade-in dla płynności */
    
    /* Super-płynna, dynamiczna krzywa (Cubic Bezier - Webflow Style) */
    transition: transform 1s cubic-bezier(0.19, 1, 0.22, 1),
                opacity 1s cubic-bezier(0.19, 1, 0.22, 1);
}

/* Wyzwalacz animacji dodawany przez JavaScript na scroll */
.text-reveal-mask.is-visible .word-inner {
    transform: translateY(0); /* Słowo wyjeżdża do góry */
    opacity: 1;
}
.banner-slider-descs {
	bottom:40px;
	pointer-events: none;
}
@media only screen and (max-width : 991px) {
	.banner-slider-descs {
		bottom:0px;
		pointer-events: none;
	}
}
.banner-slider-desc {
	width: 20%;
	margin-right:25px;
	opacity: 0.5;
	transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1);
	position: relative;
	padding-top: 15px;
	pointer-events: auto;
	cursor: pointer;
}
.banner-slider-desc:hover {
	opacity: 1;
}
.banner-slider-desc::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: rgba(255, 255, 255, 0.5);
}
.banner-slider-desc::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 2px;
	background-color: rgba(255, 255, 255, 1);
	transition: width 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.banner-slider-desc.active {
	opacity: 1;
}
.banner-slider-desc.active::after {
	width: 100%;
}
#banner .curtine {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/bg-banner-curtine.webp);
	background-repeat: no-repeat;
	background-position: left bottom;
	z-index: 1;
	border-radius: 15px;
	pointer-events: none;
}
.banner-slider-desc--content {
	font-size: 17px;
	text-transform: uppercase;
	font-weight: 500;
}
hr {
	border-top-color: #000;
	border-top-width: 2px;
	opacity: 1;
	margin-top: 40px;
	margin-bottom: 40px;
}
/* Accordion readmore */
.accordions-readmore-wrapper {
	margin-top: 40px;
}
.accordions-readmore-wrapper .read-more-btn .accordion-hide {
	display:inline
}
.accordions-readmore-wrapper .read-more-btn:not(.collapsed) .accordion-show {
	display:none
}
.accordions-readmore-wrapper .read-more-btn.collapsed .accordion-hide {
	display:none
}
.accordions-readmore-wrapper .accordion-read-more {
	position: relative;
}

.accordions-readmore-wrapper .accordion-read-more .accordion-item,
#gallery .accordion-item,
.accordion-premises .accordion-item {
 background-color: transparent;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-body,
#gallery .accordion-read-more .accordion-body,
.accordion-premises .accordion-body {
 padding-left: 0;
 padding-right: 0;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button.read-more-btn {
	background-color: transparent;
	padding:0;
	position: relative;
	border:0;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button.read-more-btn::before {
	content:"";
	position: absolute;
	left: -5px;
	top:-100px;
	height: 100px;
	width: calc(100% + 10px);
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button.read-more-btn:not(.collapsed)::before {
	display: none;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button.read-more-btn::after {
	display: none;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button {
	color:#000 !important;
	padding:0;
	font-size: 18px;
	font-weight: 400;
	position: relative;
	display: inline-block;
	box-shadow: none !important;
    border-color: rgba(0,0,0,.125) !important;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button span {
	position: relative;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button span::after{
	content:"";
	position: absolute;
	right: -20px;
	top: 50%;
	transform: translateY(-50%);
	width: 11px;
	height: 11px;
	transition: all 0.5s;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button span:hover{
	color:#000;
}
.accordions-readmore-wrapper .accordion-read-more .accordion-button span:hover::after{
	right: -30px;
}
/* Accordion readmore */
.bg-grey {
	background-color: #e7e7e7;
}
.feature-box {
	height: 100%;
	transition: all 0.5s;
}
.feature-box:hover {
	background-color:#e7e7e7;
}
@media only screen and (max-width : 991px) {
	.feature-box {
		background-color:#e7e7e7;
	}
}
.feature-box--icon,
.service-box--icon,
.contact-box--icon {
	width: 30px;
}
.tooltip-inner {
	text-transform: uppercase;
	font-size: 14px;
	padding: 20px 10px;
}
h3.border-bottom {
	border-bottom:1px solid #000 !important;
	padding-bottom: 15px;
	margin-bottom: 15px;
}
.blockquote blockquote {
	position: relative;
	font-size: 30px;
	font-weight: 500;
	line-height:34px;
}
.blockquote blockquote:before {
	position:absolute;
	content:'';
	background-image: url(../img/bg-blockquote.webp);
	width: 32px;
	height:29px;
	left: -60px;
}
@media only screen and (max-width : 991px) {
	.blockquote blockquote {
		margin-top: 30px;
	}
	.blockquote blockquote:before  {
		top:-55px;
		left: 0px;
	}
}
.blockquote .meta {
	font-size: 14px;
	font-weight: 400;
}
.blockquote .meta span {
	font-size: 14px;
	font-weight: 400;
	padding-left:50px;
	position: relative;
	margin-right: 30px;
}
.blockquote .meta span::before {
	position:absolute;
	content:'';
	width: 30px;
	height:1px;
	background-color: #000;
	left: 0;
	top:50%;
}
.font-size-14 {
	font-size: 14px;
	line-height: 18px;
}
.font-size-20 {
	font-size: 20px;
	line-height: 24px;
}
footer .font-size-20 {
	font-size: 18px;
	line-height: 20px;
}
.font-size-34 {
	font-size: 34px;
	line-height: 40px;
}
.service-box {
	height: 250px;
	overflow: hidden;
	transition: all 0.5s;
}
.service-box--desc h3 {
	max-width: 70%;
	margin-bottom: 0;
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.service-box--desc-legend {
	margin-top: 15px;
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
	position: absolute;
}
.service-box:hover {
	background-color: #000;
}
.service-box:hover h3,
.service-box:hover .service-box--desc-legend,
.service-box:hover p {
	color:#fff;
}
.service-box:hover img {
	filter: brightness(0) invert(1);
}
.service-box:hover .service-box--desc h3 {
	transform: translateY(-40px);
}
.service-box:hover .service-box--desc-legend {
	opacity: 1;
	transform: translateY(-30px);
}
@media only screen and (max-width : 991px) {
	.service-box--desc h3 {
		max-width: 100%;
	}
}
.services-image {
	height: 523px;
	background-size: cover;
	background-position: center;
}
@media (min-width: 992px) {
	.services-image {
		/* Wysokość odpowiadająca 2 rzędom kafelków (2 * 295px) + odstęp między nimi (mt-4 to 1.5rem) */
		height: calc(250px * 2 + 1.5rem);
	}
}
.font-weight-400 {
	font-weight: 400;
}
.project-box,
.post-box {
	transition: all 0.5s;
}
.project-box:hover,
.post-box:hover {
	background-color: #e7e7e7;
}
.project-box--img {
	height: 550px;
}
.project-box--img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}
.project-box--title,
.post-box--title {
	width: 100%;
}
.project-box--title span,
.post-box--title span {
	position: relative;
	z-index: 2;
	background-color: #fff;
	padding-right: 25px; /* Odstęp 25px od tekstu do początku linii */
	display: inline-block;
	max-width: 100%;
	transition: all 0.5s;
}
.post-box--title a {
	color:#000;
}
.project-box:hover .project-box--title span,
.post-box:hover .post-box--title span {
	background-color: #e7e7e7;
}
#archive .project-box .project-box--title span,
#archive .post-box .post-box--title span {
	background-color: #e7e7e7;
}
.project-box--title::after,
.post-box--title::after {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 2px;
	background-color: #000; /* Kolor czarny - dopasuj do potrzeb */
	z-index: 1;
	transition: width 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.project-box:hover .project-box--title::after,
.post-box:hover .post-box--title::after {
	width: 100%;
}
.row-imgs {
    position: relative;
    padding-bottom: 120px; /* miejsce na wystającą część drugiego obrazka */
}

.row-imgs img:first-child {
    position: relative;
    left: 0;
    top: 0;
    width: 90%;
    height: auto;
    display: block;
}
.row-imgs img:last-child {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 40%;
    height: auto;
}
.even .row-imgs {
    position: relative;
    padding-top: 80px; /* miejsce na wystającą część drugiego obrazka */
	padding-bottom: 0;
}
.even .row-imgs img:first-child {
    position: relative;
	margin-left: auto;
    top: 0;
    width: 90%;
    height: auto;
    display: block;
}
.even .row-imgs img:last-child {
    left: 0;
    top: 0;
    width: 35%;
    height: auto;
}
footer ul {
	padding:0;
}
footer ul li {
	padding:3px 0;
	list-style: none;
}
footer a:hover{
	color:#e75e1d;
}
.contact span {
	display: block;
}
.contact span[itemprop="postalCode"], 
.contact span[itemprop="addressLocality"] {
	display: inline-block;
}
.contact-box {
	transition: all 0.5s;
}
.contact-box:hover {
	background-color: #000;
	color:#fff;
}
.contact-box:hover h3 {
	color:#fff;
}
.contact-box:hover img {
	filter: brightness(0) invert(1);
}
#separator-img {
	/* Usunięto height: 450px; oraz overflow: hidden; aby kontener z paralaksą i jego border-radius były w pełni widoczne */
}
#info-on-image .bg-img {
	background-size: cover;
	background-position: center;
}
.testimonial-box {
	background-image: url(../img/bg-testimonial-box.webp);
	background-repeat: no-repeat;
	background-position: top 50px right 40px;
}
.testimonial-box--stars span {
	background-image: url(../img/bg-star.webp);
	display: inline-block;
	width: 17px;
	height: 15px;
}
.categories-wrapper {
	padding:0;
	margin:0;
}
.categories-wrapper li {
	display: inline-block;
	list-style: none;
	margin-bottom:2px;
}
.categories-wrapper li a {
	display: inline-block;
	list-style: none;
	background-color: #e7e7e7;
	border-radius: 15px;
	font-size: 16px;
	font-weight: 400;
	color: #000;
	padding:14px 30px;
	transition: all 0.5s;
	box-shadow: none;
	--bs-box-shadow: none;
	text-transform: uppercase;
}
.categories-wrapper li a:hover,
.categories-wrapper li.current-cat a {
	background-color: #000;
	color: #fff;
}

/* Element single post box */



.box-img {
	width: 100%;
	height: 550px;
	position: relative;
}

.box-img img {
	width: 100%;
	height: 550px;
	object-fit: cover;
}
.post-box--date  {
	font-size: 14px;
	font-weight: 400;
	position: relative;
	padding-left: 47px;
}
.post-box--date::before  {
	content: '';
	position: absolute;
	left: 0;
	top:50%;
	width: 30px;
	height:1px;
	background-color: #000;
}
/* /Element single post box */
.pagination-container .page-numbers {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: #e7e7e7;
	color:#000;
	display: inline-block;
	text-align: center;
	line-height: 40px;
}
.pagination-container .page-numbers.current {
	background-color: #000;
	color:#fff;
}
.line-before {
	position: relative;
	padding-left: 47px;
}
.line-before::before  {
	content: '';
	position: absolute;
	left: 0;
	top:50%;
	width: 30px;
	height:1px;
	background-color: #000;
}
.testimonial-slider--item.has-modal {
	cursor: pointer;
}

.modal-scroll-wrapper {
	max-height: 60vh;
	overflow-y: auto;
}

.modal-footer .btn-link {
	text-decoration: none;
	opacity: 0.5;
	transition: opacity 0.2s;
}

.modal-footer .btn-link:hover {
	opacity: 1;
}
.search-box:hover .btn-text {
	color:#e75e1d;
}

.search-title h3 {
	display: inline-block;
	background-color: #fff;
	padding-right: 25px;
	z-index: 2;
}
.search-box .search-title::before {
	content: '';
	position: absolute;
	width: 0;
	height: 2px;
	background-color: #000;
	top: 12px;
	left: 0;
	z-index: -1;
	transition: width 0.3s ease-in-out;
}

.search-box:hover .search-title::before {
	width: 100%;
}
.copyrights a {
	color:#000;
}
/* Spacing dla steps - niezależnie od PHP */
.element--flexible-content .col-lg-7 .col-lg-3:first-child {
    margin-top: 2rem !important;  /* 2rem = mt-5 */
}

.element--flexible-content .col-lg-7 .col-lg-3:last-child {
    margin-bottom: 2rem !important;  /* 2rem = mb-5 */
}
.desc-right-column .row:first-child {
    margin-top: 0 !important;
}
.bg-grey.has-step-tooltip {
	cursor: pointer;
}

.step-tooltip-desc {
	font-size: 1rem;
	line-height: 1.6;
}

#stepTooltipModal .modal-scroll-wrapper {
	max-height: 60vh;
	overflow-y: auto;
}

#stepTooltipModal .modal-footer .btn-link {
	text-decoration: none;
	opacity: 0.5;
	transition: opacity 0.2s;
}

#stepTooltipModal .modal-footer .btn-link:hover {
	opacity: 1;
}
/* Kontener slidera musi mieć wystarczającą wysokość/padding */
.step-slider-container {
    position: relative;
    overflow: visible; /* lub padding-bottom zamiast overflow: hidden */
    
}

.step-slider {
    padding-bottom: 80px; /* zapobiega ucinaniu dolnych elementów */
}

/* Przeniesienie strzałek w prawy dolny róg */
.step-slider-controls {
    position: absolute !important;
    bottom: -60px;
    right: 15px;
    display: flex;
    gap: 12px;
    z-index: 10;
	list-style: none;
}
@media only screen and (max-width : 1399px) {
	.step-slider-container {
		margin-bottom: 40px;
	}
}
@media only screen and (max-width : 991px) {
	.step-slider-container {
		margin-bottom: 0;
	}
}
.step-slider-controls li {
    cursor: pointer;
}

/* Opcjonalnie: zmiana koloru strzałek na ciemny zgodnie z Twoim projektem */
.arrow-black {
    background-color: #e7e7e7;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    /* ... reszta Twojego stylu strzałek */
}
.step-slider .tns-item {
  transition: transform 0.3s ease;
}
.step-slider .step-slider--item .bg-grey {
	text-transform: uppercase;
	font-size: 20px;
	font-weight: 400;
	height:210px;
	min-height:195px;
	position: relative;
	transition: all 0.5s;
}
.step-slider .step-slider--item .bg-grey::before {
	content: '';
	position: absolute;
	left: 24px;
	top:80px;
	width: 65%;
	height:1px;
	background-color: #b9b9b9;
}
.step-slider .step-slider--item .bg-grey:hover::before {
	background-color: #2e2e2e;
	transition: transform 0.3s ease;
}
.step-slider .step-slider--item .bg-grey:hover {
	background-color: #000;
	color:#fff;
}

.step-number {
	font-size: 30px;
	background-color: #fff;
	color:#a3a3a3;
	position: relative;
	padding: 12px 24px;
	border-top-left-radius: 25px;
	border-bottom-left-radius: 25px;
}
.step-number::after {
	content: '';
	position: absolute;
	right: -24px;
	top:0;
	width: 24px;
	height:100%;
	background-color: #fff;
}
.step-slider .step-slider--item .bg-grey:hover .step-number  {

	color:#000;
}
footer .bg-black {
	background-image: url(../img/bg-lines-footer.webp);
	background-repeat: no-repeat;
	background-position: bottom 40px right;
}
.bg-lines {
	position: absolute;
}
.bg-lines-01 {
	width: 248px;
	height: 290px;
	background-image: url(../img/bg-lines-01.webp);
	top:15%;
	left: -20px;
	opacity:0.5;
}
.bg-lines-02 {
	width: 157px;
	height: 227px;
	background-image: url(../img/bg-lines-02.webp);
	top:200px;
	left: -20px;
	opacity:0.5;
}
.bg-lines-03 {
	width: 156px;
	height: 162px;
	background-image: url(../img/bg-lines-03.webp);
	top:1200px;
	right: 0px;
	opacity:0.5;
}
.bg-lines-04 {
	width: 156px;
	height: 162px;
	background-image: url(../img/bg-lines-03.webp);
	bottom:15%;
	right: 0px;
	opacity:0.5;
}
/* ============================================= */
/* 6. Responsive fixes                           */
/* ============================================= */

@media only screen and (max-width : 1150px) {
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 991px) { 
	.banner-slider-descs .col-xxl-10 {
		position: relative;
		min-height: 100px;
	}
	.banner-slider-desc {
		position: absolute;
		left: 15px; /* col padding */
		right: 100px;
		bottom: 0;
		width: auto;
		margin-right: 0;
		opacity: 0 !important;
		visibility: hidden;
		transform: translateY(-15px);
		transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.8s;
	}
	.banner-slider-desc.active {
		opacity: 1 !important;
		visibility: visible;
		transform: translateY(0);
	}
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	/* WP image float fix */
	figure.alignleft, img.alignleft, figure.alignright, img.alignright {
		float:none;
	}
	/* /WP image float fix */
} 

.separator-parallax-container {
	width: 100%;
	height: 500px; /* Bazowa wysokość separatora */
	position: relative;
	overflow: hidden;
	border-radius: 15px; /* Dodajemy stały border-radius */
	transform: translate3d(0, 0, 0); /* Force hardware acceleration */
	-webkit-transform: translate3d(0, 0, 0);
	mask-image: -webkit-radial-gradient(white, black);
	-webkit-mask-image: -webkit-radial-gradient(white, black);
}

.separator-parallax-container img.rellax {
	position: absolute;
	top: -15%; /* Zapas na przesunięcie parallax (musi być większe niż 100% wysokości) */
	left: 0;
	width: 100%;
	height: 130%; /* Większe niż kontener, żeby nie ucięło krawędzi podczas scrollowania */
	object-fit: cover;
	object-position: center;
	will-change: transform;
}

@media only screen and (max-width : 991px) {
	.separator-parallax-container {
		height: 350px;
	}
	.separator-parallax-container img.rellax {
		/* Rellax wyłączy się sam na telefonach jeśli dodamy mu regułę wyłączającą, ale wymuśmy zachowanie w razie czego */
		top: 0;
		height: 100%;
		transform: none !important;
	}
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
}


/* Height */
@media only screen and (max-height : 730px) {
}