/* ==========================================================
   九州网 视觉优化层 (beautify.css)
   在 base.css / m.css 之后加载，覆盖旧模板样式
   ========================================================== */

:root {
	--primary: #0f766e;
	--primary-dark: #115e59;
	--accent: #2dd4bf;
	--ink: #1f2937;
	--ink-light: #6b7280;
	--bg: #f4f6f9;
	--card: #ffffff;
	--radius: 12px;
	--shadow-sm: 0 1px 3px rgba(15, 23, 42, .06);
	--shadow-md: 0 4px 16px rgba(15, 23, 42, .08);
	--shadow-lg: 0 12px 32px rgba(15, 23, 42, .12);
}

/* ---------- 基础 ---------- */
body {
	font: 15px/1.7 "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
	color: var(--ink);
	background:
		radial-gradient(1200px 400px at 80% -100px, rgba(15, 118, 110, .08), transparent),
		var(--bg);
	-webkit-font-smoothing: antialiased;
}

a {
	transition: color .2s ease;
}

::selection {
	background: rgba(15, 118, 110, .18);
}

/* ---------- 顶部导航 ---------- */
header {
	background: rgba(17, 24, 39, .92);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	height: 56px;
	box-shadow: 0 1px 0 rgba(255, 255, 255, .06), 0 4px 20px rgba(0, 0, 0, .25);
}

/* 去掉旧的彩虹条，换成克制的品牌渐变线 */
header::before {
	background: linear-gradient(90deg, #0f766e, #14b8a6 55%, #f59e0b);
	height: 3px;
}

.navbox {
	width: 1200px;
	line-height: 56px;
}

.logo {
	line-height: 56px;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 1px;
	margin-right: 48px;
}

.logo img {
	margin-top: 12px;
	margin-bottom: 0 !important;
	max-height: 34px;
	vertical-align: middle;
}

nav {
	height: 56px;
	line-height: 56px;
}

#starlist li a {
	color: rgba(255, 255, 255, .78);
	font-size: 15px;
	padding: 0 16px;
	border-radius: 8px;
	transition: color .2s ease, background .2s ease;
}

/* 悬停：柔和高亮块（替代原来的下划线短色块） */
#starlist li a:hover,
#starlist li:hover a {
	color: #fff;
	background: rgba(255, 255, 255, .12);
}

/* 当前页：不加底色，白色加粗 + 下方固定宽度小短条 */
#starlist .current-menu-item > a,
#starlist .current_page_item > a {
	color: #fff;
	background: transparent;
	box-shadow: none;
	font-weight: 600;
	position: relative;
}

#starlist .current-menu-item > a::after,
#starlist .current_page_item > a::after {
	content: "";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 9px;
	width: 22px;
	height: 3px;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--primary), var(--accent));
}

/* 搜索图标：纯 CSS 绘制放大镜，不依赖图标字体 */
.navto-search a {
	position: relative;
	overflow: visible;
}

.navto-search .fa {
	display: none;
}

.navto-search a::before {
	content: "";
	position: absolute;
	width: 9px;
	height: 9px;
	border: 2px solid rgba(255, 255, 255, .85);
	border-radius: 50%;
	top: 20px;
	left: calc(50% - 8px);
	box-sizing: border-box;
}

.navto-search a::after {
	content: "";
	position: absolute;
	width: 9px;
	height: 2px;
	background: rgba(255, 255, 255, .85);
	border-radius: 2px;
	top: 33px;
	left: calc(50% + 1px);
	transform: rotate(45deg);
}

/* ---------- 搜索框 ---------- */
.searchbox {
	background: transparent;
}

.search {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 999px;
	box-shadow: var(--shadow-md);
	overflow: hidden;
}

.search input.input_text {
	padding-left: 18px;
	line-height: 40px;
	height: 40px;
	border-radius: 999px 0 0 999px;
}

.search input.input_submit {
	background: linear-gradient(135deg, var(--primary), var(--accent));
	border-radius: 0 999px 999px 0;
	line-height: 40px;
	padding: 0 26px;
	font-size: 14px;
	transition: filter .2s ease;
}

.search input.input_submit:hover {
	filter: brightness(1.08);
}

.searchclose {
	z-index: 2;
}

/* ---------- 布局容器 ---------- */
article {
	margin-top: 24px;
}

.lbox,
.rbox {
	overflow: visible;
}

/* ---------- 卡片 ---------- */
.whitebg {
	background: var(--card);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	border: 1px solid rgba(15, 23, 42, .04);
	transition: box-shadow .25s ease;
}

