/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/


/**
 * Custom Link Styling
 **/
.link--primary {
	
}

.link--secondary {
	color: var(--neutral) !important;
}

.link--secondary:hover {
	color: var(--primary-dark) !important;
}

.link--primary-light {
	color: var(--white) !important;
    text-decoration-color: var(--white) !important;
}

/**
 * Custom Button Styling
 **/
.btn--primary,
.btn--primary-light {
	padding: 0.25rem 0.25rem 0.25rem 1.5rem !important;
	gap: 1rem !important;
	transition: all .6s ease-in-out;
}

.btn--primary:hover::after,
.btn--primary-light:hover::after {
	transform: rotate(44deg);
	transition: all .6s ease-in-out;
}

/* Primary Button */
.btn--primary::after {
	content: "";
	display: flex;
	position: relative;
	width: 2.5rem;
    height: 2.5rem;
	background-color: var(--white);
	background-image: url('/wp-content/uploads/Vector.svg');
	background-repeat: no-repeat;
	border-radius: 4em;
	background-position: center;
	background-size: 1.2rem;
	transition: all .6s ease-in-out;
}

/* Primary Light Button */
.btn--primary-light {
	background-color: var(--white) !important;	
}

.btn--primary-light::after {
	content: "";
	display: flex;
	position: relative;
	width: 2.5rem;
    height: 2.5rem;
	background-color: var(--primary);
	background-image: url('/wp-content/uploads/Arrow-White.svg');
	background-repeat: no-repeat;
	border-radius: 4em;
	background-position: center;
	background-size: 1.2rem;
	transition: all .6s ease-in-out;	
}

/**
 * Footer
 **/
/* Trenner-Symbol für Rechtliches */
.rwp-rechtliches {
  display: flex;
  gap: 0.5rem;
}

.rwp-rechtliches li::after {
  content: "|";
  margin-left: 0.5rem;
  color: var(--white);
}

.rwp-rechtliches li:last-child::after {
  content: "";
}

/* Footer Responsive Anpassungen */
.rwp-footer-kontaktdaten a {
	font-size: var(--text-xl);
}

@media only screen and (max-width: 1410px) and (min-width: 1221px) {
	.rwp-footer-kontaktdaten a {
		font-size: calc(var(--text-xl)*0.8) !important;
	}
	
	.rwp-footer-kontaktdaten {
		min-width: fit-content !important;
	}
}

@media only screen and (max-width: 1220px) and (min-width: 1131px) {
	.rwp-footer-kontaktdaten a {
		font-size: calc(var(--text-xl)*0.7) !important;
	}
	
	.rwp-footer-kontaktdaten {
		gap: 0.5rem !important;
		min-width: fit-content !important;
	}
	
	.rwp-footer-adresse {
		min-width: 13rem !important;
	}
}

@media only screen and (max-width: 1130px) and (min-width: 992px) {
	.rwp-footer-kontaktdaten a {
		font-size: calc(var(--text-xl)*0.65) !important;
	}
	
	.rwp-footer-kontaktdaten {
		gap: 0.5rem !important;
		min-width: fit-content !important;
	}
	
	.rwp-footer-adresse {
		min-width: 13rem !important;
	}
}

/**
 * Header
 **/
.rwp-main-menu .brx-submenu-toggle i.menu-item-icon {
	color: var(--primary) !important;
    font-size: 0.6em !important;
}

@media only screen and (min-width: 991px) {
  .rwp-main-menu .bricks-nav-menu li.menu-item a {
    position: relative;
  }

  .rwp-main-menu .bricks-nav-menu li.menu-item a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0%;
    height: 4px;
	margin-bottom: -4px;
    background: var(--primary);
    transition: width 0.3s ease-in-out;
  }
	
  .rwp-main-menu .bricks-nav-menu li.menu-item:hover a::after,
  .rwp-main-menu .bricks-nav-menu li.menu-item.current-menu-item a::after {
    width: 100%;
  }
}

#brx-header {
    z-index: 99999;
}

