@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap'); /* 参考 shopb2bfly.fecshop.cn（Fecify B2B 演示站）的视觉体系： 白底 + 深蓝灰墨色 + 橙色强调 + 深色 footer；大图 hero 居中排版。 */ /* 内容容器：与竞品 shopb2bfly 一致，固定 1400px 居中（1920 视口下内容区正好 1400px、 4 列卡片各 335px —— 竞品实测值）。这里用 % 而不是 vw：padding/margin 的百分比按 「包含块宽度」解析，天然排除滚动条，能精确得到 1400 而不是 1385。视口 ≤1400 时 退化为 24px 安全边距，移动端也正好是合适的边距。 */ :root{--ink:#1c2733;--muted:#6f7a85;--paper:#ffffff;--accent:#f26b1d;--accent-dark:#d95c14;--line:#e7e8ea;--footer-bg:#1e2b38;--serif:Georgia,'Times New Roman',serif;--gutter:max(24px,calc((100% - 1400px)/2))} *{box-sizing:border-box} body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif} a{color:inherit;text-decoration:none} .site-header{height:72px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:60} .brand{font-weight:800;letter-spacing:-.03em;font-size:21px;display:inline-flex;align-items:center;gap:9px} .brand::before{content:'';width:12px;height:12px;background:var(--accent);border-radius:3px;display:inline-block} .site-header nav{display:flex;gap:28px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;align-items:center} .site-header nav a:hover{color:var(--accent)} /* 当前页导航项：由 layout/theme.liquid 输出 aria-current="page" */ .site-header nav a[aria-current="page"]{color:var(--accent)} .hero{padding:9vw var(--gutter);min-height:560px;position:relative;background:linear-gradient(115deg,#f6f7f9 0%,#f6f7f9 60%,#e9edf2 100%)} .eyebrow{font:500 11px 'DM Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:500} .hero h1,.page-intro h1{font-size:clamp(40px,4.6vw,64px);line-height:1.04;letter-spacing:-.03em;margin:26px 0;font-weight:800} .hero h1 em,.page-intro h1 em{font-family:var(--serif);font-weight:400;letter-spacing:-.02em} .hero-copy{max-width:460px;color:var(--muted);line-height:1.75;font-size:15px} .button{display:inline-flex;align-items:center;gap:12px;padding:15px 30px;margin-top:25px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.09em;cursor:pointer;border:0;border-radius:4px;transition:background .2s,color .2s} .button span{font-size:16px;line-height:0} .button-dark{background:var(--ink);color:#fff} .button-dark:hover{background:#0e1620} .button-light{background:#fff;color:var(--ink)} .button-accent{background:var(--accent);color:#fff} .button-accent:hover{background:var(--accent-dark)} /* 描边按钮：详情页「Ask for samples」用；.button 自带 margin-top:25px，在 flex 行里必须归零 */ .button-light-outline{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)} .button-light-outline:hover{background:var(--ink);color:#fff} /* 大图 hero（严格对标参考站：通栏背景图 + 深色遮罩 + 居中白色标题，高度 800px） */ .hero-banner{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:800px;padding:90px var(--gutter);background-size:cover;background-position:center;position:relative;color:#fff} .hero-banner::after{content:'';position:absolute;inset:0;background:rgba(16,24,34,var(--hero-overlay,.55))} .hero-banner>*{position:relative;z-index:1} .hero-banner .eyebrow{color:#ffb98a} .hero-banner h1{color:#fff;text-transform:uppercase;letter-spacing:.01em;font-size:clamp(28px,3vw,46px);margin:22px 0 14px;max-width:900px} .hero-banner h1 em{font-style:normal} .hero-banner .hero-copy{color:#e5e9ee;max-width:640px;margin:0 auto} .hero-stat{position:absolute;right:var(--gutter);bottom:6vw;display:flex;align-items:center;gap:14px} .hero-banner .hero-stat{position:relative;right:auto;bottom:auto;margin-top:38px} .hero-stat strong{font-size:52px;letter-spacing:-.04em} .hero-stat span{font:11px 'DM Mono',monospace;text-transform:uppercase;line-height:1.5;color:var(--muted)} .hero-banner .hero-stat span{color:#c8d0d9} .section{padding:72px var(--gutter)} .section-products{background:#fff} .section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:38px} .section-heading h2,.cta-section h2{font-size:clamp(28px,2.6vw,38px);line-height:1.06;letter-spacing:-.03em;margin:18px 0 0;font-weight:800} .text-link{font:12px 'DM Mono',monospace;text-transform:uppercase;border-bottom:1px solid;padding-bottom:7px} .text-link span{font-size:16px} /* 商品网格：桌面 4 列起步。 之前固定 2 列 → 1920 视口下单卡宽 785px、图片 581px 高，用户反馈「图片搞这么大」「布局太分散」。 密排小卡才是 B2B 目录该有的密度（对标 shopb2bfly 首页）。 */ .product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 20px} @media(max-width:1500px){.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:1100px){.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:640px){.product-grid{grid-template-columns:1fr;gap:30px}} /* 空结果提示在网格里必须跨满整行，否则会被当成一个单元格挤在左上角 */ .product-grid .empty-state{grid-column:1/-1} .product-grid-large{padding:0 var(--gutter) 72px} .product-card{display:block} /* 卡片图统一 1:1 方图：与详情页主图、竞品目录一致，避免同一批商品忽高忽低 */ .card-image{aspect-ratio:1;background-size:cover;background-position:center;position:relative;background-color:#eceef1;transition:transform .35s} .product-card:hover .card-image{transform:translateY(-5px)} .card-arrow{position:absolute;right:15px;top:15px;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:18px;opacity:0;transition:opacity .2s} .product-card:hover .card-arrow{opacity:1} /* 无图占位：以前这里复用 .card-arrow，但箭头改成就绪才显示后会变成「什么都看不见」 */ .card-noimg{position:absolute;inset:0;display:grid;place-items:center;color:#98a1ab;font:11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em} /* 卡片文案：严格对标参考站商品卡（方图 → 标题两行）。 参考站图下只有标题 + 价格；我们是 B2B 不放价格，因此图下只保留标题。 原先这里还有一行 10px 等宽大写的 `SKU-xxx / INQUIRY ONLY` 和一段 12.5px 灰色摘要， 用户反馈「下面为什么还有小字，排版很难看」，已整体移除（见 templates/*.liquid）。 */ .product-card h3{font-size:16px;line-height:1.5;letter-spacing:-.01em;margin:10px 0 0;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} /* 特性图片网格（参考站 2×4 服务/能力卡片） */ .section-features{background:#fff} .feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 22px} .feature-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))} .feature-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))} .feature-card{display:block} /* 特性图用更扁的比例：8 张卡按 4 列排 2 行，1.4 的方图会让整段过高（曾达 1075px） */ .feature-card .feature-image{aspect-ratio:1.7;background-size:cover;background-position:center;background-color:#eceef1;margin-bottom:13px;transition:transform .3s} .feature-card:hover .feature-image{transform:translateY(-4px)} .feature-card h3{font-size:15px;font-weight:700;margin:0 0 6px;letter-spacing:-.01em} .feature-card p{color:var(--muted);font-size:12px;line-height:1.65;margin:0} .section-collections{background:#f4f6f8} .collection-list{margin-top:40px;border-top:1px solid var(--line)} .collection-row{display:grid;grid-template-columns:70px 1fr 200px 40px;align-items:center;gap:20px;padding:26px 0;border-bottom:1px solid var(--line)} .collection-row:hover{background:#eceff2} .collection-index{font:11px 'DM Mono',monospace;color:var(--muted)} .collection-name{font-size:25px;letter-spacing:-.02em;font-weight:700} .collection-count{font:11px 'DM Mono',monospace;text-transform:uppercase;color:var(--muted)} .collection-arrow{font-size:20px;text-align:right;color:var(--accent)} .cta-section{background:var(--ink);color:#fff;display:flex;justify-content:space-between;gap:60px} .cta-section.cta-accent{background:linear-gradient(100deg,var(--accent) 0%,var(--accent-dark) 100%)} .cta-section.cta-accent .eyebrow{color:#ffd9bd} .cta-section .eyebrow{color:#9aa7b4} .cta-copy{max-width:340px;color:#b7c1cb;line-height:1.7;font-size:14px} .cta-section.cta-accent .cta-copy{color:#ffe3cf} /* 深色多列 footer（参考站样式） */ footer{background:var(--footer-bg);color:#b9c3cd;padding:64px var(--gutter) 0;font-size:13px} .footer-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:48px} .footer-brand strong{color:#fff;font-size:19px;letter-spacing:-.02em} .footer-brand p{color:#8fa0af;margin:10px 0 0;line-height:1.7} .footer-col h4{color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:.12em;margin:4px 0 18px} .footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px} .footer-col a:hover{color:#fff} .footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:20px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:12px;color:#8fa0af} .footer-bottom a{color:#8fa0af} .footer-bottom a:hover{color:#fff} footer p{color:#8fa0af;margin:8px 0 0} .footer-links{display:flex;gap:24px;align-items:center;font:11px 'DM Mono',monospace;text-transform:uppercase} /* 去掉 max-width:1000px：边距已由 --gutter 统一给到 1400 容器， 再叠加 1000 上限会把正文列压到 ~500px（标题被迫折成窄柱）。 */ .page-intro{padding:64px var(--gutter) 40px} /* 列表页标题不该跟首页 hero 一样大（hero 是 64px 的视觉锤，内页 64px 只会显得空） */ .page-intro h1{font-size:clamp(30px,3vw,44px);margin:18px 0} .page-intro p{max-width:460px;line-height:1.7;color:var(--muted)} .catalog-toolbar{margin:0 var(--gutter) 55px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;display:flex;justify-content:space-between;align-items:center;font:11px 'DM Mono',monospace;text-transform:uppercase} .catalog-toolbar form{display:flex;gap:8px} .catalog-toolbar input{border:0;border-bottom:1px solid var(--ink);background:transparent;padding:6px 3px;font:12px Manrope;outline:0} .catalog-toolbar button{border:0;background:transparent;font:11px 'DM Mono';text-transform:uppercase;cursor:pointer} .empty-state{padding:60px 0;color:var(--muted);font-size:14px} /* ===== 商品详情：对标 shopb2bfly 的紧凑双栏 ===== 旧值两栏间距按 8% 视口宽算（1920 下 153px），加上 h1 58px、上下留白 45/110px， 整体非常松散（用户反馈「布局太分散」）。 现改为左右各半、间距 56px，并补齐面包屑 / 卖点 / 保障条 / 分页签，提高信息密度。 */ .product-detail{padding:26px var(--gutter) 72px} .breadcrumb{display:flex;gap:9px;align-items:center;font:11px 'DM Mono',monospace;text-transform:uppercase;color:#98a1ab;margin-bottom:22px;flex-wrap:wrap} .breadcrumb a:hover{color:var(--ink)} .breadcrumb .sep{color:#c9d1d9} .back-link{font:11px 'DM Mono',monospace;text-transform:uppercase;color:var(--muted)} .detail-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;margin-top:0;align-items:start} .detail-image{aspect-ratio:1;background-size:cover;background-position:center;background-color:#eceef1} .detail-copy{padding:0;min-width:0} /* 商品多图图库：主图固定 1:1，缩略图切换 */ /* 不要给图库加 position:sticky：主图 1:1 + 缩略图常常高于视口，sticky 会把缩略图裁在屏外 */ .detail-gallery{display:flex;flex-direction:column;gap:12px;min-width:0} .gallery-main{aspect-ratio:1;background:#eceef1;overflow:hidden;border-radius:4px;border:1px solid var(--line)} .gallery-main img{width:100%;height:100%;object-fit:cover;display:block} .gallery-placeholder{display:grid;place-items:center;color:#98a1ab;font:11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em} .gallery-thumbs{display:flex;gap:9px;flex-wrap:wrap} .gallery-thumb{width:74px;height:74px;padding:0;border:2px solid transparent;border-radius:6px;overflow:hidden;cursor:pointer;background:#eceef1;transition:border-color .2s} .gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block} .gallery-thumb.is-active{border-color:var(--accent)} /* 商品卡片图统一用 img + object-fit，保证尺寸一致、无图有占位 */ .card-image{overflow:hidden} .card-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block} .detail-copy h1{font-size:clamp(24px,2.3vw,33px);line-height:1.16;letter-spacing:-.02em;margin:0 0 14px;font-weight:800} .lead{font-size:15px;line-height:1.7;color:var(--muted);margin:0 0 20px} /* 卖点要点（对标竞品价格下方的 bullet 列表） */ .spec-bullets{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:9px} .spec-bullets li{position:relative;padding-left:20px;font-size:13.5px;line-height:1.55;color:#3d4854} .spec-bullets li::before{content:'';position:absolute;left:2px;top:7px;width:6px;height:6px;background:var(--accent);border-radius:50%} /* 询盘操作区 */ .detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 20px} .detail-actions .button{flex:1 1 190px;justify-content:center;text-align:center;margin-top:0} /* 保障条：对标竞品 Free Shipping / Warranty / Support 三格 */ .guarantee{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:0 0 22px} .guarantee div{background:#fff;padding:13px 10px;text-align:center} .guarantee strong{display:block;font-size:12.5px;font-weight:700;letter-spacing:-.01em} .guarantee span{display:block;font:10px 'DM Mono',monospace;text-transform:uppercase;color:#98a1ab;margin-top:5px} .rule{border-top:1px solid var(--line);margin:24px 0} /* 详情页的键值表（SPU / MOQ / Pricing）压紧行高，跟紧凑双栏保持一致 */ .fact-list{margin:0 0 20px} .fact-list div{padding:10px 0} /* 详情页分页签：描述 / 规格 / 物流 */ .detail-tabs{margin-top:52px;border-top:1px solid var(--line)} .tab-nav{display:flex;gap:30px;flex-wrap:wrap;border-bottom:1px solid var(--line)} .tab-nav button{background:none;border:0;padding:15px 0;font:12px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.08em;color:#98a1ab;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px} .tab-nav button.is-active{color:var(--ink);border-bottom-color:var(--accent)} .tab-panel{display:none;padding:30px 0 6px;max-width:940px} .tab-panel.is-active{display:block} /* 规格表：双列，避免长列表把页面拉得很长 */ .spec-table{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 44px;border-top:1px solid var(--line)} .spec-table div{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line);padding:11px 0;font-size:13px} .spec-table dt{color:var(--muted)} .spec-table dd{text-align:right} @media(max-width:900px){.spec-table{grid-template-columns:1fr}} @media(max-width:640px){.guarantee{grid-template-columns:1fr}.detail-actions .button{flex:1 1 100%}} .body-html{line-height:1.8;color:#4c5763} /* 富文本内嵌媒体必须限宽：编辑器上传的原图动辄两三千像素，不限宽会按原始尺寸 铺开，直接撑破详情/文章栏（用户报「这图片这么大」的根因）。历史数据里已存在 这类大图，只靠上传时压缩救不了旧内容，所以必须在展示层兜住。 */ .body-html img,.body-html video,.body-html iframe{max-width:100%;height:auto;display:block;margin:18px 0;border-radius:4px} .body-html table{display:block;max-width:100%;overflow-x:auto} .detail-copy h2{font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-top:45px} dl{margin:0 0 35px;border-top:1px solid var(--line)} dl div{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:13px 0;font-size:13px;gap:20px} dt{color:var(--muted)} dd{margin:0;text-align:right} .fact-list{margin-top:0} .faq-list details{border-bottom:1px solid var(--line);padding:16px 0} .faq-list summary{cursor:pointer;font-size:14px;font-weight:600} .faq-list p{color:var(--muted);font-size:13px;line-height:1.7} .related-section{background:#fff} .article-list{padding:0 var(--gutter) 110px} .article-row{display:grid;grid-template-columns:120px 1.2fr 1.6fr 30px;gap:26px;align-items:baseline;padding:30px 0;border-bottom:1px solid var(--line)} .article-row:hover{background:#f4f6f8} .article-date{font:11px 'DM Mono',monospace;color:var(--muted)} .article-title{font-size:22px;letter-spacing:-.02em;font-weight:700} .article-summary{color:var(--muted);font-size:13px;line-height:1.6} .article-arrow{text-align:right;color:var(--accent)} .article-detail{padding:45px 22vw 110px} .article-header h1{font-size:clamp(36px,4vw,56px);line-height:1.02;letter-spacing:-.03em;margin:22px 0;font-weight:800} .page-body{padding:0 22vw 110px} .inquiry-wrap{display:grid;grid-template-columns:1.4fr .8fr;gap:56px;padding:0 var(--gutter) 90px;align-items:start} .inquiry-form{display:grid;grid-template-columns:1fr 1fr;gap:26px 30px} .field{display:flex;flex-direction:column;gap:9px} .field-full{grid-column:1 / -1} .field label{font:11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)} .field input,.field textarea{border:0;border-bottom:1px solid var(--line);background:transparent;padding:11px 2px;font:14px Manrope;color:var(--ink);outline:0;resize:vertical} .field input:focus,.field textarea:focus{border-bottom-color:var(--accent)} .form-footer{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:10px} .form-note{color:var(--muted);font-size:12px;line-height:1.6;max-width:330px;margin:0} .form-status{grid-column:1 / -1;font-size:13px;line-height:1.6;margin:0;min-height:20px} .form-status.is-ok{color:#2f7d4f} .form-status.is-error{color:#c0392b} .inquiry-aside{background:#f7f9fb;padding:38px 34px;border:1px solid var(--line)} .aside-strong{font-size:22px;letter-spacing:-.02em;margin:14px 0 0;font-weight:700} .inquiry-aside dl{margin-top:26px;margin-bottom:0} .inquiry-aside dd a{border-bottom:1px solid var(--line)} @media(max-width:900px){.detail-grid,.inquiry-wrap{grid-template-columns:1fr;gap:45px}.article-detail,.page-body{padding-left:6%;padding-right:6%}.collection-row{grid-template-columns:50px 1fr 30px;row-gap:8px}.collection-count{display:none}.article-row{grid-template-columns:1fr 30px;row-gap:8px}.article-date,.article-summary{grid-column:1/-1}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-cols{grid-template-columns:1fr 1fr}} @media(max-width:700px){.site-header{padding:0 6vw;height:auto;padding-top:16px;padding-bottom:16px;display:block;position:static}.site-header nav{gap:14px;font-size:10px;margin-top:14px;flex-wrap:wrap}.hero{padding:16vw var(--gutter);min-height:0}.hero-stat{left:var(--gutter);bottom:auto;right:auto;margin-top:35px}.section{padding:70px var(--gutter)}.section-heading{display:block}.section-heading h2,.cta-section h2{font-size:36px}.section-heading .text-link{display:inline-block;margin-top:25px}.product-grid{grid-template-columns:1fr;gap:45px}.product-grid-large{padding:0 var(--gutter) 80px}.cta-section{display:block}.cta-copy{margin-top:35px}.page-intro{padding:70px var(--gutter) 45px}.page-intro h1{font-size:48px}.catalog-toolbar{margin:0 var(--gutter) 45px;display:block}.catalog-toolbar form{margin-top:15px}.product-detail{padding:30px var(--gutter) 80px}.inquiry-form{grid-template-columns:1fr}.form-footer{display:block}footer{display:block;padding-top:48px}.footer-cols{grid-template-columns:1fr;gap:30px}.footer-bottom{flex-direction:column}.footer-links{margin-top:20px;flex-wrap:wrap;gap:14px}.feature-grid{grid-template-columns:1fr}} .announcement{display:flex;align-items:center;justify-content:center;gap:18px;padding:11px var(--gutter);font:500 11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em;position:relative;background:var(--ink);color:#dfe5ea} .announcement a{border-bottom:1px solid;padding-bottom:2px} .announcement-close{background:transparent;border:0;font-size:17px;line-height:1;cursor:pointer;color:inherit;position:absolute;right:var(--gutter)} .collection-heading,.faq-heading,.rich-heading{font-size:clamp(32px,3.4vw,46px);line-height:1.02;letter-spacing:-.03em;margin:20px 0 0;font-weight:800} .section-rich .rich-head{margin-bottom:55px} .section-rich .rich-head h2{margin-bottom:0} .rich-grid{display:grid;gap:45px 32px} .rich-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))} .rich-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))} .rich-item h3{font-size:21px;letter-spacing:-.02em;margin:0 0 12px;font-weight:700} .rich-item p{color:var(--muted);font-size:14px;line-height:1.75;margin:0} .rich-item-wide{grid-column:1/-1;max-width:640px} .rich-image{aspect-ratio:1.6;background-size:cover;background-position:center;background-color:#eceef1;margin-bottom:22px} .rich-foot{margin-top:55px} .section-faq .faq-list{margin-top:45px;border-top:1px solid var(--line)} .banner{display:flex;align-items:center;padding:90px var(--gutter);background-size:cover;background-position:center;background-color:#2a3644;position:relative} .banner::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,24,34,.72) 0%,rgba(16,24,34,.28) 70%,rgba(16,24,34,.1) 100%)} .banner-inner{position:relative;z-index:1;max-width:560px;color:#fff} .banner-inner h2{font-size:clamp(34px,4vw,54px);line-height:1.02;letter-spacing:-.03em;margin:20px 0 18px;font-weight:800} .banner-inner p{color:#d9dee4;line-height:1.7;font-size:15px;margin:0} .banner-inner .eyebrow{color:#ffb98a} .banner-align-center{margin:0 auto;text-align:center} @media(max-width:900px){.rich-cols-2,.rich-cols-3{grid-template-columns:1fr}} /* 语言切换器（前台界面多语言）。顶部在 header 右侧、底部在页脚，位置由后台设置控制。 用原生