/* ==========================================================================
   马克思主义学院（/SZJYB/）首页 · 视觉改版补丁 v3
   日期：2026-10-24
   用法：整段复制，粘贴到 SSCMS 首页模板 head 区的 style 块中
        （放在现有「菜单上移优化」那段 style 之后即可）。
   原则：只做首页范围内的覆盖，不改动 main.css / moblie.css 等共享文件。
   模块化：每一节（0~14）相互独立，哪节效果不想要，整节删掉即可，互不影响。
   v3 变更：收敛全局规则——不再改全局字体/链接色；标题栏只隐藏装饰小图，
           不再隐藏标题内所有图片；链接样式只作用于内容卡片内部。
   ========================================================================== */

:root{
  --brand:#b70e17;          /* 主色：沿用站点红 */
  --brand-2:#8d0a11;        /* 主色深一档，用于 hover */
  --ink:#1f2328;            /* 正文墨色 */
  --ink-2:#626b78;          /* 次要文字 */
  --line:#e8eaed;           /* 分隔线 */
  --bg:#f4f5f7;             /* 页面底 */
  --card:#ffffff;
  --radius:8px;
}

/* ---------- 0) 基础版式 ----------
   只改页面背景（白卡片需要灰底衬托）；字体/链接色不动全局，避免影响导航、banner、页脚 */
body{ background:var(--bg); }
/* 链接颜色只约束在文字内容卡片内部，不碰导航 / banner / 页脚 / 视频区（视频区是红底白字，不能继承墨色） */
.write-content a, .yaoxian-content a,
.importante-content a, .study-content a{ color:inherit; text-decoration:none; }
.write-content a:hover, .yaoxian-content a:hover,
.importante-content a:hover, .study-content a:hover{ color:var(--brand); }

/* ---------- 1) 顶部：logo 条与导航条 ---------- */
/* 导航条内改成 flex，右侧给搜索框留位（配合 首页_搜索入口.js 使用） */
@media (min-width: 768px){
  .header > .container > .nav{
    display:flex;
    align-items:center;
    gap:14px;
  }
  .header .nav ul.daohang{ flex:1 1 auto; }

  /* 抽屉关闭按钮（×）是移动端专用，桌面端必须隐藏，否则会挤在菜单最左边 */
  .header .nav .nav-close{ display:none !important; }

  /* 首屏轮播与文字列的底部留白收紧 */
  .xiaobanner{ margin-bottom:22px !important; }

  /* 导航项：字号与间距微调，hover 用浅底而非整条变色，更稳重 */
  .header .nav ul.daohang > li > a{
    font-size:15px;
    letter-spacing:.5px;
    transition:background .2s, color .2s;
  }
  .header .nav ul.daohang > li > a:hover,
  .header .nav ul.daohang > li.on > a{
    background:rgba(255,255,255,.14);
    color:#fff;
  }
}

