/* ============================================================
   晝錦堂慈水五里韓氏 · 全站中式主题层
   覆盖：宣纸底 / 回纹顶栏 / 宋体 / 朱砂金配色 / 卡片方直化
   注意：此文件叠加在 styles.css 之上，只改气质不改布局
   ============================================================ */

:root {
  --paper: #f7f2e7;
  --paper-deep: #efe7d3;
  --ink: #2e2a24;
  --ink-light: #6b6353;
  --cinnabar: #9e2b22;
  --gold: #a8823c;
  --seal: #b03a2e;
}

/* ---- 宣纸底 + 墨色正文 + 宋体 ---- */
body {
  background:
    radial-gradient(ellipse at top, rgba(168, 130, 60, .06), transparent 60%),
    var(--paper) !important;
  color: var(--ink);
  font-family: "Noto Serif SC", "Source Han Serif SC", "SimSun", serif;
}

/* ---- 顶部回纹通栏（页面 <body> 后插入 <div class="cn-frieze"></div>） ---- */
.cn-frieze {
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='14' viewBox='0 0 28 14'%3E%3Cpath d='M2 12V2h8v8H4V4h4' fill='none' stroke='%23a8823c' stroke-width='1.4'/%3E%3Cpath d='M16 12V2h8v8h-6V4h4' fill='none' stroke='%23a8823c' stroke-width='1.4'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-color: var(--paper-deep);
  border-bottom: 1px solid rgba(168, 130, 60, .45);
}

/* ---- 导航融入纸色 ---- */
.site-header { background: rgba(247, 242, 231, .92) !important; border-bottom: 1px solid rgba(168, 130, 60, .35); }
.nav .brand { font-family: "Noto Serif SC", "SimSun", serif; letter-spacing: 1px; }

