/* Pré-Moldados Santo Expedito — visual "Rural" */
:root{
  --verde:#1F4D2B; --verde-esc:#163A20; --verde-claro:#D9E3D2;
  --areia:#F4EDE1; --areia-2:#EDE3D1; --borda:#E2D7C3;
  --ouro:#E9B949; --ocre:#8A5A1F; --ocre-claro:#F4E4C4;
  --texto:#2B2A26; --texto-2:#5E5A50;
  --raio:14px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--areia);color:var(--texto);font:400 17px/1.5 'Source Sans 3',system-ui,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:var(--verde)}
h1,h2,h3{font-family:'Bitter',Georgia,serif;font-weight:800;line-height:1.15;margin:0}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:99}

/* topo */
.topo{position:sticky;top:0;z-index:20;background:var(--verde);box-shadow:0 1px 0 rgba(0,0,0,.15)}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:72px}
.topo .logo img{height:60px;width:auto}
.btn-zap{display:inline-flex;align-items:center;gap:8px;background:var(--ouro);color:#1E2A16;font-weight:700;font-size:16px;text-decoration:none;padding:10px 16px;border-radius:999px;min-height:44px;white-space:nowrap}
.btn-zap:hover{background:#f2c862;color:#1E2A16}
.btn-zap svg{width:20px;height:20px;flex-shrink:0}

/* faixa verde (hero / cabeçalho de página) */
.faixa{background:var(--verde);color:var(--areia);padding:28px 0 40px}
.faixa .sobre{margin:0 0 10px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ouro);font-weight:700}
.faixa h1{font-size:clamp(30px,5vw,48px);max-width:16ch}
.faixa p.lead{margin:14px 0 0;font-size:18px;color:var(--verde-claro);max-width:52ch}
.hero-grid{display:grid;gap:24px;align-items:center}
.hero-vitrine{background:var(--areia);border-radius:18px;padding:18px 10px 12px;display:flex;justify-content:center;align-items:flex-end;gap:4px}
.hero-vitrine img{min-width:0;height:auto;object-fit:contain;object-position:bottom}
.hero-vitrine img:nth-child(1){width:46%}
.hero-vitrine img:nth-child(2){width:36%}
.hero-vitrine img:nth-child(3){width:17%;max-height:240px}
.voltar{display:inline-flex;align-items:center;min-height:44px;color:var(--ouro);font-weight:700;text-decoration:none;margin-bottom:4px}
.voltar:hover{color:#f2c862;text-decoration:underline}

/* seções */
.secao{padding:36px 0 8px}
.secao>.wrap>h2{font-size:28px;color:var(--verde)}
.secao .sub{margin:6px 0 18px;color:var(--texto-2)}

/* grade de categorias */
.cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cat{display:flex;flex-direction:column;background:#fff;border-radius:var(--raio);overflow:hidden;text-decoration:none;color:var(--texto);box-shadow:0 1px 0 var(--borda);transition:transform .15s,box-shadow .15s}
.cat:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(31,77,43,.12)}
.cat .foto{height:130px;display:flex;align-items:center;justify-content:center;background:var(--areia-2);padding:12px}
.cat .foto img{max-height:106px;width:auto;object-fit:contain}
.cat .foto.cheia{padding:0}.cat .foto.cheia img{width:100%;height:100%;max-height:none;object-fit:cover}
.cat .txt{padding:10px 12px 14px;display:flex;flex-direction:column;gap:2px}
.cat .nome{font-family:'Bitter',serif;font-weight:600;font-size:17px;line-height:1.2}
.cat .qtd{font-size:14px;color:var(--ocre);font-weight:600}

/* produtos */
.produtos{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.prod{background:#fff;border-radius:var(--raio);overflow:hidden;box-shadow:0 1px 0 var(--borda);display:flex;flex-direction:column}
.prod .foto{height:200px;display:flex;align-items:center;justify-content:center;background:var(--areia-2);padding:16px}
.prod .foto img{max-height:168px;max-width:90%;width:auto;object-fit:contain}
.prod .foto.cheia{padding:0}.prod .foto.cheia img{width:100%;height:100%;max-height:none;max-width:none;object-fit:cover}
.prod .txt{padding:14px 16px 18px;display:flex;flex-direction:column;gap:8px}
.prod .cab{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.prod h2{font-size:20px;color:var(--verde)}
.cod{font-size:13px;font-weight:700;color:var(--ocre);background:var(--ocre-claro);padding:3px 8px;border-radius:6px;white-space:nowrap}
.prod p{margin:0;font-size:16px;color:#4A473F}

.desenhos,.galeria{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.desenhos figure,.galeria figure{margin:0;background:#fff;border-radius:var(--raio);overflow:hidden;box-shadow:0 1px 0 var(--borda)}
.desenhos img{padding:14px;margin:0 auto;max-height:240px;object-fit:contain}
.galeria img{width:100%;aspect-ratio:4/3;object-fit:cover}
.desenhos figcaption{padding:8px 14px 12px;font-weight:600;color:var(--texto-2)}

/* chamada */
.chamada{margin:32px 0 0;background:var(--ocre);color:#FFF8EC;border-radius:18px;padding:26px 22px;display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:space-between}
.chamada h2{font-size:24px}
.chamada p{margin:6px 0 0;max-width:52ch}
.chamada .btn-zap{font-size:17px;padding:14px 22px}

/* onde estamos */
.local{display:grid;gap:16px;background:#fff;border-radius:18px;padding:22px;box-shadow:0 1px 0 var(--borda)}
.local address{font-style:normal;font-size:17px}
.btn-sec{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border-radius:999px;border:2px solid var(--verde);color:var(--verde);font-weight:700;text-decoration:none}
.btn-sec:hover{background:var(--verde);color:#fff}

/* rodapé */
.rodape{margin-top:40px;background:var(--verde-esc);color:var(--verde-claro);padding:32px 0 40px;font-size:15px}
.rodape .wrap{display:grid;gap:22px}
.rodape img{width:170px}
.rodape .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.rodape h3{font-family:'Source Sans 3',sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ouro);margin-bottom:4px}
.rodape a{color:#fff;text-decoration:none}.rodape a:hover{text-decoration:underline}
.rodape .peq{font-size:13px;color:#9FB39A}

/* vendas */
.busca{position:sticky;top:72px;z-index:10;background:var(--areia);padding:12px 0 10px;border-bottom:1px solid var(--borda)}
.busca label{display:block;font-weight:700;font-size:14px;margin-bottom:6px;color:var(--texto-2)}
.busca input{width:100%;font:inherit;font-size:18px;padding:12px 14px;border:2px solid var(--borda);border-radius:12px;background:#fff}
.busca input:focus{outline:none;border-color:var(--verde)}
.chips{display:flex;gap:8px;overflow-x:auto;padding:10px 0 2px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex-shrink:0;font:inherit;font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px;border:1.5px solid var(--borda);background:#fff;color:var(--texto);cursor:pointer;min-height:40px}
.chip[aria-pressed="true"]{background:var(--verde);border-color:var(--verde);color:#fff}
.grupo{margin-top:22px}
.grupo h2{font-size:20px;color:var(--verde);margin-bottom:8px}
.linha{display:flex;align-items:center;gap:12px;background:#fff;border-radius:12px;padding:10px 12px;margin-bottom:8px;box-shadow:0 1px 0 var(--borda)}
.linha .mini{width:56px;height:56px;flex-shrink:0;background:var(--areia-2);border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.linha .mini img{max-width:50px;max-height:50px;object-fit:contain}
.linha .info{flex:1;min-width:0}
.linha .n{font-weight:700;line-height:1.25}
.linha .c{font-size:13px;color:var(--texto-2)}
.linha .precos{text-align:right;white-space:nowrap}
.linha .p{font-weight:700;font-size:18px;color:var(--verde)}
.linha .p.consulta{font-size:15px;color:var(--ocre)}
.linha .p2{font-size:13px;color:var(--texto-2)}
.copiar{font:inherit;font-size:13px;font-weight:700;border:1.5px solid var(--borda);background:#fff;border-radius:8px;padding:6px 10px;cursor:pointer;color:var(--verde);margin-top:4px;min-height:32px}
.copiar.ok{background:var(--verde);color:#fff;border-color:var(--verde)}
.vazio{padding:30px 0;color:var(--texto-2)}
.aviso{font-size:14px;color:var(--texto-2);margin:6px 0 0}

@media (min-width:700px){
  .cats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero-grid{grid-template-columns:1.1fr .9fr}
  .faixa{padding:48px 0 56px}
  .local{grid-template-columns:1fr auto;align-items:center}
}
@media (min-width:1000px){.cats{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:420px){.topo .logo img{height:52px}.btn-zap{padding:9px 13px;font-size:15px}}
