.category-grid {
display: grid;
        grid-template-columns: repeat(8, 1fr);
        gap: 10px;
        background: #fff;
        padding: 12px;
        border-radius: 7px;
}

.category-grid a {
min-width: 0;
        text-align: center;
        color: #30333a;
}

.category-grid img {
width: 100%;
        aspect-ratio: 1/1;
        object-fit: cover;
        border-radius: 6px;
        background: #f5f5f7;
}

.category-grid span {
display: block;
        font-size: 13px;
        line-height: 1.12;
        margin-top: 8px;
}

@media (max-width: 1000px) and (min-width: 721px) {
.category-grid {
grid-template-columns: repeat(4, 1fr);
}
}

@media (max-width: 720px) {
.popular-section {
background: #fff;
          padding: 12px 0 4px;
}

.popular-section .container {
padding: 0 18px;
}

.category-grid {
display: grid;
          grid-template-columns: repeat(4, 1fr);
          gap: 18px 7px;
          padding: 0;
          background: #fff;
}

.category-grid img {
border-radius: 5px;
          aspect-ratio: 1/1;
}

.category-grid span {
font-size: 13px;
          margin-top: 5px;
          line-height: 1.03;
}
}