.az-appscreen { display: none; }

@media (max-width: 767px) {

	body.home .az-mobile-tabs.az-mobile-tabbar {
		display: none !important;
	}


	body.home .az-appscreen {
		padding-top: calc(max(10px, env(safe-area-inset-top)) + 70px) !important;
	}

	body.home #primary.az-mobile-main {
		display: block !important;
		width: 100%;
		max-width: none;
		margin: 0;
		padding: 0;
	}

	body.home #primary.az-mobile-main > :not(.az-appscreen) {
		display: none !important;
	}

	html,
	body.home {
		min-width: 0;
		overflow: hidden;
	}


	html body.home.az-mobile-app,
	html:not([data-theme="dark"]) body.home.az-mobile-app {
		min-height: 100vh !important;
		min-height: 100svh !important;
		min-height: 100dvh !important;
	}

	body.home .az-appscreen {

		--m-bg: var(--azm-bg);
		--m-surface: var(--azm-surface);
		--m-surface2: var(--azm-surface2);
		--m-line: var(--azm-line);
		--m-line2: var(--azm-line2);
		--m-text: var(--azm-ink);
		--m-muted: var(--azm-muted);
		--m-brand: var(--azm-brand);
		--m-brand-ink: var(--azm-brand-ink);
		--m-tint: var(--azm-tint);
		--m-nav: var(--azm-nav-bg);
		--m-press: var(--azm-press);
		--m-glide: var(--azm-glide);


		--m-badge-bg: var(--m-brand);
		--m-badge-ink: var(--m-brand-ink);
		--m-badge-border: transparent;
		--m-badge-border-w: 0;

		--m-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif;

		position: fixed;
		inset: 0;
		z-index: var(--az-layer-content, 1);
		display: flex;
		flex-direction: column;
		width: 100%;

		min-height: 0;
		max-width: 560px;
		margin-inline: auto;
		overflow: hidden;
		background: var(--m-bg);
		color: var(--m-text);
		font-family: var(--m-font);
		-webkit-font-smoothing: antialiased;
	}

	html[data-theme="dark"] body.home .az-appscreen {
		--m-badge-bg: transparent;
		--m-badge-ink: var(--m-brand);
		--m-badge-border: var(--m-brand);
		--m-badge-border-w: 2px;

	}

	@media (prefers-color-scheme: dark) {
		html:not([data-theme="light"]):not([data-theme="dark"]) body.home .az-appscreen {
			--m-badge-bg: transparent;
			--m-badge-ink: var(--m-brand);
			--m-badge-border: var(--m-brand);
			--m-badge-border-w: 2px;

		}
	}

	.az-appscreen *,
	.az-appscreen *::before,
	.az-appscreen *::after { box-sizing: border-box; }

	.az-appscreen a,
	.az-appscreen button { -webkit-tap-highlight-color: transparent; }













	.az-appscreen__content {
		position: relative;
		z-index: 1;
		display: grid;

		grid-template-columns: minmax(0, 1fr);

		grid-template-rows: minmax(0, 1fr) auto auto auto auto;
		align-content: stretch;
		row-gap: clamp(8px, 1.5dvh, 13px);
		flex: 1 1 auto;
		min-height: 0;
		overflow: hidden;
		padding: 0 14px 6px;
		overscroll-behavior: none;
	}


	.az-appscreen__hero {
		position: relative;
		display: flex;
		flex-direction: column;

		min-height: 0;

		max-height: 34dvh;
		min-width: 0;
		padding: 15px 17px;
		overflow: hidden;
		border-radius: var(--azm-r-lg, 20px);

	}



	.az-appscreen__hero::before {
		content: "";
		position: absolute;
		z-index: 0;
		inset: 0;
		pointer-events: none;
		background: url("../../demo-content/home-visuals/urfa-ayran-mobile-960.webp") 55% 0 / auto 190% no-repeat;
	}


	.az-appscreen__hero::after {
		content: "";
		position: absolute;
		z-index: 1;
		inset: 0;
		pointer-events: none;
		background: linear-gradient(96deg, var(--m-bg) 0, var(--m-bg) 18%, transparent 74%);
	}


	html[data-theme="dark"] .az-appscreen__hero::after,
	html:not([data-theme="light"]):not([data-theme="dark"]) .az-appscreen__hero::after {
		background:
			linear-gradient(96deg, var(--m-bg) 0, var(--m-bg) 18%, transparent 74%),
			rgba(0, 0, 0, .42);
	}

	.az-appscreen__hero-copy {
		position: relative;
		z-index: 2;
		display: flex;
		flex-direction: column;

		max-width: 58%;
		min-width: 0;
		height: 100%;
	}


	.az-appscreen .az-appscreen__eyebrow {
		display: flex;
		align-items: center;
		gap: 5px;

		margin: 0 0 auto;
		color: var(--m-text);
		font-size: 10.2px;
		font-weight: 800;
		letter-spacing: .035em;
		white-space: nowrap;
	}

	.az-appscreen__eyebrow svg { flex: 0 0 auto; width: 13px; height: 13px; color: var(--m-brand); }

	.az-appscreen .az-appscreen__kicker {
		margin: 0 0 2px;
		color: var(--m-text);
		font-size: 13px;
		font-weight: 600;
		letter-spacing: 0;
	}

	.az-appscreen .az-appscreen__title {
		display: block;
		width: auto;
		margin: 0;
		color: var(--m-text);
		font-size: 41px;
		font-weight: 800;
		letter-spacing: -.03em;
		line-height: 1.02;
	}


	.az-appscreen .az-appscreen__title em {
		display: block;
		color: var(--m-brand);
		font-style: normal;
		font-weight: inherit;
	}

	.az-appscreen .az-appscreen__lede {
		margin: 7px 0 0;
		color: var(--m-muted);
		font-size: 12.5px;
		font-weight: 500;
		line-height: 1.3;
	}

	.az-appscreen__rule {
		display: block;
		width: 30px;
		height: 3px;
		margin-top: 10px;
		border-radius: 2px;
		background: var(--m-brand);
	}


	.az-appscreen__cards {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 11px;
	}

	.az-appscreen__card {
		position: relative;
		display: flex;
		flex-direction: column;
		gap: 11px;
		min-width: 0;
		padding: 13px;
		border: 1px solid var(--m-line);
		border-radius: var(--azm-r-md, 16px);
		background: var(--m-surface);
		color: var(--m-text);
		text-decoration: none;
		transition: transform .12s var(--m-press);
	}

	.az-appscreen__card:active { transform: scale(.96); }

	.az-appscreen__card-badge {
		flex: 0 0 auto;
		display: grid;
		place-items: center;
		width: 46px;
		height: 46px;
		border-radius: 50%;
	}

	.az-appscreen__card--points .az-appscreen__card-badge {
		border: var(--m-badge-border-w) solid var(--m-badge-border);
		background: var(--m-badge-bg);
		color: var(--m-badge-ink);
	}

	.az-appscreen__card-badge--logo {
		overflow: hidden;
		border: 1px solid var(--m-line2);
		background: var(--m-surface2);
	}

	.az-appscreen__card-badge--logo img { width: 100%; height: 100%; object-fit: cover; }


	.az-appscreen__card-tag {
		position: absolute;
		top: -9px;
		right: 11px;
		padding: 3px 7px;
		border: 1px solid var(--m-brand);
		border-radius: 999px;
		background: var(--m-surface);
		color: var(--m-brand);
		font-size: 8.5px;
		font-weight: 800;
		letter-spacing: .02em;
		line-height: 1.3;
		white-space: nowrap;
	}

	.az-appscreen .az-appscreen__card-title {
		margin: 0;
		color: var(--m-text);
		font-size: 13px;
		font-weight: 750;
		line-height: 1.16;
	}

	.az-appscreen__card-desc {
		margin-top: -6px;
		color: var(--m-muted);
		font-size: 12.5px;
		font-weight: 500;
		line-height: 1.2;
	}

	.az-appscreen__card-desc i {
		color: var(--m-brand);
		font-style: normal;
		font-weight: 800;
	}

	.az-appscreen__card-cta {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 6px;

		margin-top: auto;
		width: 100%;
		min-height: 32px;
		padding: 6px 11px;
		border: 1px solid var(--m-line2);
		border-radius: 999px;
		background: var(--m-surface2);
		color: var(--m-text);
		font-size: 12px;
		font-weight: 650;
		white-space: nowrap;
	}

	.az-appscreen__card-cta svg { flex: 0 0 auto; width: 15px; height: 15px; }


	.az-appscreen__heading-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
	}


	.az-appscreen .az-appscreen__heading {
		margin: 0;
		color: var(--m-text);
		font-size: 17px;
		font-weight: 750;
		letter-spacing: -.02em;
	}

	.az-appscreen__all {
		display: flex;
		align-items: center;
		gap: 3px;
		color: var(--m-muted);
		font-size: 12.5px;
		font-weight: 600;
		text-decoration: none;
		white-space: nowrap;
	}

	.az-appscreen__all svg { width: 15px; height: 15px; }

	.az-appscreen__grid {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.az-appscreen__cat {
		display: flex;
		align-items: center;
		gap: 9px;
		min-width: 0;
		padding: 12px 11px;
		border: 1px solid var(--m-line);
		border-radius: var(--azm-r-sm, 13px);
		background: var(--m-surface);
		color: var(--m-text);
		text-decoration: none;
		transition: transform .12s var(--m-press);
	}

	.az-appscreen__cat:active { transform: scale(.96); }

	.az-appscreen__cat > svg {
		flex: 0 0 auto;
		width: 25px;
		height: 25px;
		color: var(--m-brand);
		stroke-width: 2;
	}


	.az-appscreen__cat-copy {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		min-width: 0;
	}

	.az-appscreen__cat-copy strong {
		min-width: 0;
		overflow: hidden;
		color: var(--m-text);
		font-size: 12.5px;
		font-weight: 700;
		line-height: 1.2;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.az-appscreen__cat-copy small {
		min-width: 0;
		overflow: hidden;
		color: var(--m-muted);
		font-size: 10.5px;
		font-weight: 500;
		line-height: 1.3;
		text-overflow: ellipsis;
		white-space: nowrap;
	}


	.az-appscreen__actions {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 11px;
	}

	.az-appscreen__btn {
		display: flex;
		align-items: center;
		gap: 8px;
		min-width: 0;
		height: 54px;
		padding: 0 12px;
		border: 1px solid transparent;
		border-radius: var(--azm-r-sm, 13px);
		font-size: 13.5px;
		font-weight: 700;
		text-decoration: none;
		white-space: nowrap;
		transition: transform .12s var(--m-press);
	}

	.az-appscreen__btn:active { transform: scale(.96); }

	.az-appscreen__btn > svg:first-child { flex: 0 0 auto; width: 20px; height: 20px; }
	.az-appscreen__btn > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

	.az-appscreen__btn > svg:last-child { flex: 0 0 auto; width: 18px; height: 18px; margin-left: auto; }


	.az-appscreen__btn--primary {
		background: var(--azm-fill);
		color: var(--azm-fill-ink);
	}

	.az-appscreen__btn--secondary {
		border-color: var(--m-brand);
		background: var(--m-surface);
		color: var(--m-text);
	}

	.az-appscreen__btn--secondary > svg { color: var(--m-brand); }


	.az-appscreen__tabwrap {
		position: relative;
		z-index: 9;
		flex: 0 0 auto;
		padding: 0;
	}

	.az-appscreen__tabs {
		display: grid;

		grid-auto-flow: column;
		grid-auto-columns: minmax(0, 1fr);
		align-items: stretch;
		padding: 7px 6px calc(env(safe-area-inset-bottom) + 7px);
		border-top: 1px solid var(--m-line);
		border-radius: 18px 18px 0 0;
		background: var(--m-nav);
		-webkit-backdrop-filter: blur(20px) saturate(180%);
		backdrop-filter: blur(20px) saturate(180%);
	}

	.az-appscreen__tab {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		min-width: 0;
		min-height: 52px;
		border-radius: 13px;
		color: var(--m-muted);
		font-size: 10.5px;
		font-weight: 600;
		line-height: 1.15;
		text-decoration: none;
		transition: transform .12s var(--m-press);
	}

	.az-appscreen__tab:active { transform: scale(.92); }


	button.az-appscreen__tab {
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		font-family: inherit;
		cursor: pointer;
	}

	.az-appscreen__tab > span {
		max-width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}


	.az-appscreen__tab--wa { display: none; }
	body:has(.anzelha-whatsapp.whatsapp-trigger.mobile-1) .az-appscreen__tab--wa { display: flex; }

	.az-appscreen__tab svg { width: 24px; height: 24px; }


	.az-appscreen__tab[aria-current="page"] {
		background: var(--m-tint);
		color: var(--m-brand);
		font-weight: 750;
	}

	.az-appscreen a:focus-visible,
	.az-appscreen button:focus-visible {
		outline: 3px solid var(--m-brand);
		outline-offset: 3px;
	}


	@media (prefers-color-scheme: dark) {
	}

	@supports not ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
		.az-appscreen__tabs { background: var(--m-surface); }
	}

	@media (prefers-reduced-transparency: reduce) {
		.az-appscreen__tabs {
			-webkit-backdrop-filter: none;
			backdrop-filter: none;
			background: var(--m-surface);
		}
	}


	@media (max-width: 359px) {
		.az-appscreen__content { padding-inline: 10px; }
		.az-appscreen .az-appscreen__title { font-size: 34px; }
		.az-appscreen__hero-copy { max-width: 64%; }
		.az-appscreen__cat { gap: 7px; padding-inline: 9px; }
		.az-appscreen__cat > svg { width: 22px; height: 22px; }

		.az-appscreen__cat-copy strong { font-size: 11.5px; letter-spacing: -.01em; }
		.az-appscreen__cat-copy small { font-size: 10px; }

		.az-appscreen__btn { gap: 6px; padding-inline: 9px; font-size: 12px; }
		.az-appscreen__btn > svg:first-child { width: 18px; height: 18px; }
		.az-appscreen__btn > svg:last-child { width: 16px; height: 16px; }
	}

	@media (max-width: 389px) {
		.az-appscreen__tabs { padding-inline: 3px; }
		.az-appscreen__tab { gap: 2px; }
		.az-appscreen__tab > span { letter-spacing: -.02em; }
	}


	@media (max-height: 760px) {
		.az-appscreen__content { row-gap: 9px; }

		.az-appscreen__hero { padding: 13px 15px; }
		.az-appscreen .az-appscreen__title { font-size: 36px; }
		.az-appscreen .az-appscreen__lede { margin-top: 5px; }
		.az-appscreen__rule { margin-top: 8px; }
		.az-appscreen__card { gap: 9px; padding: 11px; }
		.az-appscreen__cat { padding-block: 10px; }
		.az-appscreen__btn { height: 50px; }
		.az-appscreen__tab { min-height: 50px; }
	}

	@media (max-height: 640px) {
		.az-appscreen__content { row-gap: 7px; }
		.az-appscreen__hero { padding: 11px 13px; }
		.az-appscreen .az-appscreen__title { font-size: 31px; }
		.az-appscreen .az-appscreen__kicker { font-size: 12px; }
		.az-appscreen .az-appscreen__lede { font-size: 11.5px; }
		.az-appscreen__rule { margin-top: 6px; }
		.az-appscreen__card { gap: 7px; padding: 10px; }
		.az-appscreen__card-badge { width: 40px; height: 40px; }
		.az-appscreen__card-cta { min-height: 29px; padding-block: 4px; }
		.az-appscreen .az-appscreen__heading { font-size: 16px; }
		.az-appscreen__grid { gap: 8px; }
		.az-appscreen__cat { padding-block: 8px; }
		.az-appscreen__btn { height: 46px; }
		.az-appscreen__tab { min-height: 46px; }
	}

	@media (prefers-reduced-motion: reduce) {
		.az-appscreen *,
		.az-appscreen *::before,
		.az-appscreen *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
		.az-appscreen a:active,
		.az-appscreen button:active,
		.az-appscreen__card:active,
		.az-appscreen__cat:active,
		.az-appscreen__btn:active,
		.az-appscreen__tab:active { transform: none; }
	}


	.az-appscreen__card,
	.az-appscreen__card-tag,
	.az-appscreen__card-cta,
	.az-appscreen__cat,
	.az-appscreen__btn--secondary {
		-webkit-backdrop-filter: var(--azm-glass);
		backdrop-filter: var(--azm-glass);
	}
}