.design_template.faqs {
    padding:40px 0 40px 0;
}

.faqs-slider {
    width: 100%;
    max-width: 800px; /* Настройте според дизайна си */
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 15px; /* Разстояние между отделните въпроси */
}

.faq-item {
    background-color: #fdf8f9; /* Мек розов/светъл фон като на снимката */
    border-radius: 4px;
    padding: 20px 30px;
    box-sizing: border-box;
}

.faq-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.faq-header h3 {
    margin: 0;
    font-size: 16px;
    color: #333333;
    font-weight: normal;
}

.faq-toggle {
    font-size: 24px;
    color: #b57c91; /* Цвят на плюс/минус иконата */
    line-height: 1;
    user-select: none;
}

/* Скриваме отговора по подразбиране */
.faq-content {
    margin-top: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out, margin-top 0.3s ease-out;
}

/* Клас, който JavaScript ще добавя при клик за показване на текста */
.faq-item.active .faq-content {
    margin-top: 15px;
    max-height: 500px; /* Достатъчно голямо пространство за текста */
}


.faq-content p {
    margin: 0;
    font-size: 15px;
    color: #b57c91; /* Цвят на текста на отговора */
    line-height: 1.6;
}

/* Ефект при посочване с мишката */
.faq-item {
    /* Добавяме плавен преход за сянката */
    transition: box-shadow 0.3s ease, transform 0.2s ease; 
}

.faq-item:hover {
    /* Тъмнолилава деликатна сянка (rgba определя цвета и 15% прозрачност) */
    box-shadow: 0 8px 24px rgba(74, 20, 140, 0.15); 
    
    /* Опционално: леко повдигане на контейнера за по-динамичен ефект */
    transform: translateY(-2px); 
}