/**
 * DGS katmanlı başlık.
 *
 * @package DGS_Elements
 */

.dgs-layered-heading {
	position: relative;
	overflow: hidden;
	padding: 1.5rem 0 2.5rem;
	font-family: var(
		--dgs-lh-font-family,
		system-ui,
		-apple-system,
		"Segoe UI",
		Roboto,
		"Helvetica Neue",
		Arial,
		sans-serif
	);
}

.dgs-layered-heading__inner {
	position: relative;
	display: block;
	min-height: 1px;
}

/* Hizalama: sol (varsayılan) */
.dgs-layered-heading--align-left .dgs-layered-heading__inner {
	text-align: left;
}

.dgs-layered-heading--align-left .dgs-layered-heading__bg {
	left: 0;
	right: auto;
}

/* Orta */
.dgs-layered-heading--align-center .dgs-layered-heading__inner {
	text-align: center;
}

.dgs-layered-heading--align-center .dgs-layered-heading__bg {
	left: 50%;
	right: auto;
	transform: translate(
		-50%,
		calc(-50% + var(--dgs-lh-bg-offset-y-mobile, 0px))
	);
}

/* Sağ */
.dgs-layered-heading--align-right .dgs-layered-heading__inner {
	text-align: right;
}

.dgs-layered-heading--align-right .dgs-layered-heading__bg {
	left: auto;
	right: 0;
}

/* Arka planda büyük filigran */
.dgs-layered-heading__bg {
	position: absolute;
	left: 0;
	top: 50%;
	z-index: 0;
	transform: translateY(
		calc(-50% + var(--dgs-lh-bg-offset-y-mobile, 0px))
	);
	margin: 0;
	padding: 0;
	font-weight: var(--dgs-lh-bg-fw, 700);
	line-height: var(--dgs-lh-bg-lh, 0.85);
	letter-spacing: var(--dgs-lh-bg-ls, 0.02em);
	text-transform: uppercase;
	color: var(--dgs-lh-bg, #f0f5f9);
	font-size: var(--dgs-lh-bg-size, clamp(4rem, 18vw, 14rem));
	pointer-events: none;
	user-select: none;
	white-space: nowrap;
}

.dgs-layered-heading__content {
	position: relative;
	z-index: 1;
	max-width: 100%;
}

.dgs-layered-heading__subtitle {
	margin: 0 0 0.35rem;
	padding: 0;
	font-size: var(--dgs-lh-sub-fs, 0.75rem);
	font-weight: var(--dgs-lh-sub-fw, 600);
	letter-spacing: var(--dgs-lh-sub-ls, 0.12em);
	line-height: var(--dgs-lh-sub-lh, normal);
	text-transform: uppercase;
	color: var(--dgs-lh-sub, #e68a4b);
}

.dgs-layered-heading__title {
	margin: 0;
	padding: 0;
	font-size: var(--dgs-lh-title-fs, clamp(1.75rem, 4vw, 2.75rem));
	font-weight: var(--dgs-lh-title-fw, 700);
	letter-spacing: var(--dgs-lh-title-ls, normal);
	line-height: var(--dgs-lh-title-lh, 1.15);
	color: var(--dgs-lh-title, #2e3159);
}

/* Masaüstü: filigran dikey kaydırma (--dgs-lh-bg-offset-y) */
@media (min-width: 768px) {
	.dgs-layered-heading__bg {
		transform: translateY(
			calc(-50% + var(--dgs-lh-bg-offset-y, 0px))
		);
	}

	.dgs-layered-heading--align-center .dgs-layered-heading__bg {
		transform: translate(
			-50%,
			calc(-50% + var(--dgs-lh-bg-offset-y, 0px))
		);
	}
}

@media (prefers-reduced-motion: reduce) {
	.dgs-layered-heading__bg {
		transform: translateY(
			calc(-50% + var(--dgs-lh-bg-offset-y-mobile, 0px))
		);
	}

	.dgs-layered-heading--align-center .dgs-layered-heading__bg {
		transform: translate(
			-50%,
			calc(-50% + var(--dgs-lh-bg-offset-y-mobile, 0px))
		);
	}

	@media (min-width: 768px) {
		.dgs-layered-heading__bg {
			transform: translateY(
				calc(-50% + var(--dgs-lh-bg-offset-y, 0px))
			);
		}

		.dgs-layered-heading--align-center .dgs-layered-heading__bg {
			transform: translate(
				-50%,
				calc(-50% + var(--dgs-lh-bg-offset-y, 0px))
			);
		}
	}
}
