/* =============================================================================
   16-faq.css — template_faq.php
   The accordions are native <details>/<summary>, so they open and close with
   no JavaScript and stay keyboard-accessible for free.
   ============================================================================= */

details.faq {
	margin: 0 0 0.75rem;
	padding: 0.625rem 0.75rem;
	border: 1px solid var(--js-beige);
	border-radius: 8px;
	background: var(--js-white);
}

details.faq > summary {
	cursor: pointer;
	font-family: var(--js-font-bold);
	font-size: 1.5rem;
	line-height: 1.45;
	/* Two rules to remove the default triangle: list-style covers Firefox and
	   modern Chrome, the ::-webkit- pseudo-element covers older Safari. */
	list-style: none;
}

details.faq > summary::-webkit-details-marker {
	display: none;
}

/* Our own chevron, rotated when the panel is open. */
details.faq > summary::after {
	content: "▾";
	float: right;
	transition: transform 0.15s ease;
}

details.faq[open] > summary::after {
	transform: rotate(180deg);
}

details.faq p {
	margin: 0.625rem 0 0;
}

@media (prefers-reduced-motion: reduce) {
	details.faq > summary::after {
		transition: none;
	}
}
