/* =====================================================
   显智单招升学网站 — 首页特有样式
   文件：/css/index.css
   说明：仅首页使用的样式，包括头条区、资讯轮播、十大类、数据三列、课程卡片等
   ===================================================== */

/* 头条区 */
.headline { background: linear-gradient(120deg, var(--green-800) 0%, var(--green-400) 100%); color: #fff; padding: 36px 0; }
/* 首页头条为「h1+副标题+按钮组」纵向结构，覆盖 common.css 中子页面 headline 的横向 flex 布局（20260930） */
.headline .headline-inner { display: block; max-width: 720px; }
.headline h1 { font-size: 26px; font-weight: 600; margin-bottom: 10px; line-height: 1.45; }
.headline p { font-size: 14px; color: rgba(255,255,255,.88); margin-bottom: 20px; }
.headline-btns { display: flex; gap: 12px; }


/* 头条轮播（xz_home_banner 多条时启用） */
.headline--img { background-size: cover; background-position: center; position: relative; }
.headline--img::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,60,40,.72) 0%, rgba(10,60,40,.35) 100%); }
.headline--img .container { position: relative; }
.headline--carousel { position: relative; overflow: hidden; }
.headline--carousel .hero-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; background-size: cover; background-position: center; display: flex; align-items: center; }
.headline--carousel .hero-slide.active { position: relative; opacity: 1; }
.headline--carousel .hero-slide::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,60,40,.72) 0%, rgba(10,60,40,.35) 100%); }
.headline--carousel .hero-slide .container { position: relative; width: 100%; }
.headline--carousel .hero-dots { position: absolute; left: 0; right: 0; bottom: 14px; display: flex; justify-content: center; gap: 8px; z-index: 2; }
.headline--carousel .hero-dots .dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.45); cursor: pointer; transition: background .3s ease; }
.headline--carousel .hero-dots .dot.active { background: #fff; }
/* 纯图片 slide（无标题无副标题无按钮时文字层为空，保持最小高度） */
.headline--carousel .hero-slide .headline-inner { min-height: 1px; }
.headline--carousel .hero-slide:not(:has(.headline-btns)) .headline-inner:empty { display: none; }

/* 空数据提示（资讯/数据三列/FAQ 等版块无数据时） */
.empty { padding: 24px; text-align: center; color: var(--text-hint); background: #fff; border: 1px dashed var(--border-light); border-radius: var(--radius); }
li.empty { border: none; background: none; }

/* 资讯：左头条 + 右列表（minmax(0,1fr) 防止长标题/长单词把列撑出视口，小屏溢出修复） */
.news-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; }
.news-feature { border: 1px solid var(--border-light); border-radius: var(--radius); overflow: hidden; }
/* 封面图统一 16:9 比例（与频道页 news-feature 一致）：padding-top 撑比例兼容老内核（搜狗），img 绝对定位铺满 */
.news-feature .thumb { position: relative; display: block; height: 0; padding-top: 56.25%; overflow: hidden; background: var(--green-50); }
.news-feature .thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.news-feature .thumb .tag { position: absolute; top: 12px; left: 12px; font-size: 12px; color: #fff; background: rgba(0,0,0,.42); padding: 3px 12px; border-radius: 20px; }
.news-feature .body { padding: 14px; }
.news-feature .cat { font-size: 11px; color: var(--green-800); background: var(--green-50); padding: 1px 8px; border-radius: 8px; }
.news-feature h3 { font-size: 16px; font-weight: 600; margin: 8px 0; line-height: 1.5; word-break: break-word; }
.news-feature h3 a { color: var(--text); }
.news-feature h3 a:hover { color: var(--green-400); }
.news-feature p { font-size: 12px; color: var(--text-secondary); line-height: 1.7; word-break: break-word; }
.news-list { list-style: none; }
.news-list li { display: flex; align-items: center; padding: 9px 0; border-bottom: 1px dashed var(--border-light); min-width: 0; }
.news-list li:last-child { border-bottom: none; }
.news-list .n-cat { font-size: 12px; color: var(--coral-800); background: var(--coral-50); padding: 1px 7px; border-radius: 8px; margin-right: 10px; white-space: nowrap; flex-shrink: 0; }
.news-list .n-title { flex: 1; min-width: 0; font-size: 14px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news-list .n-title:hover { color: var(--green-400); }
.news-list .n-date { font-size: 12px; color: var(--text-hint); margin-left: 10px; white-space: nowrap; flex-shrink: 0; }

/* 三列模块组：录取分数 / 招生院校 / 一分一档 等并排成一行 */
.triple { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.triple .col { min-width: 0; }
.triple .col .col-head { margin-bottom: 12px; border-left-color: var(--gray-400); }
/* 组内超过 3 个版块时两列排布（宽屏 2×N，避免 4 列过挤） */
.triple.triple-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* 单招十大类（左右两栏，每栏 2 行 × 5 个） */
.cat-split { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.cat-panel { background: #fff; border: 1px solid var(--border-light); border-radius: var(--radius); padding: 16px 22px; }
.cat-panel-title { font-size: 14px; font-weight: 600; color: var(--green-800); margin-bottom: 14px; padding-bottom: 8px; border-bottom: 1px dashed var(--border); }
.cat-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.cat-cell { background: var(--green-50); border: 1px solid var(--border-light); border-radius: 9px; padding: 10px 4px; text-align: center; transition: border-color .15s, transform .15s; }
.cat-cell:hover { border-color: var(--green-800); transform: translateY(-1px); }
.cat-cell .c-no { display: block; font-size: 14px; font-weight: 700; color: var(--green-800); margin-bottom: 3px; }
.cat-cell .c-name { display: block; font-size: 12px; color: var(--text); line-height: 1.35; }
.cat-cell .c-major { display: block; font-size: 11px; color: var(--text-hint); line-height: 1.35; }

/* 单招培训（线下班）区块 */
.training-strip { display: flex; align-items: center; justify-content: space-between; gap: 24px; background: var(--green-50); border: 1px solid #B9E6D6; border-radius: var(--radius); padding: 22px 26px; }
.t-intro { flex: 1; }
.t-intro p { font-size: 14px; color: var(--text-secondary); line-height: 1.7; }
.t-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.t-tags span { font-size: 12px; padding: 4px 12px; border-radius: 14px; background: #fff; color: var(--green-800); border: 1px solid #B9E6D6; }
.t-btn { flex-shrink: 0; padding: 12px 28px; border-radius: 22px; background: var(--coral-400); color: #fff; font-size: 14px; font-weight: 600; white-space: nowrap; }
.t-btn:hover { background: var(--coral-800); }

/* 关于显智 */
.about-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 28px; align-items: center; }
.about-text p { font-size: 13px; color: var(--text-secondary); line-height: 1.8; margin-bottom: 10px; }
.about-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.about-stat { text-align: center; background: var(--green-50); border-radius: var(--radius); padding: 16px 8px; }
.about-stat .num { font-size: 24px; font-weight: 700; color: var(--green-400); }
.about-stat .lbl { font-size: 12px; color: var(--text-secondary); margin-top: 2px; }

/* 课程区 */
.course-mini { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.course-mini .c-card { border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; display: flex; flex-direction: column; }
.course-mini .c-card.recommend { border: 1.5px solid var(--coral-400); }
.course-mini .c-badge { font-size: 11px; padding: 1px 8px; border-radius: 8px; align-self: flex-start; margin-bottom: 6px; }
.course-mini  .c-card .c-badge { background: var(--green-50); color: var(--green-800); }
.course-mini  .c-card.recommend .c-badge { background: var(--coral-50); color: var(--coral-800); }
/* .curse-mini  .c-card.recommend .c-badge { background: var(--coral-50); color: var(--coral-800); } */
.course-mini h3 { font-size: 15px; margin-bottom: 6px; }
.course-mini p { font-size: 13px; color: var(--text-secondary); flex: 1; }
.course-mini .c-foot { display: flex; align-items: center; justify-content: flex-end; margin-top: 10px; }
.course-mini .c-price { font-size: 17px; font-weight: 600; color: var(--coral-400); }
.course-mini .c-btn { font-size: 12px; padding: 5px 12px; border-radius: 16px; background: var(--coral-400); color: #fff; }
.course-mini .c-btn:hover { background: var(--coral-800); }

.fc-right .contact-qr{background:var(--blue-50);box-shadow:0 10px 28px rgb(167 208 228 / 28%);}
.contact-qr .qr-label{color:#1a1a1a;}

/* 首页响应式 */
@media (max-width: 768px) {
  .headline { padding: 28px 0; }
  .headline h1 { font-size: 22px; }
  /* 单列也必须 minmax(0,1fr)：裸 1fr=minmax(auto,1fr)，长英文串会撑破容器（20261007 实测 375px 溢出复现） */
  .news-grid, .course-mini, .about-grid, .triple, .triple.triple-2 { grid-template-columns: minmax(0, 1fr); }
  .cat-split { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .cat-grid { grid-template-columns: repeat(3, 1fr); }
  .training-strip { flex-direction: column; align-items: flex-start; }
  .t-btn { width: 100%; text-align: center; }
}
