.category-card__color-link { display:inline-flex; align-items:center; justify-content:center; }
.category-card__color-link:hover .category-card__color-dot { transform:scale(1.12); }
.category-card__color-dot { transition:transform .2s ease; }



img { display:block; max-width:100%; }
button { font:inherit; }

.category-page { min-height:100vh; padding:12px 0 40px; }
.category-wrap { width:min(1250px,calc(100% - 40px)); margin:0 auto; }
.category-breadcrumbs { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 12px; color:#666; font-size:13px; }
.category-breadcrumbs__item { color:#666; }
.category-breadcrumbs__item:hover { color:#f47c17; }
.category-breadcrumbs__sep { color:#9a9a9a; }
.category-breadcrumbs__current { color:#252525; font-weight:700; }
.category-filter-panel { margin:0 0 14px; padding:18px; border:1px solid #d9d9d9; border-radius:18px; background:#f7f7f7; box-shadow:0 10px 28px rgba(0,0,0,0.06); }
.category-filter-panel__head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin:0 0 14px; }
.category-filter-panel__count { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 14px; border-radius:999px; background:#fff; border:1px solid #dddddd; color:#22303d; font-size:14px; font-weight:700; white-space:nowrap; }
.category-hero__eyebrow { display:inline-flex; align-items:center; min-height:28px; padding:0 12px; border-radius:999px; background:#fff3e6; color:#d5660c; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.category-hero__title { margin:12px 0 10px; color:#22303d; font-size:30px; line-height:1.2; }
.category-hero__description { color:#4e4e4e; font-size:15px; line-height:1.7; }
.category-hero__description p { margin:0 0 12px; }
.category-filter-group { display:grid; gap:10px; margin:14px 0 0; }
.category-filter-group__title { color:#22303d; font-size:14px; font-weight:700; line-height:1.4; }
.category-filter-list { display:flex; flex-wrap:wrap; gap:10px; }
.category-filter-chip { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 16px; border:1px solid #d0d0d0; border-radius:999px; background:#fff; color:#333; font-size:14px; font-weight:700; cursor:pointer; transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease; }
.category-filter-chip:hover { transform:translateY(-1px); border-color:#bbbbbb; }
.category-filter-chip.is-active { border-color:#f47c17; background:#fff3e6; color:#d5660c; }
.category-grid-wrap { transition:opacity .2s ease; }
.category-grid-wrap.is-loading { opacity:.55; pointer-events:none; }
.category-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.category-card { display:grid; grid-template-rows:auto 1fr; border:1px solid #d9d9d9; border-radius:18px; background:#fff; overflow:hidden; box-shadow:0 10px 28px rgba(0,0,0,0.06); }
.category-card__media { position:relative; display:block; background:#ffffff;     aspect-ratio: 7 / 9; overflow:hidden;padding: 5px 5px 0 5px; }
.category-card__image { width:100%; height:100%; object-fit:cover; transition:transform .25s ease;     border-radius: 10px 10px 0 0;}
.category-card:hover .category-card__image { transform:scale(1.03); }
.category-card__placeholder { display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:#777; font-size:14px; }
.category-card__body { display:grid; gap:8px; padding:6px; }
.category-card__title { color:#22303d; font-size:18px; font-weight:700;text-align:center; }
.category-card__title:hover { color:#f47c17; }
.category-card__badges { position:absolute; top:12px; left:12px; z-index:2; display:grid; gap:6px; }
.category-card__badge { display:inline-flex; align-items:center; justify-content:center; min-height:28px; padding:0 10px; border-radius:999px; background:rgba(34,48,61,0.88); color:#fff; font-size:11px; font-weight:700; letter-spacing:.04em; line-height:1; box-shadow:0 6px 18px rgba(0,0,0,0.16); }
.category-card__colors-box { position: absolute; left: 50%; bottom: 14px; z-index: 2; transform: translateX(-50%); display: flex; flex-direction: row-reverse; align-items: center; gap: 5px; padding: 4px 10px 4px 5px; border-radius: 14px; background: rgba(255, 255, 255, .92); backdrop-filter: blur(6px); box-shadow: 0 10px 24px rgba(15, 23, 42, .12); }
.category-card__colors-label { font-size:12px; font-weight:600; line-height:1; color:#111827; white-space:nowrap; }
.category-card__colors { display: flex; align-items: center; justify-content: center; gap: 4px; flex-wrap: nowrap; flex-direction: row; }
.category-card__color-dot { width:16px; height:16px; border-radius:999px; border:1px solid rgba(15,23,42,.12); background:var(--color,#ffffff); box-shadow:0 1px 2px rgba(15,23,42,.08); }
.category-card__dimensions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.category-card__dimension { display:grid; gap:4px; padding:10px 8px; border:1px solid #dddddd; border-radius:12px; background:#fff; text-align:center; }
.category-card__dimension-label {color: #808080; font-size: 11px; font-weight: 600; letter-spacing: -0.3px;}
.category-card__dimension-value { color:#22303d; font-size:14px; line-height:1.35; }
.category-card__price-box { display:grid; gap:4px; justify-content:center; }
.category-card__price-top { display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; }
.category-card__price-old { color:#6b6b6b; font-size:14px; font-weight:400; text-decoration:line-through; }
.category-card__discount { color:#1c9a31; font-size:14px; font-weight:700; }
.category-card__price-current { color:#f47c17; font-size:24px; font-weight:800; line-height:1.15; text-align:center; }
.category-card__button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; border-radius:12px; background:#f47c17; color:#fff; font-size:14px; font-weight:700; }
.category-card__button:hover { background:#d5660c; }
.category-empty { display:flex; align-items:center; justify-content:center; min-height:220px; padding:20px; border:1px solid #d9d9d9; border-radius:18px; background:#f7f7f7; color:#555; font-size:16px; text-align:center; box-shadow:0 10px 28px rgba(0,0,0,0.06); }
@media (max-width:1100px) { .category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) {.category-grid { gap:10px; }.category-card__dimension-value { color: #22303d; font-size: 12px; line-height: 1.35; font-weight: 600; letter-spacing: -0.3px; } .category-card__title{font-size:15px;} .category-wrap { width:min(100%,calc(100% - 14px)); } }
@media (max-width:760px) { .category-filter-panel { padding:16px; } }
@media (max-width:760px) { .category-filter-panel__head { flex-direction:column; align-items:flex-start; } }
@media (max-width:760px) { .category-hero__title { font-size:24px; } }
@media (max-width:760px) { .category-grid {grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .category-card__dimensions { grid-template-columns:repeat(3,minmax(0,1fr)) } }
@media (max-width:760px) { .category-card__colors-box { bottom:10px; padding:9px 10px; } }