/* Empório Central — vitrine da demo loja.acheme.online (SanWeb Loja, 04/11/2026). Copiada da vitrine da demo Moda; terracota + grafite. Mobile-first. */
:root {
  --fundo: #1f2226;
  --fundo-2: #272b30;
  --cartao: #2f3439;
  --linha: rgba(224, 122, 75, .22);
  --texto: #f3efea;
  --texto-2: #bdb7b0;
  --ouro: #e07a4b;
  --ouro-claro: #f0a07a;
  --sobre-ouro: #1f2226;
  --raio: 6px;
  --serif: "Fraunces", Georgia, serif;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme: dark;
}
/* Dia: segue o botão dia/noite do SWCore (sw-day-fab → html[sw-theme="light"]). Noite = padrão do SWCore. */
html[sw-theme="light"] {
  --fundo: #f8f3ed;
  --fundo-2: #efe5da;
  --cartao: #ffffff;
  --linha: rgba(194, 86, 43, .16);
  --texto: #2b2f33;
  --texto-2: #5b5f63;
  --ouro: #b04a22;
  --ouro-claro: #e07a4b;
  --sobre-ouro: #ffffff;
  color-scheme: light;
}
/* o botão dia/noite do SWCore com a cor da loja */
.sw-day-fab { background: var(--cartao) !important; color: var(--ouro) !important; border: 1px solid var(--linha) !important; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fundo); color: var(--texto); font: 400 1.6rem/1.6 var(--sans); overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2 { font-family: var(--serif); font-weight: 600; line-height: 1.05; margin: 0 0 .5em; letter-spacing: -.01em; }
h1 { font-size: clamp(4.16rem, 9vw, 8.64rem); }
h2 { font-size: clamp(3.2rem, 6vw, 5.44rem); }
:focus-visible { outline: 2px solid var(--ouro); outline-offset: 3px; }
[hidden] { display: none !important; }

.sobre-titulo { text-transform: uppercase; letter-spacing: .22em; font-size: 1.152rem; font-weight: 600; color: var(--ouro); margin: 0 0 1.6rem; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.8rem; min-height: 48px; padding: 1.28rem 2.24rem; border-radius: var(--raio); font: 600 1.52rem/1.2 var(--sans); text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: background .2s, transform .2s; }
.btn-ouro { background: var(--ouro); color: var(--sobre-ouro); }
.btn-ouro:hover { background: var(--ouro-claro); transform: translateY(-1px); }
.btn-linha { border-color: var(--ouro); color: var(--texto); background: transparent; }

/* ── topo ── */
.topo { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 1.6rem; padding: 1.2rem 16px; background: color-mix(in srgb, var(--fundo) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linha); }
.marca { display: flex; align-items: center; gap: 0.96rem; text-decoration: none; margin-right: auto; }
.marca-k { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--ouro); border-radius: 50%; font: 700 2.24rem/1 var(--serif); color: var(--ouro); }
.marca-nome { font: 600 2rem/1 var(--serif); }
.menu { display: none; gap: 2.56rem; }
.menu a { text-decoration: none; font-size: 1.44rem; color: var(--texto-2); }
.menu a:hover { color: var(--ouro); }
.btn-topo { min-height: 44px; padding: 0.8rem 1.6rem; font-size: 1.36rem; }
.marca-nome { white-space: nowrap; }
@media (max-width: 359px) { .marca-nome { font-size: 1.68rem; } .marca-k { width: 34px; height: 34px; } .btn-topo { padding: 0.8rem 1.2rem; } .topo { gap: 0.8rem; } }
@media (min-width: 760px) { .menu { display: flex; } .topo { padding: 1.6rem 32px; } }

/* cartão entra toda vez que o filtro o mostra */
.card { animation: entra .5s cubic-bezier(.2, .7, .2, 1) both; }
.card:nth-child(4n+2) { animation-delay: .06s; } .card:nth-child(4n+3) { animation-delay: .12s; } .card:nth-child(4n+4) { animation-delay: .18s; }
@keyframes entra { from { opacity: 0; transform: translateY(24px) scale(.98); } }

