/* =========================================================
   ZHANZHENG Homepage Refined Final
   仅控制本次首页新增模块。
   Header / Footer / 公共 CTA 不在这里改。
   产品分类区继续由现有 home-final.css 控制，确保视觉不变。
   ========================================================= */

.zzhome-page{
  --zz-green:#0b4b39;
  --zz-deep:#073c2d;
  --zz-gold:#c48a42;
  --zz-cream:#f8f1e8;
  --zz-cream-2:#fbf7f1;
  --zz-line:#e8dbcb;
  --zz-text:#20352e;
  --zz-muted:#61706a;
  background:#fff;
  color:var(--zz-text);
}
.zzhome-page *{box-sizing:border-box}
.zzhome-shell{width:92vw;max-width:2600px;margin:0 auto}
.zzhome-section{padding:72px 0}
.zzhome-section-head{margin:0 auto 38px;max-width:920px}
.zzhome-center{text-align:center}
.zzhome-eyebrow,.zzhome-kicker,.zzhome-card-kicker{display:block;color:#a66d2f;font-size:11px;font-weight:800;letter-spacing:1.7px;text-transform:uppercase}
.zzhome-section-head h2,.zzhome-business-copy h2,.zzhome-oem-card h3,.zzhome-logistics-card h3,.zzhome-hero h1{font-family:Georgia,'Times New Roman',serif;color:var(--zz-deep);font-weight:500}
.zzhome-section-head h2{font-size:clamp(34px,2.25vw,46px);margin:8px 0 12px;line-height:1.08}
.zzhome-section-head p{margin:0 auto;color:var(--zz-muted);font-size:15px;line-height:1.7;max-width:780px}
.zzhome-head-compact{margin-bottom:28px}

/* HERO + BUTTONS V9.1 — clean single-source rules
   只控制首页 Hero；不修改公共 Header 的 HTML/链接/结构。 */
.zzhome-actions{display:flex;gap:13px;align-items:center;flex-wrap:wrap}
.zzhome-btn{min-height:49px;padding:0 23px;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:800;transition:.2s ease;text-decoration:none}
.zzhome-btn:hover{transform:translateY(-1px)}
.zzhome-btn-dark{background:var(--zz-green);color:#fff;border:1px solid var(--zz-green)}
.zzhome-btn-light{background:#fffaf4;color:var(--zz-green);border:1px solid #cbbba8}
.zzhome-btn-small{min-height:40px;padding:0 16px;font-size:12px}
.zzhome-kicker{color:var(--zz-green);margin-bottom:18px;font-size:12px;letter-spacing:1.6px}

/* Desktop: Header 第一帧就覆盖 Hero，避免 JS 加类前出现白条跳动。 */
@media (min-width:901px){
  .zzhome-nav-overlay .site-header,
  .zzhome-nav-overlay .site-header.zz-home-floating-header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:1200 !important;
    margin:0 !important;
    transform:translate3d(0,0,0);
    transition:transform .30s cubic-bezier(.22,.61,.36,1),background-color .28s ease,box-shadow .28s ease,border-color .28s ease;
    background:rgba(255,255,255,.74) !important;
    border-bottom:1px solid rgba(11,75,57,.08) !important;
    box-shadow:none !important;
    -webkit-backdrop-filter:blur(9px) saturate(116%);
    backdrop-filter:blur(9px) saturate(116%);
    will-change:transform;
  }
  .zzhome-nav-overlay .site-header.zz-home-header-scrolled{
    background:rgba(255,255,255,.96) !important;
    border-bottom-color:rgba(11,75,57,.12) !important;
    box-shadow:0 7px 28px rgba(19,54,43,.09) !important;
    -webkit-backdrop-filter:blur(14px) saturate(125%);
    backdrop-filter:blur(14px) saturate(125%);
  }
  .zzhome-nav-overlay .site-header.zz-home-header-hidden{
    transform:translate3d(0,calc(-100% - 4px),0);
  }

  .zzhome-hero{
    position:relative;
    height:clamp(620px,42vw,820px);
    min-height:620px;
    overflow:hidden;
    background:#f5ecdf;
    border-bottom:0;
  }
  .zzhome-hero-bg{
    position:absolute;
    inset:0;
    z-index:0;
    width:100%;
    height:100%;
    max-width:none;
    display:block;
    object-fit:cover;
    object-position:50% 43%;
    transform:none;
    background:#f5ecdf;
    pointer-events:none;
  }
  .zzhome-hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:linear-gradient(90deg,rgba(248,241,232,.97) 0%,rgba(248,241,232,.94) 19%,rgba(248,241,232,.80) 31%,rgba(248,241,232,.43) 43%,rgba(248,241,232,.12) 53%,rgba(248,241,232,0) 64%);
  }
  .zzhome-hero-inner{
    position:absolute;
    inset:0;
    z-index:2;
    display:flex;
    align-items:center;
    padding-top:72px;
    pointer-events:none;
  }
  .zzhome-hero-copy{
    width:43%;
    max-width:820px;
    padding:34px 0 38px;
    pointer-events:auto;
  }
  .zzhome-hero h1{
    max-width:800px;
    margin:0 0 24px;
    font-size:clamp(58px,3.9vw,80px);
    line-height:1.015;
    letter-spacing:-1.65px;
  }
  .zzhome-hero p{
    max-width:660px;
    margin:0 0 30px;
    color:#3d4f48;
    font-size:17px;
    line-height:1.68;
  }
}

@media (min-width:1800px){
  .zzhome-shell{width:93vw}
  .zzhome-section{padding:80px 0}
  .zzhome-oem-card{min-height:350px}
  .zzhome-logistics-card{min-height:360px}
  .zzhome-hero{height:min(43vw,820px)}
  .zzhome-hero-bg{object-position:50% 42%}
  .zzhome-hero-copy{width:42%}
}

@media (min-width:901px) and (max-width:1280px){
  .zzhome-hero{height:620px;min-height:620px}
  .zzhome-hero-bg{object-position:52% 43%}
  .zzhome-hero-copy{width:46%}
  .zzhome-hero h1{font-size:54px}
  .zzhome-hero p{font-size:15.5px;max-width:570px}
}

/* Tablet: 保留普通公共导航，不启用滚动隐藏；Hero 保持横向场景。 */
@media (min-width:761px) and (max-width:900px){
  .zzhome-hero{position:relative;height:560px;overflow:hidden;background:#f5ecdf;border-bottom:1px solid var(--zz-line)}
  .zzhome-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:54% 44%;display:block}
  .zzhome-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(248,241,232,.96) 0%,rgba(248,241,232,.86) 35%,rgba(248,241,232,.18) 65%,rgba(248,241,232,0) 78%);pointer-events:none}
  .zzhome-hero-inner{position:absolute;inset:0;z-index:2;display:flex;align-items:center}
  .zzhome-hero-copy{width:50%;padding:26px 0}
  .zzhome-hero h1{font-size:48px;line-height:1.02;letter-spacing:-1.2px;margin:0 0 20px}
  .zzhome-hero p{font-size:14.5px;line-height:1.65;margin:0 0 24px;max-width:520px;color:#3d4f48}
}

