/**
 * Qing 公司简介 + 数据统计小部件样式（1:1 复刻源码 #c_static_001-1739000364613）。
 *
 * 说明：为与源码「完全相同」，所有字号 / 图标尺寸 / 间距均采用源码的固定像素值，
 * 并复刻源码的断点（≥1401 基准、1280–1400、1025–1279、≤768）。颜色可通过
 * Elementor 控件自定义（CSS 变量），其余尺寸严格对齐源码、不做缩放。
 *
 * 结构：.qing-ci
 *   > .qing-ci-top（源码 e_container-1，两列）
 *       > .qing-ci-left（cbox-1-0：flex 0 0 40% + padding-right 150px）
 *           > .qing-ci-sinceline（e_container-13：align-items flex-end）
 *               > .qing-ci-since（e_text-15：30px）
 *               + .qing-ci-year（e_richText-14：90px 蓝 #0562b9 + 投影，左内边距 20）
 *           > .qing-ci-tagline（e_richText-16：30px 黑 gilroy-bold，上间距 15）
 *       > .qing-ci-right（cbox-1-1）
 *           > .qing-ci-name（e_text-19：30px #1c59ad gilroy-bold）
 *           + hr.qing-ci-line（e_line-20：宽 50 高 2 #1c59ad）
 *           + .qing-ci-desc（e_richText-2：16px 黑 行高 1.8）
 *   > .qing-ci-stats（e_container-7：上边框 1px #ddd + 上间距 70）
 *       > .qing-ci-stat（p_loopitem：≥769 时 25% 等分，项间竖线）
 *           > .qing-ci-stat-inner（e_container-9：横向，宽度按内容、整体居中）
 *               > .qing-ci-stat-icon（e_icon-18：80×80 蓝圆 + padding 15 + 白图标）
 *               + .qing-ci-stat-text（cbox-9-1：左内边距 10）
 *                   > .qing-ci-stat-num(.qing-ci-num 56 + .qing-ci-suffix 18)
 *                   + .qing-ci-stat-label（e_text-11：16px）
 *
 * @package Qing
 */

/* ============ 字体（对齐源码）============ */
/* 大数字（年份 / 统计数字）：Montserrat-Bold（源码 UUID 命名，主题本地 woff2）。 */
@font-face {
	font-family: "488065df-3953-4787-9862-dc1a826f0fba";
	src: url(../static/font/488065df-3953-4787-9862-dc1a826f0fba.woff2) format("woff2");
	font-display: swap;
}