.rwp-header-upper--link {
	color: var(--text) !important;
    text-decoration-color: var(--text) !important;
}

/* Mega Menu */
.rwp-mega-menu a::after {
	content: "";
	display: none;
}

.rwp-mega-menu .rwp-mega-menu--links {
	transition: all .5s ease-in-out;
	text-decoration: none;
}

.rwp-mega-menu .rwp-mega-menu--links:hover {
	transform: translateX(0.2rem);
	transition: all .5s ease-in-out;
	text-decoration: underline;
}

.rwp-main-menu .menu-item-has-children.brx-has-megamenu button {
	display: none;
}

/**
 * Hero
 **/
.rwp-hero-video-start {
	filter: drop-shadow(-4px 4px 14px #00000025);
}

.rwp-videoplayer-btn,
.rwp-videoplayer-btn a,
.rwp-videoplayer-btn a:hover,
.rwp-videoplayer-btn div {
	text-decoration: none !important;
	text-underline-offset: none !important;
}

/**
 * Startseite Leistungen Kacheln
 **/
.rwp-leistungen-kachel {
	text-decoration: none !important;
}

.rwp-leistungen-kachel::before {
	transition: all .5s ease-in-out;
}

.rwp-leistungen-kachel:hover::before {
	background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
	transition: all .5s ease-in-out;
}

.rwp-leistungen-kachel--headline {
  opacity: 1;
  transform: translateY(1rem);
  transition: transform .4s ease;
  text-decoration: none !important;
}

.rwp-leistungen-kachel--mehr-link {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity .4s ease, transform .4s ease;
  pointer-events: none;
}

.rwp-leistungen-kachel:hover .rwp-leistungen-kachel--headline {
  transform: translateY(0);
}

.rwp-leistungen-kachel:hover .rwp-leistungen-kachel--mehr-link {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0.1s;
}

.rwp-leistungen-kachel .brxe-icon {
	transition: transform .8s ease;
}

.rwp-leistungen-kachel:hover .brxe-icon {
	transform: rotate(45deg);
	transition: transform .8s ease;
}

@media only screen and (max-width: 1800px) {
	.rwp-leistungen-kachel,
	#brxe-hwoghc {
		min-height: 26rem !important;
	}
}

@media only screen and (max-width: 1350px) {
	.rwp-leistungen-kachel,
	#brxe-hwoghc {
		min-height: 21rem !important;
	}
}

@media only screen and (max-width: 1350px) {
	.rwp-leistungen-kachel,
	#brxe-hwoghc {
		min-height: 21rem !important;
	}
}

/**
 * Rezensionen Slider
 **/
.rwp-rezension-slider .slider-content {
	display: flex;
    flex-direction: column;
	gap: 0.5rem;
}

.rwp-rezension-slider .slider-content .title {
	order: 2;
}

.rwp-rezension-slider .slider-content .content {
	order: 1;
}

@media only screen and (max-width: 1470px) {
	.rwp-massiv-empfohlen-badge {
		width: 9rem !important;
	}
}

@media only screen and (max-width: 991px) {
	.rwp-massiv-empfohlen-badge {
		width: 7rem !important;
	}
}

/**
 * Image Gallery
 **/
.rwp-image-gallery--img {
	overflow: hidden;
	transition: transform .8s ease;
}

.rwp-image-gallery--img:hover img {
	transform: scale(1.04);
	transition: transform .8s ease;
}

/**
 * Image Gallery
 **/
.rwp-partner-slider .rwp-partner-slider--img {
	filter: grayscale(1);
	transition: transform .8s ease;
}

.rwp-partner-slider .splide__slide,
.rwp-partner-slider .splide__slide:hover .rwp-partner-slider--img {
	filter: grayscale(0);
	transition: transform .8s ease;
}

/**
 * Modellhäuser Grid
 **/
.rwp-haeuser-grid-haus,
.rwp-haeuser-grid-haus .rwp-haeuser-grid-haus--titel {
	text-decoration: none !important;
}

.rwp-haeuser-grid-haus .rwp-haeuser-grid-haus--content {
	text-decoration: none !important;
	z-index: 2;
}

