/* ============================================================ 荣誉资质 ryzz.html 复用 about.css 的公共组件（Hero / 区块头 / 按钮 / 证书卡 / CTA），本文件只补荣誉资质页专有部分：两组证书栅格高度、知识产权数据条、返回入口。页面，需同时引入 about.css + ryzz.css。注：本站 html 根字号为 calc(100vw/19.2)，1920 下 1rem = 100px。 ============================================================ */ .ryzz-page { background: #f6f8f8; } /* ---------- 资质认证 ---------- */ .ryzz-page .ryzz-cert { background: #fff; padding: .8rem 0; } /* 证书多为竖版，卡片图区比关于我们页的节选更高 */ .ryzz-page .ryzz-cert .about-cert-img { height: 3rem; } /* ---------- 获奖荣誉 ---------- */ .ryzz-page .ryzz-award { background: #f6f8f8; padding: .8rem 0; } .ryzz-page .ryzz-award .about-cert-img { height: 3.4rem; } .ryzz-page .ryzz-award .about-cert { background: #fff; } /* 获奖证书附一行年份说明 */ .ryzz-page .about-cert small { color: #9A9591; display: block; font-size: 12px; font-weight: 600; letter-spacing: .04em; margin-top: .06rem; } /* ---------- 知识产权与合规 ---------- */ .ryzz-page .ryzz-stats { background: #fff; padding: .8rem 0; } .ryzz-page .ryzz-stats-grid { display: grid; gap: .24rem; grid-template-columns: repeat(4, minmax(0, 1fr)); } .ryzz-page .ryzz-stat { background: #f6f8f8; border: 1px solid #f0f2f3; border-radius: .12rem; box-sizing: border-box; padding: .34rem .3rem; text-align: center; transition: border-color .3s, box-shadow .3s, transform .3s; } .ryzz-page .ryzz-stat:hover { border-color: rgba(231,50,22,.18); box-shadow: 0 16px 34px rgba(35,24,21,.1); transform: translateY(-4px); } .ryzz-page .ryzz-stat strong { color: var(--brand-primary, #E73216); display: block; font-size: clamp(28px, 2.6vw, 42px); font-weight: 800; line-height: 1; } .ryzz-page .ryzz-stat strong span { font-size: .6em; } .ryzz-page .ryzz-stat small { color: #9A9591; display: block; font-size: 13px; letter-spacing: .04em; margin-top: .1rem; } .ryzz-page .ryzz-stats-note { color: #9A9591; font-size: 13px; line-height: 1.7; margin: .3rem 0 0; text-align: center; } /* ---------- 返回关于我们 ---------- */ .ryzz-page .ryzz-back { background: #fff; padding: 0 0 .8rem; text-align: center; } .ryzz-page .ryzz-back-link { align-items: center; border: 1px solid rgba(35,24,21,.16); border-radius: 999px; color: #625F5D; display: inline-flex; font-size: 15px; gap: .12rem; line-height: 1; padding: .16rem .34rem; text-decoration: none; transition: border-color .3s, color .3s, background-color .3s, transform .3s; } .ryzz-page .ryzz-back-link:hover { background: #f6f8f8; border-color: rgba(231,50,22,.4); color: var(--brand-primary, #E73216); transform: translateY(-2px); } .ryzz-page .ryzz-back-link span { font-size: 17px; transition: transform .3s; } .ryzz-page .ryzz-back-link:hover span { transform: translateX(-3px); } .ryzz-page .ryzz-cta { background: #fff; padding: 0 0 .8rem; } /* ---------- 响应式 ---------- */ @media (max-width: 1199px) { .ryzz-page .ryzz-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 991px) { .ryzz-page .ryzz-cert .about-cert-img { height: 2.6rem; } .ryzz-page .ryzz-award .about-cert-img { height: 3rem; } } @media (max-width: 767px) { .ryzz-page .ryzz-cert, .ryzz-page .ryzz-award, .ryzz-page .ryzz-stats { padding: .62rem 0; } .ryzz-page .ryzz-cert .about-cert-img { height: 3rem; } .ryzz-page .ryzz-award .about-cert-img { height: 3.2rem; } .ryzz-page .ryzz-stats-grid { grid-template-columns: 1fr; } .ryzz-page .ryzz-back { padding: 0 0 .62rem; } }