.whitebg:hover {
	box-shadow: var(--shadow-md);
}

/* ---------- 区块标题 ---------- */
.htitle {
	font-size: 17px;
	font-weight: 700;
	color: var(--ink);
	line-height: 44px;
	border-bottom: 1px solid #f0f1f3;
}

.htitle::after {
	background: linear-gradient(90deg, var(--primary), var(--accent));
	width: 42px;
	height: 3px;
	border-radius: 3px;
	bottom: -1px;
}

.htitle:hover::after {
	width: 64px;
}

/* ---------- 轮播 Banner ---------- */
.banbox {
	border-radius: var(--radius);
	box-shadow: var(--shadow-md);
	background: #000;
}

.fader {
	border-radius: var(--radius);
}

.fader .slide img {
	border-radius: var(--radius);
}

.fader .pager_list li {
	background: rgba(255, 255, 255, .45);
	width: 18px;
	height: 5px;
	border-radius: 4px;
	transition: all .25s ease;
}

.fader .pager_list li.active,
.fader .pager_list li:hover {
	background: #fff;
	width: 28px;
}

/* ---------- 头条小块 ---------- */
.headline ul li,
.newspic li,
.topnews {
	border-radius: var(--radius);
}

.headline ul li img,
.newspic img,
.topnews img {
	opacity: .85;
}

/* 图片底部渐变遮罩，标题更易读 */
.headline ul li::after,
.newspic li::after,
.topnews::after {
	content: "";
	position: absolute;
	inset: 40% 0 0 0;
	background: linear-gradient(to top, rgba(0, 0, 0, .72), transparent);
	pointer-events: none;
}

.headline ul li span,
.newspic span,
.topnews span {
	z-index: 2;
	top: auto;
	bottom: 12px;
	padding: 0 16px;
	font-size: 14px;
	line-height: 1.5;
	text-shadow: 0 1px 4px rgba(0, 0, 0, .5);
}

/* ---------- 频道 Tab ---------- */
.tab_buttons {
	border-bottom: 1px solid #f0f1f3;
	margin-bottom: 16px;
}

.tab_buttons li {
	font-size: 15px;
	color: var(--ink-light);
	line-height: 44px;
	transition: color .2s ease;
}

.tab_buttons li:hover {
	color: var(--ink);
}

.newscurrent {
	color: var(--ink) !important;
	font-weight: 700;
}

.newscurrent::after {
	background: linear-gradient(90deg, var(--primary), var(--accent));
	height: 3px;
	border-radius: 3px;
	bottom: -1px;
}

/* ---------- 新闻列表（newstab 区，彻底废除悬停展开逻辑） ---------- */
.newslist {
	width: 63%;
}

/* 覆盖 base.css 的 height:22px / hover height:100% 展开规则 */
.newslist li,
.newslist li:hover,
.newslist:hover li:nth-child(1),
.newslist:hover li:nth-child(1):hover {
	height: auto !important;
	min-height: 0;
	background: transparent;
	padding: 10px 14px;
	border-radius: 8px;
	margin-bottom: 4px;
	box-sizing: border-box;
	overflow: hidden;
	transition: background .2s ease;
}

.newslist li:nth-child(1),
.newslist:hover li:nth-child(1) {
	background: rgba(15, 118, 110, .06);
}

.newslist li:hover,
.newslist:hover li:nth-child(1):hover {
	background: rgba(15, 118, 110, .1);
}

/* 标题 */
.newslist li a,
.newslist li:nth-child(1) a,
.newslist:hover li:nth-child(1) a,
.newslist:hover li:nth-child(1):hover a {
	height: auto;
	color: var(--ink);
	font-weight: 600;
	line-height: 1.6;
	transition: color .2s ease;
}

.newslist li:hover a,
.newslist li:nth-child(1):hover a {
	color: var(--primary);
}

/* 摘要常显，不再依赖悬停 */
.newslist li p {
	display: block;
	height: auto;
	margin-top: 3px;
	color: var(--ink-light);
	font-size: 13px;
	line-height: 1.6;
}

/* 序号徽标：改为行内对齐，避免浮动错位 */
.newsitem ul li i {
	display: inline-block;
	float: none;
	width: 18px;
	height: 18px;
	line-height: 18px;
	vertical-align: 2px;
	margin: 0 8px 0 0;
	border-radius: 5px;
	background: #d1d5db;
	color: #fff;
	font-style: normal;
	position: relative;
}

