html.motion-enabled .faq-list.reveal-group {
    border-top-color: transparent;
}

html.motion-enabled .faq-list.reveal-group > details {
    position: relative;
    border-bottom-color: transparent;
}

html.motion-enabled .faq-list.reveal-group > details::after,
html.motion-enabled .faq-list.reveal-group > details:first-child::before {
    content: "";
    position: absolute;
    right: 0;
    left: 0;
    height: 1px;
    background: var(--line);
    opacity: 0;
    pointer-events: none;
}

html.motion-enabled .faq-list.reveal-group > details::after {
    bottom: -1px;
}

html.motion-enabled .faq-list.reveal-group > details:first-child::before {
    top: -1px;
    background: var(--line-bright);
}

html.motion-enabled .faq-list.reveal-group .faq-icon {
    opacity: 0;
}

html.motion-enabled .faq-list.reveal-group.is-revealed > details::after,
html.motion-enabled .faq-list.reveal-group.is-revealed > details:first-child::before,
html.motion-enabled .faq-list.reveal-group.is-revealed .faq-icon {
    animation: faq-decoration-in 560ms linear both;
    animation-delay: var(--reveal-item-delay, 0ms);
}

@keyframes faq-decoration-in {
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    html.motion-enabled .faq-list.reveal-group > details::after,
    html.motion-enabled .faq-list.reveal-group > details:first-child::before,
    html.motion-enabled .faq-list.reveal-group .faq-icon {
        opacity: 1;
        animation: none !important;
    }
}
