/* =========================================================
   FUCHSBAU – Wir
   ========================================================= */

.fuchsbau-about-page {
	max-width: 1380px;

	margin:
		90px
		auto
		110px !important;

	padding:
		0
		32px;

	font-family:
		var(--fb3-font);
}


/* Intro */

.fuchsbau-about-intro {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		320px;

	align-items: center;

	gap:
		70px;

	margin-bottom:
		120px !important;
}


.fuchsbau-about-intro-copy {
	max-width:
		820px;
}


.fuchsbau-about-heading,
.fuchsbau-about-section-title,
.fuchsbau-about-mission-title {
	margin:
		0
		0
		20px;

	color:
		var(--fb3-dark);

	font-size:
		clamp(
			40px,
			4vw,
			58px
		);

	font-weight:
		700;

	line-height:
		1.08;

	letter-spacing:
		-1.5px;
}


.fuchsbau-about-lead {
	max-width:
		760px;

	margin: 0;

	color:
		var(--fb3-muted);

	font-size:
		20px;

	line-height:
		1.7;
}


figure.wp-block-image.fuchsbau-about-fox {
	width:
		300px !important;

	max-width:
		300px !important;

	margin:
		0 !important;
}


.fuchsbau-about-fox img {
	width:
		100% !important;

	height:
		auto !important;

	filter:
		drop-shadow(
			0
			18px
			20px
			rgba(31, 60, 46, 0.12)
		);
}


/* Was wir tun */

.fuchsbau-about-work {
	margin-bottom:
		120px !important;
}


.fuchsbau-about-actions {
	display: grid !important;

	grid-template-columns:
		repeat(
			5,
			minmax(0, 1fr)
		);

	gap:
		18px;

	margin-top:
		46px !important;
}


.fuchsbau-about-action {
	padding:
		28px
		24px;

	background:
		#f7f8f3;

	border-radius:
		24px;
}


.fuchsbau-about-action:nth-child(odd) {
	background:
		var(--fb3-cream);
}


.fuchsbau-about-action h3 {
	margin:
		0
		0
		12px;

	color:
		var(--fb3-dark);

	font-size:
		21px;
}


.fuchsbau-about-action p {
	margin: 0;

	color:
		var(--fb3-muted);

	font-size:
		14px;

	line-height:
		1.6;
}


/* Mission */

.fuchsbau-about-mission {
	margin-bottom:
		120px !important;

	padding:
		58px;

	background:
		#edf2e3;

	border-radius:
		32px;
}


.fuchsbau-about-mission-title {
	max-width:
		900px;
}


.fuchsbau-about-mission-text {
	max-width:
		900px;

	color:
		var(--fb3-muted);

	font-size:
		18px;

	line-height:
		1.75;
}


.fuchsbau-about-mission-text a {
	color:
		var(--fb3-orange);

	font-weight:
		700;
}
/* =========================================================
   WAS WIR MÖGLICH MACHEN
   ========================================================= */

.fuchsbau-about-impact {
	margin-bottom:
		120px !important;
}


.fuchsbau-about-impact-lead {
	max-width:
		820px;

	margin:
		0
		0
		46px;

	color:
		var(--fb3-muted);

	font-size:
		18px;

	line-height:
		1.7;
}


.fuchsbau-about-impact-grid {
	display: grid !important;

	grid-template-columns:
		repeat(
			3,
			minmax(0, 1fr)
		);

	gap:
		22px;
}


.fuchsbau-about-impact-card {
	position:
		relative;

	padding:
		34px
		30px;

	background:
		#ffffff;

	border:
		1px solid
		rgba(31, 60, 46, 0.09);

	border-radius:
		26px;

	box-shadow:
		0
		14px
		40px
		rgba(31, 60, 46, 0.055);

	overflow:
		hidden;

	transition:
		transform 180ms ease,
		box-shadow 180ms ease;
}


.fuchsbau-about-impact-card::before {
	content: "";

	position:
		absolute;

	left:
		0;

	top:
		0;

	width:
		100%;

	height:
		5px;

	background:
		var(--fb3-orange);
}


.fuchsbau-about-impact-card:nth-child(even)::before {
	background:
		var(--fb3-green-light);
}


.fuchsbau-about-impact-card:hover {
	transform:
		translateY(-4px);

	box-shadow:
		0
		20px
		48px
		rgba(31, 60, 46, 0.10);
}


.fuchsbau-about-impact-card h3 {
	margin:
		0
		0
		14px;

	color:
		var(--fb3-dark);

	font-size:
		23px;

	font-weight:
		700;

	line-height:
		1.2;
}


.fuchsbau-about-impact-card p {
	margin:
		0;

	color:
		var(--fb3-muted);

	font-size:
		15px;

	line-height:
		1.65;
}

/* Geschichte */

.fuchsbau-about-history {
	margin-bottom:
		120px !important;
}


