/* розміри текстів — у sections.css / style.css (як були). Тут лише точкові правки. */

/* мобілка: номери в faq не потрібні */
@media (max-width: 767px), (max-aspect-ratio: 4/5) {
  #faq .faq__item summary { grid-template-columns: 1fr !important; }
  #faq .faq__num { display: none !important; }
  #faq .faq__a { margin-left: 0 !important; }
}

/* faq: відкрите питання помітне (плюс зелений, текст яскравіший); на мобілці більше повітря */
#faq .faq__item[open] .acc-icon { color: var(--green) !important; }
#faq .faq__item[open] .faq__q { color: rgba(255, 255, 255, 0.95); }
@media (max-width: 767px), (max-aspect-ratio: 4/5) {
  #faq .faq__item .faq__q { padding: calc(20 * var(--k)) calc(20 * var(--k)) !important; gap: calc(44 * var(--k)) !important; }
  #faq .faq { gap: calc(8 * var(--k)) !important; }
  #faq .faq__a { padding: calc(4 * var(--k)) calc(20 * var(--k)) calc(22 * var(--k)) !important; margin-top: 0 !important; }
  #faq .sec__head { margin-bottom: calc(40 * var(--k)) !important; }
}

/* мобілка: у фінальній картці етапів повний текст кнопки не влазить поруч із $$$, тож лишаємо одну кнопку на всю ширину */
@media (max-width: 767px), (max-aspect-ratio: 4/5) {
  .snake .snake__cta-btn .cta__btn--price { display: none !important; }
  .snake .snake__cta-btn .cta__btn--main { flex: 1 1 auto !important; justify-content: center; }
}
#faq .faq__q { gap: calc(64 * var(--k)); }
#faq .faq__q .acc-icon { flex: none; }

/* відкрите питання faq — світліше за звичайне */
#faq .faq__item[open] .faq__q, #faq .faq__item[open] .faq__num, #faq .faq__item[open] .faq__a { background: rgba(255, 255, 255, 0.1) !important; }
