:root{
  --black:#090909;--black2:#151515;--white:#fff;--text:#1c1d20;--muted:#6b7280;
  --line:#e5e7eb;--soft:#f6f7f8;--cyan:#00bdf2;--magenta:#ef168f;--yellow:#ffd51f;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,Arial,sans-serif;background:#fff;color:var(--text)}
a{text-decoration:none;color:inherit}
button,input,select{font:inherit}
img{display:block;max-width:100%}
.container{width:min(1180px,calc(100% - 28px));margin:auto}

.site-header{background:var(--black);color:#fff;position:sticky;top:0;z-index:60}
.header-top{background:#070707;border-bottom:1px solid #242424}
.header-top-row{display:grid;grid-template-columns:180px 1fr 190px;gap:22px;align-items:center;padding:10px 0}
.brand img{width:145px;height:67px;object-fit:cover}
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.benefits div{display:flex;flex-direction:column;border-right:1px solid #2a2a2a;padding-right:10px}
.benefits strong{font-size:.74rem}.benefits span{font-size:.66rem;color:#999;margin-top:2px}
.whatsapp{display:flex;flex-direction:column;align-items:flex-end}
.whatsapp span{font-size:.72rem;color:#aaa}.whatsapp strong{font-size:.92rem}
.search-band{padding:6px 0 8px;background:#0b0b0b}
.search-box{position:relative;display:flex;max-width:660px;margin:auto;background:#fff;border-radius:4px;overflow:visible}
.search-box input{flex:1;border:0;outline:0;padding:11px;color:#111;border-radius:4px 0 0 4px}
.search-box button{border:0;background:#232323;color:#fff;padding:0 18px;cursor:pointer;border-radius:0 4px 4px 0}
.search-results{display:none;position:absolute;top:45px;left:0;right:0;background:#fff;color:#111;border:1px solid var(--line);box-shadow:0 12px 30px rgba(0,0,0,.18);z-index:80;padding:6px}
.search-results.active{display:block}.search-results a{display:block;padding:9px;font-size:.84rem}.search-results a:hover{background:var(--soft)}
.menu-band{background:#111;border-top:1px solid #252525}
.main-menu{display:flex;gap:23px;align-items:center;min-height:40px;font-size:.8rem;font-weight:700}
.main-menu a{color:#fff}.main-menu a:hover,.main-menu a.active{color:var(--cyan)}
.mobile-menu{display:none}

.category-hero{background:linear-gradient(110deg,#111,#202020);color:#fff;border-top:1px solid #1e1e1e}
.category-hero-inner{min-height:280px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px}
.eyebrow{font-size:.7rem;letter-spacing:.16em;color:var(--cyan);font-weight:800}
.category-hero h1{font:800 3.2rem Montserrat;margin:7px 0 12px}
.category-hero p{color:#bbb;max-width:620px;line-height:1.65}
.hero-art{height:100%;position:relative}
.sheet{position:absolute;display:grid;place-items:center;font:800 .8rem Montserrat;box-shadow:0 20px 40px rgba(0,0,0,.35)}
.sheet1{width:175px;height:100px;background:linear-gradient(135deg,var(--cyan),var(--magenta));right:230px;top:110px;transform:rotate(-8deg)}
.sheet2{width:155px;height:205px;background:#fff;color:#111;right:90px;top:35px;transform:rotate(8deg)}
.sheet3{width:145px;height:85px;background:var(--yellow);color:#111;right:20px;bottom:40px;transform:rotate(-4deg)}

.catalog-shell{padding:30px 0 45px;background:#fff}
.catalog-layout{display:grid;grid-template-columns:240px 1fr;gap:24px;align-items:start}
.sidebar{border:1px solid var(--line);background:#fff;position:sticky;top:178px}
.side-title{background:#151515;color:#fff;padding:12px 14px;text-transform:uppercase;font-size:.82rem;font-weight:800}
.side-toggle,.side-link{display:flex;width:100%;justify-content:space-between;align-items:center;padding:10px 12px;border:0;border-bottom:1px solid #ececec;background:#fff;font-size:.8rem;text-align:left;cursor:pointer}
.side-toggle:hover,.side-link:hover{background:#f7f7f7}
.side-list{display:none;background:#fafafa;border-bottom:1px solid #ececec}
.side-list.open{display:block}.side-list a{display:block;padding:8px 12px 8px 24px;font-size:.76rem;color:#666}
.side-contact{margin:14px;padding:14px;background:#111;color:#fff;border-radius:6px;display:flex;flex-direction:column}
.side-contact strong{font-size:.8rem}.side-contact span{font-size:.7rem;color:#aaa;margin:5px 0 10px;line-height:1.4}
.side-contact a{font-size:.72rem;background:#fff;color:#111;padding:8px;text-align:center;font-weight:800;border-radius:4px}

.catalog-toolbar{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:12px}
.catalog-toolbar>div:first-child{display:flex;flex-direction:column}
.catalog-toolbar strong{font:800 1.35rem Montserrat}.catalog-toolbar span{font-size:.72rem;color:var(--muted);margin-top:3px}
.toolbar-actions select{padding:8px 10px;border:1px solid var(--line);background:#fff;font-size:.77rem}
.chips{display:flex;gap:7px;flex-wrap:wrap;padding:14px 0 18px}
.chip{border:1px solid var(--line);background:#fff;padding:8px 11px;border-radius:999px;font-size:.73rem;cursor:pointer}
.chip.active,.chip:hover{background:#111;color:#fff;border-color:#111}

.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}
.product-card{border:1px solid var(--line);background:#fff;transition:.2s}
.product-card:hover{box-shadow:0 10px 26px rgba(0,0,0,.08);transform:translateY(-2px)}
.product-card.hidden{display:none}
.product-image{height:145px;display:grid;place-items:center;color:#fff;font:800 .83rem Montserrat;letter-spacing:.05em}
.product-info{padding:12px}
.product-info>span{font-size:.64rem;color:var(--muted)}
.product-info h3{font:700 .88rem Montserrat;margin:5px 0 6px}
.product-info p{font-size:.72rem;line-height:1.42;color:var(--muted);min-height:48px}
.product-info a{display:inline-block;margin-top:8px;border:1px solid #bfc1c5;padding:7px 10px;border-radius:3px;font-size:.7rem;font-weight:700}
.product-info a:hover{background:#111;color:#fff;border-color:#111}

.pi1{background:linear-gradient(145deg,#171717,#424242)}.pi2{background:linear-gradient(145deg,#00bdf2,#4460e2)}.pi3{background:linear-gradient(145deg,#eaeaea,#aaa);color:#111}
.pi4{background:linear-gradient(145deg,#ef168f,#ff7e17)}.pi5{background:linear-gradient(145deg,#3149c9,#00bdf2)}.pi6{background:linear-gradient(145deg,#ffd51f,#f0880c);color:#111}
.pi7{background:linear-gradient(145deg,#d6c2a3,#7e6a52)}.pi8{background:linear-gradient(145deg,#7e5c7d,#342238)}.pi9{background:linear-gradient(145deg,#1e1e1e,#5a5a5a)}
.pi10{background:linear-gradient(145deg,#4d7898,#193246)}.pi11{background:linear-gradient(145deg,#e8e8e8,#bdbdbd);color:#111}.pi12{background:linear-gradient(145deg,#fafafa,#d5d5d5);color:#111}
.pi13{background:linear-gradient(145deg,#c7b69f,#806b50)}.pi14{background:linear-gradient(145deg,#111,#383838)}.pi15{background:linear-gradient(145deg,#00a5c9,#0e6072)}
.pi16{background:linear-gradient(145deg,#ef168f,#8b1458)}.pi17{background:linear-gradient(145deg,#666,#222)}.pi18{background:linear-gradient(145deg,#ffd51f,#d25d0c);color:#111}
.pi19{background:linear-gradient(145deg,#e8e1d5,#947f65);color:#111}.pi20{background:linear-gradient(145deg,#a6688e,#5a2f4a)}.pi21{background:linear-gradient(145deg,#181818,#6a3b1d)}
.pi22{background:linear-gradient(145deg,#00bdf2,#633ecc)}.pi23{background:linear-gradient(145deg,#ef168f,#ff9a16)}.pi24{background:linear-gradient(145deg,#3a8b9f,#214654)}
.pi25{background:linear-gradient(145deg,#333,#0b0b0b)}.pi26{background:linear-gradient(145deg,#ffd51f,#d68409);color:#111}.pi27{background:linear-gradient(145deg,#e8e8e8,#8f8f8f);color:#111}
.pi28{background:linear-gradient(145deg,#ef168f,#5c1542)}

.category-cta{background:#171717;color:#fff;padding:24px 0}
.category-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}
.category-cta-inner div{display:flex;flex-direction:column}.category-cta-inner span{font-size:.76rem;color:#aaa;margin-top:4px}
.category-cta-inner a{background:#fff;color:#111;padding:10px 15px;border-radius:4px;font-size:.78rem;font-weight:800}

.footer{background:#0a0a0a;color:#fff;padding:40px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:28px}
.footer img{width:125px;height:60px;object-fit:cover;margin-bottom:12px}
.footer p,.footer a,.footer span{color:#aaa;font-size:.75rem;line-height:1.6}
.footer h4{font:700 .8rem Montserrat;margin-bottom:8px}
.footer-grid>div:not(:first-child){display:flex;flex-direction:column;gap:5px}
.footer-bottom{border-top:1px solid #242424;margin-top:28px;padding-top:14px;color:#666;font-size:.7rem}

@media(max-width:1000px){
  .header-top-row{grid-template-columns:150px 1fr}.benefits{display:none}.whatsapp{justify-self:end}
  .mobile-menu{display:block;background:#fff;color:#111;border:0;padding:8px 11px;margin:5px 0}
  .main-menu{display:none;flex-direction:column;align-items:flex-start;padding:8px 0}.main-menu.open{display:flex}
  .catalog-layout{grid-template-columns:1fr}.sidebar{display:none}
  .product-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:700px){
  .header-top-row{grid-template-columns:1fr}.brand img{margin:auto}.whatsapp{display:none}
  .category-hero-inner{grid-template-columns:1fr;min-height:230px}.hero-art{display:none}
  .category-hero h1{font-size:2.5rem}
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .category-cta-inner{flex-direction:column;align-items:flex-start}
}
@media(max-width:430px){
  .product-grid,.footer-grid{grid-template-columns:1fr}
}
