/**
 * Variant CSS: download--app-store-badges
 *
 * "Pobierz aplikację" promo band: left column carries kicker + headline + deck +
 * two store badges (App Store / Google Play) styled as dark pill buttons with an
 * inline-SVG logo prepended via ::before, plus a star rating line. Right column is
 * a phone-style device frame holding the app screenshot. Text stays --ink
 * (polarity-aware); badges are always-dark surfaces, so their label uses
 * --text-on-dark (KI-020). Stacks + centers on mobile. Part of the `download` role.
 */

body.aibt-universal .universal-download--app-store-badges {
	padding-block: calc(clamp(3.5rem, 8vw, 6.5rem) * var(--density, 1));
}

body.aibt-universal .universal-download--app-store-badges .universal-download__grid {
	align-items: center;
}

/* Left pitch column. */
body.aibt-universal .universal-download--app-store-badges .universal-download__kicker {
	font-family: var(--font-body) !important;
	font-size: var(--text-xs) !important;
	font-weight: 600 !important;
	letter-spacing: var(--tracking-widest) !important;
	text-transform: uppercase !important;
	color: var(--accent) !important;
	margin: 0 0 var(--space-sm) 0 !important;
}

body.aibt-universal .universal-download--app-store-badges .universal-download__headline {
	font-family: var(--font-display) !important;
	color: var(--ink) !important;
	margin: 0 0 var(--space-md) 0 !important;
}

body.aibt-universal .universal-download--app-store-badges .universal-download__headline em {
	color: var(--accent) !important;
	font-style: italic;
}

body.aibt-universal .universal-download--app-store-badges .universal-download__deck {
	font-family: var(--font-body) !important;
	font-size: var(--text-lg) !important;
	line-height: var(--leading-relaxed) !important;
	color: var(--ink) !important;
	opacity: 0.78;
	max-width: 42ch;
	margin: 0 0 var(--space-lg) 0 !important;
}

/* Store badges row. */
body.aibt-universal .universal-download--app-store-badges .universal-download__badges {
	gap: var(--space-sm) !important;
	margin-bottom: var(--space-md);
}

