/* ============================================================
   北京加中瑞邦机械设备有限责任公司  |  Figma Design System
   主色调: #810712
   ============================================================ */

:root {
    --red: #810712;
    --red-hover: #9b0a15;
    --red-active: #6b060f;
    --accent: #c8a96e;
    --dark: #0d0d0d;
    --red-light: rgba(129, 7, 18, 0.06);
    --red-med: rgba(129, 7, 18, 0.12);
    --travaini: #9b1218;
    --sullair: #15803d;
    --pvr: #1d4ed8;
    --gray-50: #f7f8fa;
    --gray-100: #f1f3f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;
    --gray-950: #030712;
    --font-cn: Microsoft Yahei,'Noto Sans SC', sans-serif;
    --font-en: 'Inter', sans-serif;
    --font-mono: 'DM Mono', monospace;
    --max-w: 1320px;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; -webkit-font-smoothing:antialiased; }
body { font-family:var(--font-cn); color:var(--gray-900); background:#fff; overflow-x:hidden; line-height:1.6; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
img { max-width:100%; height:auto; display:block; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }

::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-track { background:#f7f8fa; }
::-webkit-scrollbar-thumb { background:var(--red); border-radius:2px; }
::-webkit-scrollbar-thumb:hover { background:var(--red-hover); }

/* ==================== 导航 ==================== */
.header {
    position:fixed; top:0; left:0; right:0; z-index:50;
    padding:10px 40px;
    transition:all .35s var(--ease-out);
    background:transparent;
}
.header.scrolled {
    background:rgba(255,255,255,0.97);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    box-shadow:0 2px 8px rgba(0,0,0,0.08);
}
.header.scrolled .logo-white { display:none; }
.header.scrolled .logo-color { display:block; }
.header.scrolled .nav-link { color:var(--gray-1, #333); }
.header.scrolled .nav-link:hover, .header.scrolled .nav-link.active { color:var(--red); }
.header.scrolled .lang-switch { color:var(--gray-1, #333); }
.header.scrolled .btn-contact { color:var(--red); border-color:var(--red); }
.header.scrolled .btn-contact:hover { background:var(--red); color:#fff; }
.header.scrolled .menu-toggle span { background:var(--gray-1, #333); }

.header-inner {
   /* max-width:var(--max-w);*/ margin:0 auto;
    display:flex; align-items:center; justify-content:space-between;
    height:80px;
}

.logo { display:flex; align-items:center; flex-shrink:0; }
.logo-text { display:flex; flex-direction:column; line-height:1.3; }
.logo-text img { height: 48px;}

.header .logo_a{ display: block;}
.header .logo_b{ display: none;}

.header.scrolled .logo_a{ display: none;}
.header.scrolled .logo_b{ display: block;}


.logo-cn {
    font-family:var(--font-cn); font-size:30px; font-weight:700;
    letter-spacing:.0em; color:#fff;
    transition:color .35s;
    white-space:nowrap;
}
.logo-en {
    font-family:var(--font-en); font-size:16px; font-weight:600;
    letter-spacing:.25em; color:rgba(255,255,255,0.55);
    text-transform:uppercase;
    transition:color .35s;
}
.header.scrolled .logo-cn { color:var(--gray-900); }
.header.scrolled .logo-en { color:var(--red); }
.header.scrolled .logo-white { display:none; }
.header.scrolled .logo-color { display:block; }

/* 导航菜单 */
.nav { margin:0 40px; }
.nav-list { display:flex; align-items:center; gap:4px; }

.nav-link {
    display:block; padding:10px 18px;
    font-size:17px; font-weight:500;
    color:rgba(255,255,255,0.9);
    position:relative; letter-spacing:1px;
    font-family:var(--font-cn);
    transition:color .2s;
}
.nav-link::after {
    content:''; position:absolute;
    bottom:4px; left:18px; right:18px; height:2px;
    background:var(--red);
    transform:scaleX(0); transition:transform .3s ease;
}
.nav-link:hover::after, .nav-link.active::after { transform:scaleX(1); }
.nav-link:hover { color:#fff; }

/* 下拉菜单 */
.dropdown { position:relative; }
.dropdown-menu {
    position:absolute; top:calc(100% + 8px); left:50%;
    transform:translateX(-50%) translateY(10px);
    background:#fff; border-radius:10px;
    box-shadow:0 10px 50px rgba(0,0,0,0.12);
    opacity:0; visibility:hidden;
    transition:all .35s var(--ease-out);
    min-width:240px; padding:8px; text-align: center;
}
.dropdown:hover .dropdown-menu { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.dropdown-inner { display:flex; }
.dropdown-col { flex:1; padding:20px 24px; }
.dropdown-col:first-child { border-right:1px solid var(--light, #f5f5f5); }
.dropdown-col h4 { font-size:16px; color:var(--red); margin-bottom:16px; font-weight:600; letter-spacing:2px; font-family:var(--font-cn); }
.dropdown-col a { display:block; padding:8px 0; font-size:16px; color:var(--gray-2, #666); font-family:var(--font-cn); transition:color .2s; }
.dropdown-col a:hover { color:var(--red); padding-left:8px; }

/* 头部操作区 */
.header-actions { display:flex; align-items:center; gap:16px; }
.lang-switch { font-size:17px; color:rgba(255,255,255,0.7); font-family:var(--font-en); letter-spacing:0px; cursor:pointer; }
.lang-active { color:#fff; font-weight:600; }

.btn-contact {
    display:inline-flex; align-items:center; gap:6px;
    padding:8px 20px; font-size:16px;
    color:#fff; border:1px solid rgba(255,255,255,0.3);
    border-radius:50px; font-family:var(--font-cn);
    transition:all .2s;
}
.btn-contact:hover { background:var(--red); border-color:var(--red); color:#fff; }

.menu-toggle { display:none; flex-direction:column; gap:5px; padding:4px; }
.menu-toggle span { display:block; width:24px; height:2px; background:#fff; transition:all .3s; border-radius:2px; }

.mobile-nav {
    position:fixed; top:0; right:-100%;
    width:80%; max-width:380px; height:100vh;
    background:#fff; z-index:1100; padding:24px;
    transition:right .4s var(--ease-out);
    box-shadow:-10px 0 40px rgba(0,0,0,0.1); overflow-y:auto;
}
.mobile-nav.open { right:0; }
.mobile-nav-link { display:block; padding:14px 20px; font-size:16px; color:var(--gray-1,#333); font-weight:500; font-family:var(--font-cn); border-radius:6px; }
.mobile-nav-link:hover { background:rgba(129,7,18,0.06); color:var(--red); }
.overlay { position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:1050; opacity:0; visibility:hidden; transition:all .35s; }
.overlay.open { opacity:1; visibility:visible; }

/* ==================== 按钮 ==================== */
.btn {
    display:inline-flex; align-items:center; gap:10px;
    padding:16px 40px; font-size:16px; font-weight:600;
    border-radius:50px; letter-spacing:1px; cursor:pointer;
    border:2px solid transparent;
    font-family:var(--font-cn);
}
.btn-primary { background:var(--red); color:#fff; border-color:var(--red); }
.btn-primary:hover { background:var(--red-hover); border-color:var(--red-hover); transform:translateY(-3px); box-shadow:0 12px 36px rgba(129,7,18,0.25); }
.btn-outline { background:transparent; color:#fff; border-color:rgba(255,255,255,0.35); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.btn-outline:hover { background:#fff; color:var(--dark); border-color:#fff; transform:translateY(-3px); }

/* ==================== Banner ==================== */
.banner {
    position:relative; width:100%; height:80vh; min-height:600px;
    overflow:hidden; background:var(--dark);
}
.banner-slider { width:100%; height:100%; position:relative; }
.banner-slide {
    position:absolute; top:0; left:0; width:100%; height:100%;
    opacity:0; transition:opacity 1.2s ease;
}
.banner-slide.active { opacity:1; }
.banner-slide img {
    width:100%; height:100%; object-fit:cover;
    transform:scale(1.05); transition:transform 6s ease;
}
.banner-slide.active img { transform:scale(1); }
.banner-overlay {
    position:absolute; top:0; left:0; width:100%; height:100%;
    background:linear-gradient(135deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 35%, rgba(0,0,0,0.0) 60%, rgba(0,0,0,0.0) 100%);
}
.banner-content {
    position:absolute; top:48%; left:8%;
    transform:translateY(-50%); max-width:820px;
    color:#fff; z-index:10;
    opacity:0; transition:opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out); display: none;
}
.banner-slide.active .banner-content {
    opacity:1;
}
.banner-tag {
    display:inline-flex; align-items:center; gap:14px;
    font-family:var(--font-en);
    font-size:16px; font-weight:600; letter-spacing:8px;
    color:var(--accent); margin-bottom:28px;
    padding:10px 20px; border:1px solid rgba(200,169,110,0.25); border-radius:2px;
    position:relative;
}
.banner-tag::before {
    content:''; width:2px; height:18px; background:var(--accent);
    border-radius:1px; margin-right:2px;
}
.banner-content h1 {
    font-size:clamp(2.6rem,6vw,72px); font-weight:700; line-height:1.15;
    margin-bottom:28px; letter-spacing:2px;
    font-family:var(--font-cn);
    text-shadow:0 2px 30px rgba(0,0,0,0.4);
}
.banner-content p {
    font-size:20px; line-height:1.8;
    color:rgba(255,255,255,0.85); margin-bottom:48px;
    font-family:var(--font-cn); max-width:620px;
}
.banner-btns { display:flex; gap:16px; flex-wrap:wrap; }

/* Banner 控制器 */
.banner-controls {
    position:absolute; bottom:48px; right:48px; display:flex; gap:12px; z-index:20;
}
.banner-arrow {
    width:56px; height:56px; display:flex; align-items:center; justify-content:center;
    border:1px solid rgba(255,255,255,0.25); border-radius:50%;
    color:#fff; transition:all 0.3s var(--ease-out); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
    background:rgba(0,0,0,0.15);
}
.banner-arrow:hover { background:var(--red); border-color:var(--red); transform:scale(1.05); }

.banner-dots { position:absolute; top:50%; right:32px; transform:translateY(-50%); display:flex; flex-direction:column; gap:12px; z-index:20; }
.banner-dots .dot {
    width:8px; height:8px; border-radius:50%;
    background:rgba(255,255,255,0.35); cursor:pointer; transition:all 0.3s var(--ease-out);
    border:1px solid rgba(255,255,255,0.2);
}
.banner-dots .dot.active { background:var(--red); height:28px; border-radius:4px; border-color:var(--red); }

.banner-scroll {
    position:absolute; bottom:48px; left:50%; transform:translateX(-50%);
    display:flex; flex-direction:column; align-items:center;
    color:rgba(255,255,255,0.4); font-size:10px; letter-spacing:4px; z-index:10;
    animation:bounce 2.5s infinite;
}
.banner-scroll::before {
    content:''; width:1px; height:32px;
    background:linear-gradient(to bottom, var(--red), transparent);
    margin-bottom:10px;
}
@keyframes bounce {
    0%, 100% { transform:translateX(-50%) translateY(0); opacity:0.5; }
    50% { transform:translateX(-50%) translateY(10px); opacity:1; }
}

/* ==================== 产品分类导航条 ==================== */
.prod-nav-strip {
    background:#fff; border-bottom:1px solid rgba(0,0,0,0.06);
    position:sticky; top:100px; z-index:40;
    box-shadow:0 2px 12px rgba(0,0,0,0.03);
}
.prod-nav-inner {
    max-width:var(--max-w); margin:0 auto; padding:0 32px;
    display:flex; align-items:center; justify-content:center;
    flex-wrap:wrap;
}
.prod-nav-item {
    display:block; padding:20px 22px;
    font-family:var(--font-cn); font-size:17px; font-weight:500;
    color:var(--gray-600); position:relative;
    transition:all .25s; white-space:nowrap;
}
.prod-nav-item::after {
    content:''; position:absolute; bottom:0; left:22px; right:22px; height:3px;
    background:var(--red); transform:scaleX(0); transition:transform .3s var(--ease-out);
    border-radius:3px 3px 0 0;
}
.prod-nav-item:hover { color:var(--red); background:var(--red-light); }
.prod-nav-item:hover::after, .prod-nav-item.active::after { transform:scaleX(1); }
.prod-nav-item.active { color:var(--red); font-weight:600; }
.prod-nav-sep {
    width:1px; height:16px; background:var(--gray-200); flex-shrink:0;
}

/* ==================== 品牌栏 (BrandsBar) ==================== */
.brands-bar { background:#fff; border-bottom:1px solid rgba(0,0,0,0.05); border-top:1px solid rgba(0,0,0,0.04);  display: none;}
.brands-inner {
    max-width:var(--max-w); margin:0 auto; padding:20px 32px;
    display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px;
}
.brands-label { font-family:var(--font-en); font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:var(--gray-400); }
.brands-list { display:flex; flex-wrap:wrap; align-items:center; gap:40px; }
.brands-item { display:flex; flex-direction:column; gap:2px; }
.brands-name { font-family:var(--font-en); font-size:18px; font-weight:700; line-height:1; letter-spacing:-.02em; }
.brands-name.travaini { color:var(--travaini); }
.brands-name.sullair { color:var(--sullair); letter-spacing:.08em; }
.brands-name.pvr { color:var(--gray-600); letter-spacing:.05em; }
.brands-origin { font-family:var(--font-en); font-size:10px; letter-spacing:.1em; color:var(--gray-400); }
.brands-divider { width:1px; height:32px; background:var(--gray-200); }

/* ==================== 内页Banner ==================== */
.inner-banner {
    position:relative; width:100%; height:380px; min-height:300px;
    overflow:hidden; background:var(--dark);
    margin-top:0;
}
.inner-banner img {
    width:100%; height:100%; object-fit:cover;
}
.inner-banner-overlay {
    position:absolute; top:0; left:0; width:100%; height:100%;
    background:linear-gradient(135deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,0) 100%);
}
.inner-banner-content {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    text-align:center; color:#fff; z-index:10; width:100%; padding:0 32px;
}
.inner-banner-content h1 {
    font-family:var(--font-cn); font-size:clamp(2rem,4vw,3rem); font-weight:700;
    letter-spacing:2px; margin-bottom:16px; display: none;
}
.inner-banner-content p {
    font-family:var(--font-cn); font-size:16px; color:rgba(255,255,255,0.7);
    letter-spacing:1px;  display: none;
}
@media (max-width:767px) {
    .inner-banner { height:240px; min-height:200px; }
    .inner-banner-content h1 { font-size:clamp(1.5rem,5vw,2rem); }
    .inner-banner-content p { font-size:14px; }
}

/* ==================== 公司简介 (About) ==================== */
.about { background: url("../images/bg/bg5.jpg") no-repeat center top;  }
.about-header { max-width:var(--max-w); margin:0 auto; padding:60px 32px 56px; text-align:center; }
.about-tag { display:inline-flex; align-items:center; gap:14px; margin-bottom:28px; }
.about-tag-line { width:40px; height:1px; background:var(--red); }
.about-tag span { font-family:var(--font-en); font-size:12px; font-weight:600; letter-spacing:.25em; text-transform:uppercase; color:var(--red); }
.about-title { font-family:var(--font-cn); font-weight:700; color:var(--gray-950); line-height:1.1; margin-bottom:10px; font-size:clamp(1.8rem,4vw,3.2rem); letter-spacing:; max-width:860px; margin-left:auto; margin-right:auto; }
.about-eng { font-family:var(--font-en); font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--red); margin-bottom:7px; font-size:clamp(0.8rem,1.2vw,0.95rem); }
.about-sub { font-family:var(--font-cn); font-size:16px; letter-spacing:.06em; color:var(--gray-400); }
.about-divider-dot { display:flex; align-items:center; justify-content:center; gap:0; margin-top:40px; }
.about-dot-line { flex:1; max-width:120px; height:1px; background:rgba(0,0,0,0.07); }
.about-dot { width:6px; height:6px; border-radius:50%; background:var(--red); flex-shrink:0; }

.about-grid {
    max-width:var(--max-w); margin:0 auto; padding:0 32px;
    display:grid; grid-template-columns:1fr 1fr;
    border:0px solid rgba(0,0,0,0.07);
}
.about-img-col { position:relative; overflow:hidden; background:var(--gray-100); min-height:460px; }
.about-img-wrap { position:relative; width:100%; height:100%; }
.about-img-wrap img { width:100%; height:100%; object-fit:cover; }
.about-img-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,0.65), rgba(0,0,0,0.05), transparent); }
.about-img-badge { position:absolute; top:0; left:0; background:var(--red); padding:16px 20px; }
.badge-year { font-family:var(--font-en); font-size:44px; font-weight:700; color:#fff; line-height:1; display:block; }
.badge-label { font-family:var(--font-en); font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,0.55); margin-top:4px; display:block; }
.about-img-caption { position:absolute; bottom:0; left:0; right:0; padding:32px; }
.caption-line { width:32px; height:2px; background:var(--red); margin-bottom:16px; }
.caption-en { font-family:var(--font-en); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,0.45); margin-bottom:8px; }
.caption-cn { font-family:var(--font-cn); font-size:17px; font-weight:600; color:#fff; line-height:1.4; }

.about-text-col { display:flex; flex-direction:column; border-left:1px solid rgba(0,0,0,0.07); padding:40px;  padding-top: 0px; }
.about-core-tag { display:flex; align-items:center; gap:8px; margin-bottom:24px; }
.core-dot { width:6px; height:6px; border-radius:50%; background:var(--red); display:inline-block; }
.about-core-tag span { font-family:var(--font-en); font-size:16px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--red); }
.about-lead { font-family:var(--font-cn); font-size:20px; font-weight:600; color:var(--gray-800); line-height:2.0; border-left:2px solid var(--red); padding-left:16px; margin-bottom:28px; }
.about-highlights { display:flex; flex-direction:column; gap:14px; margin-bottom:32px; }
.about-highlights li { display:flex; align-items:flex-start; gap:12px; font-family:var(--font-cn); font-size:16px; color:var(--gray-500); line-height:1.7; }
.check-icon { width:16px; height:16px; color:var(--red); flex-shrink:0; margin-top:2px; }
.about-service-note { font-family:var(--font-cn); font-size:14px; color:#666; line-height:1.8; border-top:0px solid rgba(0,0,0,0.06); padding-top:0px; margin-bottom:0px; }
.about-btns { display:flex; flex-wrap:wrap; gap:12px; border-top:0px solid rgba(0,0,0,0.06); padding-top:28px; }
.about-btn-primary {
    display:inline-flex; align-items:center; gap:10px;
    background:var(--red); color:#fff;
    font-family:var(--font-cn); font-size:15px; font-weight:600;
    padding:12px 24px;
    transition:all .2s;
    box-shadow:0 1px 3px rgba(0,0,0,0.08);
}
.about-btn-primary:hover { background:var(--red-hover); box-shadow:0 4px 12px rgba(129,7,18,0.2); }
.about-btn-outline {
    display:inline-flex; align-items:center; gap:10px;
    border:1px solid var(--gray-300); color:var(--gray-700);
    font-family:var(--font-cn); font-size:15px; font-weight:600;
    padding:12px 24px;
    transition:all .2s;
}
.about-btn-outline:hover { border-color:var(--red); color:var(--red); }

/* 统计卡片 */
.stats-row {
    max-width:var(--max-w); margin:0 auto; padding:0 32px 96px;
    display:grid; grid-template-columns:repeat(4,1fr);
}
.stat-card {
    position:relative; display:flex; flex-direction:column; gap:12px;
    padding:32px; border:1px solid rgba(0,0,0,0.07); margin-top:-1px; margin-left:-1px;
    transition:all .3s var(--ease-out); cursor:default; background:#fff;
}
.stat-card:hover { z-index:10; border-color:rgba(129,7,18,0.4); box-shadow:0 8px 30px rgba(129,7,18,0.06); background:#fdf8f8; }
.stat-icon-circle {
    width:44px; height:44px; border-radius:50%; background:var(--red-light);
    display:flex; align-items:center; justify-content:center; color:var(--red);
    transition:background .3s; position: absolute; right: 20px;
}
.stat-card:hover .stat-icon-circle { background:var(--red-med); }
.stat-icon-circle svg { width:28px; height:28px; }
.stat-value-row { display:flex; align-items:baseline; gap:4px; }
.stat-value { font-family:var(--font-en); font-size:3.2rem; font-weight:700; color:var(--gray-950); line-height:1; letter-spacing:-.04em; }
.stat-value.gold-accent { /*color:var(--accent);*/ }
.stat-unit { font-family:var(--font-cn); font-size:18px; font-weight:700; color:var(--red); }
.stat-label { font-family:var(--font-cn); font-size:13.5px; font-weight:600; color:var(--gray-800); }
.stat-sub { font-family:var(--font-cn); font-size:11.5px; color:var(--gray-400); margin-top:2px; }
.stat-hover-line {
    position:absolute; bottom:0; left:32px; right:32px; height:2px; background:var(--red);
    transform:scaleX(0); transform-origin:left;
    transition:transform .3s var(--ease-out);
}
.stat-card:hover .stat-hover-line { transform:scaleX(1); }

/* ==================== 产品中心 (Products) ==================== */
.products { background: url("../images/bg/bg1.jpg")  no-repeat center top; background-size: 100% 100%; padding:120px 0; }
.products-inner { max-width:var(--max-w); margin:0 auto; padding:0 32px; }
.products-header { margin-bottom:56px; }
.products-tag { display:flex; align-items:center; gap:14px; margin-bottom:28px; }
.products-tag-line { width:40px; height:1px; background:var(--red); }
.products-tag span { font-family:var(--font-en); font-size:12px; font-weight:600; letter-spacing:.25em; text-transform:uppercase; color:var(--red); }
.products-title-row { display:flex; flex-direction:row; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:0; flex-wrap:wrap; }
.products-title { font-family:var(--font-cn); font-weight:700; color:var(--gray-950); line-height:1.05; font-size:clamp(2rem,4vw,3.2rem); letter-spacing:-.02em; }
.products-title-red { color:var(--red); }
.products-sub { font-family:var(--font-cn); font-size:16px; color:var(--gray-400); max-width:340px; }
.products-divider { height:1px; background:rgba(0,0,0,0.07); margin-top:56px; }

.products-grid {
    display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
}
.product-card {
    background:#fff; overflow:hidden; cursor:pointer;
    border:1px solid rgba(0,0,0,0.06); border-top:2px solid transparent;
    transition:all .35s var(--ease-out);
}
.product-card:hover { border-color:rgba(0,0,0,0.1); border-top-color:var(--red); box-shadow:0 24px 56px rgba(0,0,0,0.1); transform:translateY(-8px); }
.product-img-wrap { position:relative; overflow:hidden; background:var(--gray-100); aspect-ratio:3/3; }
.product-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease-out); }
.product-card:hover .product-img-wrap img { transform:scale(1.05); }
.product-brand-tag {
    position:absolute; top:16px; left:16px;
    font-family:var(--font-en); font-size:18px; font-weight:700; letter-spacing:.14em;
    color:#fff; padding:5px 10px; display: none;
}
.travaini-bg { background:var(--travaini); }
.pvr-bg { background:var(--pvr); }
.sullair-bg { background:var(--sullair); }
.product-num {
    position:absolute; bottom:14px; right:16px;
    font-family:var(--font-en); font-size:2.6rem; font-weight:700; color:rgba(255,255,255,0.18); line-height:1;
    user-select:none; transition:color 0.4s ease;
}
.product-card:hover .product-num { color:rgba(255,255,255,0.35); }
.product-card-body { padding:20px; }
.product-card-head { display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.product-card-icon { width:20px; height:20px; color:var(--red); flex-shrink:0; }
.product-card-head h3 { font-family:var(--font-cn); font-size:18px; font-weight:600; color:var(--gray-900); }
.product-card-divider { height:1px; background:var(--gray-100); margin-bottom:16px; position:relative; overflow:hidden; }
.product-card-divider-fill { position:absolute; inset-y:0; left:0; width:0; background:var(--red); transition:width .5s var(--ease-out); }
.product-card:hover .product-card-divider-fill { width:100%; }
.product-card-en { font-family:var(--font-en); font-size:11px; color:var(--gray-400); margin-bottom:12px; letter-spacing:.05em; }
.product-card-spec { font-family:; font-size:15px; color:var(--gray-500); line-height:1.7; }

.products-cta { display:flex; justify-content:center; margin-top:48px; }
.products-cta-btn {
    display:inline-flex; align-items:center; gap:12px;
    border:1px solid var(--gray-300); color:var(--gray-600);
    font-family:var(--font-cn); font-size:17px;
    padding:14px 32px; transition:all .2s;
}
.products-cta-btn:hover { border-color:var(--red); color:var(--red); }

/* ==================== 口号横幅 (QuoteBreak) ==================== */
.quote-break { position:relative; height:240px; overflow:hidden; display:flex; align-items:center; }
@media (min-width:768px) { .quote-break { height:340px; } }
.quote-bg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(1.02); transition:transform 8s ease; }
.quote-break:hover .quote-bg { transform:scale(1.08); }
.quote-overlay { position:absolute; inset:0; background:radial-gradient(ellipse at center, rgba(129,7,18,0.88) 0%, rgba(129,7,18,0.94) 100%); }
.quote-content {
    position:relative; z-index:10; max-width:var(--max-w); margin:0 auto; padding:0 32px;
    width:100%; display:flex; flex-direction:column;
    align-items:center; justify-content:center; gap:32px;
}
@media (min-width:768px) { .quote-content { flex-direction:row; justify-content:space-between; } }
.quote-cn { font-family:var(--font-cn); font-weight:700; color:#fff; font-size:clamp(1.6rem,3.5vw,2.6rem); text-align:center; letter-spacing:2px; }
.quote-cn::before { content:''; display:block; width:48px; height:2px; background:var(--accent); margin:0 auto 20px; border-radius:1px; }
@media (min-width:768px) { .quote-cn { text-align:left; } .quote-cn::before { margin:0 0 20px 0; } }
.quote-en-wrap { text-align:center; flex-shrink:0; }
@media (min-width:768px) { .quote-en-wrap { text-align:right; } }
.quote-en-wrap p { font-family:var(--font-en); font-size:16px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,0.55); }

/* ==================== 售后服务 (Service) ==================== */
.service { background: url("../images/bg/bg4.jpg") no-repeat center top; background-size: 100% 100%; padding:120px 0 100px; }
.service-inner { max-width:var(--max-w); margin:0 auto; padding:0 32px; }
.service-header { margin-bottom:56px; }
.service-tag { display:flex; align-items:center; gap:14px; margin-bottom:28px; }
.service-tag-line { width:40px; height:1px; background:var(--red); }
.service-tag span { font-family:var(--font-en); font-size:12px; font-weight:600; letter-spacing:.25em; text-transform:uppercase; color:var(--red); }
.service-title-row { display:flex; flex-direction:row; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:0; flex-wrap:wrap; }
.service-title { font-family:var(--font-cn); font-weight:700; color:var(--gray-950); line-height:1.05; font-size:clamp(1.8rem,4vw,3.2rem); letter-spacing:-.02em; }
.service-title-red { color:var(--red); }
.service-sub { font-family:var(--font-cn); font-size:16px; color:var(--gray-400); max-width:340px; }
.service-divider { height:1px; background:rgba(0,0,0,0.07); margin-top:56px; }

.service-grid { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid rgba(0,0,0,0.07); }
.service-card { padding:36px; transition:all .3s var(--ease-out); }
.service-card:hover { background:#f9f9f7; transform:translateY(-3px); }
.service-card:nth-child(-n+3) { border-right:1px solid rgba(0,0,0,0.07); }
.service-num { font-family:var(--font-en); font-size:48px; font-weight:700; color:#dddddd; line-height:1; display:block; margin-bottom:24px; user-select:none; }
.service-card h3 { font-family:var(--font-cn); font-size:25px; font-weight:600; color:var(--gray-900); margin-bottom:4px; }
.service-card-en { font-family:var(--font-en); font-size:10px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:rgba(129,7,18,0.5); margin-bottom:20px; }
.service-card-line { width:24px; height:1px; background:var(--red); margin-bottom:20px; transition:width .3s; }
.service-card:hover .service-card-line { width:48px; }
.service-card-desc { font-family:var(--font-cn); font-size:16px; color:var(--gray-500); line-height:1.7; }

/* 联系 CTA - 全屏背景图 */
.contact-cta {
    position:relative; overflow:hidden;
    padding:120px 0;
    margin-top:0px;
    display:flex; align-items:center; justify-content:center;
}
.contact-cta-bg {
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; object-position:center;
    transform:scale(1.02);
    animation:contactBgZoom 20s ease-in-out infinite alternate;
}
@keyframes contactBgZoom {
    0% { transform:scale(1.02); }
    100% { transform:scale(1.1); }
}
.contact-cta:hover .contact-cta-bg { animation-play-state:paused; transform:scale(1.12); transition:transform 1s ease; }
.contact-cta-overlay {
    position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.55) 40%, rgba(0,0,0,0.75) 100%);
}
.contact-cta-content {
    position:relative; z-index:10;
    max-width:900px; margin:0 auto; padding:0 32px;
    text-align:center;
}
/* tag */
.contact-cta .contact-cta-tag {
    display:inline-flex; align-items:center; gap:16px; margin-bottom:28px;
}
.contact-cta .contact-cta-tag span:first-child,
.contact-cta .contact-cta-tag span:last-child {
    display:inline-block; width:40px; height:1px;
    background:var(--red); opacity:0.6;
}
.contact-cta .contact-cta-tag span:nth-child(2) {
    font-family:var(--font-en); font-size:11px; font-weight:600;
    letter-spacing:.22em; text-transform:uppercase; color:var(--red);
}
/* title */
.contact-cta-content h2 {
    font-family:var(--font-cn); font-size:clamp(1.8rem,4vw,3.4rem);
    font-weight:700; color:#fff; letter-spacing:-.01em;
    margin-bottom:24px; line-height:1.2;
}
/* desc */
.contact-cta-desc {
    font-family:var(--font-cn); font-size:16px; color:rgba(255,255,255,0.6);
    line-height:1.8; margin-bottom:56px; max-width:620px; margin-left:auto; margin-right:auto;
}
/* contact cards */
.contact-cta-cards {
    display:grid; grid-template-columns:1fr 1fr; gap:20px;
    margin-bottom:48px; max-width:720px; margin-left:auto; margin-right:auto;
}
.contact-card {
    display:flex; align-items:center; gap:20px;
    padding:28px 32px; border-radius:4px;
    text-align:left;
    transition:all .35s var(--ease-out);
    position:relative; overflow:hidden;
}
.contact-card-phone {
    background:var(--red);
}
.contact-card-phone:hover {
    background:var(--red-hover);
    transform:translateY(-4px);
    box-shadow:0 16px 40px rgba(129,7,18,0.4);
}
.contact-card-email {
    background:rgba(255,255,255,0.08);
    border:1px solid rgba(255,255,255,0.12);
    backdrop-filter:blur(8px);
}
.contact-card-email:hover {
    background:rgba(255,255,255,0.14);
    border-color:rgba(255,255,255,0.25);
    transform:translateY(-4px);
    box-shadow:0 16px 40px rgba(0,0,0,0.3);
}
.contact-card-icon {
    width:48px; height:48px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
}
.contact-card-phone .contact-card-icon {
    background:rgba(255,255,255,0.18); color:#fff;
}
.contact-card-email .contact-card-icon {
    background:rgba(255,255,255,0.1); color:rgba(255,255,255,0.8);
}
.contact-card-icon svg { width:22px; height:22px; }
.contact-card-text { flex:1; min-width:0; }
.contact-card-label {
    display:block; font-family:var(--font-en); font-size:10px;
    letter-spacing:.12em; text-transform:uppercase;
    margin-bottom:6px;
}
.contact-card-phone .contact-card-label { color:rgba(255,255,255,0.55); }
.contact-card-email .contact-card-label { color:rgba(255,255,255,0.4); }
.contact-card-value {
    display:block; font-family:var(--font-en); font-size:19px;
    font-weight:700; letter-spacing:.03em; color:#fff;
    word-break:break-all;
}
.contact-card-value.youx { font-weight: 400; font-size:13px; letter-spacing:0em;}
.contact-card-arrow {
    flex-shrink:0; opacity:0; transform:translateX(-8px);
    transition:all .3s var(--ease-out);
    color:#fff;
}
.contact-card-arrow svg { width:18px; height:18px; }
.contact-card:hover .contact-card-arrow { opacity:1; transform:translateX(0); }
/* badges */
.contact-cta-badges {
    display:flex; align-items:center; justify-content:center;
    gap:32px; flex-wrap:wrap;
}
.cta-badge {
    display:flex; align-items:center; gap:12px;
    padding:14px 24px;
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:50px;
    transition:all .3s var(--ease-out);
}
.cta-badge:hover {
    background:rgba(255,255,255,0.12);
    border-color:rgba(255,255,255,0.2);
}
.cta-badge-icon { width:22px; height:22px; color:var(--red); flex-shrink:0; }
.cta-badge-icon svg { width:22px; height:22px; }
.cta-badge-text {
    font-family:var(--font-cn); font-size:16px; font-weight:600;
    color:rgba(255,255,255,0.85);
    display:flex; align-items:baseline; gap:8px;
}
.cta-badge-text small {
    font-family:var(--font-en); font-size:10px; font-weight:400;
    letter-spacing:.1em; text-transform:uppercase;
    color:rgba(255,255,255,0.35);
}

/* ==================== 底部 ==================== */
.footer { background:var(--gray-950); color:rgba(255,255,255,0.7); }
.footer-top { padding:100px 0 60px; border-bottom:1px solid rgba(255,255,255,0.06); }
.footer .footer-inner { max-width:var(--max-w); margin:0 auto; padding:0 32px; }

.footer-grid {
    display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;
    gap:40px;
}
.footer-logo-text { margin-bottom:16px; line-height:1.4; }
.flogo-cn { display:block; font-family:var(--font-cn); font-size:24px; font-weight:700; color:#fff; letter-spacing:.03em; }
.flogo-en { display:block; font-family:var(--font-en); font-size:10px; font-weight:600; color:var(--red); letter-spacing:.1em; margin-top:4px; }
.footer-info > p { font-size:16px; margin-bottom:24px; opacity:0.6; font-family:var(--font-cn); }
.footer-contacts { display:flex; flex-direction:column; gap:12px; }
.fc-item {
    display:flex; align-items:center; gap:10px;
    font-size:16px; color:rgba(255,255,255,0.6);
    font-family:var(--font-cn);
}
.fc-item svg { flex-shrink:0; opacity:0.5; }

.footer-col h4 {
    font-size:16px; color:#fff; margin-bottom:24px;
    font-weight:600; letter-spacing:1px;
    position:relative; padding-bottom:12px;
    font-family:var(--font-cn);
}
.footer-col h4::after {
    content:''; position:absolute; bottom:0; left:0;
    width:40px; height:2px; background:var(--red); border-radius:1px;
}
.footer-col ul li { margin-bottom:10px; }
.footer-col ul li a {
    font-size:16px; color:rgba(255,255,255,0.5);
    transition:color .2s; font-family:var(--font-cn);
}
.footer-col ul li a:hover { color:#fff; padding-left:6px; }

.footer-qr { text-align:center; }
.qr-box {
    width:130px; height:130px; margin:0 auto 12px;
    border-radius:6px; overflow:hidden; background:#fff; padding:3px;
}
.qr-box img { width:100%; height:100%; object-fit:contain; }
.footer-qr p { font-size:17px; color:rgba(255,255,255,0.5); font-family:var(--font-cn); }

.footer-bottom { padding:24px 0; }
.footer-bottom .footer-inner { max-width:var(--max-w); margin:0 auto; padding:0 32px; }
.footer-bottom-row {
    display:flex; justify-content:space-between; align-items:center;
    font-size:15px; color:rgba(255,255,255,0.4); flex-wrap:wrap; gap:8px;
}
.footer-bottom-row a { color:rgba(255,255,255,0.4); }
.footer-bottom-row a:hover { color:#fff; }

/* ==================== 内页公用区块 ==================== */
.section-inner { max-width:var(--max-w); margin:0 auto; padding:0 32px; }
.section-header { text-align:center; margin-bottom:56px;  }
.section-tag-en { display:inline-block; font-family:var(--font-en); font-size:12px; font-weight:600; letter-spacing:.25em; text-transform:uppercase; color:var(--red); margin-bottom:16px; }
.section-header h2 { font-family:var(--font-cn); font-weight:700; color:var(--gray-950); font-size:clamp(1.8rem,4vw,3rem); letter-spacing:-.02em; }
.section-header h2 .hl { color:var(--red); }
.section-divider { display:flex; align-items:center; justify-content:center; margin-top:24px; }
.section-divider span { display:block; width:40px; height:2px; background:var(--red); border-radius:1px; }
.section-subtitle { font-family:var(--font-cn); font-size:15px; color:var(--gray-400); margin-top:12px; display: none;}

/* ==================== 关于我们 - Hero 概览 ==================== */
.about-hero { padding:100px 0 60px; background:#fff; }
.about-hero-inner { max-width:var(--max-w); margin:0 auto; padding:0 32px; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.about-hero-text { display:flex; flex-direction:column; gap:20px; }
.hero-badge { display:inline-block; font-family:var(--font-en); font-size:12px; font-weight:600; letter-spacing:.16em; color:var(--red); padding:6px 16px; border:1px solid rgba(129,7,18,0.2); border-radius:2px; align-self:flex-start; }
.about-hero-text h2 { font-family:var(--font-cn); font-size:clamp(2rem,4vw,3rem); font-weight:700; color:var(--gray-950); line-height:1.25; letter-spacing:.02em; }
.about-hero-text h2 .hl { color:var(--red); }
.hero-lead { font-family:var(--font-cn); font-size:16px; color:var(--gray-600); line-height:2; border-left:3px solid var(--red); padding-left:16px; }
.hero-desc { font-family:var(--font-cn); font-size:14px; color:var(--gray-500); line-height:1.9; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:8px; }
.hero-btn-primary { display:inline-flex; align-items:center; gap:8px; background:var(--red); color:#fff; font-family:var(--font-cn); font-size:15px; font-weight:600; padding:13px 28px; border-radius:4px; transition:all .2s; }
.hero-btn-primary:hover { background:var(--red-hover); box-shadow:0 6px 20px rgba(129,7,18,0.25); }
.hero-btn-outline { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--gray-300); color:var(--gray-700); font-family:var(--font-cn); font-size:15px; font-weight:600; padding:13px 28px; border-radius:4px; transition:all .2s; }
.hero-btn-outline:hover { border-color:var(--red); color:var(--red); }

.about-hero-img { position:relative; overflow:hidden; border-radius:6px; box-shadow:0 20px 60px rgba(0,0,0,0.1); }
.about-hero-img img { width:100%; height:100%; object-fit:cover; min-height:480px; display:block; }
.hero-img-badge { position:absolute; top:0; left:0; background:var(--red); padding:18px 24px; }
.hero-img-badge .badge-year { font-family:var(--font-en); font-size:48px; font-weight:700; color:#fff; line-height:1; display:block; }
.hero-img-badge .badge-label { font-family:var(--font-en); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,0.55); margin-top:4px; display:block; }

/* ==================== 关于我们 - 数据看板 ==================== */
.about-stats { padding:0 0 60px; }
.stats-strip { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(0,0,0,0.06); border-bottom:1px solid rgba(0,0,0,0.06); }
.stat-block { text-align:center; padding:32px 20px; position:relative; transition:background .3s; }
.stat-block:not(:last-child)::after { content:''; position:absolute; right:0; top:20%; height:60%; width:1px; background:rgba(0,0,0,0.06); }
.stat-block:hover { background:var(--red-light); }
.stat-big { display:block; font-family:var(--font-en); font-size:40px; font-weight:700; color:var(--gray-950); line-height:1; margin-bottom:8px; }
.stat-plus { font-family:var(--font-cn); font-size:22px; color:var(--red); margin-left:2px; }
.stat-title { display:block; font-family:var(--font-cn); font-size:18px; font-weight:600; color:var(--gray-800); margin-bottom:4px; }
.stat-desc { display:block; font-family:var(--font-cn); font-size:14px; color:var(--gray-400); }

/* ==================== 关于我们 - 品牌代理 ==================== */
.about-brands { padding:80px 0; background:var(--gray-50); }
.brands-showcase { display:flex; flex-direction:column; gap:32px; }
.brand-show-card { display:grid; grid-template-columns:280px 1fr; background:#fff; border-radius:8px; overflow:hidden; border:1px solid rgba(0,0,0,0.06); transition:all .35s var(--ease-out); }
.brand-show-card:hover { box-shadow:0 12px 40px rgba(0,0,0,0.08); transform:translateY(-2px); }
.brand-show-img { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px 24px; color:#fff; text-align:center; min-height:200px; }
.brand-show-name { font-family:var(--font-en); font-size:26px; font-weight:700; letter-spacing:.02em; line-height:1; }
.brand-show-sub { font-family:var(--font-en); font-size:10px; letter-spacing:.2em; opacity:0.6; margin-top:10px; }
.brand-show-info { padding:32px; display:flex; flex-direction:column; justify-content:center; gap:12px; }
.brand-show-info h4 { font-family:var(--font-cn); font-size:20px; font-weight:600; color:var(--gray-900); }
.brand-show-info > p { font-family:var(--font-cn); font-size:14px; color:var(--gray-500); line-height:1.9; }
.brand-show-info ul { display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.brand-show-info ul li { font-family:var(--font-cn); font-size:12px; color:var(--gray-500); background:var(--gray-50); padding:5px 14px; border-radius:20px; }

/* ==================== 关于我们 - 横向时间线 ==================== */
.about-timeline-h { padding:80px 0 100px; }
.timeline-h { display:flex; align-items:flex-start; justify-content:space-between; position:relative; gap:8px; max-width:1000px; margin:0 auto; }
.tl-h-track { position:absolute; top:19px; left:0; right:0; height:2px; background:var(--gray-200); }
.tl-h-item { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; gap:12px; flex:1; min-width:0; }
.tl-h-dot { width:16px; height:16px; border-radius:50%; background:#fff; border:3px solid var(--red); flex-shrink:0; }
.tl-h-item:hover .tl-h-dot { background:var(--red); }
.tl-h-year { font-family:var(--font-en); font-size:22px; font-weight:700; color:var(--red); }
.tl-h-card { text-align:center; padding:16px 12px; }
.tl-h-card h4 { font-family:var(--font-cn); font-size:14px; font-weight:600; color:var(--gray-800); margin-bottom:4px; }
.tl-h-card p { font-family:var(--font-cn); font-size:12px; color:var(--gray-400); line-height:1.6; }

/* ==================== 关于我们 - 企业文化 ==================== */
.about-values { padding:60px 0 100px; background:var(--gray-50); }
.values-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.value-card { background:#fff; padding:36px 28px; border-radius:8px; border:1px solid rgba(0,0,0,0.05); position:relative; overflow:hidden; transition:all .35s var(--ease-out); }
.value-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--red); transform:scaleX(0); transition:transform .35s var(--ease-out); }
.value-card:hover { box-shadow:0 12px 36px rgba(0,0,0,0.06); transform:translateY(-4px); }
.value-card:hover::before { transform:scaleX(1); }
.value-num { font-family:var(--font-en); font-size:36px; font-weight:700; color:var(--gray-100); line-height:1; margin-bottom:16px; user-select:none; }
.value-card h4 { font-family:var(--font-cn); font-size:18px; font-weight:600; color:var(--gray-900); margin-bottom:10px; }
.value-card p { font-family:var(--font-cn); font-size:14px; color:var(--gray-500); line-height:1.8; }

/* ==================== 产品中心 - 产品分类 ==================== */
.page-products-category { padding:80px 0 60px; }
.product-cat-block { margin-bottom:80px; }
.product-cat-block:last-child { margin-bottom:0; }

/* 分类头部 */
.cat-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:40px; padding-bottom:24px; border-bottom:2px solid rgba(0,0,0,0.06); flex-wrap:wrap; gap:16px; }
.cat-header-left { display:flex; align-items:center; gap:16px; }
.cat-icon { width:52px; height:52px; border-radius:50%; background:var(--red); display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0; box-shadow:0 4px 16px rgba(129,7,18,0.2); }
.cat-icon svg { width:24px; height:24px; }
.cat-title h3 { font-family:var(--font-cn); font-size:26px; font-weight:700; color:var(--gray-900); letter-spacing:.02em; }
.cat-title span { font-family:var(--font-en); font-size:12px; color:var(--gray-400); letter-spacing:.12em; text-transform:uppercase; display:block; margin-top:2px; }
.cat-more { font-family:var(--font-cn); font-size:14px; color:var(--red); font-weight:500; padding:8px 18px; border:1px solid rgba(129,7,18,0.2); border-radius:50px; transition:all .25s; white-space:nowrap; }
.cat-more:hover { background:var(--red); color:#fff; border-color:var(--red); }

/* 卡片网格 */
.cat-grid { display:grid; gap:24px;






}
.cat-grid-4 { grid-template-columns:repeat(4,1fr); }
.cat-grid-2 { grid-template-columns:repeat(2,1fr); }
.cat-grid-3 { grid-template-columns:repeat(3,1fr); }

/* 垂直卡片 - 上图下文 */
.cat-card { background:#fff; border-radius:8px; overflow:hidden; border:1px solid rgba(0,0,0,0.06); transition:all .4s var(--ease-out); display:flex; flex-direction:column; }
.cat-card:hover { border-color:rgba(129,7,18,0.15); box-shadow:0 20px 50px rgba(0,0,0,0.1); transform:translateY(-6px); }

/* 图片区 */
.cat-card-img { position:relative; width:100%;  height: 100%; justify-content: center; text-align: center; aspect-ratio:4/3; overflow:hidden; background:var(--gray-100);  height: 300px; display: grid; align-items: center;}
.cat-card-img img { width:80%; max-height: 88%;  height: auto; object-fit:; transition:transform .7s var(--ease-out);  mix-blend-mode: darken; margin: 0px auto;}
.cat-card:hover .cat-card-img img { transform:scale(1.08); }

/* 图片悬浮遮罩 */
.cat-card-overlay { position:absolute; inset:0; background:rgba(129,7,18,0.75); display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .35s var(--ease-out); }
.cat-card:hover .cat-card-overlay { opacity:1; }
.cat-card-overlay span { font-family:var(--font-cn); font-size:15px; color:#fff; font-weight:500; padding:10px 24px; border:1px solid rgba(255,255,255,0.5); border-radius:50px; letter-spacing:1px; }

/* 信息区 */
.cat-card-info { padding:24px; display:flex; flex-direction:column; gap:6px; flex:1; }
.cat-card-tag { display:inline-block; align-self:flex-start; font-family:var(--font-en); font-size:10px; font-weight:700; letter-spacing:.1em; color:#fff; padding:4px 10px; border-radius:3px; margin-bottom:4px;  background: var(--red);}
.tag-travaini { background:var(--travaini); }
.tag-pvr { background:var(--pvr); }
.tag-sullair { background:var(--sullair); }
.cat-card-info h4 { font-family:var(--font-cn); font-size:20px; font-weight:600; color:var(--gray-900); }
.cat-card-info .en { font-family:var(--font-en); font-size:11px; color:var(--red); letter-spacing:.05em; }
.cat-card-line { width:32px; height:2px; background:var(--red); border-radius:1px; margin:6px 0; transition:width .4s var(--ease-out); }
.cat-card:hover .cat-card-line { width:56px; }
.cat-card-info .spec { font-family:var(--font-cn); font-size:14px; color:var(--gray-600); font-weight:500; }
.cat-card-info .desc { font-family:var(--font-cn); font-size:13px; color:var(--gray-400); line-height:1.8; margin-top:auto; padding-top:10px; }

/* ==================== 产品中心 - 应用行业 ==================== */
.applications-section { padding:60px 0 100px; background:var(--gray-50); }
.app-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; max-width:900px; margin:0 auto; }
.app-item { display:flex; align-items:center; gap:12px; padding:16px 20px; background:#fff; border-radius:6px; border:1px solid rgba(0,0,0,0.05); transition:all .3s; }
.app-item:hover { border-color:var(--red); box-shadow:0 4px 16px rgba(129,7,18,0.08); }
.app-icon-circle { width:36px; height:36px; border-radius:50%; background:var(--red-light); display:flex; align-items:center; justify-content:center; color:var(--red); flex-shrink:0; }
.app-icon-circle svg { width:18px; height:18px; }
.app-item span { font-family:var(--font-cn); font-size:15px; font-weight:500; color:var(--gray-700); }
.app-cta { text-align:center; margin-top:40px; }
.app-cta p { font-family:var(--font-cn); font-size:14px; color:var(--gray-400); margin-bottom:12px; }
.app-cta-link { font-family:var(--font-cn); font-size:15px; color:var(--red); font-weight:500; transition:color .2s; }
.app-cta-link:hover { color:var(--red-hover); }

/* ==================== 售后服务 - 服务承诺 ==================== */
.service-page { padding-top: 80px; padding-bottom: 80px;}
.service-commitment { padding:80px 0 40px; }
.commitment-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.commitment-card { text-align:center; padding:36px 24px; border:1px solid rgba(0,0,0,0.06); border-radius:6px; transition:all .3s var(--ease-out); }
.commitment-card:hover { border-color:rgba(129,7,18,0.2); transform:translateY(-4px); box-shadow:0 8px 30px rgba(0,0,0,0.06); }
.commitment-icon-wrap { width:56px; height:56px; margin:0 auto 20px; border-radius:50%; background:var(--red-light); display:flex; align-items:center; justify-content:center; color:var(--red); }
.commitment-icon-wrap svg { width:26px; height:26px; }
.commitment-card h4 { font-family:var(--font-cn); font-size:17px; font-weight:600; color:var(--gray-900); margin-bottom:12px; }
.commitment-card p { font-family:var(--font-cn); font-size:14px; color:var(--gray-500); line-height:1.8; }

/* ==================== 售后服务 - 服务内容 ==================== */
.service-detail { padding:40px 0 60px; background:var(--gray-50); }
.service-detail-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.sd-card { display:flex; gap:20px; padding:32px; background:#fff; border-radius:6px; border:1px solid rgba(0,0,0,0.05); transition:all .3s; }
.sd-card:hover { box-shadow:0 6px 24px rgba(0,0,0,0.06); }
.sd-num { font-family:var(--font-en); font-size:42px; font-weight:700; color:var(--gray-200); line-height:1; flex-shrink:0; user-select:none; }
.sd-body h4 { font-family:var(--font-cn); font-size:19px; font-weight:600; color:var(--gray-900); margin-bottom:4px; }
.sd-body h4 small { font-family:var(--font-en); font-size:10px; font-weight:500; color:var(--red); letter-spacing:.08em; margin-left:8px; text-transform:uppercase; }
.sd-body p { font-family:var(--font-cn); font-size:14px; color:var(--gray-500); line-height:1.8; margin:12px 0; }
.sd-body ul { display:flex; flex-wrap:wrap; gap:8px; }
.sd-body ul li { font-family:var(--font-cn); font-size:12px; color:var(--gray-500); background:var(--gray-50); padding:4px 12px; border-radius:20px; }

/* ==================== 售后服务 - 服务流程 ==================== */
.service-process { padding:80px 0; }
.process-flow { display:flex; align-items:center; justify-content:center; gap:0; flex-wrap:wrap; }
.process-step { display:flex; flex-direction:column; align-items:center; gap:12px; width:130px; }
.process-icon-circle { width:64px; height:64px; border-radius:50%; background:#fff; border:2px solid var(--red); display:flex; align-items:center; justify-content:center; color:var(--red); transition:all .3s; }
.process-step:hover .process-icon-circle { background:var(--red); color:#fff; }
.process-icon-circle svg { width:26px; height:26px; }
.process-label { font-family:var(--font-cn); font-size:14px; font-weight:500; color:var(--gray-700); }
.process-arrow { font-size:22px; color:var(--gray-300); padding:0 16px; margin-bottom:24px; }

/* ==================== 售后服务 - 常见问题 ==================== */
.service-faq { padding:60px 0 100px; background:var(--gray-50); }
.faq-list { max-width:800px; margin:0 auto; display:flex; flex-direction:column; gap:16px; }
.faq-item { background:#fff; padding:24px 28px; border-radius:6px; border:1px solid rgba(0,0,0,0.05); }
.faq-q { font-family:var(--font-cn); font-size:16px; font-weight:600; color:var(--gray-900); margin-bottom:10px; }
.faq-a { font-family:var(--font-cn); font-size:14px; color:var(--gray-500); line-height:1.8; }
.faq-a strong { color:var(--red); }

/* ==================== 联系我们 - 联系方式 ==================== */
.contact-info-section { padding:80px 0 80px; }
.contact-info-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.ci-card { display:flex; align-items:center; gap:16px; padding:28px 24px; border-radius:8px; transition:all .3s; }
.ci-card:hover { transform:translateY(-3px); }
.ci-card-phone { background:var(--red); }
.ci-card-phone:hover { background:var(--red-hover); box-shadow:0 8px 28px rgba(129,7,18,0.3); }
.ci-card-email { background:var(--gray-800); }
.ci-card-email:hover { background:var(--gray-900); box-shadow:0 8px 28px rgba(0,0,0,0.2); }
.ci-card-addr { background:var(--gray-800); }
.ci-card-addr:hover { background:var(--gray-900); box-shadow:0 8px 28px rgba(0,0,0,0.2); }
.ci-card-qr { background:#fff; border:1px solid rgba(0,0,0,0.08); flex-direction:column; text-align:center; }
.ci-card-qr:hover { border-color:var(--red); }
.ci-icon-bg { width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,0.15); display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0; }
.ci-icon-bg svg { width:22px; height:22px; }
.ci-qr-img { width:80px; height:80px; border-radius:6px; overflow:hidden; background:#fff; padding:3px; border:1px solid rgba(0,0,0,0.06); }
.ci-qr-img img { width:100%; height:100%; object-fit:contain; }
.ci-text { display:flex; flex-direction:column; gap:4px; }
.ci-card-qr .ci-text { text-align:center; }
.ci-label { font-family:var(--font-en); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,0.5); }
.ci-card-qr .ci-label { color:var(--gray-400); }
.ci-value { font-family:var(--font-cn); font-size:16px; font-weight:600; color:#fff; word-break:break-all; }
.ci-card-qr .ci-value { color:var(--gray-700); font-size:14px; }

/* ==================== 联系我们 - 在线留言 ==================== */
.contact-form-section { padding:40px 0 100px; }
.contact-form { max-width:800px; margin:0 auto; }
.contact-form .form-row { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
.contact-form .form-group { display:flex; flex-direction:column; gap:6px; }
.contact-form .form-group.full { margin-bottom:20px; }
.contact-form label { font-family:var(--font-cn); font-size:14px; font-weight:500; color:var(--gray-700); }
.contact-form label span { color:var(--red); }
.contact-form input, .contact-form select, .contact-form textarea {
    padding:12px 16px; border:1px solid var(--gray-200); border-radius:6px;
    font-family:var(--font-cn); font-size:14px; color:var(--gray-800);
    background:#fff; transition:border-color .2s; outline:none;
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color:var(--red); box-shadow:0 0 0 3px rgba(129,7,18,0.06); }
.contact-form textarea { resize:vertical; }
.form-submit { display:flex; align-items:center; gap:20px; margin-top:32px; flex-wrap:wrap; }
.form-submit-btn { padding:14px 40px; background:var(--red); color:#fff; font-family:var(--font-cn); font-size:16px; font-weight:600; border-radius:4px; border:none; cursor:pointer; transition:all .2s; }
.form-submit-btn:hover { background:var(--red-hover); transform:translateY(-2px); box-shadow:0 6px 20px rgba(129,7,18,0.25); }
.form-note { font-family:var(--font-cn); font-size:13px; color:var(--gray-400); }
.form-note strong { color:var(--red); }

/* ==================== 响应式 ==================== */
@media (max-width:1199px) {
    .products-grid { grid-template-columns:repeat(3,1fr); }
    .footer-grid { grid-template-columns:1.5fr 1fr 1fr; }
    .footer-qr { display:none; }
}

@media (max-width:991px) {
    .header { padding:0 24px; }
    .nav { display:none; }
    .menu-toggle { display:flex; }
    .btn-contact { display:none; }
    .lang-switch { display:none; }
    .banner-content { left:6%; max-width:600px; }
    .banner-dots { top:auto; bottom:36px; right:auto; left:50%; transform:translateX(-50%); flex-direction:row; gap:8px; }
    .banner-dots .dot { width:10px; height:10px; border:none; }
    .banner-dots .dot.active { width:28px; height:10px; }
    .about-grid { grid-template-columns:1fr; }
    .about-img-col { min-height:300px; }
    .quote-break { height:200px; }
    .quote-cn { font-size:clamp(1.1rem,5vw,1.5rem); }
    .quote-cn::before { width:32px; margin-bottom:14px; }
    .quote-en-wrap p { font-size:12px; }
    .about-text-col { border-left:none; border-top:1px solid rgba(0,0,0,0.07); }
    .stats-row { grid-template-columns:repeat(2,1fr); }
    .products-grid { grid-template-columns:repeat(2,1fr); }
    .service-grid { grid-template-columns:repeat(2,1fr); }
    .service-card:nth-child(2) { border-right:none; }
    .contact-cta-cards { grid-template-columns:1fr; max-width:400px; }
    .contact-cta-badges { gap:16px; }
    .cta-badge { padding:12px 20px; }
    .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
    /* 内页响应式 */
    .about-hero-inner { grid-template-columns:1fr; gap:40px; }
    .about-hero-img img { min-height:320px; }
    .stats-strip { grid-template-columns:repeat(2,1fr); }
    .stat-block:nth-child(2)::after { display:none; }
    .brand-show-card { grid-template-columns:200px 1fr; }
    .brand-show-name { font-size:20px; }
    .timeline-h { flex-wrap:wrap; gap:20px; }
    .tl-h-track { display:none; }
    .tl-h-item { flex:0 0 auto; width:calc(33.33% - 14px); }
    .values-grid { grid-template-columns:repeat(2,1fr); }
    .cat-grid-4 { grid-template-columns:repeat(2,1fr); }
    .cat-grid-2 { grid-template-columns:repeat(2,1fr); }
    .cat-card-info h4 { font-size:18px; }
    .app-grid { grid-template-columns:repeat(3,1fr); }
    .commitment-grid { grid-template-columns:repeat(2,1fr); }
    .service-detail-grid { grid-template-columns:1fr; }
    .process-flow { gap:12px; }
    .process-arrow { display:none; }
    .contact-info-grid { grid-template-columns:repeat(2,1fr); }
    .contact-form .form-row { grid-template-columns:1fr; }
}

@media (max-width:767px) {
    .header-inner { height:64px; }
    .logo-cn { font-size:17px; }
    .logo-en { font-size:8px; }
    .banner { min-height:480px; height:80vh; }
    .banner-content h1 { font-size:clamp(1.8rem,6vw,30px); letter-spacing:1px; }
    .banner-content p { font-size:16px; }
    .banner-tag { font-size:11px; letter-spacing:3px; padding:8px 14px; }
    .banner-tag::before { height:12px; }
    .banner-content { left:6%; max-width:90vw; }
    .banner-btns { flex-direction:column; gap:10px; }
    .banner-btns .btn { text-align:center; justify-content:center; }
    .banner-controls { bottom:20px; right:16px; }
    .banner-arrow { width:44px; height:44px; }
    .banner-scroll { display:none; }
    .banner-dots { top:auto; bottom:24px; right:auto; left:50%; transform:translateX(-50%); flex-direction:row; gap:8px; }
    .banner-dots .dot { width:8px; height:8px; border:none; }
    .banner-dots .dot.active { width:24px; height:8px; }
    .brands-inner { flex-direction:column; align-items:flex-start; gap:20px; }
    .brands-list { gap:24px; }
    .about-header { padding:64px 24px 32px; }
    .about-grid { margin:0 24px; }
    .about-text-col { padding:24px; }
    .stats-row { padding:0 24px 64px; grid-template-columns:1fr 1fr; }
    .stat-card { padding:24px; }
    .stat-value { font-size:2rem; }
    .products { padding:64px 0; }
    .products-inner { padding:0 24px; }
    .products-title-row { flex-direction:column; align-items:flex-start; }
    .products-grid { grid-template-columns:1fr 1fr; gap:12px; }
    .product-card-body { padding:16px; }
    .service { padding:64px 0 0; }
    .service-inner { padding:0 24px; }
    .service-grid { grid-template-columns:1fr; }
    .service-card { border-right:none !important; border-bottom:1px solid rgba(0,0,0,0.07); }
    .contact-cta { padding:80px 0; }
    .contact-cta-content { padding:0 24px; }
    .contact-cta-content h2 { font-size:clamp(1.4rem,6vw,2rem); }
    .contact-cta-desc { font-size:16px; margin-bottom:36px; }
    .contact-cta-cards { grid-template-columns:1fr; gap:14px; }
    .contact-card { padding:22px 24px; gap:14px; }
    .contact-card-value { font-size:16px; }
    .contact-cta-badges { flex-direction:column; gap:12px; align-items:center; }
    .footer .footer-inner { padding:0 24px; }
    .footer-top { padding:60px 0 36px; }
    .footer-grid { grid-template-columns:1fr; gap:30px; }
    .footer-bottom-row { flex-direction:column; text-align:center; }
    /* 内页响应式 */
    .prod-nav-strip { top:64px; }
    .prod-nav-inner { padding:0 16px; }
    .prod-nav-item { padding:14px 12px; font-size:13px; }
    .prod-nav-item::after { left:12px; right:12px; }
    .section-header { margin-bottom:40px;  }
    .about-hero { padding:48px 0 40px; }
    .about-hero-inner { grid-template-columns:1fr; gap:32px; padding:0 24px; }
    .about-hero-img img { min-height:260px; }
    .hero-badge { font-size:11px; }
    .stats-strip { grid-template-columns:repeat(2,1fr); }
    .stat-block { padding:24px 16px; }
    .stat-block:nth-child(2)::after { display:none; }
    .stat-big { font-size:32px; }
    .brand-show-card { grid-template-columns:1fr; }
    .brand-show-img { min-height:120px; padding:28px; }
    .brand-show-name { font-size:22px; }
    .brand-show-info { padding:24px; }
    .timeline-h { flex-wrap:wrap; gap:0; }
    .tl-h-track { display:none; }
    .tl-h-item { flex:0 0 auto; width:50%; margin-bottom:24px; }
    .values-grid { grid-template-columns:1fr 1fr; gap:16px; }
    .value-card { padding:28px 20px; }
    .cat-grid-4 { grid-template-columns:repeat(2,1fr); gap:16px; }
    .cat-grid-2 { grid-template-columns:1fr 1fr; gap:16px; }
    .cat-title h3 { font-size:21px; }
    .cat-card-info { padding:18px; }
    .cat-card-info h4 { font-size:17px; }
    .app-grid { grid-template-columns:repeat(2,1fr); }
    .commitment-grid { grid-template-columns:1fr 1fr; gap:16px; }
    .service-detail-grid { grid-template-columns:1fr; }
    .sd-card { padding:24px; }
    .process-step { width:100px; }
    .process-icon-circle { width:52px; height:52px; }
    .process-icon-circle svg { width:22px; height:22px; }
    .process-label { font-size:12px; }
    .contact-info-grid { grid-template-columns:1fr 1fr; gap:16px; }
    .ci-card { padding:22px 18px; }
    .ci-value { font-size:14px; }
    .contact-form { padding:0; }
}

@media (max-width:480px) {
    .stats-row { grid-template-columns:1fr; }
    .products-grid { grid-template-columns:1fr; }
    .banner-btns { flex-direction:column; }
    .banner-btns .btn { justify-content:center; }
    /* 内页响应式 */
    .about-hero-inner { padding:0 20px; }
    .hero-actions { flex-direction:column; }
    .hero-actions a { text-align:center; justify-content:center; }
    .stats-strip { grid-template-columns:repeat(2,1fr); }
    .stat-block:nth-child(2)::after { display:none; }
    .tl-h-item { width:50%; }
    .values-grid { grid-template-columns:1fr; }
    .brand-show-info ul { flex-direction:column; }
    .prod-nav-item { padding:12px 10px; font-size:12px; }
    .prod-nav-sep { display:none; }
    .commitment-grid { grid-template-columns:1fr; }
    .cat-grid-4 { grid-template-columns:1fr; }
    .cat-grid-2 { grid-template-columns:1fr; }
    .cat-header { flex-direction:column; align-items:flex-start; }
    .app-grid { grid-template-columns:1fr 1fr; }
    .contact-info-grid { grid-template-columns:1fr; }
    .process-flow { flex-direction:column; gap:18px; }
    .process-arrow { display:none; }
    .form-submit { flex-direction:column; align-items:flex-start; }
}











/*fanye*/

.newspage{ width: 92%;
    padding: 20px 4% 0px;
    height: auto;/* overflow: hidden;*/ display:block;
 }
 
.newspage {
width:100%;PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px;  PADDING-TOP: 20px; TEXT-ALIGN: center; margin:60px auto 0px; clear:both; height:30px
}
.newspage A { 
BORDER-RIGHT: #999 1px solid; PADDING-RIGHT:8px; BORDER-TOP: #999 1px solid; PADDING-LEFT: 8px; BACKGROUND: #fff; PADDING-BOTTOM: 3px; FONT: 13px/22px ""; BORDER-LEFT: #999 1px solid; COLOR: #666; MARGIN-RIGHT: 2px; PADDING-TOP: 3px; BORDER-BOTTOM: #999 1px solid; font-family:'Barlow-Regular',PingFang SC,'Microsoft YaHei',Arial;border-radius: 0px;
}
.newspage A:hover {
BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #fff 1px solid; BACKGROUND: #007abf; BORDER-LEFT: #fff 1px solid; COLOR: #FFFFFF; BORDER-BOTTOM: #fff 1px solid; TEXT-DECORATION: none
}
.newspage A:active {
BORDER-RIGHT: #666 1px solid; BORDER-TOP: #666 1px solid; BACKGROUND: #007abf; BORDER-LEFT: #666 1px solid; COLOR: #FFFFFF; BORDER-BOTTOM: #666 1px solid
}
.newspage SPAN.current {
 PADDING-RIGHT: 8px;  PADDING-LEFT: 8px; BACKGROUND: #007abf; PADDING-BOTTOM: 3px;  COLOR: #fff; MARGIN-RIGHT: 5px; PADDING-TOP: 3px;  font-size:13px;border-radius: 0px; border:1px #007abf solid; 

}
.newspage SPAN.disabled {
BORDER-RIGHT: #fff 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #fff 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #fff 1px solid; COLOR: #666; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #fff 1px solid
}


.ywzti { font-family: arial; }