In the case of a Webapp the data is changing based on user reactions to it, a controller is required to handle input from the user. What about the case of a website or a web article? Well, in these instances, user interaction does not really play a role. You have information and a way you want the information displayed (the view and the model).
This seems logical to most people. After all, the user is clicking and by doing so, changing the page. But what if I am thinking of the content as temporarily hidden? Think of the :hover pseudo selector. This is just content that I am choosing to hide or display differently until it becomes focused (hovered or clicked).
There is a problem though, no :clicked pseudo-selector exists, so how can I open my accordion without tapping into an event handler? It's actually quite simple, instead of thinking of accordion as a div (as it is traditionally done) think of it as a large label for a checkbox.
It probably seems a bit strange, to add the checkbox to the element only to hide it. But don't forget this is exactly what many designers already do. Custom styled checkboxes are just regular checkboxes with their content hidden and a customized label or ::before pseudo-element. The accordion only takes things a few steps further.
This is just something you need to consider when styling your site though. Since styling is usually one of those places where extra support for things is usually extra (animations and transitions come to mind), it is nothing to be overly concerned about. Just remember, if something you are using in CSS isn't supported by all major browsers, design you website assuming that it won't be there.