/* =====================================================================
   style-abef.css · PC 视觉 A+B+C+D+E+F 改造（独立 CSS 覆盖，不重构 DOM）
   router-master 派单 2026-08-30
   在 pc.html 原有 <style> 之后引入（/static/style-abef.css），做叠加覆盖。
   布局/网格/导航/活动/橱窗结构一律不改；顽固内联 style 用少量 !important。
   ===================================================================== */

/* ---------- :root 变量（颜色/圆角/间距体系） ---------- */
:root{
  /* 颜色（与页面已有变量同源，保证统一） */
  --c-red:#9F1414;        /* 主品牌红 */
  --c-red-hover:#7f1010;  /* hover 深红 */
  --c-bg:#F9EBD0;         /* 页面米黄底 */
  --c-border:#D8B898;     /* 浅红描边 */
  --radius:12px;          /* 统一圆角 */

  /* 间距体系 --gap-xx（替代硬编码 7/11/13px 等） */
  --gap-2xs:5px;   /* 细/徽标内边距 */
  --gap-xs:7px;    /* 原 7px 小间距 */
  --gap-sm:10px;
  --gap-md:13px;   /* 原 13px 常规 */
  --gap-lg:16px;
  --gap-xl:20px;   /* 卡片/网格常规间距 */
  --gap-2xl:34px;  /* banner 大幅内边距 */
}

/* ================= A. Banner·红金提亮 + 金色「查看产品」按钮 ================= */
/* 覆盖 banner 内联背景：红金渐变 */
.banner.banner-tech{
  /* [router-master 2026-08-31] banner 容器背景全部去除（透明），仅保留内容布局 */
  background-color:transparent !important;
  background-image:none !important;
  border-radius:var(--radius) !important;
  padding:var(--gap-xl) var(--gap-2xl) !important;
  border:none !important;
  box-shadow:none !important;
}
/* 装饰层已全部去除（纯深红背景） */
.banner-tech::before{opacity:0;}
.banner-tech::after{opacity:0;}


/* ================= B. 商品卡 · 红色圆角「查看详情」按钮 ================= */
/* 橱窗卡底部「查看详情 ›」（scroll-go）已为红圆角，统一强化 */
.scroll-go{
  background:var(--c-red);color:#fff;font-size:12.5px;font-weight:bold;
  border-radius:var(--radius)!important;padding:var(--gap-xs) 14px;
}
.scroll-go:hover{background:var(--c-red-hover);}
/* 商品网格卡「查看详情 ›」（btn-view）红圆角按钮 */
.btn-view{
  background:var(--c-red);color:#fff;font-size:12px;font-weight:bold;
  border-radius:var(--radius)!important;padding:var(--gap-xs) 12px;
}
.btn-view:hover{background:var(--c-red-hover);}
/* [2026-09-14 派单c] 「查看详情」按钮手机端加大点击区域(桌面保持原样) */
@media (max-width:820px){
  .scroll-go{padding:10px 16px;}
  .btn-view{padding:10px 16px;}
}

/* ================= C. 价格更醒目：供货价更大更红加粗、建议零售价弱化 ================= */
/* 橱窗卡底部价格行 */
.scroll-shelf-price{display:inline-flex;flex-direction:column;align-items:flex-start;gap:3px;line-height:1.2;}
.scroll-shelf-price .v{color:var(--c-red);font-weight:800;font-size:17px;}         /* 供货价 · 更大更红加粗 */
.scroll-shelf-price .m{color:#a8adb3;font-weight:normal;font-size:11px;}            /* 建议零售价 · 更小更灰 */
/* 商品网格卡价格行 */
.prod-card .price{color:var(--c-red);font-weight:800;font-size:18px;}              /* 供货价 · 更醒目 */
.prod-card .market{color:#b6bcc2;font-size:11.5px;text-decoration:line-through;}   /* 建议零售价 · 弱化 */

/* ================= D. 橱窗标题「品牌商品展区」（已在 DOM 文本中替换） ================= */
/* 标题红/米黄/圆角统一（E），无额外辅助大字 */

/* ================= E. 配色统一：主红/米黄/圆角 12px ================= */
body{background:var(--c-bg);}
.wrap{background:var(--c-bg);}
.section-title{color:var(--c-red);}
.section-title i{color:var(--c-red);}
.card,.stat,.entry,.modal{
  background:#fff;border:1px solid var(--c-border);border-radius:var(--radius);
}
/* 商品卡统一米白底 + 12px 圆角 + 红描边 hover */
.scroll-block,.prod-card,.shelf-card{
  background:#fff;border:1px solid var(--c-border);border-radius:var(--radius);
}
.scroll-block:hover{border-color:var(--c-red);}

/* ================= F. 间距标准化：硬编码 → var(--gap-xx)，统一内边距消空白 ================= */
/* 卡片内边距统一 */
.scroll-body{padding:var(--gap-lg) var(--gap-xl) var(--gap-xl);}
.scroll-row{margin-top:var(--gap-md);padding-top:var(--gap-sm);}
.prod-card .body{padding:var(--gap-md) 14px;}
.banner-shake{padding-right:var(--gap-2xl);}
.banner-brand-name.banner-mainline .bt-line2{margin-top:var(--gap-lg);}
.banner-subline{margin-top:var(--gap-xl);}
.shelf-grid{gap:var(--gap-xl);margin-top:var(--gap-sm);}
.prod-grid .card-row{gap:var(--gap-xl);}
.stat-grid,.grid.gap16,.grid{gap:var(--gap-xl);}
