.box-grid{grid-template-areas:"one""two""three""four";grid-auto-columns:1fr;gap:1rem;display:grid}.box:first-child{grid-area:one}.box:nth-child(2){grid-area:two}.box:nth-child(3){grid-area:three}.box:nth-child(4){grid-area:four}@media screen and (min-width:640px){.box-grid{grid-template-columns:repeat(2,1fr);grid-template-areas:"one one""two two""three three""four four"}}@media screen and (min-width:768px){.box-grid{grid-template-columns:repeat(3,1fr);grid-template-areas:"one one two""three three three""four four four"}}@media screen and (min-width:1024px){.box-grid{grid-template-columns:repeat(4,1fr);grid-template-areas:"one one two four""three three three four"}}