/*
.rwp-haeuser-grid-haus .rwp-haeuser-grid-haus--content::before {
	transition: all .5s ease-in-out;
}

.rwp-haeuser-grid-haus:hover .rwp-haeuser-grid-haus--content::before {
	background: rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px);
	transition: all .5s ease-in-out;
} */

.rwp-haeuser-grid-haus--content {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.rwp-haeuser-grid-haus--content::before {
    content: "";
    position: absolute;
    top: -20px;
    left: -20px;
    right: -20px;
    bottom: -20px;

    background-image: inherit;
    background-size: cover;
    background-position: center;

    filter: blur(0);
    transition: filter .4s ease;

    z-index: -1;
}

.rwp-haeuser-grid-haus:hover .rwp-haeuser-grid-haus--content::before {
    filter: blur(10px);
}

.rwp-haeuser-grid-haus .rwp-haeuser-grid-haus--content-link {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity .4s ease, transform .4s ease;
  pointer-events: none;
}

.rwp-haeuser-grid-haus:hover .rwp-haeuser-grid-haus--content .rwp-haeuser-grid-haus--content-link {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0.1s;
}

.rwp-haeuser-grid-haus--content .brxe-icon {
	transition: all .8s ease;
	opacity: 0;
}

.rwp-haeuser-grid-haus:hover .rwp-haeuser-grid-haus--content .brxe-icon {
	transform: rotate(45deg);
	transition: all .8s ease;
	opacity: 1;
}


/**
 * Burger Menu
 **/
.burger-toggle {
  width: 3rem;       
  height: 2.8rem;    
  position: relative;
  cursor: pointer;
  z-index: 1001;
}

/* Linien Grundzustand */
.burger-toggle::before,
.burger-toggle::after,
.burger-toggle div::before,
.burger-toggle div::after {
  content: "";
  position: absolute;
  right: 0;
  height: 3px;      
  background: #000;
  transition: all 0.4s ease;
  transform-origin: center center; /* wichtig für symmetrische Rotation */
}

/* Linien unterschiedlich lang im normalen Zustand */
.burger-toggle::before { top: 0; width: 90%; }    
.burger-toggle::after { top: 0.7rem; width: 75%; } 
.burger-toggle div::before { top: 1.4rem; width: 100%; } 
.burger-toggle div::after { top: 2.1rem; width: 65%; }  

/* Animation: X-Zustand */
.burger-toggle.active::before { 
  width: 100%;            
  transform: rotate(45deg) translate(0.0rem, 0.5rem); /* leicht verschieben für perfekte Mitte */
}
.burger-toggle.active::after { 
  width: 100%; 
  opacity: 0; 
}
.burger-toggle.active div::before { 
  width: 100%; 
  transform: rotate(-45deg) translate(0.5rem, -1rem); /* leicht verschieben für perfekte Mitte */
}
.burger-toggle.active div::after { 
  width: 100%; 
  opacity: 0; 
}

/**
 * Off Canvas
 **/
#brxe-pasdfo {
  text-decoration: none !important;
}

/**
 * List Style
 **/
.rwp-vorteile-list li {
	list-style-type: square;
}

.rwp-vorteile-list li::marker {
	font-size: 1.2em;
}

/**
 * Das Unternehmen: Leistungen Kacheln
 **/
.rwp-leistungen-beschreibung-box {
	text-decoration: none !important;
}

.rwp-leistungen-beschreibung-box::before {
    content: "";
    position: absolute;
    bottom: 0 !important;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgb(0 0 0 / 70%)) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    transition: all 0.5s ease-in-out;
}


/**
 * Unverbindliche Anfrage: Leistungen Kacheln
 **/
.rwp-leistung-kachel-anfrage {
	text-decoration: none !important;
}

.rwp-leistung-kachel-anfrage::before {
	transition: all .5s ease-in-out;
}

.rwp-leistung-kachel-anfrage:hover::before {
	background: rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
	transition: all .5s ease-in-out;
}

