html,body{margin:0;padding:0}
#categories{padding-top:var(--space-global-to-h1)}
#categories .section-header{margin:0 0 32px 0}
#categories .section-title{font-family:var(--font-main);font-weight:700;font-size:clamp(28px,2vw + 16px,32px);line-height:1.25;letter-spacing:-0.01em;color:var(--color-black);margin:18px 0 0}
#categories .section-description{color:var(--color-light-black);margin:8px 0 0}
#categories .categories-grid{display:flex;flex-wrap:wrap;align-items:stretch;margin:var(--space-title-to-coupons) 0 0 0;gap:24px;--gap:24px;--cols:5}
#categories .categories-grid>a{display:block;min-width:0;text-decoration:none;flex:0 0 calc((100% - (var(--cols) - 1)*var(--gap))/var(--cols));max-width:calc((100% - (var(--cols) - 1)*var(--gap))/var(--cols))}
#categories .category-block{position:relative;height:clamp(220px,21vw,286px);background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:var(--radius-md);overflow:hidden;transition:transform .2s}
#categories .categories-grid a:hover .category-block{transform:translateY(-2px)}
#categories .category-overlay{position:absolute;left:0;right:0;bottom:0;min-height:64px;background:linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.70) 100%);border-radius:0 0 var(--radius-md) var(--radius-md);display:flex;align-items:flex-end}
#categories .category-title{margin:0;padding:0 16px 14px;font-weight:700;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.45);overflow-wrap:anywhere;max-width:100%}
#categories .category-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:992px){#categories .categories-grid{--cols:3}}
@media (max-width:768px){#categories .categories-grid{--cols:2;gap:24px;--gap:24px}#categories .category-title{font-size:17px}}
@media (max-width:575.98px){#categories .categories-grid{--cols:2;gap:16px;--gap:16px}}