@layer components{.card-grid{display:grid;gap:var(--card-grid-gap);inline-size:100%}.card-grid--cols-1{grid-template-columns:minmax(0,1fr)}.card-grid--cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.card-grid--cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.card-grid--cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}@media (min-width:768px) and (max-width:1023px){.card-grid--cols-3,.card-grid--cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:767px){.card-grid--cols-2,.card-grid--cols-3,.card-grid--cols-4{grid-template-columns:minmax(0,1fr)}}}