@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

/********************
*      Modules      *
********************/

*, :after, :before {
	box-sizing: border-box;
}

/* Kein Fokus-Rahmen (gepunktete Box) beim Klicken/Tippen mit der Maus.
   Fuer Tastatur-Navigation (Tab) bleibt der Fokus-Ring per :focus-visible
   erhalten — barrierefrei, nur die stoerende Maus-Umrandung faellt weg. */
:focus:not(:focus-visible) {
	outline: none;
}

section{
	position: relative;
	width:100%;
}

section.m2_text_und_bild.auskragung_unten + section{
	padding-top: calc(75px + 70px);  /* standard padding + bild auskragung */
}

.opacity_0{
	opacity: 1;
}

/* link / button */
.button{
	transition: background-color .4s, color .4s;
	text-decoration: none;
	border-radius: 0;   /* Figma: Buttons haben scharfe Ecken (kein Radius) */
	display: inline-block;
	cursor: pointer;
	padding: 12px 31px 14px;
}

.button,
.button * {
	text-transform: uppercase;
	font-size: .875rem;
	font-weight: 700 !important;
}

a.button.primary,
.button.primary {
	background-color: #ef7d00;
	color: #fff;
}

.button.primary p {
	margin-bottom: 0;
	line-height: 1;
	text-transform: uppercase;
	font-size: .875rem;
	/* margin-top: 2px; */
}

.button.primary svg {
	fill: #fff;
	transition: fill .4s;
	width: 26px;
}

.button:not(.inactive).primary:hover {
	background-color: #fff;
	color: #ef7d00;
}

.button.primary:hover {
	text-decoration: none !important;
}

.button.primary:hover svg {
	fill: #ef7d00;
}

.button.secondary{
	background-color: #fff;
	color: #ef7d00;
}

.button.secondary svg {
	fill: #ef7d00;
	-webkit-transition: fill .4s;
	-moz-transition: fill .4s;
	-ms-transition: fill .4s;
	-o-transition: fill .4s;
	transition: fill .4s;
}

.button.secondary:hover {
	background-color: #f7f7f7;
	color: #ef7d00;
}

.button.secondary:hover svg {
	fill: #ef7d00;
}

.button.secondary,
.button.secondary:hover {
	text-decoration: none !important;
}

.button.secondary p {
	margin-bottom: 2px;
}

.link{
	cursor:pointer;
	-webkit-transition: color .4s, background .4s;
	-moz-transition: color .4s, background .4s;
	-ms-transition: color .4s, background .4s;
	-o-transition: color .4s, background .4s;
	transition: color .4s, background .4s;
}

.link.primary{
	color:var(--primarlink_font_color);
}

.link.primary svg {
	fill: var(--primarlink_font_color);
	-webkit-transition: fill .4s;
	-moz-transition: fill .4s;
	-ms-transition: fill .4s;
	-o-transition: fill .4s;
	transition: fill .4s;
}

.link.primary:hover{
	color:var(--primarlink_hover_font_color);
}

.link.primary:hover svg {
	fill: var(--primarlink_hover_font_color);
}

/* ============================================================
   hone Buttons (global) — injizierter Verlinkung-Wrapper .mM_links
   Gilt fuer alle Module mit Verlinkung-Feld. Optik aus Figma (m_hero):
   41px hoch, uppercase, Cresta, Dreieck-Pfeil.
   Primaer = gold (#a5936f), Sekundaer = dunkel mit Rahmen.
   ============================================================ */
