/* ==========================================================
   eCall 产线自动叫料系统 页面样式
   与官网全局样式(style.css / style2.css)及 WMS / APS 产品页保持一致
   字体   : Noto Sans SC
   字号   : 标题36 / 卡片标题20 / 正文16 / 说明14（移动端 18 / 16 / 14）
   颜色   : 品牌蓝 #014099，标题 #191919，正文 #666，交替背景 #f9f9f9
            琥珀 #d98a00 仅用于缺料预警，红 #e60012 仅用于紧急 / 异常
   容器   : 与 .max-width 相同（1280px，<1700 为90%，<1500 为87%）
   所有选择器以 .ecall-page 前缀隔离，不影响全局
   ========================================================== */
.ecall-page {
	clear: both;
	margin-top: 86px;           /* 顶部菜单固定 86px（移动端 50px） */
	--brand: #014099;
	--brand-hover: #004bb5;
	--brand-grad: linear-gradient(#004bb5, #01419a);
	--brand-soft: #dfecff;
	--accent: #e60012;          /* 紧急 / 异常 */
	--amber: #d98a00;           /* 缺料预警 */
	--amber-soft: #fdf3e2;
	--title: #191919;
	--sub: #333333;
	--body: #666666;
	--muted: #999999;
	--bg-alt: #f9f9f9;
	--shadow: 0 0 10px rgba(0,0,0,.1);
	--shadow-hover: 0 4px 18px rgba(1,64,153,.18);
	color: var(--body);
	background: #fff;
	font-family: 'Noto Sans SC', "Microsoft YaHei", "PingFang SC", sans-serif;
	font-size: 16px;
	line-height: 30px;
}

	.ecall-page *,
	.ecall-page *::before,
	.ecall-page *::after {
		box-sizing: border-box;
		font-family: inherit;
	}

	.ecall-page a {
		color: inherit;
		text-decoration: none;
	}

	.ecall-page .container {
		width: 1280px;
		margin: 0 auto;
	}

	.ecall-page section h1,
	.ecall-page section h2,
	.ecall-page section h3,
	.ecall-page section p {
		margin-top: 0;
		font-weight: normal;
	}

	.ecall-page section h1,
	.ecall-page section h2 {
		color: var(--title);
		font-size: 36px;
		line-height: 46px;
		margin-bottom: 20px;
	}

	.ecall-page section h3 {
		color: var(--sub);
		font-size: 20px;
		line-height: 28px;
		margin-bottom: 12px;
	}

	.ecall-page section p {
		margin-bottom: 0;
	}

	.ecall-page .lead {
		font-size: 16px;
		color: var(--body);
		max-width: 860px;
	}

	.ecall-page .muted {
		color: var(--body);
	}

	/* 区块 */
	.ecall-page .section {
		padding: 100px 0;
	}

		.ecall-page .section.soft {
			background: var(--bg-alt);
		}

		.ecall-page .section.dark {
			background-image: var(--brand-grad);
		}

	.ecall-page .section-head {
		max-width: 860px;
		margin: 0 auto 46px;
		text-align: center;
	}

		.ecall-page .section-head .lead {
			margin: 0 auto;
		}

	.ecall-page .eyebrow {
		display: block;
		color: var(--brand);
		font-size: 14px;
		line-height: 20px;
		letter-spacing: .12em;
		text-transform: uppercase;
		margin-bottom: 10px;
	}

		.ecall-page .eyebrow::before {
			display: none;
		}

	.ecall-page .section.dark h2,
	.ecall-page .section.dark h3 {
		color: #fff;
	}

	.ecall-page .section.dark .lead {
		color: rgba(255,255,255,.88);
	}

	.ecall-page .section.dark .eyebrow {
		color: rgba(255,255,255,.85) !important;
	}

	/* 按钮：官网胶囊按钮 */
	.ecall-page .btn {
		min-width: 140px;
		height: 40px;
		padding: 0 32px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		border-radius: 20px;
		font-size: 16px;
		line-height: 1;
		border: 1px solid transparent;
		transition: .2s ease;
	}

		.ecall-page .btn.primary {
			color: #fff;
			background-image: var(--brand-grad);
		}

			.ecall-page .btn.primary:hover {
				background: var(--brand-hover);
			}

		.ecall-page .btn.ghost {
			color: var(--brand);
			background: #fff;
			border-color: var(--brand);
		}

			.ecall-page .btn.ghost:hover {
				color: #fff;
				background: var(--brand);
			}

		.ecall-page .btn.white {
			background: #fff;
			color: var(--brand);
		}

			.ecall-page .btn.white:hover {
				background: var(--brand-soft);
			}

	.ecall-page .actions {
		display: flex;
		gap: 16px;
		flex-wrap: wrap;
	}

	/* 首屏 */
	.ecall-page .hero {
		background: linear-gradient(180deg, #fff 0%, #fff 55%, #f3f7fd 100%);
		border-top: 1px solid #eef1f6;
		padding: 90px 0 100px;
	}

		.ecall-page .hero h1 {
			margin: 0 0 10px;
			color: var(--brand);
			font-size: 56px;
			line-height: 66px;
			font-weight: bold;
			letter-spacing: -.01em;
		}

		.ecall-page .hero h2 {
			font-size: 30px;
			line-height: 40px;
			margin-bottom: 16px;
			color: var(--title);
		}

	.ecall-page .hero-grid {
		display: grid;
		grid-template-columns: 46% 54%;
		gap: 66px;
		align-items: center;
	}

	.ecall-page .hero-copy .claim {
		font-size: 20px;
		line-height: 30px;
		color: var(--brand);
		margin-bottom: 14px;
	}

	.ecall-page .hero-copy p {
		font-size: 16px;
		line-height: 30px;
		color: var(--body);
		margin-bottom: 32px;
	}

	.ecall-page .hero-tags {
		display: flex;
		gap: 10px;
		flex-wrap: wrap;
		margin-top: 30px;
	}

	.ecall-page .tag {
		border: 1px solid var(--brand);
		background: #fff;
		color: var(--brand);
		border-radius: 16px;
		padding: 3px 16px;
		font-size: 14px;
		line-height: 24px;
	}

	/* 首屏驾驶舱 */
	.ecall-page .dashboard {
		position: relative;
		background: #fff;
		padding: 22px;
		box-shadow: var(--shadow);
	}

	.ecall-page .dash-top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 0 14px;
		border-bottom: 1px solid #e5e5e5;
	}

	.ecall-page .dots {
		display: flex;
		gap: 6px;
	}

		.ecall-page .dots i {
			display: block;
			width: 8px;
			height: 8px;
			border-radius: 50%;
			background: #dcdcdc;
		}

			.ecall-page .dots i:first-child {
				background: var(--brand);
			}

	.ecall-page .dash-title {
		font-size: 12px;
		color: var(--muted);
		letter-spacing: .06em;
	}

	/* 示意数据标识：不把样机数字包装成客户实绩 */
	.ecall-page .demo-flag {
		display: inline-block;
		font-size: 12px;
		line-height: 18px;
		padding: 0 8px;
		color: var(--muted);
		border: 1px solid #dcdcdc;
		border-radius: 9px;
	}

	.ecall-page .dash-status {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin-top: 13px;
	}

		.ecall-page .dash-status span {
			font-size: 12px;
			line-height: 24px;
			padding: 0 12px;
			background: var(--bg-alt);
			color: var(--body);
		}

			.ecall-page .dash-status span b {
				font-weight: normal;
				color: var(--sub);
			}

	.ecall-page .dash-grid {
		display: grid;
		grid-template-columns: 1.25fr .75fr;
		gap: 14px;
		margin-top: 13px;
	}

	.ecall-page .panel {
		background: var(--bg-alt);
		padding: 16px;
	}

		.ecall-page .panel h4 {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 8px;
			font-size: 14px;
			line-height: 20px;
			font-weight: normal;
			margin: 0 0 12px;
			color: var(--body);
		}

	.ecall-page .kpis {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
	}

	.ecall-page .mini {
		padding: 12px;
		background: var(--bg-alt);
	}

		.ecall-page .mini b {
			display: block;
			font-size: 20px;
			line-height: 26px;
			font-weight: normal;
			color: var(--brand);
		}

		.ecall-page .mini span {
			font-size: 14px;
			line-height: 20px;
			color: var(--body);
		}

	.ecall-page .float-card {
		position: absolute;
		background: #fff;
		box-shadow: var(--shadow);
		padding: 10px 14px;
		font-size: 14px;
		line-height: 22px;
		color: var(--body);
	}

		.ecall-page .float-card b {
			font-weight: normal;
			color: var(--brand);
		}

	.ecall-page .f1 {
		left: -28px;
		bottom: 62px;
	}

	.ecall-page .f2 {
		right: -20px;
		top: 88px;
	}

	/* 数据条：品牌蓝色带 */
	.ecall-page .metric-strip {
		background-image: var(--brand-grad);
	}

	.ecall-page .metric-grid {
		display: grid;
		grid-template-columns: repeat(4,1fr);
	}

	.ecall-page .metric {
		text-align: center;
		padding: 40px 20px;
		border-right: 1px solid rgba(255,255,255,.2);
	}

		.ecall-page .metric:last-child {
			border-right: 0;
		}

		.ecall-page .metric strong {
			display: block;
			font-size: 20px;
			line-height: 28px;
			font-weight: normal;
			color: #fff;
			margin-bottom: 4px;
		}

		.ecall-page .metric span {
			font-size: 14px;
			line-height: 22px;
			color: rgba(255,255,255,.85);
		}

	/* 通用卡片 */
	.ecall-page .cards4,
	.ecall-page .cap-grid {
		display: grid;
		grid-template-columns: repeat(4,1fr);
		gap: 24px;
	}

	.ecall-page .cols3 {
		display: grid;
		grid-template-columns: repeat(3,1fr);
		gap: 24px;
	}

	.ecall-page .cols4 {
		display: grid;
		grid-template-columns: repeat(4,1fr);
		gap: 24px;
	}

	.ecall-page .cols5 {
		display: grid;
		grid-template-columns: repeat(5,1fr);
		gap: 20px;
	}

	.ecall-page .challenge,
	.ecall-page .cap,
	.ecall-page .scene,
	.ecall-page .feature {
		background: #fff;
		box-shadow: var(--shadow);
		transition: .25s ease;
	}

		.ecall-page .challenge:hover,
		.ecall-page .cap:hover,
		.ecall-page .scene:hover,
		.ecall-page .feature:hover {
			box-shadow: var(--shadow-hover);
		}

			.ecall-page .challenge:hover h3,
			.ecall-page .cap:hover h3,
			.ecall-page .scene:hover h3,
			.ecall-page .feature:hover h3 {
				color: var(--brand);
			}

	.ecall-page .challenge {
		padding: 32px 28px;
		min-height: 250px;
	}

	/* 序号：大号数字 + 短横线，悬停时横线延展 */
	.ecall-page .num {
		position: relative;
		display: block;
		padding-bottom: 14px;
		margin-bottom: 20px;
		color: var(--brand);
		font-size: 40px;
		line-height: 44px;
		font-weight: bold;
		letter-spacing: .02em;
	}

		.ecall-page .num::after {
			content: "";
			position: absolute;
			left: 0;
			bottom: 0;
			width: 28px;
			height: 3px;
			background: var(--brand);
			transition: width .3s ease;
		}

	.ecall-page .challenge:hover .num::after {
		width: 60px;
	}

	.ecall-page .challenge p,
	.ecall-page .cap p,
	.ecall-page .scene p,
	.ecall-page .feature p {
		font-size: 16px;
		line-height: 28px;
		color: var(--body);
	}

	/* ==========================================================
   业务链路：全宽横向流程（生产数据 → 上线余量更新）
   ========================================================== */
	.ecall-page .flowline {
		background: #fff;
		box-shadow: var(--shadow);
		padding: 34px 30px 30px;
	}

	.ecall-page .flowline-grid {
		display: grid;
		grid-template-columns: repeat(8,1fr);
		gap: 0;
	}

	.ecall-page .fl-step {
		position: relative;
		padding: 0 10px;
		text-align: center;
	}

		.ecall-page .fl-step:not(:last-child)::after {
			content: "";
			position: absolute;
			top: 19px;
			right: -5px;
			width: 10px;
			height: 10px;
			border-top: 2px solid var(--brand);
			border-right: 2px solid var(--brand);
			transform: rotate(45deg);
		}

	.ecall-page .fl-dot {
		width: 40px;
		height: 40px;
		margin: 0 auto 14px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: var(--brand-soft);
		color: var(--brand);
		font-size: 14px;
	}

		.ecall-page .fl-step.key .fl-dot {
			background-image: var(--brand-grad);
			color: #fff;
		}

	.ecall-page .fl-step b {
		display: block;
		font-size: 16px;
		line-height: 24px;
		font-weight: normal;
		color: var(--sub);
		margin-bottom: 2px;
	}

	.ecall-page .fl-step span {
		display: block;
		font-size: 13px;
		line-height: 20px;
		color: var(--body);
	}

	.ecall-page .loop-note {
		margin-top: 26px;
		padding: 16px 22px;
		border-left: 3px solid var(--brand);
		background: var(--bg-alt);
		font-size: 16px;
		line-height: 28px;
		color: var(--sub);
	}

	.ecall-page .loop-note b {
		font-weight: normal;
		color: var(--brand);
	}

	/* 环节协同表 */
	.ecall-page .sync-table {
		margin-top: 46px;
		background: #fff;
		box-shadow: var(--shadow);
		padding: 8px 28px;
	}

	.ecall-page .sync-row {
		display: grid;
		grid-template-columns: 180px 1fr;
		gap: 24px;
		padding: 16px 0;
		border-bottom: 1px solid #ececec;
		font-size: 16px;
		line-height: 28px;
	}

		.ecall-page .sync-row:last-child {
			border-bottom: 0;
		}

		.ecall-page .sync-row b {
			font-weight: normal;
			color: var(--brand);
		}

		.ecall-page .sync-row span {
			color: var(--body);
		}

	/* ==========================================================
   系统集成：分层架构
   ========================================================== */
	.ecall-page .architecture {
		margin-top: 46px;
		background-image: var(--brand-grad);
		padding: 40px;
		color: #fff;
	}

	.ecall-page .arch-title {
		display: flex;
		justify-content: space-between;
		gap: 30px;
		align-items: flex-end;
		margin-bottom: 26px;
	}

		.ecall-page .arch-title > div > div {
			font-size: 14px !important;
			line-height: 20px;
			color: rgba(255,255,255,.85) !important;
			letter-spacing: .12em !important;
			margin-bottom: 8px !important;
		}

		.ecall-page .arch-title h3 {
			color: #fff !important;
			font-size: 20px !important;
			line-height: 28px;
			margin: 0 !important;
		}

		.ecall-page .arch-title p {
			color: rgba(255,255,255,.88) !important;
			max-width: 560px;
			font-size: 16px;
			line-height: 28px !important;
			margin: 0;
		}

	.ecall-page .arch-layer {
		display: grid;
		grid-template-columns: 170px 1fr;
		gap: 16px;
		align-items: center;
		padding: 10px 0;
		border-bottom: 1px solid rgba(255,255,255,.18);
	}

		.ecall-page .arch-layer:last-child {
			border-bottom: 0;
		}

	.ecall-page .arch-layer .layer-name {
		font-size: 16px;
		line-height: 24px;
		color: #fff;
	}

		.ecall-page .arch-layer .layer-name small {
			display: block;
			font-size: 12px;
			line-height: 18px;
			letter-spacing: .1em;
			color: rgba(255,255,255,.7);
			text-transform: uppercase;
		}

	.ecall-page .arch-layer .layer-items {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
	}

		.ecall-page .arch-layer .layer-items span {
			font-size: 14px;
			line-height: 30px;
			padding: 0 16px;
			background: rgba(255,255,255,.12);
			border: 1px solid rgba(255,255,255,.35);
			color: #fff;
		}

		.ecall-page .arch-layer.core .layer-name,
		.ecall-page .arch-layer.core .layer-items span {
			color: #fff;
		}

		.ecall-page .arch-layer.core .layer-items span {
			background: var(--accent);
			border-color: var(--accent);
		}

	.ecall-page .arch-note {
		margin-top: 20px;
		font-size: 14px !important;
		line-height: 26px;
		color: rgba(255,255,255,.82) !important;
	}

	/* ==========================================================
   核心能力
   ========================================================== */
	.ecall-page .cap {
		padding: 30px 26px;
		border-top: 3px solid var(--brand);
		min-height: 270px;
	}

	.ecall-page .cap-id {
		font-size: 14px;
		line-height: 20px;
		letter-spacing: .04em;
		color: var(--brand);
		margin-bottom: 14px;
	}

	.ecall-page .cap.plain {
		min-height: 220px;
	}

	/* 深色区块卡片 */
	.ecall-page .connect {
		border: 1px solid rgba(255,255,255,.35);
		background: rgba(255,255,255,.08);
		padding: 30px 26px;
		min-height: 230px;
		transition: .25s ease;
	}

		.ecall-page .connect:hover {
			background: rgba(255,255,255,.16);
		}

		.ecall-page .connect .code {
			font-size: 14px;
			line-height: 20px;
			letter-spacing: .08em;
			color: rgba(255,255,255,.85);
			margin-bottom: 14px;
		}

		.ecall-page .connect p {
			font-size: 16px;
			line-height: 28px;
			color: rgba(255,255,255,.88);
		}

	/* ==========================================================
   eCall 专属：料位余量矩阵 / 预警等级 / 任务时间轴
   ========================================================== */
	.ecall-page .mat-row {
		display: grid;
		grid-template-columns: 46px 1fr 54px 66px 52px;
		gap: 8px;
		align-items: center;
		padding: 6px 0;
		border-bottom: 1px solid #e5e5e5;
		font-size: 13px;
		line-height: 20px;
		color: var(--body);
	}

		.ecall-page .mat-row:last-child {
			border-bottom: 0;
		}

		.ecall-page .mat-row.hd {
			font-size: 12px;
			color: var(--muted);
			letter-spacing: .04em;
			padding-bottom: 4px;
		}

		.ecall-page .mat-row em {
			font-style: normal;
			text-align: right;
			color: var(--sub);
		}

	.ecall-page .lv {
		display: inline-block;
		font-size: 12px;
		line-height: 18px;
		padding: 0 6px;
		white-space: nowrap;
	}

		.ecall-page .lv.ok {
			color: #0b7a43;
			background: #e9f6ee;
		}

		.ecall-page .lv.warn {
			color: var(--amber);
			background: var(--amber-soft);
		}

		.ecall-page .lv.crit {
			color: var(--accent);
			background: #fbe8ea;
		}

	/* 预警卡 */
	.ecall-page .warn-card {
		border-left: 3px solid var(--amber);
		background: #fff;
		padding: 12px 14px;
	}

		.ecall-page .warn-card.crit {
			border-left-color: var(--accent);
		}

		.ecall-page .warn-card .wc-top {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 8px;
			margin-bottom: 6px;
			font-size: 13px;
			line-height: 20px;
			color: var(--muted);
		}

		.ecall-page .warn-card b {
			display: block;
			font-size: 15px;
			line-height: 22px;
			font-weight: normal;
			color: var(--sub);
		}

		.ecall-page .warn-card span {
			font-size: 13px;
			line-height: 20px;
			color: var(--body);
		}

	/* 任务时间轴（横向） */
	.ecall-page .timeline {
		display: flex;
		gap: 0;
		margin-top: 14px;
	}

	.ecall-page .tl-step {
		position: relative;
		flex: 1 1 0;
		text-align: center;
		font-size: 12px;
		line-height: 18px;
		padding-top: 20px;
		color: var(--muted);
	}

		.ecall-page .tl-step::before {
			content: "";
			position: absolute;
			top: 5px;
			left: 0;
			right: 0;
			height: 2px;
			background: #e0e0e0;
		}

		.ecall-page .tl-step::after {
			content: "";
			position: absolute;
			top: 0;
			left: 50%;
			width: 12px;
			height: 12px;
			margin-left: -6px;
			border-radius: 50%;
			background: #fff;
			border: 2px solid #d5d5d5;
		}

		.ecall-page .tl-step.done {
			color: var(--brand);
		}

			.ecall-page .tl-step.done::before {
				background: var(--brand);
			}

			.ecall-page .tl-step.done::after {
				background: var(--brand);
				border-color: var(--brand);
			}

		.ecall-page .tl-step.now {
			color: var(--brand);
			font-weight: normal;
		}

			.ecall-page .tl-step.now::after {
				background: #fff;
				border-color: var(--brand);
				box-shadow: 0 0 0 3px rgba(1,64,153,.18);
			}

	/* 竖向状态时间轴（仓库配送闭环） */
	.ecall-page .trace {
		background: #fff;
		box-shadow: var(--shadow);
		padding: 30px 28px;
	}

	.ecall-page .trace-title {
		font-size: 14px;
		line-height: 20px;
		color: var(--muted);
		letter-spacing: .06em;
		margin-bottom: 20px;
	}

	.ecall-page .trace-step {
		position: relative;
		display: grid;
		grid-template-columns: 20px 1fr auto;
		gap: 14px;
		align-items: start;
		padding: 0 0 24px;
	}

		.ecall-page .trace-step:last-child {
			padding-bottom: 0;
		}

		.ecall-page .trace-step::before {
			content: "";
			position: absolute;
			left: 6px;
			top: 16px;
			bottom: 0;
			width: 1px;
			background: #e0e0e0;
		}

		.ecall-page .trace-step:last-child::before {
			display: none;
		}

	.ecall-page .trace-dot {
		width: 13px;
		height: 13px;
		margin-top: 5px;
		border-radius: 50%;
		border: 2px solid #d5d5d5;
		background: #fff;
	}

	.ecall-page .trace-step.done .trace-dot {
		background: var(--brand);
		border-color: var(--brand);
	}

	.ecall-page .trace-step.now .trace-dot {
		border-color: var(--brand);
		box-shadow: 0 0 0 3px rgba(1,64,153,.18);
	}

	.ecall-page .trace-step.fail .trace-dot {
		border-color: var(--accent);
		background: var(--accent);
	}

	.ecall-page .trace-step b {
		display: block;
		font-size: 16px;
		line-height: 24px;
		font-weight: normal;
		color: var(--sub);
	}

	.ecall-page .trace-step span {
		font-size: 14px;
		line-height: 22px;
		color: var(--body);
	}

	.ecall-page .trace-step em {
		font-style: normal;
		font-size: 13px;
		line-height: 22px;
		color: var(--muted);
		white-space: nowrap;
	}

	/* 任务详情卡 */
	.ecall-page .task-card {
		background: #fff;
		box-shadow: var(--shadow);
		padding: 26px;
	}

		.ecall-page .task-card .tc-head {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 12px;
			padding-bottom: 14px;
			border-bottom: 1px solid #e5e5e5;
			margin-bottom: 4px;
		}

		.ecall-page .task-card h3 {
			font-size: 20px;
			line-height: 28px;
			margin: 0;
		}

	.ecall-page .task-line {
		display: grid;
		grid-template-columns: 96px 1fr;
		gap: 12px;
		padding: 9px 0;
		border-bottom: 1px dashed #e5e5e5;
		font-size: 15px;
		line-height: 24px;
	}

		.ecall-page .task-line:last-of-type {
			border-bottom: 0;
		}

		.ecall-page .task-line span {
			color: var(--muted);
		}

		.ecall-page .task-line b {
			font-weight: normal;
			color: var(--sub);
		}

	.ecall-page .task-steps {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin-top: 16px;
		padding-top: 16px;
		border-top: 1px solid #e5e5e5;
	}

		.ecall-page .task-steps span {
			font-size: 13px;
			line-height: 24px;
			padding: 2px 12px;
			border: 1px solid var(--brand);
			border-radius: 13px;
			color: var(--brand);
		}

	/* 双栏（文案 + 图） */
	.ecall-page .split {
		display: grid;
		grid-template-columns: 44% 56%;
		gap: 58px;
		align-items: center;
	}

		.ecall-page .split .quote {
			border-left: 3px solid var(--brand);
			background: var(--bg-alt);
			padding: 18px 22px;
			font-size: 16px;
			line-height: 28px;
			color: var(--sub);
			margin: 28px 0;
		}

	/* 预警等级说明条 */
	.ecall-page .level-list {
		background: #fff;
		box-shadow: var(--shadow);
		padding: 12px 24px;
	}

	.ecall-page .level-item {
		display: grid;
		grid-template-columns: 96px 1fr 150px;
		gap: 16px;
		align-items: center;
		padding: 14px 0;
		border-bottom: 1px solid #ececec;
		font-size: 15px;
		line-height: 24px;
	}

		.ecall-page .level-item:last-child {
			border-bottom: 0;
		}

		.ecall-page .level-item b {
			font-weight: normal;
			color: var(--sub);
		}

		.ecall-page .level-item span {
			color: var(--body);
		}

		.ecall-page .level-item em {
			font-style: normal;
			text-align: right;
			color: var(--muted);
			font-size: 14px;
		}

	/* 终端场景卡 */
	.ecall-page .terminal {
		background: #fff;
		box-shadow: var(--shadow);
		border-top: 3px solid var(--brand);
		padding: 28px 26px;
		transition: .25s ease;
	}

		.ecall-page .terminal:hover {
			box-shadow: var(--shadow-hover);
		}

	.ecall-page .terminal .term-id {
		font-size: 14px;
		line-height: 20px;
		letter-spacing: .06em;
		color: var(--brand);
		margin-bottom: 12px;
	}

	.ecall-page .terminal p {
		font-size: 15px;
		line-height: 26px;
		color: var(--body);
	}

	.ecall-page .terminal ul {
		margin: 14px 0 0;
		padding: 0;
		list-style: none;
	}

		.ecall-page .terminal ul li {
			position: relative;
			padding-left: 14px;
			font-size: 14px;
			line-height: 24px;
			color: var(--body);
		}

			.ecall-page .terminal ul li::before {
				content: "";
				position: absolute;
				left: 0;
				top: 10px;
				width: 5px;
				height: 5px;
				border-radius: 50%;
				background: var(--brand);
			}

	/* 分支流程 */
	.ecall-page .branches {
		display: grid;
		grid-template-columns: repeat(3,1fr);
		gap: 20px;
		margin-top: 46px;
	}

	.ecall-page .branch {
		background: #fff;
		box-shadow: var(--shadow);
		border-left: 3px solid var(--brand);
		padding: 24px 24px 22px;
	}

		.ecall-page .branch.warn {
			border-left-color: var(--amber);
		}

		.ecall-page .branch.crit {
			border-left-color: var(--accent);
		}

	.ecall-page .branch b {
		display: block;
		font-size: 18px;
		line-height: 26px;
		font-weight: normal;
		color: var(--sub);
		margin-bottom: 8px;
	}

	.ecall-page .branch p {
		font-size: 15px;
		line-height: 26px;
		color: var(--body);
	}

	.ecall-page .branch .entry {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin-top: 14px;
	}

		.ecall-page .branch .entry span {
			font-size: 13px;
			line-height: 22px;
			padding: 1px 12px;
			background: var(--bg-alt);
			color: var(--sub);
		}

	/* 典型场景 */
	.ecall-page .scene {
		padding: 28px 22px;
		min-height: 210px;
	}

		.ecall-page .scene .line {
			width: 34px;
			height: 3px;
			background: var(--brand);
			margin-bottom: 20px;
		}

		.ecall-page .scene h3 {
			font-size: 20px;
		}

		.ecall-page .scene p {
			font-size: 14px;
			line-height: 24px;
		}

	/* 价值卡（深色） */
	.ecall-page .value {
		border: 1px solid rgba(255,255,255,.35);
		background: rgba(255,255,255,.08);
		padding: 28px 24px;
		min-height: 240px;
		transition: .25s ease;
	}

		.ecall-page .value:hover {
			background: rgba(255,255,255,.16);
		}

		.ecall-page .value .v-id {
			font-size: 13px;
			line-height: 20px;
			letter-spacing: .08em;
			color: rgba(255,255,255,.8);
			margin-bottom: 12px;
		}

		.ecall-page .value h3 {
			color: #fff;
			font-size: 20px;
			line-height: 28px;
		}

		.ecall-page .value p {
			font-size: 14px;
			line-height: 24px;
			color: rgba(255,255,255,.88);
		}

	.ecall-page .value-note {
		margin-top: 30px;
		text-align: center;
		font-size: 14px !important;
		line-height: 24px;
		color: rgba(255,255,255,.75) !important;
	}

	/* 常见问题：复用 style2.css 的 cp_section6 */
	.ecall-page .cp_section6 .faq-lead {
		text-align: center;
		margin: -22px 0 46px;
		font-size: 16px;
		line-height: 30px;
		color: #666;
	}

	/* 底部 CTA */
	.ecall-page .cta {
		clear: both;
		padding: 80px 0;
		background-image: var(--brand-grad);
		color: #fff;
	}

	.ecall-page .cta-inner {
		display: flex;
		justify-content: space-between;
		gap: 40px;
		align-items: center;
	}

	.ecall-page .cta h2 {
		color: #fff;
		font-size: 30px;
		line-height: 40px;
		margin-bottom: 10px;
	}

	.ecall-page .cta p {
		margin: 0;
		color: rgba(255,255,255,.88);
		max-width: 820px;
	}

	/* 滚动淡入 */
	.ecall-page .reveal {
		opacity: 0;
		transform: translateY(20px);
		transition: opacity .65s ease, transform .65s ease;
	}

		.ecall-page .reveal.show {
			opacity: 1;
			transform: none;
		}

@media (max-width: 1700px) {
	.ecall-page .container {
		width: 90%;
	}
}

@media (max-width: 1500px) {
	.ecall-page .container {
		width: 87%;
	}

	.ecall-page .hero h1 {
		font-size: 46px;
		line-height: 54px;
	}

	.ecall-page .hero h2 {
		font-size: 26px;
		line-height: 36px;
	}

	.ecall-page .flowline-grid {
		grid-template-columns: repeat(4,1fr);
		row-gap: 26px;
	}

		.ecall-page .fl-step:nth-child(4n)::after {
			display: none;
		}
}

/* 1300px 以下顶部菜单高度为 70px */
@media (max-width: 1300px) {
	.ecall-page {
		margin-top: 70px;
	}
}

@media (max-width: 1280px) {
	.ecall-page .cards4,
	.ecall-page .cap-grid,
	.ecall-page .cols4,
	.ecall-page .cols5 {
		grid-template-columns: repeat(2,1fr);
	}

	.ecall-page .hero-grid {
		gap: 40px;
	}

	.ecall-page .split {
		gap: 40px;
	}
}

@media (max-width: 1024px) {
	.ecall-page .container {
		width: 100%;
		padding: 0 15px;
	}

	.ecall-page .section {
		padding: 30px 0;
	}

	.ecall-page {
		margin-top: 50px;
	}

	.ecall-page .hero {
		padding: 30px 0;
	}

		.ecall-page .hero h1 {
			font-size: 30px;
			line-height: 38px;
		}

		.ecall-page .hero h2 {
			font-size: 18px;
			line-height: 26px;
		}

	.ecall-page .hero-copy .claim {
		font-size: 16px;
		line-height: 26px;
	}

	.ecall-page section h1,
	.ecall-page section h2 {
		font-size: 18px;
		line-height: 24px;
		margin-bottom: 12px;
	}

	.ecall-page section h3,
	.ecall-page .scene h3,
	.ecall-page .value h3 {
		font-size: 16px;
		line-height: 24px;
		margin-bottom: 8px;
	}

	.ecall-page,
	.ecall-page .lead,
	.ecall-page .hero-copy p,
	.ecall-page .challenge p,
	.ecall-page .cap p,
	.ecall-page .scene p,
	.ecall-page .feature p,
	.ecall-page .connect p,
	.ecall-page .quote,
	.ecall-page .arch-title p,
	.ecall-page .loop-note,
	.ecall-page .sync-row {
		font-size: 14px !important;
		line-height: 24px !important;
	}

	.ecall-page .hero-grid,
	.ecall-page .split {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.ecall-page .section-head {
		margin-bottom: 20px;
	}

	.ecall-page .btn {
		min-width: 100px;
		height: 34px;
		padding: 0 22px;
		font-size: 14px;
		border-radius: 17px;
	}

	.ecall-page .metric-grid {
		grid-template-columns: repeat(2,1fr);
	}

	.ecall-page .metric {
		padding: 20px 10px;
	}

		.ecall-page .metric:nth-child(2) {
			border-right: 0;
		}

		.ecall-page .metric:nth-child(-n+2) {
			border-bottom: 1px solid rgba(255,255,255,.2);
		}

		.ecall-page .metric strong {
			font-size: 16px;
		}

	.ecall-page .num {
		font-size: 28px;
		line-height: 32px;
		padding-bottom: 10px;
		margin-bottom: 12px;
	}

	.ecall-page .challenge,
	.ecall-page .cap,
	.ecall-page .scene,
	.ecall-page .connect,
	.ecall-page .terminal,
	.ecall-page .value,
	.ecall-page .cap.plain {
		min-height: 0;
		padding: 18px 14px;
	}

	.ecall-page .flowline {
		padding: 20px 14px;
	}

	.ecall-page .fl-step {
		text-align: left;
		display: grid;
		grid-template-columns: 40px 1fr;
		gap: 12px;
		align-items: center;
		padding: 0;
	}

		.ecall-page .fl-step::after {
			display: none;
		}

	.ecall-page .fl-dot {
		margin: 0;
	}

	.ecall-page .fl-step b,
	.ecall-page .fl-step span {
		grid-column: 2;
	}

	.ecall-page .fl-step b {
		font-size: 15px;
		line-height: 22px;
	}

	.ecall-page .loop-note {
		padding: 12px 14px;
		margin-top: 16px;
	}

	.ecall-page .sync-table {
		padding: 4px 14px;
		margin-top: 20px;
	}

	.ecall-page .sync-row {
		grid-template-columns: 1fr;
		gap: 2px;
		padding: 12px 0;
	}

	.ecall-page .architecture {
		padding: 18px 14px;
		margin-top: 20px;
	}

	.ecall-page .arch-title {
		display: block;
		margin-bottom: 16px;
	}

	.ecall-page .arch-layer {
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 12px 0;
	}

		.ecall-page .arch-layer .layer-items span {
			font-size: 13px;
			line-height: 26px;
			padding: 0 12px;
		}

	.ecall-page .branches,
	.ecall-page .cols3 {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.ecall-page .trace,
	.ecall-page .task-card {
		padding: 18px 14px;
	}

	.ecall-page .level-list {
		padding: 8px 14px;
	}

	.ecall-page .level-item {
		grid-template-columns: 76px 1fr;
		gap: 10px;
		padding: 12px 0;
		font-size: 14px;
		line-height: 22px;
	}

		.ecall-page .level-item em {
			grid-column: 2;
			text-align: left;
		}

	.ecall-page .cp_section6 .faq-lead {
		margin: -2px 0 14px;
		font-size: 14px;
		line-height: 24px;
	}

	.ecall-page .cta {
		padding: 30px 0;
	}

	.ecall-page .cta-inner {
		display: block;
	}

	.ecall-page .cta h2 {
		font-size: 18px;
		line-height: 26px;
	}

	.ecall-page .cta .actions {
		margin-top: 18px;
	}

	.ecall-page .f1,
	.ecall-page .f2 {
		display: none;
	}
}

@media (max-width: 768px) {
	.ecall-page .cards4,
	.ecall-page .cap-grid,
	.ecall-page .cols4,
	.ecall-page .cols5,
	.ecall-page .branches {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.ecall-page .flowline-grid {
		grid-template-columns: 1fr;
		row-gap: 18px;
	}

	.ecall-page .dash-grid {
		grid-template-columns: 1fr;
	}

	.ecall-page .mat-row {
		grid-template-columns: 40px 1fr 48px 58px 48px;
		font-size: 12px;
	}

	.ecall-page .timeline {
		flex-wrap: wrap;
		row-gap: 14px;
	}

	.ecall-page .tl-step {
		flex: 1 1 33%;
	}
}

/* ==========================================================
   相关产品：复用官网 cp_section5，本地覆盖为与页面一致的卡片风格
   ========================================================== */
.ecall-related.cp_section5 {
	position: relative;
	overflow: hidden;
	background: linear-gradient(180deg, #eef4ff 0%, #f7faff 60%, #fff 100%);
	font-family: 'Noto Sans SC', "Microsoft YaHei", "PingFang SC", sans-serif;
}

	.ecall-related.cp_section5::before {
		content: "";
		position: absolute;
		inset: 0;
		background-image: radial-gradient(rgba(1,64,153,.09) 1px, transparent 1px);
		background-size: 22px 22px;
		pointer-events: none;
	}

	.ecall-related.cp_section5 .max-width {
		position: relative;
	}

	.ecall-related.cp_section5 .ecall-related-label {
		display: block;
		text-align: center;
		color: #014099;
		font-size: 14px;
		line-height: 20px;
		letter-spacing: .12em;
		margin-bottom: 10px;
	}

	.ecall-related.cp_section5 h6 {
		font-weight: normal;
		margin-bottom: 46px;
	}

	.ecall-related.cp_section5 .ul a {
		position: relative;
		display: block;
		overflow: hidden;
		padding: 0 0 26px;
		background: #fff;
		box-shadow: 0 6px 22px rgba(1,64,153,.12);
		transition: transform .25s ease, box-shadow .25s ease;
	}

		.ecall-related.cp_section5 .ul a:hover {
			transform: translateY(-6px);
			box-shadow: 0 14px 34px rgba(1,64,153,.28);
		}

		.ecall-related.cp_section5 .ul a::before {
			content: "";
			display: block;
			height: 76px;
			background-image: linear-gradient(135deg, #004bb5, #01419a 60%, #0a5bd6);
		}

		.ecall-related.cp_section5 .ul a::after {
			content: "";
			position: absolute;
			left: 0;
			bottom: 0;
			width: 0;
			height: 3px;
			background: #e60012;
			transition: width .3s ease;
		}

		.ecall-related.cp_section5 .ul a:hover::after {
			width: 100%;
		}

	.ecall-related.cp_section5 .ul .bt {
		position: relative;
		margin: -76px 0 0;
		height: 76px;
		padding: 0 28px;
		line-height: 76px;
		color: #fff;
		font-size: 20px;
		text-align: left;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.ecall-related.cp_section5 .ul a:hover .bt {
		color: #fff;
	}

	.ecall-related.cp_section5 .ul .info {
		padding: 22px 28px 0;
		margin-bottom: 18px;
		min-height: 140px;
		text-align: left;
		line-height: 28px;
	}

	.ecall-related.cp_section5 .ul .btn {
		width: auto;
		margin: 0 0 0 28px;
		padding: 0;
		color: #014099;
		background: none;
		border-radius: 0;
		text-align: left;
		line-height: 24px;
	}

		.ecall-related.cp_section5 .ul .btn::after {
			content: " \2192";
			transition: margin-left .2s ease;
		}

	.ecall-related.cp_section5 .ul a:hover .btn {
		color: #e60012;
		background: none;
	}

		.ecall-related.cp_section5 .ul a:hover .btn::after {
			margin-left: 6px;
		}

@media (max-width: 1024px) {
	.ecall-related.cp_section5 h6 {
		margin-bottom: 20px;
	}

	.ecall-related.cp_section5 .ul a {
		padding: 0 0 16px;
	}

		.ecall-related.cp_section5 .ul a::before,
		.ecall-related.cp_section5 .ul .bt {
			height: 56px;
			line-height: 56px;
			padding: 0 14px;
		}

	.ecall-related.cp_section5 .ul .bt {
		margin-top: -56px;
		font-size: 18px;
	}

	.ecall-related.cp_section5 .ul .info {
		padding: 14px 14px 0;
		min-height: 110px;
		line-height: 24px;
	}

	.ecall-related.cp_section5 .ul .btn {
		margin-left: 14px;
	}
}