/* State-specific padding, item separator and circular icon have no native controls. */
.cro-accordion .e-n-accordion-item { border: 0; border-bottom: 1px solid var(--cro-line); border-radius: 0; }
.cro-accordion .e-n-accordion-item[open] > .e-n-accordion-item-title { padding-bottom: 16px; }
.cro-accordion .e-n-accordion-item-title-text { text-align: left; }
.cro-accordion .e-n-accordion-item-title-icon { display: flex; align-items: center; justify-content: center; background: var(--cro-control); border-radius: 50%; width: 48px; height: 48px; flex: 0 0 48px; }
/* Native details stays instantly operable; only the opened answer fades in. */
@media (prefers-reduced-motion: no-preference) {
    .cro-accordion .e-n-accordion-item[open] > .e-con { animation: cro-answer 240ms ease-out; }
    .cro-accordion .e-n-accordion-item-title-icon { transition: background-color 220ms ease; }
}
.cro-accordion .e-n-accordion-item-title:is(:hover, :focus-visible) .e-n-accordion-item-title-icon { background: var(--cro-accent); }
@keyframes cro-answer { from { opacity: 0; } to { opacity: 1; } }