/**
 * @ownership theme-global
 * Global site shell, header, footer, and base layout.
 *
 * theme.css
 * ----------------
 * Allowed selectors:
 *   .dsp-body
 *   .dsp-site
 *   .dsp-container
 *   .dsp-main
 *   .dsp-main--*
 *   .dsp-site-header*
 *   .dsp-footer*
 *   .dsp-skip-link*
 *   .dsp-page*
 *   .dsp-content*
 *   .dsp-utility*
 *   .dsp-nav*
 *   .dsp-mobile-*
 *   .dsp-tablet-*
 *   .dsp-desktop-*
 *   body.dsp-*
 *   html
 *
 * Forbidden:
 *   .dsp-home*
 *   .dsp-shop*
 *   .dsp-product-card*
 *   .dsp-dashboard*
 *   .dsp-community*
 *   .dsp-webshop*
 *   .dsp-account-*
 *   .dsp-calculator-*
 *   .dsp-product-grid
 */

/* Base */
.dsp-body {
	margin: 0;
	font-family: var(--dsp-font-family-sans);
	font-size: var(--dsp-font-size-base);
	font-weight: var(--dsp-font-weight-regular);
	line-height: var(--dsp-line-height-normal);
	color: var(--dsp-color-text-primary);
	background-color: var(--dsp-color-bg-base);
	-webkit-font-smoothing: antialiased;
}

.dsp-site {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

/* Layout */
.dsp-container {
	width: 100%;
	max-width: var(--dsp-container-xl);
	margin-inline: auto;
	padding-inline: var(--dsp-container-padding);
	box-sizing: border-box;
}

.dsp-main {
	flex: 1;
	padding-block: var(--dsp-space-8);
}

.dsp-main--front {
	padding-block: 0;
}

/* Header */
.dsp-site-header {
	position: sticky;
	top: 0;
	z-index: var(--dsp-z-header);
	background-color: var(--dsp-color-bg-base);
	border-bottom: 1px solid transparent;
	box-shadow: none;
	transition:
		background-color var(--dsp-transition-normal),
		border-color var(--dsp-transition-normal),
		box-shadow var(--dsp-transition-normal),
		backdrop-filter var(--dsp-transition-normal);
}

.dsp-site-header--scrolled {
	background-color: color-mix(in srgb, var(--dsp-color-bg-base) 88%, transparent);
	border-bottom-color: var(--dsp-color-border-subtle);
	box-shadow: var(--dsp-shadow-md);
	backdrop-filter: blur(var(--dsp-blur-md));
}

.dsp-site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--dsp-space-4);
	min-height: 4.5rem;
}

.dsp-site-header__brand {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: var(--dsp-color-text-primary);
}

.dsp-site-header__logo-img {
	display: block;
	height: 56px;
	width: auto;
	object-fit: contain;
}

.dsp-site-header__logo .custom-logo-link,
.dsp-site-header__logo img {
	display: block;
	height: 56px;
	width: auto;
	object-fit: contain;
}

.dsp-site-header__navigation {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}

.dsp-site-header__utilities {
	display: flex;
	align-items: center;
	gap: var(--dsp-space-2);
}

.dsp-site-header__utility {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	color: var(--dsp-color-text-secondary);
	text-decoration: none;
	border-radius: var(--dsp-radius-md);
	transition:
		color var(--dsp-transition-fast),
		background-color var(--dsp-transition-fast);
}

.dsp-site-header__utility:hover,
.dsp-site-header__utility:focus-visible {
	color: var(--dsp-color-text-primary);
	background-color: var(--dsp-color-bg-elevated);
}

.dsp-site-header__utility .dsp-icon {
	width: 1.25rem;
	height: 1.25rem;
}

.dsp-site-header__badge {
	position: absolute;
	top: var(--dsp-space-1);
	right: var(--dsp-space-1);
	min-width: 1rem;
	height: 1rem;
	padding-inline: var(--dsp-space-1);
	font-size: var(--dsp-font-size-xs);
	font-weight: var(--dsp-font-weight-bold);
	line-height: 1rem;
	text-align: center;
	color: var(--dsp-color-text-on-accent);
	background-color: var(--dsp-color-accent);
	border-radius: var(--dsp-radius-full);
}

