/* 品睿教育 复试辅导页 fushi.php 专属样式
   2026-09-10 v2 重写
   注意：本文件仅在复试页加载，故使用元素级 reset（特异性 1），
   保证后代单类选择器（特异性 10）可自由覆盖 padding，避免 26qrz 的 .prz 前缀坑。
   禁止在此文件使用 ../ 相对路径图片（本地预览会失效），本页面零图片全部由 CSS 绘制。 */

/* ===== 0. 基础重置 =====
   base.css 第 1 行已有元素级 reset（margin/padding 归零，特异性=1），此处不再重复。
   【关键】绝不可写成 ".fsv h1,.fsv p{padding:0}" —— 那会变成特异性 11，
   压掉所有单类选择器（10）里的 padding，导致 FAQ、导向地块等缩进全部失效（26qrz 踩过此坑）。 */
.fsv ul, .fsv li { list-style: none; }
.fsv em { font-style: normal; }
.fsv a { text-decoration: none; }

.fsv {
	--w: 1100px;
	--rd: #C30A10;
	--rd-d: #a5080d;
	--tx: #333;
	--tx2: #4d4d4d;
	--tx3: #666;
	--line: #e6e6e6;
	--bg: #fff;
	--soft: #f7f8fa;
	font-size: 16px;
	color: var(--tx);
	line-height: 1.9;
	background: var(--bg);
}