/* ── CAPA no jeito do vendas.acheme.online (Sandro 03/11: "prefiro assim") ──
   Fundo: faixas largas e inclinadas com os ternos do estoque, correndo devagar, bem escuras.
   Esquerda: selo, título, texto, botões e etiquetas. Direita: 2 ternos em vitrine + selo redondo.
   Ao rolar, as faixas se afastam (sw-ani="zoom-out scrub" do SWCore). */
.capa { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; background: #16181b; isolation: isolate; padding: 10rem 1.6rem 8rem; }
/* 03/11 (Sandro: "bota de lado"): o fundo animado fica SÓ do lado direito, atrás do destaque; o lado do texto é escuro e parado */
.parede { position: absolute; top: -20%; bottom: -20%; left: 30%; right: -12%; z-index: -2; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4rem; transform: rotate(8deg);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 30%); mask-image: linear-gradient(90deg, transparent 0%, #000 30%); }
.parede-col { overflow: hidden; opacity: 0; transform: translateY(14%); transition: opacity 1.2s ease, transform 1.6s cubic-bezier(.16, 1, .3, 1); border-radius: .8rem; }
.parede-col:nth-child(even) { transform: translateY(-14%); }
.parede-col:nth-child(n+4) { display: none; }
.capa.pronta .parede-col { opacity: 1; transform: none; }
.capa.pronta .parede-col:nth-child(2) { transition-delay: .15s; } .capa.pronta .parede-col:nth-child(3) { transition-delay: .3s; }
.capa.pronta .parede-col:nth-child(4) { transition-delay: .45s; } .capa.pronta .parede-col:nth-child(5) { transition-delay: .6s; }
.parede-trilho { display: flex; flex-direction: column; gap: 2.4rem; animation: subir 70s linear infinite; }
.parede-col:nth-child(even) .parede-trilho { animation-name: descer; animation-duration: 80s; }
.parede img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: .8rem; filter: saturate(.7) brightness(.55); }
@keyframes subir { to { transform: translateY(-50%); } }
@keyframes descer { from { transform: translateY(-50%); } to { transform: translateY(0); } }
.capa::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
  linear-gradient(180deg, rgba(22, 24, 27, .85) 0%, rgba(22, 24, 27, .55) 40%, rgba(22, 24, 27, .9) 100%); }
