responsive 3-column-preview-card-component-main- html css

Your solution is good overall but when you hover on button the design shifts you can solve by giving border: 2px solid transparent on button and change the border color you desired on hover, second issue is to solve the accessibility issues by using h1 first and then h2, h3, h4. Hope this helps my english isn't much good

👾Hello Jefeson, congratulations for your new solution!

Here's some tips to make the design more similar:

To make the container more similar as the reference design is better you use max-width: 1110px thats the standard size for the containers to make it more vertical in the desktop version.

@media (min-width: 1440px)
.container {
    max-width: 50%;
    display: flex;
    margin: 12rem 15rem 3rem;
}

Its also easier to do this challenge with grid, with display: grid and grid-template-column: 1fr 1fr 1fr the layout is done and each column under the div will have 33% for mobile version all u need is to set grid-template-column: 1fr

👋 I hope this helps you and happy coding!

SALUDOS DESDE BRASIL!