/* Client visual trial: monochrome imagery, logo-derived watermarks and semantic marks. */
.bz-page-hero::after {
	display: none;
}

.bz-page-hero__service-number,
.bz-page-hero__monogram,
.bz-page-hero__contact-arrow {
	position: relative;
	isolation: isolate;
}

.bz-page-hero__service-number::before,
.bz-page-hero__monogram::before,
.bz-page-hero__contact-arrow::before {
	content: "";
	position: absolute;
	left: calc(50% + 18px);
	top: calc(50% - 24px);
	z-index: -1;
	width: clamp(340px, 34vw, 560px);
	aspect-ratio: 1;
	background: url("../img/bauzonetri-logo-mark.png") center / contain no-repeat;
	filter: grayscale(1) contrast(1.2);
	opacity: 0.04;
	transform: translate(-50%, -50%);
	pointer-events: none;
}

.bz-hero {
	--bz-watermark-shift: 0px;
	--bz-hero-image-shift: 0px;
	isolation: auto;
	overflow: visible;
}

.bz-site-header.is-sticky {
	z-index: 99999 !important;
}

.bz-hero::before {
	content: "";
	display: block;
	position: absolute;
	left: clamp(-150px, -7vw, -70px);
	top: clamp(170px, 16vw, 260px);
	z-index: 0;
	width: clamp(340px, 34vw, 590px);
	height: clamp(340px, 34vw, 590px);
	border: 0;
	background: url("../img/bauzonetri-logo-mark.png") center / contain no-repeat;
	filter: grayscale(1) contrast(1.25);
	opacity: 0.045;
	transform: translate3d(0, var(--bz-watermark-shift), 0) rotate(-7deg);
	transition: transform 160ms linear;
	pointer-events: none;
}

.bz-hero > .bz-container {
	position: relative;
	z-index: 1;
}

body .bz-hero__media img {
	filter: grayscale(1) contrast(1.08) brightness(0.97);
	object-position: 61% 48%;
	transform: translate3d(0, var(--bz-hero-image-shift), 0) scale(1.08);
	transform-origin: 61% 48%;
	will-change: transform;
}

body .bz-hero__media {
	clip-path: polygon(34% 0, 100% 0, 100% 100%, 0 100%, 0 58%);
}

body .bz-hero__media::before {
	background:
		linear-gradient(118deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.11) 18%, transparent 38%),
		linear-gradient(0deg, rgba(27, 24, 34, 0.46) 0%, rgba(40, 36, 50, 0.2) 34%, rgba(40, 36, 50, 0.1) 100%),
		linear-gradient(90deg, transparent 58%, rgba(27, 24, 34, 0.24) 100%),
		radial-gradient(ellipse at 58% 44%, transparent 38%, rgba(17, 15, 22, 0.23) 100%);
	opacity: 0;
	transform: translateX(-12px);
	transition: opacity 680ms ease 100ms, transform 760ms cubic-bezier(.2, .7, .2, 1) 100ms;
}

body .bz-hero__media::after {
	content: "";
	position: absolute;
	inset: -12%;
	z-index: 3;
	background:
		radial-gradient(circle, rgba(255, 255, 255, 0.34) 0 0.55px, transparent 0.8px) 0 0 / 3px 3px,
		radial-gradient(circle, rgba(0, 0, 0, 0.36) 0 0.5px, transparent 0.78px) 1px 1px / 4px 4px;
	mix-blend-mode: soft-light;
	opacity: 0.07;
	pointer-events: none;
	animation: bz-film-grain 700ms steps(2, end) infinite;
}

.bz-hero.is-loaded .bz-hero__media::before {
	opacity: 1;
	transform: translateX(0);
}

.bz-hero.is-loaded .bz-hero__media img {
	animation: bz-cinematic-push 16s ease-in-out infinite alternate;
}

@keyframes bz-cinematic-push {
	from {
		transform: translate3d(0, var(--bz-hero-image-shift), 0) scale(1.08);
	}
	to {
		transform: translate3d(-1.2%, calc(var(--bz-hero-image-shift) - 5px), 0) scale(1.18);
	}
}

@keyframes bz-film-grain {
	0% { background-position: 0 0, 1px 1px; }
	25% { background-position: 2px -1px, -1px 3px; }
	50% { background-position: -1px 2px, 3px 0; }
	75% { background-position: 1px 3px, 0 -2px; }
	100% { background-position: -2px 0, 2px 2px; }
}

.bz-hero.is-loaded .bz-hero__media {
	animation: bz-hero-mono-reveal 620ms cubic-bezier(.2, .7, .2, 1) both;
}

@keyframes bz-hero-mono-reveal {
	from { opacity: 0; transform: translateX(10px); }
	to { opacity: 1; transform: translateX(0); }
}

.bz-why {
	--bz-watermark-shift: 0px;
	position: relative;
	isolation: isolate;
	overflow: hidden;
}

.bz-why::after {
	content: "";
	position: absolute;
	right: clamp(-170px, -8vw, -80px);
	top: clamp(-150px, -9vw, -80px);
	z-index: 0;
	width: clamp(300px, 30vw, 500px);
	height: clamp(300px, 30vw, 500px);
	background: url("../img/bauzonetri-logo-mark.png") center / contain no-repeat;
	filter: grayscale(1) contrast(1.2);
	opacity: 0.032;
	transform: translate3d(0, var(--bz-watermark-shift), 0) rotate(8deg);
	transition: transform 160ms linear;
	pointer-events: none;
}

.bz-why > * {
	position: relative;
	z-index: 1;
}

body .bz-services .bz-outline-icon.bz-shape--parallelogram {
	width: 34px;
	height: 14px;
	margin: 7px 0 25px;
	border: 0;
	border-radius: 0 !important;
	background: var(--c);
	clip-path: polygon(16% 0, 100% 0, 84% 100%, 0 100%) !important;
	transform: none;
	transition: transform 220ms ease;
}

