/* ============================================================
   YANEZ · 高考学生学业能力诊断报告系统
   视觉体系：编辑学术风（warm-black + deep-indigo）
   ============================================================ */

:root{
  /* 取自 YANEZ logo */
  --ink:#231815;            /* 主文本：暖黑 */
  --indigo:#070078;         /* 品牌靛蓝 */
  --indigo-soft:#E4E3F0;    /* 浅靛底 */
  --paper:#FAFAF7;          /* 暖白底纸 */
  --paper-2:#F3F1EB;        /* 稍深一档 */
  --rule:#231815;           /* 主线条颜色 */
  --rule-soft:#D9D5CC;      /* 浅分割线 */
  --muted:#6B6660;          /* 次要文本 */
  --muted-2:#9A938A;        /* 更次要 */
  --gold:#A8842B;           /* 强调（成绩、级别） */
  --green:#2F6B3A;          /* 通过 */
  --red:#9C2C30;            /* 未通过 / 红色警告 */

  --serif:"Noto Serif SC","Source Han Serif SC","Songti SC","SimSun",
          Georgia,"Times New Roman",serif;
  --sans:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",
         -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:ui-monospace,Menlo,Consolas,"Source Han Mono SC",monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--sans);
  font-weight:350;
  color:var(--ink);
  background:var(--paper);
  line-height:1.75;
  font-size:15.5px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4{
  font-family:var(--serif);
  color:var(--ink);
  line-height:1.25;
  font-weight:600;
  letter-spacing:.005em;
}
h1{font-size:2.4rem;font-weight:700;line-height:1.2;margin:0 0 .35em;letter-spacing:-.012em}
h2{
  font-size:1.5rem;font-weight:600;line-height:1.3;
  margin:2.4em 0 .8em;padding-top:1.6em;
  border-top:1px solid var(--rule);
}
h2:first-of-type{border-top:none;padding-top:0;margin-top:.6em}
h3{font-size:1.12rem;font-weight:600;margin:1.8em 0 .4em}
h4{font-size:.98rem;font-weight:600;margin:1.3em 0 .3em}
p{margin:.55em 0;font-weight:350}
b,strong{font-weight:600;color:var(--ink)}
em,i{font-style:italic}
a{color:var(--indigo);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s}
a:hover{border-bottom-color:var(--indigo)}
hr{border:none;border-top:1px solid var(--rule-soft);margin:2.4em 0}
small,.small{font-size:.82rem;color:var(--muted)}

.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
.wrap.narrow{max-width:840px}

