@charset "UTF-8";

:root,
[data-bs-theme=light] {
	--font: 'Eudoxus Sans', system-ui, sans-serif;

	--primary-color: hsl(74, 62%, 46%);
	--primary-color-lighter: hsl(68, 99%, 67%);
	--primary-color-light: hsl(181, 50%, 17%);
	--primary-color-dark: hsl(182, 62%, 10%);

	--xxl: 6.25rem;
	--xl: 3.125rem;

	--bs-primary: hsl(74, 62%, 46%);
	--bs-primary-rgb: 157, 191, 46;

	--bs-light: hsl(0, 0%, 94%);
	--bs-light-rgb: 240, 240, 240;

	--bs-dark: black;
	--bs-dark-rgb: 0,0,0;

	--bs-body-color: hsl(182, 62%, 10%);

	--h1: 	clamp(2.375rem, 4vw, 4.1875rem);
	--h2: 	clamp(1.75rem, 3vw, 3.1875rem);
	--h3: 	clamp(1.3125rem, 2.3vw, 2.375rem);
	--h4: 	clamp(1.25rem, 1.8vw, 1.75rem);
	--h5: 	clamp(1.15rem, 1.3vw, 1.3125rem);
	--h6: 	1rem;
	--lead: clamp(1.15rem, 1.5vw, 1.5rem);
}

body {
	font-family: var(--font);
}

.icon {
	width: var(--icon-size, 72px);
}

.icon-72px, [src*="_72px"] {width: 72px;}
.icon-48px, [src*="_48px"] {width: 48px;}
.icon-32px, [src*="_32px"] {width: 32px;}
.icon-16px, [src*="_16px"] {width: 16px;}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: var(--font);
	margin-bottom: 1rem;
	font-weight: bold;

	em {
		font-style: normal;
		color: var(--primary-color);
	}
}

h1, .h1 {font-size: var(--h1);}
h2, .h2 {font-size: var(--h2);}
h3, .h3 {font-size: var(--h3);}
h4, .h4 {font-size: var(--h4);}
h5, .h5 {font-size: var(--h5);}
h6, .h6 {font-size: var(--h6);}
.lead   {font-size: var(--lead);}

.container-fluid {
	padding-inline: 0 !important;
	margin-inline: 3vw;
	width: 94vw;
}

@media (min-width: 1560px) {
	.container {max-width: 1540px;}
}

.inset-0 {inset: 0;}

.p-xxl {padding: var(--xxl);}
.p-xl {padding: var(--xl);}
.px-xxl {padding-inline: var(--xxl)}
.px-xl {padding-inline: var(--xl)}

.pt-xxl {padding-top: var(--xxl);}
.pb-xxl {padding-bottom: var(--xxl);}
.py-xxl {
	padding-top: var(--xxl);
	padding-bottom: var(--xxl);
}
.mt-xxl {margin-top: var(--xxl);}
.mb-xxl {margin-bottom: var(--xxl);}
.my-xxl {
	margin-top: var(--xxl);
	margin-bottom: var(--xxl);
}

.pt-xl {padding-top: var(--xl);}
.pb-xl {padding-bottom: var(--xl);}
.py-xl {
	padding-top: var(--xl);
	padding-bottom: var(--xl);
}
.mt-xl {margin-top: var(--xl);}
.mb-xl {margin-bottom: var(--xl);}
.my-xl {
	margin-top: var(--xl);
	margin-bottom: var(--xl);
}


/*  navbar  */

body {
	padding-top: 200px;
}

.navbar {
  --bs-navbar-padding-x: 0;
  --bs-navbar-padding-y: 2.5rem;
  --bs-navbar-active-color: white;
  --bs-navbar-nav-link-padding-x: 1rem;
	--bs-navbar-brand-padding-y: 0;
  --bs-navbar-brand-margin-end: 0;
	--bs-navbar-nav-link-padding-x: .75rem;

	padding-top: 0;
	padding-bottom: 0;
	background-color: #fff;
	transition: padding 200ms, box-shadow 200ms;

	&.affix {
		--bs-navbar-padding-y: .5rem;
		box-shadow: 0 0 2rem hsl(0 0% 0% / .15);

		.container {
			border-bottom: 0;
		}
	}

	.container {
		padding-top: var(--bs-navbar-padding-y);
		padding-bottom: var(--bs-navbar-padding-y);
		border-bottom: 1px solid var(--bs-border-color);
	}
}

.navbar-brand {
	gap: 0.9375rem;
	transition: font-size 200ms;
}

.navbar-brand-image {
	height: 80px;
	transition: height 200ms;
}

