:root{
  --bg:#120d0a;
  --bg2:#181008;
  --panel:#1e140c;
  --panel2:#241710;
  --line:#5a3d1c;
  --line-soft:#3a2814;
  --gold:#c9a227;
  --gold-bright:#e3c15a;
  --gold-dim:#8a6d1f;
  --crimson:#a83232;
  --crimson-bright:#c9473f;
  --ivory:#eadcc0;
  --ivory-dim:#c4b291;
  --muted:#9a8a6e;
  --font-disp:"Palatino Linotype","Book Antiqua",Palatino,"Georgia","Songti SC","STSong","Times New Roman",serif;
  --font-body:"Avenir Next","Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(1200px 600px at 50% -100px, rgba(168,50,50,.10), transparent 60%),
    radial-gradient(900px 500px at 90% 20%, rgba(201,162,39,.05), transparent 55%),
    var(--bg);
  color:var(--ivory);
  font-family:var(--font-body);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
::selection{background:var(--crimson);color:#fff}

/* ---------- 顶部英雄区（纯主题，无战役图） ---------- */
.hero{
  position:relative;min-height:76vh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:80px 24px 90px;overflow:hidden;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(900px 480px at 50% 30%, rgba(168,50,50,.16), transparent 65%),
    radial-gradient(600px 400px at 50% 80%, rgba(201,162,39,.06), transparent 60%),
    linear-gradient(180deg, #1a1009 0%, var(--bg) 100%);
}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg, transparent 0 4px, rgba(201,162,39,.015) 4px 5px);
}
.hero-inner{position:relative;z-index:2;max-width:900px}
.hero-emblem{width:150px;height:auto;margin:0 auto 28px;filter:drop-shadow(0 0 22px rgba(201,162,39,.35))}
.hero-kicker{font-family:var(--font-disp);letter-spacing:.42em;text-transform:uppercase;color:var(--gold-bright);font-size:13px;margin-bottom:18px}
.hero h1{font-family:var(--font-disp);font-weight:600;font-size:clamp(44px,8vw,92px);line-height:1.04;letter-spacing:.06em;color:var(--ivory);text-shadow:0 2px 30px rgba(168,50,50,.45)}
.hero h1 .red{color:var(--crimson-bright)}
.hero-sub{font-family:var(--font-disp);letter-spacing:.28em;text-transform:uppercase;color:var(--gold);font-size:clamp(14px,2.4vw,20px);margin-top:14px}
.hero-era{display:inline-block;margin-top:30px;padding:9px 22px;border:1px solid var(--line);border-radius:2px;font-size:13px;letter-spacing:.16em;color:var(--ivory-dim);background:rgba(30,20,12,.55)}
.hero-era b{color:var(--gold-bright);font-weight:500}
.ornament{color:var(--gold-dim);letter-spacing:1.2em;font-size:15px;margin:20px 0 0;opacity:.9}

/* ---------- 导航 ---------- */
nav{position:sticky;top:0;z-index:50;background:rgba(18,13,10,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-soft)}
nav .wrap{max-width:1100px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
nav a{color:var(--ivory-dim);text-decoration:none;font-size:14px;padding:13px 13px;letter-spacing:.06em;transition:.2s;white-space:nowrap}
nav a:hover{color:var(--gold-bright)}
nav .brand{font-family:var(--font-disp);color:var(--gold);letter-spacing:.18em;margin-right:auto;font-size:15px;text-transform:uppercase}

/* ---------- 通用区块 ---------- */
main{max-width:1100px;margin:0 auto;padding:0 24px 40px}
section{padding:70px 0 10px}
.sec-head{text-align:center;margin-bottom:46px}
.sec-eyebrow{font-family:var(--font-disp);letter-spacing:.4em;text-transform:uppercase;color:var(--crimson-bright);font-size:12px;margin-bottom:14px}
.sec-title{font-family:var(--font-disp);font-weight:600;font-size:clamp(28px,4.6vw,44px);letter-spacing:.08em;color:var(--ivory)}
.sec-title .g{color:var(--gold-bright)}
.sec-desc{max-width:720px;margin:20px auto 0;color:var(--ivory-dim);font-size:16px}
.sec-desc b{color:var(--gold-bright);font-weight:500}
.divider{display:flex;align-items:center;justify-content:center;gap:16px;margin:10px auto 0;color:var(--gold-dim);max-width:360px}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--line))}
.divider::after{background:linear-gradient(90deg,var(--line),transparent)}

/* ---------- 总览 ---------- */
.overview-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
@media(max-width:820px){.overview-grid{grid-template-columns:1fr}}
.overview-text p{margin-bottom:18px;color:var(--ivory-dim);font-size:16px}
.overview-text p b{color:var(--gold-bright);font-weight:500}
.badge-box{text-align:center;padding:30px;border:1px solid var(--line);background:var(--panel);border-radius:4px;position:relative}
.badge-box::before,.badge-box::after{content:"✦";position:absolute;color:var(--gold);font-size:14px}
.badge-box::before{top:-8px;left:14px}
.badge-box::after{bottom:-8px;right:14px}
.badge-box img{width:100%;max-width:320px;height:auto;margin:0 auto;display:block}
.badge-box .cap{margin-top:16px;color:var(--muted);font-size:13px;letter-spacing:.08em}

/* ---------- 组织结构 ---------- */
.org-box{border:1px solid var(--line);background:var(--panel);border-radius:4px;padding:14px;text-align:center}
.org-box img{width:100%;height:auto;border-radius:2px}
.org-box a{display:block}
.org-tip{margin-top:12px;color:var(--muted);font-size:13px;letter-spacing:.05em}

