/* Khối Hỏi đáp – faq/accordion (xếp chồng). Mobile trước, mốc 640px / 1024px. */

.vh-faq {
	display: grid;
	gap: 0.75rem;
	max-width: 52rem;
}

.vh-faq__item {
	background: var(--vh-color-card);
	color: var(--vh-color-text);
	border: 1px solid var(--vh-color-border);
	border-radius: var(--vh-radius-card);
}

.vh-faq__item[open] {
	border-color: var(--vh-color-border-strong);
}

/* Dòng câu hỏi cao tối thiểu 56px, cả dòng bấm được. */
.vh-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 56px;
	padding: 0.75rem var(--vh-card-pad);
	border-radius: var(--vh-radius-card);
	font-weight: var(--vh-fw-medium);
	font-size: var(--vh-fs-body);
	line-height: var(--vh-lh-body);
	cursor: pointer;
	list-style: none;
}

.vh-faq__q::-webkit-details-marker {
	display: none;
}

.vh-faq__q::marker {
	content: "";
}

.vh-faq__q:hover .vh-faq__q-text {
	color: var(--vh-color-primary-hover);
}

.vh-faq__q:focus-visible {
	outline: 3px solid var(--vh-color-focus);
	outline-offset: 2px;
}

.vh-faq__chev {
	flex: none;
	color: var(--vh-color-primary);
}

.vh-faq__item[open] .vh-faq__chev {
	transform: rotate(180deg);
}

.vh-faq__a {
	padding: 0 var(--vh-card-pad) var(--vh-card-pad);
	color: var(--vh-color-muted);
	font-size: var(--vh-fs-body);
	line-height: var(--vh-lh-body);
}

.vh-faq__a p {
	margin: 0 0 0.75rem;
}

.vh-faq__a p:last-child {
	margin-bottom: 0;
}

@media (prefers-reduced-motion: no-preference) {
	.vh-faq__chev {
		transition: transform 0.2s ease;
	}
}

@media (min-width: 1024px) {
	.vh-faq__q {
		font-size: var(--vh-fs-lead);
	}
}