/* ============================================================
   全站响应式增强 —— index 风格整页（index/fz/yxwzjs/tags/lxfs/zsjm/gywm）
   断点：1024 平板横屏 / 900 平板竖屏 / 640 手机
   在各页 </head> 前引入，晚于内联 <style> 加载，可安全覆盖
   ============================================================ */

/* ---------- 平板横屏 ≤1024px ---------- */
@media (max-width: 1024px) {
    .container { padding: 0 20px; }
    .hero { padding: 56px 0 64px; }
    .hero-content h1 { font-size: 2.8rem; }
    .hero-desc { max-width: 100%; }
}

/* ---------- 平板竖屏 / 大屏手机 ≤900px ---------- */
@media (max-width: 900px) {
    /* Hero 区改纵向居中 */
    .hero-grid { flex-direction: column; text-align: center; }
    .hero-content { flex: none; width: 100%; }
    .hero-desc { margin-left: auto; margin-right: auto; }
    .hero-stats { justify-content: center; gap: 24px; flex-wrap: wrap; }
    .stat-item { text-align: center; }

    /* 页脚纵向堆叠 */
    .footer-grid { flex-direction: column; align-items: center; text-align: center; gap: 28px; }
    .footer-grid .bank-info { text-align: center; }
    .qr-area { justify-content: center; }

    /* 内页横幅类 hero 收紧 */
    .gywm-hero, .zsjm-hero { padding: 56px 0 52px; }
    .gywm-hero h1, .zsjm-hero h1 { font-size: 2.1rem; }

    /* CTA 区块 */
    .zsjm-cta, .gywm-cta { padding: 40px 28px; }
    .zsjm-cta .form-group { flex-wrap: wrap; }
}

/* ---------- 手机 ≤640px ---------- */
@media (max-width: 640px) {
    .container { padding: 0 16px; }

    /* Hero */
    .hero { padding: 40px 0 48px; }
    .hero-content h1 { font-size: 1.9rem; }
    .hero-desc { font-size: 1rem; margin-bottom: 24px; }
    .hero-stats { gap: 16px; margin-top: 24px; }
    .stat-number { font-size: 1.5rem; }

    /* 标题类 */
    .section-title { font-size: 1.45rem !important; }
    .section-sub { font-size: 0.9rem; }
    .gywm-hero, .zsjm-hero { padding: 44px 0 40px; }
    .gywm-hero h1, .zsjm-hero h1 { font-size: 1.7rem; }
    .gywm-hero p, .zsjm-hero p { font-size: 0.95rem; }
    .hero-badges { gap: 8px; margin-top: 20px; }
    .hero-badges span { padding: 5px 14px; font-size: 0.78rem; }

    /* 数据条（关于我们页） */
    .stat-strip { gap: 14px; margin-top: 28px; }
    .stat-strip .stat { min-width: 105px; }
    .stat-strip .stat b { font-size: 1.5rem; }

    /* 简介段落 */
    .about-lead { text-align: left; font-size: 0.95rem; }

    /* 卡片全宽 */
    .qr-card { width: 100%; max-width: 330px; padding: 26px 20px; }
    .qr-card img { width: 170px; height: 170px; }
    .tier-card { width: 100%; max-width: 380px; }
    .step { width: 100%; max-width: 320px; }
    .biz-card, .adv-card, .value-card { padding: 24px 20px; }
    .honor-grid span { padding: 9px 16px; font-size: 0.82rem; }

    /* 时间轴收紧 */
    .timeline { padding-left: 16px; }
    .tl-item { padding-left: 20px; padding-bottom: 26px; }

    /* 联系信息卡 */
    .contact-info { padding: 24px 18px; margin-top: 28px; }

    /* CTA 区块 */
    .zsjm-cta, .gywm-cta { padding: 32px 20px; border-radius: 22px; }
    .zsjm-cta h2, .gywm-cta h2 { font-size: 1.35rem; }
    .zsjm-cta .form-group { flex-direction: column; }
    .zsjm-cta .form-group input { width: 100%; min-width: 0; }
    .zsjm-cta .form-group button { width: 100%; }
    .gywm-cta a { display: flex; justify-content: center; margin: 8px 0; width: 100%; }

    /* 页脚 */
    .qr-area { gap: 16px; }
    .qr-item { width: 106px; }
    .bank-info { font-size: 0.85rem; }

    /* 通用媒体自适应 */
    img, video { max-width: 100%; height: auto; }
    iframe { max-width: 100%; }
}

