My 3-Column Preview Card Component Using Nth-Child Pseudo-Selectors

This is my solution of the 3-column preview card component using nth-child pseudo-selectors only. I had been learning about them and CSS variables and wanted to apply my theoretical knowledge somewhere to help me understand it better. I get that it is probably not the most practical solution in this case.

Examples of how I selected the button in the first column:

main div:nth-child(1) > button {color: var(--bright-orange);}