.newsitem ul li i::before {
	font-size: 10px;
	line-height: 18px;
	width: 18px;
	text-align: center;
}

.newsitem ul li:first-child i,
.newslist li:nth-child(1) i,
.newslist li:hover i,
.newslist:hover li:nth-child(1):hover i {
	background: linear-gradient(135deg, var(--primary), var(--accent)) !important;
}

/* ---------- 特别推荐 ---------- */
.zhuanti ul {
	padding: 6px 0 10px;
}

.zhuanti ul::before,
.zhuanti ul::after {
	display: none;
}

.zhuanti li {
	background: var(--card);
	border: 1px solid #f0f1f3;
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	transition: transform .25s ease, box-shadow .25s ease;
}

.zhuanti li:hover {
	background: var(--card);
	box-shadow: var(--shadow-lg);
	transform: translateY(-4px);
}

.ztpic {
	height: 120px;
	border-radius: 8px;
	background: #f1f5f9;
}

.zhuanti li b {
	font-size: 15px;
	white-space: normal;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	height: 26px;
	line-height: 26px;
	font-weight: 600;
}

.zhuanti li span {
	color: var(--ink-light);
	line-height: 1.7;
}

.readmore {
	color: var(--primary);
	font-weight: 600;
	font-size: 14px;
}

.readmore::before {
	color: var(--primary);
}

/* ---------- 博客列表 ---------- */
.bloglist li {
	border-bottom: 1px solid #f3f4f6;
	transition: background .2s ease;
	border-radius: 8px;
}

.bloglist li:hover {
	background: rgba(15, 118, 110, .03);
}

.blogtitle {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.5;
}

.bloglist li:hover .blogtitle a {
	color: var(--primary);
}

.blogpic {
	border-radius: 10px;
	box-shadow: var(--shadow-sm);
}

.blogpic i {
	background: rgba(15, 118, 110, .9);
	border-radius: 0 0 8px 0;
	padding: 3px 10px;
	font-size: 13px;
}

.blogtext {
	color: var(--ink-light);
	line-height: 1.8;
	margin-top: 12px;
}

.bloginfo {
	color: #9ca3af;
	font-size: 13px;
	margin-top: 12px;
}

.bloginfo span a {
	color: var(--primary);
}

a.viewmore {
	background: transparent;
	color: var(--primary);
	border: 1px solid rgba(15, 118, 110, .45);
	border-radius: 999px;
	padding: 3px 16px;
	font-size: 13px;
	transition: all .2s ease;
}

a.viewmore:hover {
	background: linear-gradient(135deg, var(--primary), var(--accent));
	color: #fff;
	border-color: transparent;
}

/* ---------- 右侧栏 ---------- */
.notice li {
	background: #f8fafc;
	border: 1px solid #f1f5f9;
	border-radius: 10px;
	font-size: 14px;
	padding: 8px 12px 8px 30px;
}

.notice li:hover {
	background: rgba(15, 118, 110, .05);
	box-shadow: none;
}

.notice li::before {
	background: var(--primary);
	top: 18px;
}

.paihang ul li {
	border-radius: 8px;
	padding-left: 10px;
	transition: background .2s ease;
}

.paihang ul li:nth-child(even) {
	background: #f8fafc;
}

.paihang ul li:hover {
	background: rgba(15, 118, 110, .06);
}

.paihang ul li i {
	border-radius: 5px;
	background: #d1d5db;
}

.paihang ul li:first-child i,
.paihang ul li:nth-child(2) i,
.paihang ul li:nth-child(3) i {
	background: linear-gradient(135deg, #f97316, #ef4444);
}

/* ---------- 页脚 ---------- */
footer {
	background: #111827;
	border-top: none;
	color: #9ca3af;
	padding: 40px 0 30px;
	position: relative;
}

footer::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, #0f766e, #14b8a6, #f59e0b);
}

