.course-detail-body { background: var(--paper); }
.course-back { width: min(1040px, calc(100vw - 48px)); margin: 30px auto 14px; }
.course-back a { color: var(--green); font-size: 13px; font-weight: 700; text-decoration: none; }
.course-back a:hover { text-decoration: underline; }
.course-page { width: min(1040px, calc(100vw - 48px)); margin: 0 auto 84px; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
.course-hero { padding: 58px 64px 50px; color: #fff; background: var(--green); }
.course-hero .hero-top { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 14px; }
.course-hero .eyebrow, .course-hero .brand { margin: 0; color: rgba(255,255,255,.78); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.course-hero .brand { letter-spacing: .08em; }
.course-hero h1 { max-width: none; margin: 0; font-size: clamp(34px, 5vw, 52px); letter-spacing: -.03em; }
.course-hero .subtitle { max-width: 820px; margin: 18px 0 0; color: rgba(255,255,255,.86); font-size: 16px; }
.summary-strip { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); background: var(--line); gap: 1px; }
.summary-item { min-width: 0; padding: 20px 22px; background: #fff; }
.summary-item small { display: block; color: var(--muted); font-size: 11px; }
.summary-item strong { display: block; margin-top: 5px; color: var(--ink); font-size: 15px; overflow-wrap: anywhere; }
.course-main { padding: 56px 64px 64px; }
.course-main section + section { margin-top: 62px; }
.course-main h2 { margin: 0 0 24px; color: var(--ink); font-size: 29px; }
.course-main h3 { margin: 0; font-size: 18px; }
.course-main p { margin: 8px 0; }
.lead { margin: 0 0 18px !important; padding: 18px 20px; border-left: 3px solid var(--green); color: #53616c; background: var(--green-soft); font-size: 14px; }
.three-lines { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.line-card { padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: var(--warm); }
.line-card .number { color: var(--green); font-size: 11px; font-weight: 800; letter-spacing: .11em; }
.line-card h3 { margin: 10px 0 8px; }
.line-card p { color: var(--muted); font-size: 13px; }
.rhythm { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.rhythm div { padding: 15px 10px; border: 1px solid var(--line); border-radius: 10px; background: #fff; text-align: center; font-size: 13px; font-weight: 800; }
.rhythm span { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; font-weight: 400; }
.vocabulary-rhythm { grid-template-columns: repeat(3, 1fr); }
.foundation-rhythm { grid-template-columns: repeat(3, 1fr); }
.note { padding: 12px 15px; border-radius: 9px; color: #6b5837; background: #f6ead8; font-size: 12px; }
.block { margin-top: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; }
.block-title { padding: 15px 18px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); background: var(--warm); }
.block-title h3 { color: var(--green-deep); }
.block-title span { color: var(--muted); font-size: 12px; }
.course-main table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.course-main th, .course-main td { padding: 14px 13px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); vertical-align: top; text-align: left; overflow-wrap: anywhere; }
.course-main th:last-child, .course-main td:last-child { border-right: 0; }
.course-main tbody tr:last-child td { border-bottom: 0; }
.course-main th { color: #53616c; background: #fbfcfb; font-size: 12px; }
.course-main td { font-size: 13px; }
.col-no { width: 68px; }
.col-type { width: 80px; }
.col-main { width: 42%; }
.badge { display: inline-flex; padding: 3px 8px; border-radius: 999px; font-size: 10px; font-weight: 800; white-space: nowrap; }
.badge.new { color: #315c49; background: #e5eee8; }
.badge.fusion { color: #66558c; background: #f0ebf8; }
.badge.review { color: #8a6025; background: #f6ead8; }
.badge.school { color: #53616c; background: #eef1f2; }
.outcomes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.outcome-card { padding: 24px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.outcome-card h3 { color: var(--green-deep); }
.outcome-card ul { margin: 14px 0 0; padding-left: 20px; }
.outcome-card li { margin: 7px 0; color: #53616c; font-size: 13px; }
.footer { padding: 22px 64px; border-top: 1px solid var(--line); color: var(--muted); background: var(--warm); font-size: 11px; }
.detail-contact { margin-bottom: 82px; }
@media (max-width: 820px) {
  .course-hero { padding: 46px 38px 40px; }
  .course-main { padding: 44px 38px 52px; }
  .summary-strip { grid-template-columns: repeat(2, 1fr); }
  .three-lines { grid-template-columns: 1fr; }
  .rhythm { grid-template-columns: repeat(2, 1fr); }
  .vocabulary-rhythm { grid-template-columns: repeat(3, 1fr); }
  .foundation-rhythm { grid-template-columns: repeat(3, 1fr); }
  .footer { padding: 20px 38px; }
}
@media (max-width: 640px) {
  .course-back { width: calc(100vw - 28px); margin-top: 22px; }
  .course-page { width: 100%; margin-bottom: 58px; border-left: 0; border-right: 0; border-radius: 0; }
  .course-hero { padding: 42px 20px 38px; }
  .course-hero .hero-top { align-items: start; flex-direction: column; gap: 5px; }
  .course-hero .subtitle { font-size: 14px; }
  .summary-item { padding: 16px 14px; }
  .summary-item strong { font-size: 13px; }
  .course-main { padding: 42px 14px 50px; }
  .course-main section + section { margin-top: 52px; }
  .course-main h2 { margin-left: 6px; font-size: 25px; }
  .lead { margin-left: 6px !important; margin-right: 6px !important; }
  .three-lines { padding: 0 6px; }
  .rhythm { padding: 0 6px; grid-template-columns: 1fr 1fr; }
  .vocabulary-rhythm { grid-template-columns: 1fr 1fr; }
  .foundation-rhythm { grid-template-columns: 1fr 1fr; }
  .block { margin: 16px 0 0; overflow: visible; border: 0; border-radius: 0; }
  .block-title { margin: 0 6px 10px; padding: 0 0 11px; align-items: start; flex-direction: column; gap: 3px; border-bottom: 1px solid var(--line); background: transparent; }
  .course-main table, .course-main tbody, .course-main tr, .course-main td { display: block; width: 100%; }
  .course-main thead { display: none; }
  .course-main tbody { display: grid; gap: 10px; }
  .course-main tr { padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
  .course-main td { padding: 7px 0; display: grid; grid-template-columns: 64px 1fr; gap: 10px; border: 0; font-size: 13px; }
  .course-main td::before { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
  .course-main td:nth-child(1)::before { content: "课次"; }
  .course-main td:nth-child(2)::before { content: "类型"; }
  .course-main td:nth-child(3)::before { content: "课程主线"; }
  .course-main td:nth-child(4)::before { content: "本课目标"; }
  .outcomes { grid-template-columns: 1fr; padding: 0 6px; }
  .footer { padding: 20px; }
  .detail-contact { margin-bottom: 56px; }
}