/* ============================================================
   „Често задавани въпроси“: заглавие вляво, въпросите вдясно като акордеон.
   --faq-bg фон, --faq-acc цвят на „+“ (по подразбиране цветът на стаята).
   Линиите са от текущия цвят на текста, затова стават и на светло, и на тъмно.
   ============================================================ */

.pfx.faq { background: var(--faq-bg, #fff); color: #121212; }
.pfx.faq.tone-dark { background: var(--faq-bg, #07080A); color: #F2F0EB; }
.pfx.faq .faq-in { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(30px, 6vw, 100px); align-items: start; }
.pfx.faq .faq-h { font-size: clamp(40px, 4.6vw, 80px); line-height: .98; letter-spacing: -.055em; font-weight: 200; }
.pfx.faq .faq-h b { font-weight: 800; }
.pfx.faq .faq-q { border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent); }
.pfx.faq .faq-q:last-child { border-bottom: 1px solid color-mix(in srgb, currentColor 16%, transparent); }
.pfx.faq .faq-q h3 { margin: 0; font: inherit; }
.pfx.faq .faq-q button { display: flex; justify-content: space-between; align-items: center; gap: 20px; width: 100%; padding: 22px 0; text-align: left; color: inherit; font-size: clamp(19px, 1.7vw, 25px); line-height: 1.3; font-weight: 600; letter-spacing: -.015em; }
.pfx.faq .faq-q button span { flex-shrink: 0; font-size: 28px; line-height: 1; font-weight: 200; color: var(--faq-acc, var(--room, currentColor)); transition: transform .5s var(--ease-out, ease-out); }
.pfx.faq .faq-q.is-open button span { transform: rotate(45deg); }
.pfx.faq .faq-q button:focus-visible { outline: 2px solid var(--faq-acc, var(--room, currentColor)); outline-offset: 4px; }
.pfx.faq .faq-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .6s var(--ease-out, ease-out); }
.pfx.faq .faq-a-in { overflow: hidden; opacity: .72; line-height: 1.7; max-width: 40em; }
.pfx.faq .faq-a-in > * + * { margin-top: .8em; }
.pfx.faq .faq-a-in a { text-decoration: underline; text-underline-offset: 3px; }
.pfx.faq .faq-q.is-open .faq-a { grid-template-rows: 1fr; }
.pfx.faq .faq-q.is-open .faq-a-in { padding-bottom: 22px; }

@media (max-width: 900px) { .pfx.faq .faq-in { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .pfx.faq .faq-a, .pfx.faq .faq-q button span { transition: none; } }
