/* ══════════════════════════════════════
   page-quality.css — Quality & Certifications 页专属组件（只在 /quality/ 加载）
   设计稿：preview-quality-v4.html（2×2 Bento + 视觉精修版）
   这里只放这一页独有的组件；通用组件（.eyebrow/.section-title/.btn-primary/
   .photo-slot/.p-badge/.inner/.band-* 等）都在 main.css / hero.css 里，不重复定义。

   ⚠️ 设计稿里那段 @media (max-device-width:768px) 的\"真机字号加大\"已经在移植时删掉：
   那是预览页把 viewport 锁成 width=1280 才需要的 hack。主题 header.php 用的是标准
   width=device-width，真机上 max-width 与 max-device-width 会同时命中，
   会导致手机端标题（46px）比桌面（44px）还大。响应式全部走 max-width 断点。
══════════════════════════════════════ */

/* ── 段落引导文字（居中副标题） ── */
.section-lead { text-align:center; max-width:660px; margin:14px auto 0; color:var(--ink-soft); font-size:14.5px; line-height:1.7; }

/* ── 图片占位符 v2：比首页 .photo-slot 更精致的版本（斜纹底 + 圆形图标） ── */
.photo-slot-v2 { width:100%; box-sizing:border-box; background:linear-gradient(135deg, #F3F1EC 0%, #EAE7DF 100%); border:1px solid var(--line); border-radius:var(--r); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; position:relative; overflow:hidden; }
.photo-slot-v2::before { content:''; position:absolute; inset:0; background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.4) 0, rgba(255,255,255,.4) 1px, transparent 1px, transparent 14px); }
.photo-slot-v2 .ph-icon { position:relative; width:44px; height:44px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(20,24,31,.08); }
.photo-slot-v2 .ph-icon svg { width:20px; height:20px; color:var(--orange-deep); }
.photo-slot-v2 .ph-label { position:relative; font-size:12.5px; font-weight:700; color:var(--ink-soft); }
.photo-slot-v2 .ph-sub { position:relative; font-size:10.5px; color:var(--slate); }

/* ── 质检数据条：通栏 4 格（原来是个 460px 宽的窄盒子，两侧大片留白） ── */
.qp-stat-row { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:44px 0 0; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.qp-stat { background:var(--paper); padding:22px 20px; text-align:center; }
.qp-stat .v { font-family:var(--font-d); font-size:26px; font-weight:900; color:var(--orange-deep); line-height:1.1; display:block; margin-bottom:8px; }
.qp-stat .k { font-size:12.5px; color:var(--ink-soft); line-height:1.45; display:block; }
@media(max-width:1000px){ .qp-stat-row { grid-template-columns:repeat(3,1fr); } }
@media(max-width:640px){ .qp-stat-row { grid-template-columns:1fr; } }
@media(max-width:520px){ .qp-stat-row { grid-template-columns:1fr; } }

/* ── QC 流程 v2：2×2 Bento 卡片 ── */
.qc-bento { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:36px; }
.qc-bento-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; transition:box-shadow .2s, transform .2s; }
.qc-bento-card:hover { box-shadow:0 10px 28px rgba(20,24,31,.09); transform:translateY(-3px); }
.qc-bento-card .qcb-photo { aspect-ratio:16/9; }
.qc-bento-card .qcb-body { padding:22px 24px 26px; }
.qc-bento-card .qcb-tag { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:800; color:var(--orange-deep); text-transform:uppercase; letter-spacing:.03em; margin-bottom:10px; }
.qc-bento-card .qcb-tag .qcb-num { width:18px; height:18px; border-radius:50%; background:var(--orange-deep); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:10px; }
.qc-bento-card h4 { font-family:var(--font-d); font-size:17px; font-weight:800; margin-bottom:8px; line-height:1.3; color:var(--ink); }
.qc-bento-card p { font-size:13.5px; color:var(--ink-soft); line-height:1.65; margin-bottom:14px; }
.qcb-checkpoints { display:flex; gap:8px; flex-wrap:wrap; }
.qcb-checkpoints span { background:var(--mist-card); border:1px solid var(--line); font-size:10.5px; font-weight:600; color:var(--ink-soft); padding:4px 10px; border-radius:100px; }

