/* FAQ module (modules/faq/faq.php) - los bestand, wordt niet door de SCSS-build overschreven */

.faq_container { width: 100%; max-width: 900px; margin: 0 auto; float: none; clear: both; }

.faq_titel { margin-bottom: 30px; text-align: center; }

.faq_item { margin-bottom: 15px; background-color: #fff; border-left: 4px solid #7C8663; box-shadow: 0 5px 20px rgba(13, 38, 45, 0.08); transition: 0.3s; }
.faq_item:last-child { margin-bottom: 0; }
.faq_item.open { border-left-color: #0D262D; }

.faq_vraag { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; margin: 0; padding: 20px 25px; background: none; border: 0; border-radius: 0; text-align: left; cursor: pointer; color: #0D262D; font-family: 'ashemore', 'sans-serif', 'Arial'; font-size: 19px; font-weight: 900; line-height: 1.3; transition: 0.3s; }
.faq_vraag:hover, .faq_item.open .faq_vraag { color: #7C8663; }
.faq_vraag:focus-visible { outline: 2px solid #7C8663; outline-offset: -2px; }

/* plus / min in ronde knop */
.faq_icoon { position: relative; flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; background-color: #0D262D; transition: 0.3s; }
.faq_icoon::before, .faq_icoon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; background-color: #fff; transform: translate(-50%, -50%); transition: 0.3s; }
.faq_icoon::after { transform: translate(-50%, -50%) rotate(90deg); }
.faq_vraag:hover .faq_icoon, .faq_item.open .faq_icoon { background-color: #7C8663; }
.faq_item.open .faq_icoon::after { transform: translate(-50%, -50%) rotate(0deg); }

.faq_antwoord { display: none; }
.faq_antwoord_inner { padding: 0 25px 25px 25px; color: #000; }
.faq_antwoord_inner p:last-child, .faq_antwoord_inner ul:last-child { margin-bottom: 0; }

@media only screen and (max-width: 640px) {
    .faq_vraag { padding: 15px 20px; font-size: 17px; }
    .faq_icoon { flex-basis: 30px; width: 30px; height: 30px; }
    .faq_antwoord_inner { padding: 0 20px 20px 20px; }
}