.mM_links {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.mM_links > div { margin: 0; }

.mM_links a,
.mM_links a *,
.mM_links a .mM_button_text {
	font-family: cresta, sans-serif;
	font-size: 0.75rem !important;   /* 15px (Basis 20px) — schlaegt .button/.button.primary-Groessen */
	font-weight: 500 !important;
	text-transform: uppercase !important;
	text-decoration: none;
	letter-spacing: 0.375px;
}

.mM_links a.button,
.mM_links a.mM_button {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 41px;
	padding: 0 34px;
	border-radius: 0;
	color: #fff;
	transition: background-color .3s, border-color .3s, color .3s;
	box-sizing: border-box;
}

/* Primaerer Button: gold gefuellt */
.mM_links a.button.primary,
.mM_links a.mM_button.primary {
	background-color: #a5936f;
	border: 1px solid #a5936f;
	color: #ffffff;
}
.mM_links a.button.primary:hover,
.mM_links a.mM_button.primary:hover {
	background-color: #8f7e5d;
	border-color: #8f7e5d;
	color: #ffffff;
}

/* Sekundaerer Button: dunkel mit Rahmen */
.mM_links a.button.secondary,
.mM_links a.mM_button.secondary {
	background-color: rgba(31, 31, 31, 0.55);
	border: 1px solid #6f6f6f;
	color: #ffffff;
}
.mM_links a.button.secondary:hover,
.mM_links a.mM_button.secondary:hover {
	background-color: #1f1f1f;
	border-color: #a5936f;
	color: #ffffff;
}

/* Injiziertes Pfeil-Icon (regawatt-SVG) ausblenden — hone nutzt ein CSS-Dreieck */
.mM_links a .mM_button_icon {
	display: none;
}
.mM_links a.button::after,
.mM_links a.mM_button::after {
	content: '';
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 6px solid currentColor;
	flex: 0 0 auto;
}

/* Schmale Screens: Button-Padding reduzieren (und ab 400px Font minimal
   kleiner), damit lange Labels moeglichst einzeilig bleiben. Wo ein Umbruch
   unvermeidbar ist, zentriert (text-align:center) statt links-ragged. */
@media (max-width: 575px) {
	.mM_links a.button,
	.mM_links a.mM_button {
		/* Wo ein Umbruch unvermeidbar ist (lange Labels, schmale Screens):
		   Hoehe waechst mit + vertikales Padding, damit die 2 Zeilen nicht am
		   oberen/unteren Rand kleben (wie bei m36). */
		height: auto;
		min-height: 41px;
		padding-top: 8px;
		padding-bottom: 8px;
		padding-left: 20px;
		padding-right: 20px;
		text-align: center;
	}
}

@media (max-width: 400px) {
	.mM_links a,
	.mM_links a *,
	.mM_links a .mM_button_text {
		font-size: 0.7rem !important;   /* 14px */
		letter-spacing: 0.25px;
	}

	.mM_links a.button,
	.mM_links a.mM_button {
		padding-left: 16px;
		padding-right: 16px;
		gap: 8px;
	}
}

/* ============================================================
   hone Seitenhintergrund (Flexibler Inhalt)
   Figma 00_Startseite: Grundflaeche ist dunkel (#303030),
   helle Sektionen setzen ihr Weiss selbst (z.B. m8 text_items_text).
   ============================================================ */
body.page-template-page-flexible_content {
	background-color: #303030;
}

.link.secondary{
	color:var(--sekundarlink_font_color);
}

.link.secondary svg {
	fill: var(--sekundarlink_font_color);
	-webkit-transition: fill .4s;
	-moz-transition: fill .4s;
	-ms-transition: fill .4s;
	-o-transition: fill .4s;
	transition: fill .4s;
}

.link.secondary:hover{
	color:var(--sekundarlink_hover_font_color);
}

.link.secondary:hover svg {
	fill: var(--sekundarlink_hover_font_color);
}
/* end link / button */

/* edit post link */

a.mM_edit_post {
	position: absolute;
	top: 30px;
	left: 30px;
	z-index: 99999;
	font-size: 1.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #0056a1;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	color: #f67939;
	-webkit-transition: color .4s, background .4s;
	-moz-transition: color .4s, background .4s;
	-ms-transition: color .4s, background .4s;
	-o-transition: color .4s, background .4s;
	transition: color .4s, background .4s;
}

a.mM_edit_post_global {
	position: fixed;
	top: 150px;
	left: 40px;
}

a.mM_edit_post svg {
	width: 24px;
	fill: #f67939;
	-webkit-transition: fill .4s;
	-moz-transition: fill .4s;
	-ms-transition: fill .4s;
	-o-transition: fill .4s;
	transition: fill .4s;
}

a.mM_edit_post:hover svg {
	fill: #0056a1
}

a.mM_edit_post:hover {
	background: #f67939;
	color: #0056a1;
}

/* end edit post link */

/* form */

.wpcf7 form .wpcf7-not-valid-tip{
	margin-top: 5px;
    position: relative;
    font-size: 0.8rem;
    padding: 6px 10px;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #842029;
    background-color: #f8d7da;
    border-color: #f5c2c7;
    margin-bottom:0;
}

.wpcf7 form .wpcf7-response-output{
    position: relative;
    font-size: 0.8rem;
    padding: 6px 10px;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 5px;
    color: #664d03;
    background-color: #fff3cd;
    border-color: #ffecb5;
    margin: 0;
    margin-top: 10px;
}

.wpcf7 form.sent .wpcf7-response-output{
	color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
}

.wpcf7-form{
	display: block;
	width: 100%;
}

:-ms-input-placeholder,
::-ms-input-placeholder{
	color: #fff;
	opacity: 1;
}

.wpcf7-form *::placeholder{
	color: #fff;
}

.form_container{
	display:flex;
	gap: 0 20px;
	margin-bottom: 20px;
}

.form_item_title * {
	font-size: 1.25rem !important;
}

.form_item,
.wpcf7-form-control{
	width: 100%;
}

.form_item{
	display: flex;
	flex-direction: column;
}

.form_hinweis {
	opacity: .5;
	margin-bottom: 40px;
}

.form_acceptance{
	margin-top: 20px;
}

.wpcf7-form-control{
	border-radius: 5px;
	width: 100%;
	background-color: rgba(229, 229, 229, 0.05);
	padding: 20px 30px;
	border: 1px solid rgba(229, 229, 229, 0.25);
	outline: none;
}

textarea.wpcf7-form-control {
	resize: none;
}

.form_item [data-name="ihr_anliegen"] .wpcf7-not-valid-tip{
	margin-top: -5px;
}

.submit_accept_container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0 20px;
}

