.upau-section,
.upau-section * {
	box-sizing: border-box;
}

.upau-section {
	--upau-bg: #000;
	--upau-text: #f5f7fa;
	--upau-muted: #a4aab3;
	--upau-accent: #1473e6;
	--upau-decor: #17191d;
	--upau-max: 1520px;
	--upau-image-width-desktop: 35%;
	--upau-image-width-tablet: 100%;
	--upau-image-width-mobile: 100%;
	--upau-image-horizontal: 100%;
	--upau-image-vertical: 100%;
	--upau-radius: 42px;
	--upau-image-border-width: 2px;
	--upau-image-border-color: #fff;
	--upau-text-pad-x: 0px;
	--upau-text-pad-y: 0px;
	--upau-text-pad-tablet-x: 0px;
	--upau-text-pad-tablet-y: 0px;
	--upau-text-pad-mobile-x: 0px;
	--upau-text-pad-mobile-y: 0px;
	--upau-media-content-gap-desktop: 64px;
	--upau-media-content-gap-tablet: 44px;
	--upau-media-content-gap-mobile: 32px;
	--upau-bottom-content-gap-desktop: 12px;
	--upau-bottom-content-gap-tablet: 10px;
	--upau-bottom-content-gap-mobile: 8px;
	--upau-counter-1-gap-desktop: 64px;
	--upau-counter-1-gap-tablet: 44px;
	--upau-counter-2-gap-desktop: 64px;
	--upau-counter-2-gap-tablet: 44px;
	--upau-pad: 88px;
	--upau-pad-mobile: 54px;
	--upau-scale: 1;
	--upau-inverse-width: 100%;
	--upau-scaled-max: 1520px;
	--upau-gutter-desktop: 48px;
	--upau-gutter-tablet: 36px;
	--upau-gutter-mobile: 28px;
	position: relative;
	isolation: isolate;
	width: 100%;
	margin: 0;
	padding: var(--upau-pad) 0;
	overflow-x: clip;
	overflow-y: visible;
	background: var(--upau-bg);
	color: var(--upau-text);
	line-height: 1.6;
}

.upau-section--full {
	width: 100%;
	max-width: none;
	box-shadow: none !important;
	clip-path: none;
}

/* Frontendde yalnızca görselin kendi çerçevesi kalır. */
.upau-section,
.upau-shell,
.upau-top,
.upau-media,
.upau-media__frame,
.upau-content,
.upau-counters,
.upau-counter,
.upau-bottom-wrap,
.upau-bottom__merged {
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
}

.upau-shell {
	position: relative;
	z-index: 1;
	width: min(calc(var(--upau-inverse-width) - var(--upau-gutter-desktop)), var(--upau-scaled-max));
	margin: 0 auto;
	zoom: var(--upau-scale);
}

.upau-top {
	display: grid;
	grid-template-columns: minmax(0, var(--upau-image-width-desktop)) minmax(0, 1fr);
	align-items: center;
	gap: var(--upau-media-content-gap-desktop);
}

.upau-media {
	position: relative;
	min-width: 0;
	padding: 0;
	box-shadow: none !important;
	filter: none !important;
}

.upau-media__decor {
	display: none !important;
}

.upau-media__frame {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 1.055 / 1;
	overflow: visible;
	background: transparent;
	box-shadow: none !important;
	filter: none !important;
}

.upau-media__clip {
	position: relative;
	display: block;
	width: var(--upau-image-horizontal);
	height: var(--upau-image-vertical);
	max-width: 100%;
	max-height: 100%;
	margin: auto;
	overflow: hidden !important;
	border: 0 !important;
	border-radius: var(--upau-radius) !important;
	background: transparent !important;
	box-shadow: none !important;
	filter: none !important;
	-webkit-mask-image: -webkit-radial-gradient(white, black);
}

/* Kenarlık görselin üstüne bindirilir; böylece resim ile çerçeve arasında arka plan boşluğu oluşmaz. */
.upau-media__clip::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	border: var(--upau-image-border-width) solid var(--upau-image-border-color) !important;
	border-radius: inherit !important;
	box-sizing: border-box;
	box-shadow: none !important;
}