/* Navigation */
.dsp-nav__item {
	position: relative;
}

.dsp-nav__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--dsp-space-1);
	margin: 0;
	padding: 0;
	list-style: none;
}

.dsp-nav__link {
	position: relative;
	display: block;
	padding: var(--dsp-space-2) var(--dsp-space-3);
	font-size: var(--dsp-font-size-sm);
	font-weight: var(--dsp-font-weight-medium);
	color: var(--dsp-color-text-secondary);
	text-decoration: none;
	border-radius: var(--dsp-radius-md);
	transition: color var(--dsp-transition-normal);
}

.dsp-nav__link::after {
	content: "";
	position: absolute;
	left: var(--dsp-space-3);
	right: var(--dsp-space-3);
	bottom: var(--dsp-space-1);
	height: 2px;
	background-color: var(--dsp-color-accent);
	border-radius: var(--dsp-radius-full);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform var(--dsp-transition-normal);
}

.dsp-nav__link:hover,
.dsp-nav__link:focus-visible {
	color: var(--dsp-color-text-primary);
	background-color: transparent;
}

.dsp-nav__link:hover::after,
.dsp-nav__link:focus-visible::after,
.dsp-nav__item--active .dsp-nav__link::after,
.dsp-nav__item.current-menu-item .dsp-nav__link::after {
	transform: scaleX(1);
}

.dsp-nav__item--active .dsp-nav__link,
.dsp-nav__item.current-menu-item .dsp-nav__link {
	color: var(--dsp-color-accent);
}

.dsp-nav__toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--dsp-space-2);
	padding: var(--dsp-space-2) var(--dsp-space-3);
	font-family: inherit;
	font-size: var(--dsp-font-size-sm);
	color: var(--dsp-color-text-primary);
	background-color: var(--dsp-color-bg-elevated);
	border: 1px solid var(--dsp-color-border-default);
	border-radius: var(--dsp-radius-md);
	cursor: pointer;
}

.dsp-nav__container--mobile {
	padding: var(--dsp-space-4);
	margin-top: var(--dsp-space-3);
	background-color: var(--dsp-color-bg-elevated);
	border: 1px solid var(--dsp-color-border-default);
	border-radius: var(--dsp-radius-lg);
}

.dsp-nav__container--mobile[hidden] {
	display: none !important;
}

.dsp-nav__container--mobile .dsp-nav__list {
	flex-direction: column;
}

/* Footer */
.dsp-site-footer {
	margin-top: auto;
	padding-block: var(--dsp-space-12) var(--dsp-space-6);
	background-color: var(--dsp-color-bg-surface);
	border-top: 1px solid var(--dsp-color-border-subtle);
}

.dsp-site-footer__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dsp-space-10);
	margin-bottom: var(--dsp-space-10);
}

.dsp-site-footer__logo {
	display: inline-block;
	margin-bottom: var(--dsp-space-4);
	text-decoration: none;
}

.dsp-site-footer__logo img {
	display: block;
	height: 48px;
	width: auto;
	object-fit: contain;
}

.dsp-site-footer__tagline {
	margin: 0 0 var(--dsp-space-4);
	font-size: var(--dsp-font-size-sm);
	color: var(--dsp-color-text-secondary);
}

.dsp-site-footer__contact {
	display: flex;
	flex-direction: column;
	gap: var(--dsp-space-2);
	font-style: normal;
	font-size: var(--dsp-font-size-sm);
}

.dsp-site-footer__contact a {
	color: var(--dsp-color-text-secondary);
	text-decoration: none;
	transition: color var(--dsp-transition-fast);
}

.dsp-site-footer__contact a:hover,
.dsp-site-footer__contact a:focus-visible {
	color: var(--dsp-color-accent);
}

.dsp-site-footer__heading {
	margin: 0 0 var(--dsp-space-4);
	font-size: var(--dsp-font-size-sm);
	font-weight: var(--dsp-font-weight-semibold);
	color: var(--dsp-color-text-primary);
}

