:root{--items-mobile:1;--items-tablet:2;--items-desktop:3;--gap:30px;--transition-speed:.5s}.category-grid{display:grid;gap:var(--gap);padding:40px 0;grid-template-columns:repeat(var(--items-mobile),1fr)}@media(min-width:768px){.category-grid{grid-template-columns:repeat(var(--items-tablet),1fr)}}@media(min-width:1024px){.category-grid{grid-template-columns:repeat(var(--items-desktop),1fr)}} .category-link{text-decoration:none!important;display:block;outline:0} .category-item{display:flex;flex-direction:column;align-items:center} .category-image-wrapper{width:100%;aspect-ratio:1/1;border-radius:12px;overflow:hidden;margin-bottom:15px;background-color:#eee; transition:transform var(--transition-speed) ease} .category-image-wrapper img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(100%);-webkit-filter:grayscale(100%); transition:filter var(--transition-speed) ease,transform var(--transition-speed) ease} .category-link:hover img{filter:grayscale(0);-webkit-filter:grayscale(0);transform:scale(1.1)} .category-link:hover .category-image-wrapper{} .category-title{color:#eee;font-size:1.1rem;font-weight:600;margin:0;text-align:center;transition:color .3s ease}.category-link:hover .category-title{color:#fff}.d-none-mobile{display:none!important}@media(min-width:576px){.d-none-mobile{display:block!important}}@media(min-width:576px) and(max-width:991.98px){.d-none-tablet{display:none!important}}@media(min-width:992px){.d-none-desktop{display:none!important}}