.capa-grade { width: 100%; max-width: 128rem; margin: 0 auto; display: grid; gap: 4.8rem; align-items: center; }
.capa-txt { color: #f3efea; max-width: 64rem; }
.capa-selo { display: inline-flex; align-items: center; gap: 1rem; margin: 0 0 2.4rem; padding: .9rem 1.8rem; border: 1px solid rgba(255, 255, 255, .22); border-radius: 99rem; font: 700 1.15rem/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: #f3efea; background: rgba(22, 24, 27, .6); backdrop-filter: blur(6px); }
.capa-selo .ponto { width: .9rem; height: .9rem; border-radius: 50%; background: var(--ouro); box-shadow: 0 0 0 .4rem rgba(224, 122, 75, .25); flex: none; }
.capa-titulo { font-size: clamp(4.8rem, 9vw, 9.6rem); line-height: .98; letter-spacing: -.02em; margin: 0 0 2.4rem; color: #fff; }
.capa-titulo .linha { display: block; }
.capa-titulo em { color: var(--ouro-claro); font-style: italic; font-weight: 600; }
.capa-sub { font-size: 1.8rem; line-height: 1.6; color: #ddd6ce; margin: 0 0 3.2rem; max-width: 54rem; }
.capa-sub b { color: #fff; font-weight: 600; }
.capa-acoes { display: flex; flex-wrap: wrap; gap: 1.2rem; margin-bottom: 2.4rem; }
.capa-acoes .btn { min-height: 5.6rem; padding: 1.4rem 2.8rem; font-size: 1.6rem; }
.capa-acoes .btn-ouro { box-shadow: 0 1.6rem 4.8rem rgba(224, 122, 75, .3); }
.capa-acoes .btn-linha { color: #f3efea; border-color: rgba(255, 255, 255, .3); background: rgba(22, 24, 27, .5); }
.capa-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .8rem; }
.capa-chips li { padding: .9rem 1.6rem; border: 1px solid rgba(255, 255, 255, .18); border-radius: 99rem; font-size: 1.35rem; color: #ddd6ce; background: rgba(22, 24, 27, .5); }
.capa-chips b { color: var(--ouro-claro); }

.capa-vitrine { position: relative; height: 46rem; display: none; }
.vit { position: absolute; margin: 0; border-radius: 1.2rem; overflow: hidden; border: 1px solid rgba(224, 122, 75, .45); box-shadow: 0 3rem 8rem rgba(0, 0, 0, .6); background: #1f2226; }
.vit img { width: 100%; height: 100%; object-fit: cover; }
.vit figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 4rem 1.6rem 1.4rem; background: linear-gradient(transparent, rgba(22, 24, 27, .92)); color: #f3efea; font: 600 1.7rem/1.2 var(--serif); display: grid; gap: .2rem; }
.vit figcaption small { font: 600 1.1rem var(--sans); letter-spacing: .12em; color: var(--ouro-claro); }
.vit figcaption b { font: 600 1.5rem var(--sans); }
.vit-0 { right: 4%; top: 0; width: 62%; height: 100%; }
.vit-1 { left: 0; top: 8%; width: 40%; height: 66%; z-index: 1; }
.selo-redondo { position: absolute; right: -1rem; bottom: -2rem; width: 16rem; height: 16rem; border-radius: 50%; background: var(--ouro); color: #16181b; display: grid; place-content: center; text-align: center; box-shadow: 0 2rem 5rem rgba(224, 122, 75, .35); outline: 2px dashed rgba(22, 24, 27, .35); outline-offset: -1rem; }
.selo-redondo b { font: 700 6rem/1 var(--serif); }
.selo-redondo span { font: 800 1.15rem/1.15 var(--sans); letter-spacing: .12em; text-transform: uppercase; }

.capa-rolar { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); color: var(--ouro-claro); font-size: 2.8rem; text-decoration: none; animation: pula 2s ease-in-out infinite; min-width: 4.4rem; min-height: 4.4rem; display: grid; place-items: center; }
@keyframes pula { 50% { transform: translate(-50%, .8rem); } }
@media (min-width: 700px) { .parede { grid-template-columns: repeat(4, 1fr); } .parede-col:nth-child(4) { display: block; } }
@media (min-width: 1000px) {
  .capa { padding: 12rem 4.8rem 8rem; }
  .parede { grid-template-columns: repeat(4, 1fr); gap: 3.2rem; }
  .parede-col:nth-child(4) { display: block; }
  .capa::before { background: linear-gradient(90deg, #16181b 0%, #16181b 40%, rgba(22, 24, 27, .55) 62%, rgba(22, 24, 27, .3) 100%); }
  .parede { left: 44%; }
  .capa-grade { grid-template-columns: 1.05fr 1fr; }
  .capa-vitrine { display: block; }
}
@media (min-width: 1400px) { .capa-vitrine { height: 56rem; } }

/* ── quem somos ── */
.quem { padding: 8rem 16px; display: grid; gap: 4.8rem; max-width: 1200px; margin: 0 auto; }
.quem-txt p { color: var(--texto-2); max-width: 56ch; }
.quem-nums { list-style: none; margin: 0; padding: 0; display: grid; gap: 2.4rem; }
.quem-nums li { border-top: 1px solid var(--linha); padding-top: 1.6rem; display: flex; align-items: baseline; gap: 1.6rem; }
.quem-nums b { font: 600 clamp(4.8rem, 10vw, 8rem)/1 var(--serif); color: var(--ouro); min-width: 2ch; }
.quem-nums span { color: var(--texto-2); }
@media (min-width: 900px) { .quem { grid-template-columns: 1.2fr 1fr; padding: 11.2rem 32px; align-items: center; } }

/* ── produtos ── */
.produtos { padding: 6.4rem 16px 8rem; max-width: 1280px; margin: 0 auto; }
.produtos-cab .sub { color: var(--texto-2); margin: 0 0 3.2rem; }
.filtros { background: var(--fundo); padding: 1.2rem 0 1.6rem; margin-bottom: 2.4rem; border-bottom: 1px solid var(--linha); }
.abas { display: flex; gap: 0.8rem; overflow-x: auto; scrollbar-width: none; padding-bottom: 1.2rem; }
.abas::-webkit-scrollbar { display: none; }
.aba { flex: none; min-height: 44px; padding: 0.88rem 1.6rem; border-radius: 999px; border: 1px solid var(--linha); background: transparent; color: var(--texto-2); font: 500 1.44rem var(--sans); cursor: pointer; }
.aba[aria-selected="true"] { background: var(--ouro); border-color: var(--ouro); color: var(--sobre-ouro); }
.conta { font-size: .78em; opacity: .75; margin-left: 0.32rem; }
.seu-numero { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; align-items: end; }
.campo { display: grid; gap: 0.4rem; font-size: 1.2rem; text-transform: uppercase; letter-spacing: .12em; color: var(--texto-2); }
.campo select, .campo input { min-height: 46px; width: 100%; padding: 0.8rem 1.2rem; border-radius: var(--raio); border: 1px solid var(--linha); background: var(--cartao); color: var(--texto); font: 500 1.6rem var(--sans); }
.campo-busca { grid-column: 1 / -1; }
.link-guia { grid-column: 1 / -1; justify-self: start; background: none; border: 0; padding: 0.64rem 0; color: var(--ouro); font: 500 1.44rem var(--sans); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; min-height: 44px; }
@media (min-width: 900px) { .filtros { position: sticky; top: 72px; z-index: 10; } .seu-numero { grid-template-columns: 160px 160px 1fr auto; } .campo-busca, .link-guia { grid-column: auto; } }

.cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem; }
@media (min-width: 760px) { .cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.4rem; } }
@media (min-width: 1100px) { .cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.card { display: flex; flex-direction: column; text-decoration: none; background: var(--cartao); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; transition: transform .25s, border-color .25s; }
.card:hover { transform: translateY(-3px); border-color: var(--ouro); }
.card-foto { position: relative; aspect-ratio: 3 / 4; background: var(--fundo-2); overflow: hidden; }
.card-foto > img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.card:hover .card-foto > img { transform: scale(1.04); }
.card-txt { display: flex; flex-direction: column; gap: 0.24rem; padding: 1.28rem 1.44rem 1.6rem; flex: 1; }
.card-txt small { color: var(--ouro); font-weight: 600; letter-spacing: .08em; font-size: 1.152rem; }
.card-txt b { font: 600 1.84rem/1.2 var(--serif); }
.card-preco { font-weight: 600; margin-top: auto; padding-top: 0.64rem; }
.card-nums { font-size: 1.2rem; color: var(--texto-2); }

.bolinha { position: absolute; right: 0.8rem; bottom: 0.8rem; width: clamp(64px, 30%, 96px); height: auto; aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 2px solid var(--ouro); box-shadow: 0 4px 14px rgba(0, 0, 0, .45); background: var(--fundo-2); padding: 0; }
.bolinha img { width: 100%; height: 100%; object-fit: cover; }
.bolinha-g { width: clamp(96px, 26%, 140px); right: 1.6rem; bottom: 1.6rem; cursor: zoom-in; border-width: 3px; }
.card:hover .bolinha { transform: scale(1.08); }
.bolinha { transition: transform .35s; }
.selo-ultimas { position: absolute; left: 0.96rem; top: 0.96rem; background: var(--ouro); color: var(--sobre-ouro); font: 600 1.12rem/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; padding: 0.64rem 0.88rem; border-radius: 3px; }
.ficha .selo-ultimas { position: static; display: inline-block; margin: 0 0 1.6rem; }

.nada { text-align: center; padding: 4.8rem 1.6rem; color: var(--texto-2); }
.nada p { max-width: 46ch; margin: 0 auto 1.92rem; }

/* ── contato ── */
.contato { padding: 8rem 16px; background: var(--fundo-2); border-top: 1px solid var(--linha); display: grid; gap: 3.2rem; }
.contato > div { display: flex; flex-wrap: wrap; gap: 1.28rem; align-items: center; max-width: 1200px; }
.contato h2, .contato .sobre-titulo, .contato .end { flex-basis: 100%; }
.end { color: var(--texto-2); font-size: 1.68rem; margin: 0 0 1.28rem; }
.troca { color: var(--texto-2); font-size: 1.36rem; max-width: 60ch; margin: 0; }
@media (min-width: 900px) { .contato { padding: 9.6rem 6vw; } }

.rodape { padding: 3.2rem 16px; text-align: center; font-size: 1.28rem; color: var(--texto-2); border-top: 1px solid var(--linha); }
.rodape p { margin: 0.32rem 0; }
.feito { display: inline-flex; align-items: center; gap: 0.8rem; margin-top: 1.28rem; min-height: 44px; text-decoration: none; color: var(--texto-2); }
.feito img { width: 28px; height: 28px; border-radius: 6px; }
.feito b { font-weight: 600; color: var(--texto); letter-spacing: .02em; }
.feito:hover b { color: var(--ouro); }

/* ── página do produto ── */
.produto { max-width: 1200px; margin: 0 auto; padding: 2.4rem 16px 6.4rem; }
.voltar { display: inline-block; color: var(--texto-2); text-decoration: none; margin-bottom: 1.92rem; min-height: 44px; padding: 0.96rem 0; }
.produto-grade { display: grid; gap: 3.2rem; }
@media (min-width: 900px) { .produto-grade { grid-template-columns: 1.1fr 1fr; gap: 5.6rem; align-items: start; } .ficha { position: sticky; top: 90px; } }
@media (min-width: 600px) and (max-width: 899px) { .galeria { max-width: 460px; margin: 0 auto; width: 100%; } }
.galeria-principal { position: relative; aspect-ratio: 3 / 4; border-radius: var(--raio); overflow: hidden; background: var(--fundo-2); }
.galeria-principal > img { width: 100%; height: 100%; object-fit: cover; }
.miniaturas { display: flex; gap: 0.96rem; margin-top: 0.96rem; }
.miniaturas button { width: 72px; aspect-ratio: 3 / 4; padding: 0; border: 1px solid var(--linha); border-radius: 4px; overflow: hidden; cursor: pointer; background: none; }
.miniaturas button[aria-current="true"] { border-color: var(--ouro); }
.miniaturas img { width: 100%; height: 100%; object-fit: cover; }
.codigo { color: var(--ouro); font-weight: 600; letter-spacing: .12em; font-size: 1.28rem; text-transform: uppercase; margin: 0 0 0.8rem; }
.ficha h1 { font-size: clamp(3.52rem, 6vw, 5.44rem); }
.preco { font: 600 2.88rem/1 var(--sans); margin: 0 0 1.92rem; }
.preco small { font-size: 1.36rem; color: var(--texto-2); font-weight: 400; }
.numeros, .promos { border: 0; padding: 0; margin: 0 0 2.24rem; }
.numeros legend, .promos legend { font-size: 1.2rem; text-transform: uppercase; letter-spacing: .12em; color: var(--texto-2); margin-bottom: 0.96rem; padding: 0; }
.chips { display: flex; flex-wrap: wrap; gap: 0.8rem; }
.chip input, .promo input { position: absolute; opacity: 0; pointer-events: none; }
.chip span { display: grid; place-items: center; min-width: 52px; min-height: 48px; padding: 0 1.28rem; border: 1px solid var(--linha); border-radius: var(--raio); font-weight: 600; cursor: pointer; }
.chip input:checked + span { background: var(--ouro); border-color: var(--ouro); color: var(--sobre-ouro); }
.chip input:focus-visible + span, .promo input:focus-visible ~ span { outline: 2px solid var(--ouro); outline-offset: 2px; }
.promo { position: relative; display: flex; justify-content: space-between; gap: 1.6rem; padding: 1.36rem 1.6rem; border: 1px solid var(--linha); border-radius: var(--raio); margin-bottom: 0.8rem; cursor: pointer; }
.promo:has(input:checked) { border-color: var(--ouro); background: color-mix(in srgb, var(--ouro) 10%, transparent); }
.dica, .avulso, .ajuste, .tecido-info { font-size: 1.408rem; color: var(--texto-2); }
.btn-quero { width: 100%; min-height: 56px; font-size: 1.6rem; margin: 0.64rem 0 0.64rem; }
.descricao { margin: 2.4rem 0 1.6rem; color: var(--texto-2); border-top: 1px solid var(--linha); padding-top: 1.92rem; }
.complete { margin-top: 6.4rem; }
.complete h2 { font-size: clamp(2.88rem, 5vw, 4.16rem); }
.vazio-pg { min-height: 60svh; display: grid; place-content: center; text-align: center; padding: 4.8rem 16px; }

/* ── janelas ── */
.dlg { border: 1px solid var(--linha); border-radius: var(--raio); background: var(--cartao); color: var(--texto); padding: 2.4rem; max-width: min(520px, calc(100vw - 32px)); }
.dlg::backdrop { background: rgba(16, 17, 19, .75); }
.dlg h2 { font-size: 3.2rem; }
.dlg table { width: 100%; border-collapse: collapse; margin: 0.8rem 0 1.6rem; font-size: 1.472rem; }
.dlg th, .dlg td { padding: 0.72rem 0.48rem; border-bottom: 1px solid var(--linha); text-align: center; }
.dlg th { font-size: 1.152rem; text-transform: uppercase; letter-spacing: .08em; color: var(--texto-2); }
.dlg p { color: var(--texto-2); font-size: 1.44rem; }

/* ── peças do SWCore vestidas com a cor da loja ── */
.btn i, .link-guia i, .voltar i, .end i, .troca i { font-size: 1.15em; vertical-align: -.12em; }
.btn { gap: .8rem; }
.busca-caixa { position: relative; display: block; }
.busca-caixa i { position: absolute; left: 1.2rem; top: 50%; transform: translateY(-50%); font-size: 1.8rem; color: var(--texto-2); pointer-events: none; }
.busca-caixa input { padding-left: 4rem !important; }

/* painel do produto = sw-panel, 90% da largura */
#painelProduto { --sw-panel-sz: 90vw; background: var(--fundo); color: var(--texto); border-left: 1px solid var(--ouro); }
#painelProduto [sw-panel-bdy] { padding: 0; position: relative; }
#painelProduto [sw-panel-cls] { position: absolute; top: 1.2rem; right: 1.4rem; z-index: 3; }
#painelProduto .produto { padding-top: 5.6rem; animation: painelEntra .6s .2s cubic-bezier(.2, .7, .2, 1) both; }
#painelProduto .carregando .produto { opacity: .25; animation: none; }
#painelProduto .galeria-principal img { animation: fotoEntra .9s .3s cubic-bezier(.2, .7, .2, 1) both; }
@keyframes painelEntra { from { opacity: 0; transform: translateX(6rem); } }
@keyframes fotoEntra { from { opacity: 0; transform: scale(1.08); clip-path: inset(0 0 0 100%); } to { clip-path: inset(0); } }

/* foto grande: abre no sw-lightbox (com zoom) */
.foto-link { display: block; position: relative; width: 100%; height: 100%; cursor: zoom-in; }
.foto-link img { width: 100%; height: 100%; object-fit: cover; }
.foto-lupa { position: absolute; left: 1.2rem; bottom: 1.2rem; display: inline-flex; gap: .6rem; align-items: center; padding: .7rem 1.2rem; border-radius: 99rem; background: rgba(22, 24, 27, .72); color: #f3efea; font: 600 1.2rem/1 var(--sans); backdrop-filter: blur(4px); }

/* nossa loja + mapa (endereço vem do cadastro do sistema) */
.contato { grid-template-columns: 1fr; align-items: center; }
.contato-txt { display: grid; gap: 1.2rem; }
.contato-acoes { display: flex; flex-wrap: wrap; gap: 1.2rem; }
.end { display: flex; gap: .8rem; align-items: flex-start; font-size: 1.8rem; }
.end i { color: var(--ouro); margin-top: .3rem; }
.mapa { border-radius: .6rem; overflow: hidden; border: 1px solid var(--linha); min-height: 32rem; box-shadow: 0 2.4rem 6rem rgba(0, 0, 0, .25); }
.mapa iframe { display: block; width: 100%; height: 100%; min-height: 32rem; border: 0; filter: grayscale(.35) contrast(1.05); }
@media (min-width: 900px) { .contato { grid-template-columns: 1fr 1.2fr; gap: 6.4rem; } .mapa, .mapa iframe { min-height: 44rem; } }

/* loader da transição de página (sw-ani-page) com a marca da loja */
.sw-trans-ovl .marca-k, .y2transi-ovl .marca-k { width: 5.6rem; height: 5.6rem; font-size: 3.2rem; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; } }

/* 03/11 (Sandro): terno tem UM número; a calça vem sempre 6 abaixo — avisos na vitrine e no produto */
.calca-auto, .campo-dica { display: flex; gap: .8rem; align-items: center; margin: 0 0 1.6rem; padding: 1.2rem 1.4rem; border-radius: .6rem; border: 1px solid var(--linha); background: color-mix(in srgb, var(--ouro) 10%, transparent); font-size: 1.45rem; color: var(--texto); }
.calca-auto i, .campo-dica i { color: var(--ouro); font-size: 1.9rem; flex: none; }
.calca-auto b, .campo-dica b { color: var(--ouro); }
.campo-dica { margin: 0; align-self: end; min-height: 4.6rem; }
@media (min-width: 900px) { .seu-numero { grid-template-columns: 200px minmax(240px, 1.1fr) 1fr auto; } }

/* ── /52: tudo no número (pedido do cliente, 03/11/2026) ── */
.numero-pg { max-width: 128rem; margin: 0 auto; padding: 2.4rem 1.6rem 6.4rem; }
.numero-topo { padding: 2.4rem 0 3.2rem; border-bottom: 1px solid var(--linha); margin-bottom: 3.2rem; }
.numero-titulo { font-size: clamp(4.4rem, 9vw, 9.6rem); line-height: 1; margin: 0 0 1.6rem; }
.numero-titulo em { font-style: normal; color: var(--ouro); display: inline-block; min-width: 2ch; }
.numero-sub { color: var(--texto-2); font-size: 1.7rem; margin: 0 0 2.4rem; }
.numero-sub b { color: var(--ouro); }
.numero-chips { display: flex; flex-wrap: wrap; gap: .8rem; }
.numero-chips a { display: grid; place-items: center; min-width: 5.2rem; min-height: 4.8rem; padding: 0 1.2rem; border: 1px solid var(--linha); border-radius: .6rem; text-decoration: none; font-weight: 600; color: var(--texto); transition: border-color .2s, background .2s; }
.numero-chips a:hover { border-color: var(--ouro); }
.numero-chips a[aria-current="page"] { background: var(--ouro); border-color: var(--ouro); color: var(--sobre-ouro); }
.numero-grupo { margin-bottom: 4.8rem; }
.numero-grupo__titulo { font-size: clamp(2.8rem, 4vw, 4rem); display: flex; align-items: baseline; gap: 1.2rem; }
.numero-grupo__titulo small { font: 600 1.4rem var(--sans); color: var(--ouro); }

/* ── LOGO do cliente (03/11/2026): branca de noite, preta de dia; GRANDE na capa ── */
.marca-logo { height: 4.4rem; width: auto; display: block; }
.marca-logo--dia { display: none; }
html[sw-theme="light"] .marca-logo--noite { display: none; }
html[sw-theme="light"] .marca-logo--dia { display: block; }
.capa-logo { margin: 0 0 2.4rem; line-height: 0; }
.capa-logo img { width: min(64rem, 100%); height: auto; filter: drop-shadow(0 1.2rem 3rem rgba(0, 0, 0, .45)); }
.capa .capa-titulo { font-size: clamp(3.2rem, 5vw, 5.2rem); margin: 0 0 2rem; }
.capa .capa-titulo .linha { display: inline; }
.rodape-logo { height: 6.4rem; width: auto; margin: 0 auto 1.6rem; display: block; }
html[sw-theme="light"] .rodape-logo.marca-logo--noite { display: none; }
html[sw-theme="light"] .rodape-logo.marca-logo--dia { display: block; }
@media (max-width: 359px) { .marca-logo { height: 3.6rem; } }
.capa p.capa-titulo { font-family: var(--serif); font-weight: 600; line-height: 1.05; color: #fff; }
/* rodapé: só UMA logo por vez (a regra .rodape-logo{display:block} vencia o esconder) */
.rodape-logo.marca-logo--dia { display: none; }
html[sw-theme="light"] .rodape-logo.marca-logo--dia { display: block; }

/* ── CAPA NO MODO DIA (Sandro 03/11: "o hero tem que ficar claro e escuro") ── */
.capa-logo .marca-logo--dia { display: none; }
html[sw-theme="light"] .capa-logo .marca-logo--noite { display: none; }
html[sw-theme="light"] .capa-logo .marca-logo--dia { display: block; }
html[sw-theme="light"] .capa-logo img { filter: drop-shadow(0 1rem 2.4rem rgba(194, 86, 43, .12)); }
html[sw-theme="light"] .capa { background: #f7efe6; }
html[sw-theme="light"] .capa::before { background: linear-gradient(180deg, rgba(247, 239, 230, .9) 0%, rgba(247, 239, 230, .65) 40%, rgba(247, 239, 230, .95) 100%); }
html[sw-theme="light"] .parede img { filter: saturate(.9) brightness(1.02); }
html[sw-theme="light"] .capa-txt,
html[sw-theme="light"] .capa p.capa-titulo { color: #2b2f33; }
html[sw-theme="light"] .capa-titulo em { color: #b04a22; }
html[sw-theme="light"] .capa-sub { color: #5b5f63; }
html[sw-theme="light"] .capa-sub b { color: #2b2f33; }
html[sw-theme="light"] .capa-acoes .btn-linha { color: #2b2f33; border-color: rgba(194, 86, 43, .3); background: rgba(255, 255, 255, .7); }
html[sw-theme="light"] .capa-chips li { color: #5b5f63; border-color: rgba(194, 86, 43, .18); background: rgba(255, 255, 255, .75); }
html[sw-theme="light"] .capa-chips b { color: #b04a22; }
html[sw-theme="light"] .capa-rolar { color: #b04a22; }
html[sw-theme="light"] .vit { box-shadow: 0 3rem 7rem rgba(194, 86, 43, .22); }
@media (min-width: 1000px) {
  html[sw-theme="light"] .capa::before { background: linear-gradient(90deg, #f7efe6 0%, #f7efe6 40%, rgba(247, 239, 230, .55) 62%, rgba(247, 239, 230, .2) 100%); }
}

/* voltar ao início (sw-top do SWCore) na cor da loja */
.topo-voltar[sw-top] { background: var(--ouro) !important; color: var(--sobre-ouro) !important; width: 5.2rem; height: 5.2rem; font-size: 2.4rem; box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, .3); border: 0; }
.topo-voltar[sw-top]:hover { background: var(--ouro-claro) !important; }

/* ===== Por dentro da loja — galeria pequena (clique = sw-lightbox) · 03/11 ===== */
.galeria-loja { padding: 2rem 16px 8rem; max-width: 1200px; margin: 0 auto; }
.galeria-loja h2 { margin-bottom: 3.2rem; }
.galeria-grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.galeria-item { display: block; aspect-ratio: 1; overflow: hidden; border: 1px solid var(--linha); border-radius: .6rem; background: var(--cartao); }
.galeria-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease, filter .5s ease; }
.galeria-item:hover img, .galeria-item:focus-visible img { transform: scale(1.06); filter: brightness(1.08); }
.galeria-item:first-child { grid-column: span 2; grid-row: span 2; }
@media (min-width: 760px) { .galeria-grade { grid-template-columns: repeat(6, 1fr); gap: 1.2rem; } }

/* ===== Avaliar no Google ===== */
.avaliar { margin-top: 3.2rem; padding: 2rem; border: 1px solid var(--linha); border-radius: .8rem; background: var(--cartao); display: grid; gap: 1.2rem; justify-items: start; }
.avaliar p { margin: 0; color: var(--texto-2); }
.avaliar p b { color: var(--texto); }
.avaliar-estrelas { display: flex; gap: .4rem; color: var(--ouro); font-size: 2rem; }

/* ── demo moda masculina (04/11/2026) ── */
.galeria-item { position: relative; }
.galeria-rot { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.4rem 1.2rem 1rem; font: 600 1.5rem/1.2 var(--sans); color: #fff;
  background: linear-gradient(transparent, rgba(22, 24, 27, .85)); }
.produtos-cab .numero-chips { margin-top: 1.6rem; }
.dlg table + table { margin-top: 1.6rem; }

/* SanWeb Loja (04/11/2026): fotos de produto quadradas (mercearia, eletrônico, bolo… não são roupa em pé) */
.card-foto, .galeria-principal, .parede img, .miniaturas button { aspect-ratio: 1 / 1; }
#perguntas { border-top: 1px solid var(--linha); }
#perguntas .quem-txt p b { color: var(--texto); }
