.color-list{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:auto auto;column-gap:20px;row-gap:40px}@media (width <= 1200px){.color-list{grid-template-columns:repeat(2,1fr)}}@media (width <= 1024px){.color-list{grid-template-columns:1fr}}.color-item{height:182px;border-radius:32px;padding:20px;color:var(--almost-black);font-size:1.5rem;line-height:1.75rem}.color-item:last-child{border:1px solid var(--pure-white)}.color-item.is-dark{color:var(--pure-white)}@media (width > 1200px){.color-item:nth-child(1){grid-area:1/1}.color-item:nth-child(2){grid-area:1/2}.color-item:nth-child(3){grid-area:1/3}.color-item:nth-child(4){grid-area:1/4}.color-item:nth-child(5){grid-area:2/1/2/3}.color-item:nth-child(6){grid-area:2/3/2/5}}.color-item-name{font-weight:900;margin-bottom:8px}.color-item-color{font-weight:700;opacity:.6}