.form_submit{
	position: relative;
	margin-top: 10px;
}

.wpcf7-submit {
	width: auto;
}

.wpcf7-form .form_submit .wpcf7-spinner{
	position: absolute;
    left: calc(50% - 12px);
	top: calc(50% - 12px);
    margin: 0;
}

.wpcf7-acceptance .wpcf7-list-item{
	margin:0;
}

.wpcf7-acceptance{
	padding:0;
	border:none;
	line-height: 1.5;
}

.wpcf7-submit:not([disabled]) {
	cursor: pointer;
}

.form_back_container {
	margin-top: 10px;
}

/* input checked */
.wpcf7-acceptance input {
	display: none;
}

.wpcf7-acceptance label {
	position: relative;
	padding-left: 30px;
	margin: 0;
}

.wpcf7-acceptance label:before,
.wpcf7-acceptance label:after {
	content: '';
	position: absolute;
}

.wpcf7-acceptance label:before {
	width: 20px;
	height: 20px;
	top: 1px;
	left: 0;
	background-color: transparent;
	border: 1px solid #ef7d00;
}

.wpcf7-acceptance label:has(input.checked):before {
	background-color: #ef7d00;
}

.wpcf7-acceptance label:after {
	opacity: 0;
	top: 7px;
	left: 4px;
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Isolationsmodus' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 359.22 255.12'%3E%3Cpath class='cls-1' d='M351.86,7.58c-9.93-9.99-26.12-10.12-36.2-.28L126.43,193.31,44.17,108.61c-9.81-10.17-26.05-10.5-36.28-.75-10.23,9.76-10.56,25.91-.75,36.08.04.05.09.09.13.14l100.3,103.38c4.8,4.87,11.36,7.63,18.22,7.66h.28c6.73-.02,13.18-2.67,17.96-7.38L351.63,43.58c10.03-9.89,10.13-25.99.23-36.01Z' style='fill:%23fff'/%3E%3C/svg%3E");
	background-size: 13px 9px;
	width: 13px;
	height: 9px;
}

.wpcf7-acceptance label:has(input.checked):after {
	opacity: 1;
}
/* end input checked */

.form_item select {
	display: none;
}

.mM_custom_select {
	position: relative;
}

.mM_custom_select select {
	display: none;
}

.mM_custom_select .mM_select_selected {
	cursor: pointer;
	border-radius: 5px;
	width: 100%;
	background-color: rgba(229, 229, 229, 0.05);
	padding: 20px 30px;
	border: 1px solid rgba(229, 229, 229, 0.25);
	outline: none;
}

.mM_custom_select .mM_select_selected.mM_select_arrow_active {
	border-bottom: 1px solid transparent;
}

.mM_custom_select .mM_select_items {
	height: 0;
	overflow: hidden;
	overflow-y: scroll;
	position: absolute;
	left: 0;
	top: 68px;
	z-index: 99;
	background: #080808;
	width: 100%;
	padding: 0 20px;
	border: 1px solid transparent;
}

.mM_custom_select:has(.mM_select_arrow_active) .mM_select_items {
	border: 1px solid rgba(229, 229, 229, 0.25);
	border-top: transparent;
}

.mM_custom_select .mM_select_item {
	cursor: pointer;
	padding: 3px 10px;
}

.mM_custom_select .mM_select_item:first-child {
	padding-top: 6px;
}

.mM_custom_select .mM_select_item:last-child {
	padding-bottom: 6px;
}

.mM_custom_select .mM_select_arrows:after {
	content: "\EA1A";
	font-family: "jupiterx";
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	speak: none;
	text-decoration: none;
	text-transform: none;
	line-height: 1;
	position: absolute;
	right: 0;
	top: 0;
	pointer-events: none;
	color: #fff;
	transition: transform .4s;
	transform: rotate(180deg);
}