/* ── AQL 标准卡片（3 列，带图标） ── */
.aql-band-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:32px; }
.aql-card-v2 { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:26px 22px; }
.aql-card-v2 .aql-icon { width:38px; height:38px; border-radius:10px; background:var(--orange-sub); display:flex; align-items:center; justify-content:center; margin-bottom:16px; }
.aql-card-v2 .aql-icon svg { width:19px; height:19px; color:var(--orange-deep); }
.aql-card-v2 .aql-num { font-family:var(--font-d); font-weight:800; font-size:28px; color:var(--ink); line-height:1; margin-bottom:8px; }
.aql-card-v2 h4 { font-family:var(--font-d); font-size:13.5px; font-weight:800; margin-bottom:8px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.02em; }
.aql-card-v2 p { font-size:12.5px; color:var(--slate); line-height:1.6; }

/* ── 认证区小标题（非居中，走左对齐） ── */
.qp-sub-title { font-family:var(--font-d); font-size:24px; font-weight:800; margin:8px 0 6px; color:var(--ink); line-height:1.25; }
.qp-sub-lead { color:var(--ink-soft); font-size:13.5px; line-height:1.7; max-width:760px; margin-bottom:6px; }

/* ── 认证清单 v4：横向卡片 + auto-fit 网格（有几张证书就铺满几列） ──
   原来 3 列固定网格 + 每卡上方 3:4 文档占位图，只有 2 张证书时右侧空一列、卡片又高又稀。
   现在：卡片内部改为"左徽标 + 右信息"的横向布局，网格用 auto-fit + minmax(440px)，
   2 张证书时正好各占一半并排铺满，3 张及以上自动排成 3 列。 */