.upau-media__image,
.upau-media__video {
	position: absolute !important;
	inset: 0 !important;
	z-index: 1;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	min-width: 100% !important;
	min-height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: inherit !important;
	box-shadow: none !important;
	filter: none !important;
	object-fit: cover !important;
	object-position: center center !important;
}

.upau-content {
	min-width: 0;
	width: 100%;
	max-width: 100%;
	padding: var(--upau-text-pad-y) var(--upau-text-pad-x);
}

.upau-section .upau-eyebrow,
.upau-section .upau-heading,
.upau-section .upau-description,
.upau-section .upau-description p,
.upau-section .upau-counter__title,
.upau-section .upau-bottom__heading,
.upau-section .upau-bottom__text,
.upau-section .upau-bottom__text p {
	margin-top: 0;
	overflow-wrap: anywhere;
}

.upau-section .upau-eyebrow {
	margin-bottom: clamp(18px, 2vw, 28px);
	color: var(--upau-eyebrow-color, var(--upau-accent));
	font-family: var(--upau-eyebrow-font, Arial, sans-serif);
	font-size: clamp(var(--upau-eyebrow-size-min, 13px), 1.25vw, var(--upau-eyebrow-size, 21px));
	font-weight: var(--upau-eyebrow-weight, 800);
	letter-spacing: .02em;
	line-height: 1.25;
	text-transform: uppercase;
}

.upau-section .upau-heading {
	margin-bottom: clamp(22px, 3vw, 36px);
	color: var(--upau-heading-color, var(--upau-text));
	font-family: var(--upau-heading-font, Arial, sans-serif);
	font-size: clamp(var(--upau-heading-size-min, 45px), 4.25vw, var(--upau-heading-size, 72px));
	font-weight: var(--upau-heading-weight, 800);
	letter-spacing: -.035em;
	line-height: 1.18;
}

.upau-section .upau-description {
	max-width: 880px;
	margin-bottom: clamp(38px, 4vw, 60px);
	color: var(--upau-description-color, var(--upau-muted));
	font-family: var(--upau-description-font, Arial, sans-serif);
	font-size: clamp(var(--upau-description-size-min, 15px), 1.45vw, var(--upau-description-size, 24px));
	font-weight: var(--upau-description-weight, 400);
	line-height: 1.72;
}

.upau-section .upau-description > :last-child,
.upau-section .upau-bottom__text > :last-child {
	margin-bottom: 0;
}

.upau-section .upau-description a,
.upau-section .upau-bottom__text a {
	color: var(--upau-accent);
}

.upau-counters {
	display: grid;
	gap: clamp(24px, 2.8vw, 42px);
}

.upau-counter {
	display: grid;
	grid-template-columns: minmax(185px, .85fr) minmax(0, 1.15fr);
	align-items: center;
	min-width: 0;
}

.upau-counter--counter-1 {
	column-gap: var(--upau-counter-1-gap-desktop);
}

.upau-counter--counter-2 {
	column-gap: var(--upau-counter-2-gap-desktop);
}

.upau-counter__value-wrap {
	min-width: 0;
	padding-right: 0;
}

.upau-section .upau-counter__value {
	display: block;
	max-width: 100%;
	color: var(--upau-counter-value-color, var(--upau-text));
	font-family: var(--upau-counter-value-font, Arial, sans-serif);
	font-size: clamp(var(--upau-counter-value-size-min, 43px), 4.6vw, var(--upau-counter-value-size, 74px));
	font-variant-numeric: tabular-nums lining-nums;
	font-weight: var(--upau-counter-value-weight, 800);
	letter-spacing: -.045em;
	line-height: 1;
	overflow-wrap: anywhere;
}

.upau-section .upau-counter__title {
	min-width: 0;
	margin-bottom: 0;
	padding: 2px 0;
	color: var(--upau-counter-title-color, var(--upau-text));
	font-family: var(--upau-counter-title-font, Arial, sans-serif);
	font-size: clamp(var(--upau-counter-title-size-min, 15px), 1.45vw, var(--upau-counter-title-size, 24px));
	font-weight: var(--upau-counter-title-weight, 700);
	line-height: 1.45;
}

