/* ==========================================================================
   泽宝智能家居 - 全站样式 (main.css)
   主题：深蓝 · 工厂直营 · 现代简约（依据 index.html 设计稿）
   ========================================================================== */

/* ---------- 1. 变量 ---------- */
:root{
    --navy:#1e3a5f;
    --navy-dark:#14304a;
    --navy-deep:#0f1b2d;
    --blue:#2b6e9e;
    --blue-light:#a8c9f0;
    --bg-body:#f9fafc;
    --bg-white:#ffffff;
    --bg-soft:#f0f4fa;
    --bg-card:#f9fafc;
    --text:#1e1e2f;
    --text-body:#3f4d5e;
    --text-mute:#5e6f82;
    --text-soft:#7b8a9c;
    --border:#eef0f4;
    --border-blue:#d0dfef;
    --border-line:#cfdbe8;
    --star:#f5b342;
    --radius-xl:36px;
    --radius-lg:24px;
    --radius-md:18px;
    --radius-sm:12px;
    --shadow-sm:0 4px 20px rgba(0,0,0,0.02);
    --shadow-card:0 10px 30px rgba(0,0,0,0.02);
    --shadow-hover:0 24px 40px -12px rgba(30,58,95,0.12);
    --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'PingFang SC','Microsoft YaHei',Helvetica,Arial,sans-serif;
    --transition:all 0.25s ease;
}