/* ---- 卡片方直化：圆角收敛、纸面化 ---- */
.card, .events-card, .panel, article[class*="card"] {
  border-radius: 2px !important;
  background: linear-gradient(180deg, #fdfaf2, #f6f0e0) !important;
  border: 1px solid rgba(168, 130, 60, .4) !important;
  box-shadow: 0 2px 10px rgba(80, 60, 30, .08) !important;
}

/* ---- 标题朱砂化 ---- */
h1, h2 { color: var(--cinnabar) !important; }
h2 { border-bottom: 2px solid rgba(168, 130, 60, .35) !important; }

.footer-enhanced { background: var(--paper-deep) !important; border-top: 1px solid rgba(168,130,60,.4); }
.footer-brand { color: var(--cinnabar) !important; letter-spacing: 3px; }
.footer-tagline { color: var(--ink-light) !important; }

/* ---- 按钮方直化 + 朱砂主按钮 ---- */
.button.primary, button.primary, .btn-primary {
  background: var(--cinnabar) !important; color: #f7f2e7 !important;
  border-radius: 2px !important;
}
.button, button { border-radius: 2px !important; }

/* ---- 表格古籍线 ---- */
table { border-collapse: collapse; }
th { background: rgba(168, 130, 60, .12) !important; color: #6b4f1d !important; }
th, td { border: 1px solid #e3ddd0 !important; }

/* ---- 分隔线金色化 ---- */
hr { border: none; border-top: 1px solid rgba(168, 130, 60, .4); }

/* ---- 中式 SVG 图标适配 ---- */
.cn-icon { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; }
.cn-icon svg { width: 100%; height: 100%; max-width: 44px; max-height: 44px; }
.why-icon, .stat-icon { border-radius: 6px !important; }

/* ---- hero 韓字标识 → 真正的朱文篆印 ---- */
.hanzi-seal {
  width: 44px !important;
  height: 44px !important;
  border: 3px solid var(--seal) !important;
  border-radius: 6px !important;
  background:
    radial-gradient(circle at 30% 30%, rgba(255, 235, 220, .18), transparent 55%),
    var(--seal) !important;
  color: #f7ecd9 !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  font-family: "KaiTi", "STKaiti", "QDSong", "SimSun", serif !important;
  box-shadow:
    inset 0 0 0 1.5px rgba(247, 236, 217, .55),
    inset 0 0 8px rgba(90, 20, 15, .35),
    0 2px 6px rgba(0, 0, 0, .25) !important;
  transform: rotate(-3deg) !important;
  text-shadow: 0 1px 1px rgba(90, 20, 15, .5);
}

/* ---- 印章改为图片（不再用网页字体渲染） ---- */
.hanzi-seal { width: 36px !important; height: 36px !important; transform: rotate(-3deg) !important; display: inline-block; line-height: 0 !important; }


/* ---- 印章响应式尺寸：桌面 84px / 平板 76px / 手机 68px ---- */
@media (max-width: 959px) {
  .big-seal { width: 92px !important; }
}
@media (max-width: 640px) {
  .big-seal { width: 84px !important; }
  .hanzi-seal { width: 32px !important; height: 32px !important; }
}

/* ---- 站标 lockup：印章图 + 文字 ---- */
.nav .brand {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.nav .brand-logo {
  display: block;
  width: 42px; height: 42px;
  border-radius: 3px;
  object-fit: contain;
  flex-shrink: 0;
}
.nav .brand-text {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 1px;
  color: var(--accent-dark, #6f2119);
  white-space: nowrap;
  line-height: 1.1;
}
@media (max-width: 959px) {
  .nav .brand-logo { width: 38px; height: 38px; }
  .nav .brand-text { font-size: 16px; letter-spacing: .5px; }
}
@media (max-width: 640px) {
  .nav .brand { gap: 8px; }
  .nav .brand-logo { width: 32px; height: 32px; }
  .nav .brand-text { font-size: 14px; letter-spacing: 0; }
}

/* ---- 站标 lockup 对齐加固 ---- */
.nav > .brand, .nav .brand {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  text-decoration: none !important;
  vertical-align: middle !important;
  line-height: 1 !important;
}
.nav .brand-logo,
.nav .brand img {
  display: block !important;
  width: 42px !important;
  height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  object-fit: contain !important;
  vertical-align: middle !important;
  margin: 0 !important;
  flex: 0 0 42px !important;
  align-self: center !important;
}
.nav .brand-text {
  display: block !important;
  position: static !important;
  top: auto !important;
  transform: none !important;
  line-height: 1.05 !important;
  padding: 0 !important;
  margin: 0 !important;
  vertical-align: middle !important;
  text-decoration: none !important;
  align-self: center !important;
}
@media (max-width: 959px) {
  .nav .brand-logo, .nav .brand img { width: 38px !important; height: 38px !important; max-width: 38px !important; max-height: 38px !important; flex: 0 0 38px !important; }
}
@media (max-width: 640px) {
  .nav .brand-logo, .nav .brand img { width: 32px !important; height: 32px !important; max-width: 32px !important; max-height: 32px !important; flex: 0 0 32px !important; }
}

/* ---- 页脚 img logo：居中、干净无虚影 ---- */
.footer-logo {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
  text-align: center !important;
}
.footer-logo img {
  display: block !important;
  width: 96px !important;
  height: 96px !important;
  max-width: 96px !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
  background: transparent !important;
  mix-blend-mode: multiply;
}
@media (max-width: 640px) {
  .footer-logo { margin-bottom: 10px !important; }
  .footer-logo img { width: 76px !important; height: 76px !important; max-width: 76px !important; }
}

/* ============================================================
   宋体字体族：自托管思源宋体（子集）+ 系统字体栈兜底
   解决手机端字体不一致：iOS 无 SimSun、Android 无思源宋体
   ============================================================ */
@font-face {
  font-family: QDSong;
  src: url(/assets/font/qdsong-400.woff2) format(woff2);
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

body, button, input, select, textarea {
  font-family: QDSong, Noto Serif SC, Source Han Serif SC,
               Songti SC, STSong, Noto Serif CJK SC, Source Han Serif CN,
               SimSun, Songti TC, serif !important;
}
h1, h2, h3, h4, h5, h6, .brand-text, .hero-title-v2, .article-wrap h1,
.article-wrap h2, .article-sub, .story-body h2, .stat-number, .stories-head h1 {
  font-family: QDSong, Noto Serif SC, Source Han Serif SC,
               Songti SC, STSong, SimSun, serif !important;
  font-weight: 700;
  font-synthesis-weight: auto;
}
/* 中文字间微调：宋体在移动端行高略紧 */
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* ---- 中式纹样牌图标（真图片，替代 SVG） ---- */
.cn-pic {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 3px !important;
}
.why-icon, .stat-icon, .cta-icon {
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 4px !important;
  background: #f7f2e7 !important;
  box-shadow: 0 2px 8px rgba(80,60,30,.14) !important;
  border: 1px solid rgba(168,130,60,.35) !important;
}

/* ---- 正文配图：宽度自适应 + 高度自动（防止手机端变形） ---- */
.art-fig img,
.article-wrap img,
.story-body img {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  display: block !important;
}
.art-fig picture { display: block !important; width: 100% !important; }
