/* ============================================
   文物里的科学 · 课程专题站样式
   品牌站风格延伸：金黑 + 思源宋体
   ============================================ */
:root {
  --gold: #b8860b;
  --gold-light: #f5e6c8;
  --gold-deep: #8a6508;
  --ink: #1a1a1a;
  --ink-soft: #4a4a4a;
  --paper: #faf7f0;
  --paper-deep: #f0e9da;
  --white: #ffffff;
  --shadow: 0 8px 30px rgba(26,26,26,.08);
  --radius: 14px;
  --serif: 'Songti SC', 'Noto Serif SC', 'SimSun', serif;
  --sans: -apple-system, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: var(--sans);
  background: var(--paper);
  color: var(--ink);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }

/* ===== 顶部导航 ===== */
.site-nav {
  position: fixed; top:0; left:0; right:0; z-index:100;
  background: rgba(26,26,26,.92);
  backdrop-filter: blur(8px);
  padding: 14px 6vw;
  display: flex; align-items: center; justify-content: space-between;
}
.site-nav .brand { color:#fff; font-family:var(--serif); font-weight:700; letter-spacing:2px; font-size:17px; }
.site-nav .brand span { color:var(--gold); }
.site-nav .nav-links a {
  color:#e8e2d5; font-size:14px; margin-left:26px; transition:color .2s;
}
.site-nav .nav-links a:hover { color:#ffd98e; }
.site-nav .nav-links a.active { color:var(--gold); }

/* ===== Hero 区 ===== */
.hero {
  position:relative;
  background: linear-gradient(150deg,#141414 0%, #262215 55%, #3a2f14 100%);
  color:#fff;
  padding: 130px 6vw 90px;
  overflow:hidden;
}
.hero::after {
  content:""; position:absolute; right:-120px; top:-120px;
  width:420px; height:420px; border-radius:50%;
  background: radial-gradient(circle, rgba(184,134,11,.28) 0%, transparent 70%);
}
.hero .kicker {
  color:#ffd98e; letter-spacing:6px; font-size:13px; font-weight:700;
  text-transform:uppercase;
}
.hero h1 {
  font-family:var(--serif); font-size: clamp(32px, 5vw, 56px);
  font-weight:700; margin:18px 0 14px; letter-spacing:2px;
}
.hero .sub { font-size: clamp(15px,2vw,19px); color:#f5f2ea; max-width:760px; line-height:1.9; text-shadow:0 1px 3px rgba(0,0,0,.4); }
.hero .policy-tag {
  display:inline-block; margin-top:26px; padding:12px 22px;
  border:1.5px solid #ffd98e; border-radius:999px;
  color:#fff; font-size:14px; letter-spacing:1px; font-weight:600;
  background: rgba(212,175,55,.2);
  box-shadow:0 0 24px rgba(212,175,55,.25);
}
.hero .scroll-hint { margin-top:44px; color:#d8d0be; font-size:13px; letter-spacing:3px; }

/* ===== 通用区块 ===== */
.section { padding: 76px 6vw; }
.section-head { text-align:center; margin-bottom:48px; }
.section-head .kicker { color:var(--gold-deep); letter-spacing:5px; font-size:13px; font-weight:700; }
.section-head h2 { font-family:var(--serif); font-size:clamp(26px,3.4vw,38px); margin-top:10px; }
.section-head p { color:#3d3d4a; margin-top:12px; max-width:680px; margin-left:auto; margin-right:auto; }

/* ===== 课程卡片墙 ===== */
.course-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:26px; max-width:1200px; margin:0 auto;
}
.course-card {
  background:#fff; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); transition:transform .25s, box-shadow .25s;
  display:flex; flex-direction:column;
}
.course-card:hover { transform:translateY(-6px); box-shadow:0 16px 40px rgba(26,26,26,.14); }
.course-card .card-top {
  height:170px; position:relative; display:flex; align-items:center; justify-content:center;
}
.course-card .card-top .icon { font-size:56px; }
.course-card .card-tag {
  position:absolute; top:14px; left:14px; padding:4px 10px; border-radius:999px;
  font-size:12px; color:#fff; background:rgba(0,0,0,.35); letter-spacing:1px;
}
.course-card .card-body { padding:22px 24px 24px; flex:1; display:flex; flex-direction:column; }
.course-card .card-body h3 { font-family:var(--serif); font-size:22px; margin-bottom:8px; }
.course-card .card-body .question { color:var(--gold-deep); font-size:14px; font-weight:600; margin-bottom:10px; }
.course-card .card-body p { font-size:14px; color:var(--ink-soft); flex:1; }
.course-card .card-meta { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.course-card .chip {
  font-size:12px; padding:3px 10px; border-radius:999px;
  background:var(--gold-light); color:var(--gold-deep);
}
.course-card .btn {
  display:inline-block; text-align:center; padding:10px 0; border-radius:8px;
  background:var(--ink); color:#fff; font-size:14px; transition:background .2s;
}
.course-card .btn:hover { background:var(--gold); }

/* 卡片配色 */
.card-crystal .card-top { background:linear-gradient(135deg,#7fd4e0,#2f6f8f); }
.card-kiln    .card-top { background:linear-gradient(135deg,#c96f4a,#7a3b1e); }
.card-bronze  .card-top { background:linear-gradient(135deg,#5d7a5a,#2e4633); }
.card-strata  .card-top { background:linear-gradient(135deg,#b0905a,#6b5330); }
.card-lake    .card-top { background:linear-gradient(135deg,#5aa7c9,#1f5a7a); }
.card-ai      .card-top { background:linear-gradient(135deg,#6a5acd,#33256b); }

/* ===== 流程时间轴 ===== */
.timeline { max-width:860px; margin:0 auto; }
.timeline .step {
  display:flex; gap:22px; padding:22px 0; border-bottom:1px dashed #d8cdb8;
}
.timeline .step:last-child { border-bottom:none; }
.timeline .num {
  flex-shrink:0; width:46px; height:46px; border-radius:50%;
  background:var(--ink); color:var(--gold-light); font-family:var(--serif);
  display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700;
}
.timeline .step h4 { font-family:var(--serif); font-size:18px; }
.timeline .step p { font-size:14px; color:var(--ink-soft); margin-top:4px; }

/* ===== 政策背书 ===== */
.policy-band {
  background:var(--ink); color:#e8e2d5; padding:70px 6vw;
}
.policy-band h2 { font-family:var(--serif); color:#fff; font-size:clamp(24px,3vw,32px); margin-bottom:24px; }
.policy-band blockquote {
  border-left:3px solid var(--gold); padding:6px 0 6px 22px;
  color:#cfc9bd; font-size:15px; max-width:820px; margin-bottom:14px;
}
.policy-band .cite { color:#8d8572; font-size:13px; }

/* ===== 双轨模式 ===== */
.dual-track { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:26px; max-width:1000px; margin:0 auto; }
.dual-track .track { background:#fff; border-radius:var(--radius); padding:28px; box-shadow:var(--shadow); border-top:4px solid var(--gold); }
.dual-track .track h3 { font-family:var(--serif); font-size:20px; margin-bottom:10px; }
.dual-track .track p { font-size:14px; color:var(--ink-soft); }

/* ===== CTA ===== */
.cta {
  text-align:center; padding:80px 6vw;
  background:linear-gradient(150deg,#262215,#141414);
  color:#fff;
}
.cta h2 { font-family:var(--serif); font-size:clamp(26px,3.4vw,38px); }
.cta p { color:#d8d0be; margin:14px auto 30px; max-width:560px; }
.cta .btn-big {
  display:inline-block; padding:14px 44px; border-radius:999px;
  background:var(--gold); color:#fff; font-size:16px; letter-spacing:2px; font-weight:600;
  transition:background .2s;
}
.cta .btn-big:hover { background:var(--gold-deep); }
.cta .tel { margin-top:18px; color:#8d8572; font-size:14px; }

/* ===== 页脚 ===== */
.site-footer {
  background:#101010; color:#8d8572; padding:34px 6vw; font-size:13px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
}
.site-footer a { color:#cfc9bd; margin-left:18px; }

/* ===== 详情页 ===== */
.detail-hero { padding:120px 6vw 60px; color:#fff; }
.detail-hero .back { color:#cfc9bd; font-size:13px; display:inline-block; margin-bottom:26px; }
.detail-hero .back:hover { color:var(--gold); }
.detail-hero h1 { font-family:var(--serif); font-size:clamp(30px,4.5vw,48px); margin:14px 0; }
.detail-hero .q { color:#ffc94d; font-size:clamp(15px,2vw,19px); font-weight:700; }
.detail-hero .tags { margin-top:20px; display:flex; flex-wrap:wrap; gap:10px; }
.detail-hero .tag {
  padding:6px 16px; border-radius:999px; border:1px solid rgba(255,255,255,.35);
  font-size:13px; color:#fff; background:rgba(255,255,255,.12);
}
.detail-body { max-width:960px; margin:0 auto; padding:60px 6vw 30px; }
.detail-body h2 {
  font-family:var(--serif); font-size:24px; margin:44px 0 18px;
  padding-left:14px; border-left:4px solid var(--gold);
}
.detail-body h3 { font-family:var(--serif); font-size:18px; margin:22px 0 10px; }
.detail-body p, .detail-body li { font-size:15px; color:var(--ink-soft); line-height:1.8; }
.detail-body p { margin-bottom:12px; }
.detail-body ul, .detail-body ol { padding-left:22px; margin:10px 0; }
.detail-body li { margin:6px 0; }
.info-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px; margin:24px 0; }
.info-grid .info { background:#fff; border-radius:10px; padding:16px; text-align:center; box-shadow:var(--shadow); }
.info-grid .info .v { font-family:var(--serif); font-size:20px; font-weight:700; color:var(--gold-deep); }
.info-grid .info .k { font-size:14px; color:#1a1a2e; margin-top:4px; }
.experiment-box {
  background:#fff; border-radius:var(--radius); padding:24px; box-shadow:var(--shadow);
  border-left:4px solid var(--gold); margin:18px 0;
}
.experiment-box h4 { font-family:var(--serif); font-size:16px; margin-bottom:8px; }
.experiment-box p { font-size:14px; }
.branch-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; margin:20px 0; }
.branch { background:#fff; border-radius:10px; padding:20px; box-shadow:var(--shadow); }
.branch .icon { font-size:30px; }
.branch h4 { font-family:var(--serif); margin:8px 0 6px; }
.branch p { font-size:13px; color:var(--ink-soft); }
.edu-table { width:100%; border-collapse:collapse; margin:18px 0; font-size:14px; background:#fff; border-radius:10px; overflow:hidden; box-shadow:var(--shadow); }
.edu-table th { background:var(--ink); color:var(--gold-light); padding:12px 14px; text-align:left; font-weight:600; }
.edu-table td { padding:10px 14px; border-top:1px solid #efe8da; color:var(--ink-soft); }
.detail-cta { text-align:center; padding:60px 6vw; }
.detail-cta .btn-big { display:inline-block; padding:14px 44px; border-radius:999px; background:var(--gold); color:#fff; font-size:16px; letter-spacing:2px; }
.detail-cta .btn-big:hover { background:var(--gold-deep); }
.note { font-size:13px; color:#8d8572; margin-top:30px; }

/* ===== 响应式 ===== */
@media (max-width: 720px) {
  .site-nav { padding: 12px 5vw; }
  .site-nav .nav-links a { margin-left:14px; font-size:13px; display:none; }
  .site-nav .nav-links a:first-child, .site-nav .nav-links a:last-child { display:inline; }
  .site-nav .brand { font-size:16px; }
  .hero { padding:110px 6vw 70px; }
  .hero .policy-tag { padding: 12px 20px; font-size:13px; line-height:1.6; }
  .section { padding:56px 6vw; }
  .course-grid { grid-template-columns:1fr; }
  .detail-body { padding: 40px 6vw 30px; }
  .policy-band { padding: 56px 6vw; }
  .cta { padding: 60px 6vw; }
  .site-footer { padding: 30px 6vw; }
}

/* ===== 超宽屏适配（1600px+）===== */
@media (min-width: 1600px) {
  .site-nav { padding: 16px 3vw; }
  .hero { padding: 170px 4vw 110px; }
  .hero h1 { font-size: clamp(44px,4vw,72px); }
  .hero .sub { max-width: 980px; }
  .section { padding: 100px 4vw; }
  .section-head h2 { font-size: clamp(32px,3vw,44px); }
  .course-grid { max-width: 1520px; gap: 34px; }
  .course-card .card-top { height: 220px; }
  .course-card .card-top .icon { font-size: 76px; }
  .course-card .card-body { padding: 28px 30px 30px; }
  .timeline { max-width: 1020px; }
  .detail-body { max-width: 1260px; }
  .policy-band, .cta { padding: 90px 4vw; }
}
@media (min-width: 2400px) {
  .site-nav { padding: 16px 2.5vw; }
  .hero { padding: 190px 4vw 120px; }
  .hero h1 { font-size: clamp(48px,4vw,84px); }
  .hero .sub { max-width: 1250px; font-size: 22px; }
  .section { padding: 110px 4vw; }
  .section-head h2 { font-size: clamp(34px,3vw,48px); }
  .section-head p { max-width: 950px; font-size: 19px; }
  .course-grid { max-width: 2050px; gap: 42px; }
  .course-card .card-top { height: 250px; }
  .course-card .card-top .icon { font-size: 84px; }
  .course-card .card-body h3 { font-size: 26px; }
  .course-card .card-body p { font-size: 16px; }
  .timeline { max-width: 1450px; }
  .dual-track { max-width: 1450px; }
  .detail-body { max-width: 1650px; }
  .policy-band { padding: 110px 4vw; }
  .policy-band blockquote { font-size: 18px; max-width: 1100px; }
  .cta { padding: 110px 4vw; }
}
@media (min-width: 1024px) {
  .site-nav { padding: 16px 4vw; }
  .site-nav .nav-links a { font-size:15px; margin-left:34px; }
  .hero {
    padding: 150px 4vw 100px;
    display:flex; flex-direction:column; align-items:center; text-align:center;
  }
  .hero h1 { max-width:1000px; font-size: clamp(40px,4.5vw,64px); }
  .hero .sub { max-width:860px; font-size:18px; }
  .hero .policy-tag { font-size:15px; }
  .section { padding: 90px 4vw; }
  .section-head h2 { font-size: clamp(30px,3vw,40px); }
  .course-grid { max-width:1320px; grid-template-columns:repeat(3,1fr); gap:30px; }
  .course-card .card-top { height:200px; }
  .course-card .card-top .icon { font-size:68px; }
  .course-card .card-body { padding:26px 28px 28px; }
  .timeline { max-width:900px; }
  .dual-track { max-width:1100px; }
  .detail-body { max-width:1120px; padding: 70px 4vw 40px; }
  .detail-hero .q { font-size:26px; font-weight:700; color:#ffc94d; }
  .detail-hero .tags { gap:14px; }
  .detail-hero .tag { padding:8px 20px; font-size:14px; }
  .info-grid { grid-template-columns:repeat(4,1fr); gap:22px; }
  .info { padding:22px 18px; }
  .info .v { font-size:26px; }
  .info .k { font-size:13px; color:#3a3a4a; }
  .branch-grid { grid-template-columns:repeat(3,1fr); }
  .edu-table { font-size:15px; }
  .detail-body p, .detail-body li { font-size:16px; color:#3a3a4a; }
  .policy-band blockquote { font-size:16px; }
}

/* ===== 体验课入口横幅 ===== */
.camp-band {
  background:linear-gradient(135deg,#3a2f14,#262215);
  color:#fff; text-align:center; padding:64px 6vw;
}
.camp-band h2 {
  font-family:var(--serif); font-size:clamp(24px,3vw,34px);
  color:var(--gold-light); margin-bottom:14px; letter-spacing:1px;
}
.camp-band p { color:#d8d0be; max-width:640px; margin:0 auto 28px; font-size:15px; }

/* ===== 体验课班次列表 ===== */
.class-list { list-style:none; padding:0; margin-top:4px; }
.class-list li {
  padding:11px 0; border-bottom:1px dashed #e6ddc8;
  font-size:14px; color:var(--ink-soft); line-height:1.6;
}
.class-list li:last-child { border-bottom:none; }
.class-list li strong { color:var(--ink); font-family:var(--serif); }