/* Mobile: 完整图片在上，文案在下，避免硬裁与菜单冲突。 */
@media (max-width:760px){
  .zzhome-hero{height:auto;overflow:visible;background:#faf5ee;border-bottom:1px solid var(--zz-line)}
  .zzhome-hero::before{display:none}
  .zzhome-hero-bg{position:relative;inset:auto;width:100%;height:auto;object-fit:contain;object-position:center top;transform:none;display:block}
  .zzhome-hero-inner{position:relative;inset:auto;width:100%;display:block;padding:0}
  .zzhome-hero-copy{width:100%;padding:30px 24px;background:#faf5ee}
  .zzhome-hero h1{font-size:44px;line-height:1.03;letter-spacing:-1.1px;margin:0 0 18px}
  .zzhome-hero p{font-size:14.5px;line-height:1.65;margin:0 0 24px;color:#3d4f48}
}

@media (max-width:600px){
  .zzhome-shell{width:calc(100% - 28px)}
  .zzhome-hero-copy{padding:28px 22px}
  .zzhome-hero h1{font-size:39px;letter-spacing:-1px}
  .zzhome-hero p{font-size:14px}
  .zzhome-actions{align-items:stretch;flex-direction:column}
}

@media (prefers-reduced-motion:reduce){
  .zzhome-nav-overlay .site-header{transition:none !important}
}

/* CAPABILITY STRIP */
.zzhome-capabilities{background:#fbf6ee;border-bottom:1px solid var(--zz-line)}
.zzhome-cap-grid{display:grid;grid-template-columns:repeat(4,1fr);min-height:104px;align-items:center}
.zzhome-cap-grid article{min-height:52px;padding:0 28px;display:flex;align-items:center;justify-content:center;gap:17px;border-right:1px solid var(--zz-line)}
.zzhome-cap-grid article:last-child{border-right:0}
.zzhome-cap-icon{width:42px;height:42px;border:1px solid #ddb986;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#a96e2f;font-size:22px;flex:0 0 auto}
.zzhome-cap-grid b,.zzhome-cap-grid small{display:block}
.zzhome-cap-grid b{font-size:15px;color:#163a30;margin-bottom:5px}
.zzhome-cap-grid small{font-size:12px;color:#6b736f;line-height:1.4}

/* CORE OEM */
.zzhome-oem{padding-top:62px;background:#fff}
.zzhome-oem-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.zzhome-oem-card{border:1px solid var(--zz-line);border-radius:9px;overflow:hidden;background:linear-gradient(110deg,#fbf7f0,#f8efe5);display:grid;grid-template-columns:54% 46%;min-height:330px;box-shadow:0 6px 26px rgba(24,60,47,.035)}
.zzhome-oem-copy{padding:35px 22px 32px 36px;align-self:center}
.zzhome-card-kicker{margin-bottom:8px}
.zzhome-oem-card h3{font-size:30px;line-height:1.08;margin:0 0 17px}
.zzhome-oem-card ul{list-style:none;padding:0;margin:0 0 24px}
.zzhome-oem-card li{position:relative;padding:0 0 9px 22px;font-size:12.5px;line-height:1.48;color:#42534d}
.zzhome-oem-card li:before{content:'✓';position:absolute;left:0;top:0;color:var(--zz-green);font-weight:900}
.zzhome-oem-card figure{margin:0;overflow:hidden;min-height:0}
.zzhome-oem-card figure img{width:100%;height:100%;object-fit:cover;display:block}

/* WHY */
.zzhome-why{background:var(--zz-cream-2);border-top:1px solid #f0e6da;border-bottom:1px solid #f0e6da;padding-top:62px;padding-bottom:62px}
.zzhome-why-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--zz-line);border-radius:8px;background:#fff;overflow:hidden}
.zzhome-why-grid article{display:flex;gap:16px;padding:27px 26px;border-right:1px solid var(--zz-line);min-height:145px}
.zzhome-why-grid article:last-child{border-right:0}
.zzhome-why-grid>article>span{width:44px;height:44px;border-radius:50%;background:#faf3e9;border:1px solid #ead5b8;display:flex;align-items:center;justify-content:center;color:#a66d2f;font-size:21px;flex:0 0 auto}
.zzhome-why h3{font-size:15px;margin:2px 0 8px;color:#15392f}
.zzhome-why p{font-size:12px;line-height:1.62;color:#66736e;margin:0}

/* LOGISTICS */
.zzhome-logistics{background:#fff}
.zzhome-logistics-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.zzhome-logistics-card{border:1px solid var(--zz-line);border-radius:8px;overflow:hidden;background:#fff;display:grid;grid-template-columns:48% 52%;min-height:340px}
.zzhome-logistics-card figure{margin:0;overflow:hidden;background:#f1eee8}
.zzhome-logistics-card figure img{width:100%;height:100%;display:block}
.zzhome-logistics-warehouse figure img{object-fit:cover;object-position:center 45%}
.zzhome-logistics-shipment figure img{object-fit:cover;object-position:center}
.zzhome-logistics-card>div{padding:33px 34px;align-self:center}
.zzhome-logistics-card h3{font-size:27px;line-height:1.1;margin:0 0 12px}
.zzhome-logistics-card p{font-size:13px;line-height:1.65;color:#62706b;margin:0 0 16px}
.zzhome-logistics-card a{font-size:12px;color:var(--zz-green);font-weight:800;text-decoration:none}

/* REAL BUSINESS VIEW */
.zzhome-business{background:#f8f2e9;border-top:1px solid var(--zz-line)}
.zzhome-business-grid{display:grid;grid-template-columns:52% 48%;min-height:500px;align-items:stretch}
.zzhome-business-media{margin:0;overflow:hidden}
.zzhome-business-media img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.zzhome-business-copy{padding:58px 60px;align-self:center}
.zzhome-business-copy h2{font-size:clamp(36px,2.4vw,50px);line-height:1.05;margin:9px 0 17px}
.zzhome-business-copy>p{font-size:14.5px;line-height:1.75;color:#586962;max-width:760px;margin:0 0 23px}
.zzhome-business-points{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin-bottom:27px}
.zzhome-business-points span{position:relative;padding:0 0 0 20px;font-size:13px;font-weight:700;color:#2d4b41}
.zzhome-business-points span:before{content:'✓';position:absolute;left:0;color:#b47a35}
.zzhome-business-actions{margin-top:4px}


/* Responsive — non-Hero modules only */
@media(max-width:1180px){
  .zzhome-shell{width:94vw}
  .zzhome-cap-grid article{padding:0 16px}
  .zzhome-oem-card{grid-template-columns:56% 44%}
  .zzhome-logistics-card{grid-template-columns:1fr;min-height:0}
  .zzhome-logistics-card figure{height:320px}
}
@media(max-width:900px){
  .zzhome-section{padding:54px 0}
  .zzhome-cap-grid{grid-template-columns:1fr 1fr;padding:10px 0}
  .zzhome-cap-grid article{justify-content:flex-start;padding:18px 20px;border-bottom:1px solid var(--zz-line)}
  .zzhome-oem-grid,.zzhome-logistics-grid{grid-template-columns:1fr}
  .zzhome-why-grid{grid-template-columns:1fr 1fr}
  .zzhome-why-grid article:nth-child(2){border-right:0}
  .zzhome-why-grid article:nth-child(-n+2){border-bottom:1px solid var(--zz-line)}
  .zzhome-business-grid{grid-template-columns:1fr}
  .zzhome-business-media{height:430px}
  .zzhome-business-copy{padding:44px 34px}
}
@media(max-width:600px){
  .zzhome-cap-grid{grid-template-columns:1fr}
  .zzhome-cap-grid article{border-right:0}
  .zzhome-oem-card{grid-template-columns:1fr}
  .zzhome-oem-card figure{height:230px;order:-1}
  .zzhome-oem-copy{padding:27px 24px 29px}
  .zzhome-why-grid{grid-template-columns:1fr}
  .zzhome-why-grid article{border-right:0;border-bottom:1px solid var(--zz-line)!important}
  .zzhome-why-grid article:last-child{border-bottom:0!important}
  .zzhome-logistics-card figure{height:260px}
  .zzhome-logistics-card>div{padding:27px 24px}
  .zzhome-business-media{height:300px}
  .zzhome-business-copy{padding:36px 24px}
  .zzhome-business-points{grid-template-columns:1fr}
}
