.category-page{background-color:var(--white);color:var(--dark)}.category-page__inner{display:flex;flex-direction:column;gap:40px}.category-page__inner-top{display:flex;gap:20px;flex-wrap:wrap;align-items:flex-end}.category-page__nav{display:flex;color:var(--dark);padding:4px 16px;background-color:var(--white);border-radius:20px;width:max-content}.category-page__nav-btn{padding:10px;border-radius:20px;font-weight:500}.category-page__nav-btn:hover,.category-page__nav-btn.active{background-color:#ffaa0057}.category-page__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}@media (max-width: 1024px){.category-page__grid{grid-template-columns:repeat(3,1fr)}.category-page__inner{gap:20px}}@media (max-width: 768px){.category-page__grid{grid-template-columns:repeat(2,1fr);gap:12px}}.sort{color:var(--dark);padding:10px 16px;background-color:#fff;border-radius:6px;display:flex;gap:20px}.sort__select{position:relative}.sort__select-title{display:flex;align-items:center;gap:8px;cursor:pointer;min-width:100px}.sort__select-title svg{width:16px;height:16px}.sort__select-list{position:absolute;z-index:2;top:calc(100% + 12px);left:0;background-color:var(--white);border-radius:10px;padding:4px 0;box-shadow:0 0 10px #0000001a}.sort__select-options{padding:4px 6px;width:100%}.sort__select-options:hover{background-color:#ffaa0057}@media (max-width: 1024px){.category-page__nav{padding:0;flex-wrap:wrap}}