[hidden]{display:none!important}
:root{--page:#f7f7f5;--surface:#fff;--muted:#eff1f1;--text:#15191d;--sub:#596168;--line:#dde1e3;--button:#343c43;--button-hover:#20262b;--water:#a9dde8;--success:#2e7d5b;--font:Inter,Manrope,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--page);color:var(--text);font:16px/1.55 var(--font)}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button,input,select{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}.wrap{width:min(100% - 48px,1320px);margin:auto}:focus-visible{outline:3px solid #167b9a;outline-offset:3px}
.button{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:8px;padding:10px 17px;border:1px solid var(--button);border-radius:7px;font-weight:650;font-size:14px;line-height:1.2;text-align:center;white-space:normal}.button:hover{text-decoration:none}.button-primary{background:var(--button);color:#fff}.button-primary:hover{background:var(--button-hover)}.button-outline{background:transparent;color:var(--button)}.button-outline:hover{background:var(--muted)}.button:disabled{opacity:.45;cursor:not-allowed}
.catalog-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}.header-row{display:flex;align-items:center;gap:24px;min-height:72px}.catalog-logo{font-size:24px;font-weight:800;white-space:nowrap}.site-nav{display:flex;align-items:center;gap:22px;margin-left:auto}.site-nav a,.quote-nav{font-size:14px;font-weight:600;white-space:nowrap}.quote-nav{color:var(--sub)}.menu-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:6px;min-width:44px;min-height:44px}.catalog-hero{background:#e8eef0;border-bottom:1px solid var(--line)}.hero-content{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:48px;min-height:590px;padding-top:40px;padding-bottom:40px}.hero-content h1{font-size:56px;line-height:1.1;letter-spacing:0;margin:10px 0 24px;max-width:620px}.hero-content p:not(.overline){font-size:18px;max-width:540px;color:#38434a}.overline{font-size:13px;font-weight:750;text-transform:uppercase;color:#35546a}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.hero-photo{height:470px;background:#dfe6e9;display:grid;place-items:center;overflow:hidden}.hero-photo img{width:100%;height:100%;object-fit:contain;padding:18px}.image-placeholder{display:none;color:var(--sub);font-size:13px}.image-missing{display:grid;place-items:center;background:var(--muted)}.image-missing .image-placeholder{display:block}
/* WhatsApp 悬浮咨询按钮（沿用旧版样式，仅后台配置号码时才显示） */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:80;width:56px;height:56px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 10px 24px rgba(18,140,70,.45);transition:.2s ease}
.wa-float:hover{transform:scale(1.08);box-shadow:0 12px 28px rgba(18,140,70,.55)}
.wa-float svg{display:block}
@media (max-width:640px){.wa-float{width:50px;height:50px;right:12px;bottom:12px}}
.section{padding-top:78px;padding-bottom:78px}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:24px}.section-heading h2,.section h2{font-size:32px;line-height:1.2;margin:0 0 22px}.section-heading h2{margin:0}.section-heading a,.manufacturing-band a,.section>a:not(.button){color:#285c71;font-weight:650}.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.category-item,.catalog-card{border:1px solid var(--line);border-radius:7px;background:#fff;overflow:hidden}.category-item:hover,.catalog-card:hover{border-color:#9eb8c0;text-decoration:none}.category-photo{height:170px;background:var(--muted);display:grid;place-items:center}.category-photo img{width:100%;height:100%;object-fit:contain}.category-item>div:last-child{display:flex;flex-direction:column;gap:3px;padding:14px}.category-item strong{font-size:17px;line-height:1.3}.category-item span{font-size:13px;color:var(--sub)}.featured-band,.manufacturing-band{background:#fff;border-block:1px solid var(--line)}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.catalog-card{display:flex;flex-direction:column}.catalog-card-media{aspect-ratio:1/1;display:grid;place-items:center;background:var(--muted)}.catalog-card-media img{width:100%;height:100%;object-fit:contain}.catalog-card-body{padding:16px;display:flex;flex:1;flex-direction:column;gap:12px}.card-subline{font-size:13px;color:var(--sub);line-height:1.3}.card-subline a:hover{text-decoration:underline}.catalog-card h3{font-size:18px;line-height:1.35;margin:0;overflow-wrap:anywhere}.card-data{display:flex;justify-content:space-between;flex-wrap:wrap;gap:5px;font-size:13px;color:var(--sub);margin-top:auto}.card-actions{border-top:1px solid var(--line);padding-top:12px;display:flex;flex-wrap:wrap;gap:6px}.card-actions .button{flex:1 1 105px;padding:9px}.compare-action{border:1px solid var(--line);border-radius:6px;background:#fff;width:44px;height:44px;font-size:23px;flex:none}.compare-action[aria-pressed=true]{background:var(--button);color:#fff}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-bottom:26px}.service-grid>div{border-top:2px solid var(--water);padding-top:18px}.service-grid h3,.service-grid h2{font-size:19px;margin:0 0 8px}.service-grid p,.manufacturing-band p{color:var(--sub);margin:0 0 16px}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;padding:0;list-style:none;counter-reset:step}.steps li{border-top:1px solid var(--line);padding-top:15px;font-weight:600}.steps li:before{counter-increment:step;content:counter(step,decimal-leading-zero);display:block;color:#3c7b90;margin-bottom:8px}
.breadcrumbs{padding:23px 0 12px;font-size:13px;color:var(--sub)}.breadcrumbs a{text-decoration:underline}.listing-page,.product-page{padding-bottom:90px}.listing-intro h1,.simple-page h1,.product-info h1{font-size:42px;line-height:1.18;margin:12px 0}.listing-intro p,.simple-page>p{color:var(--sub)}.catalog-toolbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:end;gap:12px;border-block:1px solid var(--line);padding:24px 0;margin:22px 0}.catalog-toolbar label,.list-tools label,.quote-row label{font-size:13px;font-weight:650;color:var(--sub);display:flex;flex-direction:column;gap:5px}.catalog-toolbar input,.catalog-toolbar select,.list-tools select,.quote-row input{height:44px;min-width:0;width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--text)}.toolbar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.list-tools{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:24px 0}.list-tools>div{display:flex;align-items:end;gap:8px;flex-wrap:wrap}.list-tools label{min-width:96px}.empty-results{padding:40px 0;color:var(--sub)}.pagination{display:flex;gap:7px;justify-content:center;margin-top:38px;flex-wrap:wrap}.pagination a{min-width:44px;min-height:44px;display:grid;place-items:center;padding:0 12px;border:1px solid var(--line);border-radius:6px;background:#fff}.pagination a[aria-current]{background:var(--button);color:#fff}
.product-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:50px;margin-top:25px}.product-gallery{min-width:0}.product-main-image{aspect-ratio:1/1;background:var(--muted);display:grid;place-items:center}.product-main-image img{width:100%;height:100%;object-fit:contain}.product-gallery figure{max-width:280px;margin:20px 0;background:var(--muted)}.product-gallery figure img{width:100%}.product-gallery figcaption{padding:6px;font-size:12px;color:var(--sub)}.product-info{min-width:0}.product-info h1{overflow-wrap:anywhere}.muted{color:var(--sub)}.product-info h2{font-size:19px;margin:30px 0 10px}.spec-list{margin:0;border-top:1px solid var(--line)}.spec-list>div{display:grid;grid-template-columns:40% 60%;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.spec-list dt{color:var(--sub)}.spec-list dd{margin:0;overflow-wrap:anywhere}.detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}.simple-page{min-height:50vh;padding-bottom:90px}.simple-page .service-grid{margin:40px 0}.quote-list{margin:24px 0}.quote-row{display:grid;grid-template-columns:minmax(170px,2fr) minmax(90px,1fr) 110px minmax(140px,2fr) auto;gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.quote-row>a{font-weight:700}.quote-row>span{font-size:13px;color:var(--sub)}
.contact-strip{background:#e8eef0;padding:55px 0}.contact-strip h2{font-size:30px;margin:0 0 6px}.contact-strip p{margin:0 0 18px;color:var(--sub)}.catalog-footer{background:#20262b;color:#e7eced;padding:48px 0 20px}.footer-columns{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:28px}.footer-columns>div{display:flex;align-items:flex-start;flex-direction:column;gap:8px}.footer-columns strong{margin-bottom:8px}.footer-columns a,.footer-columns p{font-size:14px;color:#c4d0d1;margin:0;overflow-wrap:anywhere}.footer-bottom{margin-top:38px;padding-top:18px;border-top:1px solid #445057;font-size:13px;color:#c4d0d1}.compare-dialog{position:fixed;inset:0;background:#15191dcc;z-index:100;display:grid;place-items:center;padding:16px}.compare-panel{position:relative;background:#fff;padding:28px;width:min(100%,850px);max-height:90vh;overflow:auto;border-radius:7px}.compare-panel>button{position:absolute;right:16px;top:10px;border:0;background:none;font-size:30px;min-width:44px;min-height:44px}.compare-scroll{overflow-x:auto}.compare-scroll table{min-width:500px;width:100%;border-collapse:collapse}.compare-scroll th,.compare-scroll td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}.dialog-open{overflow:hidden}.status-toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--button);color:#fff;z-index:120;padding:12px 18px;border-radius:6px;max-width:min(500px,calc(100vw - 32px));text-align:center}
@media(max-width:1100px){.header-row{gap:15px}.site-nav{gap:10px}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-content h1{font-size:43px}.quote-row{grid-template-columns:1fr 1fr 90px}.quote-row label:nth-of-type(2){grid-column:1/3}}
@media(max-width:800px){.header-row{min-height:64px;flex-wrap:wrap;padding:10px 0}.menu-toggle{display:block;margin-left:auto}.site-nav{display:none;order:5;width:100%;margin:0;flex-direction:column;align-items:stretch;gap:0}.site-nav.open{display:flex}.site-nav a{padding:12px 0;border-top:1px solid var(--line)}.header-cta{display:none}.quote-nav{margin-left:0}.hero-content{grid-template-columns:1fr;gap:22px;min-height:auto}.hero-photo{height:270px}.category-grid,.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.product-layout{grid-template-columns:1fr;gap:25px}.footer-columns{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.wrap{width:calc(100% - 32px)}.catalog-logo{font-size:20px}.header-row{gap:12px}.quote-nav{order:3;width:100%}.menu-toggle{order:2}.site-nav{order:4}.hero-content h1{font-size:36px}.hero-content p:not(.overline){font-size:16px}.hero-photo{height:220px}.section{padding-top:54px;padding-bottom:54px}.section-heading h2,.section h2{font-size:26px}.section-heading{align-items:start;flex-direction:column}.category-grid{gap:10px}.category-photo{height:110px}.category-item strong{font-size:14px}.product-grid,.service-grid,.catalog-toolbar,.footer-columns{grid-template-columns:1fr}.list-tools{align-items:start;flex-direction:column}.catalog-card-media{aspect-ratio:4/3}.card-actions .button{flex-basis:100px}.listing-intro h1,.simple-page h1,.product-info h1{font-size:32px}.quote-row{grid-template-columns:1fr 1fr}.quote-row>a{grid-column:1/-1}.quote-row label:nth-of-type(2){grid-column:1/-1}.quote-row button{grid-column:1/-1}.contact-strip h2{font-size:24px}}
/* Release fix: balanced product photography, readable controls and complete form layout. */
.skip-link{position:fixed;top:-80px;left:16px;z-index:200;background:#fff;padding:12px 18px;border:1px solid var(--line)}
.skip-link:focus{top:12px}
.catalog-hero{background:linear-gradient(115deg,#f6f5f1 0%,#f6f5f1 46%,#e9f0f1 100%)}
.hero-content{min-height:620px;gap:70px;padding-block:62px}
.hero-content h1{font-size:clamp(40px,4.2vw,64px);line-height:1.04;letter-spacing:-2px;max-width:600px}
.hero-content .overline{letter-spacing:2px;font-size:11px}
.hero-showcase{min-width:0;position:relative;padding:24px;background:rgba(255,255,255,.65);border:1px solid #fff;border-radius:20px;box-shadow:0 20px 60px #334c5510}
.hero-photo{height:390px;border-radius:12px;background:#fff}
.hero-photo img{padding:26px;object-fit:contain}
.hero-product-caption{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 4px 0}
.hero-product-caption small{display:block;font-size:10px;letter-spacing:1.8px;color:var(--sub);margin-bottom:6px}
.hero-product-caption strong{font-size:16px}
.hero-product-caption>span:last-child{display:grid;place-items:center;width:40px;height:40px;background:#fff;border:1px solid var(--line);border-radius:50%;flex-shrink:0}
.category-photo{height:145px;background:#f4f5f3;overflow:hidden}
.category-photo img{max-height:145px;padding:12px}
.category-item{border-radius:12px}
.product-grid{gap:24px}
.catalog-card{border-radius:12px;box-shadow:0 3px 14px #192a3104}
.catalog-card-media{background:#f4f5f3;overflow:hidden;min-height:0}
.catalog-card-media img{padding:18px;transition:transform .2s}
.catalog-card-media:hover img{transform:scale(1.025)}
.catalog-card-body{padding:20px;gap:14px}
.card-subline{min-height:34px;font-size:11px;letter-spacing:.2px}
.card-badges{display:flex;flex-wrap:wrap;gap:5px}
.card-badges span{display:inline-block;font-size:10px;line-height:1.4;padding:4px 7px;border-radius:4px;color:#42606a;background:#eef4f4}
.card-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.card-actions .button{min-width:0;font-size:12px;padding:10px 5px}
.card-actions .compare-action{grid-column:1/-1;width:auto;height:auto;min-height:32px;font-size:12px;line-height:1.3;color:var(--sub);border:0;background:transparent;padding:6px}
.card-actions .compare-action[aria-pressed=true]{background:#e7eff1;color:var(--text)}
.service-grid>div{padding:26px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--water);border-radius:10px}
.catalog-footer{background:#f0f1ee;color:var(--text);border-top:1px solid var(--line)}
.footer-columns a,.footer-columns p,.footer-bottom{color:var(--sub)}
.footer-bottom{border-color:var(--line)}
.spec-list>div{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
.inquiry-form{max-width:900px;margin:32px 0;background:#fff;border:1px solid var(--line);border-radius:12px;padding:28px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.inquiry-form label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:600;margin-bottom:18px}
.inquiry-form input,.inquiry-form textarea{font:inherit;width:100%;min-width:0;border:1px solid #cbd2d5;border-radius:6px;background:#fff;color:var(--text);padding:12px}
.inquiry-form textarea{resize:vertical}
.honeypot{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.currency-note{font-size:13px;color:var(--sub)}
.filter-toggle{display:none}
@media(min-width:801px) and (max-width:1100px){.hero-content{gap:32px}.hero-photo{height:330px}.header-row{gap:12px}.site-nav a,.quote-nav{font-size:12px}.header-cta{padding:10px}}
@media(max-width:800px){.hero-content{padding-block:38px;gap:30px;min-height:0}.hero-content h1{max-width:620px;letter-spacing:-1.3px}.hero-showcase{max-width:560px;width:100%;margin-inline:auto;padding:16px}.hero-photo{height:320px}.service-grid{grid-template-columns:1fr}.catalog-toolbar{gap:14px}.list-tools>div{width:100%}.product-info h1{font-size:34px}}
@media(max-width:520px){.hero-content h1{font-size:40px}.hero-photo{height:280px}.hero-product-caption{padding-top:14px}.hero-product-caption strong{font-size:14px}.header-row{flex-wrap:nowrap;gap:10px}.catalog-logo{font-size:22px}.quote-nav{order:1;width:auto;margin-left:auto;font-size:12px}.menu-toggle{order:2;margin-left:0;font-size:12px;min-width:50px}.site-nav{position:absolute;top:100%;left:0;right:0;background:#fff;padding:12px 16px;border-bottom:1px solid var(--line)}.product-grid{gap:18px}.catalog-card-media{aspect-ratio:1.25}.catalog-card-media img{max-height:285px}.category-photo{height:110px}.category-photo img{max-height:110px}.card-subline{min-height:0}.form-grid{grid-template-columns:1fr}.inquiry-form{padding:20px}.product-info h1{font-size:30px}.section{padding-block:48px}}
@media print{.catalog-header,.catalog-toolbar,.list-tools,.pagination,.contact-strip,.catalog-footer,.compare-dialog,.status-toast,.card-actions,.detail-actions{display:none!important}body{background:white}.product-grid{grid-template-columns:repeat(2,1fr)}.catalog-card{break-inside:avoid}}

/* ================= 修复补丁 =================
   1) 移动端"Search & filters"可折叠（原来按钮恒隐藏、点了也没样式）
   2) "List view"列表视图（原来完全无样式，点击无效果）
   3) 无图时显示占位块（原来是隐形空白）
   4) 详情页相册缩略图统一比例，避免拉伸与大片留白
   5) 本地预览提示条样式
   ==================================================== */
@media (max-width:800px){
  .filter-toggle{display:block;width:100%}
  .catalog-toolbar{display:none}
  .catalog-toolbar.filters-open{display:grid;margin-top:14px}
}
.product-grid.list-view{grid-template-columns:1fr}
.product-grid.list-view .catalog-card{flex-direction:row;align-items:stretch}
.product-grid.list-view .catalog-card-media{width:200px;flex:0 0 200px;height:200px;aspect-ratio:auto}
.product-grid.list-view .catalog-card-body{flex:1;min-width:0}
.product-grid.list-view .card-data{margin-top:0}
@media (max-width:640px){
  .product-grid.list-view .catalog-card{flex-direction:column}
  .product-grid.list-view .catalog-card-media{width:100%;flex:none;height:auto;aspect-ratio:4/3}
}
.image-placeholder.is-empty{display:grid;place-items:center;width:100%;height:100%;min-height:120px;background:var(--muted);color:var(--sub);font-size:13px}
.product-gallery figure{max-width:220px;margin:14px 0}
/* height:auto 必须写：index.php 的 img 带 width/height="560" 属性，
   若 CSS 只给 width 不给 height，HTML 的 height=560 会生效把图拉成 220x560。 */
.product-gallery figure img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;background:var(--muted)}
.product-gallery figcaption{padding:6px 0}
.local-notice{background:#fff6d6;color:#6b5200;padding:10px 16px;text-align:center;font-size:13px;border-bottom:1px solid #e8d9a8}

/* ================= 设计优化补丁（2026-10-29）=================
   1) 首屏改为多产品拼图（代工厂体量，不再只放一个单品）
   2) 分类改为纯文字导航卡（去掉抓取来的营养标签小图）
   3) 卡片操作区两个按钮整齐排列（Compare 已移除）
   4) 详情页图片默认展开，全部大图纵向排列
   ============================================================ */
.hero-showcase{width:100%}
.hero-mosaic{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mosaic-cell{position:relative;aspect-ratio:1/1;background:#fff;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;overflow:hidden;padding:12px;transition:border-color .15s ease,transform .15s ease}
.mosaic-cell:hover{border-color:#8fb0bc;transform:translateY(-3px);text-decoration:none}
.mosaic-cell img{width:100%;height:100%;object-fit:contain}
.mosaic-cell .image-placeholder.is-empty{width:100%;height:100%;min-height:0;background:transparent}
.hero-mosaic-note{margin:16px 0 0;text-align:center;font-size:13px;color:var(--sub)}
@media (max-width:520px){.hero-mosaic{gap:10px}.mosaic-cell{padding:8px;border-radius:8px}}

.category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.category-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:22px 20px;min-height:104px;background:#fff;border:1px solid var(--line);border-radius:10px;transition:border-color .15s ease,background .15s ease,transform .15s ease}
.category-card:hover{border-color:#7fa8b6;background:#f5fafb;transform:translateY(-2px);text-decoration:none}
.category-card-name{font-size:17px;font-weight:700;line-height:1.35;color:var(--text);overflow-wrap:anywhere}
.category-card-cta{flex:none;font-size:19px;color:#285c71;transition:transform .15s ease}
.category-card:hover .category-card-cta{transform:translateX(4px)}
@media (max-width:1100px){.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:800px){.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.category-grid{grid-template-columns:1fr}.category-card{min-height:0;padding:16px 14px}}

.product-gallery .gallery-shot{max-width:none;margin:0 0 18px}
/* 详情图可能是很高的信息图（4:1 甚至更高）。
   绝不能再套 1:1 方框 + object-fit:contain —— 那会把长图缩成中间一条，
   四周大片空白，看起来就是"很小没展开"。
   正确做法：宽度铺满，高度按图片自身比例自动展开。
   注意用 .product-gallery 前缀提高优先级，否则会被上面的
   .product-gallery figure img{aspect-ratio:1/1} 覆盖。 */
.gallery-shot-img{background:var(--muted);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.product-gallery .gallery-shot-img img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;display:block}
.gallery-shot figcaption{padding:8px 2px 0;font-size:12px;color:var(--sub)}

/* ===== 首屏工厂实景「融合」处理（2026-10-29）=====
   不用白卡片/边框/阴影——那会像贴上去的一块。
   改为：工厂实景从右侧满幅铺到边缘，用遮罩(mask)向左渐隐，
   再叠一层同色系渐变，让照片自然溶进首屏底色。
   移动端改为底部横向色带，向上渐隐，文字始终压在纯色区保证可读。
   ==================================================== */
.catalog-hero{position:relative;overflow:hidden;background:#e8eef0;border-bottom:1px solid var(--line)}
.hero-media{position:absolute;top:0;right:0;bottom:0;left:30%;z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.10) 22%,rgba(0,0,0,.45) 52%,rgba(0,0,0,.82) 100%);
          mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.10) 22%,rgba(0,0,0,.45) 52%,rgba(0,0,0,.82) 100%)}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 42%;display:block;filter:saturate(.9) contrast(.95) brightness(1.03)}
/* 整幅照片都蒙一层页面同色薄纱（不只是左边缘），才能真正"融"进底色 */
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,#e8eef0 0%,rgba(232,238,240,.62) 38%,rgba(232,238,240,.40) 72%,rgba(232,238,240,.32) 100%)}
.hero-content{position:relative;z-index:1}
/* 首屏底部与下方版块之间再补一层过渡，消除那道轻微色阶 */
.catalog-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:130px;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(247,247,245,0) 0%,#f7f7f5 100%)}
@media (max-width:800px){
  .hero-media{left:0;top:auto;height:250px;bottom:0;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 32%);
            mask-image:linear-gradient(180deg,transparent 0%,#000 32%)}
  .hero-media::after{background:linear-gradient(180deg,#e8eef0 0%,rgba(232,238,240,0) 48%)}
  .hero-content{padding-bottom:290px}
}
@media (max-width:520px){
  .hero-media{height:200px}
  .hero-content{padding-bottom:236px}
}