/*
 * 页面专属样式：help
 *
 * 由交付包样板的 <style> 提取，共用部分已经上移到 components.css。
 */

.toast {
	position:fixed;
	left:50%;
	bottom:26px;
	transform:translateX(-50%) translateY(12px);
	background:var(--ink);
	color:#fff;
	font-size:13px;
	padding:11px 20px;
	border-radius:999px;
	opacity:0;
	pointer-events:none;
	transition:opacity .18s, transform .18s;
	z-index:80;
	max-width:88vw;
	text-align:center;
	line-height:1.5;
}
.field-err {
	font-size:11.8px;
	color:var(--accent);
	margin-top:6px;
	min-height:15px;
}
input.invalid, textarea.invalid {
	border-color:var(--accent) !important;
	background:var(--accent-soft) !important;
}
.page-head {
	margin-bottom:32px;
	text-align:center;
}
.page-head h1 {
	font-size:28px;
	margin-bottom:10px;
}
.page-head p {
	font-size:14px;
	color:var(--ink-soft);
	margin:0;
}
.search-box {
	display:flex;
	align-items:center;
	gap:10px;
	border:1px solid var(--border);
	border-radius:999px;
	padding:12px 18px;
	margin:24px auto 40px;
	max-width:520px;
	box-shadow:var(--shadow);
}
.search-box svg {
	width:16px;
	height:16px;
	color:var(--ink-soft);
	flex-shrink:0;
}
.search-box input {
	border:none;
	outline:none;
	font-size:14px;
	font-family:'Inter',sans-serif;
	flex:1;
	color:var(--ink);
}
.quick-links {
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:14px;
	margin-bottom:48px;
}
.quick-card {
	border:1px solid var(--border);
	border-radius:var(--radius);
	padding:20px;
	text-align:center;
	cursor:pointer;
}
.quick-card:hover { border-color:var(--ink); }
.quick-card .qi {
	width:36px;
	height:36px;
	border-radius:10px;
	background:var(--accent-soft);
	color:var(--accent);
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0 auto 12px;
}
.quick-card .qi svg {
	width:18px;
	height:18px;
}
.quick-card .qt {
	font-size:13.5px;
	font-weight:600;
}
.section-title {
	font-size:17px;
	margin-bottom:16px;
}
.faq-list {
	border:1px solid var(--border);
	border-radius:var(--radius);
	overflow:hidden;
	margin-bottom:48px;
}
.faq-item { border-bottom:1px solid var(--border); }
.faq-item:last-child { border-bottom:none; }
.faq-q {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:16px 20px;
	cursor:pointer;
	font-size:14px;
	font-weight:500;
}
.faq-q:hover { background:var(--bg-soft); }
.faq-q .chev {
	color:var(--ink-soft);
	transition:transform .18s ease;
	flex-shrink:0;
}
.faq-q .chev svg {
	width:14px;
	height:14px;
}
.faq-item.open .faq-q .chev { transform:rotate(180deg); }
.faq-a {
	display:none;
	padding:0 20px 18px;
	font-size:13.3px;
	color:#4B4B52;
	line-height:1.7;
}
.faq-item.open .faq-a { display:block; }
.contact-card {
	border:1px solid var(--border);
	border-radius:var(--radius);
	background:var(--bg-soft);
	padding:28px 30px;
}
.contact-card h2 {
	font-size:16px;
	margin-bottom:4px;
}
.contact-card .sub {
	font-size:12.5px;
	color:var(--ink-soft);
	margin-bottom:20px;
}
.field select, .field input, .field textarea {
	width:100%;
	background:#fff;
	border:1px solid var(--border);
	color:var(--ink);
	padding:10px 12px;
	font-size:13.5px;
	font-family:'Inter',sans-serif;
	border-radius:10px;
	outline:none;
}
.field textarea {
	min-height:100px;
	resize:vertical;
}
.field select:focus, .field input:focus, .field textarea:focus { border-color:var(--ink); }
.submit-btn {
	background:var(--ink);
	color:#fff;
	border:none;
	padding:12px;
	font-size:14px;
	font-weight:600;
	border-radius:10px;
	cursor:pointer;
}
.response-note {
	font-size:11.5px;
	color:var(--ink-soft);
	margin-top:12px;
}
@media (max-width:720px) {
  .quick-links { grid-template-columns:1fr; }
}