/* ============================================================
   中国彩宝集团官网 · 中国红配色改版补丁（荔色 × 朱红版）
   ============================================================
   依据：荔色 #89262C（内容区）、朱红 #71131A（页眉页脚），
        不老红 #712029、燃红 #5E171A 作辅助层次，金色作唯一强调。

   用法：将本文件全部内容【追加】到 css/style.css 的最末尾。
   CSS 变量取值时后声明覆盖先声明，因此无需改动任何原有代码；
   需要回滚时删掉这一段即可，原样式自动恢复。

   原理：
   - 原 CSS 中所有 var(--xxx) 的取色自动被下方新值接管；
   - 原 CSS 中少数硬编码色值（#581C09 等）用同名选择器在后
     重新声明覆盖；
   - 深红底上的文字，对涉及选择器单独声明浅色。
   ============================================================ */

/* ---------- ① 色板变量（接管原有变量取值） ---------- */
:root {
    /* 四色中国红 */
    --red-li:    #89262C;   /* 荔色   · 内容区背景 */
    --red-zhu:   #71131A;   /* 朱红   · 页眉 / 页脚 */
    --red-bulao: #712029;   /* 不老红 · 分区交替 / 卡片底 */
    --red-ran:   #5E171A;   /* 燃红   · 深色图底 / 视频区 */
    --red-wight:   #ffffff;   /* 燃红   · 深色图底 / 视频区 */

    /* 金色强调（沿用原主金，仅加亮一档浅金用于红底文字） */
    --primary-color: #D4AF37;
    --primary-dark:  #B8960F;
    --primary-light: #F0DCA8;

    /* 背景接管：荔色为底，不老红 / 燃红分层 */
    --bg-color:      var(--red-wight);     /* 原 #781F19 */
    --bg-light:      var(--red-bulao);  /* 原 #F8F8F8，分区交替色 */
    --bg-dark:       var(--red-ran);    /* 原 #0A0A0A，视频区 */

    /* 深红底上的文字层级 */
    --ink-on-red:    #F7EFDF;                       /* 主文字 */
    --text-on-red:   rgba(247, 239, 223, 0.78);     /* 正文 */
    --muted-on-red:  rgba(247, 239, 223, 0.55);     /* 弱化 */

    --border-color: rgba(240, 220, 168, 0.22);

    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.22);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.30);
    --shadow-lg: 0 8px 40px rgba(0, 0, 0, 0.38);
    --shadow-gold: 0 4px 20px rgba(212, 175, 55, 0.30);
}

/* ---------- ② 页眉页脚统一为朱红（覆盖原 #581C09 共 8 处） ---------- */
.navbar,
.navbar.scrolled,
.nav-container,
.nav-menu,
.dropdown-menu,
.hamburger,
.footer {
    background: var(--red-zhu);
}

/* 朱红页眉细节 */
.navbar {
    border-bottom: 1px solid rgba(212, 175, 55, 0.28);
}

/* 下拉菜单悬停不再闪白底 */
.dropdown-menu a:hover {
    background: rgba(255, 255, 255, 0.08);
    color: var(--primary-light);
}

/* ---------- ③ 深色渐变替换（原 #8B1214→#4A0405 共 2 处） ---------- */
.page-header-overlay {
    background: linear-gradient(135deg, var(--red-zhu) 0%, var(--red-ran) 100%);
}

.product-image {
    background: linear-gradient(135deg, var(--red-zhu) 0%, var(--red-ran) 100%);
}
/* .product-image 原第一行 background:#ffffff 为失效死代码，可顺手删除 */

/* ---------- ④ 深红底上的文字可读性 ---------- */
/* 直接落在荔色 / 不老红背景上的标题与正文 */
.section-title    { color: var(--ink-on-red); }
.section-subtitle { color: var(--text-on-red); }

.story-intro h2 {
    color: var(--ink-on-red);        /* 原 #1A1A1A 压暗红底看不清 */
    letter-spacing: 0.3em;
    font-weight: 400;
}
.story-intro .subtitle { color: var(--primary-light); }
.story-intro p         { color: var(--text-on-red); }

.video-text h2 { color: var(--ink-on-red); }
.video-text p  { color: var(--text-on-red); }

/* 轮播下方标语区留白加大，更大气 */
.story-intro { padding: 2rem 1rem; }

/* ---------- ⑤ 卡片与表单（浅色面板保留，换暖白避免冷灰突兀） ---------- */
.product-card,
.news-card,
.notice-card {
    background: #FDF8EF;             /* 暖米白，替代纯白 */
    border: 1px solid var(--border-color);
}
/* 卡片内部文字仍为深色，无需改动 */

/* ---------- ⑥ 资讯分类 / 公示类型标签归入红金家族 ---------- */
.news-category-tag.industry  { background: var(--red-bulao); border: 1px solid rgba(212,175,55,.35); }
.news-category-tag.knowledge { background: var(--red-ran);   border: 1px solid rgba(212,175,55,.35); }
.news-category-tag.event     { background: var(--red-zhu);   border: 1px solid rgba(212,175,55,.35); }
.notice-type.business        { background: var(--red-bulao); border: 1px solid rgba(212,175,55,.35); }
.notice-type.system          { background: var(--red-ran);   border: 1px solid rgba(212,175,55,.35); }
.notice-type.recruitment     { background: var(--red-zhu);   border: 1px solid rgba(212,175,55,.35); }
/* .required 必填星号保留 #E74C3C，功能语义优先，且多在浅色表单上 */

/* ---------- ⑦ 可选加分项 ---------- */

/* 7-1 轮播图统一暗罩：三张 banner 照片色调一致、文字可读
.slider::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(94,23,26,0.15), rgba(94,23,26,0.35));
    pointer-events: none;
    z-index: 5;
}
（slider-btn / slider-dots / slide-content 的 z-index 需大于 5） */

/* 7-2 按钮金色微调，使其在朱红页眉上更醒目
.btn-gold {
    background: linear-gradient(135deg, #E8C547, #C89B2E);
} */

/* ---------- 完成后的色彩体系 ----------
   荔色   #89262C  内容区背景
   朱红   #71131A  页眉 / 页脚
   不老红 #712029  分区交替 / 卡片底 / 渐变亮端
   燃红   #5E171A  深色图底 / 视频区 / 渐变暗端
   金色   #D4AF37 / #F0DCA8  唯一强调色
   浅字   #F7EFDF 及其透明度层级
   —— 全站仅红金两族，无杂色。 ---------- */
