A slightly different way of looking at it might be to introduce DRY code (Don't Repeat Yourself).
By using CSS to do the styling, you know that by simply adding a class to a HTML element, the styling should take hold. If you had to manually add it all, then when you need to change one part, you need to change many, many more.
To steal an idea of illustration from W3 Schools, if you wanted, say, paragraphs to have different background colours, you could do it this way:
<p style='background-colour:red'>Paragraph 1</p>
<p style='background-colour:blue'>Paragraph 2</p>
<p style='background-colour:red'>Paragraph 3</p>
<p style='background-colour:blue'>Paragraph 4</p>
But, if I want to change the order so it's 2,4,3,1 but keep the colouring, I then have to change all of the styles built in to each tag. If that's across multiple pages, then the work load can be come huge.
If I did it in CSS, I can do the following:
Now it no longer cares what the content is, I can order them how I like and the styling still works. Lots of effort changed. Ignoring the ordering, if I wanted to change them to more sensible colours so they are easily readable, I change the value in CSS once, and it's applied to each matching DOM item.
Beyond that (as CSS can be embedded in HTML in the head tag), splitting it out into a file and including that means I don't have to repeat my (now more sensible) CSS into various files, down into folder structures for each page I have. I include the CSS file in the header and the styles take effect. Now if I need to make changes to the colours or add additional styles, I get the same benefits of not needing to duplicate which I had from not using inline styles.
Another benefit from having a separate file, away from the split responsibilities, is performance. Browsers are pretty good at caching files, so if it has to download a single (ideally minified) CSS file for the site once which it can then reapply, it's one less thing for it to download for other pages. Performance should always be a consideration for people, especially with the increase in mobile browsing. If a web page has a lot of CSS in it then the source is, naturally, large. This takes longer to download and/or become usable, which may put people off it the wait becomes unacceptable to them.