:root{--bg:#fffdf5;--alt:#fff1c9;--ink:#111;--mut:#555;--y:#ffd23f;--b:#3a6df0;--p:#ff8fc1;--g:#5eead4;--bd:3px solid var(--ink);--sh:5px 5px 0 var(--ink);--fd:'Archivo',system-ui,sans-serif;--fb:'Work Sans',system-ui,sans-serif}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font:400 17px/1.7 var(--fb);color:var(--ink);background:var(--bg);overflow-x:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}a{color:inherit;text-decoration:none}ul{list-style:none;padding:0}
.wrap{width:min(1220px,92%);margin:auto}.narrow{width:min(780px,92%)}.sr{position:absolute;left:-9999px}
h1,h2,h3{font-family:var(--fd);line-height:1.05;font-weight:900}h1{font-size:clamp(2.5rem,6vw,5rem)}h2{font-size:clamp(1.8rem,3.6vw,2.7rem);margin-bottom:1rem}h3{font-size:1.15rem;font-weight:800}
mark{background:var(--y);padding:0 .15em;box-shadow:3px 3px 0 var(--ink)}
.eyebrow{display:inline-block;background:var(--p);border:var(--bd);padding:2px 14px;font:800 .75rem var(--fd);text-transform:uppercase;letter-spacing:.08em;margin-bottom:1rem;box-shadow:3px 3px 0 var(--ink)}
.sec{padding:84px 0}.alt{background:var(--alt);border-block:var(--bd)}.two{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:32px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:32px}.head{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap}.head h2{margin:0}
.box{background:#fff;border:var(--bd);box-shadow:var(--sh);padding:32px}
.topbar{background:var(--ink);color:var(--y);text-align:center;font:700 .8rem var(--fd);padding:7px 10px;letter-spacing:.04em}
.hdr{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:var(--bd)}.bar{display:flex;align-items:center;gap:20px;min-height:76px}
.logo{font:900 1.4rem var(--fd);display:flex;gap:10px;align-items:center;flex:none}.logo i{width:28px;height:28px;background:var(--y);border:var(--bd);box-shadow:3px 3px 0 var(--ink);transform:rotate(8deg)}
.menu{display:flex;align-items:center;gap:22px;flex:1;justify-content:flex-end}.menu ul{display:flex;gap:20px}.menu li{position:relative}
.menu a:not(.btn){font-weight:700;font-size:.9rem;position:relative}.menu li>a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:3px;background:var(--b);transform:scaleX(0);transform-origin:right;transition:transform .3s}.menu li>a:hover::after,.menu a.on::after{transform:scaleX(1);transform-origin:left}
.search{display:flex;border:var(--bd);background:#fff}.search input{border:0;padding:8px 12px;font:inherit;font-size:.85rem;width:170px;background:transparent}.search input:focus{outline:2px solid var(--b)}.search button{border:0;border-left:var(--bd);background:var(--y);width:40px;cursor:pointer;display:grid;place-items:center}.search svg{width:18px}
.tpl small{background:var(--g);border:2px solid var(--ink);font-size:.55rem;padding:0 5px;margin-left:4px;text-transform:uppercase;font-weight:800}
.sub ul{position:absolute;top:100%;left:-14px;min-width:190px;background:#fff;border:var(--bd);box-shadow:var(--sh);padding:10px 18px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.25s;margin-top:18px;display:block}.sub:hover ul,.sub:focus-within ul{opacity:1;visibility:visible;transform:none}.sub ul li{padding:5px 0}
.cartlink{position:relative;display:grid;place-items:center;width:46px;height:46px;border:var(--bd);background:var(--y);box-shadow:3px 3px 0 var(--ink);flex:none;transition:transform .2s,box-shadow .2s}.cartlink:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}.cartlink svg{width:22px}.cartlink span{position:absolute;top:-10px;right:-10px;background:var(--b);color:#fff;border:2px solid var(--ink);font:800 .7rem var(--fd);min-width:22px;height:22px;display:grid;place-items:center;border-radius:50%}
.btn{display:inline-flex;gap:8px;align-items:center;justify-content:center;background:var(--y);color:var(--ink);padding:14px 26px;font:800 .9rem var(--fd);border:var(--bd);box-shadow:var(--sh);cursor:pointer;transition:transform .2s,box-shadow .2s;text-transform:uppercase;letter-spacing:.03em}.btn:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--ink)}.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}.btn svg{width:18px}.btn.sm{padding:9px 16px;font-size:.78rem;box-shadow:3px 3px 0 var(--ink)}.alt2{background:#fff}
.lnk{font-weight:800;display:inline-flex;gap:8px;align-items:center;border-bottom:3px solid var(--b)}.lnk svg{width:18px;transition:transform .3s}.lnk:hover svg{transform:translateX(5px)}
.burger{display:none;background:var(--y);border:var(--bd);width:46px;height:46px;cursor:pointer;flex-direction:column;justify-content:center;gap:6px;align-items:center}.burger span{width:20px;height:3px;background:var(--ink);transition:transform .3s}.burger[aria-expanded=true] span:first-child{transform:translateY(4.5px) rotate(45deg)}.burger[aria-expanded=true] span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
.hero{padding:64px 0 80px}.hgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}.lead{font-size:1.15rem;color:var(--mut);margin:22px 0 30px;max-width:500px}.acts{display:flex;gap:18px;flex-wrap:wrap}
.collage{position:relative;display:grid;grid-template-columns:1.3fr 1fr;gap:16px;align-items:end}.collage .a{aspect-ratio:3/4}.collage .b{aspect-ratio:1/1.2}.sticker{position:absolute;top:-22px;right:-8px;background:var(--p);border:var(--bd);border-radius:50%;width:112px;height:112px;display:grid;place-content:center;text-align:center;font:800 .8rem/1.1 var(--fd);transform:rotate(12deg);box-shadow:var(--sh);animation:w 4s ease-in-out infinite}.sticker b{font-size:1.7rem}@keyframes w{50%{transform:rotate(4deg) scale(1.05)}}
.ph{overflow:hidden;border:var(--bd);background:var(--alt)}.ph img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}.ph:hover img,.pc:hover img,.cat-t:hover img,.bc:hover img{transform:scale(1.08)}
.sub-hero{background:var(--y);border-block:var(--bd);padding:36px 0}.usps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.usp{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center}.usp small{grid-column:2;color:#333}.usp b{font:800 1rem var(--fd)}.ib{grid-row:span 2;display:grid;place-items:center;width:50px;height:50px;background:#fff;border:var(--bd)}.ib svg{width:24px}
.cat-t{display:block;border:var(--bd);box-shadow:var(--sh);background:var(--y);transition:transform .25s,box-shadow .25s}.cat-t.c1{background:var(--p)}.cat-t.c2{background:var(--g)}.cat-t.c3{background:#b7c9ff}.cat-t:hover,.pc:hover,.bc:hover .ph{transform:translate(-4px,-4px);box-shadow:9px 9px 0 var(--ink)}.cat-t .ph{border:0;border-bottom:var(--bd);aspect-ratio:1}.cat-t h3{padding:14px 16px;display:flex;justify-content:space-between;align-items:center}.cat-t svg{width:20px}
.pc{background:#fff;border:var(--bd);box-shadow:var(--sh);transition:transform .25s,box-shadow .25s,opacity .8s}.pimg{display:block;position:relative;aspect-ratio:1;overflow:hidden;border-bottom:var(--bd)}.tag{position:absolute;top:12px;left:12px;background:var(--p);border:2px solid var(--ink);font:800 .7rem var(--fd);padding:2px 10px;text-transform:uppercase}.pb{padding:18px}.cat{font:800 .72rem var(--fd);text-transform:uppercase;letter-spacing:.08em;color:var(--b)}.pb h3{margin:4px 0 8px}.pb h3 a:hover{color:var(--b)}.pr{display:flex;gap:10px;align-items:baseline;margin-bottom:14px}.pr b,.price b{font:900 1.3rem var(--fd)}.pr s,.price s{color:var(--mut)}
.promo{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;background:var(--b);color:#fff;border:var(--bd);box-shadow:8px 8px 0 var(--ink);padding:48px}.promo .ph{aspect-ratio:4/3}.promo p{margin-bottom:24px}.promo .eyebrow{color:var(--ink)}
.brands{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;margin-top:28px}.brands span{font:900 1.6rem var(--fd);color:#aaa;transition:color .3s,transform .3s}.brands span:hover{color:var(--ink);transform:translateY(-3px)}
.rev{background:#fff;border:var(--bd);box-shadow:var(--sh);padding:28px}.stars{display:inline-flex;color:#f5a400}.stars svg{width:20px}.rev blockquote{margin:12px 0 20px}.rev figcaption{display:flex;gap:12px;align-items:center;font-size:.85rem;color:var(--mut)}.rev figcaption img{width:50px;height:50px;border:var(--bd);border-radius:50%}.rev b{color:var(--ink)}
.bc{display:block}.bc .ph{aspect-ratio:16/10;margin-bottom:14px;transition:transform .25s,box-shadow .25s;box-shadow:var(--sh)}.bc span{font:800 .75rem var(--fd);text-transform:uppercase;color:var(--b);letter-spacing:.08em}.bc h3{font-size:1.25rem;margin-top:4px}.bc:hover h3{text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--y)}
.form{display:grid;gap:16px}.form label{display:grid;gap:6px;font:800 .82rem var(--fd);text-transform:uppercase;letter-spacing:.05em}.f2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form input,.form textarea,.form select,.buy select,.sorting select,.coupon input{font:500 1rem var(--fb);padding:12px 14px;border:var(--bd);background:#fff;color:var(--ink);text-transform:none;letter-spacing:0;width:100%}.form input:focus,.form textarea:focus,.form select:focus,.coupon input:focus{outline:3px solid var(--b)}
details{border:var(--bd);background:#fff;padding:18px 22px;margin-bottom:16px;box-shadow:3px 3px 0 var(--ink)}summary{cursor:pointer;font:800 1.05rem var(--fd);list-style:none;display:flex;justify-content:space-between;gap:16px}summary::after{content:"+";font-size:1.5rem;line-height:1;transition:transform .3s}details[open] summary::after{transform:rotate(45deg)}details p{color:var(--mut);margin-top:10px}
.phero{background:var(--alt);border-bottom:var(--bd);padding:56px 0}.phero p:not(.crumb){margin-top:12px;color:var(--mut)}.crumb{font:700 .8rem var(--fd);text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}.crumb a{color:var(--b)}
.shopgrid{display:grid;grid-template-columns:250px 1fr;gap:40px;align-items:start}.side{background:#fff;border:var(--bd);box-shadow:var(--sh);padding:24px;position:sticky;top:110px}.side h3{margin:0 0 12px}.side h3:not(:first-child){margin-top:24px}.side label{display:block;padding:3px 0;font-size:.95rem}.side input[type=range]{width:100%;accent-color:var(--b);margin-bottom:16px}.side input[type=checkbox],.pay input{accent-color:var(--b);width:17px;height:17px;margin-right:8px;vertical-align:-3px}
.sorting{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.sorting select{width:auto}.g0{margin-top:24px}
.pag{display:flex;gap:10px;justify-content:center;margin-top:48px}.pag a{min-width:44px;height:44px;padding:0 14px;display:grid;place-items:center;border:var(--bd);background:#fff;font:800 .9rem var(--fd);transition:.2s}.pag a:hover,.pag a.on{background:var(--y);box-shadow:3px 3px 0 var(--ink)}
.prod{align-items:start}.main{aspect-ratio:1;margin-bottom:16px}.thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.thumbs .ph{aspect-ratio:1;cursor:pointer}.rating{display:flex;gap:10px;align-items:center;margin-bottom:8px;color:var(--mut)}.price{margin:6px 0 16px}.price b{font-size:2rem}.prod p{margin-bottom:16px}.buy{margin:22px 0}.buy label{font:800 .8rem var(--fd);text-transform:uppercase;display:grid;gap:6px;margin-bottom:16px}.qtyrow{display:flex;gap:14px}.qtyrow input{width:84px;padding:12px;border:var(--bd);font:inherit}
.ticks{margin-bottom:24px}.ticks li{padding:4px 0 4px 30px;position:relative;font-weight:600}.ticks li::before{content:"";position:absolute;left:3px;top:11px;width:15px;height:8px;border-left:3px solid var(--b);border-bottom:3px solid var(--b);transform:rotate(-45deg)}
.cartgrid{display:grid;grid-template-columns:1.6fr 1fr;gap:36px;align-items:start}.tw{overflow-x:auto;border:var(--bd);box-shadow:var(--sh);background:#fff}.ct{width:100%;border-collapse:collapse}.ct th{background:var(--y);font:800 .8rem var(--fd);text-transform:uppercase;text-align:left;padding:14px;border-bottom:var(--bd)}.ct td{padding:16px 14px;border-bottom:2px solid #eee;vertical-align:middle}.cp{display:flex;gap:14px;align-items:center;min-width:220px}.cp .ph{width:72px;height:72px;flex:none}.ct input{width:70px;padding:8px;border:var(--bd);font:inherit}.rm{display:grid;place-items:center;width:34px;height:34px;border:2px solid var(--ink);transition:.2s}.rm:hover{background:var(--p)}.rm svg{width:16px}
.coupon{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}.coupon input{flex:1;min-width:160px;width:auto}
.totals h3{font-size:1.4rem;margin-bottom:16px}.totals dl{display:grid;grid-template-columns:1fr auto;gap:10px 16px;margin-bottom:22px}.totals dd{font-weight:700;text-align:right}.totals .t{font:900 1.2rem var(--fd);border-top:var(--bd);padding-top:12px;margin-top:6px}.totals .btn{width:100%}.pay{display:grid;gap:10px;margin-bottom:22px;font-weight:600}
.prose .ph{margin-bottom:28px;aspect-ratio:16/9}.prose h2{margin-top:2rem;font-size:1.6rem}.prose p{margin-bottom:1rem;color:var(--mut)}
.ftr{background:var(--ink);color:#ccc;padding:64px 0 0;font-size:.95rem;border-top:var(--bd)}.ftr .logo{color:#fff;margin-bottom:12px}.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px}.ftr h4{color:var(--y);font:800 1rem var(--fd);text-transform:uppercase;margin-bottom:12px}.ftr a:not(.logo){display:block;padding:3px 0}.ftr a:not(.logo):hover{color:var(--y)}.copy{margin-top:48px;padding:22px 0;border-top:1px solid #333;font-size:.85rem}
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s,transform .7s}.js .reveal.in{opacity:1;transform:none}
@media(max-width:1000px){.two,.hgrid,.promo,.cartgrid,.shopgrid{grid-template-columns:1fr;gap:36px}.grid4,.usps{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:1fr 1fr}.fgrid{grid-template-columns:1fr 1fr}.sec{padding:60px 0}.promo{padding:28px}.side{position:static}
.js .burger{display:flex;margin-left:auto}.bar{gap:14px}.js .menu{position:fixed;inset:auto 4% auto;top:118px;max-height:calc(100vh - 134px);background:#fff;border:var(--bd);box-shadow:var(--sh);flex-direction:column;align-items:stretch;padding:24px;gap:18px;overflow:auto;transform:translateY(-12px);opacity:0;visibility:hidden;transition:.25s}.js .menu.open{transform:none;opacity:1;visibility:visible}.menu ul{flex-direction:column;gap:12px}.menu a:not(.btn){font-size:1.1rem}.search input{width:100%}.search{order:-1}.sub ul{position:static;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;padding:6px 0 0 14px;margin:0}
.no-js .bar{flex-wrap:wrap;padding:10px 0}.no-js .menu,.no-js .menu ul{flex-wrap:wrap;gap:12px}.js .cartlink{margin-left:auto}.js .burger{margin-left:0}}
@media(max-width:640px){.grid3,.grid4,.fgrid,.f2{grid-template-columns:1fr}.usps{grid-template-columns:1fr}.sticker{right:6px}.ct thead{position:absolute;left:-9999px}.ct,.ct tbody,.ct tr,.ct td{display:block;width:100%}.ct tr{border-bottom:var(--bd);padding:10px 0}.ct td{display:flex;justify-content:space-between;align-items:center;border:0;padding:8px 14px}.ct td::before{content:attr(data-l);font:800 .75rem var(--fd);text-transform:uppercase}.ct td:first-child::before,.ct td:last-child::before{content:none}.cp{min-width:0}.collage{grid-template-columns:1fr}.collage .b{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}.js .reveal{opacity:1;transform:none}}
