/* =========================================================
   ZHANZHENG About Us — REFINED FINAL / PAGE CONTENT ONLY
   仅影响 .zzabout-page，不改 Header / Footer / 全站 style.css。
========================================================= */
.zzabout-page{--za-green:#103f30;--za-green-dark:#0a3327;--za-ink:#173b2f;--za-text:#52615b;--za-muted:#7b8782;--za-cream:#f7f0e7;--za-cream2:#fbf7f1;--za-gold:#b7884d;--za-line:#e7ddd0;overflow:hidden;background:#fff;color:var(--za-ink)}
.zzabout-page *{box-sizing:border-box}
.zzabout-page figure{margin:0}
.zzabout-page img{display:block;width:100%}
.zzabout-page h1,.zzabout-page h2,.zzabout-page h3{color:var(--za-ink)}
.zzabout-eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#a57638}
.zzabout-eyebrow:before{content:"";width:24px;height:2px;background:#c8944c}
.zzabout-section{padding:80px 0}
.zzabout-section-head{margin-bottom:30px}
.zzabout-section-head h2,.zzabout-copy-block h2{font-size:42px;line-height:1.08;margin:12px 0 18px;font-weight:500}
.zzabout-section-head p,.zzabout-copy-block>p{font-size:15px;line-height:1.8;color:var(--za-text);max-width:610px;margin:0}
.zzabout-center{text-align:center}
.zzabout-center .zzabout-eyebrow{justify-content:center}
.zzabout-center .zzabout-section-head p,.zzabout-center p{margin-left:auto;margin-right:auto}

/* hero — unchanged from the approved site direction */
.zzabout-hero{background:var(--za-cream);border-bottom:1px solid var(--za-line)}
.zzabout-hero-grid{display:grid;grid-template-columns:38% 62%;min-height:500px;padding-left:0;padding-right:0}
.zzabout-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:66px 58px 66px 0}
.zzabout-hero-copy h1{font-size:61px;line-height:.98;letter-spacing:-.035em;margin:18px 0 24px;font-weight:500}
.zzabout-hero-copy p{font-size:15px;line-height:1.75;color:var(--za-text);max-width:500px;margin:0 0 28px}
.zzabout-actions{display:flex;gap:12px;flex-wrap:wrap}
.zzabout-btn{min-height:45px;display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:0 19px;border-radius:4px;font-size:12px;font-weight:700;border:1px solid transparent;transition:.2s}
.zzabout-btn-dark{background:var(--za-green);color:#fff}
.zzabout-btn-dark:hover{background:var(--za-green-dark)}
.zzabout-btn-light{background:#fff;border-color:#cdb99d;color:var(--za-ink)}
.zzabout-btn-light:hover{border-color:var(--za-gold)}
.zzabout-hero-media{min-height:500px;overflow:hidden}
.zzabout-hero-media img{height:100%;object-fit:cover;object-position:center center}

/* capability strip — unchanged */
.zzabout-cap-strip{background:#fff;border-bottom:1px solid var(--za-line)}
.zzabout-cap-grid{display:grid;grid-template-columns:repeat(4,1fr);min-height:132px;align-items:center}
.zzabout-cap-grid article{display:flex;align-items:center;justify-content:center;gap:16px;min-height:76px;border-right:1px solid #ede4d9}
.zzabout-cap-grid article:last-child{border-right:0}
.zzabout-cap-grid article>span{font-family:Georgia,'Times New Roman',serif;font-size:26px;color:#c2914f}
.zzabout-cap-grid b,.zzabout-cap-grid small{display:block}
.zzabout-cap-grid b{font-size:14px;color:var(--za-ink);margin-bottom:4px}
.zzabout-cap-grid small{font-size:12px;color:var(--za-muted)}

/* overview — use a unique real meeting-room crop, avoiding repeated office imagery */
.zzabout-overview{background:#fff;padding-top:76px;padding-bottom:76px}
.zzabout-two-col{display:grid;grid-template-columns:1.05fr .95fr;gap:66px;align-items:center}
.zzabout-photo{overflow:hidden;border-radius:5px;background:#eee}
.zzabout-office-photo{aspect-ratio:1.48/1}
.zzabout-office-photo img{height:100%;object-fit:cover;object-position:center center}
.zzabout-copy-block{padding:16px 0}
.zzabout-checks{list-style:none;margin:25px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:13px 22px}
.zzabout-checks li{position:relative;padding-left:25px;font-size:14px;color:#31463e}
.zzabout-checks li:before{content:'✓';position:absolute;left:0;top:-1px;color:#8d9f82;font-weight:800}

/* showroom — still useful, but deliberately shorter so the repeated room is not dominant */
.zzabout-showroom{background:#fbf8f3;border-top:1px solid #f0e8df;border-bottom:1px solid #f0e8df;padding-top:72px;padding-bottom:68px}
.zzabout-showroom-media{height:485px;overflow:hidden;border-radius:6px;box-shadow:0 14px 36px rgba(34,49,43,.075)}
.zzabout-showroom-media img{height:100%;object-fit:cover;object-position:center}
.zzabout-category-row{display:grid;grid-template-columns:repeat(6,1fr);margin-top:22px;border-top:1px solid #e6dbce;border-bottom:1px solid #e6dbce}
.zzabout-category-row span{text-align:center;padding:14px 8px;font-size:12px;font-weight:650;color:#3b5148;border-right:1px solid #e6dbce}
.zzabout-category-row span:last-child{border-right:0}

/* communication — retain the approved layout, but use two unique office photos */
.zzabout-communication{background:#eef3ef;padding-top:72px;padding-bottom:72px}
.zzabout-communication-grid{display:grid;grid-template-columns:31% 69%;gap:50px;align-items:center}
.zzabout-communication-copy h2{font-size:39px}
.zzabout-office-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
/* Use a near-original portrait ratio instead of a short fixed-height crop. */
.zzabout-office-grid figure{height:auto;aspect-ratio:4/5;border-radius:5px;overflow:hidden;background:#ddd}
.zzabout-office-grid img{height:100%;object-fit:cover;object-position:center center}

/* supply — wording matches the real warehouse/loading material */
.zzabout-supply{background:#fff;padding-top:76px;padding-bottom:76px}
.zzabout-supply-head{margin-bottom:20px}
.zzabout-flow{display:flex;justify-content:center;align-items:center;gap:20px;margin:0 auto 34px}
.zzabout-flow div{display:flex;align-items:center;gap:9px;min-width:145px;justify-content:center}
.zzabout-flow b{width:34px;height:34px;border:1px solid #d8c8b2;border-radius:50%;display:grid;place-items:center;color:#a5783d;font-size:10px}
.zzabout-flow span{font-size:13px;font-weight:700;color:#33483f;white-space:nowrap}
.zzabout-flow i{font-style:normal;color:#bf8b45;font-size:18px}
.zzabout-logistics-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:22px;align-items:start}
.zzabout-logistics-grid article{border:1px solid var(--za-line);background:#fff;border-radius:5px;overflow:hidden}
/* The warehouse source is portrait while the shipment source is 4:3.
   Give each card a ratio close to its source so neither photo is heavily cropped. */
.zzabout-logistics-grid article:first-child figure{height:auto;aspect-ratio:25/28;overflow:hidden;background:#eee}
.zzabout-logistics-grid article:last-child figure{height:auto;aspect-ratio:4/3;overflow:hidden;background:#eee}
.zzabout-logistics-grid img{height:100%;object-fit:cover;object-position:center center}
.zzabout-logistics-grid article>div{padding:22px 25px 24px}
.zzabout-logistics-grid article>div>span{font-size:10px;font-weight:700;letter-spacing:.14em;color:#a57638}
.zzabout-logistics-grid h3{font-family:Georgia,'Times New Roman',serif;font-weight:500;font-size:25px;margin:7px 0 8px}
.zzabout-logistics-grid p{font-size:13px;line-height:1.7;color:var(--za-text);margin:0}

/* experience — compact and brighter, without over-claiming specific photo contents */
.zzabout-experience{background:#fbf8f3;border-top:1px solid #f0e8df;padding-top:64px;padding-bottom:64px}
.zzabout-experience-grid{grid-template-columns:1.12fr .88fr;gap:58px}
.zzabout-wall-photo{aspect-ratio:1.72/1}
.zzabout-wall-photo img{height:100%;object-fit:cover;object-position:center 46%}
.zzabout-experience .zzabout-copy-block{padding:8px 0}
.zzabout-experience-list{margin-top:22px;display:grid;gap:1px;border-top:1px solid #e5d9cb}
.zzabout-experience-list div{padding:13px 0;border-bottom:1px solid #e5d9cb;display:grid;grid-template-columns:150px 1fr;gap:16px}
.zzabout-experience-list b{font-size:13px;color:#263c33}
.zzabout-experience-list span{font-size:12px;color:var(--za-muted)}

@media(max-width:1100px){
 .zzabout-hero-grid{grid-template-columns:45% 55%}.zzabout-hero-copy h1{font-size:50px}.zzabout-two-col{gap:42px}.zzabout-communication-grid{grid-template-columns:1fr;gap:28px}.zzabout-office-grid figure{height:auto;aspect-ratio:4/5}.zzabout-showroom-media{height:430px}
}
@media(max-width:900px){
 .zzabout-section{padding:62px 0}.zzabout-hero-grid{grid-template-columns:1fr}.zzabout-hero-copy{padding:52px 0 44px}.zzabout-hero-copy h1{font-size:48px}.zzabout-hero-media{min-height:360px}.zzabout-cap-grid{grid-template-columns:1fr 1fr;padding:15px 0}.zzabout-cap-grid article:nth-child(2){border-right:0}.zzabout-two-col{grid-template-columns:1fr;gap:30px}.zzabout-showroom-media{height:auto;aspect-ratio:1.8/1}.zzabout-category-row{grid-template-columns:repeat(3,1fr)}.zzabout-category-row span:nth-child(3){border-right:0}.zzabout-category-row span:nth-child(-n+3){border-bottom:1px solid #e6dbce}.zzabout-office-grid{grid-template-columns:1fr 1fr}.zzabout-logistics-grid{grid-template-columns:1fr}.zzabout-flow{flex-wrap:wrap}.zzabout-flow i{display:none}.zzabout-experience{padding-top:58px;padding-bottom:58px}
}
@media(max-width:620px){
 .zzabout-section{padding:48px 0}.zzabout-section-head h2,.zzabout-copy-block h2{font-size:33px}.zzabout-hero-copy h1{font-size:40px}.zzabout-hero-copy p,.zzabout-section-head p,.zzabout-copy-block>p{font-size:14px}.zzabout-actions{flex-direction:column;align-items:stretch}.zzabout-cap-grid{grid-template-columns:1fr}.zzabout-cap-grid article{justify-content:flex-start;padding-left:12px;border-right:0;border-bottom:1px solid #ede4d9}.zzabout-cap-grid article:last-child{border-bottom:0}.zzabout-checks{grid-template-columns:1fr}.zzabout-category-row{grid-template-columns:1fr 1fr}.zzabout-category-row span{border-bottom:1px solid #e6dbce}.zzabout-category-row span:nth-child(2n){border-right:0}.zzabout-office-grid{grid-template-columns:1fr}.zzabout-office-grid figure{height:auto;aspect-ratio:4/5;max-height:560px}.zzabout-flow{display:grid;grid-template-columns:1fr 1fr}.zzabout-flow div{justify-content:flex-start;min-width:0}.zzabout-flow span{white-space:normal}.zzabout-logistics-grid article:first-child figure{aspect-ratio:4/5}.zzabout-logistics-grid article:last-child figure{aspect-ratio:4/3}.zzabout-experience-list div{grid-template-columns:1fr;gap:4px}
}