/* ===== Scene 08 · Course Center v1.2 · 可读性与对比度修复 =====
   只改 CSS。HTML/JS 不动。
   字体放大 · 层级拉开 · 金更亮 · 正文更白 · overlay 像课程殿 */

* { margin:0; padding:0; box-sizing:border-box; }

:root{
  --bg:#05070A;
  --panel:#10131A;
  --panel2:#171B24;
  --gold:#FFD45A;
  --gold2:#FFF0A6;
  --gold-deep:#B87816;
  --text:#FFF6E3;
  --muted:#C9B98E;
  --dim:#7F7255;
  --red:#B83A2E;
  --green:#5a9a5a;
  --line:rgba(255,212,90,0.35);
  --font-lishu:"华文隶书","STLiti","LiSu","Source Han Serif SC","SimSun",serif;
  --font-songti:"Noto Serif SC","Source Han Serif SC","SimSun",serif;
}

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-songti);
  font-size:20px;
  line-height:1.9;
  overflow-x:hidden;
}

.bg-glow{position:fixed;top:0;left:50%;width:80vw;height:60vh;transform:translateX(-50%);background:radial-gradient(ellipse at 50% 40%,rgba(255,212,90,0.15),transparent 60%);pointer-events:none;z-index:0;}
.bg-vignette{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 50%,rgba(0,0,0,0.55) 100%);}
.center{max-width:1100px;margin:0 auto;padding:0 24px 80px;position:relative;z-index:1;}

