/*
 * Long-term UI foundation
 * Keep global tokens and cross-page behavior here. Page-specific work stays in custom.css.
 */
:root {
	--ui-navy-950: #07182d;
	--ui-navy-900: #0c2340;
	--ui-blue-600: #0b64d8;
	--ui-blue-500: #1976e9;
	--ui-cyan-500: #12a8a0;
	--ui-text: #10243d;
	--ui-muted: #64748b;
	--ui-line: #dfe7f0;
	--ui-surface: #ffffff;
	--ui-surface-soft: #f5f8fc;
	--ui-focus: #ffb020;
	--ui-space-1: 4px;
	--ui-space-2: 8px;
	--ui-space-3: 12px;
	--ui-space-4: 16px;
	--ui-space-5: 24px;
	--ui-space-6: 32px;
	--ui-space-7: 48px;
	--ui-space-8: 64px;
	--ui-radius-sm: 2px;
	--ui-radius-md: 6px;
	--ui-radius-lg: 12px;
	--ui-shadow-menu: 0 24px 60px rgba(7, 24, 45, .16);
	--ui-motion-fast: 160ms;
	--ui-motion: 240ms;
}

html {
	scroll-behavior: smooth;
}

body {
	color: var(--ui-text);
	-webkit-font-smoothing: antialiased;
}

/* A single, predictable keyboard focus treatment across the site. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--ui-focus) !important;
	outline-offset: 3px !important;
	box-shadow: none;
}

:where(a, button, input, select, textarea):focus:not(:focus-visible) {
	outline: 0;
}

.site-header .nav-search .nav-search__input:focus,
.site-header .nav-search .nav-search__input:focus-visible {
	outline: 0 !important;
	box-shadow: none !important;
}

.sr-only-focusable:focus {
	position: fixed !important;
	top: 12px;
	left: 12px;
	z-index: 100000;
	width: auto;
	height: auto;
	padding: 10px 14px;
	clip: auto;
	color: #fff;
	background: var(--ui-navy-950);
}

/* Lightweight navigation: each top-level item renders only its own children. */
.site-header .nav-compact > .nav-link {
	display: flex;
	align-items: center;
	gap: 5px;
}

.site-header .nav-popover {
	position: fixed;
	top: 76px;
	left: 0;
	right: 0;
	z-index: 1040;
	display: grid;
	grid-template-areas: "links";
	grid-template-columns: 1fr;
	width: 100vw;
	min-height: 260px;
	padding: 0 max(48px, calc((100vw - 1360px) / 2));
	visibility: hidden;
	opacity: 0;
	background: #fff;
	border: 0;
	border-top: 1px solid rgba(15, 23, 42, .08);
	border-bottom: 1px solid rgba(15, 23, 42, .1);
	border-radius: 0;
	box-shadow: 0 18px 34px rgba(15, 23, 42, .08);
	transform: translateY(8px);
	transition: opacity var(--ui-motion-fast) ease, transform var(--ui-motion-fast) ease, visibility var(--ui-motion-fast) ease;
}

.site-header .nav-compact:hover > .nav-popover,
.site-header .nav-compact:focus-within > .nav-popover,
.site-header .nav-compact.is-open > .nav-popover {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}

.nav-popover__links {
	grid-area: links;
	display: grid;
	grid-template-columns: repeat(4, minmax(160px, 1fr));
	align-content: start;
	gap: 34px 56px;
	padding: 46px 0 48px;
}

.nav-popover__group {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: 10px;
}