body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn .wp-block-button__link {
	display: inline-flex !important;
	align-items: center;
	gap: 0.6rem;
	padding: 0.7rem 1.25rem !important;
	background: var(--background-dark, #141414) !important;
	color: var(--text-on-dark, #ffffff) !important;
	font-family: var(--font-body) !important;
	font-weight: 600 !important;
	font-size: var(--text-base) !important;
	letter-spacing: 0 !important;
	line-height: 1.15 !important;
	border: 1px solid color-mix(in srgb, var(--text-on-dark, #fff) 18%, transparent) !important;
	border-radius: var(--decor-radius, 12px) !important;
	transition: transform var(--duration-fast, 0.18s) var(--ease-default, ease),
		box-shadow var(--duration-fast, 0.18s) var(--ease-default, ease);
}

body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn .wp-block-button__link:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 38px -24px rgba(0, 0, 0, 0.55);
}

/* Keyboard focus ring (a11y). Badges are always-dark surfaces, so a raw --accent
   ring can read low-contrast → lift it toward --on-dark to stay clearly visible. */
body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn .wp-block-button__link:focus-visible {
	outline: 2px solid color-mix(in srgb, var(--accent) 60%, var(--on-dark, #fff));
	outline-offset: 2px;
	border-radius: var(--decor-radius, 12px);
}

/* Store logos prepended as inline-SVG data URIs (Apple / Google Play triangle). */
body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn .wp-block-button__link::before {
	content: "";
	flex: 0 0 auto;
	width: 1.25rem;
	height: 1.25rem;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn--apple .wp-block-button__link::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M16.5 1.6c.1 1-.3 2-.9 2.8-.7.8-1.7 1.4-2.7 1.3-.1-1 .4-2 .9-2.7.7-.8 1.8-1.3 2.7-1.4ZM18.9 17c-.5 1.1-.8 1.6-1.4 2.6-.9 1.4-2.1 3-3.6 3-1.3 0-1.7-.9-3.5-.9s-2.2.9-3.5.9c-1.5 0-2.6-1.5-3.5-2.8C1.3 16.7.6 12.5 2.2 9.8c.9-1.5 2.4-2.4 3.9-2.4 1.4 0 2.3.9 3.5.9 1.1 0 1.8-.9 3.5-.9 1.3 0 2.6.7 3.6 1.9-3.1 1.7-2.6 6.2.7 7.7Z'/%3E%3C/svg%3E");
}

body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn--google .wp-block-button__link::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M3.6 2.2c-.3.2-.5.6-.5 1.1v17.4c0 .5.2.9.5 1.1l9.3-9.8L3.6 2.2Zm10.7 7.2 2.7 2.8-2.7 2.8-3-3.2 3-2.4Zm.7-.7L4.9 2.6c-.2-.1-.3-.1-.5-.1l9.8 10.3 1.5-1.5-.7-2.6ZM4.4 21.5c.2 0 .3 0 .5-.1l10.1-6.1.6-2.5-1.4-1.5-9.8 10.3Z'/%3E%3C/svg%3E");
}

/* Star rating line. */
body.aibt-universal .universal-download--app-store-badges .universal-download__rating {
	font-family: var(--font-body) !important;
	font-size: var(--text-sm) !important;
	font-weight: 600 !important;
	color: var(--ink) !important;
	opacity: 0.7;
	letter-spacing: 0.08em;
	margin: 0 !important;
}

/* Phone device frame. */
body.aibt-universal .universal-download--app-store-badges .universal-download__device {
	display: flex;
	justify-content: center;
}

body.aibt-universal .universal-download--app-store-badges .universal-download__screenshot {
	width: 100%;
	max-width: 16rem;
	margin: 0;
	padding: 0.55rem;
	border-radius: 2.25rem;
	background: var(--background-dark, #141414);
	border: 1px solid color-mix(in srgb, var(--ink) 14%, transparent);
	box-shadow: 0 40px 80px -44px rgba(0, 0, 0, 0.5);
}

body.aibt-universal .universal-download--app-store-badges .universal-download__screenshot img {
	display: block;
	width: 100%;
	aspect-ratio: 9 / 18;
	object-fit: cover;
	border-radius: 1.7rem;
}

/* Tablet / mobile: stack columns, center, device first. */
@media (max-width: 781px) {
	body.aibt-universal .universal-download--app-store-badges .universal-download__grid {
		flex-wrap: wrap !important;
		text-align: center;
	}

	body.aibt-universal .universal-download--app-store-badges .universal-download__pitch,
	body.aibt-universal .universal-download--app-store-badges .universal-download__device {
		flex-basis: 100% !important;
	}

	body.aibt-universal .universal-download--app-store-badges .universal-download__device {
		order: -1;
	}

	/* A8: centered text + margin → margin:0 auto. */
	body.aibt-universal .universal-download--app-store-badges .universal-download__deck {
		margin: 0 auto var(--space-lg) auto !important;
	}

	body.aibt-universal .universal-download--app-store-badges .universal-download__badges {
		justify-content: center;
	}
}

@media (max-width: 640px) {
	body.aibt-universal .universal-download--app-store-badges .universal-download__kicker {
		letter-spacing: 0 !important;
	}

	body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn .wp-block-button__link {
		font-size: var(--text-sm) !important;
	}
}

/* Respect reduced-motion: drop badge hover-lift + transitions. */
@media (prefers-reduced-motion: reduce) {
	body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn .wp-block-button__link {
		transition: none;
	}

	body.aibt-universal .universal-download--app-store-badges .universal-download__badge-btn .wp-block-button__link:hover {
		transform: none;
	}
}