/* Main FAQ (Figma 1087:3494): navy banner on top, FAQ list below. setting.css supplies colors, typography and gaps. */
#main-faq { scroll-margin-top: var(--header-height, 100px); }
#main-faq h2,
#main-faq p:not([class*="u-mb-"]) { margin-bottom: 0; }
#main-faq a { color: inherit; text-decoration: none; }
#main-faq .main-faq-banner,
#main-faq .main-faq-content { padding-inline: 9.1667%; }
#main-faq .main-faq-banner { min-height: 360px; }
#main-faq .main-faq-copy { flex: 0 1 1000px; min-width: 0; }
#main-faq .main-faq-phone { flex: 0 0 360px; }
#main-faq .main-faq-item { background: var(--white); }
#main-faq .main-faq-item[open] { background: var(--light); }
#main-faq summary { display: grid; grid-template-columns: 40px minmax(0, 1fr) 24px; align-items: start; gap: 24px; cursor: pointer; list-style: none; }
#main-faq summary::-webkit-details-marker { display: none; }
#main-faq .main-faq-toggle { text-align: center; }
#main-faq .main-faq-toggle::before { content: '+'; }
#main-faq .main-faq-item[open] .main-faq-toggle::before { content: '−'; }
#main-faq h2,
#main-faq summary,
#main-faq .main-faq-answer { overflow-wrap: anywhere; word-break: keep-all; }
#main-faq :is(a,summary):focus-visible { outline: 3px solid var(--sub-color); outline-offset: 4px; }
#main-faq .main-faq-banner a:focus-visible { outline-color: var(--white); }
@media (max-width: 1439px) and (min-width: 993px) {
    #main-faq .main-faq-banner,
    #main-faq .main-faq-content { padding-inline: 64px; }
    #main-faq .main-faq-banner { min-height: 300px; }
    #main-faq .main-faq-phone { flex-basis: 280px; }
}
@media (max-width: 992px) {
    #main-faq .main-faq-banner,
    #main-faq .main-faq-content { padding-inline: 24px; }
    #main-faq .main-faq-banner { flex-direction: column; align-items: flex-start !important; min-height: 0; gap: 32px; }
    #main-faq .main-faq-copy,
    #main-faq .main-faq-phone { flex: none; width: 100%; }
    #main-faq summary { grid-template-columns: 28px minmax(0, 1fr) 20px; gap: 12px; }
}
