/* Hubaux Avocats — page FAQ (page-head partagé dans tokens.css) */
.page-head-icon { flex: none; width: clamp(110px, 14vw, 170px); height: clamp(110px, 14vw, 170px); }
.page-head-icon img { width: 100%; height: 100%; object-fit: contain; opacity: 0.1; animation: icon-figure8 14s ease-in-out infinite, icon-fade 14s ease-in-out infinite; }
@keyframes icon-figure8 { 0%, 100% { transform: translate(0, 0); } 12.5% { transform: translate(10px, -8px); } 25% { transform: translate(0, -14px); } 37.5% { transform: translate(-10px, -8px); } 50% { transform: translate(0, 0); } 62.5% { transform: translate(10px, 8px); } 75% { transform: translate(0, 14px); } 87.5% { transform: translate(-10px, 8px); } }
@keyframes icon-fade { 0%, 100% { opacity: 0.1; } 50% { opacity: 0.4; } }
@media (prefers-reduced-motion: reduce) { .page-head-icon img { animation: none; opacity: 0.1; } }

.faq { padding: 0 0 calc(4 * var(--leading)); }
.faq-item { border-top: 2px solid var(--color-divider); }
.faq-list .faq-item:last-child { border-bottom: 2px solid var(--color-divider); }
.faq-item summary { list-style: none; display: flex; justify-content: space-between; align-items: baseline; gap: 24px; padding: calc(1 * var(--leading)) 0; cursor: pointer; font-family: var(--font-heading); font-weight: 500; font-size: 19px; letter-spacing: -0.005em; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary .faq-mark { flex: none; font-size: 22px; color: var(--color-blue); transition: transform 0.25s ease; }
.faq-item[open] summary .faq-mark { transform: rotate(45deg); display: inline-block; }
.faq-item p { font-size: 15.5px; line-height: var(--leading); color: color-mix(in srgb, var(--color-text) 78%, transparent); margin: 0 0 var(--half); max-width: 62ch; }
.faq-item > :last-child { margin-bottom: calc(1 * var(--leading)); }
.faq-ul { font-size: 15.5px; line-height: var(--leading); color: color-mix(in srgb, var(--color-text) 78%, transparent); margin: 0 0 var(--half); padding-left: 20px; max-width: 62ch; list-style: none; }
.faq-ul li { position: relative; }
.faq-ul li::before { content: "—"; position: absolute; left: -20px; color: var(--color-blue); }