.navbar-brand span {
	font-size: var(--lead);

	strong {
		display: block;
		line-height: 1.1;
		margin-bottom: 0.5rem;
	}

	small {
		font-size: clamp(.75rem, 1vw, 0.8125rem);
	}
}

img.rounded-circle {
	aspect-ratio: 1/1;
}

.affix .navbar-brand-image {height: 40px;}

.affix .navbar-brand span {
	font-size: clamp(.875rem, 1vw, 1rem);

	small {
		display: none;
		font-size: clamp(.55rem, 1vw, .75rem);
	}
}

.call-us {
	text-decoration: none;
	color: var(--bs-body-color);
	transition: color 200ms, padding 200ms;

	strong, small {
		display: block;
		line-height: 1;
	}

	strong {font-size: var(--lead);}
	small {
		font-weight: bold;
		font-size: 0.625rem;
	}

	&:hover,
	&:focus {
		color: var(--primary-color);
	}
}

.affix .call-us {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.navbar-nav .nav-link {
	font-weight: bold;

	&.active,
	&.show,
	&:hover,
	&:focus {
		color: var(--primary-color);
	}
}

.dropdown-menu {
	border: 0;
	padding: .5rem;
	border-radius: 0;
	box-shadow: 0 1rem 2.5rem -.5rem hsl(0 0% 0% / .25);
	background-color: hsl(0 0% 100%);
}

.dropdown-item {
	padding: 0.25rem .5rem;
	border-radius: .25rem;
	transition: color 200ms, background-color 200ms;
	border-bottom: 1px solid transparent;

	&:hover,
	&:focus,
	&.active {
		color: var(--primary-color);
		background-color: var(--bs-light);
	}
}


.home header .position-absolute, .home section .bg-primary {
	&::before,
	&::after {
		content: '';
		position: absolute;
		z-index: 2;
		display: block;
		width: 45%;
		max-width: 672px;
		height: 30%;
		max-height: 226px;
		background-image: url(../img/flowers.svg);
		background-repeat: no-repeat;
		background-size: 100%;
	}

	&::before {
		top: 0;
		left: 0;
		transform: rotate(180deg);
	}

	&::after {
		bottom: 0;
		right: 0;
	}
}

.swiper__image {
	max-height: calc(100vh - 190px);
}

.home section .bg-primary {
	position: relative;
	isolation: isolate;
	overflow: hidden;

	&::before,
	&::after {
		z-index: -1;
	}
}

.replace-word {
    display: inline-block;
    width: 24px; /* szerokość obrazka */
    height: 24px; /* wysokość obrazka */
    background-size: contain;
    background-repeat: no-repeat;
    text-indent: -9999px; /* ukrycie tekstu */
}

/*  main content */

.btn {
    --bs-btn-padding-x: 1.875rem;
    --bs-btn-padding-y: 1.25rem;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 700;
    --bs-btn-line-height: 1.5;
		border-radius: 1rem;
}

.btn-primary {
    --bs-btn-bg: var(--primary-color-dark);
    --bs-btn-border-color: var(--primary-color-dark);
    --bs-btn-hover-bg: var(--primary-color-light);
    --bs-btn-hover-border-color: var(--primary-color-light);
    --bs-btn-active-bg: var(--primary-color-light);
    --bs-btn-active-border-color: var(--primary-color-light);
}

.btn-outline-primary {
    --bs-btn-color: var(--primary-color);
    --bs-btn-border-color: var(--primary-color);
    --bs-btn-hover-bg: var(--primary-color);
    --bs-btn-hover-border-color: var(--primary-color);
    --bs-btn-active-bg: var(--primary-color);
    --bs-btn-active-border-color: var(--primary-color);
}


footer {
	background-image: url(../img/flowers.svg);
	background-repeat: no-repeat;
	background-size: 945px 320px;
	background-position: right bottom;
	border-top: 1px solid var(--bs-border-color);
}

footer a {
	text-decoration: none;
	color: var(--bs-body-color);
	transition: color 200ms;

	&:hover,
	&:focus {
		color: var(--primary-color);
	}
}

.list-unstyled li + li {margin-top: 0.75em;}

.madeby {
	display: flex;
	align-items: center;
	background-color: white;
	padding-inline: .5rem;
	border-radius: .25rem;

	small {
		font-size: 0.625rem;
		margin: 0.2em 0.2em 0 0;
	}
}


/*  sub content  */

.sub header .bg-primary {
	background-image: linear-gradient(to right bottom, var(--primary-color-lighter), var(--primary-color) 70%);
}

main:has(#sub-pages:last-of-type) {padding-bottom: 0;}

.gallery a {
	display: block;
	width: 100%;
	overflow: hidden;
	border-radius: .75rem;

	img {
		width: 100%;
		display: block;
		transition: transform 400ms cubic-bezier(0.19, 1, 0.22, 1);
	}

	&:hover img {
		transform: scale(1.1);
	}
}

.minigallery {
	display: grid;
	gap: .5rem;
	grid-template-columns: repeat(3, 1fr);

	a:first-child {
		grid-column: span 3;
	}
}

.downloads a {
	text-decoration: none;
	color: black;
	border: 1px solid hsl(0 0% 90%);
	border-radius: .25rem;
	transition: color 200ms, border-color 200ms;

	&:hover {
		color: var(--primary-color);
		border-color: var(--primary-color);
	}
}

.form-control {
	border-radius: .25rem;

	&.error {border-color: red;}
}

.error-msg {color: red;}



/*  paginator  */

.pagination {
	display: flex
}

.pagination li {
	display: none
}

.pagination .active,
.pagination .insertPage,
.pagination li:first-child,
.pagination li:last-child {
	display: block
}

.pagination a,
.pagination input {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0 5px;
	padding: 0;
	text-align: center;
	color: #bbb;
	border: 1px solid #e1e1e1;
	text-decoration: none;
	transition: all .2s
}

.pagination a:focus,
.pagination a:hover,
.pagination input:focus,
.pagination input:hover {
	color: var(--primary-color);
	border: 1px solid var(--primary-color)
}

.pagination input::placeholder {
	color: #bbb;
	font-size: 16px;
	font-weight: 500
}

.pagination .active a {
	border: 1px solid var(--primary-color);
	background: var(--primary-color);
	color: #fff;
	cursor: text
}

.pagination .insertPage+.insertPage {
	display: none
}


.cena small {
	font-weight: normal;
	font-size: .75rem;
}

.dane {flex-wrap: wrap;}

.dane .d-flex {
	flex-basis: 45%;
	font-size: 0.75rem;
}

.btn-sm {
		--bs-btn-padding-x: 1.25rem;
		--bs-btn-padding-y: 0.625rem;
		--bs-btn-font-size: 0.75rem;
		--bs-btn-font-weight: 700;
		--bs-btn-line-height: 1.5;
		border-radius: 0.5rem;
}

.card {
	cursor: pointer;
}

.card.shadow {
	box-shadow: 0 1.25rem 3.125rem hsl(0 0% 0% / .1) !important;
}

.card-img-top {
	overflow: hidden;
}

.card-img-top img {
	transition: transform 400ms cubic-bezier(0.19, 1, 0.22, 1);
}

.card:hover .card-img-top img {
	transform: scale(1.1);
}

#index .card-img-top img {
	aspect-ratio: 16/9;
	height: auto;
	object-fit: cover;
}




/*  media queries  */

@media (max-width: 1499px) {
	.navbar {
		--bs-navbar-nav-link-padding-x: .6rem;
	}

	.header__swiper {
		--hh: 400px;
		min-height: var(--hh);

		.swiper__image {
			min-height: var(--hh);
		}
	}
}


@media (max-width: 1399px) {
	.call-us {
		border: 0 !important;
		margin-top: 2rem;
	}

	.home header .position-absolute,
	.home section .bg-primary {
		&::before, &::after {
			width: 30%;
			max-width: 400px;
			height: 21%;
			max-height: 120px;
		}
	}

	footer {
		background-size: 661.5px 224px;
	}
}


@media (max-width: 991px) {
	.home header .position-absolute {
		background-image: linear-gradient(to right, var(--primary-color) 50%, transparent);
	}

	footer {
		text-align: center;
	}

	footer {
		background-size: 330.75px 112px;
	}

	.madeby {margin-top: 1rem;}

	.home section .bg-primary {
		&::before, &::after {
			width: 30%;
			max-width: 400px;
			height: 15%;
			max-height: 90px;
		}
	}
}


@media (max-width: 767px) {
	:root {
		--xxl: 3.125rem;
		--xl: 1.5625rem;
	}

	.home header .position-absolute {
		background-image: linear-gradient(to right, var(--primary-color) 40%, transparent);
	}

	.home header .position-absolute,
	.home section .bg-primary {
		&::before, &::after {
			width: 200px;
			height: 65px;
		}
	}

	.sub header .bg-primary .p-xxl {
		padding: var(--xl);
	}
}



@media (max-width: 575px) {
	.slogan {text-align: center;}
	.home header .position-absolute {
		background-image: linear-gradient(to bottom, var(--primary-color) 50%, transparent);

		.container.d-flex {
			align-items: flex-start !important;
			z-index: 3;
			padding-top: 4rem;
		}
	}

	.header__swiper {
		margin-top: 333px;
	}

	footer span.opacity-50 {
		font-size: 0.75rem;
	}


	footer {
		background-size: 165.375px 56px;
	}

}