/* 智慧课程横幅沿用公共背景，标题按 Figma 的 238 像素位置对齐。 */
.smart-courses-page .inner-banner-copy { top: 238px; }
/* 当前本科生教育导航使用白字，与栏目页公共头部保持一致。 */
html.is-pc .smart-courses-page .inner-site-nav .nav-list > li.active > a { color: #fff; }

/* 桌面课程列表按设计稿使用 1440 像素内容宽度，由公共脚本统一等比缩放。 */
.smart-courses-main { width: 1440px; margin: 0 auto; padding-top: 60px; }
.course-item { display: grid; grid-template-columns: 660px minmax(0, 1fr); gap: 40px; padding-bottom: 40px; margin-bottom: 39px; border-bottom: 1px solid var(--line); }
/* 最后一条课程不画分隔线，列表与页脚之间保留设计稿的 100 像素间距。 */
.course-item:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
/* 照片作为背景铺满封面，白色课程名居中显示，暗色蒙层保证文字清晰。 */
.course-cover { display: grid; place-items: center; width: 660px; height: 400px; padding: 24px; background-position: center; background-size: cover; box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, .25); }
.course-cover-title { color: #fff; font-size: 40px; font-weight: 600; line-height: 1.4; text-align: center; overflow-wrap: anywhere; text-shadow: 0 2px 8px rgba(0, 0, 0, .5); }
.course-copy { position: relative; min-width: 0; padding-top: 60px; }
/* 日期后方使用灰色渐变，悬停或键盘聚焦时显示设计稿中的橙色状态。 */
.course-copy::before { position: absolute; top: 60px; right: 0; left: 189px; height: 40px; content: ""; pointer-events: none; background: linear-gradient(90deg, rgba(221, 221, 221, .5), rgba(221, 221, 221, 0)); }
.course-copy time { display: block; padding-left: 20px; border-left: 4px solid var(--blue); font-size: 24px; line-height: 40px; }
.course-copy h2 { margin: 60px 0 20px; color: #000; font-size: 18px; font-weight: 400; line-height: 25px; }
/* 简介最多展示三行，避免长文本挤占课程入口或改变列表节奏。 */
.course-copy p { display: -webkit-box; margin: 0; overflow: hidden; color: var(--muted); font-size: 16px; line-height: 30px; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.course-more { position: relative; display: flex; align-items: center; width: 120px; height: 30px; margin-top: 36px; padding: 0 10px; visibility: hidden; color: #fff; font-size: 14px; background: var(--blue); }
.course-more::before { position: absolute; top: 0; right: -6px; width: 4px; height: 30px; content: ""; background: var(--orange); }
.course-more::after { width: 12px; height: 12px; margin-left: auto; content: ""; background: url("../images/party-news-more-icon.png") center / contain no-repeat; }
.course-item:hover .course-copy::before,
.course-item:focus-visible .course-copy::before { background: linear-gradient(90deg, #fd9600, rgba(253, 150, 0, 0)); }
.course-item:hover .course-more,
.course-item:focus-visible .course-more { visibility: visible; }
.course-item:focus-visible { outline: 2px solid var(--blue); outline-offset: 6px; }
.smart-courses-page .site-footer { margin-top: 100px; border-top: 6px solid var(--blue); }

/* 手机端依公共函数判断：隐藏二级栏目，课程依次按封面、日期、标题、简介纵向排列。 */
html.is-mobile .smart-courses-page .inner-hero { height: 300px; }
html.is-mobile .smart-courses-page .inner-banner-copy { top: 138px; left: 20px; }
html.is-mobile .smart-courses-page .inner-subnav { display: none; }
html.is-mobile .smart-courses-main { width: auto; margin: 0 16px; padding-top: 32px; }
html.is-mobile .course-item { display: block; padding-bottom: 28px; margin-bottom: 28px; }
html.is-mobile .course-item:last-child { padding-bottom: 0; margin-bottom: 0; }
html.is-mobile .course-cover { width: 100%; height: auto; aspect-ratio: 1.65; }
/* 手机端缩小封面文字和内边距，长课程名称可自然换行。 */
html.is-mobile .course-cover { padding: 16px; }
html.is-mobile .course-cover-title { font-size: 24px; }
html.is-mobile .course-copy { padding-top: 24px; }
html.is-mobile .course-copy::before { top: 24px; left: 145px; height: 30px; }
html.is-mobile .course-copy time { padding-left: 14px; border-left-width: 3px; font-size: 18px; line-height: 30px; }
html.is-mobile .course-copy h2 { margin: 24px 0 12px; font-size: 17px; line-height: 28px; }
html.is-mobile .course-copy p { font-size: 15px; line-height: 28px; }
/* 触屏端直接显示课程入口，圆角与公共移动导航的 iOS 风格保持一致。 */
html.is-mobile .course-more { height: 36px; margin-top: 20px; visibility: visible; border-radius: 8px; }
html.is-mobile .course-more::before { display: none; }
html.is-mobile .smart-courses-page .site-footer { margin-top: 56px; border-top-width: 4px; }