.endnav b {
	background: linear-gradient(90deg, #5eead4, #fcd34d);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-size: 16px;
}

.endnav p {
	line-height: 1.9;
}

footer a {
	color: #9ca3af;
}

footer a:hover {
	color: #5eead4;
}

/* ---------- 吸顶导航（桌面端） ---------- */
@media screen and (min-width: 1024px) {
	header {
		position: sticky;
		top: 0;
		z-index: 999;
	}
}

/* ---------- 顶部阅读进度条 ---------- */
.scroll-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 0;
	background: linear-gradient(90deg, #0f766e, #2dd4bf);
	z-index: 1000;
	transition: width .1s linear;
	pointer-events: none;
}

/* ---------- 搜索框聚焦光晕 ---------- */
.search input.input_text:focus {
	box-shadow: 0 0 0 3px rgba(15, 118, 110, .15) inset;
}

.search input.input_text {
	transition: box-shadow .2s ease;
}

/* ---------- Tab 下划线滑动过渡 ---------- */
.tab_buttons li::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -1px;
	height: 3px;
	width: 0;
	border-radius: 3px;
	background: linear-gradient(90deg, var(--primary), var(--accent));
	transform: translateX(-50%);
	transition: width .25s ease;
}

.tab_buttons li:hover::after {
	width: 40px;
}

.tab_buttons li.newscurrent::after {
	width: 42px;
}

/* ---------- 区块入场动画 ---------- */
.reveal {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity .5s ease, transform .5s ease;
}

.reveal.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ---------- 返回顶部（修正背景层） ---------- */
.top {
	background-image: linear-gradient(135deg, var(--primary), var(--accent)) !important;
	border-radius: 50%;
	box-shadow: var(--shadow-md);
	opacity: 0;
	visibility: hidden;
	transition: transform .2s ease, box-shadow .2s ease, opacity .3s ease, visibility .3s ease;
}

.top.is-visible {
	opacity: 1;
	visibility: visible;
}

.top:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-lg);
}

/* ---------- 页脚版权分隔 ---------- */
.endnav p:last-child {
	border-top: 1px solid rgba(255, 255, 255, .08);
	padding-top: 16px;
	margin-top: 16px;
	line-height: 2;
}

/* ---------- 链接无障碍焦点 ---------- */
a:focus-visible,
button:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: 4px;
}

/* ---------- 移动端微调 ---------- */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-thumb {
	background: #cbd5e1;
	border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
	background: #94a3b8;
}

/* ---------- 移动端微调 ---------- */
@media screen and (max-width: 1023px) {
	header {
		height: 50px;
	}

	.logo {
		line-height: 50px;
	}

	nav {
		top: 52px;
	}

	/* 移动端下拉菜单：深色底替换旧青色块 */
	#starlist li,
	#starlist li a {
		background: rgba(17, 24, 39, .97) !important;
		border-bottom: 1px solid rgba(255, 255, 255, .07) !important;
		text-align: left;
		box-sizing: border-box;
	}

	/* 通栏菜单项，替换旧模板 55% 宽的设定 */
	#starlist li {
		width: 100%;
	}

	#starlist li a {
		width: 100%;
		padding: 0 24px;
	}

	/* 去掉旧模板用 padding-bottom:100% 撑高度的 hack，改由 ul 提供底部留白 */
	#starlist li:last-child {
		padding-bottom: 0 !important;
	}

	#starlist {
		padding-bottom: 60px;
	}

	#starlist .current-menu-item > a,
	#starlist .current_page_item > a {
		background: rgba(15, 118, 110, .22) !important;
		box-shadow: inset 3px 0 0 var(--accent);
		color: #fff;
		font-weight: 600;
	}
}

@media screen and (max-width: 720px) {
	.whitebg {
		padding: 14px;
		border-radius: 10px;
	}

	.logo img {
		margin-top: 0;
		max-height: 30px;
	}

	.fader {
		height: 200px;
	}

	.zhuanti li:hover {
		transform: none;
	}

	.blogtitle {
		font-size: 16px;
	}

	/* 频道 Tab 区：图片块与列表纵向堆叠 */
	.newspic {
		float: none;
		width: 100%;
		height: auto;
	}

	.newspic ul {
		display: flex;
		gap: 10px;
	}

	.newspic li {
		flex: 1;
		height: 110px;
		margin-bottom: 0;
	}

	.newspic span {
		padding: 0 10px;
		font-size: 13px;
		bottom: 8px;
	}

	.newslist {
		float: none;
		width: 100%;
		margin-top: 12px;
	}

	.newslist li {
		padding: 8px 10px;
	}

	.newslist li p {
		font-size: 12px;
	}
}


@media screen and (max-width: 1023px) {
	
	#starlist {
		padding-bottom: 60px;
		        width: 60%;
        background-color: #111827;
	}
	
}
	
@media screen and (max-width: 1023px) {
    header {
        position: fixed;
        z-index: 999;
        top: 0px;
    }
}
header {
    background: #3F51B5;
}