/* Backend CSS Manager bundle (auto-generated). DO NOT EDIT. */

/* --- buttons.css --- */
/* Button Hover Effekt 1 */

a.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 12px; /* Abstand zwischen Bild & Text */
}


a.wp-block-button__link.has-text-color.has-link-color.wp-element-button:hover {
color: var(--color-white) !important;
background-color: var(--color-primary) !important;
border: 2px solid var(--color-white); /* optionaler Rand */
border-radius: 50px; /* macht den Rand schön rund */
transition: all 0.3s ease; /* sanfte Animation */
}

/* Button Hover Effekt 2 */
a.wp-block-button__link.has-base-color.has-text-color.has-link-color.wp-element-button:hover {
color: var(--color-primary) !important;
background-color: var(--color-white) !important;
border: 2px solid var(--color-primary);
border-radius: 50px;
transition: all 0.3s ease;
}

a.wp-block-button__link img {
	width:10px;
  filter: none;
  transition: filter 0.3s ease;
}
a.wp-block-button__link.custom-button:hover img {
  filter:invert(100%) sepia(0%) saturate(7469%) hue-rotate(356deg) brightness(102%) contrast(101%);
}
a.wp-block-button__link:hover img {
  filter: brightness(0)
          saturate(100%)
          invert(16%)
          sepia(92%)
          saturate(5775%)
          hue-rotate(347deg)
          brightness(77%)
          contrast(109%);
}

a.wp-block-button__link img {
	width:10px;
  filter: none;
  transition: filter 0.3s ease;
}

.custom-button img {
  transition: filter 0.3s ease;
}

.custom-button:hover img {
  filter: brightness(0)
          saturate(100%)
          invert(16%)
          sepia(92%)
          saturate(5775%)
          hue-rotate(347deg)
          brightness(77%)
          contrast(109%);
}


/* --- cross-area.css --- */
.cross-area::before,
.cross-area::after {
    content: none ;
}

@media (min-width: 1100px) {
    .cross-area {
        position: relative;
        width: 100%;
        min-height: 400px;
    }

    .cross-area::before,
    .cross-area::after {
        content: "";
        position: absolute;
        background-color: #cb0119;
        z-index: 1;
    }

 /* ===== Horizontale Linie ==== */
    .cross-area::before {
        top: 50%;
        left: 0;
        width: 100%;
        height: 1px;
        transform: translateY(-50%);
    }

/* ===== Vertikale Linie ==== */
    .cross-area::after {
        top: 0;
        left: 50%;
        width: 1px;
        height: 100%;
        transform: translateX(-50%);
    }
}

/* ?? */
.wp-block-group.is-nowrap.is-layout-flex.wp-container-core-group-is-layout-6c531013.wp-block-group-is-layout-flex {
    margin: 2rem;
}

/* --- externer-link.css --- */
/* New file: externer-link.css */
span.external-link-icon.Custom.Right {
    display: inline-block;
    max-width: 16px;
    transform: translateY(9px);
}

.no-external-link-icon span.external-link-icon.Custom.Right {
    display: none;
}

.page-template-marxen-unterseiten span.external-link-icon.Custom.Right {
    filter: brightness(0) saturate(100%) invert(98%) sepia(74%) saturate(357%) hue-rotate(167deg) brightness(120%) contrast(100%);
}

/* --- fonts.css --- */
h1, h2, h3, h4, h5, h6 {
		font-family: 'Open Sans' !important;
}

/* --- footer-hover-effekt.css --- */
.footer-hover-effekt {
  text-decoration: none !important;     

}

.footer-hover-effekt:hover {
 color: #cb0119;      
  transition: 0.3s;     
}

/* --- general.css --- */
:root {
  /* === Farben === */
    --color-white: #ffffff;
    --color-black: #000000;
    --color-primary: #cb0119;
    --color-bg-transparent: rgba(255, 255, 255, 0.7);
    --color-shadow: rgba(0, 0, 0, 0.3);

  /* === Clip-Path Formen === */
    --clip-desktop: polygon(0 0%, 100% 25%, 100% 88%, 0 70%);
    --clip-mobile: polygon(0 15%, 100% 25%, 100% 90%, 0 80%);
}

a {
		text-decoration: none;
}

/* --- header-startseite.css --- */


/* --- headings.css --- */
/* ===== Unterstrich für die Headline ==== */
.heading-unterstrich {
    position: relative;
    padding-bottom: 8px;
}

.heading-unterstrich::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 2em;
    height: 3px;
    background-color: var(--color-primary);
}

/* --- homepage-cover.css --- */
/* Make this cover block size itself by the image height */
.homepage-cover{
		min-height: 0 !important;
		padding: 0 !important;
		position: relative;
		display: block; /* stop the default flex sizing behavior */
		height: 80vh;
}

/* Let the image define the height (responsive) */
.homepage-cover > img.wp-block-cover__image-background{
		position: relative !important;  /* instead of absolute */
		inset: auto !important;
		min-width: 100%;
		width: auto !important;
		height: 100% !important;
		display: block;
		object-fit: cover !important; /* shows the whole image */
		z-index: 0;
		place-self: center;
}