/* 标题（公司名 / 标语）：Gilroy Bold（源码从 CDN 加载 otf）。 */
@font-face {
	font-family: "gilroy-bold";
	src: url(https://omo-oss-file110.thefastfile.com/portal-saas/pg2025091621504639434/cms/file/gilroy-bold.otf) format("opentype");
	font-display: swap;
}

/* ============ 容器 ============ */
.qing-ci {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	color: #000000;
}

.qing-ci * {
	box-sizing: border-box;
}

/* ============ 上半区：两列（源码 e_container-1）============ */
.qing-ci-top {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	width: 100%;
	align-items: flex-start;
}

/* 左列（源码 cbox-1-0：flex 0 0 30%）。
   两列间距用左列的右外边距 margin-right（而非 column-gap，也不是 padding-right）：
   margin 在 30% 宽度盒之外，真正把右列往右推、间距随控件值变化，
   且不会被其它 gap 规则覆盖，也不会被列宽「吃掉」——所以控件一定生效。 */
.qing-ci-left {
	flex: 0 0 var(--qing-ci-left-width, 30%);
	max-width: var(--qing-ci-left-width, 30%);
	min-width: 0;
	margin-right: var(--qing-ci-left-pad, 150px);
}

/* 左列下滑吸顶（源码 .e_container-3：position:sticky; top:100px，仅桌面 ≥769）。
   右列长文向上滚动时，左列（SINCE/年份/标语）吸顶停住，滚过整段后再随之离开。
   吸顶开关由 .qing-ci--sticky-left 控制；吸顶距顶偏移由 --qing-ci-sticky-top 控制。
   仅 ≥769px 生效——手机端两列已堆叠为单列，吸顶无意义且会错位。 */
@media screen and (min-width: 769px) {
	.qing-ci--sticky-left .qing-ci-left {
		position: -webkit-sticky;
		position: sticky;
		top: var(--qing-ci-sticky-top, 100px);
		align-self: flex-start;
	}
}

/* 右列（源码 cbox-1-1：占剩余空间）。 */
.qing-ci-right {
	flex: 1 1 0;
	min-width: 0;
}

/* SINCE + 年份行（源码 e_container-13：底部对齐）。 */
.qing-ci-sinceline {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
}

/* SINCE 标签（源码 e_text-15：30px，深色 #212121，下间距 10）。
   字号用 CSS 变量（默认源码值），由「SINCE 字号」响应式控件驱动，可全面自定义。 */
.qing-ci-since {
	margin: 0 0 10px;
	color: var(--qing-ci-since-color, #212121);
	font-family: "488065df-3953-4787-9862-dc1a826f0fba", "Montserrat", Arial, sans-serif;
	font-size: var(--qing-ci-since-fs, 30px);
	line-height: normal;
}

/* 年份（源码 e_richText-14：90px，蓝 #0562b9 + 投影；cbox-13-1 左内边距 20）。 */
.qing-ci-year {
	margin: 0;
	padding-left: 20px;
	color: var(--qing-ci-year-color, #0562b9);
	font-family: "488065df-3953-4787-9862-dc1a826f0fba", "Montserrat", Arial, sans-serif;
	font-size: var(--qing-ci-year-fs, 90px);
	line-height: 1;
	text-shadow: 0 20px 13px rgba(5, 98, 185, 0.15);
}

/* 标语（源码 e_richText-16：30px，黑，行高 1.2，gilroy-bold，上间距 15）。 */
.qing-ci-tagline {
	margin: var(--qing-ci-tagline-gap, 15px) 0 0;
	color: var(--qing-ci-tagline-color, #000000);
	font-family: "gilroy-bold", "Helvetica Neue", Arial, sans-serif;
	font-size: var(--qing-ci-tagline-fs, 30px);
	line-height: 1.2;
}

/* 公司名（源码 e_text-19：30px，#1c59ad，gilroy-bold）。
   与分隔线的间距放在这里的下外边距上（而非 hr 的上外边距）：更可靠，
   不受主题全局 hr 样式覆盖、也不会被相邻外边距折叠影响。 */
.qing-ci-name {
	margin: var(--qing-ci-name-gap, 0px) 0 var(--qing-ci-line-top-gap, 18px);
	color: var(--qing-ci-name-color, #1c59ad);
	font-family: "gilroy-bold", "Helvetica Neue", Arial, sans-serif;
	font-size: var(--qing-ci-name-fs, 30px);
	font-weight: normal;
	line-height: normal;
}

/* 分隔线（源码 e_line-20：50px 宽，2px 高，#1c59ad，左对齐）。
   长度可自定义；与上方公司名的间距由 .qing-ci-name 的下外边距控制；
   与下方简介的固定间距 18px。 */
.qing-ci-line {
	display: block;
	width: var(--qing-ci-line-w, 50px);
	height: 2px;
	margin: 0 0 18px !important;
	border: 0;
	border-top: 2px solid var(--qing-ci-line-color, #1c59ad);
	background: none;
}

/* 简介（源码 e_richText-2：16px，黑，行高 1.8；段落下间距 15）。 */
.qing-ci-desc {
	margin-top: var(--qing-ci-desc-gap, 0px);
	color: var(--qing-ci-desc-color, #000000);
	font-size: var(--qing-ci-desc-fs, 16px);
	line-height: var(--qing-ci-desc-lh, 1.8);
}

.qing-ci-desc p {
	margin: 0;
	padding-bottom: 15px;
}

.qing-ci-desc p:last-child {
	padding-bottom: 0;
}

/* ============ 下半区：数据统计（源码 e_container-7）============ */
.qing-ci-stats {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	margin-top: var(--qing-ci-stats-mt, 70px);
	padding-top: var(--qing-ci-stats-pt, 70px);
	border-top: 1px solid var(--qing-ci-divider-color, #dddddd);
}

/* 单项（源码 ≥769 时 p_loopitem 占 25%、内容整体居中）。 */
.qing-ci-stat {
	position: relative;
	flex: 0 0 25%;
	max-width: 25%;
	display: flex;
	justify-content: center;
	min-width: 0;
}

/* 项间竖直分隔线（源码 nth-child(1..3) border-right #ddd）：
   每 4 列一组，非第 4 个都画右侧竖线，兼容多行。 */
.qing-ci-stat:not(:nth-child(4n))::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 1px;
	height: 70%;
	background-color: var(--qing-ci-divider-color, #dddddd);
}

/* 图标 + 文本横向组合（源码 e_container-9：align-items center，宽度按内容居中）。 */
.qing-ci-stat-inner {
	display: flex;
	align-items: center;
	width: max-content;
	max-width: 100%;
	margin-top: var(--qing-ci-stat-row-gap, 0px);
}

/* 图标圆底（源码 e_icon-18：80×80 蓝圆 #0562b9 + padding 15 + 白图标）。 */
.qing-ci-stat-icon {
	flex: 0 0 auto;
	align-self: center;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--qing-ci-icon-size, 80px);
	height: var(--qing-ci-icon-size, 80px);
	padding: var(--qing-ci-icon-pad, 15px);
	border-radius: 50%;
	background-color: var(--qing-ci-icon-bg, #0562b9);
	color: var(--qing-ci-icon-color, #ffffff);
}

.qing-ci-stat-icon svg {
	width: 100%;
	height: 100%;
	margin: 0;
	fill: currentColor;
}

.qing-ci-stat-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.qing-ci-stat-icon i {
	font-size: 50px;
	line-height: 1;
}

/* 文本块（源码 cbox-9-1：左内边距 10）。 */
.qing-ci-stat-text {
	padding-left: var(--qing-ci-icon-gap, 10px);
	min-width: 0;
}

/* 数字行（源码 e_scrollNumber-10：高 56 / 行高 56）。 */
.qing-ci-stat-num {
	display: flex;
	align-items: baseline;
	height: 56px;
	line-height: 56px;
}

/* 数字（源码 .p_num：56px，Montserrat，黑）。 */
.qing-ci-num {
	color: var(--qing-ci-num-color, #000000);
	font-family: "488065df-3953-4787-9862-dc1a826f0fba", "Montserrat", Arial, sans-serif;
	font-size: var(--qing-ci-num-fs, 56px);
	line-height: 1;
}

/* 后缀（源码 .p_plus：18px，黑，左移 -5px 贴近数字）。 */
.qing-ci-suffix {
	/* 数字与后缀间的小间距。源码用 -5px 依赖数字字体自带尾隙，
	   但本地字体度量不同会导致重合，故改用正的小间距，确保 +/㎡ 不叠到数字上。 */
	margin-left: 4px;
	color: var(--qing-ci-suffix-color, #000000);
	font-size: var(--qing-ci-suffix-fs, 18px);
	font-weight: normal;
	line-height: 1;
}

/* 说明文字（源码 e_text-11：16px，黑，行高 1.5）。 */
.qing-ci-stat-label {
	margin: var(--qing-ci-label-gap, 0px) 0 0;
	color: var(--qing-ci-label-color, #000000);
	font-size: var(--qing-ci-label-fs, 16px);
	line-height: 1.5;
}

.qing-ci-empty {
	padding: 30px;
	text-align: center;
	color: #999;
	background: #f7f8fa;
	border-radius: 8px;
}

/* 图标兜底：即便某处样式被覆盖，也强制 SVG/图片按图标盒尺寸显示，避免 SVG 自带
   width/height 属性（如 600）导致巨大。 */
.qing-ci-stat-icon > svg,
.qing-ci-stat-icon > img {
	width: 100% !important;
	height: 100% !important;
}

/* ============ 断点：1280–1400（源码同名 @media）============
   字号改为「设置 CSS 变量默认值」而非直接写 font-size：这样 Elementor 排版 / 字号
   控件（选择器特异性更高）设置时始终能覆盖，未设置时仍保留源码的响应式字号。 */
@media screen and (max-width: 1400px) and (min-width: 1280px) {
	.qing-ci {
		--qing-ci-year-fs: 80px;
		--qing-ci-tagline-fs: 36px;
		--qing-ci-name-fs: 30px;
		--qing-ci-desc-fs: 16px;
		--qing-ci-num-fs: 46px;
		--qing-ci-label-fs: 14px;
	}
}

/* ============ 断点：1025–1279（源码同名 @media）============ */
@media screen and (max-width: 1279px) and (min-width: 1025px) {
	.qing-ci {
		--qing-ci-num-fs: 40px;
	}
}

/* ============ 断点：≤768（源码 @media max-width:768）============ */
@media screen and (max-width: 768px) {
	/* 上半区堆叠为单列，左列去掉右内边距。 */
	.qing-ci-top {
		flex-direction: column;
	}
	.qing-ci-left,
	.qing-ci-right {
		flex: 1 1 100%;
		max-width: 100%;
		width: 100%;
		padding-right: 0;
		/* 堆叠时清除左列右外边距，避免多出横向间距。 */
		margin-right: 0;
	}

	/* 手机端字号改为设置 CSS 变量默认值：Elementor 字号/排版控件设置时可覆盖。 */
	.qing-ci {
		--qing-ci-since-fs: 20px;
		--qing-ci-year-fs: 60px;
		--qing-ci-tagline-fs: 24px;
		--qing-ci-name-fs: 22px;
		--qing-ci-desc-fs: 14px;
		--qing-ci-desc-lh: 1.6;
		--qing-ci-num-fs: 30px;
		--qing-ci-suffix-fs: 14px;
		--qing-ci-label-fs: 12px;
	}
	.qing-ci-since {
		margin-bottom: 5px;
	}
	.qing-ci-year {
		padding-left: 10px;
	}
	.qing-ci-name {
		margin-top: 20px;
	}
	.qing-ci-desc {
		margin-top: 20px;
	}

	/* 统计区：上间距缩小（源码 padding-top 10 / margin-top 20）。 */
	.qing-ci-stats {
		margin-top: 20px;
		padding-top: 10px;
	}

	/* 统计项降为 2 列（源码 flex-basis 50%）。
	   源码手机端：居中(justify-content:center)与 max-content 仅在 ≥769 生效，
	   故手机端这里取消居中、内容左对齐、占满整格（对齐源码 e_container-9 width:100%）。 */
	.qing-ci-stat {
		flex: 0 0 50%;
		max-width: 50%;
		justify-content: flex-start;
	}
	.qing-ci-stat-inner {
		width: 100%;
		margin-top: 25px;
	}

	/* 手机端取消竖直分隔线（源码分隔线仅 ≥769 出现）。 */
	.qing-ci-stat:not(:nth-child(4n))::after {
		display: none;
	}

	/* 图标缩小（源码 45×45 / padding 8）：改为设置变量默认值，控件可覆盖。 */
	.qing-ci {
		--qing-ci-icon-size: 45px;
		--qing-ci-icon-pad: 8px;
	}
	.qing-ci-stat-icon i {
		font-size: 29px;
	}

	/* 数字行高度（字号由上面的 CSS 变量控制，可被控件覆盖）。 */
	.qing-ci-stat-num {
		height: 30px;
		line-height: 30px;
	}

	/* 手机端后缀与数字留出间隙：桌面用 -5px 贴近数字，但小字号下会与数字重合，
	   故手机端改为正的小间距（对齐源码手机端「数字 + 空格 + 后缀」的观感）。 */
	.qing-ci-suffix {
		margin-left: 4px;
	}
	.qing-ci-stat-label {
		margin-top: 10px;
	}
}