.fuchsbau-about-timeline {
	gap:
		22px;

	margin-top:
		46px;
}


.fuchsbau-about-history-card {
	padding:
		34px;

	background:
		#ffffff;

	border:
		1px solid
		rgba(31, 60, 46, 0.10);

	border-radius:
		26px;

	box-shadow:
		0
		14px
		40px
		rgba(31, 60, 46, 0.06);
}


.fuchsbau-about-year {
	margin:
		0
		0
		18px;

	color:
		var(--fb3-orange);

	font-size:
		30px;

	font-weight:
		700;
}


.fuchsbau-about-history-card h3 {
	margin:
		0
		0
		14px;

	color:
		var(--fb3-dark);

	font-size:
		23px;
}


.fuchsbau-about-history-card p:not(.fuchsbau-about-year) {
	margin: 0;

	color:
		var(--fb3-muted);

	line-height:
		1.65;
}


/* Vorstand */

.fuchsbau-about-board {
	margin-bottom:
		120px !important;
}


.fuchsbau-about-board-grid {
	max-width:
		900px;

	gap:
		24px;

	margin-top:
		44px;
}


.fuchsbau-about-person {
	padding:
		34px;

	background:
		var(--fb3-cream);

	border-radius:
		26px;
}


.fuchsbau-about-role {
	margin:
		0
		0
		10px;

	color:
		var(--fb3-green);

	font-size:
		12px;

	font-weight:
		700;

	letter-spacing:
		1.3px;

	text-transform:
		uppercase;
}


.fuchsbau-about-person h3 {
	margin: 0;

	color:
		var(--fb3-dark);

	font-size:
		28px;
}


/* CTA */

.fuchsbau-about-cta {
	padding:
		50px;

	background:
		var(--fb3-dark);

	color:
		#ffffff;

	border-radius:
		30px;
}


.fuchsbau-about-cta h2 {
	margin:
		0
		0
		12px;

	color:
		#ffffff;

	font-size:
		38px;
}


.fuchsbau-about-cta p {
	margin:
		0
		0
		24px;

	color:
		rgba(255, 255, 255, 0.76);

	font-size:
		17px;
}


.fuchsbau-about-cta-button
.wp-block-button__link {
	padding:
		13px
		24px;

	background:
		var(--fb3-orange);

	color:
		#ffffff;

	border-radius:
		999px;

	font-weight:
		700;
}


/* Tablet */

@media (max-width: 1000px) {

	.fuchsbau-about-actions {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}


	.fuchsbau-about-action:last-child {
		grid-column:
			1 / 3;
	}
	
	.fuchsbau-about-impact-grid {
		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}
}


/* Mobile */

@media (max-width: 700px) {

	.fuchsbau-about-page {
		margin:
			65px
			auto
			80px !important;

		padding:
			0
			20px;
	}


	.fuchsbau-about-intro {
		grid-template-columns:
			1fr;

		gap:
			34px;

		margin-bottom:
			80px !important;
	}


	figure.wp-block-image.fuchsbau-about-fox {
		width:
			180px !important;

		max-width:
			180px !important;
	}


	.fuchsbau-about-actions {
		grid-template-columns:
			1fr;
	}


	.fuchsbau-about-action:last-child {
		grid-column:
			auto;
	}


	.fuchsbau-about-work,
	.fuchsbau-about-mission,
	.fuchsbau-about-history,
	.fuchsbau-about-board {
		margin-bottom:
			80px !important;
	}


	.fuchsbau-about-mission {
		padding:
			34px
			26px;
	}


	.fuchsbau-about-timeline,
	.fuchsbau-about-board-grid {
		flex-direction:
			column;
	}


	.fuchsbau-about-cta {
		padding:
			36px
			28px;
	}


	.fuchsbau-about-cta h2 {
		font-size:
			32px;
	}
	
	.fuchsbau-about-impact {
	margin-bottom:
		80px !important;
	}

	.fuchsbau-about-impact-grid {
		grid-template-columns:
		repeat(
			4,
			minmax(0, 1fr)
		);
    }

	.fuchsbau-about-impact-card {
	padding:
		30px
		26px;
	}
}

/* =========================================================
   IMPACT – MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.fuchsbau-about-impact-grid {
		display: grid !important;

		grid-template-columns:
			minmax(0, 1fr) !important;

		grid-auto-flow:
			row !important;

		gap:
			18px !important;

		width:
			100% !important;
	}


	.fuchsbau-about-impact-card {
		width:
			100% !important;

		min-width:
			0 !important;

		max-width:
			none !important;

		padding:
			28px
			24px;
	}


	.fuchsbau-about-impact-card h3 {
		font-size:
			22px;

		line-height:
			1.2;
	}


	.fuchsbau-about-impact-card p {
		font-size:
			15px;

		line-height:
			1.65;
	}
}