/**
 * FAQ page (Figma 173:1764) and the V/FAQ item accordion (core/details.voll-faq-item).
 * Accordion = UI: no fade. Opening: height 300 ms var(--fade-ease) where ::details-content is supported, instant elsewhere.
 */

/* --------------------------------------------------------------------------
   Header: kicker, H1, intro, theme filters
   -------------------------------------------------------------------------- */

.voll-faq-entete { gap: 24px; }
.voll-faq-entete .voll-intro-page { max-width: 628px; }

.voll-filtres.voll-faq__filtres ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}
.voll-filtres.voll-faq__filtres a {
	display: block;
	padding: 10px 20px;
	font-size: 16px;
	line-height: 1.5;
}

@media (min-width: 768px) {
	.voll-filtres.voll-faq__filtres ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
}
@media (min-width: 1024px) {
	.voll-filtres.voll-faq__filtres ul { display: flex; flex-wrap: wrap; gap: 12px; }
	.voll-filtres.voll-faq__filtres a { display: inline-block; }
}

/* --------------------------------------------------------------------------
   Themes: H2 (3 columns) + items (8 columns) on desktop, stacked below
   -------------------------------------------------------------------------- */

.voll-faq-theme {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 8px var(--gouttiere);
	align-items: start;
	padding-block: 0 clamp(48px, 4.57vw + 30px, 96px);
}
.voll-faq-theme[hidden] { display: none; }
.voll-faq-theme:last-child,
.voll-faq-theme:has(+ :not(.voll-faq-theme)) { padding-bottom: var(--section); }

.voll-faq-theme > h2 {
	font-size: var(--wp--preset--font-size--carte);
	line-height: 1.15;
}

@media (min-width: 1024px) {
	.voll-faq-theme { grid-template-columns: repeat(12, minmax(0, 1fr)); }
	.voll-faq-theme > h2 { grid-column: 1 / span 3; }
	.voll-faq-theme > .voll-faq-theme__items { grid-column: 5 / -1; }
}

/* --------------------------------------------------------------------------
   V/FAQ item – accordion
   -------------------------------------------------------------------------- */

.voll-faq-item {
	border-bottom: 1px solid var(--brun-nuit);
	padding-block: 28px;
	margin: 0;
	interpolate-size: allow-keywords;
}
.voll-faq-item > summary {
	display: flex;
	align-items: flex-start;
	gap: 24px;
	list-style: none;
	cursor: pointer;
}
.voll-faq-item > summary::-webkit-details-marker { display: none; }
.voll-faq-item > summary::marker { content: ""; }

.voll-faq-item__question {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	font-family: var(--serif);
	font-weight: 500;
	font-size: clamp(22px, 0.57vw + 19.8px, 28px);
	line-height: 1.2;
}
.voll-faq-item__icone {
	flex: none;
	font-family: var(--sans);
	font-size: clamp(22px, 0.57vw + 19.8px, 28px);
	line-height: 1.2;
}
.voll-faq-item__icone::before { content: "+"; }
.voll-faq-item[open] .voll-faq-item__icone::before { content: "−"; }

.voll-faq-item > :not(summary) { margin-block: 16px 0; }
.voll-faq-item > :not(summary) + :not(summary) { margin-top: 12px; }
.voll-faq-item .wp-block-list { padding-left: 0; }

/* Height transition (supporting browsers). The answer text itself never fades. */
.voll-faq-item::details-content {
	block-size: 0;
	overflow: clip;
	transition: block-size 300ms var(--fade-ease), content-visibility 300ms var(--fade-ease) allow-discrete;
}
.voll-faq-item[open]::details-content { block-size: auto; }

@media (prefers-reduced-motion: reduce) {
	.voll-faq-item::details-content { transition: none; }
}

/* Editor: keep the details block readable */
.editor-styles-wrapper .voll-faq-item > summary { font-family: var(--serif); font-size: 28px; }