/* ---------- 2) 顶部搜索框（DOM 由 首页_搜索入口.js 注入） ---------- */
.hd-search{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  height:30px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.35);
  border-radius:15px;
  padding:0 4px 0 12px;
  overflow:hidden;
}
.hd-search input[type=text]{
  width:132px;
  height:28px;
  line-height:28px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:13px;
  outline:none;
}
.hd-search input[type=text]::placeholder{ color:rgba(255,255,255,.75); }
.hd-search button{
  height:26px;
  padding:0 12px;
  margin:0;
  border:0;
  border-radius:13px;
  background:#fff;
  color:var(--brand);
  font-size:13px;
  cursor:pointer;
  transition:background .2s;
}
.hd-search button:hover{ background:#fde9ea; }
@media (max-width: 767px){ .hd-search{ display:none; } }

/* ---------- 3) 首屏 banner ---------- */
.hmSlides{
  margin:0 auto 22px;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
}
.hmSlides .owl-carousel{ width:100%; max-width:100%; }
.hmSlides .owl-carousel .owl-stage-outer{ overflow:hidden; }
.hmSlides .owl-carousel .item img{ width:100%; max-width:100%; height:auto; display:block; }

/* ---------- 4) 内容区块：统一白卡片 ---------- */
.write-content.index-content,
.yaoxian-content.index-content,
.importante-content.index-content,
.study-content,
.video-content.index-content{
  background:transparent;
}
.write-content.index-content > .container,
.yaoxian-content.index-content > .container,
.importante-content.index-content > .container,
.study-content > .container,
.video-content.index-content > .container{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:20px 26px 24px;
  margin-bottom:22px;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
}

/* ---------- 5) 区块标题栏 ----------
   原样式：h3 居中 36px，左右各有花纹装饰图（::before/::after，absolute 定位）；
   .more 是 absolute + 背景图箭头。这里全部改写成「左对齐 + 红竖条 + 胶囊按钮」。 */
.index-title{
  border-bottom:1px solid var(--line);
  padding:0 0 12px !important;
  margin:0 0 16px !important;
  position:relative;
}
.index-title.index-title4{ margin:0 0 16px !important; }
.index-title h3{
  margin:0 !important;
  padding:0 !important;
  font-size:20px !important;
  font-weight:700 !important;
  line-height:1.3 !important;
  text-align:left !important;
  color:var(--ink);
  background:none !important;
  display:flex;
  align-items:center;
  gap:10px;
}
/* 左侧红色竖条（覆盖原来的花纹图，必须把 absolute 改回 static） */
.index-title h3::before{
  content:"" !important;
  position:static !important;
  width:4px !important;
  height:18px !important;
  background:var(--brand) !important;
  border-radius:2px;
  display:inline-block !important;
  left:auto !important;
  bottom:auto !important;
  right:auto !important;
}
/* 右侧花纹装饰去掉 */
.index-title h3::after{ display:none !important; content:none !important; }
.index-title h3 span{ color:var(--brand); }
/* 只隐藏标题栏的装饰小图 index-title-left2.png，不误伤标题里可能出现的其他图片 */
.index-title img.index-title-left2{ display:none !important; }
/* 「更多」：从绝对定位的花纹按钮改成胶囊按钮，垂直居中 */
.index-title .more{
  position:absolute !important;
  right:0 !important;
  top:50% !important;
  transform:translateY(-50%);
  float:none !important;
  margin:0 !important;
  padding:4px 14px !important;
  border:1px solid var(--line) !important;
  border-radius:14px !important;
  background:none !important;
  background-image:none !important;
  font-size:13px !important;
  line-height:1.4 !important;
  color:var(--ink-2) !important;
  transition:all .2s;
}
.index-title.index-title2 .more,
.index-title.index-title1 .more{ color:var(--ink-2) !important; }
.index-title .more:hover{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
}

/* ---------- 6) 新闻列表（右侧 5 列） ----------
   原样式：li 左侧有 banner-list.png 小箭头，首条 a 的 .media-heading 是红底图片条（白字 63px 高）。
   这里改：清掉小箭头（改用序号），首条变浅灰摘要卡片。 */
.news-text{ margin-bottom:0 !important; }
.news-text ul,
.dynamic-text ul,
.notice-text ul,
.importante-text ul,
.study ul{
  list-style:none;
  margin:0;
  padding:0;
}
.news-text ul li{
  background:none !important;
  padding-left:0 !important;
  border-bottom:1px dashed var(--line);
}
.news-text ul li:last-child{ border-bottom:0; }
.news-text ul li a{
  display:block;
  padding:10px 0;
  font-size:14px;
  height:auto !important;
  line-height:1.6 !important;
  color:var(--ink);
  transition:padding .2s, color .2s;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.news-text ul li a:hover{ color:var(--brand); padding-left:6px; }

/* 首条做成摘要卡片 */
.news-text ul li:first-child{
  border-bottom:1px solid var(--line) !important;
  margin-top:0 !important;
  padding-bottom:12px;
  margin-bottom:6px;
}
.news-text ul li:first-child a{
  white-space:normal;
  background:#fafbfc;
  border-left:3px solid var(--brand);
  border-radius:0 6px 6px 0;
  padding:14px 16px !important;
}
.news-text ul li:first-child a:hover{ padding-left:16px !important; background:#fdf3f3; }
/* 覆盖原红底标题条图片 */
.news-text ul li:first-child a .media-heading,
.news-text ul li:first-child a h5{
  margin:0 0 8px !important;
  padding:0 !important;
  background:none !important;
  color:var(--ink) !important;
  font-size:16px !important;
  font-weight:700 !important;
  line-height:1.5 !important;
  height:auto !important;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}
.news-text ul li:first-child a .abstract{
  margin:0 !important;
  padding:0 !important;
  height:auto !important;
  font-size:13px !important;
  line-height:1.8 !important;
  color:var(--ink-2) !important;
  text-indent:0 !important;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* 其余条目加序号，版面更整齐 */
.news-text ul{ counter-reset:n; }
.news-text ul li:not(:first-child) a::before{
  counter-increment:n;
  content:counter(n,decimal-leading-zero);
  display:inline-block;
  min-width:26px;
  margin-right:8px;
  font-size:12px;
  font-weight:700;
  color:#b9c0c9;
}

/* ---------- 7) 思政动态 / 通知公告：日期块 ---------- */
.dynamic-text ul li,
.notice-text ul li{ border-bottom:1px dashed var(--line); }
.dynamic-text ul li:last-child,
.notice-text ul li:last-child{ border-bottom:0; }
.dynamic-text ul li a,
.notice-text ul li a{
  display:flex;
  align-items:center;
  gap:14px;
  padding:12px 0;
}
.dynamic-text .pull-left.date,
.notice-text .pull-left.date{
  float:none !important;
  margin:0 !important;
  flex:0 0 54px;
  width:54px;
  height:54px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:#fdf2f2;
  border:1px solid #f4dcdc;
  border-radius:6px;
  transition:all .2s;
}
.dynamic-text .pull-left.date h3,
.notice-text .pull-left.date h3{
  margin:0;
  font-size:20px;
  line-height:1;
  font-weight:700;
  color:var(--brand);
}
.dynamic-text .pull-left.date p,
.notice-text .pull-left.date p{
  margin:3px 0 0;
  font-size:11px;
  color:var(--ink-2);
}
.dynamic-text .media-body p,
.notice-text .media-body p{
  margin:0;
  font-size:14px;
  line-height:1.6;
  color:var(--ink);
}
.dynamic-text ul li a:hover .pull-left.date,
.notice-text ul li a:hover .pull-left.date{
  background:var(--brand);
  border-color:var(--brand);
}
.dynamic-text ul li a:hover .pull-left.date h3,
.dynamic-text ul li a:hover .pull-left.date p,
.notice-text ul li a:hover .pull-left.date h3,
.notice-text ul li a:hover .pull-left.date p{ color:#fff; }

/* ---------- 8) 政策文件 / 教学资源：清掉原站装饰，改清爽双列 ----------
   原站残留必须先复位：
   .study li 有星星背景图(list-xing.png) + padding-left:55px + 47.5% 浮动 + 69px 行高；
   .importante-text li 有白卡背景 + 阴影 + hover 变红位移 + 红色小方块 ::before。 */
.importante-text ul,
.study ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2px 36px;
  margin-left:0 !important;
}
.study{ padding-bottom:0 !important; }
.study ul li{
  background:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
  width:auto !important;
  float:none !important;
  margin-left:0 !important;
  border-bottom:1px dashed var(--line) !important;
}
.importante-text ul li{
  background:none !important;
  box-shadow:none !important;
  width:auto !important;
  float:none !important;
  margin:0 !important;
  border-bottom:1px dashed var(--line) !important;
}
.importante-text ul li:hover{
  background:none !important;
  transform:none !important;
}
.importante-text ul li a,
.study ul li a{
  display:block;
  padding:11px 0 11px 16px !important;
  position:relative;
  font-size:14px !important;
  height:auto !important;
  line-height:1.6 !important;
  color:var(--ink) !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transition:color .2s;
}
.importante-text ul li a::before,
.study ul li a::before{
  content:"" !important;
  position:absolute;
  left:0 !important;
  top:50% !important;
  bottom:auto !important;
  width:5px !important;
  height:5px !important;
  margin-top:-2px;
  border-radius:50%;
  background:#c8cdd4 !important;
}
.importante-text ul li a:hover,
.study ul li a:hover{ color:var(--brand) !important; }
.importante-text ul li a:hover::before,
.study ul li a:hover::before{ background:var(--brand) !important; }
/* 条目内部结构复位：教学资源标题在 span、政策文件标题在 p、日期在 span.date */
.study ul li a span{
  display:inline !important;
  line-height:1.6 !important;
}
.importante-text ul li a p{
  width:auto !important;
  float:none !important;
  display:inline !important;
  font-size:14px !important;
  color:inherit !important;
  line-height:1.6 !important;
  height:auto !important;
  white-space:nowrap !important;
}
.importante-text ul li a span.date{
  float:none !important;
  width:auto !important;
  display:inline !important;
  margin-left:10px;
  font-size:12px !important;
  line-height:1.6 !important;
  color:#a6adb6 !important;
  text-align:left !important;
}
.importante-text ul li:hover a p{ color:var(--brand) !important; }
.importante-text ul li:hover a span.date{ color:#a6adb6 !important; }
@media (max-width: 767px){
  .importante-text ul,
  .study ul{ grid-template-columns:1fr; }
}

/* ---------- 9) 要闻图 ---------- */
.yaoxian-content .yaoxian img{
  width:100%;
  height:auto;
  border-radius:6px;
  display:block;
}

/* ---------- 10) 视频区：保留原站红底白字设计，只做圆角收敛 ----------
   注意：右侧列表标题是白色字，绝不能给 .video-inlist 加浅色背景 */
.video-content .video{ border-radius:6px; }
.video-content .video-box{ border-radius:6px; overflow:hidden; }

/* ---------- 11) 相关链接：保留彩色 logo，只统一标题样式 ---------- */
.link h3{
  font-size:20px;
  font-weight:700;
  color:var(--ink);
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 16px;
}
.link h3::before{
  content:"";
  width:4px;
  height:18px;
  border-radius:2px;
  background:var(--brand);
  display:inline-block;
}

/* ---------- 12) 页脚 ---------- */
.footer{
  position:relative;
  padding:28px 0;
  margin-top:6px;
}
.footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(30,10,12,.72);
}
.footer > .container{ position:relative; z-index:1; text-align:center; }
.footer p{ margin:0; font-size:13px; line-height:2; color:#e8e8e8; }
.footer a{ color:#fff !important; }

/* ---------- 13) 返回顶部 ---------- */
.backtop{
  position:fixed;
  right:24px;
  bottom:36px;
  width:44px;
  height:44px;
  line-height:42px;
  text-align:center;
  border-radius:50%;
  background:rgba(183,14,23,.9);
  color:#fff;
  font-size:18px;
  cursor:pointer;
  z-index:1200;
  display:none;
  box-shadow:0 3px 10px rgba(0,0,0,.2);
}
.backtop:hover{ background:var(--brand-2); }
@media (max-width: 767px){
  .backtop{ right:12px; bottom:20px; width:38px; height:38px; line-height:36px; }
}

/* ---------- 14) 移动端补强 ---------- */
@media (max-width: 767px){
  .write-content.index-content > .container,
  .yaoxian-content.index-content > .container,
  .importante-content.index-content > .container,
  .study-content > .container,
  .video-content.index-content > .container{
    padding:16px 14px 18px;
    margin-bottom:14px;
    border-radius:6px;
  }
  .index-title h3{ font-size:17px; }
  /* 移动端标题允许两行，别再压成一行省略号 */
  .news-text ul li a{
    white-space:normal;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .news-text ul li:first-child a{ -webkit-line-clamp:unset; display:block; }
  .importante-text ul li a,
  .study ul li a{ font-size:14px; white-space:normal; }
  .hmSlides{ margin-bottom:14px; border-radius:0; }
}