/* Home definitiva do varejo (artes/2026-09-29-home, aprovada pelo Franklin em 29/09/2026).
   Carrega depois de loja.css (cabeçalho, rodapé, cartão, selos) e categoria.css (grade, avaliações). */
main.home{max-width:var(--largura-loja);margin-inline:auto;padding:0 clamp(16px,3vw,32px) 64px}
.secao{margin-top:56px}
.secao-cab{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.secao-cab h2{font-size:1.75rem;font-weight:900;letter-spacing:-.01em;line-height:1.15}
.secao-cab p{font-size:1rem;color:var(--apoio);margin-top:4px;max-width:60ch}
.secao-cab a{color:var(--terra-dk);font-weight:700;display:inline-flex;align-items:center;min-height:44px}

/* Primeiro quadro: texto e a vitrine de produtos reais */
.hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center;padding:40px 0 8px}
.hero .olho{font-size:.875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--terra-dk);margin-bottom:12px}
.hero h1{font-size:clamp(2rem,3.4vw,3rem);font-weight:900;line-height:1.05;letter-spacing:-.02em}
.hero p.sub-h{font-size:1.125rem;line-height:1.6;margin:16px 0 24px;max-width:48ch}
.hero .acoes-h{display:flex;gap:12px;flex-wrap:wrap}
.hero .acoes-h .btn{width:auto;min-height:52px;padding:14px 24px}
.hero .acoes-h .btn-sec{min-height:52px}
.vitrine{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,1fr);gap:12px;aspect-ratio:1/1;max-height:520px}
.vitrine .t{background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-m);display:grid;place-items:center;overflow:hidden;position:relative}
.vitrine .t img{width:82%;height:82%;object-fit:contain}
.vitrine .t1{grid-column:1/5;grid-row:1/5}
.vitrine .t2{grid-column:5/7;grid-row:1/3}
.vitrine .t3{grid-column:5/7;grid-row:3/5}
.vitrine .t4{grid-column:1/3;grid-row:5/7}
.vitrine .t5{grid-column:3/5;grid-row:5/7}
.vitrine .t6{grid-column:5/7;grid-row:5/7;background:#fff;color:var(--tinta);text-decoration:none;text-align:center;padding:12px;font-weight:700;font-size:.9375rem;line-height:1.3}
.vitrine .t6 b{display:block;font-size:2rem;font-weight:900;line-height:1;color:var(--terra-dk)}
.vitrine .t .etq{position:absolute;left:10px;bottom:10px;font-size:.75rem;font-weight:700;background:rgba(255,255,255,.92);padding:3px 8px;border-radius:999px;color:var(--tinta)}

/* Faixa de vantagens: só o que é regra hoje */
.vantagens{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:40px}
.vantagens li{list-style:none;display:flex;gap:12px;align-items:flex-start;background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p);padding:16px}
.vantagens svg{width:26px;height:26px;color:var(--terra-dk);flex:none}
.vantagens b{display:block;font-size:.9375rem}
.vantagens span{font-size:.875rem;color:var(--apoio);line-height:1.45}

/* Grade de 6 (castanhas) */
.grade-6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}

/* Corredores */
.corr-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.corr{display:grid;justify-items:center;gap:8px;background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p);padding:14px 10px;text-decoration:none;color:var(--tinta);text-align:center}
.corr:hover{box-shadow:var(--sombra-m)}
.corr img{width:84px;height:84px;object-fit:contain}
.corr b{font-size:.9375rem;line-height:1.25}
.corr small{font-size:.8125rem;color:var(--apoio)}
.corr.todos{background:var(--tinta);color:#fff;align-content:center}
.corr.todos small{color:#e9dccd}

/* Compre do seu jeito */
.jeitos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.jeito{background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p);padding:22px;display:grid;gap:10px;align-content:start}
.jeito svg{width:32px;height:32px;color:var(--terra-dk)}
.jeito h3{font-size:1.1875rem;font-weight:700}
.jeito p{font-size:.9375rem;line-height:1.55;color:var(--tinta)}
.jeito .btn-sec{justify-self:start;min-height:44px}
.jeito.aqui{background:var(--papel);box-shadow:inset 0 0 0 1px var(--linha)}

/* Receitas da Cátia */
.receitas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.receita{background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p);overflow:hidden;text-decoration:none;color:var(--tinta);display:grid}
.receita img{width:100%;aspect-ratio:16/9;object-fit:cover}
.receita div{padding:14px 16px 18px}
.receita small{font-size:.8125rem;color:var(--apoio)}
.receita b{display:block;font-size:1.0625rem;line-height:1.35;margin-top:4px}
.receita:hover b{color:var(--terra-dk)}

