/* ============================================
   FAQ АККОРДЕОН
   ============================================ */
.faq-accordion{margin: 0 auto}
/* ----- Элемент вопроса ----- */
.faq-item {margin-bottom: 10px; background: #fff;border-radius: 10px;overflow: hidden;}
.faq-item:last-child{margin-bottom: 0}
/* ----- Заголовок вопроса ----- */
.faq-question{display: flex; justify-content: space-between; align-items: center; padding: 18px 24px; font: 700 24px/32px "Trebuchet MS", sans-serif; color: #2e2e2e; background-color: #e0e7ef; cursor: pointer; user-select: none; gap: 20px; transition: background 0.25s ease, color 0.25s ease;border-radius: 10px;position: relative}
.faq-question:hover{background-color: #0388a4; color: #ffffff}
.faq-question span{flex: 1}
/* ----- Стрелка (чёрная, при наведении белая) ----- */
.faq-arrow{flex-shrink: 0; width: 28px; height: 28px; transition: transform 0.3s ease, stroke 0.25s ease; stroke: #2e2e2e}
.faq-question:hover .faq-arrow{stroke: #ffffff}
.faq-item.active .faq-arrow{transform: rotate(180deg)}
.faq-item.active .faq-question .faq-arrow{stroke: #ffffff}
/* ----- Активный вопрос (открытый) ----- */
.faq-item.active .faq-question{background-color: #0388a4; color: #ffffff; border-radius: 10px 10px 0 0}
/* ----- Ответ (скрыт по умолчанию) ----- */
.faq-answer{max-height: 0; overflow: hidden; transition: max-height 0.45s ease, padding 0.35s ease; padding: 0 24px; background: #ffffff}
.faq-item.active .faq-answer{max-height: 2000px; padding: 20px 24px 25px 24px; border: 1px solid #e0e7ef; border-top: none; border-radius: 0 0 10px 10px}
.faq-answer > div{font: 16px/26px "Roboto", sans-serif; color: #2e2e2e}
.faq-answer > div p{margin: 12px 0}
.faq-answer > div ul,
.faq-answer > div ol{padding-left: 25px; margin: 10px 0}
.faq-answer > div ul li{list-style: disc; margin: 5px 0}
.faq-answer > div ol li{list-style: decimal; margin: 5px 0}
.faq-answer > div img{max-width: 100%; height: auto; border-radius: 8px}
.faq-answer > div table{width: 100%; border-collapse: collapse; margin: 15px 0}
.faq-answer > div table th{background: #0388a4; color: #fff; padding: 10px; font: 700 16px "Trebuchet MS"; border: 1px solid #fff}
.faq-answer > div table td{border: 1px solid #0388a4; padding: 10px; font: 500 14px "Roboto"}
.faq-answer > div table tr:hover{background: rgba(3, 136, 164, 0.09)}
/* ============================================
   АДАПТИВ
   ============================================ */
@media (max-width: 991px){
	.faq-question{font-size: 20px; line-height: 28px; padding: 15px 20px}
    .faq-arrow{width: 24px; height: 24px}
    .faq-answer > div{font-size: 15px; line-height: 24px}
    .faq-item.active .faq-answer{padding: 15px 20px 20px 20px}
    .faq-answer > div table th{font-size: 14px; padding: 8px}
    .faq-answer > div table td{font-size: 13px; padding: 8px}
}
@media (max-width: 767px){.faq-question{font-size: 18px; line-height: 26px; padding: 13px 16px}
    .faq-arrow{width: 22px; height: 22px}
    .faq-answer > div{font-size: 14px; line-height: 22px}
    .faq-item.active .faq-answer{padding: 12px 16px 18px 16px}
}
@media (max-width: 575px){.faq-question{font-size: 15px; line-height: 22px; padding: 12px 14px; gap: 12px}
    .faq-arrow{width: 18px; height: 18px}
    .faq-answer > div{font-size: 13px; line-height: 20px}
    .faq-item.active .faq-answer{padding: 10px 14px 15px 14px}
    .faq-answer > div p{margin: 8px 0}
    .faq-answer > div ul,
    .faq-answer > div ol{padding-left: 18px}
}