/* ---------- 军种卡片（可点击） ---------- */
.unit-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px}
.card-link{display:block;height:100%}
.unit-card{
  background:var(--panel);border:1px solid var(--line-soft);border-radius:4px;
  overflow:hidden;display:flex;flex-direction:column;height:100%;
  transition:transform .25s,border-color .25s,box-shadow .25s;position:relative;
}
.card-link:hover .unit-card,.unit-card:hover{
  transform:translateY(-4px);border-color:var(--gold-dim);
  box-shadow:0 14px 40px rgba(0,0,0,.5),0 0 0 1px rgba(201,162,39,.12);
}
.unit-card .ph{aspect-ratio:4/3;overflow:hidden;background:var(--bg2);position:relative;border-bottom:1px solid var(--line-soft)}
.unit-card .ph img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;transition:transform .5s}
.card-link:hover .unit-card .ph img{transform:scale(1.04)}
.unit-card .body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.unit-tag{align-self:flex-start;font-size:11px;letter-spacing:.14em;color:var(--gold-bright);border:1px solid var(--line);padding:3px 10px;border-radius:2px;text-transform:uppercase}
.unit-card h3{font-family:var(--font-disp);font-size:22px;letter-spacing:.04em;color:var(--ivory)}
.unit-card h3 .en{display:block;font-size:13px;letter-spacing:.16em;color:var(--muted);font-weight:400;margin-top:3px}
.unit-card p{font-size:14.5px;color:var(--ivory-dim)}
.unit-card .more{margin-top:auto;padding-top:12px;font-size:12.5px;letter-spacing:.12em;color:var(--gold);border-top:1px dashed var(--line-soft)}
.unit-card .more::after{content:" ›";letter-spacing:0}

/* ---------- 五大巫师学派 ---------- */
.cult-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:22px}
.cult-card{text-align:center;padding:28px 18px;border:1px solid var(--line-soft);background:var(--panel);border-radius:4px;transition:.25s;height:100%;display:block}
.cult-card:hover{border-color:var(--gold-dim);background:var(--panel2);transform:translateY(-3px)}
.cult-card img{width:110px;height:auto;margin:0 auto 18px;display:block;filter:drop-shadow(0 0 14px rgba(168,50,50,.3))}
.cult-card h3{font-family:var(--font-disp);font-size:20px;color:var(--gold-bright);letter-spacing:.05em}
.cult-card .en{font-size:12px;letter-spacing:.18em;color:var(--muted);margin:4px 0 10px;text-transform:uppercase}
.cult-card .dom{font-size:13px;color:var(--crimson-bright);letter-spacing:.1em;margin-bottom:10px}
.cult-card p{font-size:13.5px;color:var(--ivory-dim)}

/* ---------- 详情页 ---------- */
.detail-hero{position:relative;padding:52px 24px 40px;text-align:center;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#1a1009 0%,var(--bg) 100%)}
.back-link{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;letter-spacing:.08em;margin-bottom:26px;transition:.2s}
.back-link:hover{color:var(--gold-bright)}
.back-link::before{content:"‹";font-size:20px;line-height:0}
.detail-hero .kicker{font-family:var(--font-disp);letter-spacing:.4em;text-transform:uppercase;color:var(--crimson-bright);font-size:12px;margin-bottom:14px}
.detail-hero h1{font-family:var(--font-disp);font-weight:600;font-size:clamp(34px,6vw,56px);letter-spacing:.05em;color:var(--ivory)}
.detail-hero h1 .en{display:block;font-size:clamp(15px,2.4vw,20px);letter-spacing:.22em;color:var(--gold);font-weight:400;margin-top:10px}
.detail-hero .tag{display:inline-block;margin-top:20px;padding:6px 16px;border:1px solid var(--line);border-radius:2px;font-size:13px;letter-spacing:.14em;color:var(--gold-bright)}
.detail-wrap{max-width:820px;margin:0 auto;padding:0 24px 60px}
.detail-figure{max-width:560px;margin:44px auto 40px;text-align:center}
.detail-figure img{width:100%;height:auto;border:1px solid var(--line);border-radius:4px;box-shadow:0 18px 50px rgba(0,0,0,.5)}
.detail-section{margin-bottom:34px}
.detail-section h2{
  font-family:var(--font-disp);font-size:22px;color:var(--gold-bright);letter-spacing:.08em;
  margin-bottom:12px;padding-left:14px;border-left:3px solid var(--crimson);
}
.detail-section p{color:var(--ivory-dim);font-size:16px;line-height:1.9}
.detail-nav{display:flex;justify-content:space-between;gap:16px;margin-top:50px;padding-top:24px;border-top:1px solid var(--line-soft)}
.detail-nav a{color:var(--ivory-dim);font-size:14px;letter-spacing:.06em;transition:.2s;max-width:48%}
.detail-nav a:hover{color:var(--gold-bright)}
.detail-nav .dir{display:block;font-size:11px;letter-spacing:.16em;color:var(--muted);margin-bottom:4px;text-transform:uppercase}

/* ---------- 页脚 ---------- */
footer{margin-top:40px;border-top:1px solid var(--line-soft);background:var(--bg2);padding:44px 24px 56px;text-align:center}
footer .f-orn{color:var(--gold-dim);font-size:18px;letter-spacing:.8em;margin-bottom:18px}
footer p{color:var(--muted);font-size:13px;max-width:720px;margin:0 auto 10px;line-height:1.8}
footer p b{color:var(--ivory-dim);font-weight:500}
footer .src a{color:var(--gold-dim);text-decoration:none}
footer .src a:hover{color:var(--gold-bright)}
footer .legal{font-size:11.5px;opacity:.7}