.upau-bottom-wrap {
	width: 100%;
	max-width: 100%;
	margin-top: var(--upau-bottom-content-gap-desktop);
	padding: var(--upau-text-pad-y) var(--upau-text-pad-x);
}

.upau-bottom__merged {
	width: 100%;
	margin-top: clamp(30px, 3vw, 48px);
	padding-top: clamp(22px, 2.5vw, 38px);
}

.upau-bottom__merged--only {
	margin-top: 0;
	padding-top: 0;
}

.upau-section .upau-bottom__heading,
.upau-section .upau-bottom__text {
	color: var(--upau-bottom-color, var(--upau-muted));
	font-family: var(--upau-bottom-font, Arial, sans-serif);
	font-size: clamp(var(--upau-bottom-size-min, 14px), 1.3vw, var(--upau-bottom-size, 22px));
	font-weight: var(--upau-bottom-weight, 400);
}

.upau-section .upau-bottom__heading {
	margin-bottom: 14px;
	line-height: 1.3;
}

.upau-section .upau-bottom__text {
	line-height: 1.72;
}

.upau-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

@media (max-width: 1100px) {
	.upau-top {
		gap: var(--upau-media-content-gap-desktop);
	}

	.upau-counter {
		grid-template-columns: minmax(150px, .9fr) minmax(0, 1.1fr);
	}
}

@media (max-width: 820px) {
	.upau-section {
		padding: var(--upau-pad-mobile) 0;
	}

	.upau-shell {
		width: min(calc(var(--upau-inverse-width) - var(--upau-gutter-tablet)), var(--upau-scaled-max));
	}

	.upau-top {
		grid-template-columns: 1fr;
		gap: var(--upau-media-content-gap-tablet);
	}

	.upau-media {
		width: var(--upau-image-width-tablet);
		max-width: 100%;
		margin-inline: auto;
	}

	.upau-media__frame,
	.upau-media__clip,
	.upau-media__image,
.upau-media__video {
		max-width: 100% !important;
	}

	.upau-content,
	.upau-bottom-wrap {
		min-width: 0;
		width: 100%;
		max-width: 100%;
		padding: var(--upau-text-pad-tablet-y) var(--upau-text-pad-tablet-x);
	}

	.upau-bottom-wrap {
		margin-top: var(--upau-bottom-content-gap-tablet);
	}

	.upau-counter--counter-1 {
		column-gap: var(--upau-counter-1-gap-tablet);
	}

	.upau-counter--counter-2 {
		column-gap: var(--upau-counter-2-gap-tablet);
	}

	.upau-section .upau-eyebrow {
		font-size: min(var(--upau-eyebrow-size, 21px), clamp(12px, 3.4vw, 20px));
	}

	.upau-section .upau-heading {
		font-size: min(var(--upau-heading-size, 72px), clamp(30px, 8.6vw, 56px));
		line-height: 1.14;
	}

	.upau-section .upau-description {
		font-size: min(var(--upau-description-size, 24px), clamp(14px, 3.6vw, 21px));
	}

	.upau-section .upau-counter__value {
		font-size: min(var(--upau-counter-value-size, 74px), clamp(38px, 10vw, 68px));
	}

	.upau-section .upau-counter__title {
		font-size: min(var(--upau-counter-title-size, 24px), clamp(14px, 3.6vw, 21px));
	}
}