.mM_select_selected {
	position: relative;
}

.mM_custom_select:hover .mM_select_arrows:after {
	transform: rotate(-0deg);
}

.mM_select_arrows {
	position: absolute;
	right: 30px;
	top: 50%;
	transform: translateY(-50%);
	height: 16px;
}

.mM_custom_select .mM_select_arrow_active .mM_select_arrows:after {
	transform: rotate(0);
}

@media screen and (max-width: 1199px) {
	.submit_accept_container {
		flex-direction: column;
		align-items: start;
	}
}

@media screen and (max-width: 767px) {
	.form_container{
	    flex-direction: column;
		gap: 20px 0;
	}
	
	.wpcf7-form-control,
	.mM_custom_select .mM_select_selected {
		padding: 10px 35px 10px 15px;
	}
	
	.mM_custom_select .mM_select_items {
		padding: 0 10px;
		top: 48px;
	}
	
	.mM_custom_select .mM_select_item {
		padding: 2px 5px;
	}
}

/* end form */

/********************
*       Fonts       *
********************/

/* @font-face 'HandelGotD' entfernt – Font wird nicht mehr geladen. */

/************************************************************************************************************************************/

/****************************
*       Custom Styles       *
****************************/

:root {
	scroll-behavior: unset;
}

html,
body{
	font-family: cresta, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: var(--font_size);
	line-height: 1.5;
	background-color: var(--background_color);
}

body {
	margin: 0;
}

