/*!
 * A&A Forgacs Muhelye - Rolunk (295) es Munkaink (293) kiegeszitesek
 *
 * Csak azt fedi le, amit Elementor kontrollokkal nem, vagy csak korulmenyesen
 * lehetne beallitani: kephely-kitoltes, hajszalvonalas ertekracs, kozepre
 * zart fejlecek, vilagos szekcio gombjai.
 *
 * Szinek: kizarolag Kit-tokenek, illetve a szovegtokenbol szarmaztatott
 * attetszo hajszalvonalak. Egyetlen kivetel a #9A7842 ("arany vilagos
 * hatteren"), amire a vilagos szekcioban a kontraszt miatt van szukseg -
 * a Kit #B88A4A tokene ott 2,2:1 kontrasztot adna, ami olvashatatlan.
 */

/* =========================================================
 * KEPHELYEK
 * Ures Elementor Image widget -> a plugin sajat placeholder
 * kepe latszik, tehat egyertelmuen felismerheto, hova kell
 * kesobb fotot tenni. A keret adja a terv szerinti meretet;
 * a beillesztett foto object-fit: cover-rel tolti ki.
 * ========================================================= */

.aa-slot-wrap {
	position: relative;
	overflow: hidden;
}

.aa-slot-wrap > .aa-photo-slot--fill {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
}

.aa-photo-slot--fill .elementor-widget-container,
.aa-photo-slot--fill figure,
.aa-photo-slot--fill a {
	display: block;
	width: 100%;
	height: 100%;
}

.aa-photo-slot--fill img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	object-position: center center;
}

/* Amig nincs benne foto: halvany keret + felirat, hogy a szerkesztoben
   es a fronton is egyertelmu legyen, hogy ez egy kesobb kitoltendo hely. */
.aa-slot-wrap {
	background: var(--e-global-color-primary, #1E1612);
	box-shadow: inset 0 0 0 1px rgba(243, 238, 231, 0.12);
}

/* =========================================================
 * ROLUNK - hero sor
 * ========================================================= */

.aa-hero-row {
	width: 100%;
}

/* =========================================================
 * ROLUNK - hajszalvonalas ertekracs (01 / 02 / 03)
 * A kulso konteener hattere adja az 1px-es elvalasztokat,
 * a cellak sajat sotet hattere pedig "kivagja" azokat.
 * ========================================================= */

@media (max-width: 767px) {
	/* Mobilon egymas ala kerulnek, igy a fuggoleges vonal is jol mukodik. */
	.aa-hero-row {
		flex-direction: column;
	}
}

/* =========================================================
 * KOZEPRE ZART FEJLECEK
 * ========================================================= */

.aa-center-head {
	max-width: 660px;
	margin-left: auto;
	margin-right: auto;
}

/* =========================================================
 * MUNKAINK - "Latvanyterv / Megvalosult" jelolo
 * ========================================================= */

.aa-badge-wrap {
	position: relative;
}

.aa-badge {
	pointer-events: none;
}

/* =========================================================
 * VILAGOS ZARO SZEKCIO
 * A vilagos hatteren a Kit aranya tul alacsony kontrasztot adna,
 * ezert a gombok sotet toltessel / sotetzold-barna kerettel jelennek meg.
 * ========================================================= */

.aa-light-cta .elementor-button,
.aa-light-cta .elementor-button-link {
	transition: background-color 0.22s ease, color 0.22s ease, border-color 0.22s ease;
}

.aa-light-cta .elementor-widget-button:first-child .elementor-button:hover {
	background-color: #2A211C;
}

.aa-light-cta .elementor-widget-button:last-child .elementor-button:hover {
	background-color: rgba(154, 120, 66, 0.14);
}

/* =========================================================
 * RESZPONZIV FINOMHANGOLAS
 * ========================================================= */

@media (max-width: 1024px) {
	.aa-center-head {
		max-width: 100%;
	}
}

@media (max-width: 767px) {
	.aa-light-cta {
		width: 100%;
	}

	.aa-light-cta .elementor-widget-button,
	.aa-light-cta .elementor-button {
		width: 100%;
	}

	.aa-light-cta .elementor-button {
		justify-content: center;
	}

	.aa-badge {
		font-size: 10px !important;
	}
}

/* Amig az Elementor sajat placeholder kepe van a helyen, egyertelmu felirat
   jelzi, hogy ide kesobb foto kerul. Amint valodi kepet valasztasz a
   widgetben, a felirat automatikusan eltunik. */
.aa-slot-wrap:has(img[src*='assets/images/placeholder'])::after {
	content: 'K\00c9PHELY \2013\00a0 ide ker\00fcl a fot\00f3';
	position: absolute;
	inset: auto 0 0 0;
	z-index: 3;
	padding: 14px 16px;
	font-family: 'Montserrat', sans-serif;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	color: rgba(243, 238, 231, 0.62);
	background: rgba(15, 11, 9, 0.72);
	pointer-events: none;
}

.aa-slot-wrap:has(img[src*='assets/images/placeholder']) img {
	opacity: 0.25;
}