.dsp-site-footer__menu {
	display: flex;
	flex-direction: column;
	gap: var(--dsp-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.dsp-site-footer__menu a {
	font-size: var(--dsp-font-size-sm);
	color: var(--dsp-color-text-secondary);
	text-decoration: none;
	transition: color var(--dsp-transition-fast);
}

.dsp-site-footer__menu a:hover,
.dsp-site-footer__menu a:focus-visible {
	color: var(--dsp-color-accent);
}

.dsp-site-footer__social-list {
	display: flex;
	gap: var(--dsp-space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.dsp-site-footer__social-list a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	color: var(--dsp-color-text-secondary);
	background-color: var(--dsp-color-bg-elevated);
	border-radius: var(--dsp-radius-md);
	transition:
		color var(--dsp-transition-fast),
		background-color var(--dsp-transition-fast);
}

.dsp-site-footer__social-list a:hover,
.dsp-site-footer__social-list a:focus-visible {
	color: var(--dsp-color-accent);
	background-color: var(--dsp-color-accent-subtle);
}

.dsp-site-footer__social-list .dsp-icon {
	width: 1.125rem;
	height: 1.125rem;
}

.dsp-site-footer__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--dsp-space-4);
	padding-top: var(--dsp-space-6);
	border-top: 1px solid var(--dsp-color-border-subtle);
}

.dsp-site-footer__copyright {
	margin: 0;
	font-size: var(--dsp-font-size-xs);
	color: var(--dsp-color-text-muted);
}

.dsp-site-footer__copyright a {
	color: var(--dsp-color-text-secondary);
	text-decoration: none;
}

.dsp-site-footer__hours {
	display: block;
	margin-top: var(--dsp-space-2);
}

.dsp-site-footer__trust {
	display: flex;
	flex-wrap: wrap;
	gap: var(--dsp-space-8);
	padding-block: var(--dsp-space-8);
	margin-bottom: var(--dsp-space-6);
	border-top: 1px solid var(--dsp-color-border-subtle);
	border-bottom: 1px solid var(--dsp-color-border-subtle);
}

.dsp-site-footer__trust-label {
	margin: 0 0 var(--dsp-space-3);
	font-size: var(--dsp-font-size-xs);
	font-weight: var(--dsp-font-weight-semibold);
	color: var(--dsp-color-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.dsp-site-footer__trust-icons {
	display: flex;
	flex-wrap: wrap;
	gap: var(--dsp-space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.dsp-site-footer__trust-icons li {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 3.5rem;
	height: 2.25rem;
	padding-inline: var(--dsp-space-3);
	background: var(--dsp-color-bg-elevated);
	border: 1px solid var(--dsp-color-border-subtle);
	border-radius: var(--dsp-radius-md);
}

.dsp-trust-icon {
	display: block;
	height: 1.25rem;
	width: auto;
	max-width: 3.5rem;
}

.dsp-trust-badge {
	font-size: var(--dsp-font-size-xs);
	font-weight: var(--dsp-font-weight-medium);
	color: var(--dsp-color-text-secondary);
	white-space: nowrap;
}

/* Content pages */
.dsp-content {}
.dsp-archive-header {}
.dsp-search-header {}
.dsp-error-404 {}

/* Accessibility */
.dsp-skip-link {
	position: absolute;
	top: var(--dsp-space-2);
	left: var(--dsp-space-2);
	z-index: var(--dsp-z-max);
	padding: var(--dsp-space-2) var(--dsp-space-4);
	background-color: var(--dsp-color-accent);
	color: var(--dsp-color-text-on-accent);
	border-radius: var(--dsp-radius-md);
	transform: translateY(-200%);
	transition: transform var(--dsp-transition-fast);
}

.dsp-skip-link:focus {
	transform: translateY(0);
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

@media (min-width: 768px) {
	.dsp-container {
		padding-inline: var(--dsp-space-6);
	}

	.dsp-site-footer__grid {
		grid-template-columns: 2fr 1fr 1fr 1fr;
	}

	.dsp-nav--mobile {
		display: none;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.dsp-nav--desktop:not(.dsp-nav--fallback) {
		display: none;
	}
}

@media (min-width: 768px) and (max-width: 1279px) {
	.dsp-nav__link {
		padding: var(--dsp-space-2);
		font-size: var(--dsp-font-size-xs);
	}

	.dsp-nav__list {
		gap: 0;
	}
}

@media (min-width: 1024px) {
	.dsp-nav--tablet {
		display: none;
	}
}

@media (max-width: 767px) {
	.dsp-nav--desktop,
	.dsp-nav--tablet {
		display: none !important;
	}

	.dsp-site-header__navigation {
		flex: 0 1 auto;
		justify-content: flex-end;
	}
}

@media (min-width: 1280px) {
	.dsp-container {
		padding-inline: var(--dsp-space-8);
	}
}

/* Search results */
.dsp-search {
	padding-block: var(--dsp-space-12) var(--dsp-space-20);
}

.dsp-search__title {
	font-family: var(--dsp-font-family-display);
	font-size: var(--dsp-font-size-3xl);
	margin-bottom: var(--dsp-space-8);
}

.dsp-search__results {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--dsp-space-4);
}

.dsp-search__item {
	padding: var(--dsp-space-5);
	background-color: var(--dsp-elevation-1-bg);
	border: 1px solid var(--dsp-color-border-subtle);
	border-radius: var(--dsp-radius-lg);
}

.dsp-search__item-title {
	margin: 0 0 var(--dsp-space-2);
	font-size: var(--dsp-font-size-lg);
}

.dsp-search__item-title a {
	color: var(--dsp-color-text-primary);
	text-decoration: none;
}

.dsp-search__item-title a:hover {
	color: var(--dsp-color-accent);
}

.dsp-search__item-excerpt,
.dsp-search__empty {
	margin: 0;
	color: var(--dsp-color-text-secondary);
	font-size: var(--dsp-font-size-sm);
}

.dsp-site-footer__social-note {
	margin: 0;
	font-size: var(--dsp-font-size-sm);
	color: var(--dsp-color-text-muted);
	line-height: var(--dsp-line-height-relaxed);
}

/* Android app promo */
.dsp-app-promo {
	padding-block: var(--dsp-space-10);
}

.dsp-app-promo--section {
	margin-block: var(--dsp-space-8);
	background:
		radial-gradient(ellipse 50% 80% at 8% 40%, var(--dsp-color-accent-subtle) 0%, transparent 55%),
		var(--dsp-color-bg-surface-raised);
	border-block: 1px solid var(--dsp-color-border-subtle);
}

.dsp-app-promo--footer {
	padding-block: var(--dsp-space-8);
	margin-bottom: var(--dsp-space-6);
	border-top: 1px solid var(--dsp-color-border-subtle);
}

.dsp-app-promo__card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--dsp-space-8);
	max-width: 40rem;
	padding: var(--dsp-space-8);
	background-color: var(--dsp-elevation-2-bg);
	border: 1px solid var(--dsp-color-border-subtle);
	border-radius: var(--dsp-radius-2xl);
	box-shadow: var(--dsp-elevation-2-shadow);
}

.dsp-app-promo--footer .dsp-app-promo__card {
	max-width: none;
	width: 100%;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	gap: 0;
}

.dsp-app-promo__device {
	display: none;
}

.dsp-app-promo__phone {
	width: 7.5rem;
	padding: 0.45rem;
	border-radius: 1.35rem;
	background: linear-gradient(160deg, var(--dsp-color-graphite-700), var(--dsp-color-graphite-950));
	box-shadow:
		inset 0 0 0 1px rgb(255 255 255 / 8%),
		0 12px 28px rgb(0 0 0 / 35%);
}

.dsp-app-promo__phone-screen {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 9 / 18;
	object-fit: cover;
	object-position: top center;
	border-radius: 1rem;
	background-color: var(--dsp-color-bg-base);
}

.dsp-app-promo__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	max-width: 28rem;
}

.dsp-app-promo__eyebrow {
	margin: 0 0 var(--dsp-space-2);
	font-size: var(--dsp-font-size-xs);
	font-weight: var(--dsp-font-weight-semibold);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--dsp-color-accent);
}

.dsp-app-promo__title {
	margin: 0 0 var(--dsp-space-3);
	font-family: var(--dsp-font-family-display);
	font-size: var(--dsp-font-size-2xl);
	font-weight: var(--dsp-font-weight-bold);
	line-height: var(--dsp-line-height-tight);
	color: var(--dsp-color-text-primary);
}

.dsp-app-promo__lead {
	margin: 0;
	font-size: var(--dsp-font-size-md);
	line-height: var(--dsp-line-height-relaxed);
	color: var(--dsp-color-text-secondary);
}

.dsp-app-promo__features {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dsp-space-3);
	width: 100%;
	margin: var(--dsp-space-5) 0 0;
	padding: 0;
	list-style: none;
}

.dsp-app-promo__feature {
	display: flex;
	align-items: flex-start;
	gap: var(--dsp-space-3);
	font-size: var(--dsp-font-size-sm);
	color: var(--dsp-color-text-secondary);
}

.dsp-app-promo__check {
	flex: 0 0 auto;
	width: 1.125rem;
	height: 1.125rem;
	margin-top: 0.125rem;
	border-radius: 50%;
	background-color: var(--dsp-color-accent-subtle);
	box-shadow: inset 0 0 0 1px var(--dsp-color-accent);
	position: relative;
}

.dsp-app-promo__check::after {
	content: '';
	position: absolute;
	left: 0.34rem;
	top: 0.2rem;
	width: 0.28rem;
	height: 0.5rem;
	border-right: 2px solid var(--dsp-color-accent);
	border-bottom: 2px solid var(--dsp-color-accent);
	transform: rotate(45deg);
}

.dsp-app-promo__action {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--dsp-space-3);
	margin-top: 2rem; /* 32px — within 24–40px of feature list */
}