*{
	color:var(--font_color);
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
p {
	margin: 0;
}

h1,
.h1 {
	font-size: 3.5rem;
}

h2,
.h2 {
	font-size: 2.5rem;
	margin-bottom: 30px;
}

h3,
.h3 {
	font-size: 2rem;
}

h4,
.h4 {
	font-size: 1.5rem;
}

p:last-child {
	margin-bottom: 0;
}

a {
	display: inline-block;
	text-decoration: none;
}

img,
svg {
	max-width: 100%;
	width: auto;
	height: auto;
}

.coverimg {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
}

img.coverimg {
	font-family: 'object-fit: cover; object-position: center;';
}

.overflow_x_hidden{
	overflow-x: hidden !important;
}

.overflow_y_hidden{
	overflow-y: hidden !important;
}

.wpgmza-filter-widgets {
	display: none !important;
}

.mM_container {
	max-width: 100%;
	margin: 0 auto;
}

.mM_row {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

[data-innerer-abstand="innerer_abstand_oben_und_unten"]{
	padding-top:120px;
	padding-bottom:120px;
}

[data-innerer-abstand="innerer_abstand_nur_oben"]{
	padding-top:120px;
	padding-bottom:0;
}

[data-innerer-abstand="innerer_abstand_nur_unten"]{
	padding-top:0;
	padding-bottom:120px;
}

/* Modul-Abstand (120px laut Figma) zu kleineren Viewports herunterskalieren.
   Reduktion greift ab <=1199 (dort stapeln m2/m3 bereits = "Tablet-Layout"),
   sonst nutzt der Bereich 992-1199 trotz gestapeltem Layout noch die vollen
   120px und wirkt zu luftig. 60 (≤1199) / 40 (≤600). */
@media screen and (max-width: 1199px) {
	[data-innerer-abstand="innerer_abstand_oben_und_unten"]{
		padding-top:60px;
		padding-bottom:60px;
	}
	[data-innerer-abstand="innerer_abstand_nur_oben"]{
		padding-top:60px;
	}
	[data-innerer-abstand="innerer_abstand_nur_unten"]{
		padding-bottom:60px;
	}
}

@media screen and (max-width: 600px) {
	[data-innerer-abstand="innerer_abstand_oben_und_unten"]{
		padding-top:40px;
		padding-bottom:40px;
	}
	[data-innerer-abstand="innerer_abstand_nur_oben"]{
		padding-top:40px;
	}
	[data-innerer-abstand="innerer_abstand_nur_unten"]{
		padding-bottom:40px;
	}
}

/* -----------------------------------------------------------------
   Zusaetzlicher Section-Abstand als Toggle-Klasse (PADDING).
   In den Wrapper-Einstellungen eines Moduls im Feld "Zusaetzliche Klassen"
   hinzufuegbar -> steuert pro Modul, ob dieser Abstand da ist. Als PADDING
   (nicht Margin), damit der Section-Hintergrund die Luft mitfaerbt —
   konsistent mit data-innerer-abstand. Betrag = gleiche reduzierte Skala wie
   der Section-Abstand im gestapelten Layout: 60px, ab <=600px 40px. Greift
   <1560 (Stapel-Layout); ab 1560 nutzen Module ihr eigenes Overlap-/Offset-
   Design (z.B. die m3-Foto-Baender auf Photovoltaik/Bautraeger).
   ----------------------------------------------------------------- */
@media screen and (max-width: 1559px) {
	.hone_abstand_oben  { padding-top: 60px; }
	.hone_abstand_unten { padding-bottom: 60px; }
}

@media screen and (max-width: 600px) {
	.hone_abstand_oben  { padding-top: 40px; }
	.hone_abstand_unten { padding-bottom: 40px; }
}

/* Gegenstueck: Section-Abstand OBEN/UNTEN entfernen (Toggle-Klasse fuers Wrapper-
   Feld). Fuer Faelle, in denen die Nachbarsektion ihren Abstand bereits liefert
   und sonst ein doppelter Abstand entstuende (z.B. m36-CTA direkt unter einer
   Sektion mit Unten-Abstand). section-Prefix schlaegt [data-innerer-abstand]. */
section.hone_kein_abstand_oben  { padding-top: 0; }
section.hone_kein_abstand_unten { padding-bottom: 0; }

/* Kleiner Oben-Abstand statt Standard-Section-Abstand (z.B. m36-CTA direkt unter
   einer Sektion, die ihren Unten-Abstand liefert — soll nicht 0, aber deutlich
   kleiner als ueblich sein). */
section.hone_abstand_oben_klein { padding-top: 22px; }

/* Extra Oben-Abstand (~80px additiv) am Folge-Modul, wenn das Bild des Moduls
   darueber reinragt (z.B. m8 unter dem Karriere-m2, dessen Bild 100px ueberhaengt)
   — Inhalt soll die Bildkante freikommen. Nur >=1560, wo der Ueberhang existiert. */
@media (min-width: 1560px) {
	section.hone_abstand_oben_gross { margin-top: 80px; }
}

[data-auserer-abstand="auserer_abstand_oben_und_unten"]{
	margin-top:75px;
	margin-bottom:75px;
}

[data-auserer-abstand="auserer_abstand_nur_oben"]{
	margin-top:75px;
	margin-bottom:0;
}

[data-auserer-abstand="auserer_abstand_nur_unten"]{
	margin-top:0;
	margin-bottom:75px;
}

/* Aeusserer Abstand (75px) war auf kleineren Screens ungeskaliert -> mit
   herunterskalieren wie der innere Abstand (ab <=1199). */
@media screen and (max-width: 1199px) {
	[data-auserer-abstand="auserer_abstand_oben_und_unten"]{ margin-top:56px; margin-bottom:56px; }
	[data-auserer-abstand="auserer_abstand_nur_oben"]{ margin-top:56px; }
	[data-auserer-abstand="auserer_abstand_nur_unten"]{ margin-bottom:56px; }
}

@media screen and (max-width: 600px) {
	[data-auserer-abstand="auserer_abstand_oben_und_unten"]{ margin-top:40px; margin-bottom:40px; }
	[data-auserer-abstand="auserer_abstand_nur_oben"]{ margin-top:40px; }
	[data-auserer-abstand="auserer_abstand_nur_unten"]{ margin-bottom:40px; }
}

.mM_container[data-ausrichtung="links"]{
	padding-left: 0;
	margin-left: 0;
}

.mM_container[data-ausrichtung="rechts"]{
	padding-right: 0;
	margin-right:0;
}

.mM_container[data-ausrichtung="zentriert_ausfuellung_rechts"]{
	/* padding-right: 0;
	margin-right: 0; */
}

.mM_container[data-ausrichtung="zentriert_ausfuellung_links"]{
	/* padding-left: 0;
	margin-left: 0; */
}

.mM_container[data-container="container_full"] {
	max-width: 100%;
	padding-left: 0;
	padding-right: 0;
}

[data-appearance="fade"]{
	opacity: 1;
}

.mM_d_flex {
	display: flex;
}

.mM_d_none {
	display: none;
}

.mM_d_block {
	display: block;
}

.mM_d_inlineblock {
	display: inline-block;
}

.mM_links {
	margin-top: 30px;
}

[class*="mM_col_"] {
	flex: 0 0 auto;
	max-width: 100%;
}

.mM_col_100,
[class*="mM_col_"] {
	width: 100%;
}

body.single-stores {
	overflow-x: hidden;
}

body.single-stores .elementor-icon-list-item a span {
	font-family: cresta, sans-serif;
}

body.single-stores h1,
body.single-stores h2 {
	text-transform: uppercase;
}

body.page-template-page-flexible_content .jupiterx-main > .jupiterx-main-content {
	padding: 0;
}

body.single-stores .jupiterx-main > .jupiterx-main-content {
	padding: 0;
}

body.page-id-17160 .jupiterx-main > .jupiterx-main-content > .container {
	padding: 0;
	margin: 0;
	max-width: 100%;
}

body.page-id-17160 .jupiterx-main > .jupiterx-main-content > .container > .row {
	margin-right: 0;
	margin-left: 0;
}

body.page-id-17160 .jupiterx-main > .jupiterx-main-content > .container > .row > .col-lg-12 {
	padding-right: 0;
	padding-left: 0;
}

body.single-stores .jupiterx-main > .jupiterx-main-content > .container {
	padding: 0;
	margin: 0;
	max-width: 100%;
}

body.single-stores .jupiterx-main > .jupiterx-main-content > .container > .row {
	margin-right: 0;
	margin-left: 0;
}

body.single-stores .jupiterx-main > .jupiterx-main-content > .container > .row > .col-lg-12 {
	padding-right: 0;
	padding-left: 0;
}

body.page-template-page-flexible_content .jupiterx-main > .jupiterx-main-content > .container-fluid {
	width: 100%;
	padding-right: 0;
	padding-left: 0;
}

body.page-template-page-flexible_content .jupiterx-main > .jupiterx-main-content > .container-fluid > .row {
	margin-right: 0;
	margin-left: 0;
}

body.page-template-page-flexible_content .jupiterx-main > .jupiterx-main-content > .container-fluid > .row > .col-lg-12 {
	padding-right: 0;
	padding-left: 0;
}

.orange {
	color: #ef7d00 !important;
}

.not_uppercase {
	text-transform: none !important;
}

.uppercase {
	text-transform: uppercase !important;
}

body.page-template-page-flexible_content p,
body.page-template-page-flexible_content span {
	font-family: cresta, sans-serif;
	font-weight: 400;
	font-style: normal;
}

body.page-template-page-flexible_content h1,
body.page-template-page-flexible_content .h1,
body.page-template-page-flexible_content h1 *,
body.page-template-page-flexible_content .h1 *,
body.page-template-page-flexible_content h2,
body.page-template-page-flexible_content .h2,
body.page-template-page-flexible_content h2 *,
body.page-template-page-flexible_content .h2 *,
body.page-template-page-flexible_content h3,
body.page-template-page-flexible_content .h3,
body.page-template-page-flexible_content h3 *,
body.page-template-page-flexible_content .h3 *,
.font_handelgotd {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
}

/* hone: Der goldene Titel-Teil (<span>) soll dasselbe Font-Weight wie der
   weisse Teil haben. Die Regel oben zwingt h*-KINDER auf 700, waehrend die
   Modul-Regeln nur den Titel selbst auf 500 setzen -> der Span blieb 700.
   Hier erbt der Span das Weight des Titels (global, alle Seiten). */
body.page-template-page-flexible_content h1 span,
body.page-template-page-flexible_content h2 span,
body.page-template-page-flexible_content h3 span,
body.page-template-page-flexible_content .h1 span,
body.page-template-page-flexible_content .h2 span,
body.page-template-page-flexible_content .h3 span {
	font-weight: inherit;
}

body.page-template-page-flexible_content h1,
body.page-template-page-flexible_content .h1 {
	font-size: 4.0625rem;
	line-height: 1.2;
}

body.page-template-page-flexible_content h2,
body.page-template-page-flexible_content .h2 {
	font-size: 2.8125rem;
}

/* hone: ZENTRALE Groesse fuer Standard-Section-Titel (Modultitel im
   .mM_title_container). Module setzen hier KEINE eigene font-size mehr.
   Ausnahmen (eigene Groesse im Modul): Hero m30/m39, Zitat m42, Card-/Sub-Titel. */
body.page-template-page-flexible_content .mM_title_container h2 {
	font-size: 1.75rem;        /* 35px (Basis 20px) */
}

@media screen and (max-width: 575px) {
	body.page-template-page-flexible_content .mM_title_container h2 {
		font-size: 1.3rem;     /* 26px */
	}
}

body.page-template-page-flexible_content h3,
body.page-template-page-flexible_content .h3 {
	font-size: 1.875rem;
}

body.page-template-page-flexible_content header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
}

body.page-template-page-flexible_content .jupiterx-primary section:first-child {
	margin-top: 145px !important;
}

section.light_gray_background {
	background: #f7f7f7;
}

@media all and (min-width: 576px) {
	.mM_container,
	.mM_container.mM_container_small {
		max-width: 540px;
	}
	
	.mM_col_25,
	.mM_col_33,
	.mM_col_20 {
		width: calc(50% - (20px / 2));
	}
}

@media all and (min-width: 768px) {
	.mM_container,
	.mM_container.mM_container_small {
		max-width: 720px;
	}
}

@media all and (min-width: 992px) {
	.mM_container,
	.mM_container.mM_container_small {
		max-width: 960px;
	}
	
	.mM_col_50 {
		width: calc(50% - (20px / 2));
	}
	
	.mM_col_33,
	.mM_col_20 {
		width: calc(33.3333% - ((20px * 2) / 3));
	}
}

@media all and (min-width: 1200px) {
	.mM_container {
		max-width: 1140px;
	}
	
	.mM_container.mM_container_small {
		max-width: 1038px;
	}
	
	.mM_col_25 {
		width: calc(25% - ((20px * 3) / 4));
	}

	.mM_col_20 {
		width: calc(20% - ((20px * 4) / 5));
	}
}

@media all and (min-width: 1400px) {
	.mM_container {
		max-width: 1320px;
	}
	
	.mM_container.mM_container_small {
		max-width: 1218px;
	}
}

@media all and (min-width: 1600px) {
	.mM_container {
		max-width: 1520px;
	}
	
	.mM_container[data-container="container"] {
		max-width: 1560px;
	}
	
	.mM_container.mM_container_small {
		max-width: 1418px;
	}
}

@media all and (min-width: 1800px) {
	.mM_container {
		max-width: 1720px;
	}
	
	.mM_container.mM_container_small {
		max-width: 1618px;
	}
}

@media all and (min-width: 1921px) {
	.mM_container {
		max-width: 1841px;
	}
	
	.mM_container.mM_container_small {
		max-width: 1739px;
	}
}

@media all and (min-width: 2200px) {
	.mM_container {
		max-width: 2120px;
	}
	
	.mM_container.mM_container_small {
		max-width: 2018px;
	}
}

@media screen and (max-width: 1020px) {
	body.page-template-page-flexible_content .jupiterx-primary section:first-child {
		margin-top: 67px !important;
	}
}

@media all and (max-width: 991px) {
	section.m2_text_und_bild.auskragung_unten + section {
		padding-top: 75px;  /* standard padding */
	}
}

@media all and (max-width: 767px) {
	body.page-template-page-flexible_content h1,
	body.page-template-page-flexible_content .h1,
	body.single-stores h1,
	body.single-stores .h1 {
		font-size: 3.5rem;
	}
	
	body.page-template-page-flexible_content h2,
	body.page-template-page-flexible_content .h2,
	body.single-stores h2,
	body.single-stores .h2 {
		font-size: 2.1125rem;
	}
	
	body.page-template-page-flexible_content h3,
	body.page-template-page-flexible_content .h3,
	body.single-stores h3,
	body.single-stores .h3 {
		font-size: 1.175rem;
	}
}

@media all and (max-width: 575px) {
	.mM_container {
		padding: 0 20px;
	}
	
	body.page-template-page-flexible_content h1,
	body.page-template-page-flexible_content .h1,
	body.single-stores h1,
	body.single-stores .h1 {
		font-size: 3rem;
	}
}

@media all and (max-width: 475px) {
	.mM_container {
		padding: 0 20px;
	}
	
	body.page-template-page-flexible_content h1,
	body.page-template-page-flexible_content .h1,
	body.single-stores h1,
	body.single-stores .h1 {
		font-size: 2.5rem;
	}
	
	* {
		text-align: start;
	}
}

@media all and (max-width: 400px) {
	body.page-template-page-flexible_content h1,
	body.page-template-page-flexible_content .h1,
	body.single-stores h1,
	body.single-stores .h1 {
		font-size: 2rem;
	}
	
	body.page-template-page-flexible_content h2,
	body.page-template-page-flexible_content .h2,
	body.single-stores h2,
	body.single-stores .h2 {
		font-size: 1.8125rem;
	}
	
	h1, h2, h3, h4, h5, h6 {
		hyphens: auto;
	}
}

@media all and (max-width: 350px) {
	.button {
		text-align: center;
	}
}

header section.elementor-section {
	opacity: 1 !important;
}
/* =========================================================
   Bilder-Lightbox (global): wird von m37_projekte.js erzeugt,
   genutzt von m37 (Projekte) und m43 (Referenzen).
   Klassen behalten das m37_-Praefix (Ursprungsmodul).
   ========================================================= */
/* ---------- Lightbox (Uebersicht: Karte oeffnet Objekt-Galerie) ---------- */
body.m37_lightbox_offen {
	overflow: hidden;
}

.m37_lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background-color: rgba(31, 31, 31, 0.95);
	display: flex;
	align-items: center;
	justify-content: center;
}

