/* Upload to /assets/css/faq.css and link once in the article template. */
.forward-faq { margin: 40px 0; --faq-accent: #a12b31; --faq-border: #dedede; }
.forward-faq .forward-faq__item { margin: 0; border-bottom: 1px solid var(--faq-border); }
.forward-faq .forward-faq__question {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 4px;
    list-style: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.forward-faq .forward-faq__question::-webkit-details-marker { display: none; }
.forward-faq .forward-faq__question::marker { content: ''; }
.forward-faq .forward-faq__question h3 {
    flex: 1; min-width: 0; margin: 0; color: inherit;
    font: inherit; font-weight: 600; line-height: 1.5;
    overflow-wrap: anywhere; scroll-margin-top: 96px;
}
.forward-faq .forward-faq__question:focus-visible {
    outline: 2px solid var(--faq-accent); outline-offset: 4px; border-radius: 4px;
}
.forward-faq .forward-faq__icon {
    position: relative; flex: 0 0 24px; width: 24px; height: 24px;
    margin-top: 2px; color: var(--faq-accent);
}
.forward-faq .forward-faq__icon::before,
.forward-faq .forward-faq__icon::after {
    content: ''; position: absolute; background: currentColor; border-radius: 1px;
}
.forward-faq .forward-faq__icon::before { top: 11px; left: 5px; width: 14px; height: 2px; }
.forward-faq .forward-faq__icon::after { top: 5px; left: 11px; width: 2px; height: 14px; }
.forward-faq .forward-faq__item[open] > .forward-faq__question .forward-faq__icon::after { display: none; }
.forward-faq .forward-faq__answer { padding: 0 4px 20px; overflow-wrap: anywhere; }
.forward-faq .forward-faq__answer p { margin: 0 0 12px; line-height: 160%;}
.forward-faq .forward-faq__answer p:last-child { margin-bottom: 0; }
@media (hover: hover) {
    .forward-faq .forward-faq__question:hover { color: var(--faq-accent); }
}