.nav-popover__group a,
.nav-popover__group span {
	overflow: hidden;
	font-size: 14px;
	line-height: 1.55;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.nav-popover__leaf {
	color: #4b5563;
}

.nav-popover__node {
	color: #111827;
	cursor: default;
}

.nav-popover__group .nav-popover__title {
	position: relative;
	margin-bottom: 6px;
	padding-bottom: 13px;
	color: #111827;
	border-bottom: 1px solid rgba(15, 23, 42, .1);
	font-size: 16px;
	font-weight: 700;
}

.nav-popover__group .nav-popover__title::after {
	display: none;
}

.nav-popover__level3 {
	margin-top: 4px;
	color: #1f2937;
	font-size: 14px;
	font-weight: 700;
}

.nav-popover__level4 {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-left: 14px;
	border-left: 1px solid rgba(15, 23, 42, .1);
}

.nav-popover__level4 a {
	font-size: 13px;
}

.nav-popover__group a:hover,
.nav-popover__leaf:hover {
	color: var(--ui-blue-600);
	text-decoration: none;
}

/* Search data refreshes from the server when the panel opens. */
.nav-search.is-loading .nav-search__section {
	opacity: .55;
}

.nav-search__section {
	transition: opacity var(--ui-motion-fast) ease;
}

.remote-list-slot {
	position: relative;
	min-height: 220px;
}

.remote-list-slot.is-loading::before,
.remote-list-slot.is-empty::before,
.remote-list-error {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 220px;
	padding: 36px 24px;
	color: var(--ui-muted);
	background: #f8fafc;
	border: 1px dashed var(--ui-line);
	font-size: 15px;
}

.remote-list-slot.is-loading::before {
	content: attr(data-loading-text);
}

.remote-list-slot.is-empty::before {
	content: "暂无内容";
}

.remote-list-slot .page-pb {
	margin-top: 34px !important;
}

.case-remote-slot .solution-list-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 34px 48px;
}

.case-remote-slot .solution-card {
	display: block;
	overflow: visible;
	color: var(--ui-text);
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.case-remote-slot .solution-card__media {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #f5f7fa;
}

.case-remote-slot .solution-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--ui-motion) ease;
}

.case-remote-slot .solution-card:hover .solution-card__media img {
	transform: scale(1.04);
}

.case-remote-slot .solution-card__tag,
.case-remote-slot .solution-card__more {
	display: none;
}

.case-remote-slot .solution-card__body {
	padding: 22px 0 0;
}

