.homeContainer{display:flex;flex-direction:column;gap:16px;width:100%}
.heroSliderContainer{position:relative;width:100%;height:140px;overflow:hidden;border-radius:12px;background:var(--bg-surface);border:1px solid var(--border)}
.heroSliderTrack{display:flex;width:100%;height:100%;transition:transform .4s ease-in-out}
.heroSlide{min-width:100%;height:100%;background:linear-gradient(135deg,var(--accent),#4f46e5);padding:24px;color:#fff;display:flex;flex-direction:column;justify-content:center;gap:6px;box-sizing:border-box}
.heroSlide h1{font-size:16px;font-weight:800;letter-spacing:-0.3px}
.heroSlide p{font-size:11px;opacity:.9;line-height:1.4}
.heroDots{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:6px}
.heroDots .dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,0.4);cursor:pointer;transition:background .3px}
.heroDots .dot.active{background:#fff;width:16px;border-radius:3px}
.homeSearchBox{position:relative;display:flex;align-items:center;width:100%}
.homeSearchBox .searchIcon{position:absolute;left:12px;width:16px;height:16px;color:var(--text-muted)}
.homeSearchBox input{width:100%;padding:10px 12px 10px 36px;background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;color:var(--text-main);font-size:12px;outline:none;transition:border-color .2s}
.homeSearchBox input:focus{border-color:var(--accent)}
.catalogSectionHeader{display:flex;align-items:center;justify-content:space-between;margin-top:2px}
.catalogSectionHeader h2{font-size:13px;font-weight:700}
.catalogGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media(min-width:768px){.catalogGrid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}}
.catalogCard{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;text-decoration:none;color:var(--text-main);display:flex;flex-direction:column;overflow:hidden;transition:all .2s}
.catalogCard:hover{border-color:var(--accent);transform:translateY(-2px)}
.catalogCardThumb{width:100%;height:90px;background:var(--bg-base);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
@media(min-width:768px){.catalogCardThumb{height:120px}}
.catalogCardThumb img{width:100%;height:100%;object-fit:cover}
.catalogCardThumb.skeleton{background:linear-gradient(90deg,var(--bg-base) 25%,var(--border) 50%,var(--bg-base) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.thumbPlaceholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-muted)}
.thumbPlaceholder svg{width:24px;height:24px}
.catalogCardInfo{padding:8px;display:flex;flex-direction:column;gap:2px}
.catalogBrand{font-size:8px;text-transform:uppercase;color:var(--text-muted);font-weight:700;letter-spacing:0.4px}
.catalogTitle{font-size:10px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.catalogPrice{font-size:10px;font-weight:800;color:var(--accent);margin-top:2px}
@media(min-width:768px){.catalogBrand{font-size:9px}.catalogTitle{font-size:11px}.catalogPrice{font-size:11px}}
.emptyCatalog{grid-column:1/-1;text-align:center;padding:32px;font-size:11px;color:var(--text-muted);background:var(--bg-surface);border:1px solid var(--border);border-radius:8px}
