/* ===================================================================================

* Theme Name: Rafter Child
* Theme URI: https://themejunction.net/wp/rafter/
* Author: ThemeJunction
* Author URI: https://themejunction.net/
* Description: Rafter is a Roofing Services WordPress Theme.
* Version: 1.0.0
* Template: rafter
* License: GNU General Public License version 3.0
* License URI: http://www.gnu.org/licenses/gpl-3.0.html

====================================================================================== */

/*
 * Glonti – Header Style 2 wie Rafter-Demo:
 * Weiße Navigation, Kontaktleiste nur Container-breit,
 * links/rechts transparent (Hero sichtbar), Leiste über Hero.
 */

header.header-1 {
	margin-bottom: -66px;
	background: transparent;
}

header.header-1.header-sticky {
	margin-bottom: 0;
}

/* Navigation + Dropdowns müssen über der Kontaktleiste liegen (z-index 10). */
header.header-1 .main__header {
	background-color: #fff;
	position: relative;
	z-index: 20;
	overflow: visible;
}

header.header-1 .header-contact-widget {
	position: relative;
	z-index: 10;
	background: transparent;
}

header.header-1 .logo img {
	max-height: 72px;
	width: auto;
}

header.header-1.header-sticky .logo img {
	max-height: 60px;
}

.hero-wrapper {
	position: relative;
	z-index: 1;
}

@media (max-width: 1199px) {
	header.header-1 {
		margin-bottom: 0;
	}
}

/* ===================================================================================
 * Glonti – USP Section „Was für uns spricht“
 * =================================================================================== */

.glonti-usp-section {
	padding: 80px 0;
	background-color: #2c3335;
}

.glonti-usp-section__title {
	margin: 0 0 60px;
	text-align: center;
	font-size: 36px;
	font-weight: 700;
	line-height: 1.2;
	text-transform: uppercase;
	color: #ffffff;
}

.glonti-usp-grid {
	display: flex;
	flex-direction: column;
	gap: 50px;
}

.glonti-usp-row {
	display: flex;
	justify-content: center;
	align-items: stretch;
}

.glonti-usp-row--top .glonti-usp-item,
.glonti-usp-row--bottom .glonti-usp-item {
	flex: 0 0 33.333%;
	max-width: 33.333%;
}

.glonti-usp-item {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 24px;
	padding: 0 40px;
}

.glonti-usp-item:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	width: 1px;
	height: 75%;
	background-color: rgba(255, 255, 255, 0.25);
	transform: translateY(-50%);
}

.glonti-usp-item__icon {
	flex: 0 0 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 70px;
}

.glonti-usp-item__icon img {
	display: block;
	max-width: 70px;
	height: auto;
}

.glonti-usp-item__icon i,
.glonti-usp-item__icon svg {
	font-size: 56px;
	color: #ffffff;
	fill: #ffffff;
}

.glonti-usp-item__content {
	flex: 1;
	min-width: 0;
}

.glonti-usp-item__title {
	margin: 0 0 12px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	text-transform: uppercase;
	color: #ffffff;
}

.glonti-usp-item__text {
	margin: 0;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.6;
	color: #ffffff;
}

@media (max-width: 991px) {
	.glonti-usp-section {
		padding: 60px 0;
	}

	.glonti-usp-section__title {
		margin-bottom: 40px;
		font-size: 28px;
	}

	.glonti-usp-grid {
		gap: 0;
	}

	.glonti-usp-row {
		flex-direction: column;
	}

	.glonti-usp-row--top .glonti-usp-item,
	.glonti-usp-row--bottom .glonti-usp-item {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.glonti-usp-item {
		padding: 30px 0;
	}

	.glonti-usp-item:not(:last-child)::after {
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: 1px;
		transform: none;
	}
}

/* ===================================================================================
 * Glonti – Testimonials Style 04: mehr Innenabstand, Anführungszeichen unverändert
 * =================================================================================== */

.elementor-widget-tj-testimonials-layout .testimonial-colored-cards .tj-testimonial-card__content,
.testimonial-wrapper.testimonial-colored-cards .tj-testimonial-card__content {
	padding: 32px 34px 28px;
}

.elementor-widget-tj-testimonials-layout .testimonial-colored-cards .tj-testimonial-card__footer,
.testimonial-wrapper.testimonial-colored-cards .tj-testimonial-card__footer {
	padding: 14px 34px;
}

/* Theme-CSS (3 Spalten) hat höhere Spezifität als tjcore – Breakpoints hier erzwingen */
@media (max-width: 991px) {
	.testimonial-wrapper.testimonial-colored-cards .testimonial-colored-cards__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.elementor-widget-tj-testimonials-layout .testimonial-colored-cards .tj-testimonial-card__content,
	.testimonial-wrapper.testimonial-colored-cards .tj-testimonial-card__content {
		padding: 26px 24px 22px;
	}

	.elementor-widget-tj-testimonials-layout .testimonial-colored-cards .tj-testimonial-card__footer,
	.testimonial-wrapper.testimonial-colored-cards .tj-testimonial-card__footer {
		padding: 12px 24px;
	}

	.testimonial-wrapper.testimonial-colored-cards .testimonial-colored-cards__grid {
		grid-template-columns: 1fr;
		gap: 18px;
	}
}

/* Glonti – Services Style 04: nur gleiche Kartenhöhe, Header unverändert */
.service-wrapper.service-3 .row:has(.single-service-2) {
	align-items: stretch;
}

.service-wrapper.service-3 .row:has(.single-service-2) > [class*="col-"] {
	display: flex;
	flex-direction: column;
}

.service-wrapper.service-3 .single-service-2 {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	width: 100%;
}

.service-wrapper.service-3 .single-service-2 .service-thumb {
	position: relative;
	z-index: 2;
}

.service-wrapper.service-3 .service-content {
	flex: 1 1 auto;
	margin-top: -50px;
}

.service-wrapper.service-3 .service-content .service-icon {
	margin-top: 0;
	position: relative;
	z-index: 10;
}
