.products-hero{background:linear-gradient(135deg,var(--primary) 0%,#003d7a 100%);color:#fff;padding:80px 0 60px;position:relative;overflow:hidden}.products-hero:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="40" fill="rgba(255,255,255,0.05)"/></svg>');opacity:.3}.hero-content{position:relative;z-index:1}.breadcrumb-nav{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:14px}.breadcrumb-nav a{color:#fff;text-decoration:none;transition:opacity .3s}.breadcrumb-nav a:hover{opacity:.8}.breadcrumb-nav span{color:#fff9}.page-title{font-size:42px;font-weight:700;margin-bottom:10px;line-height:1.2}.page-subtitle{font-size:20px;font-weight:400;margin-bottom:15px;opacity:.9}.products-count{font-size:16px;opacity:.8}.products-count span{font-weight:700}.products-section{padding:60px 0;background:#f8f9fa}.products-layout{display:grid;grid-template-columns:280px 1fr;gap:30px;position:relative}.filters-sidebar{background:#fff;border-radius:12px;padding:25px;height:fit-content;position:sticky;top:100px;box-shadow:0 2px 10px #0000000d}.filters-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;padding-bottom:15px;border-bottom:2px solid #f0f0f0}.filters-header h3{font-size:20px;font-weight:700;color:var(--secondary);margin:0}.btn-clear-filters{background:none;border:none;color:var(--primary);font-size:13px;font-weight:600;cursor:pointer;transition:all .3s;padding:5px 10px;border-radius:5px}.btn-clear-filters:hover{background:#0054a61a}.model-search-box{margin-bottom:20px;padding-bottom:20px;border-bottom:2px solid #f0f0f0}.search-input-wrapper{position:relative;display:flex;align-items:center;background:#f8f9fa;border:2px solid #e5e5e5;border-radius:8px;padding:10px 12px;transition:all .3s}.search-input-wrapper:focus-within{border-color:var(--primary);background:#fff;box-shadow:0 2px 8px #0054a61a}.search-input-wrapper i.fa-search{color:#999;font-size:14px;margin-right:10px}.model-search-input{flex:1;border:none;background:transparent;outline:none;font-size:14px;color:var(--secondary);padding:0}.model-search-input::placeholder{color:#999}.filters-content{display:flex;flex-direction:column;gap:20px}.filter-group{border:1px solid #e5e5e5;border-radius:8px;overflow:hidden;transition:all .3s}.filter-group:hover{border-color:var(--primary);box-shadow:0 2px 8px #0054a61a}.filter-group-header{display:flex;justify-content:space-between;align-items:center;padding:15px;background:#f8f9fa;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .3s}.filter-group-header:hover{background:#e9ecef}.filter-group-header h4{font-size:15px;font-weight:600;color:var(--secondary);margin:0}.filter-group-header i{color:var(--gray);font-size:12px;transition:transform .3s}.filter-group.active .filter-group-header i{transform:rotate(180deg)}.filter-group-body{padding:15px;display:flex;flex-direction:column;gap:12px;max-height:300px;overflow-y:auto}.filter-group-body::-webkit-scrollbar{width:6px}.filter-group-body::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}.filter-group-body::-webkit-scrollbar-thumb{background:var(--primary);border-radius:3px}.filter-checkbox{display:flex;align-items:center;gap:10px;cursor:pointer;padding:8px;border-radius:6px;transition:all .3s;position:relative}.filter-checkbox:hover{background:#0054a60d}.filter-checkbox input[type=checkbox]{position:absolute;opacity:0;cursor:pointer}.checkbox-custom{width:20px;height:20px;border:2px solid #d1d5db;border-radius:4px;position:relative;transition:all .3s;flex-shrink:0}.filter-checkbox input[type=checkbox]:checked~.checkbox-custom{background:var(--primary);border-color:var(--primary)}.filter-checkbox input[type=checkbox]:checked~.checkbox-custom:after{content:"";font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:11px}.checkbox-label{font-size:14px;color:var(--text);flex:1}.btn-toggle-filters{display:none}.products-main{display:flex;flex-direction:column;gap:25px}.products-toolbar{background:#fff;padding:20px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 10px #0000000d}.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:15px}.btn-filter-mobile{display:none;background:var(--primary);color:#fff;border:none;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s;gap:8px}.btn-filter-mobile:hover{background:#003d7a;transform:translateY(-2px);box-shadow:0 4px 12px #0054a64d}.sort-select{padding:10px 15px;border:2px solid #e5e5e5;border-radius:8px;font-size:14px;color:var(--text);cursor:pointer;transition:all .3s;background:#fff}.sort-select:hover,.sort-select:focus{border-color:var(--primary);outline:none}.products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.product-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 10px #0000000d;transition:all .3s;display:flex;flex-direction:column}.product-card:hover{transform:translateY(-8px);box-shadow:0 10px 30px #0054a626}.product-image-wrapper{position:relative;width:100%;height:200px;overflow:hidden;background:#f8f9fa;align-items:center;display:flex;justify-content:center}.product-image{width:100%;height:100%;object-fit:contain;transition:transform .5s;background:#fff;padding:20px}.product-card:hover .product-image{transform:scale(1.1)}.product-badge{position:absolute;top:15px;right:15px;background:var(--primary);color:#fff;padding:6px 12px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 2px 8px #0054a64d}.product-badge.sira{background:linear-gradient(135deg,#22c55e,#16a34a)}.product-info{padding:20px;display:flex;flex-direction:column;flex:1}.product-model{font-size:12px;color:var(--gray);font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;display:block}.product-title{font-size:18px;font-weight:700;color:var(--secondary);margin-bottom:10px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-brand{font-size:13px;color:var(--primary);margin-bottom:15px;display:flex;align-items:center;gap:6px}.product-brand i{font-size:11px}.btn-view-details{background:var(--primary);color:#fff;padding:12px 20px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:all .3s;margin-top:auto;align-self:flex-start}.btn-view-details:hover{background:var(--secondary);transform:translate(3px)}.btn-view-details i{font-size:12px;transition:transform .3s}.btn-view-details:hover i{transform:translate(5px)}.no-products{grid-column:1 / -1;text-align:center;padding:80px 20px;background:#fff;border-radius:12px}.no-products i{font-size:64px;color:#d1d5db;margin-bottom:20px}.no-products h3{font-size:24px;font-weight:700;color:var(--secondary);margin-bottom:10px}.no-products p{font-size:16px;color:var(--gray)}.pagination-wrapper{display:block;padding:40px 0 20px;width:100%;text-align:center}.pagination-wrapper nav{display:inline-block;text-align:center}.pagination-wrapper ul{display:inline-flex;gap:8px;list-style:none;margin:0;padding:0;vertical-align:middle}.pagination-wrapper li{display:inline-block;vertical-align:middle}.pagination-wrapper a,.pagination-wrapper span{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;border:2px solid #e5e5e5;border-radius:8px;color:var(--secondary);text-decoration:none;font-weight:600;font-size:14px;transition:all .2s ease;background-color:#fff;position:relative}.pagination-wrapper a[rel=prev],.pagination-wrapper a[rel=next]{min-width:100px;font-size:14px;font-weight:600}.pagination-wrapper a:hover{border-color:var(--primary)!important;background-color:var(--primary)!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 4px 8px #0054a633}.pagination-wrapper a:hover span,.pagination-wrapper a:hover svg{color:#fff!important;fill:#fff!important}.pagination-wrapper li.active span,.pagination-wrapper .active>span{background-color:var(--primary)!important;border-color:var(--primary)!important;color:#fff!important;box-shadow:0 2px 6px #0054a64d}.pagination-wrapper .disabled span,.pagination-wrapper .disabled a{opacity:.4;cursor:not-allowed;pointer-events:none;background-color:#f8f9fa}.pagination-wrapper svg{width:14px;height:14px;fill:currentColor;flex-shrink:0}.pagination-wrapper .dots{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;color:#999;font-weight:600;border:none!important;background:transparent!important;cursor:default;pointer-events:none}@media(max-width:1200px){.products-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:991px){.products-layout{grid-template-columns:1fr}.filters-sidebar{position:fixed;top:0;left:-100%;width:300px;height:100vh;z-index:9999;overflow-y:auto;transition:left .3s;padding-bottom:80px}.filters-sidebar.active{left:0}.btn-toggle-filters{display:block;position:fixed;bottom:20px;right:20px;background:var(--primary);color:#fff;border:none;width:60px;height:60px;border-radius:50%;font-size:20px;cursor:pointer;box-shadow:0 4px 20px #0054a666;z-index:999;transition:all .3s}.btn-toggle-filters:hover{transform:scale(1.1)}.btn-filter-mobile{display:flex;align-items:center}.products-toolbar{flex-direction:column;gap:15px}.toolbar-left,.toolbar-right{width:100%;justify-content:space-between}.page-title{font-size:32px}.page-subtitle{font-size:18px}}@media(max-width:768px){.products-hero{padding:60px 0 40px}.page-title{font-size:28px}.products-grid{grid-template-columns:1fr}.product-image-wrapper{height:220px}}@media(max-width:576px){.products-section{padding:40px 0}.filters-sidebar{width:280px}.page-title{font-size:24px}.page-subtitle{font-size:16px}}.filter-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:9998}.filter-overlay.active{display:block}.products-grid.loading{opacity:.5;pointer-events:none}.products-grid.loading:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;border:4px solid #f3f3f3;border-top:4px solid var(--primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}