This component animates the opening and closing states of an accordion with a reveal effect using only CSS. It works well for FAQ sections and compact content blocks.

The expansion uses CSS grid rows instead of animating height from zero to auto. The circular reveal is handled with pseudo-elements, clip-path and blend mode.

Because the title is an anchor element, users can navigate through the items with a keyboard.

This style is useful when a FAQ block needs a stronger visual personality than a standard accordion while staying lightweight and script-free.