/* =========================================================
   忠华企业联盟 · 设计系统（轻奢 · 中国红 + 鎏金）
   方向：温暖米白底 + 中国红主色 + 鎏金描边，统一卡片/标题/按钮/广告。
   仅由 main.php 引入，可后续在其它页面 <link> 复用。
   ========================================================= */
:root{
  --zh-red:#B9000E;
  --zh-red-deep:#8A0009;
  --zh-gold:#C9A227;
  --zh-gold-light:#E7C766;
  --zh-bg:#F6F4F1;
  --zh-surface:#FFFFFF;
  --zh-text:#2B2622;
  --zh-muted:#8A8178;
  --zh-border:rgba(201,162,39,.38);
  --zh-radius-sm:8px;
  --zh-radius-md:12px;
  --zh-radius-lg:18px;
  --zh-shadow-1:0 2px 10px rgba(120,30,30,.08);
  --zh-shadow-2:0 10px 26px rgba(120,30,30,.14);
  --zh-ease:cubic-bezier(.16,1,.3,1);
}

/* 背景氛围：右上鎏金光晕 + 左上中国红光晕 */
body{
  background:
    radial-gradient(42rem 32rem at 100% -12%, rgba(201,162,39,.10), transparent 60%),
    radial-gradient(38rem 30rem at -12% 0%, rgba(185,0,14,.07), transparent 55%),
    var(--zh-bg);
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Heiti SC",sans-serif;
  color:var(--zh-text);
}
a:link,a:visited{color:var(--zh-red);text-decoration:none;}
a:hover{color:var(--zh-red-deep);}

/* 区标题：鎏金分隔线 + 中国红粗体（替代原 -------- name --------） */
.zh-sec{
  position:relative; display:inline-block;
  color:var(--zh-red); font-size:16px; font-weight:800;
  letter-spacing:.06em; padding:0 16px; white-space:nowrap;
}
.zh-sec::before,.zh-sec::after{
  content:""; position:absolute; top:50%; width:38px; height:2px;
}
.zh-sec::before{ right:100%; background:linear-gradient(90deg,transparent,var(--zh-gold)); }
.zh-sec::after{ left:100%; background:linear-gradient(90deg,var(--zh-gold),transparent); }

/* 商品/商家卡片统一化（命中现有 bgcolor="#F7F7F7" 的卡片表格） */
table[bgcolor="#F7F7F7"]{
  background:var(--zh-surface) !important;
  border:1px solid var(--zh-border) !important;
  border-radius:var(--zh-radius-md) !important;
  box-shadow:var(--zh-shadow-1);
  overflow:hidden;
  transition:transform .22s var(--zh-ease), box-shadow .22s var(--zh-ease);
}
table[bgcolor="#F7F7F7"]:hover{
  transform:translateY(-3px);
  box-shadow:var(--zh-shadow-2);
}
.table11{ border:1px solid var(--zh-border) !important; border-radius:var(--zh-radius-md); overflow:hidden; }

/* 广告条：高度随图片比例自适应（3.9:1），避免 object-fit:cover 裁掉两侧内容 */
.zh-ad{
  height:auto; width:90%; max-width:720px; display:block; margin:0 auto;
  border-radius:var(--zh-radius-md);
  box-shadow:var(--zh-shadow-1);
  border:1px solid var(--zh-border);
  background:#fff;
}

/* 首页导航按钮：统一尺寸（图标圆形固定 + 名称固定行高） */
.zh-navbtn{ width:25%; vertical-align:top; }
.zh-navico{
  width:54px; height:54px; border-radius:50%; object-fit:cover; display:block;
  margin:0 auto 4px; background:#fff; border:2px solid var(--zh-border);
  box-shadow:var(--zh-shadow-1); transition:transform .2s var(--zh-ease);
}
.zh-navbtn:hover .zh-navico{ transform:translateY(-2px) scale(1.04); }
.zh-navlabel{ display:block; text-align:center; height:16px; line-height:16px; overflow:hidden; color:var(--zh-text); font-size:12px; }

/* 分类图（8:1）：放在该分类商品的上面 */
.zh-cadimg{
  display:block; width:100%; height:auto; aspect-ratio:8/1; object-fit:cover;
  border-radius:var(--zh-radius-md);
  border:1px solid var(--zh-border);
  box-shadow:var(--zh-shadow-1);
  margin:2px 0 8px;
}

/* 底部留白：避免页面最底部内容被固定底部导航(bottomNav, 55px)遮挡 */
.zh-bottomspace{ height:72px; }

/* 轻量入场动画 */
@keyframes zh-fade-up{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;} }
.zh-fade-up{ animation:zh-fade-up .5s var(--zh-ease) both; }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}
