Single price grid component

Hello, congratz on finishing the challenge!

From what i see, the auto in

.card > * {
 max-width: 100%;
 margin: 0 auto 0;
}

distrupts your sizes of boxes. Can you try removing that line completely or auto and try the changes i said below.

It shows you declared 1 column in the code below

@media only screen and (min-width: 1024px)
.card {
    grid-template-columns: 1fr;
    grid-template-rows: 40% 50%;
    max-width: 35rem;
}

in dekstop version if you want 2 even columns width you should making it by grid-template-columns: 1fr 1fr; or grid-template-columns: repeat(2, 1fr);

also you should try making your rows by grid-template-rows: repeat(2, auto). This will create two rows with auto heights.

After you make this changes you can give same paddings to your sections.

Hope this was helpful.