/* Globales Grid Container */
.g-container {
	max-width: 1140px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
	gap: 2rem;
}

.g-container-fluid {
	max-width: 1440px;
}

:where(.wp-block-columns.is-layout-flex) {
	gap: 3rem;
	display: flex;
}

:where(.has-white-background-color.has-background) {
	background: var(--white);
}

:where(.wp-block-buttons.is-layout-flex) {
	display: flex;
	gap: .5rem;
}


/* Spalten */
.g-col {
	flex: 1 1 100%;
	box-sizing: border-box;
}

@media (min-width: 768px) {
	.g-col-8 {
		flex: 1 0 calc(760px - (1rem));
	}
	.g-col-6 {
		flex: 0 0 calc(560px - (1rem / 2));
	}
	.g-col-6-nested {
		flex: 1 0 calc(50% - (1rem / 2));
	}
	.g-col-8-nested {
		flex: 1 0 calc(66.66% - (1rem));
	}
	.g-col-4-nested {
		flex: 1 0 calc(33.33% - (1rem / 2));
	}
	.g-col-4 {
		flex: 0 0 calc(360px - (1rem / 3));
	}
	.g-col-3 {
		flex: 0 0 calc(260px - (1rem / 4));
	}
	.g-col-centered-8 {
		flex: 0 0 calc(760px - (1rem / 2));
		margin: 0 auto;
	}
}

@media (min-width: 1024px) {
	.g-col-12 {
		flex: 1 1 calc(100% - 2rem); /* Eine Spalte auf großen Bildschirmen */
	}
}


/* Zentriere Inhalte vertikal und horizontal */
.flex-center {
	display: flex;
	justify-content: center; /* Horizontal zentrieren */
	align-items: center;     /* Vertikal zentrieren */
}

/* Zentriere Inhalte nur vertikal */
.flex-vcenter {
	display: flex;
	align-items: center; /* Vertikal zentrieren */
}

.flex-end {
	align-items: flex-end;
}


/* Vertikale Ausrichtung */

/* Zentriert vertikal */
.align-items-center {
	display: flex;
	align-items: center; /* Vertikale Zentrierung */
}

/* Unten ausgerichtet */
.align-items-end {
	display: flex;
	align-items: flex-end; /* Unten ausgerichtet */
}

/* Oben ausgerichtet (Standard) */
.align-items-start {
	display: flex;
	align-items: flex-start; /* Oben ausgerichtet */
}

/* Horizontale Ausrichtung */

/* Zentriert horizontal */
.justify-content-center {
	display: flex;
	justify-content: center; /* Horizontale Zentrierung */
}

/* Rechts ausgerichtet */
.justify-content-end {
	display: flex;
	justify-content: flex-end; /* Rechts ausgerichtet */
}

/* Links ausgerichtet (Standard) */
.justify-content-start {
	display: flex;
	justify-content: flex-start; /* Links ausgerichtet */
}


/* Padding Top */
.pt-1 { padding-top: 0.5rem; }
.pt-2 { padding-top: 1rem; }
.pt-3 { padding-top: 3rem; }
.pt-4 { padding-top: 6rem; }
.pt-5 { padding-top: 10rem; }

/* Padding Bottom */
.pb-1 { padding-bottom: 0.5rem; }
.pb-2 { padding-bottom: 1rem; }
.pb-3 { padding-bottom: 3rem; }
.pb-4 { padding-bottom: 6rem; }
.pb-5 { padding-bottom: 10rem; }

/* Padding Left */
.pl-1 { padding-left: 0.5rem; }
.pl-2 { padding-left: 1rem; }
.pl-3 { padding-left: 3rem; }
.pl-4 { padding-left: 6rem; }
.pl-5 { padding-left: 10rem; }

/* Padding Right */
.pr-1 { padding-right: 0.5rem; }
.pr-2 { padding-right: 1rem; }
.pr-3 { padding-right: 3rem; }
.pr-4 { padding-right: 6rem; }
.pr-5 { padding-right: 10rem; }

/* Margin Top */
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 3rem; }
.mt-4 { margin-top: 6rem; }
.mt-5 { margin-top: 10rem; }

/* Margin Left */
.ml-1 { margin-left: 0.5rem; }
.ml-2 { margin-left: 1rem; }
.ml-3 { margin-left: 3rem; }
.ml-4 { margin-left: 6rem; }
.ml-5 { margin-left: 10rem; }

/* Margin Bottom */
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 3rem; }
.mb-4 { margin-bottom: 6rem; }
.mb-5 { margin-bottom: 10rem; }

/* Padding All */
.p-1 { padding: 0.5rem; }
.p-2 { padding: 1rem; }
.p-3 { padding: 3rem; }
.p-4 { padding: 6rem; }
.p-5 { padding: 10rem; }

/* Margin All */
.m-1 { margin: 0.5rem; }
.m-2 { margin: 1rem; }
.m-3 { margin: 3rem; }
.m-4 { margin: 6rem; }
.m-5 { margin: 10rem; }