@media (max-width:1000px){.grade-6{grid-template-columns:repeat(3,minmax(0,1fr))}.corr-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.vantagens{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .hero{grid-template-columns:minmax(0,1fr);padding-top:24px;gap:24px}
  .vitrine{max-height:none;aspect-ratio:auto;grid-template-rows:repeat(6,56px)}
  .grade-6{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .corr-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .corr img{width:64px;height:64px}
  .jeitos,.receitas{grid-template-columns:minmax(0,1fr)}
  .secao{margin-top:40px}
  .secao-cab h2{font-size:1.4375rem}
}
@media (max-width:420px){.vantagens{grid-template-columns:minmax(0,1fr)}}
.hero a.btn{text-decoration:none;color:#fff}
.hero a.btn:hover{background:#a63d1a}
/* cartões estreitos (6 por linha): o botão mostra "Adicionar"; o nome acessível continua completo */
@media (min-width:901px){.grade-6 .b-longo{display:none}.grade-6 .b-curto{display:inline}}
.grade-6 .card-p a.btn-sec{font-size:.875rem;text-align:center;line-height:1.25;padding:8px}
/* celular: a vitrine vira uma linha de 3 fotos, para os produtos aparecerem logo depois do texto */
@media (max-width:900px){
  .vitrine{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto;gap:10px}
  .vitrine .t{grid-column:auto !important;grid-row:auto !important;aspect-ratio:1/1}
  .vitrine .t4,.vitrine .t5,.vitrine .t6{display:none}
  .vitrine .t .etq{font-size:.6875rem;left:6px;bottom:6px}
}

/* Ofertas no WhatsApp (no lugar do Mailchimp) */
.zap-of{background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p);padding:26px 28px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:28px;align-items:center}
.zap-txt svg{width:32px;height:32px;color:var(--terra-dk)}
.zap-txt h2{font-size:1.5rem;font-weight:900;margin:8px 0 6px}
.zap-txt p{font-size:1rem;color:var(--apoio);line-height:1.55}
.zap-form{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;align-items:end}
.zap-form .consent{grid-column:1/-1;white-space:normal}
.zap-form .consent{align-items:flex-start}
.zap-form .consent input{margin-top:2px;flex:none}
.zap-form .consent a{color:var(--terra-dk);font-weight:700;text-underline-offset:3px}
.zap-form .zap-nota{grid-column:1/-1;font-size:.8125rem;color:var(--apoio);margin-top:-6px}
.zap-form .btn-sec{grid-column:1/-1;justify-self:start;min-height:48px}
@media (max-width:900px){.zap-of{grid-template-columns:minmax(0,1fr);padding:22px 18px}.zap-form{grid-template-columns:minmax(0,1fr)}}

/* Montagem: campos do formulário sem o CSS do checkout, mensagens, campanha, receita sem foto */
main.home .sec-rev .avaliacoes{margin-top:0}
main.home .sec-rev:empty{display:none}
.vantagens{padding:0}
.vantagens .ic{width:26px;height:26px;color:var(--terra-dk);flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.jeito .ic,.zap-txt .ic{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--terra-dk)}
.jeito .btn-sec .ic{width:20px;height:20px}
.jeito .btn-sec{display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.vitrine a.t{text-decoration:none}
.vitrine a.t:focus-visible,.corr:focus-visible,.receita:focus-visible{outline:2px solid var(--terra-dk);outline-offset:2px}
.receita .sem-foto{display:block;aspect-ratio:16/9;background:var(--papel)}
.campanha{margin-top:40px;background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p);padding:22px 24px;display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.campanha h2{font-size:1.375rem;font-weight:900}
.campanha p{color:var(--apoio);margin-top:4px}
.campanha .btn{width:auto;text-decoration:none;color:#fff}
.zap-form .campo{display:grid;gap:6px}
.zap-form label{font-size:.875rem;font-weight:700}
.zap-form input[type=text],.zap-form input:not([type]),.zap-form input[type=tel]{font:inherit;font-size:1rem;min-height:48px;padding:12px 14px;border:1px solid var(--borda);border-radius:var(--raio-in);background:#fff;color:var(--tinta);width:100%}
.zap-form input:focus-visible{outline:2px solid var(--terra-dk);outline-offset:1px;border-color:var(--terra-dk)}
.zap-form input[aria-invalid=true]{border-color:var(--erro)}
.zap-form .check{display:flex;gap:8px;font-size:.875rem;font-weight:500;min-height:44px}
.zap-form .check input{width:20px;height:20px;accent-color:var(--terra-dk)}
.zap-form .zap-msg{grid-column:1/-1}
.zap-form .zap-msg:empty{display:none}
.zap-feito{align-self:center}
.zap-feito:focus{outline:none}

/* ======================= Home comercial (artes/2026-09-29-home-comercial, aprovada 30/09) ======================= */
.nw{white-space:nowrap}
/* carrossel do palco: trilho com scroll-snap, sem biblioteca e sem rodar sozinho */
.carr{position:relative;border-radius:var(--raio);overflow:hidden;box-shadow:var(--sombra-m);background:#fff}
.carr-trilho{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.carr-trilho::-webkit-scrollbar{display:none}
.carr-slide{flex:0 0 100%;scroll-snap-align:start;scroll-snap-stop:always}
.carr-slide>.peca{height:100%}
.carr-pontos{position:absolute;left:50%;bottom:14px;translate:-50% 0;display:flex;align-items:center;border-radius:999px;background:rgba(42,29,23,.55)}
.carr-pontos .ponto{width:8px;height:8px;border-radius:999px;border:0;background:rgba(255,255,255,.55);padding:0;cursor:pointer;position:relative}
.carr-pontos .ponto::after{content:"";position:absolute;inset:-18px -12px} /* área de toque de 44 px (revisão do atacado) */
.carr-pontos .ponto[aria-current]{width:22px;background:#fff}
.carr-pontos .seta{border:0;cursor:pointer}
.carr-pontos .seta .ic{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.carr-pontos button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (prefers-reduced-motion:no-preference){.carr-trilho{scroll-behavior:smooth}}

/* banner com foto e rótulo em HTML */
.bn{position:relative;display:flex;align-items:flex-end;padding:16px;border-radius:var(--raio);overflow:hidden;box-shadow:var(--sombra-p);text-decoration:none;color:var(--tinta);background:#e9dccd;isolation:isolate}
.bn img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;transition:scale .3s}
.bn:hover img{scale:1.03}
.rot-b{display:grid;gap:3px;max-width:min(380px,100%);background:rgba(251,247,241,.97);border-radius:var(--raio-in);padding:14px 16px;box-shadow:0 6px 20px rgba(42,29,23,.18)}
.rot-b b{font-size:1.25rem;font-weight:900;line-height:1.15;letter-spacing:-.01em}
.rot-b>span:not(.cta){font-size:.875rem;color:var(--apoio);line-height:1.45}
.rot-b .cta{display:inline-flex;align-items:center;gap:4px;margin-top:4px;font-weight:700;font-size:.9375rem;color:var(--terra-dk)}
.rot-b .cta svg{width:18px;height:18px}
.bn:hover .cta{text-decoration:underline;text-underline-offset:3px}
@media (prefers-reduced-motion:reduce){.bn img{transition:none}}

.par{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.grupo-v{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:16px;align-items:stretch}
.grupo-prod .grade-cat{grid-template-columns:repeat(3,minmax(0,1fr))}

/* ---------- Opção B · Bancas da feira ---------- */
.b-hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:40px;align-items:center;padding:36px 0 8px}
.b-txt .olho{font-size:.875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--terra-dk);margin-bottom:12px}
.b-txt h1{font-size:clamp(2rem,3.2vw,2.875rem);font-weight:900;line-height:1.05;letter-spacing:-.02em}
.b-txt .sub-h{font-size:1.0625rem;line-height:1.6;margin:16px 0 24px;max-width:46ch}
.b-txt .acoes-h{display:flex;gap:12px;flex-wrap:wrap}
.b-txt .acoes-h .btn{width:auto;min-height:52px;padding:14px 22px;text-decoration:none;color:#fff}
.banca{display:flex;gap:16px;align-items:stretch}
.banca>.peca{flex:0 0 calc(25% - 12px);min-width:0}
.banca>.banca-prod{flex:1 1 0;min-width:0}

.banca .bn.placa .rot-b b{font-size:1.375rem}
.banca-prod .grade-cat{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}

/* ---------- Peça de banner do tema: cor + produtos + texto em HTML (nada de texto dentro da imagem) ---------- */
.peca{position:relative;display:grid;overflow:hidden;border-radius:var(--raio);text-decoration:none;color:var(--tinta);isolation:isolate;box-shadow:var(--sombra-p)}
.pc-sol{position:absolute;z-index:-1;right:-6%;bottom:-3%;width:64%;height:auto;fill:none;stroke-width:3;stroke-linecap:round}
.pc-sol circle{stroke:none}
.pc-txt{display:grid;gap:6px;align-content:center;justify-items:start}
.pc-olho{font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--terra-dk)}
.pc-tit{font-weight:900;line-height:1.05;letter-spacing:-.02em;max-width:18ch}
.pc-sub{font-size:1rem;line-height:1.45;max-width:38ch}
.pc-cta{display:inline-flex;align-items:center;gap:6px;margin-top:10px;min-height:48px;padding:0 20px;border-radius:var(--raio-in);font-weight:700;font-size:1rem;background:var(--terra-dk);color:#fff}
.pc-cta svg{width:18px;height:18px}
.peca:hover .pc-cta{text-decoration:underline;text-underline-offset:3px}
.pc-prods{display:flex;gap:14px;align-items:flex-end;justify-content:center}
.pc-p{position:relative;flex:1 1 0;max-width:190px;aspect-ratio:1/1;display:grid;place-items:center;background:#fff;border-radius:var(--raio);box-shadow:0 10px 26px rgba(42,29,23,.22)}
.pc-p img{width:84%;height:84%;object-fit:contain}
.pc-p:nth-child(2){translate:0 -14px}
.pc-preco{position:absolute;left:8px;bottom:8px;display:grid;line-height:1.1;background:#fff;border-radius:6px;padding:3px 8px;box-shadow:0 2px 6px rgba(42,29,23,.15);color:var(--tinta)}
.pc-preco s{font-size:.75rem;color:var(--apoio)}
.pc-preco b{font-size:1.0625rem;font-weight:900;color:var(--terra-dk);font-variant-numeric:tabular-nums}
/* formatos */
.f-larga{aspect-ratio:8/3;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);align-items:center;gap:28px;padding:36px 48px}
.f-larga .pc-tit{font-size:2.5rem}
.f-alta{aspect-ratio:4/5;grid-template-rows:auto 1fr;gap:12px;padding:26px 24px 22px}
.f-alta .pc-tit{font-size:1.625rem}
.f-alta .pc-sub{font-size:.9375rem}
.f-alta .pc-prods{align-self:end;gap:10px}
.f-alta .pc-sol{width:110%;right:-30%}
.f-meia{aspect-ratio:2/1;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:14px;padding:22px 24px}
.f-meia .pc-tit{font-size:1.5rem}
.f-meia .pc-sub{font-size:.9375rem}
.f-meia .pc-prods{gap:10px}
.f-meia .pc-sol{width:70%}
.f-quad{grid-template-rows:auto 1fr;padding:14px;gap:4px}
.f-quad .pc-tit{font-size:1.125rem}
.f-quad .pc-cta{min-height:36px;padding:0 12px;font-size:.875rem;margin-top:4px}
.f-quad .pc-prods{justify-content:flex-end;align-self:end}
.f-quad .pc-p{max-width:92px}
.f-quad .pc-sol{width:120%;right:-40%}
.f-placa{grid-template-rows:auto 1fr;gap:12px;padding:24px 22px 22px}
.f-placa .pc-tit{font-size:1.5rem}
.f-placa .pc-sub{font-size:.9375rem}
.f-placa .pc-prods{align-self:end}
.f-placa .pc-p{max-width:120px}
.f-placa .pc-sol{width:130%;right:-45%}
.carr .peca{border-radius:0;box-shadow:none}
.palco .carr{align-self:start}


/* controles do carrossel juntos na barra de baixo: nunca cobrem o texto da peça */
.carr-pontos{gap:4px;padding:3px}
.carr-pontos .seta{width:44px;height:44px;display:grid;place-items:center;background:none;color:#fff;border-radius:999px}
.carr-pontos .seta svg{width:18px;height:18px}
.carr-pontos .pausa{width:44px;height:44px}
.carr-pontos button:not(.seta):not(.pausa){margin:0 2px}
.carr.larga .carr-pontos{left:auto;right:18px;translate:none}
.f-larga .pc-txt{padding-bottom:10px}
.pc-preco{white-space:nowrap}
.f-alta .pc-preco{left:5px;bottom:5px;padding:2px 6px}
.f-alta .pc-preco b{font-size:.875rem}.f-alta .pc-preco s{font-size:.6875rem}
.f-alta{padding-bottom:58px}
/* faixa de campanha */
.f-faixa{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:center;gap:24px;padding:28px 40px;min-height:210px}
.f-faixa .pc-tit{font-size:1.75rem;max-width:24ch}
.f-faixa .pc-p{max-width:120px}
.f-faixa .pc-sol{width:40%;right:2%}
/* cartões estreitos (bancas e coleção): o botão mostra "Adicionar", o nome acessível continua completo */
.banca-prod .b-longo,.grupo-prod .b-longo{display:none}
.banca-prod .b-curto,.grupo-prod .b-curto{display:inline}

/* ================= versão escolhida (B com peças da A) ================= */
.b-hero.final{grid-template-columns:minmax(0,1fr) 440px;gap:48px}
.palco.so{display:block}
.palco.so .carr{max-width:440px}
/* cartão de fechamento da vitrine automática (o mesmo desenho de "Todos os corredores") */
.fecho{display:grid;align-content:center;justify-items:start;gap:10px;padding:22px;border-radius:var(--raio);background:var(--tinta);color:#fff;text-decoration:none}
.fecho b{font-size:1.25rem;font-weight:900;line-height:1.2}
.fecho span{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#dfb66b;color:var(--tinta)}
.fecho span svg{width:20px;height:20px}
.fecho:hover b{text-decoration:underline;text-underline-offset:4px}
main.home .receita div{padding:14px 16px 16px}
main.home .receita .rec-info{margin-top:8px}

/* ================= celular ================= */
@media (max-width:900px){
  .b-hero,.b-hero.final{grid-template-columns:minmax(0,1fr);gap:18px;padding-top:14px}
  .b-hero .palco{order:-1}
  .palco.so .carr{max-width:none}
  .b-txt h1{font-size:1.875rem}
  .b-txt .sub-h{font-size:1rem;margin:12px 0 18px}
  .b-txt .acoes-h a{flex:1 1 auto}
  .f-alta{padding:22px 20px 60px}
  .f-alta .pc-tit{font-size:1.5rem}
  /* banca: a placa vira uma faixa curta no topo e os produtos correm para o lado */
  .banca{flex-direction:column;gap:12px}
  .banca>.peca{order:-1;flex:none}
  .banca .f-placa{grid-template-rows:auto;padding:18px 18px 16px}
  .banca .f-placa .pc-prods{display:none}
  .banca .f-placa .pc-tit{font-size:1.25rem}
  .banca .f-placa .pc-cta{min-height:44px;margin-top:6px}
  .banca .f-placa .pc-sol{width:70%;right:-12%;bottom:-20%}
  .banca-prod .grade-cat,.grupo-prod .grade-cat{display:flex;overflow-x:auto;gap:10px;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}
  .banca-prod .card-p,.grupo-prod .card-p{flex:0 0 46%;scroll-snap-align:start}
  /* par: um embaixo do outro, com um produto só */
  .par{grid-template-columns:minmax(0,1fr);gap:12px}
  .f-meia{aspect-ratio:auto;grid-template-columns:minmax(0,1fr) 92px;padding:18px}
  .f-meia .pc-tit{font-size:1.25rem}
  .f-meia .pc-p:nth-child(2){display:none}
  .f-meia .pc-cta{min-height:44px}
  /* faixa: texto em cima, produtos pequenos embaixo */
  .f-faixa{grid-template-columns:minmax(0,1fr);padding:22px 20px;gap:16px;min-height:0}
  .f-faixa .pc-tit{font-size:1.375rem}
  .f-faixa .pc-prods{justify-content:flex-start}
  .f-faixa .pc-p{max-width:86px}
  .f-faixa .pc-sol{width:90%;right:-25%}
  /* coleção da receita: foto em cima, produtos para o lado */
  .grupo-v{grid-template-columns:minmax(0,1fr)}
  .grupo-v .bn.alto{aspect-ratio:16/10}
  .fecho{padding:18px}
}

/* cartão de fechamento da vitrine: claro, para não virar um bloco marrom entre as peças coloridas */
.fecho{background:#fdf1ea;color:var(--tinta);box-shadow:inset 0 0 0 1px #f1d9c6}
.fecho span{background:var(--terra-dk);color:#fff}
.fecho:hover{background:#fbe6d8}
/* ================= paleta do casario (Franklin, 30/09): substitui as 7 cores de campanha =================
   Fachadas caiadas de Olinda, do Pelourinho e do interior: tinta sobre cal, desbotada pelo sol, sobre o mesmo barro quente.
   5 famílias, cada uma forte e clara (10 opções). Contraste do texto medido: tudo acima de 4,5. */
.t-milho{background:#e3b04b;color:#2a1d17}
.t-milho .pc-olho{color:#6e2f0e}.t-milho .pc-sub{color:#4a3520}
.t-milho-cl{background:#f6e4b5;color:#2a1d17}
.t-milho-cl .pc-olho{color:#7a5210}.t-milho-cl .pc-sub{color:#5b4a3f}
.t-caju{background:#e07a3f;color:#2a1d17}
.t-caju .pc-olho,.t-caju .pc-sub{color:#2a1d17}
.t-caju-cl{background:#f8dcc6;color:#2a1d17}
.t-caju-cl .pc-olho{color:#9a3f12}.t-caju-cl .pc-sub{color:#5b4a3f}
.t-mandacaru{background:#4e6b3f;color:#fff}
.t-mandacaru .pc-olho{color:#fff}.t-mandacaru .pc-sub{color:#eef2e6}
.t-mandacaru-cl{background:#e3e8d2;color:#2a1d17}
.t-mandacaru-cl .pc-olho{color:#3d5531}.t-mandacaru-cl .pc-sub{color:#5b4a3f}
.t-anil{background:#3d6480;color:#fff}
.t-anil .pc-olho{color:#fff}.t-anil .pc-sub{color:#eaf0f2}
.t-anil-cl{background:#dde5e8;color:#2a1d17}
.t-anil-cl .pc-olho{color:#2f4f66}.t-anil-cl .pc-sub{color:#5b4a3f}
.t-goiaba{background:#a8434a;color:#fff}
.t-goiaba .pc-olho{color:#fff}.t-goiaba .pc-sub{color:#fbeeec}
.t-goiaba-cl{background:#f2d9d6;color:#2a1d17}
.t-goiaba-cl .pc-olho{color:#8a3239}.t-goiaba-cl .pc-sub{color:#5b4a3f}
/* botão da peça: tinta nas cores de fundo claro (milho, caju e todas as claras de milho e caju);
   branco com o texto da cor nas fortes escuras; a cor forte nas claras de mandacaru, anil e goiaba */
.t-milho .pc-cta,.t-milho-cl .pc-cta,.t-caju .pc-cta,.t-caju-cl .pc-cta{background:#2a1d17;color:#fff}
.t-mandacaru .pc-cta{background:#fff;color:#4e6b3f}.t-anil .pc-cta{background:#fff;color:#3d6480}.t-goiaba .pc-cta{background:#fff;color:#a8434a}
.t-mandacaru-cl .pc-cta{background:#4e6b3f;color:#fff}.t-anil-cl .pc-cta{background:#3d6480;color:#fff}.t-goiaba-cl .pc-cta{background:#a8434a;color:#fff}
/* o sol de fundo: nas fortes, raios em cal; nas claras, raios na cor forte, bem suaves */
.t-milho .pc-sol{stroke:#f6e4b5;opacity:.55}.t-milho .pc-sol circle{fill:#eac169}
.t-caju .pc-sol{stroke:#f8dcc6;opacity:.45}.t-caju .pc-sol circle{fill:#e8925f}
.t-mandacaru .pc-sol{stroke:#e3b04b;opacity:.35}.t-mandacaru .pc-sol circle{fill:#5d7b4d}
.t-anil .pc-sol{stroke:#e3b04b;opacity:.35}.t-anil .pc-sol circle{fill:#4a7390}
.t-goiaba .pc-sol{stroke:#e3b04b;opacity:.4}.t-goiaba .pc-sol circle{fill:#b5545a}
.t-milho-cl .pc-sol{stroke:#e3b04b;opacity:.55}.t-milho-cl .pc-sol circle{fill:#efd58e}
.t-caju-cl .pc-sol{stroke:#e07a3f;opacity:.35}.t-caju-cl .pc-sol circle{fill:#f3c3a2}
.t-mandacaru-cl .pc-sol{stroke:#4e6b3f;opacity:.22}.t-mandacaru-cl .pc-sol circle{fill:#d3dbbd}
.t-anil-cl .pc-sol{stroke:#3d6480;opacity:.22}.t-anil-cl .pc-sol circle{fill:#cbd7dc}
.t-goiaba-cl .pc-sol{stroke:#a8434a;opacity:.22}.t-goiaba-cl .pc-sol circle{fill:#ecc6c2}
/* rótulo do banner com foto na cor clara da família */
.rot-b.cl-mandacaru{background:rgba(227,232,210,.97)}
.rot-b.cl-mandacaru .cta{color:#3d5531}
.paleta.casario{grid-template-columns:minmax(0,1fr)}
.paleta.casario figure{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}
.paleta.casario figcaption{grid-column:1/-1}
.f-meia .pc-prods.n1 .pc-p{max-width:150px}

/* Montagem */
.peca .ic,.bn .ic,.fecho .ic{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.peca:focus-visible,.bn:focus-visible,.fecho:focus-visible{outline:3px solid var(--terra-dk);outline-offset:3px}
.pc-p img{height:84%;width:84%}
.b-hero.final.sem-palco{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
/* vantagens com a cor de assunto: círculo claro da família, ícone no tom escuro */
.vantagens .bola-v{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--c-clara,#fdf1ea);color:var(--c-escuro,var(--terra-dk));margin-top:-4px}
.vantagens .bola-v .ic{width:22px;height:22px;color:inherit}
/* vitrines da home com 4 cartões por linha (a de Ofertas: 3 e o cartão de fechamento) */
main.home .grade-cat{grid-template-columns:repeat(4,minmax(0,1fr))}
.banca-prod .grade-cat{grid-template-columns:repeat(4,minmax(0,1fr))}
.grupo-prod .grade-cat{grid-template-columns:repeat(3,minmax(0,1fr))}
.fecho{min-height:100%}
.corr .ic-at{width:64px;height:64px;color:var(--terra-dk)}
/* receitas: sem data, com a linha de informações */
.receita b{margin-top:0}
.rec-info{list-style:none;display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:8px;font-size:.8125rem;color:var(--apoio)}
.rec-info li{display:inline-flex;align-items:center;gap:5px}
.rec-info .ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.bn img{object-position:50% 50%}
@media (max-width:1000px){main.home .grade-cat{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){main.home .grade-cat{grid-template-columns:repeat(2,minmax(0,1fr))}.carr-slide{flex-basis:100%}}
/* Atalhos de corredor: só no celular (a barra do topo fica na gaveta). Uma linha que corre para o lado; o último aparece
   pela metade para dizer que há mais (icones-celular.png, "Encontre pelo corredor"). */
.atalhos-c{display:none}
@media (max-width:900px){
  .atalhos-c{display:block;margin:20px calc(-1 * clamp(16px,3vw,32px)) 0}
  .atalhos-c ul{list-style:none;display:flex;gap:4px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:2px clamp(16px,3vw,32px) 6px;scroll-padding-inline:clamp(16px,3vw,32px)}
  .atalhos-c ul::-webkit-scrollbar{display:none}
  /* o 5º círculo aparece cortado ao meio em qualquer largura de 320 a 430 (30/09) */
  .atalhos-c li{flex:0 0 clamp(64px, calc((100vw - 32px) / 4.5), 88px);scroll-snap-align:start}
  .atalhos-c a{display:grid;justify-items:center;gap:6px;min-height:44px;padding:4px 2px;text-align:center;text-decoration:none;color:var(--tinta);font-size:.8125rem;font-weight:600;line-height:1.2}
  .atalhos-c .bola-at{width:60px;height:60px}
  .atalhos-c .ic-at{width:38px;height:38px}
  .atalhos-c .todos-at .bola-at{background:var(--tinta);color:#fff}
  .atalhos-c .todos-at .ic{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
  .atalhos-c a:focus-visible{outline:2px solid var(--terra-dk);outline-offset:2px;border-radius:var(--raio-in)}
}

/* ---------- Carrossel de banners de imagem, antes das vantagens (artes/2026-09-30-faixa-whats-e-carrossel; Franklin, 30/09) ---------- */
.banners{margin-top:24px}
.banners + .b-hero{padding-top:28px}
.ban .carr-slide{aspect-ratio:8/3}
.ban-img,.ban-img picture,.ban-img img{display:block;width:100%;height:100%}
.ban-img img{object-fit:cover}
@media (max-width:900px){.banners{margin-top:12px}.banners + .b-hero{padding-top:14px}.ban .carr-slide{aspect-ratio:4/5}.carr.larga .carr-pontos{right:auto;left:50%;translate:-50% 0}}

/* ---------- Ofertas no WhatsApp: faixa laranja #b8451f com texto branco (branco sobre ela: 5,37:1) ---------- */
.zap-of{background:#b8451f;color:#fff;box-shadow:none;position:relative;overflow:hidden;isolation:isolate;padding:40px 44px}
/* o sol das peças, baixo e à direita, no vazio ao lado do botão: não passa por trás de texto */
.zap-of .pc-sol{position:absolute;z-index:-1;right:-3%;bottom:-24%;width:32%;height:auto;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;opacity:.16}
.zap-of .pc-sol circle{stroke:none;fill:#fff}
.zap-txt .ic,.zap-txt svg{color:#fff}
.zap-txt h2{color:#fff;font-size:1.75rem}
.zap-txt p{color:#fff}
.zap-form label{color:#fff}
.zap-form input[type=text],.zap-form input:not([type]),.zap-form input[type=tel]{border-color:#fff}
.zap-form input:focus-visible{outline:3px solid #fff;outline-offset:2px;border-color:#fff}
.zap-form .check input{accent-color:#2a1d17}
.zap-form .consent a{color:#fff;text-decoration:underline}
.zap-form .zap-nota{color:#fff}
.zap-form .btn-sec{background:#2a1d17;border-color:#2a1d17;color:#fff}
.zap-form .btn-sec:hover{background:#000;border-color:#000}
.zap-form .btn-sec:focus-visible{outline:3px solid #fff;outline-offset:2px}
.zap-form .zap-msg:not(:empty){background:#fff;color:#b3261e;border-radius:8px;padding:10px 12px}
.zap-of .zap-feito{background:#fff;color:#2a1d17}
/* o cabeçalho fica preso no topo: depois de enviar o formulário (volta para #ofertas-whatsapp), o título não some embaixo dele */
#banners,#ofertas-whatsapp{scroll-margin-top:148px}
@media (max-width:900px){.zap-of{padding:28px 20px}.zap-of .pc-sol{display:none}#banners,#ofertas-whatsapp{scroll-margin-top:134px}}