.case-remote-slot .solution-card__body h3 {
	display: -webkit-box;
	min-height: 0;
	margin: 0 0 10px;
	overflow: hidden;
	color: var(--ui-text);
	font-size: 21px;
	font-weight: 800;
	line-height: 1.45;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.case-remote-slot .solution-card__body p {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: var(--ui-muted);
	font-size: 14px;
	line-height: 1.7;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.news-panel-more,
.case-panel-more {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 28px;
	color: var(--ui-blue-600);
	font-weight: 800;
}

.news-panel-more:hover,
.case-panel-more:hover {
	color: var(--ui-navy-900);
	text-decoration: none;
}

/* 道尔动态中心页：首条最新动态作为重点新闻，其他内容保持三列媒体流。 */
.news-page [data-news-panel="company"] .news-list-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 76px 44px;
}

.news-page [data-news-panel="company"] .news-list-card {
	grid-column: auto !important;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;
	padding: 0;
	min-height: 0;
	overflow: visible;
	background: transparent;
	border: 0;
	border-radius: 0;
	border-bottom: 0;
	box-shadow: none;
	transform: none;
}

.news-page [data-news-panel="company"] .news-list-card .news-list-card__cover {
	height: auto;
	aspect-ratio: 16 / 9;
	background: #f5f7fa;
}

.news-page [data-news-panel="company"] .news-list-card > div:last-child {
	padding: 20px 0 0;
}

.news-page [data-news-panel="company"] .news-list-card .news-list-card__date {
	position: static;
	display: block;
	width: auto;
	height: auto;
	margin-bottom: 14px;
	color: var(--ui-muted);
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: .04em;
}

.news-page [data-news-panel="company"] .news-list-card h3 {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: var(--ui-text);
	font-size: 21px;
	font-weight: 800;
	line-height: 1.5;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.news-page [data-news-panel="company"] .news-list-card .news-list-card__summary {
	display: none;
}

.news-page [data-news-panel="company"] .news-list-card.is-featured {
	grid-column: 1 / -1 !important;
	display: grid;
	grid-template-columns: minmax(0, 1.42fr) minmax(330px, .78fr);
	gap: 46px;
	align-items: center;
	padding: 0 0 48px;
	border-bottom: 1px solid var(--ui-line);
}

.news-page [data-news-panel="company"] .news-list-card.is-featured .news-list-card__cover {
	aspect-ratio: 1.72 / 1;
}

.news-page [data-news-panel="company"] .news-list-card.is-featured > div:last-child {
	padding: 0;
}

.news-page [data-news-panel="company"] .news-list-card.is-featured h3 {
	font-size: 30px;
	line-height: 1.38;
	-webkit-line-clamp: 3;
}

.news-page [data-news-panel="company"] .news-list-card.is-featured .news-list-card__summary {
	display: block;
	margin: 18px 0 0;
	color: var(--ui-muted);
	font-size: 16px;
	line-height: 1.85;
}

.case-tag-filter .case-filter-toggle {
	display: none;
}

.case-card__title-row {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	justify-content: space-between;
}

.case-card__title-row h3 {
	flex: 1 1 auto;
	min-width: 0;
	margin-top: 0;
}

.case-card__region {
	flex: 0 0 auto;
	max-width: 42%;
	overflow: hidden;
	padding: 7px 10px;
	color: var(--ui-muted);
	background: #f4f7fb;
	border-radius: 4px;
	font-size: 13px;
	font-style: normal;
	font-weight: 800;
	line-height: 1.2;
	text-align: right;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Mobile hero copy stays within the viewport and balances long Chinese titles. */
.home .hero-slider .hero__copy h1,
.home .hero-slider .hero__copy h2 {
	max-width: 900px;
	margin: 22px 0;
	color: var(--hero-title-color, #fff);
	font-size: 68px;
	font-weight: 800;
	line-height: 1.08;
	text-wrap: balance;
}

/* 首页 BANNER 主标题：桌面端保持单行，中等桌面宽度适当缩小字号。 */
@media (min-width: 992px) {
	.home .hero-slider .hero__copy h1,
	.home .hero-slider .hero__copy h2 {
		max-width: none;
		white-space: nowrap;
		text-wrap: nowrap;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	.home .hero-slider .hero__copy h1,
	.home .hero-slider .hero__copy h2 {
		font-size: clamp(48px, 5.4vw, 58px);
	}
}

.hero__copy[data-title-hide="1"] h2 {
	display: none;
}

.hero-slide[data-text-position="center"] .hero h2,
.hero-slide[data-text-position="center"] .hero__copy,
.hero-slide[data-text-position="center-upper"] .hero h2,
.hero-slide[data-text-position="center-upper"] .hero__copy {
	margin-left: auto;
	margin-right: auto;
}

.hero-slide[data-text-position="right-center"] .hero h2,
.hero-slide[data-text-position="right-bottom"] .hero h2 {
	margin-left: auto;
}

/* 首张首页 Banner 的副标题受最大宽度限制时，仍与主标题保持同一水平中心。 */
.home .hero-slide[data-slide-link="/parking-guidance/"][data-text-position="center"] .hero__copy > p {
	margin-left: auto;
	margin-right: auto;
}

/* The mobile conversion bar may hide while scrolling, and respects device safe areas. */
.mobile-bottom {
	padding-bottom: env(safe-area-inset-bottom);
	transition: transform var(--ui-motion) ease, visibility var(--ui-motion) ease;
}

.mobile-bottom.is-hidden {
	visibility: hidden;
	transform: translateY(calc(100% + env(safe-area-inset-bottom)));
}

@media (max-width: 991.98px) {
	.news-page [data-news-panel="company"] .news-list-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px;
	}

	.news-page [data-news-panel="company"] .news-list-card.is-featured {
		gap: 30px;
	}

	.site-header .navbar-collapse {
		max-height: calc(100vh - 72px);
		overflow-y: auto;
	}

	.site-header .nav-compact > .nav-link {
		justify-content: space-between;
	}

	.site-header .nav-popover {
		position: static;
		display: none;
		grid-template-columns: 1fr;
		width: 100%;
		min-height: 0;
		padding: 0;
		visibility: visible;
		opacity: 1;
		border: 0;
		box-shadow: none;
		transform: none;
	}

	.site-header .nav-compact.is-open > .nav-popover {
		display: grid;
	}

	.nav-popover__links {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 18px;
		padding: 12px 18px 22px;
		background: var(--ui-surface-soft);
	}

	.nav-popover__group a {
		white-space: normal;
	}

	.nav-right-tools {
		padding-bottom: 18px;
	}

	.case-remote-slot .solution-list-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px;
	}
}

@media (max-width: 575.98px) {
	.news-page [data-news-panel="company"] .news-list-grid {
		grid-template-columns: 1fr;
	}

	.news-page [data-news-panel="company"] .news-list-card .news-list-card__cover {
		aspect-ratio: 1.38 / 1;
	}

	.news-page [data-news-panel="company"] .news-list-card.is-featured {
		display: block;
		padding: 0 0 32px;
		margin-bottom: 32px;
	}

	.news-page [data-news-panel="company"] .news-list-card.is-featured > div:last-child {
		padding-top: 18px;
	}

	.news-page [data-news-panel="company"] .news-list-card.is-featured h3 {
		font-size: 20px;
	}

	.news-page [data-news-panel="company"] .news-list-card.is-featured .news-list-card__summary {
		font-size: 15px;
		line-height: 1.75;
	}

	.case-remote-slot .solution-list-grid {
		grid-template-columns: 1fr;
	}

	.home .hero-slider .hero__content {
		width: 100%;
		padding: 102px 20px 84px;
		overflow: hidden;
	}

	.home .hero-slider .hero__copy {
		position: relative;
		isolation: isolate;
		width: min(100%, calc(100vw - 40px));
		max-width: calc(100vw - 40px);
		padding: 14px 0;
		transform: translateY(-24px);
	}

	.home .hero-slider .hero__copy::before {
		position: absolute;
		inset: -12px -72px -12px -20px;
		z-index: -1;
		content: "";
		background: linear-gradient(90deg, rgba(255, 255, 255, .86) 0%, rgba(255, 255, 255, .58) 64%, rgba(255, 255, 255, 0) 100%);
	}

	.home .hero-slider .hero__copy h1,
	.home .hero-slider .hero__copy h2 {
		width: 100%;
		max-width: 100%;
		margin: 14px 0;
		font-size: clamp(30px, 9vw, 40px);
		line-height: 1.16;
		overflow-wrap: anywhere;
		word-break: normal;
		color: var(--ui-navy-950) !important;
	}

	.home .hero-slider .hero__copy p {
		width: 100%;
		max-width: 100%;
		font-size: 16px;
		line-height: 1.7;
		overflow-wrap: anywhere;
		color: rgba(7, 24, 45, .82) !important;
	}

	.home .hero-slider .hero-slide[data-header-theme="light"] .hero__copy::before {
		background: linear-gradient(90deg, rgba(4, 12, 25, .88) 0%, rgba(8, 25, 48, .68) 64%, rgba(8, 25, 48, 0) 100%);
	}

	.home .hero-slider .hero-slide[data-header-theme="light"] .hero__copy h1,
	.home .hero-slider .hero-slide[data-header-theme="light"] .hero__copy h2 {
		color: #fff !important;
	}

	.home .hero-slider .hero-slide[data-header-theme="light"] .hero__copy p {
		color: rgba(255, 255, 255, .82) !important;
	}

	.home .hero-slider .hero-slide[data-slide-link="/parking-guidance/"] .hero__copy h2 {
		word-break: keep-all;
		overflow-wrap: normal;
		text-wrap: wrap;
	}

	.home .hero-slider .hero__actions {
		margin-top: 20px;
	}

	.nav-popover__links {
		grid-template-columns: 1fr;
	}
}