Order Summary using flex box and vanilla css

I am abit confused with the accessibility issues I have regarding "landmarks". Im not entirely sure what they are, and even after some googling I have no idea how to solve this. Granted I have made use of divs instead of the semantic names like article (I never really got around to grasping the semantic names and have been using divs everywhere), etc, so im inclined to think the issue lies there, but im not sure what to do to solve this. Any help regarding the solution as well as the importance of this would mean a lot!

Otherwise, this is my first frontend mentor challenge. This took longer than I was anticipating. Im sure there are simpler ways to achieve what I did and probably with less code and more elegence, however I am surprised at how much of a learning experience this has been and look forward to more challenges.

I realised that the order in which you tackle the challenge can go a long way in maintaining your sanity - too much jumping back and forth made it confusing for me to fix some css issues, so in the end I started again and tried do things in a logical order as opposed to randomly targeting elements on the design.

Looking forward to some feedback from the community as well as seeing how everyone else has come up with their solutions!