.m37_lightbox_inner {
	width: 100%;
	max-width: 1600px;
	padding: 0 110px;
	box-sizing: border-box;
}

/* Slides fix auf 82vh, Bild darin vertikal + horizontal zentriert.
   Doppel-Selektor noetig: slick.css laedt NACH project.css und setzt
   .slick-initialized .slick-slide { display: block } (gleiche Spezifitaet
   wie 2 Klassen) — der 3-Klassen-Selektor gewinnt unabhaengig von der
   Ladereihenfolge. */
.m37_lightbox .m37_lightbox_slide,
.m37_lightbox .slick-slide.m37_lightbox_slide {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 82vh;
}

.m37_lightbox_slide img {
	display: block;
	width: auto;
	max-width: 100%;
	max-height: 100%;
}

/* Schliessen: goldenes Quadrat mit X */
.m37_lightbox_close {
	position: absolute;
	top: 40px;
	right: 40px;
	z-index: 2;
	width: 41px;
	height: 41px;
	border: 0;
	background-color: #a5936f;
	cursor: pointer;
	transition: background-color .3s;
}

.m37_lightbox_close:hover {
	background-color: #8f7e5d;
}

.m37_lightbox_close::before,
.m37_lightbox_close::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 17px;
	height: 2px;
	background-color: #fff;
}

