/* ============================================
   0769zikao.cn 东莞自考网 公共样式
   教育蓝主题 · 响应式
   ============================================ */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Arial, sans-serif;
    font-size: 15px; line-height: 1.75; color: #333;
    background: #f2f5f9;
}
a { color: #1a5fb4; text-decoration: none; }
a:hover { color: #0d3f7d; }
img { max-width: 100%; vertical-align: middle; }
ul, ol { padding-left: 1.4em; }

/* ---- 顶栏 ---- */
.topbar { background: #0d3f7d; color: #cfddf2; font-size: 13px; }
.topbar .wrap { max-width: 1200px; margin: 0 auto; padding: 6px 16px; display: flex; justify-content: space-between; flex-wrap: wrap; }
.topbar a { color: #cfddf2; margin-right: 14px; }
.topbar a:hover { color: #fff; }

/* ---- 头部 ---- */
.header { background: #fff; border-bottom: 2px solid #1a5fb4; }
.header .wrap { max-width: 1200px; margin: 0 auto; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.logo { display: flex; align-items: center; }
.logo .logo-box {
    width: 52px; height: 52px; border-radius: 10px; background: linear-gradient(135deg, #1a5fb4, #2e86de);
    color: #fff; font-size: 22px; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-right: 12px; flex: none;
}
.logo h1 { font-size: 22px; color: #0d3f7d; line-height: 1.3; }
.logo h1 em { font-style: normal; color: #e8a33d; }
.logo p { font-size: 12px; color: #888; margin-top: 2px; }
/* ---- 导航 ---- */
.nav { background: #1a5fb4; }
.nav .wrap { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; }
.nav a {
    display: block; color: #fff; padding: 12px 22px; font-size: 15px; transition: background .2s;
}
.nav a:hover, .nav a.active { background: #0d3f7d; }

/* ---- 主体 ---- */
.main { max-width: 1200px; margin: 18px auto; padding: 0 16px; display: grid; grid-template-columns: 1fr 320px; gap: 18px; }
.main.no-side { grid-template-columns: 1fr; }
.content { min-width: 0; }
.sidebar { min-width: 0; }

/* ---- 首页 hero ---- */
.hero {
    background: linear-gradient(135deg, #0d3f7d 0%, #1a5fb4 55%, #2e86de 100%);
    border-radius: 12px; color: #fff; padding: 36px 30px; margin-bottom: 18px; position: relative; overflow: hidden;
}
.hero::after { content: ""; position: absolute; right: -60px; top: -60px; width: 240px; height: 240px; border-radius: 50%; background: rgba(255,255,255,.08); }
.hero h2 { font-size: 30px; margin-bottom: 12px; }
.hero h2 em { font-style: normal; color: #ffd77a; }
.hero p { max-width: 760px; font-size: 15px; color: #e2ebf8; margin-bottom: 20px; }
.hero-btns a {
    display: inline-block; background: #fff; color: #0d3f7d; padding: 10px 22px; border-radius: 6px; margin-right: 12px; font-weight: 600; font-size: 15px;
}
.hero-btns a.alt { background: rgba(255,255,255,.16); color: #fff; }
.hero-btns a:hover { background: #ffd77a; color: #0d3f7d; }
.hero-date { margin-top: 18px; font-size: 13px; color: #c6d7ee; }

/* ---- 面板 ---- */
.panel { background: #fff; border-radius: 10px; padding: 22px; margin-bottom: 18px; box-shadow: 0 1px 3px rgba(16,42,84,.06); }
.panel-title { font-size: 20px; color: #0d3f7d; margin-bottom: 16px; padding-left: 12px; border-left: 4px solid #2e86de; line-height: 1.3; }
.panel-title small { font-size: 13px; color: #999; font-weight: 400; margin-left: 8px; }

/* ---- 快捷入口 ---- */
.quick-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.quick-item {
    border: 1px solid #e4ebf3; border-radius: 10px; padding: 20px 14px; text-align: center; transition: all .2s; background: #fafcff;
}
.quick-item:hover { border-color: #2e86de; box-shadow: 0 4px 12px rgba(30,90,180,.12); transform: translateY(-2px); }
.quick-item .ico {
    width: 52px; height: 52px; margin: 0 auto 10px; border-radius: 50%; color: #fff; font-size: 24px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
}
.quick-item h3 { font-size: 16px; color: #0d3f7d; margin-bottom: 4px; }
.quick-item p { font-size: 12px; color: #888; }
.ico-1 { background: linear-gradient(135deg,#e2574c,#f08a5d); }
.ico-2 { background: linear-gradient(135deg,#1a5fb4,#2e86de); }
.ico-3 { background: linear-gradient(135deg,#0d8a5f,#2ec4a6); }
.ico-4 { background: linear-gradient(135deg,#b87333,#e8a33d); }

/* ---- 新闻列表 ---- */
.news-list li { list-style: none; padding: 12px 0; border-bottom: 1px dashed #e7edf4; }
.news-list li:last-child { border-bottom: none; }
.news-list a { display: flex; justify-content: space-between; align-items: center; }
.news-list .t { color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news-list a:hover .t { color: #1a5fb4; }
.news-list .d { font-size: 12px; color: #999; flex: none; margin-left: 12px; }
.news-list .tag { color: #e2574c; font-size: 12px; margin-right: 8px; flex: none; }

/* ---- 通用列表 ---- */
.art-list li { list-style: none; padding: 13px 0; border-bottom: 1px dashed #e7edf4; }
.art-list li:last-child { border-bottom: none; }
.art-list h3 { font-size: 17px; font-weight: 600; margin-bottom: 4px; }
.art-list h3 a { color: #333; }
.art-list h3 a:hover { color: #1a5fb4; }
.art-list p { font-size: 13px; color: #777; }
.art-list .meta { font-size: 12px; color: #999; margin-top: 4px; }

/* ---- 正文 ---- */
.article { background: #fff; border-radius: 10px; padding: 26px; box-shadow: 0 1px 3px rgba(16,42,84,.06); }
.article h1 { font-size: 24px; color: #0d3f7d; line-height: 1.4; margin-bottom: 8px; }
.article .meta { font-size: 13px; color: #999; padding-bottom: 14px; border-bottom: 1px solid #eef2f7; margin-bottom: 18px; }
.article h2 { font-size: 20px; color: #0d3f7d; margin: 26px 0 12px; padding-left: 12px; border-left: 4px solid #2e86de; }
.article h3 { font-size: 17px; color: #123b6d; margin: 20px 0 10px; }
.article p { margin-bottom: 12px; }
.article ul, .article ol { margin-bottom: 12px; }
.article table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 14px; }
.article table th, .article table td { border: 1px solid #dce5ef; padding: 9px 12px; text-align: left; }
.article table th { background: #eef4fb; color: #0d3f7d; }
.article .note {
    background: #fff8e8; border: 1px solid #f0dfb4; border-radius: 8px; padding: 12px 16px; font-size: 13px; color: #7a5b12; margin: 14px 0;
}
.article .tip {
    background: #eaf4ee; border: 1px solid #bfe0cb; border-radius: 8px; padding: 12px 16px; font-size: 13px; color: #1c6a3d; margin: 14px 0;
}
.article a.official { color: #e2574c; font-weight: 600; }

/* ---- 侧栏 ---- */
.side-panel { background: #fff; border-radius: 10px; padding: 18px; margin-bottom: 18px; box-shadow: 0 1px 3px rgba(16,42,84,.06); }
.side-title { font-size: 17px; color: #0d3f7d; margin-bottom: 12px; padding-left: 10px; border-left: 4px solid #2e86de; }
.side-panel ul li { list-style: none; padding: 8px 0; border-bottom: 1px dashed #eef2f7; font-size: 14px; }
.side-panel ul li:last-child { border-bottom: none; }
.side-info { font-size: 13px; color: #555; }
.side-info p { margin-bottom: 8px; }
.side-info b { color: #0d3f7d; }

/* ---- 页脚 ---- */
.footer { background: #12365f; color: #a9c0dd; margin-top: 30px; }
.footer .wrap { max-width: 1200px; margin: 0 auto; padding: 26px 16px 20px; }
.footer-links { margin-bottom: 12px; font-size: 13px; }
.footer-links a { color: #c5d7ee; margin-right: 14px; }
.footer-links a:hover { color: #fff; }

/* 友情链接 */
.friend-links { margin-bottom: 14px; font-size: 13px; line-height: 2; color: #a9c0dd; }
.friend-links .fl-title { color: #e6eef9; font-weight: 600; }
.friend-links a { color: #8fb0d6; margin: 0 4px; }
.friend-links a:hover { color: #fff; }
.friend-links .fl-sep { color: #5d7ba5; }
.footer p { font-size: 12px; line-height: 1.9; }
.footer .beian a { color: #8fb0d6; }

/* ---- 面包屑 ---- */
.crumbs { font-size: 13px; color: #888; margin-bottom: 14px; }
.crumbs a { color: #1a5fb4; }

/* ---- 按钮 ---- */
.btn { display: inline-block; background: #1a5fb4; color: #fff; padding: 9px 22px; border-radius: 6px; font-size: 14px; }
.btn:hover { background: #0d3f7d; color: #fff; }
.btn.orange { background: #e2574c; }
.btn.orange:hover { background: #c23e33; }

/* ---- 特色条 ---- */
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.feature { background: #fafcff; border: 1px solid #e4ebf3; border-radius: 10px; padding: 16px; }
.feature h3 { font-size: 15px; color: #0d3f7d; margin-bottom: 6px; }
.feature p { font-size: 13px; color: #666; }

/* ---- 分页 ---- */
.pager { margin: 20px 0; text-align: center; }
.pager a, .pager span { display: inline-block; padding: 6px 13px; margin: 0 3px; border: 1px solid #d9e2ec; border-radius: 5px; font-size: 13px; color: #333; background: #fff; }
.pager span.cur { background: #1a5fb4; color: #fff; border-color: #1a5fb4; }

/* ---- 表格卡片页 ---- */
.entry-card { background: #fff; border-radius: 10px; padding: 20px; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(16,42,84,.06); }
.entry-card h2 { font-size: 19px; color: #0d3f7d; margin-bottom: 10px; }
.entry-card h2 .no { color: #e2574c; margin-right: 6px; }

/* ---- 回到顶部 ---- */
#backTop {
    display: none; position: fixed; right: 26px; bottom: 40px; width: 42px; height: 42px; border-radius: 8px;
    background: #1a5fb4; color: #fff; font-size: 20px; border: none; cursor: pointer; z-index: 99; box-shadow: 0 3px 8px rgba(0,0,0,.18);
}
#backTop:hover { background: #0d3f7d; }

/* ---- 响应式 ---- */
@media (max-width: 900px) {
    .main { grid-template-columns: 1fr; }
    .quick-grid { grid-template-columns: repeat(2, 1fr); }
    .feature-grid { grid-template-columns: 1fr; }
    .nav a { padding: 10px 14px; font-size: 14px; }
    .hero { padding: 26px 20px; }
    .hero h2 { font-size: 22px; }
    .logo h1 { font-size: 18px; }
}
@media (max-width: 560px) {
    .quick-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .article { padding: 18px; }
    .article h1 { font-size: 20px; }
    .article table { font-size: 12px; }
}