@media (max-width: 480px) {
	/*
	 * Mobilde CSS zoom + ters genişlik hesabı bazı tarayıcı/tema kombinasyonlarında
	 * içeriği sağa taşıyabiliyor. Mobilde gerçek viewport genişliği kullanılır;
	 * admin padding değeri korunur ancak ekranı daraltıp metni kesemeyecek kadar
	 * responsive olarak sınırlandırılır.
	 */
	.upau-shell {
		zoom: 1;
		width: calc(100% - var(--upau-gutter-mobile));
		max-width: calc(100% - var(--upau-gutter-mobile));
		margin-left: auto;
		margin-right: auto;
		padding: 0;
		overflow: visible;
	}

	.upau-top {
		width: 100%;
		max-width: 100%;
		gap: var(--upau-media-content-gap-mobile);
	}

	/*
	 * Telefonlarda görsel hiçbir zaman viewport dışına taşmaz. Admin'deki mobil
	 * genişlik değeri istenen genişlik olarak korunur; görünür genişlik telefonun
	 * güvenli içerik alanına otomatik olarak sınırlandırılır ve merkezlenir.
	 */
	.upau-media {
		position: relative;
		left: auto;
		width: min(var(--upau-image-width-mobile), 100%);
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		padding-left: clamp(6px, 2.8vw, 14px);
		padding-right: clamp(6px, 2.8vw, 14px);
		transform: none;
	}

	.upau-top,
	.upau-content,
	.upau-counters,
	.upau-counter,
	.upau-counter__value-wrap,
	.upau-bottom-wrap,
	.upau-bottom__merged {
		min-width: 0;
		max-width: 100%;
	}

	/* Mobil otomatik sağ-sol padding yukarıdaki .upau-media kuralında korunur. */

	/* Mobilde sabit en-boy oranı ve cover kırpması kaldırılır. */
	.upau-media__frame {
		display: block;
		width: 100%;
		max-width: 100%;
		height: auto;
		margin-inline: auto;
		aspect-ratio: auto;
	}

	.upau-media__clip {
		display: block;
		width: 100%;
		height: auto;
		max-width: 100%;
		max-height: none;
		margin-inline: auto !important;
	}

	.upau-media__image,
.upau-media__video {
		position: static !important;
		inset: auto !important;
		display: block !important;
		width: 100% !important;
		height: auto !important;
		min-width: 0 !important;
		min-height: 0 !important;
		max-width: 100% !important;
		max-height: none !important;
		margin-inline: auto !important;
		object-fit: contain !important;
		object-position: center center !important;
	}

	.upau-content,
	.upau-bottom-wrap {
		min-width: 0;
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding-top: var(--upau-text-pad-mobile-y);
		padding-bottom: var(--upau-text-pad-mobile-y);
		padding-left: min(var(--upau-text-pad-mobile-x), 12vw);
		padding-right: min(var(--upau-text-pad-mobile-x), 12vw);
		overflow: visible;
	}

	.upau-bottom-wrap {
		margin-top: var(--upau-bottom-content-gap-mobile);
	}

	.upau-section .upau-eyebrow,
	.upau-section .upau-heading,
	.upau-section .upau-description,
	.upau-section .upau-description p,
	.upau-section .upau-counter__value,
	.upau-section .upau-counter__title,
	.upau-section .upau-bottom__heading,
	.upau-section .upau-bottom__text,
	.upau-section .upau-bottom__text p {
		min-width: 0;
		width: 100%;
		max-width: 100%;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		text-indent: 0 !important;
		transform: none !important;
		white-space: normal !important;
		overflow: visible !important;
		overflow-wrap: anywhere;
		word-break: break-word;
	}

	.upau-description > *,
	.upau-bottom__text > * {
		max-width: 100%;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.upau-section .upau-heading {
		font-size: min(var(--upau-heading-size, 72px), clamp(28px, 9vw, 44px));
	}

	.upau-section .upau-description {
		font-size: min(var(--upau-description-size, 24px), clamp(14px, 4vw, 19px));
	}

	/* Mobile mevcut responsive sayı/başlık aralığını korur; Desktop/Tablet sayaç boşluk ayarlarından etkilenmez. */
	.upau-counter {
		grid-template-columns: minmax(0, 1fr);
		gap: 13px;
		width: 100%;
		max-width: 100%;
	}

	.upau-counter__value-wrap {
		padding-right: 0;
	}

	.upau-section .upau-counter__value {
		font-size: min(var(--upau-counter-value-size, 74px), clamp(34px, 11vw, 52px));
	}

	.upau-section .upau-counter__title {
		padding: 0;
		font-size: min(var(--upau-counter-title-size, 24px), clamp(14px, 4vw, 19px));
	}

	.upau-section .upau-bottom__heading,
	.upau-section .upau-bottom__text {
		font-size: min(var(--upau-bottom-size, 22px), clamp(14px, 4vw, 19px));
	}
}

@media (prefers-reduced-motion: reduce) {
	.upau-section *,
	.upau-section *::before,
	.upau-section *::after {
		scroll-behavior: auto !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}
