/* ===== 重置 ===== */
* {margin: 0;padding: 0;box-sizing: border-box;}
body {font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;background: #f6f9fc;color: #1e293b;line-height: 1.5;min-height: 100vh;display: flex;flex-direction: column;}
a{text-decoration: none;color: #1e293b;}
.container {max-width: 1280px;margin: 0 auto;padding: 0 24px;width: 100%;}
/* ===== 头部 ===== */
.header {background: rgba(255, 255, 255, 0.92);backdrop-filter: blur(8px);border-bottom: 1px solid #e9edf2;padding: 12px 0;position: sticky;top: 0;z-index: 30;height: 68px;display: flex;align-items: center;}
.header-inner {display: flex;align-items: center;justify-content: space-between;width: 100%;gap: 8px;position: relative;}
.logo {display: flex;align-items: center;gap: 10px;font-size: 22px;font-weight: 700;color: #0f172a;flex-shrink: 0;}
.logo .icon {font-size: 28px;color: #8b5cf6;}
.logo .icon img{width:38px;}
.logo .icona img{width:130px;}
.logo span {color: #8b5cf6;}
/* ===== 汉堡按钮（移动端） ===== */
.menu-toggle {display: none;background: none;border: none;font-size: 24px;color: #1e293b;cursor: pointer;padding: 4px 8px;border-radius: 8px;transition: background 0.2s;flex-shrink: 0;z-index: 35;position: relative;}
.menu-toggle:hover {background: #f1f5f9;}
.menu-toggle .close-icon {display: none;}
.menu-toggle.open .menu-icon {display: none;}
.menu-toggle.open .close-icon {display: inline;}

/* ===== 导航栏（桌面靠右） ===== */
.nav {display: flex;flex-wrap: wrap;align-items: center;gap: 4px;transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;margin-left: auto;/* 靠右 */;}
.nav a {padding: 6px 10px;border-radius: 30px;font-size: 14px;font-weight: 500;color: #475569;text-decoration: none;border: 1px solid transparent;transition: 0.2s;white-space: nowrap;}
.nav a:hover {background: #f1f5f9;border-color: #dce1e9;color: #0f172a;}
.nav a .emoji {margin-right: 4px;}
.nav .badge {background: #f1f5f9;padding: 4px 14px;border-radius: 30px;font-size: 13px;color: #64748b;margin-left: 6px;white-space: nowrap;}
.nav .badge .emoji {margin-right: 4px;}
/* =================  大图轮播======= */
.carousel-wrap {padding: 24px 0 16px;border-bottom: 1px solid #e9edf2;margin-bottom: 8px;position: relative;z-index: 10;}
.carousel-container {position: relative;width: 100%;border-radius: 20px;overflow: hidden;box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);background: #0f172a;}
.carousel-slides {position: relative;width: 100%;height: 440px;}
@media (max-width: 768px) {.carousel-slides {height: 320px;}}
@media (max-width: 480px) {.carousel-slides {height: 220px;}}

.slide {position: absolute;inset: 0;opacity: 0;transition: opacity 0.8s ease;z-index: 1;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.slide.active {opacity: 1;z-index: 2;}
.slide img {width: 100%;height: 100%;object-fit: cover;display: block;}

.slide-overlay {position: absolute;inset: 0;background: linear-gradient(0deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.10) 60%, transparent 85%);display: flex;flex-direction: column;justify-content: flex-end;padding: 40px 50px;color: #fff;pointer-events: none;}
@media (max-width: 768px) {.slide-overlay {padding: 28px 30px;}}
@media (max-width: 480px) {.slide-overlay {padding: 16px 18px;}}
.slide-overlay .tag {display: inline-block;background: rgba(139, 92, 246, 0.80);backdrop-filter: blur(4px);padding: 2px 16px;border-radius: 30px;font-size:15px;line-height: 20px;font-weight: 600;letter-spacing: 0.5px;margin-top:12px;align-self: flex-start;pointer-events: none;}
.slide-overlay .tag a{color: #fff}
.slide-overlay .tag .emoji {margin-right: 4px;}
.slide-overlay h2 {font-size: 32px;font-weight: 700;line-height: 1.2;text-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);pointer-events: none;}
.slide-overlay p {font-size: 16px;opacity: 0.85;margin-top: 4px;text-shadow: 0 1px 8px rgba(0, 0, 0, 0.15);max-width: 600px;pointer-events: none;}
@media (max-width: 768px) {.slide-overlay h2 {font-size: 24px;}.slide-overlay p {font-size: 14px;}}
@media (max-width: 480px) {.slide-overlay h2 {font-size: 16px;}.slide-overlay p {font-size: 12px;}.slide-overlay .tag {font-size: 10px;padding: 1px 10px;}}

/* 箭头 */
.arrow {position: absolute;top: 50%;transform: translateY(-50%);z-index: 10;width: 44px;height: 44px;border-radius: 50%;background: rgba(255, 255, 255, 0.15);backdrop-filter: blur(8px);border: 1px solid rgba(255, 255, 255, 0.15);display: flex;align-items: center;justify-content: center;font-size: 22px;color: #fff;cursor: pointer;transition: background 0.25s, transform 0.2s;user-select: none;font-weight: 300;}
.arrow:hover {background: rgba(255, 255, 255, 0.30);transform: translateY(-50%) scale(1.06);}
.arrow-left {left: 16px;}
.arrow-right {right: 16px;}
@media (max-width: 480px) {.arrow {width: 32px;height: 32px;font-size: 18px;}.arrow-left {left: 8px;}.arrow-right {right: 8px;}}

/* 指示点 */
.dots {position: absolute;bottom: 16px;left: 50%;transform: translateX(-50%);z-index: 10;display: flex;gap: 10px;}
.dots span {width: 10px;height: 10px;border-radius: 50%;background: rgba(255, 255, 255, 0.35);cursor: pointer;transition: background 0.3s, transform 0.2s;border: 1px solid rgba(255, 255, 255, 0.10);}
.dots span:hover {background: rgba(255, 255, 255, 0.60);transform: scale(1.2);}
.dots span.active {background: #8b5cf6;width: 24px;border-radius: 6px;border-color: rgba(139, 92, 246, 0.4);}
@media (max-width: 480px) {.dots {gap: 6px;bottom: 8px;}.dots span {width: 7px;height: 7px;}.dots span.active {width: 16px;}}

/* ===== 栏目区块 ===== */
.section {margin-bottom: 44px;padding-top: 16px;scroll-margin-top: 80px;}
.section-header {display: flex;align-items: baseline;justify-content: space-between;margin-bottom: 16px;padding-bottom: 8px;border-bottom: 2px solid #eef2f6;}
.section-title {font-size: 22px;font-weight: 700;color: #0f172a;display: flex;align-items: center;gap: 10px;}
.section-title .emoji {font-size: 24px;}
.section-count {font-size: 14px;color: #94a3b8;}

/* ===== 视频网格 ===== */
.grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));gap: 24px 20px;}

/* ===== 卡片 ===== */
.card {background: #fff;border-radius: 16px;overflow: hidden;border: 1px solid #f0f2f5;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);transition: 0.25s ease;display: flex;flex-direction: column;}
.card:hover {transform: translateY(-4px);box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);border-color: #d9e2ef;}
.thumb {position: relative;width: 100%;padding-top: 56.25%;background: #e2e8f0;overflow: hidden;}
.thumb img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;transition: transform 0.3s;}
.card:hover .thumb img {transform: scale(1.03);}
.thumb .duration {position: absolute;bottom: 10px;right: 10px;background: rgba(0, 0, 0, 0.7);color: #fff;font-size: 12px;font-weight: 500;padding: 2px 12px;border-radius: 30px;}

.card-body {padding: 14px 16px 16px;flex: 1;display: flex;flex-direction: column;}
.card-title {font-size: 16px;font-weight: 700;line-height: 1.4;color: #0f172a;margin-bottom: 6px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;word-break: break-word;min-height: 2.8em;}
.card-desc {font-size: 13px;color: #64748b;line-height: 1.5;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin-bottom: 12px;flex: 1;}
.card-meta {display: flex;justify-content: space-between;align-items: center;font-size: 12px;color: #94a3b8;border-top: 1px solid #f1f5f9;padding-top: 10px;}
.card-meta .tag {background: #eef2ff;color: #8b5cf6;padding: 0 12px;border-radius: 30px;font-weight: 500;}

/* ===== 新闻列表（页尾上方） ===== */
.news-section {margin-top: 12px;margin-bottom: 32px;padding-top: 24px;border-top: 2px solid #e9edf2;}
.news-header {display: flex;align-items: center;justify-content: space-between;margin-bottom: 16px;}
.news-header h3 {font-size: 20px;font-weight: 700;color: #0f172a;display: flex;align-items: center;gap: 10px;}
.news-header h3 .emoji {font-size: 22px;}
.news-header .more-link {font-size: 14px;color: #8b5cf6;text-decoration: none;font-weight: 500;}
.news-header .more-link:hover {text-decoration: underline;}
.news-list {display: grid;grid-template-columns: 1fr 1fr;gap: 12px 30px;background: #fff;border-radius: 16px;padding: 18px 24px;border: 1px solid #f0f2f5;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);}
.news-item {display: flex;align-items: center;gap: 12px;padding: 8px 0;border-bottom: 1px solid #f1f5f9;}
.news-item:last-child,
.news-item:nth-last-child(2) {border-bottom: none;}
.news-item .dot {flex-shrink: 0;width: 6px;height: 6px;border-radius: 50%;background: #8b5cf6;}
.news-item a {color: #1e293b;text-decoration: none;font-size: 14px;transition: color 0.2s;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;}
.news-item a:hover {color: #8b5cf6;}
.news-item .date {flex-shrink: 0;font-size: 12px;color: #94a3b8;margin-left: auto;padding-left: 12px;}
@media (max-width: 768px) {.news-list {grid-template-columns: 1fr;padding: 14px 18px;}.news-item {padding: 10px 0;}.news-item:last-child {border-bottom: none;}.news-item:nth-last-child(2) {border-bottom: 1px solid #f1f5f9;}}
@media (max-width: 480px) {.news-list {padding: 12px 14px;}.news-item a {font-size: 13px;}.news-item .date {font-size: 11px;}}

/* ===== 底部 ===== */
.footer {margin-top: auto;padding: 28px 0 32px;background: #fff;border-top: 1px solid #e9edf2;text-align: center;font-size: 14px;color: #94a3b8;}
.footer .heart {color: #e85d6f;}
.footer .social {margin-top: 10px;display: flex;justify-content: center;gap: 20px;font-size: 22px;}
.footer .social a {color: #94a3b8;text-decoration: none;transition: color 0.2s;}
.footer .social a:hover {color: #8b5cf6;}

/* ============================================================  移动端导航下拉覆盖（不改变高度）============================================================ */
@media (max-width: 768px) {
.header {height: 60px;padding: 0;}
.header-inner {flex-wrap: nowrap;height: 100%;}
.logo {font-size: 19px;}.logo .icon {font-size: 22px;}
.menu-toggle {display: block;}
.nav {display: flex;position: fixed;top: 60px;left: 0;right: 0;background: rgba(255, 255, 255, 0.98);backdrop-filter: blur(12px);flex-direction: column;align-items: stretch;gap: 2px;padding: 12px 20px 20px;border-bottom: 1px solid #e9edf2;box-shadow: 0 16px 40px rgba(0, 0, 0, 0.10);opacity: 0;transform: translateY(-12px);visibility: hidden;pointer-events: none;transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;z-index: 25;border-radius: 0 0 20px 20px;margin-left: 0;}
.nav.open {opacity: 1;transform: translateY(0);visibility: visible;pointer-events: auto;}
.nav a {padding: 12px 18px;border-radius: 12px;white-space: normal;width: 100%;text-align: left;border-color: transparent;font-size: 15px;}.nav a:hover {background: #f1f5f9;border-color: #dce1e9;}
.nav .badge {margin-left: 0;text-align: center;padding: 10px 14px;margin-top: 6px;border-radius: 12px;background: #f1f5f9;}
.nav-overlay {position: fixed;inset: 0;top: 60px;background: rgba(0, 0, 0, 0.25);z-index: 20;opacity: 0;visibility: hidden;transition: opacity 0.3s ease, visibility 0.3s ease;pointer-events: none;}
.nav-overlay.active {opacity: 1;visibility: visible;pointer-events: auto;}
.grid {grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));gap: 16px;}
.section-title {font-size: 19px;}
.carousel-wrap {padding: 18px 0 12px;}
.card-title {font-size: 14px;min-height: 2.6em;}}
@media (max-width: 480px) {
.header {height: 54px;}
.nav {top: 54px;padding: 10px 16px 16px;}
.nav-overlay {top: 54px;}
.grid {grid-template-columns: 1fr 1fr;gap: 12px;}
.card-title {font-size: 13px;min-height: 2.4em;-webkit-line-clamp: 2;}.card-desc {font-size: 12px;}
.container {padding: 0 14px;}.carousel-wrap {padding: 12px 0 8px;}
.logo {font-size: 17px;}.logo .icon {font-size: 20px;}
.menu-toggle {font-size: 20px;padding: 2px 6px;}
.news-section {margin-top: 8px;margin-bottom: 20px;}
.news-header h3 {font-size: 17px;}}
@media (max-width: 400px) {.grid {	grid-template-columns: 1fr;}}



/* ===栏目内页元素，避免影响全局)===== */
.inner-page * {margin: 0;padding: 0;box-sizing: border-box;}
.inner-page {font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;background: #f6f9fc;color: #1e293b;line-height: 1.5;min-height: 100vh;padding: 0;}
.inner-page .container {max-width: 1280px;margin: 0 auto;padding: 0 24px;width: 100%;}
/* 内页专属样式 (使用 .inner-page 前缀隔离) */

/* ---- 面包屑 ---- */
.inner-page .breadcrumb {padding: 20px 0 8px;font-size: 14px;color: #94a3b8;}
.inner-page .breadcrumb a {color: #8b5cf6;text-decoration: none;}
.inner-page .breadcrumb a:hover {text-decoration: underline;}
.inner-page .breadcrumb .sep {margin: 0 8px;color: #cbd5e1;}

/* ---- 栏目头部 ---- */
.inner-page .category-header {display: flex;align-items: flex-start;gap: 20px;padding: 16px 0 24px;border-bottom: 2px solid #e9edf2;margin-bottom: 24px;flex-wrap: wrap;}
.inner-page .category-header .icon-box {flex-shrink: 0;width: 72px;height: 72px;border-radius: 20px;background: #eef2ff;display: flex;align-items: center;justify-content: center;font-size: 36px;}
.inner-page .category-header .info {flex: 1;min-width: 200px;}
.inner-page .category-header .info h1 {font-size: 28px;font-weight: 700;color: #0f172a;display: flex;align-items: center;gap: 12px;flex-wrap: wrap;}
.inner-page .category-header .info h1 .count {font-size: 14px;font-weight: 500;color: #8b5cf6;background: #eef2ff;padding: 2px 14px;border-radius: 30px;}
.inner-page .category-header .info p {font-size: 16px;color: #64748b;margin-top: 4px;max-width: 600px;}
.inner-page .category-header .action-btn {flex-shrink: 0;padding: 10px 28px;border-radius: 40px;background: #8b5cf6;color: #fff;border: none;font-size: 14px;font-weight: 600;cursor: pointer;transition: background 0.2s;align-self: center;}
.inner-page .category-header .action-btn:hover {background: #7c3aed;}

/* ---- 工具栏 ---- */
.inner-page .toolbar {display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;gap: 12px;padding: 12px 0 16px;border-bottom: 1px solid #f1f5f9;margin-bottom: 24px;}
.inner-page .toolbar .left {display: flex;align-items: center;gap: 12px;flex-wrap: wrap;}
.inner-page .toolbar .left .label {font-size: 13px;color: #94a3b8;}
.inner-page .toolbar .filter-tag {padding: 4px 16px;border-radius: 30px;border: 1px solid #dce1e9;background: #fff;font-size: 13px;font-weight: 500;color: #475569;cursor: pointer;transition: 0.2s;}
.inner-page .toolbar .filter-tag:hover {border-color: #8b5cf6;color: #8b5cf6;background: #f8f6ff;}
.inner-page .toolbar .filter-tag.active {background: #8b5cf6;border-color: #8b5cf6;color: #fff;}
.inner-page .toolbar .right {font-size: 13px;color: #94a3b8;}
.inner-page .toolbar .right select {padding: 4px 12px;border-radius: 30px;border: 1px solid #dce1e9;background: #fff;font-size: 13px;color: #1e293b;cursor: pointer;outline: none;}
.inner-page .toolbar .right select:focus {border-color: #8b5cf6;}

/* ---- 视频网格 (内页更丰富) ---- */
.inner-page .video-grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));gap: 28px 24px;padding-bottom: 28px;}

/* ---- 卡片 (内页风格) ---- */
.inner-page .video-card {background: #fff;border-radius: 18px;overflow: hidden;border: 1px solid #f0f2f5;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);transition: 0.3s ease;display: flex;flex-direction: column;}
.inner-page .video-card:hover {transform: translateY(-6px);box-shadow: 0 16px 36px rgba(0, 0, 0, 0.07);border-color: #d9e2ef;}
.inner-page .video-card .thumb {position: relative;width: 100%;padding-top: 56.25%;background: #e2e8f0;overflow: hidden;}
.inner-page .video-card .thumb img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;transition: transform 0.4s;}
.inner-page .video-card:hover .thumb img {transform: scale(1.04);}
.inner-page .video-card .thumb .duration {position: absolute;bottom: 10px;right: 10px;background: rgba(0, 0, 0, 0.7);color: #fff;font-size: 12px;font-weight: 500;padding: 2px 12px;border-radius: 30px;}
.inner-page .video-card .thumb .badge {position: absolute;top: 10px;left: 10px;background: rgba(139, 92, 246, 0.85);backdrop-filter: blur(4px);color: #fff;font-size: 11px;font-weight: 600;padding: 2px 12px;border-radius: 30px;letter-spacing: 0.3px;}
.inner-page .video-card .body {padding: 16px 18px 18px;flex: 1;display: flex;flex-direction: column;}
.inner-page .video-card .body .title {font-size: 16px;font-weight: 700;color: #0f172a;line-height: 1.4;margin-bottom: 6px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.inner-page .video-card .body .desc {font-size: 13px;color: #64748b;line-height: 1.6;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;margin-bottom: 14px;flex: 1;}
.inner-page .video-card .body .meta {display: flex;justify-content: space-between;align-items: center;font-size: 12px;color: #94a3b8;border-top: 1px solid #f1f5f9;padding-top: 12px;}
.inner-page .video-card .body .meta .views {display: flex;align-items: center;gap: 4px;}
.inner-page .video-card .body .meta .date {display: flex;align-items: center;gap: 4px;}
/* ---- 分页 ---- */
.inner-page .pagination {display: flex;align-items: center;justify-content: center;gap: 6px;padding: 20px 0 40px;border-top: 1px solid #f1f5f9;margin-top: 8px;}
.inner-page .pagination a,
.inner-page .pagination span {display: inline-flex;align-items: center;justify-content: center;min-width: 40px;height: 40px;padding: 0 12px;border-radius: 10px;font-size: 14px;font-weight: 500;color: #475569;text-decoration: none;border: 1px solid transparent;transition: 0.2s;}
.inner-page .pagination a:hover {background: #f1f5f9;border-color: #dce1e9;}
.inner-page .pagination .active {background: #8b5cf6;color: #fff;border-color: #8b5cf6;}
.inner-page .pagination .disabled {color: #cbd5e1;pointer-events: none;}

/* 内页栏目响应式*/
@media (max-width: 768px) {.inner-page .category-header {	flex-direction: column;	align-items: flex-start;	gap: 12px;	padding: 12px 0 18px;}.inner-page .category-header .icon-box {	width: 56px;	height: 56px;	font-size: 28px;}.inner-page .category-header .info h1 {	font-size: 22px;}.inner-page .category-header .action-btn {	align-self: flex-start;	padding: 8px 22px;	font-size: 13px;}.inner-page .video-grid {	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));	gap: 18px;}.inner-page .toolbar {	flex-direction: column;	align-items: flex-start;	gap: 8px;}.inner-page .toolbar .right {	width: 100%;}.inner-page .toolbar .right select {	width: 100%;}}

@media (max-width: 480px) {.inner-page .container {	padding: 0 14px;}.inner-page .video-grid {	grid-template-columns: 1fr 1fr;	gap: 12px;}.inner-page .video-card .body .title {	font-size: 14px;}.inner-page .video-card .body .desc {	font-size: 12px;	-webkit-line-clamp: 1;}.inner-page .category-header .info h1 {	font-size: 19px;}.inner-page .category-header .info p {	font-size: 14px;}.inner-page .pagination a,.inner-page .pagination span {	min-width: 34px;	height: 34px;	font-size: 13px;	padding: 0 8px;}}

@media (max-width: 400px) {.inner-page .video-grid {	grid-template-columns: 1fr;}
}
/* ===栏目内页元素结束===== */