.m37_lightbox_close::before {
	transform: translate(-50%, -50%) rotate(45deg);
}

.m37_lightbox_close::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

/* Pfeile: gold 41px mit weissem Dreieck (wie m41) */
.m37_lightbox_arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 41px;
	height: 41px;
	border: 0;
	background-color: #a5936f;
	cursor: pointer;
	transition: background-color .3s;
}

.m37_lightbox_arrow:hover {
	background-color: #8f7e5d;
}

.m37_lightbox_arrow_prev {
	left: 30px;
}

.m37_lightbox_arrow_next {
	right: 30px;
}

.m37_lightbox_arrow::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 0;
	height: 0;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 7px solid #fff;
}

.m37_lightbox_arrow_prev::after {
	border-left: 0;
	border-right: 7px solid #fff;
}

@media (max-width: 991px) {
	.m37_lightbox_inner {
		padding: 0 60px;
	}

	.m37_lightbox_close {
		top: 20px;
		right: 20px;
	}

	.m37_lightbox_arrow_prev {
		left: 10px;
	}

	.m37_lightbox_arrow_next {
		right: 10px;
	}
}


/* ============================================================
   404 – Fehlerseite (passt zum Flexible-Content-Design)
   Dunkle Vollflaeche zwischen Header (135px, fixed) und Footer,
   Gold-Akzent, Primaer-Button (nutzt .mM_links-Button-Styles).
============================================================ */
.hone_404 {
	background-color: #1f1f1f;
	min-height: 100vh;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 215px 40px 120px;   /* 135px fixer Header + Luft oben, 120px unten */
	text-align: center;
}