.cert-list { display:grid; grid-template-columns:repeat(auto-fit, minmax(440px, 1fr)); gap:22px; margin-top:34px; align-items:start; }
.cert-item { display:flex; gap:20px; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:24px; transition:box-shadow .2s, transform .2s, border-color .2s; }
.cert-item:hover { box-shadow:0 12px 30px rgba(20,24,31,.09); transform:translateY(-3px); border-color:rgba(255,106,19,.3); }
.cert-item { align-items:flex-start; }
.cert-thumb { flex:0 0 156px; width:156px; min-height:196px; border-radius:var(--rs); background:linear-gradient(160deg, var(--mist-card) 0%, var(--mist) 100%); border:1px solid var(--line); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:10px 8px; text-align:center; position:relative; overflow:hidden; }
.cert-thumb::before { content:''; position:absolute; inset:0; background-image:repeating-linear-gradient(45deg, rgba(255,255,255,.45) 0, rgba(255,255,255,.45) 1px, transparent 1px, transparent 12px); }
.cert-thumb .ct-icon { position:relative; width:40px; height:40px; color:var(--orange-deep); }
.cert-thumb .ct-icon svg { width:100%; height:100%; }
.cert-thumb .ct-short { position:relative; font-family:var(--font-d); font-size:15px; font-weight:800; color:var(--ink); line-height:1.25; }
.cert-thumb .ct-note { position:relative; font-size:10px; font-weight:600; letter-spacing:.02em; color:var(--slate); line-height:1.3; }
.cert-thumb.is-pending { background:linear-gradient(160deg, #FDF6E3 0%, #FAEFD6 100%); }
.cert-thumb.is-pending .ct-icon { color:#B8860B; }
/* 有证书扫描件时：缩略图显示扫描件，短标签压在底部（点击看大图） */
.cert-thumb.has-image { padding:0; background:var(--mist-card); }
.cert-thumb.has-image::before { display:none; }
.cert-thumb.has-image .cert-shot { position:absolute; inset:0; display:block; }
.cert-thumb.has-image .cert-shot img { width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.cert-thumb.has-image .ct-short { position:absolute; left:0; right:0; bottom:0; padding:22px 12px 9px; text-align:left;
  background:linear-gradient(to top, rgba(20,24,31,.86) 0%, rgba(20,24,31,.55) 55%, rgba(20,24,31,0) 100%); color:#fff; font-size:13.5px; }
.cert-thumb.has-image { transition:box-shadow .2s, transform .2s; }
.cert-thumb.has-image:hover { box-shadow:0 10px 24px rgba(20,24,31,.18); }
.cert-thumb.has-image .cert-shot:hover img { transform:scale(1.03); }
.cert-thumb.has-image .cert-shot img { transition:transform .3s; }
.cert-body { flex:1; min-width:0; }
.cert-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.cert-head h4 { font-family:var(--font-d); font-size:16px; font-weight:800; color:var(--ink); line-height:1.35; }
.cert-meta { margin:0; display:grid; gap:8px; }
.cert-meta > div { display:grid; grid-template-columns:96px 1fr; gap:10px; font-size:12.5px; line-height:1.55; }
.cert-meta dt { color:var(--slate); font-weight:600; }
.cert-meta dd { margin:0; color:var(--ink-soft); }
.cert-meta dd.cert-no { font-family:ui-monospace, Consolas, monospace; font-weight:700; color:var(--ink); letter-spacing:.02em; }
.cert-cta { display:inline-block; margin-top:16px; font-size:12.5px; font-weight:700; color:var(--orange-deep); border-bottom:1.5px solid var(--orange); padding-bottom:2px; }
.cert-cta:hover { color:var(--orange); }
.certs-note { margin-top:20px; font-size:12.5px; color:var(--slate); background:var(--mist); border:1px dashed var(--line); padding:14px 16px; border-radius:var(--rs); line-height:1.7; }

/* ── 第三方验货 ── */
.tp-inspection { display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:start; }
.tp-inspection h2 { font-family:var(--font-d); font-size:30px; font-weight:800; margin:12px 0 16px; line-height:1.2; color:var(--ink); }
.tp-inspection p { color:var(--ink-soft); font-size:14.5px; line-height:1.7; margin-bottom:14px; }
.tp-checklist { list-style:none; margin-top:8px; }
.tp-checklist li { display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--ink-soft); margin-bottom:12px; line-height:1.6; }
.tp-checklist li svg { flex-shrink:0; width:18px; height:18px; color:#1FAA59; margin-top:1px; }
.agency-row { display:flex; gap:14px; margin-top:26px; flex-wrap:wrap; }
.agency-badge { background:var(--mist-card); border:1px solid var(--line); border-radius:var(--rs); padding:10px 18px; font-family:var(--font-d); font-weight:800; font-size:13px; color:var(--ink-soft); }
.tp-image { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r); }

/* ── 质检报告样本 ── */
.report-sample { display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; }
/* 没配报告样张图时单栏（否则左边留一个空框） */
.report-sample.no-image, .tp-inspection.no-image { grid-template-columns:minmax(0,1fr); }
.report-thumb { width:100%; max-width:330px; margin:0 auto; aspect-ratio:3/4; background:linear-gradient(135deg, #F3F1EC 0%, #EAE7DF 100%); border-radius:var(--r); border:1px solid var(--line); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; position:relative; }
.report-thumb .ph-icon svg { width:40px; height:40px; color:var(--slate); }
.report-thumb-img { width:100%; max-width:330px; margin:0 auto; aspect-ratio:3/4; object-fit:cover; border-radius:var(--r); border:1px solid var(--line); display:block; }
.report-sample h2 { font-family:var(--font-d); font-size:28px; font-weight:800; margin:12px 0 16px; line-height:1.25; color:var(--ink); }
.report-sample p { color:var(--ink-soft); font-size:14.5px; line-height:1.7; }
.report-list { list-style:none; margin-top:18px; margin-bottom:22px; }
.report-list li { display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--ink-soft); margin-bottom:12px; line-height:1.6; }
.report-list li svg { flex-shrink:0; width:16px; height:16px; color:var(--orange-deep); margin-top:2px; }
.doc-stat-strip { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:24px; padding-top:24px; border-top:1px solid var(--line); }
.doc-stat-strip .dstat .dnum { font-family:var(--font-d); font-weight:800; font-size:24px; color:var(--orange-deep); line-height:1; }
.doc-stat-strip .dstat .dlabel { font-size:12px; color:var(--ink-soft); margin-top:5px; }

/* ── 缺陷处理与保修政策 ── */
.policy-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:32px; }
.policy-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:26px 24px; }
.policy-card .policy-num { width:34px; height:34px; border-radius:50%; background:var(--orange-sub); color:var(--orange-deep); display:flex; align-items:center; justify-content:center; font-family:var(--font-d); font-weight:800; font-size:14px; margin-bottom:14px; }
.policy-card h4 { font-family:var(--font-d); font-size:15px; font-weight:800; margin-bottom:8px; color:var(--ink); }
.policy-card p { font-size:13px; color:var(--ink-soft); line-height:1.6; }
.warranty-banner { background:var(--footer-bg); border-radius:var(--r); padding:28px 32px; margin-top:28px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.warranty-banner .wb-text { color:#fff; }
.warranty-banner .wb-text strong { display:block; font-family:var(--font-d); font-size:17px; margin-bottom:4px; }
.warranty-banner .wb-text span { font-size:13px; color:var(--footer-txt); }

/* ── 快答 FAQ（卡片式 3 列） ── */
.quick-faq-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0 40px; margin-top:36px; }
.quick-faq-grid details { border-bottom:1px solid var(--line); padding-bottom:18px; margin-bottom:18px; }
.quick-faq-grid details summary { display:flex; align-items:center; justify-content:space-between; gap:12px; list-style:none; cursor:pointer; font-weight:700; font-size:14px; color:var(--ink); }
.quick-faq-grid details summary::-webkit-details-marker { display:none; }
.quick-faq-grid details summary .qf-toggle { flex-shrink:0; width:26px; height:26px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:400; color:var(--slate); }
.quick-faq-grid details summary .qf-toggle::before { content:'+'; }
.quick-faq-grid details[open] summary .qf-toggle::before { content:'−'; }
.quick-faq-grid details p { font-size:13px; color:var(--ink-soft); line-height:1.65; margin:14px 0 0; }
.view-all-questions-wrap { text-align:center; margin-top:8px; }
.btn-guide-outline { display:inline-block; border:1.5px solid var(--line); border-radius:var(--rs); padding:13px 28px; font-size:13.5px; font-weight:700; color:var(--ink); transition:border-color .2s, background .2s, color .2s; }
.btn-guide-outline:hover { border-color:var(--orange); background:var(--orange-sub); color:var(--orange-deep); }

/* ══════════════════════════════════════
   响应式（只写这一页需要的断点，全部基于 max-width）
══════════════════════════════════════ */
@media(max-width:1200px){
  /* 证书卡片交给 auto-fit 自己判断列数：容器放得下两列就保持两列，
     放不下（约 920px 以下）才自动换成单列，不在这里写死。 */
  .cert-list { grid-template-columns:repeat(auto-fit, minmax(400px, 1fr)); }
}
@media(max-width:1000px){
  .aql-band-v2 { grid-template-columns:1fr; }
  .tp-inspection, .report-sample { grid-template-columns:1fr; gap:32px; }
  .report-thumb, .report-thumb-img { max-width:420px; margin:0 auto; }
  .policy-steps { grid-template-columns:1fr; }
  .quick-faq-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px){
  .qc-bento { grid-template-columns:1fr; gap:18px; }
  .cert-list { grid-template-columns:1fr; }
  .section-lead { font-size:13.5px; }
  .qp-sub-title { font-size:20px; }
  .tp-inspection h2, .report-sample h2 { font-size:22px; }
  .warranty-banner { padding:22px 20px; }
  .warranty-banner .btn-primary { width:100%; justify-content:center; }
}
@media(max-width:520px){
  .quick-faq-grid { grid-template-columns:1fr; }
  .qp-stats-strip .stat .num { font-size:22px; }
  .aql-card-v2 { padding:20px 18px; }
  .cert-item { padding:18px; gap:14px; }
  .cert-thumb { flex-basis:auto; width:100%; min-height:0; }
  .photo-slot-v2 .ph-icon { width:36px; height:36px; }
  .policy-card { padding:20px 18px; }
}


/* ══════════════════════════════════════
   2026-09-18 新增板块样式
══════════════════════════════════════ */

/* ── 本页密度微调：内容比首页多，沿用首页 112px 的板块间距会显得又长又空 ── */
.qp-quality-page .pad-xl { padding:88px 0; }
.qp-quality-page .pad-lg { padding:60px 0; }

/* ── Hero 下方的快速事实条（4 项） ── */
.qp-strip-band { background:var(--orange-tint); border-top:1px solid rgba(255,106,19,.18); border-bottom:1px solid rgba(255,106,19,.18); }
.qp-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; padding:22px 0; }
.qp-strip-item { display:flex; flex-direction:column; gap:4px; padding-left:16px; border-left:2px solid rgba(255,106,19,.45); }
.qp-strip-k { font-family:var(--font-d); font-size:15px; font-weight:800; color:var(--ink); line-height:1.3; }
.qp-strip-v { font-size:12.5px; color:var(--ink-soft); line-height:1.5; }

/* ── 交付文件清单（左文右清单） ── */
.doc-split { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.doc-split h2 { font-family:var(--font-d); font-size:28px; font-weight:800; margin:12px 0 16px; line-height:1.25; color:var(--ink); }
.doc-split p { color:var(--ink-soft); font-size:14.5px; line-height:1.7; margin-bottom:14px; }
.doc-split .doc-note { font-size:13px; color:var(--orange-deep); font-weight:700; }
.doc-list { list-style:none; display:grid; gap:12px; padding:24px 26px; background:var(--mist); border:1px solid var(--line); border-radius:var(--r); }
.doc-list li { display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--ink-soft); line-height:1.6; }
.doc-list li svg { flex-shrink:0; width:16px; height:16px; color:#1FAA59; margin-top:2px; }

/* ── 自有检测项目（6 卡，3×2） ── */
.test-grid-v2 { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:34px; }
.test-card-v2 { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:24px 22px; transition:box-shadow .2s, transform .2s, border-color .2s; }
.test-card-v2:hover { box-shadow:0 10px 26px rgba(20,24,31,.08); transform:translateY(-3px); border-color:rgba(255,106,19,.3); }
.test-icon { width:40px; height:40px; border-radius:10px; background:var(--orange-sub); color:var(--orange-deep); display:flex; align-items:center; justify-content:center; margin-bottom:16px; }
.test-icon svg { width:20px; height:20px; }
.test-card-v2 h4 { font-family:var(--font-d); font-size:15.5px; font-weight:800; margin-bottom:8px; color:var(--ink); line-height:1.35; }
.test-card-v2 p { font-size:13px; color:var(--ink-soft); line-height:1.65; }

/* ── 各市场合规位置表 ── */
.mkt-table-wrap { margin-top:34px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); overflow-x:auto; -webkit-overflow-scrolling:touch; }
.mkt-table { width:100%; min-width:720px; border-collapse:collapse; }
.mkt-table th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--slate); font-weight:700; padding:14px 18px; border-bottom:2px solid var(--line); background:var(--mist); }
.mkt-table td { padding:16px 18px; font-size:13.5px; color:var(--ink-soft); border-bottom:1px solid var(--line); line-height:1.6; vertical-align:top; }
.mkt-table tr:last-child td { border-bottom:none; }
.mkt-table td.mkt-name { font-family:var(--font-d); font-weight:800; color:var(--ink); white-space:nowrap; }
.mkt-state { display:inline-block; font-size:11px; font-weight:700; padding:4px 10px; border-radius:100px; white-space:nowrap; }
.mkt-state.mkt-ok { background:rgba(31,170,89,.1); color:#1FAA59; }
.mkt-state.mkt-neutral { background:var(--mist-card); color:var(--ink-soft); }

/* ── 新增板块的响应式 ── */
@media(max-width:1100px){
  .qp-strip { grid-template-columns:repeat(2,1fr); gap:14px 18px; }
}
@media(max-width:1000px){
  .doc-split { grid-template-columns:1fr; gap:32px; }
  .test-grid-v2 { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px){
  .qp-quality-page .pad-xl { padding:56px 0; }
  .qp-quality-page .pad-lg { padding:44px 0; }
  .cert-item { flex-direction:column; }
  .cert-thumb { flex-basis:auto; width:100%; min-height:0; flex-direction:row; justify-content:flex-start; gap:10px; padding:12px 14px; text-align:left; }
  .cert-thumb .ct-icon { width:22px; height:22px; }
  .cert-thumb .ct-note { margin-left:auto; }
  /* 有扫描件时小屏仍保持卡片式缩略图，别被压成一条 */
  .cert-thumb.has-image { flex-direction:column; justify-content:flex-end; padding:0; min-height:240px; }
  .cert-thumb.has-image .ct-short { text-align:left; }
  .doc-split h2 { font-size:22px; }
  .mkt-table th, .mkt-table td { padding:12px 14px; }
}
@media(max-width:560px){
  .qp-strip { grid-template-columns:1fr; }
  .test-grid-v2 { grid-template-columns:1fr; }
}

/* ══════════════════════════════════════
   Hero（本页专属，2026-09-18 重写）
   之前这里直接套用了 OEM 页的 .oem-hero / .oem-hero-split 等类，但 page-oem.css
   只在 /oem/ 加载，导致 /quality/ 上这些类完全没生效：flex 分栏塌成上下堆叠、
   右侧图片占满整行、副标题还带着 .about-hero-lead 的居中样式。
   现在改为本页自己的 .qp-hero-* 类，样式与结构都在这一页里闭环。
══════════════════════════════════════ */
.qp-hero { padding:40px 0 64px; background:var(--paper); position:relative; overflow:hidden; }
.qp-hero::after { content:''; position:absolute; top:-160px; right:-180px; width:620px; height:620px; background:radial-gradient(circle, rgba(255,106,19,.09) 0%, transparent 70%); pointer-events:none; }
.qp-hero-grid { display:grid; grid-template-columns:1.02fr .98fr; gap:56px; align-items:center; position:relative; z-index:1; }
/* 没配首屏图时不显示空图框，文字栏独占整行（图片上传后自动恢复双栏） */
.qp-hero-grid.no-media { grid-template-columns:minmax(0,1fr); }
.qp-hero-grid.no-media .qp-hero-text { max-width:860px; }
.qp-hero-badges { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.qp-hero-text h1 { font-family:var(--font-d); font-size:38px; font-weight:800; line-height:1.2; letter-spacing:-.3px; color:var(--ink); margin:0 0 16px; }
.qp-hero-lead { font-size:16px; color:var(--ink-soft); line-height:1.75; margin:0 0 26px; max-width:620px; }
.qp-hero-cta { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.qp-hero-media { border-radius:var(--r); overflow:hidden; background:var(--mist); }
.qp-hero-media img { width:100%; aspect-ratio:4/3; max-height:460px; object-fit:cover; display:block; }
.qp-hero-media .photo-slot-v2 { aspect-ratio:4/3; height:auto; }
@media(max-width:1000px){
  .qp-hero { padding:28px 0 48px; }
  .qp-hero-grid { grid-template-columns:1fr; gap:28px; }
  .qp-hero-media { order:-1; }
  .qp-hero-text h1 { font-size:28px; }
  .qp-hero-lead { font-size:15px; }
}
@media(max-width:520px){
  .qp-hero-text h1 { font-size:24px; }
}

/* ── 页面收尾：指南/博客跳转带（深色窄带，两个按钮） ── */
.qp-blog-band { background:var(--footer-bg); }
.qp-blog-inner { display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; padding:38px 0; }
.qp-blog-text h2 { font-family:var(--font-d); font-size:24px; font-weight:800; color:#fff; margin:0 0 8px; line-height:1.25; }
.qp-blog-text p { font-size:14px; color:var(--footer-txt); margin:0; max-width:640px; line-height:1.7; }
.qp-blog-cta { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.qp-blog-cta .btn-secondary { background:transparent; color:#fff; border-color:rgba(255,255,255,.42); }
.qp-blog-cta .btn-secondary:hover { border-color:#fff; color:#fff; background:rgba(255,255,255,.08); }
@media(max-width:768px){
  .qp-blog-inner { padding:28px 0; }
  .qp-blog-text h2 { font-size:19px; }
  .qp-blog-cta { width:100%; }
  .qp-blog-cta a { flex:1 1 auto; justify-content:center; }
}