.bz-services .bz-service:hover .bz-shape--parallelogram,
.bz-services .bz-service:focus-visible .bz-shape--parallelogram {
	transform: translateX(4px) scaleX(1.08);
}

body .bz-why article .bz-why__icon {
	display: block;
	width: 72px;
	height: 72px;
	margin: 0 auto 24px;
	fill: none;
	stroke: var(--bz-black);
	stroke-width: 1.8;
	stroke-linecap: square;
	stroke-linejoin: miter;
}

.bz-why article {
	box-sizing: border-box;
	border: 5px solid var(--c);
	background: #fff;
}

.bz-why article::before {
	display: none;
}

.bz-why__icon .bz-why__icon-accent {
	fill: var(--c);
	stroke: var(--c);
	stroke-dasharray: none;
	stroke-dashoffset: 0;
}

.bz-why__icon * {
	stroke-dasharray: 140;
	stroke-dashoffset: 140;
	transition: stroke-dashoffset 720ms cubic-bezier(.2, .7, .2, 1);
}

.bz-why article.is-visible .bz-why__icon * {
	stroke-dashoffset: 0;
}

.bz-services__header,
.bz-why__intro {
	position: relative;
	grid-column: 1 / -1;
	margin-bottom: clamp(14px, 2vw, 28px);
}

body .bz-why__intro h2 {
	max-width: 1240px;
	font-size: clamp(40px, 5vw, 64px);
	font-weight: 800;
	line-height: 0.96;
}

.bz-why__mobile-break {
	display: none;
}

.bz-process-story .bz-process-story__header h2 {
	font-size: clamp(34px, 3.6vw, 50px);
}

.bz-process-story__visual {
	background: #282432;
}

@media (min-width: 1101px) {
	.bz-process-story .bz-process-story__panels {
		width: 75%;
		min-height: clamp(220px, 26vh, 280px);
		margin-inline: auto;
	}

	.bz-process-story__panel {
		grid-template-columns: minmax(250px, 0.58fr) minmax(420px, 1.42fr);
	}

	.bz-process-story__visual {
		min-height: 220px;
	}

	.bz-process-story__visual strong {
		font-size: clamp(76px, 8vw, 120px);
	}

	.bz-process-story__copy {
		padding: clamp(24px, 2.6vw, 36px);
	}

	.bz-process-story__copy h3 {
		font-size: clamp(32px, 3.7vw, 58px);
	}
}

@media (min-width: 1101px) and (max-height: 800px) {
	.bz-process-story .bz-process-story__panels {
		min-height: 220px;
	}

	.bz-process-story__copy {
		padding: 24px 32px;
	}

	.bz-process-story__copy h3 {
		margin-bottom: 16px;
		font-size: 40px;
	}

	.bz-process-story__copy p {
		font-size: 16px;
		line-height: 1.5;
	}
}

#leistungen,
#ueber-uns,
#projekte {
	scroll-margin-top: 140px;
}

.bz-why__eyebrow::after {
	content: "";
	display: block;
	width: 64px;
	height: 3px;
	margin-top: 18px;
	background: var(--bz-red);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 620ms cubic-bezier(.2, .7, .2, 1);
}

.bz-why__intro.is-visible .bz-why__eyebrow::after {
	transform: scaleX(1);
}

@media (min-width: 1101px) {
	.bz-why {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: clamp(28px, 3vw, 44px);
		padding-top: clamp(58px, 7vw, 92px);
	}

	.bz-why__intro h2 {
		white-space: nowrap;
	}
}

@media (max-width: 720px) {
	.bz-page-hero__service-number::before,
	.bz-page-hero__monogram::before,
	.bz-page-hero__contact-arrow::before {
		width: 310px;
		opacity: 0.032;
		left: calc(50% + 14px);
		top: calc(50% - 18px);
	}

	body .bz-why article .bz-why__icon {
		width: 64px;
		height: 64px;
	}

	.bz-why__mobile-break {
		display: initial;
	}

	body .bz-hero__media {
		clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%, 0 30%);
	}

	body .bz-hero__media::before {
		background:
			linear-gradient(118deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.06) 20%, transparent 42%),
			linear-gradient(0deg, rgba(27, 24, 34, 0.4) 0%, rgba(40, 36, 50, 0.16) 42%, rgba(40, 36, 50, 0.08) 100%),
			radial-gradient(ellipse at 58% 44%, transparent 44%, rgba(17, 15, 22, 0.18) 100%);
	}

	body .bz-hero__media img,
	body .bz-hero.is-loaded .bz-hero__media img {
		object-position: 62% 48%;
		transform: none;
		transform-origin: 62% 48%;
		animation: none;
		will-change: auto;
	}

	.bz-hero::before {
		left: -120px;
		top: 250px;
		width: 330px;
		height: 330px;
		opacity: 0.035;
	}

	.bz-why::after {
		right: -130px;
		top: -80px;
		width: 300px;
		height: 300px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bz-hero::before,
	.bz-why::after,
	body .bz-hero__media::before {
		transform: none;
		transition: none;
	}

	body .bz-hero__media::before {
		opacity: 1;
	}

	body .bz-hero__media img {
		transform: scale(1.08);
		animation: none;
		will-change: auto;
	}

	body .bz-hero__media::after {
		display: none;
		animation: none;
	}

	.bz-why__icon *,
	.bz-why__eyebrow::after {
		stroke-dashoffset: 0;
		transform: none;
		transition: none;
	}
}

@media (max-width: 720px) and (prefers-reduced-motion: reduce) {
	body .bz-hero__media img {
		transform: none;
	}
}