/* ① 成长地图 */
.growth-map{min-height:80vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 24px;}
.eyebrow{
  font-size:clamp(13px,1.8vw,16px);
  color:var(--gold);
  letter-spacing:.24em;
  font-weight:bold;
  margin-bottom:28px;
  font-family:var(--font-lishu);
}
.growth-map h1{
  font-family:var(--font-lishu);
  font-size:clamp(44px,7vw,80px);
  font-weight:400;
  letter-spacing:.14em;
  color:var(--gold2);
  text-shadow:0 0 18px rgba(255,212,90,.38);
}
.head-line{width:220px;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:28px auto;}
.creed{
  font-size:clamp(16px,2.6vw,22px);
  color:var(--text);
  line-height:2;
  letter-spacing:4px;
  font-weight:300;
  margin-bottom:44px;
}
.growth-flow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;}
.gf-node{
  padding:8px 20px;
  border:1px solid rgba(255,212,90,.35);
  color:var(--muted);
  font-size:14px;
  letter-spacing:3px;
  border-radius:2px;
  font-family:var(--font-lishu);
}
.gf-current{
  color:#05070A;
  background:linear-gradient(180deg,#FFF0A6,#FFD45A);
  font-weight:bold;
  box-shadow:0 0 24px rgba(255,212,90,.32);
}
.gf-future{opacity:0.4;}
.gf-arrow{color:var(--gold-deep);font-size:14px;}

/* ② 课程长廊 */
.gallery{padding:20px 0 40px;}
.system-divider{
  font-size:34px;
  color:var(--gold2);
  font-family:var(--font-lishu);
  letter-spacing:.16em;
  margin:90px 0 32px;
  padding-top:44px;
  border-top:1px solid var(--line);
  text-align:center;
  text-shadow:0 0 18px rgba(255,212,90,.25);
}
.system-divider:first-child{border-top:none;padding-top:20px;margin-top:0;}
.system-row{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;padding-bottom:20px;}
/* 一个体系只有 1 门课时，卡片跨列居中，避免左偏留白 */
.course-card:only-child{grid-column:1 / -1;max-width:600px;justify-self:center;}
.course-card{
  position:relative;
  background:linear-gradient(145deg,#171B24,#080A0F);
  border:1px solid rgba(255,212,90,.42);
  padding:36px;
  min-height:260px;
  cursor:pointer;
  transition:border-color .4s,box-shadow .4s;
  box-shadow:0 28px 80px rgba(0,0,0,.55);
  overflow:hidden;
}
.course-card::before,.course-card::after{content:'';position:absolute;width:24px;height:24px;border-color:var(--gold);opacity:0.5;z-index:2;transition:opacity .4s;}
.course-card::before{top:12px;left:12px;border-top:2px solid;border-left:2px solid;}
.course-card::after{bottom:12px;right:12px;border-bottom:2px solid;border-right:2px solid;}
.course-card:hover{border-color:var(--gold2);box-shadow:0 0 40px rgba(255,212,90,.18),0 28px 80px rgba(0,0,0,.55);}
.course-card:hover::before,.course-card:hover::after{opacity:0.9;}
.cc-id{
  font-size:15px;
  color:var(--gold);
  letter-spacing:.16em;
  font-weight:bold;
  font-family:'JetBrains Mono',monospace;
  display:block;
  margin-bottom:10px;
}
.cc-title{
  font-family:var(--font-lishu);
  font-size:clamp(28px,2.6vw,40px);
  font-weight:400;
  color:var(--gold2);
  line-height:1.25;
  letter-spacing:3px;
  margin:20px 0 14px;
}
.cc-mission{
  color:var(--text);
  font-size:19px;
  letter-spacing:2px;
  font-weight:300;
  line-height:1.8;
  margin-bottom:24px;
}
.cc-meta{display:flex;gap:10px;margin-bottom:24px;}
.cc-tag{
  font-size:15px;
  color:var(--gold2);
  background:rgba(255,212,90,.12);
  border:1px solid rgba(255,212,90,.45);
  padding:6px 14px;
  border-radius:2px;
  font-family:var(--font-lishu);
}
.cc-enter{
  font-size:17px;
  color:var(--gold);
  font-weight:bold;
  letter-spacing:4px;
  opacity:0.7;
  transition:opacity .3s;
}
.course-card:hover .cc-enter{opacity:1;}

/* ③ 课程详情 overlay */
.course-hall{display:none;position:fixed;inset:0;z-index:100;overflow-y:auto;background:rgba(3,5,8,.96);}
.course-hall.active{display:block;animation:fadeIn .5s ease;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.hall-back{
  position:fixed;top:28px;left:28px;z-index:110;
  font-size:22px;color:var(--gold2);letter-spacing:4px;cursor:pointer;
  background:rgba(5,7,10,0.85);border:1px solid var(--line);
  border-radius:4px;padding:12px 24px;transition:all .3s;
}
.hall-back:hover{border-color:var(--gold2);letter-spacing:8px;}
.hall-content{
  max-width:1080px;margin:60px auto;padding:72px 56px;
  background:linear-gradient(145deg,#141821,#07090D);
  border:1px solid rgba(255,212,90,.48);
  box-shadow:0 40px 140px rgba(0,0,0,.8);
}
.hall-id{
  font-size:17px;color:var(--gold);letter-spacing:.18em;font-weight:800;
  font-family:'JetBrains Mono',monospace;display:block;margin-bottom:12px;
}
.hall-system{
  font-size:18px;color:var(--gold2);letter-spacing:3px;font-family:var(--font-lishu);
  display:inline-block;border:1px solid rgba(255,212,90,.45);background:rgba(255,212,90,.12);
  padding:8px 20px;border-radius:2px;margin-bottom:36px;
}
.hall-title{
  font-family:var(--font-lishu);
  font-size:clamp(44px,5vw,68px);
  font-weight:400;color:var(--gold2);
  letter-spacing:.1em;line-height:1.2;
  margin-bottom:48px;
  text-shadow:0 0 24px rgba(255,212,90,.28);
}
.hall-section,.hall-next,.hall-readiness,.hall-contract{
  margin-top:38px;
  padding:28px;
  background:rgba(255,255,255,.035);
  border-left:4px solid var(--gold);
  border-top:1px solid rgba(255,212,90,.18);
  border-radius:0 4px 4px 0;
}
.hall-label,.readiness-label,.contract-label{
  display:block;
  font-size:16px;color:var(--gold);
  letter-spacing:.16em;font-weight:bold;
  margin-bottom:16px;
  font-family:'JetBrains Mono',monospace;
}
.hall-text,.hall-outcome,.hall-next-text,.contract-why{
  font-size:20px;color:var(--text);letter-spacing:2px;font-weight:300;line-height:1.9;
}
.hall-outcome{color:var(--gold2);font-style:italic;}
.hall-modules{display:flex;flex-direction:column;}
.hall-module{
  display:flex;align-items:center;gap:20px;
  font-size:20px;padding:18px 0;
  border-bottom:1px solid rgba(255,212,90,.18);
}
.hall-module:last-child{border-bottom:none;}
.hm-num{
  color:var(--gold);font-weight:900;font-size:18px;
  letter-spacing:2px;font-family:'JetBrains Mono',monospace;min-width:64px;
}
.hm-title{color:var(--text);font-size:22px;letter-spacing:1px;flex:1;}
.hm-lessons{color:var(--muted);font-size:17px;}
.hall-journeys{display:flex;flex-wrap:wrap;gap:10px;}
.hall-journey{
  font-size:19px;color:var(--gold2);letter-spacing:2px;
  border:1px solid rgba(255,212,90,.42);
  padding:10px 18px;margin:4px;border-radius:2px;
  background:rgba(255,212,90,.08);font-family:var(--font-lishu);
  display:inline-block;
}
.hall-books{display:flex;flex-wrap:wrap;gap:12px;}
.hall-book{
  font-size:19px;color:var(--gold2);letter-spacing:2px;
  border:1px solid rgba(255,212,90,.42);
  padding:10px 18px;margin:4px;border-radius:2px;
  background:rgba(255,212,90,.08);font-family:var(--font-lishu);
  text-decoration:none;display:inline-block;transition:all .3s;
}
.hall-book:hover{border-color:var(--gold2);background:rgba(255,212,90,.16);}
.hall-cases{display:flex;flex-wrap:wrap;gap:12px;}
.hall-case{
  font-size:19px;color:var(--green);letter-spacing:1px;
  border:1px solid rgba(90,154,90,0.4);
  padding:10px 18px;margin:4px;border-radius:2px;
  background:rgba(90,154,90,0.08);text-decoration:none;display:inline-block;transition:all .3s;
}
.hall-case:hover{border-color:var(--green);background:rgba(90,154,90,0.16);}
.hall-none{color:var(--dim);font-size:19px;}
.hall-next{border-left-color:var(--gold);}
.hall-next-text{color:var(--gold2);}

/* Readiness */
.readiness-bar{
  width:100%;height:18px;background:#232733;
  border:1px solid rgba(255,212,90,.25);border-radius:9px;overflow:hidden;
}
.readiness-fill{
  height:100%;background:linear-gradient(90deg,#B87816,#FFD45A,#FFF0A6);
  box-shadow:0 0 28px rgba(255,212,90,.35);transition:width 1s ease;
}
.readiness-pct{
  display:block;margin-top:14px;
  font-size:28px;color:var(--gold2);font-weight:bold;
  font-family:'JetBrains Mono',monospace;letter-spacing:2px;
}
.readiness-tip{font-size:19px;color:var(--text);margin-top:10px;line-height:1.8;}

/* Learning Contract */
.hall-contract{border-left-color:var(--green);background:rgba(90,154,90,0.05);}
.contract-item{
  font-size:18px;color:var(--text);padding:10px 0;
  border-bottom:1px solid rgba(255,255,255,.08);line-height:1.8;
}
.contract-item:last-child{border-bottom:none;}
.contract-item::before{content:'□ ';color:var(--green);font-size:19px;}

/* Start button */
.hall-start{
  margin-top:48px;width:100%;
  padding:20px 30px;
  font-size:21px;font-weight:bold;letter-spacing:.16em;
  color:#05070A;
  background:linear-gradient(180deg,#FFF0A6,#FFD45A);
  border:0;border-radius:2px;cursor:pointer;
  font-family:var(--font-songti);
  box-shadow:0 0 42px rgba(255,212,90,.32);
  transition:all .4s;
}
.hall-start:hover{box-shadow:0 0 60px rgba(255,212,90,.5);transform:translateY(-2px);}
.hall-start:disabled{opacity:0.3;cursor:not-allowed;transform:none;box-shadow:none;}

/* ④ 成长路线 */
.roadmap{text-align:center;padding:56px 24px;border-top:1px solid var(--line);margin-top:48px;}
.roadmap-flow{display:flex;align-items:center;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:28px;}
.rf-node{
  padding:12px 22px;border:1px solid var(--line);
  color:var(--muted);font-size:16px;letter-spacing:3px;
  border-radius:2px;font-family:var(--font-lishu);text-decoration:none;transition:all .3s;
}
.rf-node:hover{border-color:var(--gold);}
.rf-current{border-color:var(--gold);color:var(--gold2);background:rgba(255,212,90,.12);font-weight:bold;}
.rf-future{opacity:0.4;}
.rf-arrow{color:var(--gold-deep);font-size:16px;}
.roadmap-text{color:var(--gold2);font-size:clamp(18px,2.6vw,24px);letter-spacing:5px;font-weight:300;}
.foot-link{color:var(--gold2);text-decoration:none;border-bottom:1px solid var(--line);font-size:15px;letter-spacing:2px;}
.foot-sep{color:var(--dim);margin:0 10px;}

@media(max-width:768px){
  .center{padding:0 16px 60px;}
  .system-row{grid-template-columns:1fr;}
  .hall-content{padding:80px 24px 60px;}
  .growth-map h1{letter-spacing:.1em;}
  .system-divider{font-size:32px;margin:70px 0 28px;}
}