.hone_404_inner {
	max-width: 720px;
	margin: 0 auto;
}

.hone_404_code {
	display: block;
	font-family: cresta, sans-serif;
	font-size: 8rem;             /* 160px (Basis 20px) */
	line-height: 1;
	font-weight: 500;
	letter-spacing: 2px;
	color: #a5936f;
	margin-bottom: 24px;
}

.hone_404_titel {
	margin: 0 0 24px;
	font-family: cresta, sans-serif;
	font-size: 2rem;             /* 40px */
	line-height: 1.1;
	font-weight: 500;
	letter-spacing: 0.875px;
	text-transform: uppercase;
	color: #fff;
}

.hone_404_titel span {
	color: #a5936f;
}

.hone_404_text {
	margin: 0 auto 45px;
	max-width: 520px;
	font-family: cresta, sans-serif;
	font-size: 0.9rem;           /* 18px */
	line-height: 1.6;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.7);
}

.hone_404 .hone_404_links,
.hone_404 .mM_links {
	display: flex;
	justify-content: center;
}

@media (max-width: 991px) {
	.hone_404 {
		padding: 180px 24px 80px;
	}
	.hone_404_code {
		font-size: 6rem;         /* 120px */
	}
}

@media (max-width: 575px) {
	.hone_404_code {
		font-size: 4.5rem;       /* 90px */
	}
	.hone_404_titel {
		font-size: 1.5rem;       /* 30px */
	}
}

/* 404: den Standard-Header-Bildbereich (grauer Streifen-Platzhalter) ausblenden
   — die .hone_404-Sektion hat oben bereits den Header-Abstand (215px). */
body.error404 .hw-header-bild {
	display: none;
}
