/* Catálogo (grade Mosaico, escolhida pelo Junior em 23/09/2026), informações da loja e rodapé.
   Fica abaixo da abertura. Não depende de intro/abertura.css, só reaproveita as fontes que ela carrega. */
@font-face{font-family:"Pixo";src:url(../assets/fonts/sedgwick-ave-display.woff2) format("woff2");font-display:swap}
:root{--vidro:rgba(14,13,12,.76);--linha:rgba(201,168,102,.22);--texto-cat:#e6dfd2;--apagado-cat:#a0978a}

/* o showroom desfocado fica fixo atrás de tudo: quando a abertura some, a loja continua ali */
body{background:transparent}
.showroom-fundo{position:fixed;inset:0;z-index:-1;background:#070708 url(../assets/showroom/mural-desfocado.jpg) 50% 40%/cover no-repeat}
.showroom-fundo::after{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 70% at 50% 40%,rgba(0,0,0,0) 30%,rgba(0,0,0,.55) 80%,rgba(0,0,0,.85) 100%)}
.palco{background:transparent!important}

.sec{max-width:1240px;margin:0 auto;padding:clamp(56px,8vw,110px) clamp(16px,3vw,32px);color:var(--texto-cat)}
.sec-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:clamp(24px,4vw,44px)}
.sec-titulo{margin:0;font:400 clamp(54px,9vw,112px)/.9 "Pixo",cursive;color:var(--ouro,#C9A866);
  text-shadow:0 0 22px rgba(201,168,102,.25),0 3px 0 rgba(0,0,0,.6);transform:rotate(-2deg);transform-origin:left bottom}
.sec-cab p{margin:0 0 10px;max-width:36ch;color:var(--apagado-cat);font-size:14px;line-height:1.6}
.sec-cab p b{color:var(--texto-cat);font-weight:500}

/* texto só para leitores de tela e para o Google (o visual da abertura já mostra a marca) */
.so-leitor{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- card ---------- */
.grade{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
.carro{position:relative;background:var(--vidro);border:1px solid var(--linha);border-radius:14px;overflow:hidden;
  box-shadow:0 24px 50px rgba(0,0,0,.45);transition:border-color .3s,box-shadow .3s;
  opacity:0;transform:translateY(26px)}
.carro.visto{opacity:1;transform:none;transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s}
.carro:hover{border-color:rgba(201,168,102,.5);box-shadow:0 30px 60px rgba(0,0,0,.55)}
.carro-topo{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:16px 18px 14px}
.carro-topo h3{margin:0;font-weight:700;font-size:clamp(17px,1.6vw,21px);letter-spacing:.04em;color:#fff}
.carro-topo h3 small{display:block;margin-top:4px;font-weight:500;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ouro,#C9A866)}
.preco{flex:none;font-weight:700;font-size:clamp(16px,1.5vw,19px);color:var(--ouro-claro,#E8D3A2);white-space:nowrap}
.selo{flex:none;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--apagado-cat);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px 10px}

.fotos{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:4px;padding:0 4px;aspect-ratio:3/2}
.f{position:relative;display:block;padding:0;border:0;background:#111;overflow:hidden;cursor:zoom-in;border-radius:6px}
.f1{grid-row:1 / 3}
.f img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.f1 img{object-position:50% 68%}
.f:hover img{transform:scale(1.045)}
.f:focus-visible{outline:2px solid var(--ouro,#C9A866);outline-offset:-2px}
.lupa{position:absolute;right:10px;bottom:10px;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.55);display:grid;place-items:center;opacity:0;transition:opacity .3s}
.f:hover .lupa{opacity:1}
.lupa svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2}
.mais{position:absolute;left:8px;top:8px;padding:5px 10px;border-radius:999px;background:rgba(0,0,0,.62);font-weight:700;font-size:11px;letter-spacing:.1em;color:#fff}

.carro-pe{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px 18px}
.carro-pe p{margin:0;font-size:13.5px;line-height:1.6;color:#cfc7b8;max-width:62ch}
.dados{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--apagado-cat)}
.dados b{color:var(--texto-cat);font-weight:500}
.btn-ouro{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:999px;text-decoration:none;
  background:var(--ouro,#C9A866);color:#15110a;font-weight:700;font-size:12.5px;letter-spacing:.06em;transition:background .25s,transform .25s}
.btn-ouro:hover{background:var(--ouro-claro,#E8D3A2);transform:translateY(-1px)}
.btn-ouro svg{width:16px;height:16px;fill:currentColor}
.btn-linha{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;text-decoration:none;border:1px solid rgba(201,168,102,.55);
  color:var(--ouro-claro,#E8D3A2);font-weight:500;font-size:12.5px;letter-spacing:.06em;transition:background .25s,color .25s}
.btn-linha:hover{background:rgba(201,168,102,.12)}
.btn-linha svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}

.vazio{grid-column:1 / -1;text-align:center;padding:60px 20px;color:var(--apagado-cat)}

@media (max-width:1000px){ .grade{grid-template-columns:1fr} }
@media (max-width:760px){
  .fotos{aspect-ratio:4/3}
  .carro-pe{flex-direction:column;align-items:stretch}
}

/* ---------- vende ou troca: faixa de chamada ---------- */
.troca{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:clamp(20px,4vw,60px);
  padding:clamp(28px,4vw,48px);border-radius:18px;border:1px solid var(--linha);
  background:linear-gradient(120deg,rgba(201,168,102,.16),rgba(14,13,12,.82) 55%),var(--vidro)}
.troca h3{margin:0 0 10px;font:400 clamp(36px,5vw,62px)/.95 "Pixo",cursive;color:#fff}
.troca h3 span{color:var(--ouro,#C9A866)}
.troca p{margin:0;color:#cfc7b8;font-size:15px;line-height:1.65;max-width:46ch}
.troca-acoes{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.etiquetas{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.etiquetas span{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ouro-claro,#E8D3A2);border:1px solid rgba(201,168,102,.35);border-radius:999px;padding:7px 12px}
@media (max-width:760px){ .troca{grid-template-columns:1fr} .troca-acoes{align-items:stretch} }

/* ---------- a loja ---------- */
.loja{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,4vw,56px);align-items:center}
.loja-foto{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--linha);aspect-ratio:4/3;box-shadow:0 30px 60px rgba(0,0,0,.5)}
.loja-foto img{width:100%;height:100%;object-fit:cover;display:block}
.loja-foto figcaption{position:absolute;left:14px;bottom:14px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;background:rgba(0,0,0,.6);padding:7px 11px;border-radius:999px;color:#e6dfd2}
.loja-texto .frase-bio{margin:18px 0 10px;font-weight:700;font-size:clamp(20px,2.4vw,30px);line-height:1.25;color:#fff;letter-spacing:.01em}
.loja-texto .frase-bio span{color:var(--ouro,#C9A866)}
.loja-texto p{margin:0 0 22px;color:#cfc7b8;font-size:15px;line-height:1.65}
.contatos{display:grid;gap:10px}
.contato{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;border:1px solid var(--linha);background:var(--vidro);text-decoration:none;color:inherit;transition:border-color .25s,transform .25s}
.contato:hover{border-color:rgba(201,168,102,.55);transform:translateX(3px)}
.contato i{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(201,168,102,.14);color:var(--ouro,#C9A866)}
.contato i svg{width:19px;height:19px}
.contato b{display:block;font-size:14px;color:#fff;font-weight:700;letter-spacing:.02em}
.contato small{display:block;margin-top:3px;font-size:12px;color:var(--apagado-cat)}
.contato .seta{margin-left:auto;color:var(--apagado-cat)}
@media (max-width:860px){ .loja{grid-template-columns:1fr} }

/* ---------- rodapé ---------- */
.rodape{border-top:1px solid rgba(201,168,102,.14);background:rgba(5,5,6,.82)}
.rodape-in{max-width:1240px;margin:0 auto;padding:36px clamp(16px,3vw,32px) calc(36px + env(safe-area-inset-bottom));
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12px;color:var(--apagado-cat);letter-spacing:.04em}
.rodape img{height:54px;width:auto;display:block}
.rodape a{color:var(--ouro-claro,#E8D3A2);text-decoration:none}

/* ---------- ampliação ---------- */
.amplia{position:fixed;inset:0;z-index:50;display:grid;grid-template-rows:auto 1fr auto;background:rgba(4,4,5,.95);
  opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.amplia.aberta{opacity:1;visibility:visible}
.amplia-topo{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px clamp(16px,3vw,32px);font-size:13px;letter-spacing:.14em;color:var(--apagado-cat)}
.amplia-topo b{color:#fff;font-weight:700;letter-spacing:.06em;font-size:15px;margin-right:12px}
.amplia-topo .btn-ouro{padding:9px 14px;font-size:12px}
.amplia-acoes{display:flex;align-items:center;gap:10px}
.amplia-palco{position:relative;min-height:0}
.amplia-palco img{position:absolute;top:0;bottom:0;left:clamp(8px,6vw,90px);width:calc(100% - 2 * clamp(8px,6vw,90px));height:100%;object-fit:contain;
  transform:scale(.97);opacity:0;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
.amplia.aberta .amplia-palco img.ok{transform:none;opacity:1}
.a-seta{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;border-radius:50%;border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.45);cursor:pointer;display:grid;place-items:center;z-index:1}
.a-seta svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2}
.a-seta.esq{left:clamp(8px,2vw,28px)}.a-seta.dir{right:clamp(8px,2vw,28px)}
.a-fechar{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:transparent;cursor:pointer;display:grid;place-items:center}
.a-fechar svg{width:18px;height:18px;stroke:#fff;stroke-width:2}
.miniaturas{display:flex;justify-content:center;gap:8px;padding:16px 16px calc(16px + env(safe-area-inset-bottom));overflow-x:auto}
.miniaturas button{flex:none;width:74px;height:54px;padding:0;border:2px solid transparent;border-radius:6px;overflow:hidden;cursor:pointer;opacity:.55;background:#111;transition:opacity .2s,border-color .2s}
.miniaturas button.atual{border-color:var(--ouro,#C9A866);opacity:1}
.miniaturas img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:600px){ .a-seta{display:none} .amplia-topo .btn-ouro span{display:none} }

@media (prefers-reduced-motion:reduce){
  .carro{opacity:1;transform:none}
  .carro,.f img,.amplia,.amplia-palco img{transition:none!important}
}

/* ---------- descrição: resumo no card, leitura completa no lugar das fotos ---------- */
.resumo{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
.ler{margin-top:6px;padding:0;border:0;background:none;cursor:pointer;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--ouro,#C9A866);
  display:inline-flex;align-items:center;gap:6px}
.ler:hover{color:var(--ouro-claro,#E8D3A2)}
.ler svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.midia{position:relative}
.leitura{position:absolute;inset:0 4px;display:flex;flex-direction:column;border-radius:6px;background:rgba(10,9,8,.96);border:1px solid rgba(201,168,102,.18);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .35s,transform .35s cubic-bezier(.2,.7,.2,1),visibility .35s}
.carro.lendo .leitura{opacity:1;visibility:visible;transform:none}
.carro.lendo .fotos{visibility:hidden}
.leitura-topo{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid rgba(201,168,102,.14)}
.leitura-topo span{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--apagado-cat)}
.voltar{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1px solid rgba(201,168,102,.55);background:transparent;cursor:pointer;
  font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--ouro-claro,#E8D3A2);transition:background .25s}
.voltar:hover{background:rgba(201,168,102,.14)}
.voltar svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}
.leitura-texto{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 18px 20px;white-space:pre-line;font-size:15px;line-height:1.75;color:#e6dfd2;
  scrollbar-width:thin;scrollbar-color:rgba(201,168,102,.4) transparent}
.leitura-texto .dados{margin-top:16px}

/* ---------- 23/09: filtros, ações do card, status ---------- */
.carro-topo h3 a{color:inherit;text-decoration:none}
.carro-topo h3 a:hover{color:var(--ouro-claro,#E8D3A2)}
a.selo{text-decoration:none}
a.selo:hover{border-color:rgba(201,168,102,.5);color:var(--ouro-claro,#E8D3A2)}
.acoes{flex:none;display:flex;flex-direction:column;gap:8px}
.acoes .btn-linha{justify-content:center;padding:10px 16px;font-size:12px}
.faixa-status{position:absolute;z-index:2;left:14px;top:12px;padding:6px 12px;border-radius:999px;background:#b3261e;color:#fff;font-weight:700;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.carro.indisponivel .fotos{filter:grayscale(.7) brightness(.7)}
@media (max-width:760px){ .acoes{flex-direction:column} }

.ferramentas{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:-8px 0 clamp(20px,3vw,32px)}
.filtros{display:flex;gap:8px;flex-wrap:wrap}
.filtros button{border:1px solid rgba(201,168,102,.3);background:rgba(10,9,8,.6);color:var(--texto-cat);border-radius:999px;padding:9px 15px;cursor:pointer;
  font:500 12px/1 "Mont",sans-serif;letter-spacing:.08em;transition:background .2s,border-color .2s,color .2s}
.filtros button:hover{border-color:rgba(201,168,102,.6)}
.filtros button.atual{background:var(--ouro,#C9A866);border-color:var(--ouro,#C9A866);color:#15110a;font-weight:700}
.busca{position:relative;flex:0 1 280px}
.busca input{width:100%;padding:11px 14px 11px 38px;border-radius:999px;border:1px solid rgba(201,168,102,.3);background:rgba(10,9,8,.6);color:#fff;font:500 13px "Mont",sans-serif}
.busca input::placeholder{color:var(--apagado-cat)}
.busca input:focus{outline:none;border-color:var(--ouro,#C9A866)}
.busca svg{position:absolute;left:13px;top:50%;width:16px;height:16px;margin-top:-8px;stroke:var(--apagado-cat);fill:none;stroke-width:2}
@media (max-width:760px){ .filtros{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;margin:0 -16px;padding-left:16px;padding-right:16px;scrollbar-width:none} .filtros button{flex:none} .busca{flex:1 1 100%} }

/* ---------- encontro abertura → catálogo: o estoque sobe por cima do showroom ---------- */
.conteudo{position:relative;z-index:6;margin-top:-72svh;
  background:linear-gradient(to bottom,rgba(6,6,7,0) 0,rgba(6,6,7,.5) 20svh,rgba(6,6,7,.7) 46svh,rgba(6,6,7,.62) 100%)}
.conteudo > .sec:first-child{padding-top:clamp(40px,6vw,70px)}
.conteudo::before{content:"";position:absolute;left:50%;top:0;width:min(900px,90vw);height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,rgba(201,168,102,.55),transparent)}

/* ---------- vantagens (fatos das legendas da própria loja) ---------- */
.vantagens{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.vantagem{padding:20px;border-radius:14px;border:1px solid var(--linha);background:var(--vidro)}
.vantagem i{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:rgba(201,168,102,.14);color:var(--ouro,#C9A866);margin-bottom:14px}
.vantagem i svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}
.vantagem b{display:block;color:#fff;font-size:15px;margin-bottom:6px}
.vantagem span{font-size:13px;line-height:1.55;color:var(--apagado-cat)}
@media (max-width:900px){ .vantagens{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:480px){ .vantagens{grid-template-columns:1fr} }

/* ---------- mapa ---------- */
.mapa{margin-top:clamp(20px,3vw,32px);border-radius:16px;overflow:hidden;border:1px solid var(--linha);height:clamp(260px,34vw,380px);background:#111}
.mapa iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.35) contrast(1.05) brightness(.85)}

/* ---------- WhatsApp flutuante: dourado, sempre visível ---------- */
.zap-flutua{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:40;
  display:flex;align-items:center;gap:10px;height:62px;padding:0 20px 0 16px;border-radius:999px;text-decoration:none;
  background:linear-gradient(135deg,#f3e2b4 0%,#C9A866 45%,#a8894e 100%);color:#15110a;font:700 14px "Mont",sans-serif;letter-spacing:.03em;
  box-shadow:0 12px 30px rgba(0,0,0,.55),0 0 0 1px rgba(255,240,200,.4) inset;transition:transform .25s,box-shadow .25s}
.zap-flutua svg{width:30px;height:30px;fill:currentColor;flex:none}
.zap-flutua:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 16px 36px rgba(0,0,0,.6),0 0 28px rgba(232,211,162,.45)}
.zap-flutua::before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid rgba(232,211,162,.8);animation:pulso 2.4s ease-out infinite;pointer-events:none}
@keyframes pulso{0%{transform:scale(1);opacity:.9}70%,100%{transform:scale(1.35);opacity:0}}
@media (max-width:700px){ .zap-flutua{width:62px;padding:0;justify-content:center} .zap-flutua span{display:none} }
@media (prefers-reduced-motion:reduce){ .zap-flutua::before{animation:none;opacity:0} }
body.galeria-aberta .zap-flutua{opacity:0;pointer-events:none}
/* o palco da abertura fica abaixo do conteúdo que sobe (senão a placa do celular aparece por cima do estoque) */
.palco{z-index:1}
/* rodapé não fica embaixo do botão flutuante */
.rodape-in{padding-right:max(clamp(16px,3vw,32px),190px)}
@media (max-width:700px){ .rodape-in{padding-right:clamp(16px,3vw,32px);padding-bottom:calc(100px + env(safe-area-inset-bottom))} }

/* tarja de VENDIDO / RESERVADO: faixa larga atravessando a foto, impossível de não ver */
.tarja{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden;display:grid;place-items:center}
.tarja span{display:block;text-transform:uppercase;width:160%;padding:14px 0;text-align:center;transform:rotate(-14deg);
  font:800 clamp(26px,4vw,44px)/1 "Mont",sans-serif;letter-spacing:.32em;text-indent:.32em;color:#fff;
  background:rgba(179,38,30,.9);box-shadow:0 8px 26px rgba(0,0,0,.55);border-top:2px solid rgba(255,255,255,.35);border-bottom:2px solid rgba(255,255,255,.35)}
.tarja.reservado span{background:rgba(201,168,102,.93);color:#15110a}
.tarja.grande span{font-size:clamp(34px,6vw,78px);padding:20px 0}
.carro.indisponivel .fotos,.visor:has(.tarja.vendido) img{filter:grayscale(.55) brightness(.75)}