:root{--primary:#1f6feb;--primary-dark:#1a5fd0;--accent:#f59e0b;--bg:#f5f7fa;--surface:#fff;--text:#1b2430;--text-muted:#6b7785;--border:#e3e8ef;--radius:12px;--shadow:0 4px 16px #1b243014;--shadow-hover:0 10px 28px #1b243024;--span-font-size:16px;--promo-font-size:16px;--card-img-background:#ebebeb;--product-img-background:#ebebeb}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,Arial,sans-serif;line-height:1.5}h1,h2,h3,h4,h5,h6,.logo,.page-title,.section-title,.card-title,.product-info h1{font-family:Roboto,system-ui,sans-serif}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{width:min(1200px,92%);margin:0 auto}.page{flex:1;padding:32px 0 60px}.page-title{letter-spacing:-.5px;margin-bottom:8px;font-size:28px;font-weight:800}.page-sub{color:var(--text-muted);margin-bottom:24px}.categories{flex-wrap:wrap;gap:10px;margin-bottom:28px;display:flex}.chip{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:999px;padding:10px 18px;font-size:14px;font-weight:500;transition:all .2s}.chip:hover{border-color:var(--primary);color:var(--primary)}.chip.active{background:var(--primary);border-color:var(--primary);color:#fff}.product-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px;display:grid}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex;overflow:hidden}.card:hover{box-shadow:var(--shadow-hover);transform:translateY(-4px)}.card-media{aspect-ratio:4/3;background:var(--card-img-background);overflow:hidden}.card-media img{object-fit:contain;width:100%;max-width:100%;height:100%;max-height:100%;display:block}.card-media{position:relative}.card-badge{z-index:1;background:var(--accent);color:#fff;letter-spacing:.5px;text-transform:uppercase;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:700;position:absolute;top:10px;left:10px}.card-badge-out{background:#6b7785}.card.out-of-stock{opacity:.72}.card.out-of-stock .card-media img{filter:grayscale(.9)}.card.out-of-stock .btn{background:#9aa4af}.card-body{flex-direction:column;flex:1;gap:6px;padding:16px;display:flex}.card-category{text-transform:uppercase;letter-spacing:.6px;color:var(--primary);font-size:12px;font-weight:600}.card-title{font-size:17px;font-weight:600;line-height:1.3}.card-bottom{justify-content:space-between;align-items:center;margin-top:auto;padding-top:10px;display:flex}.price{font-size:18px;font-weight:700}.btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items:center;gap:6px;padding:9px 16px;font-weight:600;transition:background .2s;display:inline-flex}.btn:hover{background:var(--primary-dark)}.state{text-align:center;color:var(--text-muted);padding:60px 0}.state .icon{margin-bottom:12px;font-size:56px}.spinner{border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;margin:0 auto 16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.breadcrumbs{color:var(--text-muted);margin-bottom:16px;font-size:14px}.breadcrumbs a:hover{color:var(--primary)}.site-footer{background:var(--surface);border-top:1px solid var(--border);color:var(--text-muted);text-align:center;padding:24px 0;font-size:14px}html{-webkit-text-size-adjust:100%}body{overflow-x:hidden}@media (width<=900px){.page{padding:24px 0 48px}}@media (width<=640px){.container{width:94%}.page{padding:18px 0 40px}.page-title{font-size:24px}.page-sub{margin-bottom:16px}.product-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.card-body{padding:12px}.card-category{font-size:11px}.card-title{font-size:15px}.card-bottom{padding-top:8px}.price{font-size:16px}.btn{padding:8px 12px;font-size:13px}.chip{padding:8px 14px;font-size:13px}.categories{gap:8px;margin-bottom:20px}.state{padding:40px 0}.breadcrumbs{font-size:12px;line-height:1.5}.section-title{margin:28px 0 12px;font-size:19px}}.site-header{background:var(--surface);border-bottom:1px solid var(--border);z-index:50;position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;gap:24px;height:64px;display:flex}.logo{color:var(--primary);letter-spacing:-.5px;font-size:20px;font-weight:700}.logo-mail{color:#556b2f;margin-left:10px;font-size:12px}.brand{flex-direction:column;align-items:flex-start;display:flex}.promo{font-size:var(--promo-font-size);color:red;font-weight:500;line-height:1.3}.promo span{text-decoration-line:underline}.nav{gap:4px;display:flex}.nav a{color:var(--text-muted);border-radius:8px;padding:8px 14px;font-weight:500;transition:background .2s,color .2s}.nav a:hover{background:var(--bg);color:var(--text)}.nav a.active{background:var(--primary);color:#fff}.header-burger{border:1px solid var(--border);background:var(--surface);width:40px;height:40px;color:var(--text);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;font-size:18px;transition:background .2s,color .2s;display:none}.header-burger:hover{background:var(--bg);color:var(--primary)}@media (width<=720px){.site-header{position:sticky}.header-burger{display:inline-flex;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.header-inner{flex-direction:column;gap:10px;height:auto;padding:12px 0}.brand{text-align:center;align-items:center}.logo{font-size:18px}.promo{max-width:calc(100% - 60px);font-size:12px}.nav{display:none}}.tree-list{margin:0;padding-left:0;list-style:none}.tree-root{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;display:grid}.tree-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:6px 12px;transition:transform .2s,box-shadow .2s,border-color .2s}.tree-item:hover{box-shadow:var(--shadow-hover);border-color:var(--primary)}.tree-toggle{width:100%;color:var(--text);cursor:pointer;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;gap:8px;padding:6px 0;font-family:inherit;font-size:15px;font-weight:600;display:flex}.tree-icon{flex-shrink:0;font-size:18px;line-height:1}.tree-toggle .tree-name,.tree-link{flex:1}.tree-name:hover{color:var(--primary)}.tree-caret{color:var(--text-muted);font-size:14px;transition:transform .2s}.tree-caret.open{transform:rotate(90deg)}.tree-dropdown{border-left:2px solid var(--border);margin:4px 0;padding-left:14px;list-style:none}.tree-link{align-items:center;gap:8px;padding:8px 0;font-size:15px;font-weight:500;display:flex}.tree-link:hover{color:var(--primary)}@media (width<=720px){.tree-root{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.tree-list .tree-list{padding-left:12px}.tree-item{padding:4px 10px}}.mobile-nav{z-index:60;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom);align-items:stretch;display:none;position:fixed;bottom:0;left:0;right:0}.mnav-item{min-height:56px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:8px 4px;font-family:inherit;font-size:11px;font-weight:600;transition:color .2s,background .2s;display:flex}.mnav-icon{font-size:20px;line-height:1}.mnav-item.active{color:var(--primary)}.mnav-item:hover{background:var(--bg)}.drawer-overlay{z-index:70;opacity:0;visibility:hidden;background:#0f172a73;transition:opacity .25s,visibility .25s;position:fixed;inset:0}.drawer-overlay.open{opacity:1;visibility:visible}.category-drawer{z-index:80;background:var(--bg);width:min(85vw,320px);box-shadow:var(--shadow-hover);flex-direction:column;transition:transform .28s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%)}.category-drawer.open{transform:translate(0)}.drawer-header{background:var(--surface);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px;display:flex}.drawer-header h2{font-size:18px;font-weight:700}.drawer-close{border:1px solid var(--border);background:var(--surface);width:34px;height:34px;color:var(--text);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;font-size:15px;transition:background .2s,color .2s;display:inline-flex}.drawer-close:hover{background:var(--bg);color:var(--primary)}.drawer-body{flex:1;padding:12px 16px 24px;overflow-y:auto}.category-drawer .tree-root{display:block}@media (width<=720px){.mobile-nav{display:flex}body{padding-bottom:calc(56px + env(safe-area-inset-bottom))}}.error-page{text-align:center;max-width:640px;margin:0 auto;padding:80px 20px}.error-code{color:var(--primary);margin-bottom:12px;font-size:72px;font-weight:800;line-height:1}.error-page h1{margin-bottom:12px;font-size:26px}.error-page p{color:var(--text-muted);margin-bottom:24px}.error-page .btn{display:inline-block}.carousel{align-items:center;display:flex;position:relative}.carousel-track{scroll-snap-type:x mandatory;scrollbar-width:none;flex:1;gap:16px;padding:4px 0;display:flex;overflow-x:auto}.carousel-track::-webkit-scrollbar{display:none}.carousel-card{scroll-snap-align:start;flex:0 0 clamp(200px,22vw,280px);display:flex}.carousel-card .card{width:100%;height:100%}.carousel-btn{z-index:3;border:1px solid var(--border);background:var(--surface);width:40px;height:40px;color:var(--text);cursor:pointer;box-shadow:var(--shadow);border-radius:50%;font-size:26px;line-height:1;transition:background .2s,color .2s;position:absolute;top:50%;transform:translateY(-50%)}.carousel-btn:hover{background:var(--primary);color:#fff}.carousel-btn.prev{left:-6px}.carousel-btn.next{right:-6px}@media (width<=720px){.carousel-btn{width:32px;height:32px;font-size:20px}.carousel-card{flex-basis:clamp(150px,44vw,220px)}}.hero{text-align:center;padding:56px 0}.hero-logo{max-width:260px;height:auto;margin:0 auto 16px;display:block}.hero h1{letter-spacing:-1px;margin-bottom:12px;font-size:clamp(28px,4vw,44px);font-weight:800}.hero p{color:var(--text-muted);max-width:640px;margin:0 auto;font-size:18px}.section-title{margin:36px 0 16px;font-size:22px;font-weight:700}.home .container{padding-bottom:56px}@media (width<=720px){.home-categories{display:none}}.catalog-layout{grid-template-columns:300px 1fr;align-items:start;gap:24px;display:grid}.catalog-sidebar{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);max-height:calc(100vh - 100px);padding:14px;position:sticky;top:84px;overflow-y:auto}.catalog-sidebar .tree-root{display:block}.sidebar-item{cursor:pointer;border-radius:8px;align-items:center;gap:8px;margin-bottom:6px;padding:10px 12px;font-weight:600;transition:background .2s,color .2s;display:flex}.sidebar-item:hover{background:var(--bg);color:var(--primary)}.sidebar-item.active{background:var(--primary);color:#fff}.catalog-content{min-width:0}.catalog-toolbar{grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-bottom:16px;display:grid}.catalog-toolbar .page-sub{margin-bottom:0}.catalog-filters{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:12px;display:flex}.search-control input{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);width:100%;color:var(--text);padding:7px 12px;font-family:inherit;font-size:14px}.search-control input:focus{border-color:var(--primary);outline:none}@media (width<=640px){.catalog-toolbar{grid-template-columns:1fr;align-items:stretch}.search-control input{width:100%}.sort-control,.stock-control{justify-content:space-between}.sort-control select,.stock-control select{flex:1}.catalog-filters{justify-content:flex-start}}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.sort-control,.stock-control{color:var(--text-muted);align-items:center;gap:8px;font-size:14px;display:inline-flex}.sort-control select,.stock-control select{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);cursor:pointer;padding:6px 10px;font-family:inherit;font-size:14px}.pagination{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-top:28px;display:flex}.page-btn{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);min-width:38px;height:38px;color:var(--text);cursor:pointer;justify-content:center;align-items:center;padding:0 10px;font-weight:600;transition:background .2s,border-color .2s,color .2s;display:inline-flex}.page-btn:hover:not(.disabled){border-color:var(--primary);color:var(--primary)}.page-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.page-btn.disabled{opacity:.45;cursor:not-allowed}.page-gap{color:var(--text-muted);padding:0 2px}@media (width<=860px){.catalog-layout{grid-template-columns:1fr}.catalog-sidebar{max-height:none;padding:10px;position:static}}@media (width<=640px){.catalog-layout{gap:16px}.catalog-sidebar{display:none}}.product-detail{grid-template-columns:1fr 1fr;gap:36px;padding-top:8px;display:grid}.product-gallery{aspect-ratio:4/3;background:var(--product-img-background);border-radius:var(--radius);overflow:hidden}.product-gallery img{object-fit:contain;width:100%;height:100%}.magnify{cursor:zoom-in;width:100%;height:100%;overflow:hidden}.magnify-img{object-fit:contain;will-change:transform;width:100%;height:100%;transition:transform .2s}.magnify.zoomed .magnify-img{transform:scale(2)}.product-info h1{margin-bottom:10px;font-size:28px}.product-info .category{color:var(--primary);background:#1f6feb1a;border-radius:999px;margin-bottom:10px;padding:4px 12px;font-size:13px;font-weight:600;display:inline-block}.product-info .article{color:var(--text-muted);margin-bottom:8px;font-size:14px}.product-info .price{margin:16px 0;font-size:30px}.product-info .desc{color:var(--text-muted);margin-bottom:20px}.specs{border-top:1px solid var(--border);margin-top:24px;list-style:none}.specs li{border-bottom:1px solid var(--border);justify-content:space-between;padding:10px 0;font-size:15px;display:flex}.specs li span:first-child{color:var(--text-muted)}@media (width<=720px){.product-detail{grid-template-columns:1fr;gap:20px;padding-top:4px}.product-gallery{aspect-ratio:1}.product-info h1{font-size:23px}.product-info .price{font-size:24px}}