/* ===== 1. 版块骨架 ===== */
.sec { padding: 58px 0; }
.sec__in { width: var(--w); margin: 0 auto; }
.sec__head { text-align: center; margin-bottom: 38px; }
.sec__ttl { font-size: 30px; font-weight: 700; color: #222; line-height: 1.5; }
.sec__ttl::after {
	content: "";
	display: block;
	width: 56px;
	height: 3px;
	background: var(--rd);
	margin: 16px auto 0;
}
.sec__sub { font-size: 16px; color: var(--tx3); margin-top: 14px; }
.sub__ttl {
	font-size: 21px;
	font-weight: 700;
	color: #222;
	text-align: center;
	margin: 44px 0 26px;
}

/* ===== 2. 首屏 hero（深蓝渐变，区别于其他落地页） ===== */
.hero { background: linear-gradient(135deg, #1b3a5c 0%, #26547c 100%); padding: 52px 0 46px; }
.hero__in {
	width: var(--w);
	margin: 0 auto;
	display: flex;
	gap: 46px;
	align-items: center;
}
.hero__l { flex: 1; }
.hero__r { width: 380px; flex: none; }
.hero__tag {
	display: inline-block;
	background: rgba(255, 255, 255, .16);
	color: #fff;
	font-size: 14px;
	padding: 5px 15px;
	border-radius: 16px;
	border: 1px solid rgba(255, 255, 255, .3);
	margin-bottom: 18px;
}
.hero__h1 { font-size: 38px; line-height: 1.42; font-weight: 700; color: #fff; }
.hero__h1 em {
	display: block;
	font-size: 20px;
	font-weight: 400;
	color: #bcd6ec;
	margin-top: 12px;
	line-height: 1.7;
}
.hero__p { font-size: 16px; color: #d3e3f2; line-height: 1.95; margin-top: 18px; }
.hero__trust {
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, .22);
}
.hero__trust li {
	font-size: 15px;
	color: #cadff1;
	line-height: 2.1;
	padding-left: 20px;
	position: relative;
}
.hero__trust li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 14px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #7fb2dd;
}

/* 表单 */
.form { background: #fff; border-radius: 8px; padding: 26px 24px 22px; box-shadow: 0 10px 30px rgba(0, 0, 0, .18); }
.form__ttl { font-size: 19px; font-weight: 700; color: var(--rd); text-align: center; }
.form__desc { font-size: 13px; color: #888; text-align: center; margin-top: 6px; }
.form__q { font-size: 14px; color: var(--tx2); font-weight: 700; margin-top: 16px; }
.form__opts { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 9px; }
.form__opts label { cursor: pointer; }
.form__opts input { display: none; }
.form__opts span {
	display: block;
	font-size: 13px;
	color: var(--tx2);
	background: #f4f5f7;
	border: 1px solid #e2e4e8;
	border-radius: 4px;
	padding: 7px 11px;
	line-height: 1.3;
}
.form__opts input:checked + span { background: #fdecec; border-color: var(--rd); color: var(--rd); font-weight: 700; }
.form__ip {
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 0 12px;
	font-size: 14px;
	color: var(--tx);
	margin-top: 10px;
	background: #fff;
	box-sizing: border-box;
}
.form__ip:focus { border-color: var(--rd); outline: none; }
.form__btn {
	display: block;
	width: 100%;
	height: 46px;
	line-height: 46px;
	background: var(--rd);
	color: #fff;
	font-size: 17px;
	font-weight: 700;
	border: 0;
	border-radius: 4px;
	margin-top: 16px;
	cursor: pointer;
}
.form__btn:hover { background: var(--rd-d); }
.form__note { font-size: 12px; color: #999; text-align: center; margin-top: 10px; line-height: 1.7; }

/* ===== 3. 时间轴 ===== */
.tmline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; position: relative; }
.tmline__n { text-align: center; padding: 0 10px; position: relative; }
.tmline__n::before {
	content: "";
	position: absolute;
	top: 15px;
	left: 50%;
	width: 100%;
	height: 2px;
	background: #e8e8e8;
	z-index: 0;
}
.tmline__n:first-child::before { left: 50%; width: 50%; }
.tmline__n:last-child::before { width: 50%; }
.tmline__k {
	position: relative;
	z-index: 1;
	display: block;
	width: 34px;
	height: 34px;
	line-height: 34px;
	margin: 0 auto 12px;
	background: var(--rd);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	border-radius: 50%;
	box-shadow: 0 0 0 4px #fdecec;
}
.tmline__t { font-size: 16px; font-weight: 700; color: #222; line-height: 1.6; }
.tmline__d { font-size: 13px; color: var(--tx3); line-height: 1.75; margin-top: 6px; }
.tmline__warn {
	background: #fff8e6;
	border: 1px solid #f2dfb0;
	border-left: 4px solid #e8a33d;
	border-radius: 5px;
	padding: 16px 20px;
	font-size: 15px;
	color: #6b5320;
	line-height: 1.9;
	margin-top: 32px;
}
.tmline__warn em { color: #a8541a; font-weight: 700; }

/* ===== 4. 四类人群 ===== */
.who4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.who4__c {
	background: #fff;
	border: 1px solid var(--line);
	border-top: 3px solid #1b3a5c;
	border-radius: 6px;
	padding: 22px 20px;
}
.who4__tag {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	background: #1b3a5c;
	padding: 3px 11px;
	border-radius: 3px;
	margin-bottom: 12px;
}
.who4__t { font-size: 18px; font-weight: 700; color: #222; line-height: 1.6; }
.who4__d { font-size: 14px; color: var(--tx3); line-height: 1.9; margin-top: 10px; }
.who4__a {
	font-size: 14px;
	color: var(--rd);
	font-weight: 700;
	line-height: 1.8;
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px dashed #ddd;
}

/* ===== 5. 复试考什么 ===== */
.subj { display: flex; flex-direction: column; gap: 16px; }
.subj__i {
	display: grid;
	grid-template-columns: 210px 1fr 1fr 1fr;
	gap: 22px;
	background: var(--soft);
	border-radius: 6px;
	padding: 22px 24px;
	border-left: 4px solid #2d6ca8;
}
.subj__t {
	font-size: 19px;
	font-weight: 700;
	color: #1b3a5c;
	line-height: 1.6;
	padding-top: 2px;
}
.subj__lb {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	background: #2d6ca8;
	display: inline-block;
	padding: 2px 10px;
	border-radius: 3px;
	margin-bottom: 7px;
	line-height: 1.7;
}
.subj__x { font-size: 14px; color: var(--tx2); line-height: 1.85; }

/* ===== 6. 三阶课程 ===== */
.cls3 { display: flex; flex-direction: column; gap: 18px; }
.cls3__c {
	display: grid;
	grid-template-columns: 250px 1fr;
	gap: 26px;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 6px;
	padding: 24px 26px;
}
.cls3__step {
	display: inline-block;
	font-size: 20px;
	color: var(--rd);
	font-weight: 700;
	border: 2px solid var(--rd);
	border-radius: 3px;
	padding: 2px 10px;
	margin-bottom: 10px;
	line-height: 1.8;
	text-align: center;
}
.cls3__t { font-size: 22px; font-weight: 700; color: #222; line-height: 2; }
.cls3__g { font-size: 14px; color: var(--tx3); margin-top: 8px; line-height: 1.8; }
.cls3__l li {
	font-size: 15px;
	color: var(--tx2);
	line-height: 1.9;
	padding-left: 16px;
	position: relative;
	margin-bottom: 8px;
}
.cls3__l li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 12px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #a8c6e2;
}
.cls3__l li b { color: #1b3a5c; font-weight: 700; }

/* 专业课标签切换 */
.kc { border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.kc__tab { display: flex; background: #eef3f8; border-bottom: 1px solid var(--line); }
.kc__tab button {
	flex: 1;
	height: 46px;
	line-height: 46px;
	background: transparent;
	border: 0;
	border-right: 1px solid #dde5ee;
	font-size: 15px;
	color: var(--tx2);
	cursor: pointer;
	font-family: inherit;
}
.kc__tab button:last-child { border-right: 0; }
.kc__tab button.is-on { background: #1b3a5c; color: #fff; font-weight: 700; }
.kc__panel { display: none; padding: 20px 24px; }
.kc__panel.is-on { display: block; }
.kc__l li {
	font-size: 15px;
	color: var(--tx2);
	line-height: 1.9;
	padding-left: 16px;
	position: relative;
	margin-bottom: 9px;
}
.kc__l li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 12px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #a8c6e2;
}
.kc__l li b { color: #1b3a5c; font-weight: 700; }

/* ===== 7. 单品班型 ===== */
.plan { display: grid; grid-template-columns: 340px 1fr; gap: 22px; }
.plan__price {
	background: linear-gradient(160deg, #fff5f5 0%, #ffeaea 100%);
	border: 1px solid #f5cfcf;
	border-radius: 8px;
	padding: 28px 26px;
	text-align: center;
}
.plan__nm { font-size: 18px; font-weight: 700; color: #222; }
.plan__num { font-size: 46px; font-weight: 700; color: var(--rd); line-height: 1.3; margin-top: 8px; }
.plan__num span { font-size: 19px; font-weight: 400; margin-left: 4px; }
.plan__scope { font-size: 14px; color: var(--tx2); margin-top: 6px; line-height: 1.8; }
.plan__btn {
	display: block;
	height: 46px;
	line-height: 46px;
	background: var(--rd);
	color: #fff;
	font-size: 17px;
	font-weight: 700;
	border-radius: 4px;
	margin-top: 18px;
}
.plan__btn:hover { background: var(--rd-d); }
.plan__tip { font-size: 12px; color: #999; line-height: 1.75; margin-top: 12px; }
.plan__list { background: var(--soft); border: 1px solid var(--line); border-radius: 8px; padding: 26px 28px; }
.plan__lt { font-size: 20px; font-weight: 700; color: #222; margin-bottom: 16px; }
.plan__ul li {
	font-size: 15px;
	color: var(--tx2);
	line-height: 1.9;
	padding-left: 22px;
	position: relative;
	margin-bottom: 10px;
}
.plan__ul li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--rd);
	font-weight: 700;
}

/* 退费保障 */
.guar {
	margin-top: 22px;
	background: #fff;
	border: 2px solid var(--rd);
	border-radius: 8px;
	padding: 24px 30px;
	text-align: center;
}
.guar__t {
	display: inline-block;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	background: var(--rd);
	padding: 3px 14px;
	border-radius: 3px;
	line-height: 1.8;
}
.guar__m { font-size: 24px; font-weight: 700; color: var(--rd); margin-top: 12px; line-height: 1.6; }
.guar__n { font-size: 13px; color: var(--tx3); margin-top: 12px; line-height: 1.85; }

/* ===== 8. 师资 ===== */
.trole { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 30px; }
.trole__i { background: #1b3a5c; border-radius: 6px; padding: 18px 16px; text-align: center; }
.trole__n { font-size: 16px; font-weight: 700; color: #fff; line-height: 1.6; }
.trole__d { font-size: 13px; color: #b9d2e8; margin-top: 6px; line-height: 1.7; }

/* 师资卡：单行无缝循环滚动
   原理：12 张卡固定宽 356px 排成一行 → JS 再复制一份接在后面（共 24 张）
   → 整条轨道匀速左移，位移 50% 时正好是一份卡片的宽度，画面与起点完全重合 = 无缝
   未加 .is-run 时（JS 未生效）退化为可横向拖动的单行，不会变回竖排长条 */
.tchs__box {
	position: relative;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 70px, #000 calc(100% - 70px), transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 70px, #000 calc(100% - 70px), transparent 100%);
}
.tchs__box.is-run { overflow: hidden; }
.tchs { display: flex; align-items: stretch; }
.tchs.is-run {
	width: max-content;
	will-change: transform;
	animation-name: tchsRun;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}
.tchs__box:hover .tchs.is-run,
.tchs.is-run.is-pause { animation-play-state: paused; }
@keyframes tchsRun {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}
.tch {
	flex: 0 0 356px;
	margin-right: 16px;
	box-sizing: border-box;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 6px;
	padding: 20px 20px 18px;
}
.tch__nm { font-size: 18px; font-weight: 700; color: #222; line-height: 1.5; }
.tch__nm span { font-size: 13px; font-weight: 400; color: var(--tx3); margin-left: 6px; }
.tch__rl {
	display: inline-block;
	font-size: 13px;
	color: #1b3a5c;
	background: #eef3f8;
	border-radius: 3px;
	padding: 2px 10px;
	margin-top: 8px;
	line-height: 1.8;
}
.tch__d { font-size: 14px; color: var(--tx3); line-height: 1.85; margin-top: 10px; }

/* ===== 9. 调剂 ===== */
.tj {
	display: grid;
	grid-template-columns: 1fr 340px;
	gap: 26px;
	background: linear-gradient(135deg, #17405f 0%, #23618c 100%);
	border-radius: 8px;
	padding: 34px 36px;
}
.tj__t { font-size: 26px; font-weight: 700; color: #fff; line-height: 1.5; }
.tj__d { font-size: 15px; color: #cfe1f0; line-height: 1.95; margin-top: 14px; }
.tj__d em { color: #ffd9a0; font-weight: 700; }
.tj__l2 { margin-top: 16px; }
.tj__l2 li {
	font-size: 15px;
	color: #d5e5f2;
	line-height: 1.95;
	padding-left: 20px;
	position: relative;
}
.tj__l2 li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 14px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #7fb2dd;
}
.tj__r { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .25); border-radius: 6px; padding: 26px 24px; text-align: center; }
.tj__q { font-size: 18px; font-weight: 700; color: #fff; line-height: 1.6; }
.tj__a { font-size: 14px; color: #cfe1f0; margin-top: 12px; line-height: 1.85; }
.tj__btn {
	display: block;
	height: 44px;
	line-height: 44px;
	background: #fff;
	color: #1b3a5c;
	font-size: 16px;
	font-weight: 700;
	border-radius: 4px;
	margin-top: 18px;
}
.tj__btn:hover { background: #ffd9a0; }

/* ===== 10. FAQ ===== */
.faq { display: flex; flex-direction: column; gap: 12px; }
.faq__i { background: var(--soft); border-radius: 6px; padding: 18px 22px; }
.faq__q {
	font-size: 17px;
	font-weight: 700;
	color: #222;
	line-height: 1.7;
	padding-left: 26px;
	position: relative;
}
.faq__q::before {
	content: "Q";
	position: absolute;
	left: 0;
	top: 4px;
	width: 18px;
	height: 18px;
	line-height: 18px;
	text-align: center;
	background: var(--rd);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	border-radius: 3px;
}
.faq__a { font-size: 15px; color: var(--tx2); line-height: 1.95; margin-top: 10px; padding-left: 26px; }

/* CTA 条 */
.cta { margin-top: 34px; background: #fdecec; border: 1px solid #f5cfcf; border-radius: 8px; padding: 30px; text-align: center; }
.cta__t { font-size: 20px; font-weight: 700; color: #222; line-height: 1.6; }
.cta__btn {
	display: inline-block;
	background: var(--rd);
	color: #fff;
	font-size: 17px;
	font-weight: 700;
	padding: 13px 42px;
	border-radius: 4px;
	margin-top: 18px;
}
.cta__btn:hover { background: var(--rd-d); }

/* ===== 11. 相关阅读 ===== */
.read { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 22px; }
.read li {
	font-size: 15px;
	line-height: 1.9;
	padding-left: 18px;
	position: relative;
}
.read li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 13px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #c9ced4;
}
.read li a { color: var(--tx2); }
.read li a:hover { color: var(--rd); }

/* ===== 12. 窄屏兜底（本站为固定宽设计，仅防破版，不改变布局） =====
   【重要】本页 viewport 声明为 width=1100，手机上该断点必然命中。
   因此这里只能改容器宽度，绝不能改布局——一旦降列（grid 改单列 / hero 改竖排），
   手机端就会和电脑端长得完全不一样。26qrz.css 用的是同一套写法。 */
@media (max-width: 1140px) {
	.hero__in, .sec__in { width: 96%; }
}
