<details> element can be used to make this effect.
Here, click this lil card to expand it:
See the Pen Details Card by Robin Rendle (@robinrendle) on CodePen.
It’s not responsive or polished yet but isn’t this super neat? All of this is running off the magic of a few humble HTML tags:
<!-- title -->
<!-- paragaphs -->
I’ll figure out why the animations aren’t working each time but besides that, I love this pattern and had no idea you could use
<details> in this way.