.rwp-leistung-kachel-anfrage .rwp-leistung-kachel-anfrage--headline {
  opacity: 1;
  transform: translateY(-1rem);
  transition: transform .4s ease;
  text-decoration: none !important;
}

.rwp-leistung-kachel-anfrage .rwp-leistung-kachel-anfrage--mehr-link {
  opacity: 0;
  transform: translateY(-2rem);
  transition: opacity .4s ease, transform .4s ease;
  pointer-events: none;
}

.rwp-leistung-kachel-anfrage:hover .rwp-leistung-kachel-anfrage--headline {
  transform: translateY(0);
}

.rwp-leistung-kachel-anfrage:hover .rwp-leistung-kachel-anfrage--mehr-link {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0.1s;
}

.rwp-leistung-kachel-anfrage .brxe-icon {
	transition: transform .8s ease;
}

.rwp-leistung-kachel-anfrage:hover .brxe-icon {
	transform: rotate(45deg);
	transition: transform .8s ease;
}


/**
 * Haus-Detailseite
 **/
.rwp-haus--aufzaehlung li {
	list-style-type: square;
}

.rwp-haus--aufzaehlung li::marker {
	font-size: 1.2em;
	color: var(--primary);
}

.brxe-text.rwp-haus--aufzaehlung > ul * + li {
    margin-block-start: 0.4rem;
}


/* Gallery-Container auswählen */
.brxe-image-gallery.rwp-haus--fotos-galerie {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

/* Erstes Bild über beide Spalten */
.brxe-image-gallery.rwp-haus--fotos-galerie .bricks-layout-item:nth-child(1) {
  grid-column: 1 / -1;
  aspect-ratio: 16/9;
}

/* Restliche Bilder quadratisch */
.brxe-image-gallery.rwp-haus--fotos-galerie .bricks-layout-item:nth-child(n+2) {
  aspect-ratio: 16/9;
}

/* Bilder auf 100% skalieren */
.brxe-image-gallery.rwp-haus--fotos-galerie img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Mobile Anpassung */
@media (max-width: 700px) {
  .brxe-image-gallery.rwp-haus--fotos-galerie {
    grid-template-columns: 1fr;
  }
  .brxe-image-gallery.rwp-haus--fotos-galerie .bricks-layout-item:nth-child(1) {
    grid-column: auto;
  }
}

/* Impressionen / Homestory Grid */
.rwp-referenz-grid-haus,
.rwp-referenz-grid-haus .rwp-referenz-grid-haus--titel {
	text-decoration: none !important;
}

.rwp-referenz-grid-haus .rwp-referenz-grid-haus--content {
	text-decoration: none !important;
	z-index: 2;
}

.rwp-referenz-grid-haus--content {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.rwp-referenz-grid-haus--content::before {
    content: "";
    position: absolute;
    top: -20px;
    left: -20px;
    right: -20px;
    bottom: -20px;

    background-image: inherit;
    background-size: cover;
    background-position: center;

    filter: blur(0);
    transition: filter .4s ease;

    z-index: -1;
}

.rwp-referenz-grid-haus:hover .rwp-referenz-grid-haus--content::before {
    filter: blur(10px);
}

.rwp-referenz-grid-haus .rwp-referenz-grid-haus--content-link {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity .4s ease, transform .4s ease;
  pointer-events: none;
}

.rwp-referenz-grid-haus:hover .rwp-referenz-grid-haus--content .rwp-referenz-grid-haus--content-link {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  transition-delay: 0.1s;
}

.rwp-referenz-grid-haus--content .brxe-icon {
	transition: all .8s ease;
	opacity: 0;
}

.rwp-referenz-grid-haus:hover .rwp-referenz-grid-haus--content .brxe-icon {
	transform: rotate(45deg);
	transition: all .8s ease;
	opacity: 1;
}


/*
 * STARTSEITE H1 ANPASSUNG
 * */
@media (min-width: 1700px) {
	#h1-startseite {
		font-size: calc(var(--h1)*1.5) !important;
		max-width: 44rem !important;
	}
}