/* ============================================================
   VITRINE - estilos proprios
   Carrega DEPOIS de site.css. Nao altera o site institucional.
   ============================================================ */

/* ===== VITRINE DE PRODUTOS (seção nova, mesma linguagem do site) ===== */
.filtros{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;margin:0 auto 52px;max-width:920px}
.filtro-chip{font-size:calc(12px * var(--esc-botoes,1) * var(--fs-filtro,1));font-weight:500;letter-spacing:1px;text-transform:uppercase;color:var(--texto-suave);background:var(--bg-card);border:1px solid var(--borda);padding:9px 18px;border-radius:2px;cursor:pointer;transition:all .3s}
.filtro-chip:hover{border-color:var(--azul-destaque);color:var(--texto)}
.filtro-chip.ativo{background:var(--azul-destaque);border-color:var(--azul-destaque);color:#fff}
.filtros__sep{width:1px;height:26px;background:var(--borda);margin:0 4px}
.filtro-busca{display:flex;align-items:center;gap:8px;background:var(--bg-elev);border:1px solid var(--borda);border-radius:2px;padding:0 12px}
.filtro-busca input{background:none;border:0;color:var(--texto);padding:11px 4px;font-family:'Poppins',sans-serif;font-size:calc(13px * var(--esc-miudos,1) * var(--fs-busca,1));width:180px;outline:none}
.filtro-busca svg{width:16px;height:16px;fill:var(--texto-fraco);flex-shrink:0}
.busca-wrap{display:flex;justify-content:center;margin:0 auto 26px;max-width:920px}
.filtro-busca--lg{width:min(560px,100%);padding:2px 18px}
.filtro-busca--lg input{flex:1;width:auto;font-size:calc(14px * var(--esc-miudos,1) * var(--fs-busca,1));padding:15px 6px}

.produtos-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.produto-card{position:relative;background:var(--bg-card);border:1px solid var(--borda);border-radius:var(--card-cantos,0px);overflow:hidden;display:flex;flex-direction:column;transition:transform .45s cubic-bezier(.25,.46,.45,.94),border-color .45s,box-shadow .45s;/* camada fixa: o texto sombreado desenha IGUAL antes, durante e depois da animacao do hover (sem o 'meio segundo mais forte') */will-change:transform}
.produto-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--azul-destaque),transparent);opacity:0;transition:opacity .45s;z-index:3}
.produto-card:hover{transform:translateY(-10px);border-color:color-mix(in srgb,var(--azul-destaque) 45%,transparent);box-shadow:0 24px 50px rgba(0,0,0,.3),0 0 36px color-mix(in srgb,var(--azul-destaque) 16%,transparent)}
.produto-card:hover::before{opacity:1}
.produto-card__foto{position:relative;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden}
.produto-card__foto svg.maq{width:58%;height:58%;opacity:.5;transition:transform .5s,opacity .5s}
.produto-card:hover .produto-card__foto svg.maq{transform:scale(1.06);opacity:.7}
.pf-1{background:radial-gradient(900px 500px at 70% 20%,color-mix(in srgb,var(--azul-destaque) 25%,transparent),transparent 60%),linear-gradient(135deg,#08374a,#0b4866 55%,#0d5a7d)}
.pf-2{background:radial-gradient(700px 500px at 30% 30%,color-mix(in srgb,var(--azul-destaque) 20%,transparent),transparent 60%),linear-gradient(120deg,#0a2d3d,#0d5a7d 60%,#106a92)}
.pf-3{background:radial-gradient(800px 600px at 50% 75%,color-mix(in srgb,var(--azul-destaque) 22%,transparent),transparent 55%),linear-gradient(160deg,#062533,#0b4866 55%,#0f6489)}
.produto-card__badge{position:absolute;top:14px;left:14px;z-index:2;font-size:calc(10px * var(--esc-miudos,1) * var(--fs-card-selo,1));font-weight:600;letter-spacing:1.5px;text-transform:uppercase;padding:5px 11px;border-radius:2px}
.badge-novo{background:var(--azul-destaque);color:#fff}
.badge-seminovo{background:rgba(0,0,0,.55);color:#fff;border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(4px)}
.produto-card__origem{position:absolute;top:14px;right:14px;z-index:2;font-size:calc(9.5px * var(--esc-etiquetas,1) * var(--fs-card-origem,1));letter-spacing:1px;text-transform:uppercase;color:#fff;opacity:.85;background:rgba(0,0,0,.4);padding:4px 9px;border-radius:2px;backdrop-filter:blur(4px)}
.produto-card__body{padding:24px;flex:1;display:flex;flex-direction:column}
.produto-card__cat{font-size:calc(11px * var(--esc-textos,1) * var(--fs-card-cat,1));font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--azul-destaque)}
.produto-card__nome{font-family:'X-Scale','Arial Black',sans-serif;font-size:calc(25px * var(--titulo-escala,1) * var(--esc-card_nome,1) * var(--fs-card-nome,1));text-transform:uppercase;color:var(--texto);line-height:.92;margin:9px 0 14px;transition:color .4s}
.produto-card:hover .produto-card__nome{color:var(--azul-destaque)}
.produto-card__specs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.produto-card__specs span{font-size:calc((calc(11px * var(--esc-etiquetas,1))) * var(--fs-card-chips,1));letter-spacing:.3px;color:var(--texto-fraco);border:1px solid var(--borda);padding:4px 9px;border-radius:2px}
.produto-card__rodape{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:18px;border-top:1px solid var(--borda)}
.produto-card__preco{font-family:'X-Scale','Arial Black',sans-serif;font-size:calc(calc(23px * var(--fs-card-preco,1)) * var(--esc-valores_prod,1));color:var(--texto);line-height:1}
.produto-card__preco small{display:block;font-family:'Poppins',sans-serif;font-size:calc((calc(10px * var(--esc-valores_prod,1))) * var(--fs-card-rotulo,1));letter-spacing:1px;text-transform:uppercase;color:var(--texto-fraco);margin-bottom:2px}
/* O rotulo pequeno do valor (duas linhas) NUNCA recebe sombra:
   fonte miuda + texto longo embolam. A sombra dos valores vale so
   para o numero e para a frase consulte valores. */
.produto-card__preco small{text-shadow:none}
.produto-card__consulta{font-family:'X-Scale','Arial Black',sans-serif;font-size:calc(18px * var(--esc-valores_prod,1) * var(--fs-card-consulta,1));color:var(--azul-destaque);text-transform:uppercase}
.produto-card__btn{display:inline-flex;align-items:center;gap:8px;color:var(--texto);text-decoration:none;font-size:calc(12px * var(--esc-botoes,1) * var(--fs-card-btn,1));font-weight:600;letter-spacing:1px;text-transform:uppercase;border:1px solid var(--borda);padding:11px 16px;border-radius:2px;transition:all .35s;white-space:nowrap}
.produto-card__btn:hover{background:var(--azul-destaque);border-color:var(--azul-destaque);color:#fff}
.produto-card.oculto{display:none}

@media(max-width:900px){.produtos-grid{grid-template-columns:1fr;max-width:460px;margin:0 auto}.filtro-busca input{width:130px}}

/* ----- extras de producao ----- */
.produto-card__link{display:block;text-decoration:none}
.produto-card__foto.tem-foto img{width:100%;height:100%;object-fit:cover;display:block}
.produto-card__nome a{color:inherit;text-decoration:none}
.produto-card__destaque{position:absolute;top:14px;right:14px;z-index:2;font-size:calc(9.5px * var(--esc-miudos,1) * var(--fs-card-selo,1));font-weight:600;letter-spacing:1px;text-transform:uppercase;color:#fff;background:var(--azul-destaque);padding:4px 9px;border-radius:2px}
.paginacao{display:flex;justify-content:center;gap:8px;margin-top:44px;flex-wrap:wrap}
.pag-num{min-width:42px;text-align:center;padding:10px 12px;border:1px solid var(--borda);border-radius:2px;color:var(--texto-suave);text-decoration:none;font-size:calc(14px * var(--esc-botoes,1) * var(--fs-pag,1));font-weight:500;transition:all .3s}
.pag-num:hover{border-color:var(--azul-destaque);color:var(--texto)}
.pag-num.ativo{background:var(--azul-destaque);border-color:var(--azul-destaque);color:#fff}

/* ----- pagina de detalhe ----- */
/* ===== PAGINA DE DETALHE ===== */
.pd-wrap{padding:118px 0 60px}
.pd-cru{font-size:calc((calc(12px * var(--esc-etiquetas,1))) * var(--fs-pd-cru,1));letter-spacing:.5px;color:var(--texto-fraco);margin-bottom:26px;display:flex;gap:8px;align-items:center}
.pd-cru a{color:var(--texto-suave);text-decoration:none}.pd-cru a:hover{color:var(--azul-destaque)}
.pd-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:start}
.pd-galeria__main{position:relative;aspect-ratio:4/3;border:1px solid var(--borda);overflow:hidden;display:flex;align-items:center;justify-content:center}
.pd-galeria__main svg.maq{width:52%;height:52%;opacity:.55}
.pd-galeria__main .produto-card__badge{font-size:11px}
.pd-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:12px}
.pd-thumb{aspect-ratio:1;border:1px solid var(--borda);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .3s,transform .3s;overflow:hidden}
.pd-thumb svg{width:46%;height:46%;opacity:.5}
.pd-thumb.ativo,.pd-thumb:hover{border-color:var(--azul-destaque);transform:translateY(-2px)}
.pd-info__cat{font-size:calc((calc(12px * var(--esc-etiquetas,1))) * var(--fs-pd-cat,1));font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--azul-destaque)}
.pd-info__nome{font-family:'X-Scale','Arial Black',sans-serif;font-size:calc((calc(clamp(34px,5vw,52px) * var(--esc-produto,1))) * var(--fs-pd-nome,1));text-transform:uppercase;color:var(--texto);line-height:.86;margin:12px 0 18px}
.pd-info__badges{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.pd-info__badges span{font-size:calc(11px * var(--esc-miudos,1) * var(--fs-pd-selos,1));font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:6px 13px;border-radius:2px}
.pd-tag-novo{background:var(--azul-destaque);color:#fff}
.pd-tag-semi{border:1px solid var(--borda);color:var(--texto-suave)}
.pd-tag-origem{border:1px solid var(--borda);color:var(--texto-suave)}
.pd-preco{padding:22px 0;border-top:1px solid var(--borda);border-bottom:1px solid var(--borda);margin-bottom:24px}
.pd-preco small{display:block;font-size:calc((calc(11px * var(--esc-etiquetas,1))) * var(--fs-pd-rotulo,1));letter-spacing:1.5px;text-transform:uppercase;color:var(--texto-fraco);margin-bottom:6px}
.pd-preco .valor{font-family:'X-Scale','Arial Black',sans-serif;font-size:calc((calc(42px * var(--esc-produto,1))) * var(--fs-pd-valor,1));color:var(--texto);line-height:1}
.pd-spec-chips{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;margin-bottom:30px}
.pd-spec{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--borda);font-size:14px}
.pd-spec b{color:var(--texto-fraco);font-weight:500;font-size:calc(12px * var(--esc-valores,1) * var(--fs-pd-spec,1));letter-spacing:.5px;text-transform:uppercase}
.pd-spec span{color:var(--texto);font-weight:500}
.pd-acoes{display:flex;flex-direction:column;gap:12px}
.pd-btn-orc{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--azul-destaque);color:#fff;border:0;text-decoration:none;padding:17px 24px;border-radius:2px;font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:calc(14px * var(--esc-botoes,1) * var(--fs-pd-btns,1));cursor:pointer;transition:all .35s}
.pd-btn-orc:hover{transform:translateY(-2px);box-shadow:0 12px 30px color-mix(in srgb,var(--azul-destaque) 40%,transparent)}
.pd-btn-wpp{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#25d366;color:#fff;text-decoration:none;padding:17px 24px;border-radius:2px;font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:calc(14px * var(--esc-botoes,1) * var(--fs-pd-btns,1));transition:transform .25s}
.pd-btn-wpp:hover{transform:translateY(-2px)}
.pd-btn-wpp svg{width:22px;height:22px;fill:#fff}
.pd-desc{max-width:820px;margin:0 auto}
.pd-desc p{color:var(--texto-suave);font-size:calc((16px) * var(--fs-pd-sobre-texto,1));line-height:1.9;margin-bottom:16px}
@media(max-width:900px){.pd-grid{grid-template-columns:1fr;gap:30px}.pd-spec-chips{grid-template-columns:1fr}.pd-thumbs{grid-template-columns:repeat(5,1fr)}}

/* ===== Faixa-cabecalho da secao de produtos (titulo esq + busca/filtros dir) ===== */
section.sec--produtos{padding-top:0}
.pbanner{position:relative;overflow:hidden;background:linear-gradient(120deg,#0c2733 0%,#0a1a24 60%,#0b2230 100%);background-size:cover;background-position:center;margin-bottom:34px}
.pbanner.tem-img::before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(8,20,28,.92),rgba(8,20,28,.5))}
.pbanner__inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:34px;padding:36px 0;flex-wrap:wrap}
.pbanner__esq{flex:1;min-width:240px;text-align:left;max-width:none;margin:0}
.pbanner .sec__eyebrow{color:#5fb2ff;margin-bottom:10px}
.pbanner .sec__title{color:#fff;font-size:calc(clamp(26px,3.8vw,42px) * var(--titulo-escala,1) * var(--fs-title,1))}
.pbanner .sec__title .tt-sm{font-size:.55em}
.pbanner .sec__title .tt-lg{font-size:.98em}
.pbanner .sec__sub{color:#aebcc6;font-size:calc(13.5px * var(--esc-textos,1) * var(--fs-sub,1));max-width:400px;margin-top:12px}
.pbanner__dir{display:flex;flex-direction:column;gap:14px;align-items:flex-end}
.pbanner .busca-wrap{margin:0;display:flex;justify-content:flex-end}
.pbanner .filtro-busca{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18)}
.pbanner .filtro-busca--lg{width:340px;max-width:100%}
.pbanner .filtro-busca input{color:#fff}
.pbanner .filtro-busca input::placeholder{color:#9fb4c0}
.pbanner .filtro-busca svg{fill:#9fb4c0}
.pbanner .filtros{margin:0;justify-content:flex-end}
.pbanner .filtro-chip{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);color:#cdd9e1}
.pbanner .filtro-chip:hover{border-color:#5fb2ff;color:#fff}
.pbanner .filtro-chip.ativo{background:var(--azul-destaque);border-color:var(--azul-destaque);color:#fff}
.pbanner .filtros__sep{background:rgba(255,255,255,.18)}
@media(max-width:760px){.pbanner__inner{flex-direction:column;align-items:flex-start;padding-left:18px;padding-right:18px}.pbanner__dir{align-items:stretch;width:100%}.pbanner .busca-wrap{justify-content:stretch}.pbanner .filtro-busca--lg{width:100%}.pbanner .filtros{justify-content:flex-start}}

/* ===== Botao largo do card (Solicitar orcamento) ===== */
.produto-card__cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:16px;background:var(--azul-destaque);color:#fff;text-decoration:none;font-size:calc(13px * var(--esc-botoes,1) * var(--fs-card-btn,1));font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:15px 16px;border-radius:2px;transition:all .35s;border:0;cursor:pointer}
.produto-card__cta:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 12px 26px color-mix(in srgb,var(--azul-destaque) 35%,transparent)}

/* ============================================================
   AJUSTES RESPONSIVOS FINOS (revisao geral - 07/2026)
   ============================================================ */

/* ---- Tablet intermediario (601 a 900px): 2 colunas de cards ---- */
@media(min-width:601px) and (max-width:900px){
  .produtos-grid{grid-template-columns:repeat(2,1fr);max-width:none}
}

/* ---- Celular (ate 600px) ---- */
@media(max-width:600px){
  .produtos-grid{gap:18px}
  .produto-card__body{padding:20px 18px}
  .filtros{gap:8px;margin-bottom:36px}
  .filtro-chip{padding:8px 14px;font-size:calc(11px * var(--esc-botoes,1) * var(--fs-filtro,1))}
  /* cabecalho da vitrine: garante respiro lateral (o texto encostava na borda) */
  .pbanner__inner{padding:28px 18px;gap:22px}
  .pbanner .filtro-busca--lg input{font-size:16px}   /* evita zoom no iPhone */
  /* pagina da maquina */
  .pd-wrap{padding:100px 0 48px}
  .pd-info__nome{font-size:calc(clamp(30px,9vw,44px) * var(--esc-produto,1) * var(--fs-pd-nome,1))}
  .pd-preco .valor{font-size:calc(34px * var(--esc-produto,1) * var(--fs-pd-valor,1))}
  .pd-thumbs{grid-template-columns:repeat(4,1fr)}
  .pd-acoes{flex-direction:column}
  .pd-btn-orc,.pd-btn-wpp{width:100%;min-width:0}
  .pd-desc p{font-size:calc(15px * var(--fs-pd-sobre-texto,1))}
  .paginacao{margin-top:32px}
  .pag-num{min-width:38px;padding:9px 10px}
}

/* ============================================================
   TRANSICAO DE ENTRADA — pagina do produto (maquina.php)
   A imagem cresce no lugar (sem sair da tela) e o texto sobe
   de baixo para cima. Giro leve opcional (classe .pd-giro).
   ============================================================ */
.pd-anim .pd-galeria{
  animation: pdImgIn .7s cubic-bezier(.2,.8,.25,1) both;
  transform-origin:center;
}
@keyframes pdImgIn{
  from{opacity:0;transform:scale(.9)}
  to{opacity:1;transform:scale(1)}
}
/* variante com leve giro que se acerta ao crescer */
.pd-anim.pd-giro .pd-galeria{ animation-name: pdImgInGiro; }
@keyframes pdImgInGiro{
  from{opacity:0;transform:scale(.9) rotate(-4deg)}
  to{opacity:1;transform:scale(1) rotate(0)}
}
/* texto: cada bloco sobe de baixo para cima, em cascata */
.pd-anim .pd-info > *{
  animation: pdTxtUp .6s cubic-bezier(.2,.8,.25,1) both;
}
@keyframes pdTxtUp{
  from{opacity:0;transform:translateY(42px)}
  to{opacity:1;transform:translateY(0)}
}
.pd-anim .pd-info > *:nth-child(1){animation-delay:.24s}
.pd-anim .pd-info > *:nth-child(2){animation-delay:.32s}
.pd-anim .pd-info > *:nth-child(3){animation-delay:.40s}
.pd-anim .pd-info > *:nth-child(4){animation-delay:.48s}
.pd-anim .pd-info > *:nth-child(5){animation-delay:.56s}
.pd-anim .pd-info > *:nth-child(6){animation-delay:.64s}
/* respeita quem prefere menos animacao */
@media (prefers-reduced-motion: reduce){
  .pd-anim .pd-galeria,
  .pd-anim .pd-info > *{animation:none!important}
}

/* ============================================================
   PAGINA DA MAQUINA - ficha tecnica e observacao do preco
   Rotulo pequeno em cima, valor embaixo: mais facil de ler do
   que o rotulo e o valor lado a lado (como era antes).
   ============================================================ */
.pd-preco__obs{margin-top:8px;font-size:calc((calc(12.5px * var(--esc-etiquetas,1))) * var(--fs-pd-obs,1));line-height:1.5;color:var(--texto-fraco)}
.pd-ficha{display:grid;grid-template-columns:1fr 1fr;gap:14px 26px;margin-bottom:30px}
.pd-ficha__item{border-bottom:1px solid var(--borda);padding-bottom:9px}
.pd-ficha__item small{display:block;font-size:calc((calc(10px * var(--esc-etiquetas,1))) * var(--fs-pd-ficha-rot,1));letter-spacing:1.4px;text-transform:uppercase;
  color:var(--texto-fraco);font-weight:600;margin-bottom:3px}
.pd-ficha__item b{font-size:calc((calc(14.5px * var(--esc-valores,1))) * var(--fs-pd-ficha-val,1));font-weight:700;color:var(--texto);line-height:1.3}
@media(max-width:900px){.pd-ficha{grid-template-columns:1fr 1fr;gap:12px 18px}}
@media(max-width:420px){.pd-ficha{grid-template-columns:1fr}}

/* Rotulo e observacao do valor no card. O rotulo vem do painel
   (Locacao & Venda > Conteudo) e vale tambem na pagina do produto. */
.produto-card__lab{display:block;font-size:calc((calc(9px * var(--esc-etiquetas,1))) * var(--fs-card-rotulo,1));letter-spacing:1.4px;
  text-transform:uppercase;opacity:.85;margin-bottom:2px}
.produto-card__obs{display:block;font-size:calc(9px * var(--esc-miudos,1));opacity:.7;margin-top:2px}