/* Najczęstsze pytania: harmonijka na elementach details. */
.faq { padding: var(--space-16) 0; background: var(--color-paper); }
.faq-list { margin: var(--space-8) 0 0; max-width: 46rem; border-top: 1px solid var(--color-line); }
.faq-list details { border-bottom: 1px solid var(--color-line); }
.faq-list summary { display: flex; justify-content: space-between; gap: var(--space-4); align-items: center; padding: var(--space-5) 0; font-family: var(--font-display); font-variation-settings: 'SOFT' 100; font-weight: 340; font-size: clamp(1.2rem, 3.6vw, 1.55rem); letter-spacing: -.02em; line-height: 1.2; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: '+'; flex: 0 0 auto; font-family: var(--font-body); font-size: 1.5rem; font-weight: 300; transition: transform .3s ease; }
.faq-list details[open] summary::after { transform: rotate(45deg); }
.faq-list summary:focus-visible { outline: 2px solid var(--color-sage-dark); outline-offset: 2px; }
.faq-list p { margin: 0 0 var(--space-5); max-width: 40rem; color: #4d5551; }
.faq-list p a { text-decoration: underline; text-underline-offset: .2em; }
@media (min-width: 48rem) { .faq { padding: var(--space-20) 0; } }
@media (prefers-reduced-motion: reduce) { .faq-list summary::after { transition: none; } }