/* Keep overlay + text on top */
.homepage-cover > .wp-block-cover__background{
		position: absolute;
		inset: 0;
		z-index: 1;
}

.homepage-cover > .wp-block-cover__inner-container{
		position: absolute;
		inset: 0;
		align-content: center;
		padding: 0;
		z-index: 2;
}

/* --- image-hover-effekt.css --- */
.image-hover-effekt {
    display: inline-block;
    position: relative;
    overflow: hidden;
    transition: transform 0.4s ease, filter 0.4s ease;
}


.image-hover-effekt::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #cb0119;
    opacity: 0; 
    transition: opacity 0.4s ease;
    pointer-events: none;
}


.image-hover-effekt:hover::after {
  opacity: 0.3; 
}

/* --- impressum rote bereiche.css --- */
/* New file: impressum rote bereiche.css */
.page-id-30 .entry-content a {
    color: #cb0119 !important;
}


/* --- mobile.css --- */


/* --- navigation.css --- */
.navigation-homepage .wp-block-navigation a:hover,
.wp-block-navigation ul.wp-block-navigation-submenu a:hover {
		color: var(--color-primary) !important;
}

.wp-block-navigation a:hover {
		text-decoration: none !important;
}


.wp-block-navigation a:focus,
.wp-block-navigation__submenu-toggle:focus {
		outline: none !important;
		box-shadow: none !important;
}


/* --- parallelogram-block.css --- */


/* Slant: top-right down 2rem, bottom-left up 2rem */
.parallelogram-block {
  /* optional: helps avoid a thin 1px seam on some browsers */
  overflow: hidden;

  clip-path: polygon(
    0 0,                          /* top-left */
    100% 10rem,                    /* top-right lowered */
    100% 100%,                    /* bottom-right */
    0 calc(100% - 10rem)           /* bottom-left raised */
  );
}

/* Optional: better Safari support */
.parallelogram-block {
  -webkit-clip-path: polygon(
    0 0,
    100% 10rem,
    100% 100%,
    0 calc(100% - 10rem)
  );
}

/* --- resolution-optimizations/a-1024.css --- */
/* New file: resolution-optimizations/1024.css */


/* --- resolution-optimizations/b-781.css --- */
@media (max-width: 781px) {
		/* 2x2 grid layout in the header group */
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458.wp-block-group.is-layout-flex{
				display: grid !important;
				grid-template-columns: auto 1fr;
				grid-template-areas:
						"logo  eush"
						"phone email";
				align-items: center;
				gap: 10px 16px;
		}

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(1) { grid-area: logo; }

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(2) { grid-area: phone; }

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(3) { grid-area: email; }

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(4) { grid-area: eush; }

		/* Move ONLY the email group to the right, but keep its text left-aligned */
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(3) {
				justify-self: end;          /* positions the whole group at the right */
				max-width: 100%;            /* prevents overflow */
		}

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(3) p {
				text-align: left !important; /* wrapped lines stay left */
				overflow-wrap: anywhere;     /* optional, helps long emails wrap */
				min-width: 0;                /* helps flex items shrink properly */
		}

		/* Move ONLY the EU logo (figure) to the right */
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(4) {
				justify-self: end;
		}

		/* Optional: keep images responsive */
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 .wp-block-image img {
				max-width: 100%;
				height: auto;
		}

		.cross-area.is-layout-grid {
				grid-template-columns: 1fr !important;
		}

		/* optional: make sure each grid item stretches full width */
		.cross-area.is-layout-grid > * {
				width: 100%;
		}

		.contact-us-strip .wp-block-column {
				place-items: center;
		}

		/* When the columns stack, force the column content to align left */
		.subpage-contact-header .wp-block-columns {
				justify-content: flex-start;
		}

		/* Override the "is-content-justification-right" on the inner flex group */
		.subpage-contact-header .wp-block-group.is-layout-flex.is-content-justification-right {
				justify-content: flex-start !important;
		}

		/* Optional: ensure text aligns left too */
		.subpage-contact-header .wp-block-column,
		.subpage-contact-header .wp-block-column * {
				text-align: left;
		}

		.wp-block-gallery.is-slideshow {
				--gst-visible: 2;
		}
}


/* --- resolution-optimizations/c-480.css --- */
/* <=480px: stack all 4 items (one per row) */
@media (max-width: 480px) {
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458.wp-block-group.is-layout-flex{
				display: grid !important;
				grid-template-columns: 1fr;
				grid-template-areas:
						"logo"
						"phone"
						"email"
						"eush";
				align-items: flex-start;
				gap: 10px;
		}

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(1) { grid-area: logo; }

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(2) { grid-area: phone; }

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(3) { grid-area: email; }

		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(4) { grid-area: eush; }

		/* When stacked, don't push email / EU logo to the right */
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(3),
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(4) {
				justify-self: start;
		}

		/* Hide the first item (Logo) */
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458 > :nth-child(1) {
				display: none !important;
		}

		/* Update stacking order since the logo is gone */
		header.wp-block-template-part
		.wp-container-core-group-is-layout-ed947458.wp-block-group.is-layout-flex {
				grid-template-areas:
						"phone"
						"email"
						"eush";
		}
}