/* ---------- 超小屏 ≤380px ---------- */
@media (max-width: 380px) {
    .hero-content h1 { font-size: 1.6rem; }
    .hero-stats { gap: 12px; }
    .stat-number { font-size: 1.3rem; }
    .nav-menu { gap: 16px; }
    .taobao-btn { padding: 7px 14px; font-size: 0.85rem; }
}

/* ---------- 手机端体验修复（第二轮） ---------- */
@media (max-width: 900px) {
    .mobile-toggle {
        font-size: 2.4rem !important;
        color: #1B5E20 !important;
        padding: 6px 12px;
        border: 2px solid #ECEFF1;
        border-radius: 10px;
        background: #F7FAF7;
    }
    .nav-menu li a { font-size: 17px; padding: 4px 0; }
}

/* ---------- 手机端卡片布局修复（第三轮） ----------
   对比卡/案例卡在手机上改为整行全宽：
   文字横向排列可读，不再挤成窄条竖排 ---------- */
@media (max-width: 640px) {
    .compare-row {
        flex-direction: column;
        gap: 14px;
    }
    .compare-row > div {
        width: 100% !important;
        flex: none !important;
        box-sizing: border-box;
    }
    .tech-compare {
        padding: 28px 18px !important;
        border-radius: 28px !important;
    }
    .case-grid {
        flex-direction: column;
        gap: 18px;
    }
    .case-item {
        width: 100% !important;
        flex: none !important;
        box-sizing: border-box;
    }
}

/* ---- 顶部导航二级下拉菜单 ---- */
.nav-menu li { position: relative; }
.nav-menu li.has-sub:has(> .sub-menu) > a::after {
	content: "\f078";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 10px;
	margin-left: 5px;
	display: inline-block;
	transition: transform 0.2s;
}
.nav-menu li.has-sub:has(> .sub-menu):hover > a::after { transform: rotate(180deg); }
.nav-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%, 10px);
	min-width: 200px;
	background: #ffffff;
	border-radius: 12px;
	border: 1px solid #ECEFF1;
	box-shadow: 0 14px 34px rgba(30,42,30,0.16);
	padding: 8px 0;
	margin: 0;
	list-style: none;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s;
	z-index: 999;
}
.nav-menu li.has-sub:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 4px);
}
.nav-menu .sub-menu li { width: 100%; list-style: none; }
.nav-menu .sub-menu li a {
	display: block;
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 500;
	color: #1E2A1E;
	border-bottom: none !important;
	white-space: nowrap;
}
.nav-menu .sub-menu li a:hover { background: #F1F8F1; color: #1B5E20; }
@media (max-width: 900px) {
	.nav-menu { align-items: flex-start; }
	.nav-menu li { width: 100%; text-align: left; }
	.nav-menu li.has-sub > a::after {
		content: "\f078";
		font-family: "Font Awesome 6 Free";
		font-weight: 900;
		font-size: 11px;
		margin-left: 6px;
		display: inline-block;
		transition: transform 0.2s;
	}
	.nav-menu li.has-sub.open > a::after { transform: rotate(180deg); }
	.nav-menu .sub-menu {
		position: static;
		transform: none;
		opacity: 1;
		visibility: visible;
		min-width: 0;
		border: none;
		box-shadow: none;
		background: #F7FAF7;
		border-radius: 8px;
		padding: 4px 0 4px 18px;
		margin: 4px 0;
		display: none;
	}
	.nav-menu li.has-sub.open > .sub-menu { display: block; }
	.nav-menu .sub-menu li a { padding: 8px 0; font-size: 15px; color: #455A64; }
}

/* 手机端：抵消触摸时 :hover 触发桌面下拉位移的问题 */
@media (max-width: 900px) {
	.nav-menu li.has-sub:hover > .sub-menu,
	.nav-menu li.has-sub.open:hover > .sub-menu {
		transform: none;
		opacity: 1;
		visibility: visible;
	}
}