/* 阶段 1 占位样式，阶段 4 按设计稿重写 */
:root { --brand: #224499; --text: #222; --muted: #666; --bg: #fff; }
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.6 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; color: var(--text); background: var(--bg); }
.site-header, main, .site-footer { max-width: 1100px; margin: 0 auto; padding: 12px 16px; }
.site-header { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; }
.site-header nav { display: flex; flex-wrap: wrap; gap: 16px; }
.logo { font-weight: 700; color: var(--brand); text-decoration: none; font-size: 20px; }
a { color: var(--brand); }
.site-footer { color: var(--muted); font-size: 14px; border-top: 1px solid #eee; }
/* Functional layout only; final visual design remains subject to the D2 review. */
img { max-width: 100%; height: auto; }
.product-grid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.product-grid a { display: flex; flex-direction: column; align-items: flex-start; overflow-wrap: anywhere; }
.product-grid img { object-fit: contain; }
.series-filter { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; padding: 16px 0; }
.series-filter label { display: flex; flex-direction: column; }
input, select, button { max-width: 100%; min-height: 40px; font: inherit; }
.rich { overflow-wrap: anywhere; overflow-x: auto; }
.rich table { max-width: 100%; }
.rich iframe { max-width: 100%; }
nav[aria-label="分页"] { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0; }
[aria-current="page"] { font-weight: bold; }
.cta, .prev-next { display: flex; flex-wrap: wrap; gap: 16px; margin: 16px 0; }
@media (min-width: 640px) { .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .product { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; } }
@media (min-width: 1024px) { .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.business-form {display:grid;gap:1rem;max-width:30rem}
.business-form label {display:grid;gap:.3rem}
.business-form input {padding:.65rem;font:inherit}
.business-form textarea {padding:.65rem;font:inherit}
.business-form label:has(input[type=checkbox]) {display:flex;align-items:start;gap:.5rem}
.business-form input[type=checkbox] {width:1.1rem;height:1.1rem;margin-top:.2rem;padding:0;flex:0 0 auto}
.shipment-info {display:grid;grid-template-columns:6rem 1fr;gap:.5rem;max-width:36rem;padding:1rem;background:#f4f5f7}
.shipment-info dd {margin:0;overflow-wrap:anywhere}
.package-photo {max-width:100%;height:auto}