/* ===== 顶栏 ===== */
.topbar{
  background:var(--paper);
  border-bottom:1px solid var(--ink);
  padding:22px 0 18px;
}
.topbar .inner{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:18px;color:var(--ink);text-decoration:none;border:none}
.brand:hover{border:none;color:var(--ink)}
.brand .logo{display:block;height:38px;width:auto}
.brand .meta{
  display:flex;flex-direction:column;gap:1px;line-height:1.2;
  padding-left:18px;border-left:1px solid var(--rule-soft);
}
.brand .meta .system{
  font-family:var(--serif);font-size:.96rem;font-weight:600;color:var(--ink);
  letter-spacing:.02em;
}
.brand .meta .sub{
  font-size:.7rem;color:var(--muted);letter-spacing:.18em;
  text-transform:uppercase;font-weight:500;
}
.topbar nav{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
.topbar nav a{
  color:var(--ink);font-size:.85rem;letter-spacing:.04em;
  border-bottom:1px solid transparent;padding-bottom:3px;
}
.topbar nav a:hover,.topbar nav a.active{border-bottom-color:var(--indigo);color:var(--indigo)}

/* ===== Hero ===== */
.hero{padding:64px 0 40px;border-bottom:1px solid var(--rule)}
.hero .eyebrow{
  font-family:var(--sans);font-size:.74rem;letter-spacing:.26em;
  color:var(--indigo);font-weight:600;margin-bottom:18px;text-transform:uppercase;
}
.hero h1{font-size:2.8rem;max-width:880px}
.hero .lead{
  font-family:var(--serif);font-size:1.18rem;max-width:760px;
  color:var(--ink);line-height:1.7;margin-top:14px;font-weight:400;
}
.hero .meta{
  margin-top:24px;display:flex;gap:36px;flex-wrap:wrap;
  font-size:.82rem;color:var(--muted);letter-spacing:.02em;
  padding-top:18px;border-top:1px solid var(--rule-soft);
}
.hero .meta b{color:var(--ink);font-weight:600;font-family:var(--serif);font-size:1.02rem;display:block}

/* ===== Section ===== */
.section{padding:36px 0 48px}
.section h2 .num{
  display:inline-block;font-family:var(--serif);color:var(--indigo);
  font-weight:600;font-size:.82em;letter-spacing:.04em;
  margin-right:.7em;padding-right:.6em;border-right:1px solid var(--rule-soft);
}
.section-intro{font-size:1.02rem;color:var(--ink);max-width:740px;line-height:1.7;margin:0 0 18px}

/* ===== 字段/清单卡 ===== */
.checklist{margin:18px 0 24px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.checklist .item{
  display:grid;grid-template-columns:60px 1fr 130px;gap:18px;align-items:start;
  padding:16px 4px;border-bottom:1px solid var(--rule-soft);
}
.checklist .item:last-child{border-bottom:none}
.checklist .item .mark{
  display:inline-block;font-family:var(--serif);font-weight:600;font-size:.78rem;
  letter-spacing:.18em;padding:3px 10px;border:1px solid var(--ink);text-align:center;
}
.checklist .item.required .mark{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.checklist .item.recommended .mark{background:var(--indigo);color:var(--paper);border-color:var(--indigo)}
.checklist .item.optional .mark{background:var(--paper);color:var(--ink);border-color:var(--muted)}
.checklist .item h4{margin:0 0 4px;font-size:1rem;font-weight:600}
.checklist .item p{margin:0;font-size:.9rem;color:var(--muted);line-height:1.55}
.checklist .item .scope{
  font-size:.78rem;color:var(--muted);letter-spacing:.04em;
  text-align:right;font-family:var(--serif);
}

/* ===== 表格 ===== */
.table-wrap{margin:18px 0 26px;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
table.data{
  border-collapse:collapse;width:100%;font-size:.9rem;
  font-variant-numeric:tabular-nums;
}
table.data thead th{
  text-align:left;font-weight:600;color:var(--ink);
  padding:11px 14px;border-bottom:1px solid var(--ink);
  font-size:.78rem;letter-spacing:.06em;
  font-family:var(--sans);background:transparent;
}
table.data tbody td{
  padding:10px 14px;border-bottom:1px solid var(--rule-soft);vertical-align:top;
}
table.data tbody tr:last-child td{border-bottom:none}
table.data tbody tr:hover{background:var(--paper-2)}
table.data td.num,table.data th.num{text-align:right}
table.data caption{
  caption-side:top;text-align:left;font-size:.78rem;color:var(--muted);
  padding:6px 0 10px;letter-spacing:.06em;
}

/* ===== 算法卡片网格 ===== */
.algo-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:0;
  margin:18px 0 26px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
}
.algo{
  padding:20px 22px;
  border-right:1px solid var(--rule-soft);border-bottom:1px solid var(--rule-soft);
}
.algo:nth-child(2n){border-right:none}
.algo:nth-last-child(-n+2){border-bottom:none}
.algo .tag{
  font-size:.68rem;letter-spacing:.18em;color:var(--indigo);
  font-weight:600;margin-bottom:6px;text-transform:uppercase;
}
.algo h4{margin:0 0 6px;font-size:1.02rem}
.algo p{margin:0;font-size:.88rem;color:var(--muted);line-height:1.55}

/* ===== 阶段 / 路径 ===== */
.phase-row{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  margin:22px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
}
.phase{padding:22px 24px;border-right:1px solid var(--rule-soft)}
.phase:last-child{border-right:none}
.phase .num{
  display:inline-block;font-family:var(--serif);font-style:italic;
  font-size:.78rem;letter-spacing:.16em;color:var(--indigo);
  font-weight:600;margin-bottom:8px;
}
.phase h4{margin:0 0 8px;font-size:1.06rem}
.phase .dur{font-size:.78rem;color:var(--muted);margin-bottom:10px;letter-spacing:.04em}
.phase ul{margin:0;padding-left:1.2em;font-size:.88rem;line-height:1.65}
.phase ul li{margin:3px 0;color:var(--muted)}

/* ===== Callout ===== */
.callout{
  border-left:2px solid var(--ink);background:var(--paper-2);
  padding:14px 18px;margin:18px 0;font-size:.93rem;
  color:var(--ink);font-weight:350;line-height:1.7;
}
.callout b{font-weight:600;color:var(--ink)}
.callout.indigo{border-left-color:var(--indigo);background:var(--indigo-soft)}
.callout.indigo b{color:var(--indigo)}

/* ===== 学科样张卡片 ===== */
.subject-grid{display:grid;gap:0;grid-template-columns:repeat(3,1fr);margin:22px 0 12px;
  border-top:1px solid var(--ink);border-left:1px solid var(--rule-soft)}
.subject{
  display:flex;flex-direction:column;justify-content:space-between;
  padding:24px 22px 20px;text-decoration:none;color:var(--ink);
  border-right:1px solid var(--rule-soft);border-bottom:1px solid var(--rule-soft);
  min-height:200px;background:var(--paper);transition:background .15s;
}
.subject:hover{background:var(--paper-2);border-color:var(--rule-soft);color:var(--ink)}
.subject .meta-line{
  font-family:var(--serif);font-style:italic;font-size:.78rem;
  color:var(--indigo);letter-spacing:.06em;margin-bottom:10px;
}
.subject h3{
  margin:0 0 8px;font-size:1.18rem;font-weight:600;font-family:var(--serif);
}
.subject p{margin:0;font-size:.86rem;color:var(--muted);line-height:1.55}
.subject .footer-row{
  display:flex;justify-content:space-between;align-items:center;
  margin-top:14px;padding-top:10px;border-top:1px solid var(--rule-soft);
  font-size:.74rem;letter-spacing:.06em;
}
.subject .footer-row .status{color:var(--muted)}
.subject .footer-row .status.ready{color:var(--green);font-weight:600}
.subject .footer-row .arrow{color:var(--indigo);font-weight:600}

/* ===== Q/A 块 ===== */
.qa p.q{
  font-family:var(--serif);font-weight:600;color:var(--ink);
  margin:1.2em 0 .3em;font-size:1.02rem;
}
.qa p.a{
  font-weight:350;color:var(--ink);margin:0 0 1em;padding-left:1.4em;
  border-left:2px solid var(--rule-soft);position:relative;line-height:1.7;
}
.qa p.a .a-label{
  display:inline-block;color:var(--indigo);font-weight:600;margin-right:.5em;
  font-family:var(--serif);
}

/* ===== 统计块 ===== */
.stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0;
  margin:20px 0 28px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
}
.stat{padding:18px 22px;border-right:1px solid var(--rule-soft)}
.stat:last-child{border-right:none}
.stat .v{
  font-family:var(--serif);font-size:2.1rem;color:var(--ink);
  font-weight:700;line-height:1.05;letter-spacing:-.01em;
}
.stat .v sub{font-size:.55em;color:var(--muted);font-weight:400;margin-left:.2em}
.stat .l{font-size:.78rem;letter-spacing:.06em;color:var(--muted);margin-top:6px}

/* ===== Footer ===== */
footer{
  background:var(--paper);border-top:1px solid var(--ink);
  padding:42px 0 36px;margin-top:64px;font-size:.82rem;color:var(--muted);
}
footer .inner{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start}
footer .brand{flex-direction:column;align-items:flex-start;gap:10px}
footer .brand .logo{height:32px}
footer .brand .meta{border-left:none;padding-left:0}
footer .colophon{max-width:540px;text-align:right;line-height:1.6}

.tag-pill{
  display:inline-block;font-family:var(--sans);font-size:.7rem;
  letter-spacing:.1em;padding:2px 9px;background:var(--ink);color:var(--paper);
}
.tag-pill.indigo{background:var(--indigo)}
.tag-pill.outline{background:var(--paper);color:var(--ink);border:1px solid var(--ink)}

ul.clean{padding-left:1.2em;margin:.5em 0}
ul.clean li{margin:5px 0}

/* ===== Responsive ===== */
@media(max-width:880px){
  .wrap{padding:0 20px}
  .hero h1{font-size:2.1rem}
  .subject-grid,.phase-row,.algo-grid{grid-template-columns:1fr}
  .subject{border-right:none;border-bottom:1px solid var(--rule-soft)}
  .phase{border-right:none;border-bottom:1px solid var(--rule-soft)}
  .algo{border-right:none;border-bottom:1px solid var(--rule-soft)}
  .algo:nth-last-child(-n+2){border-bottom:1px solid var(--rule-soft)}
  .algo:last-child{border-bottom:none}
}