/* ---------- 2. Reset & Base ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg-body);color:var(--text);line-height:1.5;font-size:15px}
a{color:inherit;text-decoration:none;transition:color 0.2s}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,textarea,select{font-family:inherit;font-size:inherit}
h1,h2,h3,h4,h5,h6{font-weight:700;color:var(--navy-deep);line-height:1.3}
.container{max-width:1280px;margin:0 auto;padding:0 24px}
main{display:block;min-height:60vh}
.text-center{text-align:center}

/* ---------- 3. 导航栏 ---------- */
.navbar{background:var(--bg-white);box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:1000;border-bottom:1px solid var(--border);transition:box-shadow 0.25s}
.navbar.scrolled{box-shadow:0 6px 24px rgba(0,0,0,0.06)}
.navbar .container{display:flex;align-items:center;justify-content:space-between;height:80px;gap:20px}
.logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.logo-icon{background:var(--navy);color:#fff;width:42px;height:42px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;flex-shrink:0}
.logo-text{font-weight:700;font-size:18px;letter-spacing:-0.3px;color:var(--navy-deep);line-height:1.2;display:flex;flex-direction:column}
.logo-text span{color:var(--blue);font-weight:500;font-size:13px}
.nav-links ul{display:flex;align-items:center;gap:24px;list-style:none;flex-wrap:wrap}
.nav-links a{text-decoration:none;color:#2e3a4a;font-weight:500;font-size:14px;transition:color 0.2s;white-space:nowrap;padding:6px 0;border-bottom:2px solid transparent}
.nav-links a:hover{color:var(--navy)}
.nav-links a.active{color:var(--navy);border-bottom-color:var(--blue);font-weight:600}
.nav-cta{background:var(--navy);color:#fff !important;padding:8px 18px;border-radius:40px;font-weight:600;font-size:13px;transition:background 0.2s !important;white-space:nowrap;flex-shrink:0}
.nav-cta:hover{background:var(--navy-dark);color:#fff !important}
.nav-cta i{margin-right:4px}
.mobile-menu-btn{display:none;font-size:24px;color:var(--navy);background:none;border:none;cursor:pointer}

/* ---------- 4. 按钮 ---------- */
.btn-primary{display:inline-block;background:var(--navy);color:#fff;padding:14px 34px;border-radius:50px;font-weight:600;text-decoration:none;font-size:16px;border:none;cursor:pointer;transition:background 0.2s,transform 0.1s;box-shadow:0 8px 18px rgba(30,58,95,0.12)}
.btn-primary:hover{background:var(--navy-dark);color:#fff;transform:translateY(-2px)}
.btn-outline{display:inline-block;background:transparent;color:var(--navy);padding:13px 32px;border-radius:50px;font-weight:600;text-decoration:none;font-size:16px;border:1.5px solid var(--border-line);transition:var(--transition)}
.btn-outline:hover{border-color:var(--navy);background:var(--bg-soft);color:var(--navy)}
.btn-sm{padding:10px 24px;font-size:14px}

/* ---------- 5. 英雄区（首页） ---------- */
.hero{
    padding:96px 0 104px;
    background:linear-gradient(135deg,#f8fbfe 0%,#eef3f9 100%);
    position:relative;
    overflow:hidden;
}
/* 背景装饰光晕，避免全宽后显得空 */
.hero::before{ content:''; position:absolute; right:-120px; top:-120px; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,rgba(43,110,158,0.10) 0%,rgba(43,110,158,0) 70%); pointer-events:none; }
.hero::after{ content:''; position:absolute; left:-100px; bottom:-160px; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(30,58,95,0.07) 0%,rgba(30,58,95,0) 70%); pointer-events:none; }
.hero .container{ position:relative; z-index:2; max-width:960px; /* 内容居中，阅读更舒适 */ text-align:center; }
.hero-badge{ display:inline-block; background:rgba(30,58,95,0.08); color:var(--navy); font-weight:600; font-size:14px; padding:8px 20px; border-radius:40px; margin-bottom:24px; border:1px solid rgba(30,58,95,0.12); }
.hero-badge i{margin-right:6px}
.hero h1{ font-size:56px; font-weight:700; line-height:1.18; letter-spacing:-1.2px; color:var(--navy-deep); margin-bottom:24px; }
.hero h1 span{ background:linear-gradient(to right,#2b6e9e,#1e3a5f); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hero p{ font-size:18px; color:var(--text-body); margin:0 auto 36px; max-width:720px; /* 行宽适中，易读 */ line-height:1.7; }
.hero-buttons{ display:flex; gap:16px; flex-wrap:wrap; justify-content:center; }
.hero-stats{ display:flex; gap:60px; margin-top:52px; justify-content:center; }
.hero-stat-item h3{ font-size:32px; font-weight:700; color:var(--navy); letter-spacing:-0.5px; }
.hero-stat-item p{ font-size:14px; color:var(--text-mute); margin:0; font-weight:500; }
.factory-badge{position:absolute;bottom:24px;left:24px;background:rgba(255,255,255,0.95);backdrop-filter:blur(8px);padding:14px 24px;border-radius:60px;display:flex;align-items:center;gap:14px;box-shadow:0 12px 30px rgba(0,0,0,0.1);font-weight:600}
.factory-badge i{font-size:26px;color:var(--blue)}
.factory-badge span{font-size:16px;color:var(--navy-deep)}
.factory-badge small{font-size:13px;font-weight:400;color:var(--text-mute);display:block}

/* ---------- 6. 信任栏 ---------- */
.trust-bar{padding:36px 0;background:var(--bg-white);border-bottom:1px solid var(--border)}
.trust-bar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:30px}
.trust-item{display:flex;align-items:center;gap:12px;color:#2e3a4a;font-weight:500;font-size:15px}
.trust-item i{font-size:24px;color:var(--blue)}

/* ---------- 7. 章节标题 ---------- */
.section-title{text-align:center;margin-bottom:50px}
.section-title h2{font-size:38px;font-weight:700;letter-spacing:-1px;color:var(--navy-deep);margin-bottom:14px}
.section-title p{color:var(--text-mute);font-size:17px;max-width:600px;margin:0 auto}
.section-title.mt{margin-top:60px}

/* ---------- 8. 核心优势 ---------- */
.features{padding:90px 0;background:var(--bg-body)}
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.feature-card{background:#fff;border-radius:28px;padding:32px 24px;box-shadow:var(--shadow-card);border:1px solid var(--border);transition:var(--transition)}
.feature-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover);border-color:var(--border-blue)}
.feature-icon{width:58px;height:58px;background:#e9f0f8;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:28px;color:var(--navy);margin-bottom:24px}
.feature-card h3{font-size:20px;font-weight:600;margin-bottom:12px;color:var(--navy-deep)}
.feature-card p{color:var(--text-mute);font-size:15px;line-height:1.6}

/* ---------- 9. 产品卡片（首页精选 + 列表页） ---------- */
.products{padding:80px 0 100px;background:var(--bg-white)}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.product-card{border-radius:var(--radius-lg);overflow:hidden;background:#fff;border:1px solid var(--border);transition:var(--transition);box-shadow:0 6px 14px rgba(0,0,0,0.02);display:flex;flex-direction:column}
.product-card:hover{transform:translateY(-6px);box-shadow:0 30px 40px -16px rgba(0,0,0,0.12);border-color:var(--border-line)}
.product-img{height:240px;background-color:#d9e2ec;display:flex;align-items:center;justify-content:center;font-size:48px;color:#fff;background-size:cover;background-position:center;position:relative;overflow:hidden;flex-shrink:0}
.product-img::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(145deg,rgba(30,58,95,0.1),rgba(0,0,0,0.05))}
.product-img img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.product-img i{position:relative;z-index:2;text-shadow:0 4px 10px rgba(0,0,0,0.2);color:#fff}
.product-info{padding:24px 24px 28px;flex:1;display:flex;flex-direction:column}
.product-info h3{font-size:20px;font-weight:600;margin-bottom:8px;color:var(--navy-deep)}
.product-info h3 a:hover{color:var(--blue)}
.product-info p{color:var(--text-mute);font-size:15px;margin-bottom:16px;line-height:1.6}
.product-info .spec{color:var(--text-mute);font-size:14px;margin-bottom:10px}
.product-info .price{color:var(--blue);font-size:18px;font-weight:700;margin-top:auto;padding-top:12px}
.product-tag{display:inline-block;background:var(--bg-soft);color:var(--navy);font-size:13px;font-weight:500;padding:5px 14px;border-radius:40px;align-self:flex-start}
.product-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.product-meta .meta-tag{background:var(--bg-soft);color:var(--navy);font-size:12px;font-weight:500;padding:4px 12px;border-radius:40px}
/* 无图占位渐变 */
.grad-1{background-image:linear-gradient(145deg,#4a6f8f,#2e4b6e)}
.grad-2{background-image:linear-gradient(145deg,#5d7f9e,#3a5c7c)}
.grad-3{background-image:linear-gradient(145deg,#6e8ba8,#466380)}
.grad-4{background-image:linear-gradient(145deg,#3f6385,#2a4460)}
.grad-5{background-image:linear-gradient(145deg,#55708c,#37526e)}
.grad-6{background-image:linear-gradient(145deg,#7c97b3,#4f6c8a)}

/* ---------- 10. 工厂实力 ---------- */
.factory-highlight{background:var(--navy);color:#fff;padding:80px 0;position:relative;overflow:hidden}
.factory-highlight .container{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;position:relative;z-index:2}
.factory-highlight h2{font-size:40px;font-weight:700;line-height:1.2;letter-spacing:-1px;margin-bottom:24px;color:#fff}
.factory-highlight h2 span{color:var(--blue-light)}
.factory-highlight p{font-size:17px;color:#d0e0f0;margin-bottom:36px;line-height:1.7}
.factory-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;margin-bottom:40px}
.factory-list li{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:500;color:#eaf1fa}
.factory-list i{color:#9bc3f0;font-size:18px}
.factory-btn{background:#fff;color:var(--navy);border:none;padding:16px 42px;border-radius:50px;font-weight:700;font-size:16px;cursor:pointer;transition:var(--transition);box-shadow:0 10px 20px -5px rgba(0,0,0,0.2);display:inline-block;text-decoration:none}
.factory-btn:hover{background:var(--bg-soft);color:var(--navy);transform:translateY(-2px)}
.factory-btn i{margin-left:8px}
.factory-image{background:rgba(255,255,255,0.06);border-radius:32px;padding:20px;border:1px solid rgba(255,255,255,0.1)}
.factory-image svg{width:100%;height:auto;border-radius:20px;background:#2b4b6e;display:block}

/* ---------- 11. 成功案例 / 客户评价 ---------- */
.cases-and-reviews{padding:80px 0;background:var(--bg-body)}
.cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-bottom:60px}
.case-card{background:#fff;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);transition:var(--transition);display:flex;flex-direction:column}
.case-card:hover{transform:translateY(-4px);box-shadow:0 20px 30px -12px rgba(0,0,0,0.1);border-color:var(--border-blue)}
.case-img{height:200px;background-color:#d9e2ec;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;color:#fff;font-size:40px;position:relative;overflow:hidden;flex-shrink:0}
.case-img img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.case-img i{position:relative;z-index:2;text-shadow:0 4px 10px rgba(0,0,0,0.2)}
.case-info{padding:20px 22px 24px;flex:1}
.case-info h4{font-size:18px;font-weight:600;margin-bottom:6px;color:var(--navy-deep)}
.case-info h4 a:hover{color:var(--blue)}
.case-info p{color:var(--text-mute);font-size:14px;line-height:1.6}
.case-info .case-type{display:inline-block;background:var(--bg-soft);color:var(--navy);font-size:12px;font-weight:500;padding:4px 12px;border-radius:40px;margin-bottom:10px}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.testimonial-card{background:#fff;border-radius:var(--radius-lg);padding:28px 26px;border:1px solid var(--border);box-shadow:0 8px 20px rgba(0,0,0,0.02);display:flex;flex-direction:column}
.testimonial-stars{color:var(--star);margin-bottom:14px;font-size:13px;letter-spacing:2px}
.testimonial-stars .far{color:#dfe5ec}
.testimonial-text{font-size:15px;color:#2e3a4a;line-height:1.6;margin-bottom:18px;flex:1}
.testimonial-author{display:flex;align-items:center;gap:12px}
.author-avatar{width:42px;height:42px;background:#d9e2ec;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--navy);font-size:16px;flex-shrink:0}
.author-info h4{font-weight:600;font-size:15px;color:var(--navy-deep)}
.author-info p{color:#6b7a8d;font-size:13px}
/* 头像配色（reviews avatar_color 1~6） */
.avatar-color-1{background:#dbe7f3;color:var(--navy)}
.avatar-color-2{background:#e3ecf7;color:#2b5e8c}
.avatar-color-3{background:#d8e5f0;color:#33587e}
.avatar-color-4{background:#e8eef6;color:#3c5a80}
.avatar-color-5{background:#dce9f5;color:#275377}
.avatar-color-6{background:#e5ebf3;color:#31506f}

/* ---------- 12. 企业动态 / 行业洞察 ---------- */
.news-insights{padding:80px 0;background:var(--bg-white)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.news-card{background:var(--bg-card);border-radius:20px;border:1px solid var(--border);transition:var(--transition);overflow:hidden;display:flex;flex-direction:column}
.news-card:hover{background:#fff;box-shadow:0 16px 28px -12px rgba(0,0,0,0.08);border-color:var(--border-blue)}
.news-img{height:180px;overflow:hidden;background:#d9e2ec;flex-shrink:0}
.news-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s}
.news-card:hover .news-img img{transform:scale(1.04)}
.news-body{padding:28px 24px;flex:1;display:flex;flex-direction:column}
.news-date{font-size:13px;color:var(--text-soft);font-weight:500;margin-bottom:12px;display:flex;align-items:center;gap:6px}
.news-card h4,.news-body h3{font-size:18px;font-weight:600;color:var(--navy-deep);margin-bottom:12px;line-height:1.4}
.news-body h3 a:hover{color:var(--blue)}
.news-card p,.news-body .summary{color:var(--text-mute);font-size:14px;line-height:1.6;margin-bottom:16px}
.news-link,.readmore{color:var(--blue);font-weight:600;font-size:14px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;margin-top:auto}
.news-link i,.readmore i{font-size:12px;transition:transform 0.2s}
.news-link:hover,.readmore:hover{color:var(--navy)}
.news-link:hover i,.readmore:hover i{transform:translateX(4px)}

/* ---------- 13. CTA ---------- */
.cta-section{padding:80px 0;background:var(--bg-white)}
.cta-box{background:linear-gradient(105deg,#eef4fa 0%,#dfeaf5 100%);border-radius:48px;padding:64px 56px;display:grid;grid-template-columns:2fr 1fr;align-items:center;gap:40px;border:1px solid var(--border-blue)}
.cta-box h2{font-size:36px;font-weight:700;color:var(--navy-deep);letter-spacing:-0.8px;margin-bottom:16px}
.cta-box p{color:var(--text-body);font-size:17px;max-width:500px}
.cta-buttons{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}
.cta-buttons .btn-outline{background:#fff}

/* ---------- 14. 页脚 ---------- */
.footer{background:var(--bg-white);border-top:1px solid var(--border);padding:60px 0 30px}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:56px;margin-bottom:48px;align-items:start}
.footer-logo{margin-bottom:20px}
.footer-brand p{color:var(--text-mute);font-size:15px;line-height:1.7;margin-bottom:24px;max-width:380px}
.footer-contact-item{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;color:#2e3a4a;font-size:15px}
.footer-contact-item i{color:var(--blue);width:18px;margin-top:3px;flex-shrink:0}
.footer-contact-item strong{color:var(--navy-deep);font-size:18px;display:block}
.footer-contact-item small{font-size:13px;color:var(--text-soft)}
.footer h4{font-size:15px;font-weight:600;color:var(--navy-deep);margin-bottom:20px}
.footer-promise{display:flex;flex-direction:column;gap:10px;margin-bottom:24px;font-size:14px;color:var(--text-body)}
.footer-promise i{color:var(--blue);margin-right:8px}
.footer-cta{display:inline-flex;align-items:center;gap:8px;background:var(--navy);color:#fff;padding:13px 28px;border-radius:50px;font-weight:600;font-size:15px;text-decoration:none;transition:background 0.2s,transform 0.1s;box-shadow:0 8px 18px rgba(30,58,95,0.15)}
.footer-cta:hover{background:var(--navy-dark);color:#fff;transform:translateY(-2px)}
.footer-cta i{font-size:12px}
.footer-bottom{border-top:1px solid var(--border);padding-top:28px;display:flex;justify-content:space-between;align-items:center;color:var(--text-soft);font-size:14px;flex-wrap:wrap;gap:16px}
.footer-bottom i{color:var(--blue);margin-right:6px}

/* ---------- 15. 内页横幅 + 面包屑 ---------- */
.page-banner{background:linear-gradient(135deg,var(--navy) 0%,#2b4b6e 60%,var(--blue) 100%);color:#fff;padding:56px 0 48px;position:relative;overflow:hidden}
.page-banner::after{content:'';position:absolute;right:-80px;top:-80px;width:320px;height:320px;border-radius:50%;background:rgba(255,255,255,0.05)}
.page-banner::before{content:'';position:absolute;left:-60px;bottom:-100px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,0.04)}
.page-banner h1{font-size:36px;font-weight:700;letter-spacing:-0.5px;color:#fff;margin-bottom:10px}
.page-banner p{color:#cfe0f0;font-size:16px}
.breadcrumb{display:flex;align-items:center;gap:8px;color:var(--text-soft);font-size:14px;padding:20px 0 6px;flex-wrap:wrap}
.breadcrumb a{color:var(--text-mute)}
.breadcrumb a:hover{color:var(--navy)}
.breadcrumb i{font-size:11px;color:#c3ccd8}

/* ---------- 16. 分类筛选 ---------- */
.filter-bar{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 34px}
.filter-bar a{background:#fff;border:1px solid var(--border);color:var(--text-body);padding:9px 22px;border-radius:40px;font-size:14px;font-weight:500;transition:var(--transition)}
.filter-bar a:hover{border-color:var(--navy);color:var(--navy);background:var(--bg-soft)}
.filter-bar a.active{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600;box-shadow:0 6px 14px rgba(30,58,95,0.18)}

/* ---------- 17. 内页列表区 ---------- */
.page-section{padding:16px 0 70px}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.empty-tip{grid-column:1/-1;text-align:center;color:var(--text-soft);font-size:15px;background:#fff;border:1px dashed var(--border-line);border-radius:var(--radius-md);padding:60px 20px}
.empty-tip i{font-size:34px;color:#c3ccd8;display:block;margin-bottom:12px}
.more-wrap{text-align:center;margin-top:40px}

/* ---------- 18. 详情页 ---------- */
.detail-page{padding:16px 0 70px}
.detail-wrap{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card);margin-top:22px}
.detail-image{height:420px;background:#d9e2ec;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
.detail-image img{width:100%;height:100%;object-fit:cover}
.detail-image.no-image{background-image:linear-gradient(145deg,#4a6f8f,#2e4b6e)}
.detail-image .placeholder{color:rgba(255,255,255,0.9);font-size:70px}
.detail-info{padding:36px 40px 44px}
.detail-info .name{font-size:28px;font-weight:700;color:var(--navy-deep);margin-bottom:14px;line-height:1.35}
.detail-info .spec{color:var(--text-mute);font-size:15px;margin-bottom:14px}
.detail-info .meta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.detail-info .tag{display:inline-block;background:var(--bg-soft);color:var(--navy);font-size:13px;font-weight:500;padding:5px 16px;border-radius:40px}
.detail-info .price{color:var(--blue);font-size:24px;font-weight:700;margin-bottom:18px}
.detail-info .abs{color:var(--text-body);font-size:15px;line-height:1.8;background:var(--bg-card);border-left:3px solid var(--blue);padding:14px 18px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-bottom:22px}
.detail-info .content{color:var(--text-body);font-size:15px;line-height:1.8}

/* ---------- 19. 富文本 ---------- */
.rich-text{color:var(--text-body);font-size:15px;line-height:1.9}
.rich-text img{border-radius:var(--radius-md);margin:14px auto;max-width:100%}
.rich-text p{margin-bottom:14px}
.rich-text h1,.rich-text h2,.rich-text h3,.rich-text h4{margin:22px 0 12px;color:var(--navy-deep)}
.rich-text ul,.rich-text ol{padding-left:22px;margin-bottom:14px}
.rich-text ul{list-style:disc}
.rich-text ol{list-style:decimal}
.rich-text table{width:100%;border-collapse:collapse;margin:14px 0}
.rich-text td,.rich-text th{border:1px solid var(--border-line);padding:8px 12px}
.rich-text a{color:var(--blue);text-decoration:underline}
.about-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:44px 48px;box-shadow:var(--shadow-card);margin-top:22px}

/* ---------- 20. 文章页（动态/洞察详情） ---------- */
.article-wrap{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:40px 48px 48px;box-shadow:var(--shadow-card);margin-top:22px}
.article-image{border-radius:var(--radius-md);overflow:hidden;margin-bottom:26px;max-height:420px}
.article-image img{width:100%;height:100%;object-fit:cover}
.article-meta{color:var(--text-soft);font-size:14px;display:flex;align-items:center;gap:8px;margin-bottom:12px}
.article-meta i{color:var(--blue)}
.article-title{font-size:30px;font-weight:700;color:var(--navy-deep);line-height:1.35;margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.article-actions{margin-top:36px;padding-top:24px;border-top:1px solid var(--border);display:flex;gap:14px;flex-wrap:wrap}

/* ---------- 21. FAQ 手风琴 ---------- */
.faq-section{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:36px 40px 40px;box-shadow:var(--shadow-card);margin-top:28px}
.faq-section h3{font-size:24px;color:var(--navy-deep);margin-bottom:22px}
.faq-section h3 i{color:var(--blue);margin-right:10px}
.faq-list{display:flex;flex-direction:column;gap:14px}
.faq-item{border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--bg-card);transition:var(--transition)}
.faq-toggle{display:none}
.faq-question{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;font-weight:600;font-size:15px;color:var(--navy-deep);cursor:pointer}
.faq-question::after{content:'\f078';font-family:'Font Awesome 7 Free';font-weight:900;font-size:13px;color:var(--blue);transition:transform 0.25s}
.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.3s ease;padding:0 20px;color:var(--text-body);font-size:14px;line-height:1.8}
.faq-toggle:checked + .faq-question::after{transform:rotate(180deg)}
.faq-toggle:checked ~ .faq-answer{max-height:500px;padding:0 20px 18px}
.faq-item:has(.faq-toggle:checked){border-color:var(--border-blue);background:#fff}

/* ---------- 22. 分页 ---------- */
.pagination{display:flex;justify-content:center;margin-top:44px}
.pagination ul{display:flex;align-items:center;gap:8px;flex-wrap:wrap;list-style:none}
.pagination li a,.pagination li span{display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 14px;border-radius:var(--radius-sm);background:#fff;border:1px solid var(--border);color:var(--text-body);font-size:14px;font-weight:500;transition:var(--transition)}
.pagination li a:hover{border-color:var(--navy);color:var(--navy);background:var(--bg-soft)}
.pagination li.active span{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600;box-shadow:0 6px 14px rgba(30,58,95,0.18)}
.pagination li.disabled span{color:#b9c2cd;background:var(--bg-card);cursor:not-allowed}
.pagination li.dots span{border:none;background:none;color:var(--text-soft)}

/* ---------- 23. 客户评价页 ---------- */
.reviews-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin:26px 0 48px}
.reviews-stats-grid .stat-item{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:30px 22px;text-align:center;box-shadow:var(--shadow-card);transition:var(--transition)}
.reviews-stats-grid .stat-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:var(--border-blue)}
.reviews-stats-grid .num{font-size:36px;font-weight:700;color:var(--navy);letter-spacing:-0.5px;display:block;margin-bottom:6px}
.reviews-stats-grid .num small{font-size:18px;color:var(--blue);margin-left:2px}
.reviews-stats-grid h4{font-size:16px;color:var(--navy-deep);margin-bottom:6px}
.reviews-stats-grid p{font-size:13px;color:var(--text-mute)}
.testimonial-grid.list{margin-bottom:10px}
.testimonial-card .quote{font-size:15px;color:#2e3a4a;line-height:1.7;margin-bottom:18px;flex:1}
.testimonial-card .client{display:flex;align-items:center;gap:12px}
.testimonial-card .client .avatar{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;flex-shrink:0;background:#d9e2ec;color:var(--navy)}
.testimonial-card .client .name{font-weight:600;font-size:15px;color:var(--navy-deep)}
.testimonial-card .client .title{color:#6b7a8d;font-size:13px}
.review-meta{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--border);color:var(--text-soft);font-size:13px}
.review-meta i{color:var(--blue);margin-right:5px}

/* 评价提交表单 */
.review-submit{margin-top:64px}
.form-wrapper{background:#fff;border:1px solid var(--border);border-radius:var(--radius-xl);padding:48px 52px;box-shadow:var(--shadow-card);max-width:860px;margin:0 auto;position:relative}
.section-label{display:inline-block;background:rgba(30,58,95,0.08);color:var(--navy);font-weight:600;font-size:13px;padding:6px 16px;border-radius:40px;margin-bottom:14px;border:1px solid rgba(30,58,95,0.12)}
.form-title{font-size:30px;font-weight:700;color:var(--navy-deep);margin-bottom:12px}
.form-title .highlight{background:linear-gradient(to right,#2b6e9e,#1e3a5f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.section-desc{color:var(--text-mute);font-size:15px;margin-bottom:30px;line-height:1.7}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-grid .full-width{grid-column:1/-1}
.form-grid label{display:block;font-size:14px;font-weight:600;color:var(--navy-deep);margin-bottom:8px}
.form-grid label .required{color:#d9534f}
.form-grid input,.form-grid textarea{width:100%;padding:13px 16px;border:1.5px solid var(--border-line);border-radius:var(--radius-md);font-size:14px;color:var(--text);background:var(--bg-card);transition:var(--transition);outline:none}
.form-grid input:focus,.form-grid textarea:focus{border-color:var(--blue);background:#fff;box-shadow:0 0 0 3px rgba(43,110,158,0.12)}
.form-grid textarea{resize:vertical;min-height:110px}
.star-rating{display:flex;gap:6px;margin-bottom:6px}
.star-rating span{font-size:28px;color:#dfe5ec;cursor:pointer;transition:color 0.15s,transform 0.15s;line-height:1}
.star-rating span:hover{transform:scale(1.15)}
.rating-hint{font-size:13px;color:var(--text-soft)}
.form-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:28px}
.btn-submit{display:inline-flex;align-items:center;background:var(--navy);color:#fff;padding:14px 38px;border-radius:50px;font-weight:600;font-size:15px;border:none;cursor:pointer;transition:background 0.2s,transform 0.1s;box-shadow:0 8px 18px rgba(30,58,95,0.15)}
.btn-submit:hover{background:var(--navy-dark);transform:translateY(-2px)}
.privacy-note{font-size:13px;color:var(--text-mute)}
.privacy-note i{color:var(--blue);margin-right:4px}
.form-footer{margin-top:22px;padding-top:18px;border-top:1px solid var(--border);font-size:13px;color:var(--text-soft)}
.form-footer i{color:var(--blue);margin-right:6px}
.review-success{display:none;text-align:center;padding:50px 20px}
.review-success i{font-size:56px;color:#3aa76d;margin-bottom:18px}
.review-success h3{font-size:24px;color:var(--navy-deep);margin-bottom:12px}
.review-success p{color:var(--text-mute);font-size:15px;max-width:460px;margin:0 auto;line-height:1.7}

/* ---------- 24. 404 页面 ---------- */
.notfound-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f8fbfe 0%,#eef3f9 100%);padding:40px 24px}
.notfound-box{text-align:center;max-width:520px}
.notfound-icon{width:96px;height:96px;margin:0 auto 26px;background:#e9f0f8;border-radius:28px;display:flex;align-items:center;justify-content:center;font-size:44px;color:var(--navy)}
.notfound-code{font-size:88px;font-weight:700;line-height:1;letter-spacing:-2px;background:linear-gradient(to right,#2b6e9e,#1e3a5f);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:14px}
.notfound-box h1{font-size:24px;color:var(--navy-deep);margin-bottom:12px}
.notfound-box p{color:var(--text-mute);font-size:15px;line-height:1.7;margin-bottom:30px}
.notfound-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---------- 25. 响应式 ---------- */
@media (max-width:1100px){
    .navbar .container{height:auto;padding:12px 24px;flex-wrap:wrap;gap:12px}
    .nav-links ul{gap:16px}
    .nav-links a{font-size:13px}
}
@media (max-width:1024px){
    .hero{padding:72px 0 80px}
    .hero h1{font-size:44px}
    .hero-stats{gap:44px}
    .features-grid{grid-template-columns:repeat(2,1fr)}
    .product-grid{grid-template-columns:repeat(2,1fr)}
    .cases-grid{grid-template-columns:repeat(2,1fr)}
    .testimonial-grid{grid-template-columns:repeat(2,1fr)}
    .news-grid{grid-template-columns:repeat(2,1fr)}
    .card-grid{grid-template-columns:repeat(2,1fr)}
    .reviews-stats-grid{grid-template-columns:repeat(2,1fr)}
    .factory-highlight .container{grid-template-columns:1fr;gap:40px}
    .factory-image{max-width:500px}
    .cta-box{grid-template-columns:1fr;text-align:center;padding:48px 32px}
    .cta-buttons{justify-content:center}
    .footer-grid{grid-template-columns:1.4fr 1fr 1fr;gap:36px}
}
@media (max-width:768px){
    .nav-links{display:none;width:100%;order:3}
    .nav-links.open{display:block}
    .nav-links ul{flex-direction:column;align-items:stretch;gap:0;padding:8px 0 12px}
    .nav-links li{border-bottom:1px solid var(--border)}
    .nav-links a{display:block;padding:12px 4px;font-size:15px;border-bottom:none}
    .nav-links a.active{border-bottom:none}
    .mobile-menu-btn{display:block;order:2}
    .nav-cta{display:none}
    .hero{padding:56px 0 64px}
    .hero h1{font-size:34px}
    .hero p{font-size:16px;max-width:100%}
    .hero-stats{flex-wrap:wrap;gap:28px;margin-top:40px}
    .hero-stat-item h3{font-size:26px}
    .features{padding:60px 0}
    .features-grid{grid-template-columns:1fr}
    .product-grid{grid-template-columns:1fr}
    .cases-grid{grid-template-columns:1fr}
    .testimonial-grid{grid-template-columns:1fr}
    .news-grid{grid-template-columns:1fr}
    .card-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr;gap:36px}
    .trust-bar .container{justify-content:center}
    .section-title h2{font-size:30px}
    .factory-highlight h2{font-size:30px}
    .factory-list{grid-template-columns:1fr}
    .cta-box h2{font-size:28px}
    .page-banner h1{font-size:28px}
    .detail-info{padding:26px 22px 32px}
    .detail-info .name{font-size:23px}
    .detail-image{height:280px}
    .article-wrap{padding:28px 22px 34px}
    .article-title{font-size:24px}
    .faq-section{padding:26px 20px 30px}
    .form-wrapper{padding:32px 22px}
    .form-grid{grid-template-columns:1fr}
    .reviews-stats-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:480px){
    .footer-grid{grid-template-columns:1fr}
    .reviews-stats-grid{grid-template-columns:1fr}
    .hero h1{font-size:28px}
}
