/* ==========================================================
   公共样式（index.html / 404.html 共用）
   内容：基础重置、四主题变量体系、body 基础、书法字体与字形
   页面专属样式仍保留在各自的 HTML <style> 中
   ========================================================== */

/* ========== 基础重置 ========== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ========== 主题变量（默认：暗色流式风） ========== */
:root {
    --bg: #070d1a;
    --bg-soft: #0b1526;
    --ink: #eaf2ff;
    --ink-dim: #9db0cc;
    --cyan: #2dd4bf;
    --blue: #3b82f6;
    --violet: #8b5cf6;
    --gold: #f5b95f;
    --card: rgba(255, 255, 255, 0.05);
    --card-border: rgba(255, 255, 255, 0.1);
    --radius: 24px;
}

/* 浅色基底（方案B 用） */
.theme-light {
    --bg: #d5ddeb;
    --bg-soft: #c9d3e4;
    --ink: #17253f;
    --ink-dim: #4d5d78;
    --card: rgba(255, 255, 255, 0.75);
    --card-border: rgba(23, 37, 63, 0.09);
}

/* 【方案A】蓝渐变企业门户风 · 深蓝渐变底 + 白色卡片（整体重调版） */
.theme-a {
    /* 深蓝渐变背景体系 */
    --bg: #0a1f4a;
    /* 兜底纯色 */
    --bg-soft: rgba(4, 16, 42, .3);
    /* 分区叠加暗带 */
    --ink: #f4f8ff;
    --ink-dim: #c0cdf0;
    --card: rgba(255, 255, 255, 0.1);
    --card-border: rgba(255, 255, 255, 0.18);
    /* 亮色点缀（渐变底上的高光/渐变文字用） */
    --cyan: #56c8e8;
    --blue: #5b9bff;
    --violet: #9a8cff;
    --gold: #eec06a;
    --c1: 86, 200, 232;
    --c2: 91, 155, 255;
    --c3: 154, 140, 255;
}

.theme-a body {
    background: linear-gradient(160deg, #081c44 0%, #10357f 50%, #1e50b8 100%);
    background-attachment: fixed;
}

/* 【方案B】科技蓝 + 亮青 · 浅色活力风（信息化/物联网） */
.theme-b {
    --cyan: #0891b2;
    --blue: #1e6fff;
    --violet: #6366f1;
    --gold: #f59e0b;
    --c1: 8, 145, 178;
    /* 深青 rgb */
    --c2: 30, 111, 255;
    /* 科技蓝 rgb */
    --c3: 99, 102, 241;
    /* 靛蓝 rgb */
}

/* 【方案D】翡翠绿 · 深绿生机风（传统“亨”绿主色） */
.theme-d {
    --bg: #0b241a;
    --bg-soft: #103024;
    --ink: #ecfdf5;
    --ink-dim: #a8d4bd;
    --cyan: #34d399;
    --blue: #2dd4bf;
    --violet: #a3e635;
    --gold: #f5c76a;
    --c1: 52, 211, 153;
    /* 翡翠绿 rgb */
    --c2: 45, 212, 191;
    /* 青绿 rgb */
    --c3: 163, 230, 53;
    /* 柠檬绿 rgb */
}

.theme-d body {
    background: linear-gradient(160deg, #0a2b1d 0%, #145233 55%, #1e7a4d 100%);
    background-attachment: fixed;
}

/* 【方案E】星曜紫 · 深空紫韵风 */
.theme-e {
    --bg: #1d0f38;
    --bg-soft: #2a1850;
    --ink: #f3eeff;
    --ink-dim: #c0b3e2;
    --cyan: #b18cff;
    --blue: #8b5cf6;
    --violet: #e26bff;
    --gold: #f5c76a;
    --c1: 177, 140, 255;
    /* 柔紫 rgb */
    --c2: 139, 92, 246;
    /* 菁紫 rgb */
    --c3: 226, 107, 255;
    /* 洋红紫 rgb */
}

.theme-e body {
    background: linear-gradient(160deg, #1c0f3d 0%, #3a1e75 55%, #5a2fae 100%);
    background-attachment: fixed;
}

/* ========== body 基础（各页可再追加页面专属规则） ========== */
body {
    background: var(--bg);
    color: var(--ink);
    font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Helvetica Neue", sans-serif;
    line-height: 1.7;
    /* 内容保护：禁止选中文字（配合 protect.js 拦截复制） */
    -webkit-user-select: none;
    user-select: none;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    max-width: 100%;
    display: block;
}

/* ========== 书法字体与字形 ========== */
/* 书法字体栈：在线行楷优先（马善政），本机行楷/草书兑底
   想换风格：'Liu Jian Mao Cao' = 草书，'Zhi Mang Xing' = 行草（较容易认） */
.xingshu {
    font-family: "Ma Shan Zheng", "STXingkai", "华文行楷", "FZXingKai-Z01", "方正行楷", "Zhi Mang Xing", "Liu Jian Mao Cao", "SimSun", serif;
    font-weight: 700;
}

/* 书法图片字形：mask 出字形，填充 currentColor，随各主题字色自动换色 */
.img-glyph {
    background: currentColor;
    text-shadow: none;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
}

.img-glyph.g-heng {
    -webkit-mask-image: url("logo-heng.png");
    mask-image: url("logo-heng.png");
}

.img-glyph.g-li {
    -webkit-mask-image: url("logo-li.png");
    mask-image: url("logo-li.png");
}

.img-glyph.g-zhen {
    -webkit-mask-image: url("logo-zhen.png");
    mask-image: url("logo-zhen.png");
}
