/* 郴州六中 · 物理可视化实验室 — 统一 UI 设计系统 */
:root{
  --c-brand:#1E63C8; --c-brand-2:#2E7BE0; --c-brand-d:#15468F;
  --c-ink:#1F2A44; --c-muted:#5B6B86; --c-bg:#EEF3FB; --c-card:#FFFFFF; --c-line:#E2E9F3;
  --r:16px; --r-sm:10px;
  --sh:0 6px 24px rgba(30,99,200,.10); --sh-h:0 14px 34px rgba(30,99,200,.20);
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;
  --cat-mech:#2E7BE0; --cat-wave:#0EA5A4; --cat-em:#E0852E; --cat-opt:#8B5CF6;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:"Microsoft YaHei","PingFang SC","Segoe UI",system-ui,sans-serif;background:var(--c-bg);color:var(--c-ink);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}

/* 页眉 */
.edu-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:0 var(--s4);height:62px;background:linear-gradient(90deg,var(--c-brand-d),var(--c-brand));color:#fff;box-shadow:0 2px 12px rgba(21,70,143,.25)}
.edu-brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:.5px}
.edu-logo{width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:16px}
.edu-nav{display:flex;gap:6px}
.edu-nav a{padding:8px 14px;border-radius:999px;font-size:14px;font-weight:600;opacity:.85;transition:.2s}
.edu-nav a:hover{opacity:1;background:rgba(255,255,255,.14)}
.edu-nav a.is-active{opacity:1;background:rgba(255,255,255,.22)}

/* 容器 */
.edu-wrap{max-width:1180px;margin:0 auto;padding:var(--s5) var(--s4) var(--s4)}
.edu-hero{text-align:center;margin-bottom:var(--s4)}
.edu-hero h1{font-size:34px;margin:0 0 var(--s2);background:linear-gradient(90deg,var(--c-brand),var(--c-brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.edu-hero p{color:var(--c-muted);font-size:16px;margin:0 auto;max-width:700px}

/* 分类图例 */
.edu-legend{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:var(--s3)}
.edu-legend span{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--c-muted)}
.edu-dot{width:10px;height:10px;border-radius:50%}

/* 分区标题 */
.edu-sec{margin:var(--s5) 0 var(--s3)}
.edu-sec h2{font-size:20px;margin:0 0 var(--s3);display:flex;align-items:center;gap:10px}
.edu-sec h2::before{content:"";width:5px;height:20px;border-radius:3px;background:var(--c-brand)}
.edu-sec h2 .sec-more{margin-left:auto;font-size:13px;font-weight:600;color:var(--c-brand);opacity:.85;transition:.2s}
.edu-sec h2 .sec-more:hover{opacity:1;text-decoration:underline}

/* 面包屑 / 返回 */
.edu-crumb{max-width:1180px;margin:0 auto;padding:var(--s3) var(--s4) 0;font-size:13px;color:var(--c-muted)}
.edu-crumb a{color:var(--c-brand);font-weight:600}
.edu-crumb a:hover{text-decoration:underline}

/* 章节页 hero 领域色标 */
.edu-chip{display:inline-block;font-size:13px;font-weight:700;color:#fff;padding:4px 14px;border-radius:999px;margin-bottom:var(--s2)}
.edu-hero .edu-chip+h1{margin-top:0}

/* 知识导读卡 */
.edu-kp{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s3);margin-top:var(--s4);text-align:left}
.edu-kp .kp{background:var(--c-card);border:1px solid var(--c-line);border-left:4px solid var(--c-brand);border-radius:var(--r-sm);padding:var(--s3);box-shadow:var(--sh)}
.edu-kp .kp b{display:block;color:var(--c-ink);font-size:15px;margin-bottom:6px}
.edu-kp .kp p{margin:0;color:var(--c-muted);font-size:13.5px}
.edu-kp .kp .fml{display:inline-block;margin-top:8px;font-family:"Cambria Math",Georgia,serif;font-style:italic;background:var(--c-bg);color:var(--c-brand-d);padding:2px 10px;border-radius:6px;font-size:14px}

/* 卡片网格 */
.edu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s3)}
.edu-card{position:relative;display:flex;flex-direction:column;gap:8px;background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--r);padding:var(--s3);box-shadow:var(--sh);transition:transform .18s,box-shadow .18s,border-color .18s}
.edu-card:hover{transform:translateY(-4px);box-shadow:var(--sh-h);border-color:var(--c-brand-2)}
.edu-card .edu-tag{display:inline-block;align-self:flex-start;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;color:#fff}
.edu-card h3{margin:4px 0 0;font-size:17px}
.edu-card p{margin:0;color:var(--c-muted);font-size:14px}
.edu-card .edu-go{margin-top:auto;font-size:13px;font-weight:700;color:var(--c-brand)}
.edu-card:hover .edu-go{text-decoration:underline}
a.edu-card:focus-visible{outline:3px solid var(--c-brand-2);outline-offset:2px}

/* 分类配色 */
.cat-mech{background:var(--cat-mech)} .edu-dot.mech{background:var(--cat-mech)}
.cat-wave{background:var(--cat-wave)} .edu-dot.wave{background:var(--cat-wave)}
.cat-em{background:var(--cat-em)}   .edu-dot.em{background:var(--cat-em)}
.cat-opt{background:var(--cat-opt)} .edu-dot.opt{background:var(--cat-opt)}

/* 按钮 */
.edu-btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(90deg,var(--c-brand),var(--c-brand-2));color:#fff;font-weight:700;padding:14px 28px;border-radius:999px;font-size:16px;box-shadow:var(--sh);transition:.2s}
.edu-btn:hover{transform:translateY(-2px);box-shadow:var(--sh-h)}

/* 功能区 */
.edu-feature{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s3);margin-top:var(--s4)}
.edu-feature .f{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--r);padding:var(--s3);box-shadow:var(--sh)}
.edu-feature .f b{color:var(--c-brand)}

/* 提示条 */
.edu-note{margin-top:var(--s4);padding:14px 18px;background:#FFF7E9;border:1px solid #F3D9A6;border-radius:var(--r-sm);color:#8a5a00;font-size:14px}

.edu-footer{text-align:center;color:var(--c-muted);font-size:13px;padding:var(--s4);margin-top:var(--s5)}

@media(max-width:640px){
  .edu-header{padding:10px var(--s3);height:auto;flex-direction:column;gap:6px}
  .edu-wrap{padding:var(--s4) var(--s3)}
  .edu-hero h1{font-size:26px}
}
