/*
Theme Name: Matriz Zero
Theme URI: https://matrizzero.com.br
Author: Matriz Zero
Description: Tema da Matriz Zero (versão final do site): home interativa com roda de categorias, vitrine de produtos, comparador e análises.
Version: 2.2.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: matriz-zero
*/
:root{--bg:#020811;--bg2:#090c13;--line:#112a37;--tx:#ecfbff;--mu:#7fa0a9;--b:#4ca2d0;--c:#3cdeeb;--v:#2bcc85;--pop:hsl(222,47%,11%);--ac:#152e39;--mt:hsl(217,32%,17%);--inp:#223f56;--ring:#60a5c2;--bad:#7f1208;--ch1:#01ffcf;--ch2:#4ca2d0;--ch3:#4a9ec9;--ch4:#447D90;--ch5:#1c3d5f;--sb:#020811;--sb-p:#6cdeeb;--sb-a:hsl(217,32%,17%);--sb-b:#112a37;--r:18px;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media(prefers-color-scheme:light){:root:not([data-theme="dark"]){--bg:#020811}}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 72px);height:100%}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.6 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:Sora,Inter,sans-serif;line-height:1.12;margin:0;letter-spacing:-.02em}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--c);outline-offset:3px}
.w{max-width:1180px;margin:0 auto;padding:0 20px}
section{padding:84px 0}
.hd{margin-bottom:34px}.hd h2{font-size:clamp(26px,4vw,40px)}.hd p{color:var(--mu);margin:10px 0 0;max-width:56ch}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(2,8,17,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:22px;height:66px}
.logo{font:700 17px Sora,sans-serif;letter-spacing:.14em;display:flex;align-items:center;gap:10px}
.mk{width:34px;height:34px;border-radius:50%;display:block;flex:none}
.mk i{background:var(--line);border-radius:2px}.mk i:nth-child(5){background:linear-gradient(135deg,var(--c),var(--v))}
nav ul{display:flex;gap:18px;list-style:none;margin:0 auto;padding:0;font-size:14px;color:var(--mu)}
nav a:hover{color:var(--tx)}
.sb{display:flex;align-items:center;background:var(--bg2);border:1px solid var(--line);border-radius:99px;padding:0 6px 0 16px;width:250px}
.sb input{background:none;border:0;outline:0;flex:1;height:38px;min-width:0;font-size:14px}
.sb button{background:none;border:0;cursor:pointer;padding:6px;color:var(--mu)}
.bg{display:none;background:none;border:1px solid var(--line);border-radius:10px;width:40px;height:40px;cursor:pointer;margin-left:auto}
@media(max-width:1020px){.bg{display:block}.sb{display:none}nav{position:absolute;left:0;right:0;top:66px;background:var(--bg);border-bottom:1px solid var(--line);display:none;padding:14px 20px}nav.on{display:block}nav ul{flex-direction:column;gap:14px;font-size:17px}.msb{display:flex!important;width:100%;margin-bottom:14px}}
.msb{display:none}
.hero{position:relative;padding:70px 0 90px;overflow:hidden}
.grid{position:absolute;inset:0;background-image:radial-gradient(circle,#112a37 1.2px,transparent 1.4px);background-size:30px 30px;mask-image:radial-gradient(ellipse 70% 70% at 70% 45%,#000,transparent);-webkit-mask-image:radial-gradient(ellipse 70% 70% at 70% 45%,#000,transparent)}
.hg{position:relative;display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center}
@media(max-width:860px){.hg{grid-template-columns:1fr}}
.hero h1{font-size:clamp(40px,7vw,74px)}
.hero h1 span{background:linear-gradient(90deg,var(--c),var(--v));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{color:var(--mu);font-size:18px;max-width:46ch;margin:22px 0 30px}
.btn{display:inline-block;border:1px solid var(--line);background:var(--bg2);padding:13px 24px;border-radius:99px;font-weight:600;cursor:pointer;transition:transform .2s,border-color .2s}
.btn:hover{transform:translateY(-2px);border-color:var(--b)}
.btn.p{background:linear-gradient(135deg,#3cdeeb,#4ca2d0);border-color:transparent;color:#020811;box-shadow:0 0 26px -8px rgba(60,222,235,.7)}
.stage{position:relative;aspect-ratio:1;max-width:520px;margin:0 auto;width:100%}
.ring{position:absolute;inset:8%;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;animation:sp 60s linear infinite}
.ring::after{content:"";position:absolute;inset:14%;border-radius:50%;border:1px dashed #223f56}
.zero{position:absolute;inset:0;display:grid;place-items:center;font:700 clamp(120px,22vw,220px) Sora,sans-serif;color:transparent;-webkit-text-stroke:1.5px #223f56}
.dev{position:absolute;background:linear-gradient(160deg,#152e39,#090c13);border:1px solid #223f56;border-radius:14px;box-shadow:0 24px 50px -20px #000;display:grid;place-items:center;color:var(--c);animation:fl 7s ease-in-out infinite}
.dev svg{width:46%;height:46%}.dev.gm svg{width:62%;height:62%}
@keyframes fl{50%{transform:translateY(-12px)}}@keyframes sp{to{transform:rotate(360deg)}}
.tags{display:flex;gap:8px;flex-wrap:wrap}
.tag{font-size:12px;padding:3px 10px;border-radius:99px;background:rgba(60,222,235,.12);color:#6cdeeb;font-weight:600}
.tag.o{background:rgba(60,222,235,.13);color:var(--c)}
.tools{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px}
.tools select{background:var(--bg2);border:1px solid var(--inp);border-radius:12px;padding:9px 12px;font-size:14px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .25s,border-color .25s}
.card{cursor:pointer}.card:hover{transform:translateY(-5px);border-color:#447D90}
.im{aspect-ratio:4/3;display:grid;place-items:center;position:relative;background:radial-gradient(circle at 50% 40%,#152e39,#090c13);color:var(--c)}
.im svg{width:34%;transition:transform .35s}.card:hover .im svg{transform:scale(1.12)}
.im .tag{position:absolute;top:12px;left:12px}
.cb{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.cb h3{font-size:17px}.cb small{color:var(--mu)}
.sp{font-size:13px;color:var(--mu)}
.pr{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:auto}.pr b{font:700 22px Sora,sans-serif}.pr s{color:var(--mu);font-size:14px}.pr em{font-style:normal;color:var(--c);font-size:13px;font-weight:600}
.cb .btn{text-align:center;padding:10px;font-size:14px}
.cat{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.cat button{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:26px 14px;cursor:pointer;display:grid;gap:10px;justify-items:center;transition:border-color .2s,transform .2s}
.cat button:hover{border-color:var(--v);transform:translateY(-3px)}
.cat svg{width:38px;color:var(--c)}
.ed{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.art{border-radius:var(--r);border:1px solid var(--line);background:var(--bg2);overflow:hidden}
.art .im{aspect-ratio:16/8}.art div.t{padding:20px;display:grid;gap:8px}.art h3{font-size:19px}.art p{margin:0;color:var(--mu);font-size:15px}
.art a{color:var(--c);font-weight:600;font-size:14px}
.cmp{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:22px;overflow-x:auto}
.cmp table{width:100%;border-collapse:collapse;min-width:520px}
.cmp th,.cmp td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
.cmp th{color:var(--mu);font-weight:500;width:22%}
.sel{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}.sel select{flex:1;min-width:200px;background:var(--bg);border:1px solid var(--inp);border-radius:12px;padding:10px}
.offers{background:linear-gradient(180deg,transparent,#152e39 40%,transparent)}
.note{color:var(--mu);font-size:13px;margin-top:18px}
.row{display:flex;gap:14px;align-items:center;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:14px 18px;flex-wrap:wrap}
.row+.row{margin-top:12px}.row h3{font-size:16px;flex:1;min-width:180px}.row small{color:var(--mu);display:block;font:400 13px Inter}
.pil{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:30px}
.pil div{border-left:2px solid var(--b);padding:4px 0 4px 16px}.pil b{font:600 17px Sora,sans-serif}.pil p{margin:4px 0 0;color:var(--mu);font-size:15px}
.nl{background:var(--bg2);border:1px solid var(--line);border-radius:26px;padding:clamp(28px,5vw,56px);text-align:center;position:relative;overflow:hidden}
.nl form{display:flex;gap:10px;max-width:480px;margin:22px auto 0;flex-wrap:wrap}
.nl input{flex:1;min-width:200px;background:var(--bg);border:1px solid var(--inp);border-radius:99px;padding:13px 20px}
.soc{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
footer{border-top:1px solid var(--line);padding:56px 0 30px;color:var(--mu);font-size:14px}
.fg{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:30px}
.fg h4{color:var(--tx);margin:0 0 12px;font:600 14px Sora,sans-serif}.fg a{display:block;padding:3px 0}.fg a:hover{color:var(--tx)}
.fb{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
#pg{position:fixed;inset:0;z-index:100;background:var(--bg);overflow:auto;display:none;padding-top:env(safe-area-inset-top,0px)}
#pg.on{display:block;animation:up .35s}@keyframes up{from{opacity:0;transform:translateY(24px)}}
.pd{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin:24px 0 40px}
@media(max-width:820px){.pd{grid-template-columns:1fr}}
.pd .im{aspect-ratio:1;border-radius:var(--r);border:1px solid var(--line)}.pd .im svg{width:40%}
.gal{display:flex;gap:10px;margin-top:10px}.gal i{flex:1;aspect-ratio:1;border-radius:12px;border:1px solid var(--line);background:var(--bg2)}
ul.pp{padding-left:18px;color:var(--mu)}ul.pp li{margin:4px 0}
.crumb{font-size:13px;color:var(--mu);padding-top:18px}.crumb a{color:var(--c);cursor:pointer}
.sr{position:absolute;left:-9999px}
.ok{color:#2bcc85}.at{color:#ffc46b}
.tb{display:flex;gap:6px}.tb button{background:none;border:1px solid var(--line);border-radius:99px;padding:6px 14px;cursor:pointer;font-size:14px;color:var(--mu)}.tb .on{border-color:var(--c);color:var(--c)}
.stt{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:16px 0}.stt div{border:1px solid var(--line);border-radius:12px;padding:10px 14px}.stt b{display:block;font:700 18px Sora,sans-serif}.stt small{color:var(--mu);font-size:12px}
.cw{position:relative}.cw svg{width:100%;height:auto;display:block}.tp{position:absolute;pointer-events:none;background:var(--pop);border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-size:12px;transform:translate(-50%,-120%);white-space:nowrap;display:none}
.wh{display:grid;grid-template-columns:1fr 1.1fr;gap:30px;align-items:center}@media(max-width:820px){.wh{grid-template-columns:1fr}}
.wv{position:relative;height:440px;perspective:900px;overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent)}@media(max-width:820px){.wv{height:360px}}
.wi{position:absolute;left:8%;right:8%;top:50%;height:92px;margin-top:-46px;display:flex;align-items:center;gap:18px;padding:0 24px;border-radius:var(--r);border:1px solid var(--line);background:var(--bg2);backface-visibility:hidden;cursor:pointer}.wi svg{width:40px;flex:none;color:var(--c)}.wi b{font:600 18px Sora,sans-serif}.wi small{color:var(--mu);display:block}
.wi.on{border-color:var(--c);box-shadow:0 0 0 1px rgba(60,222,235,.3),0 20px 60px -20px rgba(60,222,235,.45)}
.buy{border:1px solid var(--line);border-radius:var(--r);padding:18px;background:var(--pop)}.buy h3{margin:0 0 14px}
.of{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:var(--bg2);display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.of.best{border-color:var(--c);box-shadow:0 0 0 1px rgba(60,222,235,.25),0 18px 50px -24px rgba(60,222,235,.5);padding:18px}
.wv{height:440px}
.gb{position:relative;height:66px;margin:8px 10px 0}.gbar{position:absolute;top:30px;left:0;right:0;height:6px;border-radius:9px;background:linear-gradient(90deg,#2bcc85,#ffc46b,#ff7a45,#e0352b)}
.gb>span{position:absolute;transform:translateX(-50%);text-align:center;font-size:12px;font-weight:600;line-height:1.1;white-space:nowrap}.gb .m1{top:0}.gb .m2{top:46px}.gb i{display:block;font-style:normal;font-size:9px;color:var(--c)}
.gb u{position:absolute;top:27px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--bg);transform:translateX(-50%)}
.lg{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:10px;font-size:13px}.lg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.btn.bw{background:#fff;color:#000;border-color:#fff}.btn.bw:hover{background:#e6fcff;border-color:#e6fcff}
.btn.bo{background:linear-gradient(135deg,#dc5a08,#b84300);color:#fff;border-color:transparent;box-shadow:0 0 26px -8px rgba(220,90,8,.65)}.btn.bo:hover{filter:brightness(1.08)}
.cxg{margin-top:20px;display:grid;gap:20px;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch}@media(max-width:900px){.cxg{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
:focus-visible{outline:2px solid var(--ring);outline-offset:2px}

.admin-bar header{top:32px}@media(max-width:782px){.admin-bar header{top:46px}}
.pgc img,.pgc video{max-width:100%;height:auto}.pgc ul{padding-left:20px}
.ent h1{font-size:clamp(28px,4vw,44px);margin-bottom:18px}.lst a{display:block;padding:16px 0;border-bottom:1px solid var(--line)}.lst small{display:block;color:var(--mu);margin-top:4px}

/* ===== 2.1.0: catálogo real (imagens, ofertas, histórico, comparador) ===== */
.im img{max-width:80%;max-height:80%;object-fit:contain;background:#fff;border-radius:14px;padding:10px;transition:transform .35s}
.card:hover .im img{transform:scale(1.05)}
.pd .im img{max-width:86%;max-height:86%;padding:18px}
.pr s:empty,.pr em:empty{display:none}
.of small{display:block}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.chips span{font-size:12px;border:1px solid var(--line);border-radius:99px;padding:2px 10px;color:var(--mu)}
.chips .ok{border-color:rgba(43,204,133,.4);color:var(--v)}.chips .at{border-color:rgba(255,196,107,.4);color:#ffc46b}
.rt{color:var(--mu);font-size:14px}.rt b{color:var(--tx)}
.cmp td.dif{color:var(--c)}
.vazio{border:1px dashed var(--line);border-radius:var(--r);padding:28px;text-align:center;color:var(--mu)}
/* ===== 2.2.0: páginas reais de produto, categoria, marca e busca ===== */
main .w.produto,main .w.lista{padding-bottom:20px}
.lista h1{font-size:clamp(30px,5vw,50px);margin:22px 0 10px}
.lista .lead{color:var(--mu);max-width:60ch;margin:0 0 26px}
.lt{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 20px;color:var(--mu);font-size:14px}
.lt .sel{margin:0}.lt select{min-width:200px;background:var(--bg2);border:1px solid var(--inp);border-radius:12px;padding:9px 12px;font-size:14px}
.pag{display:flex;gap:8px;flex-wrap:wrap;margin:30px 0 10px}
.pag a,.pag span{min-width:40px;text-align:center;padding:8px 12px;border:1px solid var(--line);border-radius:10px;font-variant-numeric:tabular-nums}
.pag span{border-color:var(--c);color:var(--c)}.pag a:hover{border-color:var(--b)}
.mais-link{margin:22px 0 0;text-align:center}
details.mais{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
details.mais summary{cursor:pointer;color:var(--c);font-weight:600;font-size:14px}
details.mais table{margin-top:8px}
.rt a{color:var(--c)}
.produto .crumb{padding-top:22px}
form.sb{margin:0}