/* Catálogo /produtos v2 — Modernista (mock Catalogo.dc.html / artefato Claude).
   Prefixo pf-cv- para não colidir com .pf-btn/.pf-card/.pf-row globais (estilo.css, carrinho.css). */
:root{--pf-cv-navy:#003352;--pf-cv-brand:#0057a6;--pf-cv-accent:#00a3e0;--pf-cv-muted:#56657a;--pf-cv-line:#d7e1ea;--pf-cv-offer:#c2410c}

/* ---------- Botão paralelogramo (pf-btn/pf-plate) ---------- */
.pf-cv-btn{--pl:#0057a6;--sw:#00477f;--tx:#fff;--txh:#fff;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 22px;border:0;border-radius:0;background:transparent;box-shadow:none;cursor:pointer;font-family:'Barlow Condensed','Prompt',sans-serif;font-weight:600;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--tx);isolation:isolate;transition:color 120ms;white-space:nowrap;text-decoration:none;width:auto;height:auto;clip-path:none}
.pf-cv-btn:hover,.pf-cv-btn:focus{color:var(--txh);background:transparent;text-decoration:none}
.pf-cv-plate{position:absolute;inset:0;background:var(--pl);clip-path:polygon(9px 0,100% 0,calc(100% - 9px) 100%,0 100%);overflow:hidden;z-index:-1}
.pf-cv-plate::after{content:'';position:absolute;top:0;bottom:0;left:-25%;width:150%;background:var(--sw);transform:translateX(-105%) skewX(-12deg);transition:transform 420ms cubic-bezier(.7,0,.2,1)}
.pf-cv-btn:hover .pf-cv-plate::after{transform:translateX(0) skewX(-12deg)}
.pf-cv-btn:focus-visible{outline:2px solid #0057a6;outline-offset:2px}
.pf-cv-btn[disabled],.pf-cv-btn.is-disabled{cursor:not-allowed;color:#56657a;pointer-events:none}
.pf-cv-btn[disabled] .pf-cv-plate,.pf-cv-btn.is-disabled .pf-cv-plate{background:#e3e9ef}
.pf-cv-btn[disabled] .pf-cv-plate::after,.pf-cv-btn.is-disabled .pf-cv-plate::after,.pf-cv-btn.is-disabled .pf-cv-plate::before{display:none}
.pf-cv-outline{--pl:#003352;--sw:#003352;--tx:#003352;--txh:#fff}
.pf-cv-outline .pf-cv-plate::before{content:'';position:absolute;inset:2px;background:#fff;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.pf-cv-outline .pf-cv-plate::after{z-index:1}
.pf-cv-calc{--pl:#003352;--sw:#0057a6}
.pf-cv-done,.pf-ec-add--added.pf-cv-btn{--pl:#0f6b34;--sw:#0a5228}
.pf-cv-btn--block{width:100%}

/* ---------- Header de resultado ---------- */
.pf-cv-hero{position:relative;overflow:hidden;background:#003352;color:#fff;padding:28px 0 36px}
.pf-cv-hero::after{content:'';position:absolute;top:0;bottom:0;right:-10%;width:45%;background:#0b3c59;transform:skewX(-12deg);pointer-events:none}
.pf-cv-hero-in{position:relative;z-index:1}
.pf-cv-crumb{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;font:400 13px/1.4 'Prompt',sans-serif;color:#b9cde0}
.pf-cv-crumb a{color:#b9cde0;text-decoration:none}.pf-cv-crumb a:hover{color:#fff;text-decoration:underline}
.pf-cv-crumb [aria-current]{color:#fff}
.pf-cv-eyebrow{margin:0 0 6px;font:600 12px/1 'Prompt',sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#00a3e0}
.pf-cv-title{margin:0;font:600 32px/1.15 'Prompt',sans-serif;color:#fff}
.pf-cv-title em{font-style:normal;color:#00a3e0}
.pf-cv-help{margin:10px 0 0;max-width:640px;font:400 15px/1.5 'Prompt',sans-serif;color:#d4e2ee}

/* ---------- Toolbar ---------- */
.pf-cv-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:0 0 12px;margin:0 0 20px;border-bottom:2px solid #003352}
.pf-cv-toolbar .pf-toolbar-info{flex:1;min-width:0}
.pf-cv-count{font-family:'Prompt',sans-serif;color:#56657a;font-size:15px}
.pf-cv-count strong{font:700 24px/1 'Barlow Condensed',sans-serif;color:#003352;margin-right:4px}
.pf-cv-views{display:inline-flex;gap:2px}
.pf-cv-view{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:40px;border:0;background:transparent;color:#003352;cursor:pointer;isolation:isolate}
.pf-cv-view .pf-cv-vp{position:absolute;inset:0;background:#0057a6;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);transform:scaleX(0);transition:transform 220ms cubic-bezier(.7,0,.2,1);z-index:-1}
.pf-cv-view.is-on{color:#fff}.pf-cv-view.is-on .pf-cv-vp{transform:scaleX(1)}
.pf-cv-view:focus-visible{outline:2px solid #0057a6;outline-offset:2px}

/* ---------- Grid 4 colunas ---------- */
.pf-cv-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media (max-width:1100px){.pf-cv-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:820px){.pf-cv-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
@media (max-width:420px){.pf-cv-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Card ---------- */
.pf-cv-grid .pf-cv-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #d7e1ea;border-radius:4px;overflow:hidden;box-shadow:none;transition:transform 160ms cubic-bezier(.2,.7,.2,1),box-shadow 160ms,border-color 160ms}
.pf-cv-grid .pf-cv-card:hover{transform:translateY(-4px);box-shadow:0 1px 2px rgba(0,51,82,.06),0 4px 16px rgba(0,51,82,.06);border-color:#0057a6}
.pf-cv-card.is-custom{border-color:#9fc2e0}
.pf-cv-bar{position:absolute;left:-10%;right:-10%;bottom:0;height:4px;background:#0057a6;transform:scaleX(0) skewX(-12deg);transform-origin:left;transition:transform 420ms cubic-bezier(.7,0,.2,1);z-index:3}
.pf-cv-card.is-custom .pf-cv-bar{background:#00a3e0}
.pf-cv-card:hover .pf-cv-bar{transform:scaleX(1) skewX(-12deg)}
.pf-cv-media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(135deg,#d7e1ea,#eef5fb)}
.pf-cv-media img{width:100%;height:100%;object-fit:contain;transition:transform 420ms cubic-bezier(.2,.7,.2,1)}
.pf-cv-card:hover .pf-cv-media img{transform:scale(1.05) rotate(-1deg)}
.pf-cv-card.pf-ec-card--indisponivel .pf-cv-media img{opacity:.55;filter:grayscale(.6)}
.pf-cv-tags{position:absolute;top:12px;left:0;display:flex;flex-direction:column;align-items:flex-start;gap:6px;z-index:2;pointer-events:none}
.pf-cv-sob,.pf-cv-tag{display:inline-flex;align-items:center;gap:6px;padding:5px 18px 5px 12px;background:#003352;color:#fff;clip-path:polygon(0 0,100% 0,calc(100% - 9px) 100%,0 100%);font:700 15px/1 'Barlow Condensed',sans-serif;letter-spacing:.06em;text-transform:uppercase}
.pf-cv-sob svg{color:#00a3e0}
.pf-cv-tag{font-size:13px}.pf-cv-tag--novo{background:#0057a6}.pf-cv-tag--badge{background:#00a3e0;color:#003352}
.pf-cv-offer{position:absolute;top:12px;right:0;z-index:2;padding:5px 12px 5px 18px;background:#c2410c;color:#fff;clip-path:polygon(9px 0,100% 0,100% 100%,0 100%);font:700 14px/1 'Barlow Condensed',sans-serif;letter-spacing:.06em;text-transform:uppercase;pointer-events:none}
.pf-cv-dim{position:absolute;left:14px;right:14px;bottom:12px;display:flex;align-items:center;gap:6px;color:#0057a6;font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;z-index:2}
.pf-cv-dim .pf-cv-tick{width:2px;height:12px;background:#0057a6}
.pf-cv-dim .pf-cv-dline{flex:1;height:2px;background-image:repeating-linear-gradient(90deg,#0057a6 0 6px,transparent 6px 10px);background-size:10px 2px}
.pf-cv-dim span:not([class]){background:rgba(255,255,255,.85);padding:1px 4px}
@keyframes pfCvMarch{to{background-position:10px 0}}
.pf-cv-card:hover .pf-cv-dline{animation:pfCvMarch 500ms linear infinite}
.pf-cv-body{display:flex;flex-direction:column;gap:8px;padding:16px 16px 10px;flex:1;font-family:'Prompt',sans-serif}
.pf-cv-dept{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#0057a6}
.pf-cv-name{margin:0;font:500 17px/1.3 'Prompt',sans-serif;color:#003352}
.pf-cv-name a{color:inherit;text-decoration:none}.pf-cv-name a:hover{color:#0057a6}
.pf-cv-spec{margin:0;font-size:13px;line-height:1.45;color:#56657a;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pf-cv-code{font-size:12px;color:#56657a;letter-spacing:.04em}
.pf-cv-opts{display:flex;flex-direction:column;gap:6px}
.pf-cv-opts-label{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#56657a}
.pf-cv-chips{display:flex;flex-wrap:wrap;gap:6px}
.pf-cv-ochip{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border:1px solid #6f849b;border-radius:2px;background:#fff;color:#003352;font-family:'Prompt',sans-serif;font-size:13px;cursor:pointer;transition:background 120ms,border-color 120ms}
.pf-cv-ochip:hover{border-color:#0057a6;background:#eef5fb}
.pf-cv-ochip:focus-visible{outline:2px solid #0057a6;outline-offset:2px}
.pf-cv-ochip.is-off{border-style:dashed;color:#56657a;text-decoration:line-through;background:#f5f8fb}
.pf-cv-ochip.is-more{color:#0057a6;font-weight:600;border-color:#0057a6}
.pf-cv-price{display:flex;flex-direction:column;gap:2px;margin-top:auto}
.pf-cv-price-pre{font-size:12px;color:#56657a}
.pf-cv-price-off{display:inline-block;margin-left:6px;padding:1px 6px;background:#c2410c;color:#fff;font-size:11px;font-weight:600}
.pf-cv-price-from{font-size:12px;color:#56657a}
.pf-cv-price-main{font:600 22px/1.2 'Prompt',sans-serif;color:#0057a6}
.pf-cv-unit{font-size:13px;font-weight:400;color:#56657a;margin-left:2px}
.pf-cv-price--empty{font-size:13px;color:#56657a}
.pf-cv-stock{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:2px;font-size:12px;font-weight:500}
.pf-cv-stock.is-in{color:#0f6b34;background:#e8f5ec}
.pf-cv-stock.is-sob{color:#003352;background:#eef5fb}
.pf-cv-stock.is-out{color:#b42318;background:#fdecea}
.pf-cv-actions{display:flex;align-items:center;gap:8px;padding:0 16px 16px}
.pf-cv-actions .pf-cv-btn{flex:1}
.pf-cv-actions .pf-ec-qty-wrap{flex:none}
.pf-cv-actions .pf-ec-btn-mobile{display:none}

/* ---------- Vista lista ---------- */
.pf-cv-grid.is-list{grid-template-columns:minmax(0,1fr)!important;gap:12px}
.pf-cv-grid.is-list .pf-cv-card{display:grid;grid-template-columns:180px minmax(0,1fr) 220px;align-items:stretch}
.pf-cv-grid.is-list .pf-cv-card:hover{transform:none;box-shadow:inset 4px 0 0 #0057a6}
.pf-cv-grid.is-list .pf-cv-card.is-custom:hover{box-shadow:inset 4px 0 0 #00a3e0}
.pf-cv-grid.is-list .pf-cv-media{aspect-ratio:auto;min-height:140px}
.pf-cv-grid.is-list .pf-cv-dim,.pf-cv-grid.is-list .pf-cv-bar{display:none}
.pf-cv-grid.is-list .pf-cv-actions{flex-direction:column;justify-content:center;align-items:stretch;padding:16px;border-left:1px solid #d7e1ea}
.pf-cv-grid.is-list .pf-cv-actions .pf-cv-btn{flex:none}
@media (max-width:820px){.pf-cv-grid.is-list .pf-cv-card{grid-template-columns:120px minmax(0,1fr)}.pf-cv-grid.is-list .pf-cv-actions{grid-column:1/-1;border-left:0;padding-top:0}}

/* ---------- Mobile ---------- */
@media (max-width:767px){
  .pf-cv-title{font-size:24px}
  .pf-cv-body{padding:12px 12px 8px}
  .pf-cv-name{font-size:15px}
  .pf-cv-actions{padding:0 12px 12px;flex-wrap:wrap}
  .pf-cv-actions .pf-ec-qty-wrap{display:none}
  .pf-cv-btn{padding:0 14px;font-size:14px}
  .pf-cv-dim{display:none}
  .pf-cv-views{display:none}
}

/* ---------- Drawer de opções (quick-view) 460px ---------- */
.pf-qv-drawer{width:460px;max-width:100vw}

/* ---------- Sidebar FILTRAR ---------- */
.pf-cv-side .pf-cf-box{border-radius:4px;padding:20px}
.pf-cv-side .pf-cf-title{font-size:22px;letter-spacing:.02em}
.pf-cv-side .pf-cf-legend{color:#0057a6}
.pf-cv-side .pf-cf-check:hover{color:#0057a6}
.pf-cv-side .pf-cf-check input{cursor:pointer}
@media (prefers-reduced-motion:reduce){.pf-cv-card,.pf-cv-card *,.pf-cv-plate::after,.pf-cv-vp{transition:none!important;animation:none!important}}