/* Existing API FAQ pattern, shared across all FAQ contexts. */
:root :is(.bsc-faq-compact-layout, .api-faq-layout, .mkt-faq-layout) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: 60px;
}

:root :is(.bsc-faq-compact-layout, .api-faq-layout, .mkt-faq-layout) > * {
    min-width: 0;
}

.bsc-faq-compact {
    color: #334a58;
    letter-spacing: 0;
}

.bsc-faq-compact p {
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 16px;
}

.bsc-faq-compact a {
    color: #0c738e;
    text-decoration: underline;
    text-underline-offset: 3px;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) > details {
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid #dce9ef;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #334a58;
    overflow-wrap: break-word;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) > details:first-of-type {
    border-top: 1px solid #dce9ef;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) > details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 0;
    padding: 22px 0;
    color: #173d50;
    font: 500 19px/1.4 Poppins, sans-serif;
    letter-spacing: 0;
    list-style: none;
    cursor: pointer;
    border-radius: 0;
}

:root :is(.bsc-home, .bsc-page) > section:not(#footer):not(#analytics-consent-banner) :is(.bsc-faq-list, .api-faq, .mkt-faq) summary h3 {
    margin: 0;
    color: inherit;
    font: inherit;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) summary::-webkit-details-marker {
    display: none;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) summary::after {
    content: "+";
    flex: 0 0 20px;
    color: #147d98;
    font: 24px/1 Arial, sans-serif;
    text-align: center;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) details[open] > summary::after {
    content: "\2212";
}

:root .bsc-faq-toggle {
    display: none;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) details > div {
    padding: 0 32px 6px 0;
    font-size: 15px;
    line-height: 1.75;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) details p {
    margin: 0 0 16px;
    font-size: 15px;
    line-height: 1.75;
}

:root :is(.bsc-faq-list, .api-faq, .mkt-faq, .bsc-home-faq-grid, .bsc-faq-group) summary:focus-visible,
.bsc-faq-compact a:focus-visible {
    outline: 2px solid #147d98;
    outline-offset: 5px;
    border-radius: 0;
}

:root .bsc-home-faq > .container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    grid-template-rows: min-content 1fr;
    align-items: start;
    gap: 30px 60px;
}

:root .bsc-home-faq-heading {
    grid-column: 1;
    grid-row: 1;
    max-width: none;
    margin: 0;
    text-align: left;
}

:root .bsc-home-faq-grid {
    display: block;
    grid-column: 2;
    grid-row: 1 / span 2;
    min-width: 0;
}

:root .bsc-home-faq-more {
    grid-column: 1;
    grid-row: 2;
    margin: 0;
    text-align: left;
}

@media (max-width: 991px) {
    :root :is(.bsc-faq-compact-layout, .api-faq-layout, .mkt-faq-layout),
    :root .bsc-home-faq > .container {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: none;
        gap: 32px;
    }

    :root :is(.bsc-home-faq-heading, .bsc-home-faq-grid, .bsc-home-faq-more) {
        grid-column: auto;
        grid-row: auto;
    }
}