.dsp-app-promo__cta {
	margin: 0;
	font-size: var(--dsp-font-size-sm);
	font-weight: var(--dsp-font-weight-semibold);
	color: var(--dsp-color-text-primary);
}

.dsp-app-promo--footer .dsp-app-promo__action {
	margin-top: var(--dsp-space-4);
}

.dsp-app-promo__badge-link {
	display: inline-flex;
	line-height: 0;
	border-radius: var(--dsp-radius-md);
	transition: opacity var(--dsp-transition-fast), transform var(--dsp-transition-fast);
}

.dsp-app-promo__badge-link:hover,
.dsp-app-promo__badge-link:focus-visible {
	opacity: 0.92;
	transform: translateY(-1px);
	outline: none;
}

.dsp-app-promo__badge-link:focus-visible {
	box-shadow: 0 0 0 3px var(--dsp-color-focus-ring);
}

.dsp-app-promo__badge {
	display: block;
	width: auto;
	height: 3.5rem;
}

.dsp-app-promo--footer .dsp-app-promo__title {
	font-size: var(--dsp-font-size-xl);
}

.dsp-app-promo--footer .dsp-app-promo__lead {
	font-size: var(--dsp-font-size-sm);
}

.dsp-site-footer .dsp-app-promo--footer .dsp-container {
	padding-inline: 0;
	max-width: none;
	width: 100%;
}

@media (min-width: 640px) {
	.dsp-app-promo__features {
		grid-template-columns: 1fr 1fr;
	}
}

@media (min-width: 768px) {
	.dsp-app-promo--section .dsp-app-promo__card {
		flex-direction: row;
		align-items: center;
		max-width: 44rem;
		gap: var(--dsp-space-8);
	}

	.dsp-app-promo--section .dsp-app-promo__device {
		display: block;
		flex: 0 0 auto;
	}

	.dsp-app-promo__badge {
		height: 3.75rem;
	}
}

@media (min-width: 1024px) {
	.dsp-app-promo--section {
		padding-block: var(--dsp-space-12);
	}

	.dsp-app-promo__title {
		font-size: var(--dsp-font-size-3xl);
	}
}