:root{color-scheme:dark;--fundo:#040404;--texto:#f4f4f4;--neon:#ff2440;--linha:#8a1020;--cinza:#ababab}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#030303;color:var(--texto);font-family:Arial,Helvetica,sans-serif}
button,a{font:inherit;-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
:focus-visible{outline:3px solid #ffd770!important;outline-offset:3px!important}
.skip-link{position:absolute;z-index:50;left:8px;top:-100px;background:#fff;color:#000;padding:9px}
.skip-link:focus{top:8px}
.versao-exata{max-width:864px;margin:0 auto;box-shadow:0 0 95px rgba(116,0,22,.11)}
.arte-interativa{position:relative;width:100%;line-height:0}
.arte-base{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.hotspot{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);padding:0;border:2px solid transparent;border-radius:9px;background:transparent;display:block;line-height:normal;text-decoration:none;z-index:3}
.hotspot:hover{background:rgba(255,22,55,.10);border-color:rgba(255,40,72,.75);box-shadow:0 0 18px rgba(252,12,47,.4)}
.marcador{position:absolute;top:var(--y);left:0;width:1px;height:1px;pointer-events:none}
.versao-mobile{display:none}
#modal{width:min(91vw,490px);max-height:90dvh;border:1px solid #cf1637;border-radius:16px;background:#101010;color:#fff;padding:0;box-shadow:0 0 42px rgba(255,22,49,.34)}
#modal::backdrop{background:rgba(0,0,0,.86);backdrop-filter:blur(6px)}
.modal-conteudo{position:relative;padding:28px 23px 23px;text-align:center}
.fechar{position:absolute;right:12px;top:6px;font-size:34px;color:white;border:0;background:none;line-height:1}
#modal-foto img{display:block;width:min(70%,230px);aspect-ratio:1/1;object-fit:cover;margin:6px auto 15px;border-radius:12px;border:1px solid #6b0b23}
#modal-titulo{font-weight:900;font-size:1.28rem;margin:10px 17px}
#modal-texto{font-size:.94rem;line-height:1.55;color:#ccc;margin:12px 0 18px}
#modal-botoes{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.modal-acao{border:1px solid #fa1743;border-radius:9px;color:white;background:linear-gradient(#640b20,#1b050b);padding:11px 16px;font-weight:bold;text-decoration:none;font-size:.88rem}
.modal-acao.verde{border-color:#07b35e;background:linear-gradient(#066034,#05351e)}
@media(max-width:700px){
  .versao-exata{display:none}
  .versao-mobile{display:block;margin:0 auto;max-width:520px;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#210409 0%,transparent 35%),#050505;box-shadow:0 0 70px rgba(94,5,15,.3)}
  .cabecalho{background:linear-gradient(to bottom,transparent,#070707),#080808}
  .arte-hero{height:clamp(243px,77vw,318px);background-image:linear-gradient(to bottom,transparent 65%,#060606 99%),url('assets/hero.webp');background-repeat:no-repeat;background-position:center top;background-size:auto 100%;}
  .assinatura{text-align:center;margin-top:-13px;position:relative;padding:0 10px}
  .marca{font-family:Georgia,Times,serif;font-size:clamp(35px,9.7vw,49px);font-style:italic;font-weight:bold;letter-spacing:-2.8px;text-shadow:0 1px 7px #444}
  .marca .for{color:#fa173c;text-shadow:0 0 9px #8a041d}
  .assinatura p{font-size:10px;font-weight:bold;letter-spacing:2px;margin:3px 0 12px}
  .assinatura b{color:#db213a}
  .redes{display:flex;justify-content:center;gap:24px;align-items:center;padding:2px 0 17px}
  .redes>*{color:white;background:transparent;border:0;display:grid;place-items:center;width:42px;height:42px;text-decoration:none}
  .redes svg{width:28px;height:28px;fill:currentColor}
  .beneficios{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:2px 12px 27px}
  .beneficios>div{min-height:65px;display:flex;align-items:center;gap:10px;border:1px solid #323232;border-radius:10px;padding:11px 8px;background:linear-gradient(155deg,#131313,#060606);font-size:10px;line-height:1.25}
  .beneficios strong{font-size:11px}
  .beneficio-icone{color:#ff1d3d;font-size:35px;font-weight:900;line-height:1}
  section h2{margin:0 11px 18px;display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:clamp(18px,5.4vw,26px);font-weight:900;letter-spacing:1px;text-align:center;text-shadow:0 2px 4px #888}
  section h2::before,section h2::after{content:"";height:2px;background:linear-gradient(90deg,transparent,#f62444);flex:1;box-shadow:0 0 7px #bc113a}
  section h2::after{transform:rotate(180deg)}
  .atalhos,.destaques,.lojas{padding-bottom:30px}
  .atalhos-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 12px}
  .botao-atalho{display:flex;gap:9px;align-items:center;justify-content:center;text-align:left;min-height:68px;padding:7px 8px;color:#fff;border:1px solid #0bd968;border-radius:12px;background:linear-gradient(140deg,#00bd58,#08512b 53%,#031b12);font-size:clamp(11px,3.2vw,15px);font-weight:900;line-height:1.2;box-shadow:inset 0 0 11px #04974b,0 0 14px #03391b}
  .botao-atalho.instagram{grid-column:1/-1;background:linear-gradient(120deg,#fd8542,#d12364 43%,#5915ba 92%);border:1px solid #bb3ce3;box-shadow:0 0 14px #5d0d60}
  .icone-circulo{font-size:29px;display:inline-grid;place-items:center;min-width:31px}
  .seta{font-size:27px;font-weight:400;margin-left:auto}
  .grade-produtos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:0 12px}
  .produto{overflow:hidden;padding:0 0 10px;border:1px solid #8e0920;border-radius:13px;box-shadow:inset 0 0 14px #310410,0 0 10px rgba(119,0,11,.16);background:linear-gradient(#140a0c,#070707);text-align:center}
  .produto img{width:100%;aspect-ratio:1/1.04;object-fit:cover;display:block}
  .produto h3{font-size:16px;font-weight:900;line-height:1.1;margin:4px 0 7px}
  .logo-produto{font-size:13px;letter-spacing:1px;font-style:italic;font-weight:900;margin:0}
  .produto .cor{font-size:11px;color:#ccc;min-height:14px;margin:0 0 12px}
  .produto button,.loja a{width:calc(100% - 18px);margin:0 9px;color:#fff;border:1px solid #ff1742;border-radius:7px;padding:9px 5px;background:linear-gradient(#24090e,#080808);box-shadow:inset 0 0 10px #460010,0 0 7px #a20022;font-weight:900;font-size:11px;text-decoration:none;display:block;text-align:center}
  .lojas{padding-top:0}
  .loja{margin:0 12px 13px;display:grid;grid-template-columns:40% 60%;border:1px solid #3a3a3a;border-radius:12px;overflow:hidden;background:linear-gradient(125deg,#131313,#050505);min-height:192px}
  .loja img{width:100%;height:100%;min-height:192px;object-fit:cover}
  .loja-info{padding:15px 11px 11px;display:flex;flex-direction:column}
  .loja-info h3{font-size:clamp(11px,3.2vw,15px);font-weight:900;line-height:1.3;margin:0 0 13px}
  .loja-info h3 span{font-size:16px}
  .loja-info p{color:#e4e4e4;font-size:clamp(11px,3vw,13px);line-height:1.5;margin:0 0 13px}
  .loja-info a{margin-top:auto;width:100%;font-size:11px}
  .rodape{border-top:2px solid #7f0d22;text-align:center;margin:0 12px;padding:22px 0 23px;box-shadow:0 -5px 17px -11px #ff4265}
  .marca-rodape{font-size:33px}
  .rodape>p{font-size:9px;letter-spacing:1px;font-weight:bold;margin:2px 0 20px}
  .linha-rodape{display:flex;justify-content:space-between;gap:12px;text-align:left;color:#cfcfcf;font-size:9px;line-height:1.5}
  .linha-rodape span:last-child{text-align:right}
  .linha-rodape small{font-size:8px}
}
@media(min-width:701px){.versao-exata{display:block}.versao-mobile{display:none}}
@media(max-width:360px){.beneficios>div{gap:6px}.beneficios strong{font-size:10px}.loja{grid-template-columns:37% 63%}.loja-info{padding:12px 8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Catálogo ligado ao banco, mantendo a arte original da página */
.catalogo-desktop{background:#070707;color:#fff;text-align:center;padding:27px 22px 42px;border-top:2px solid #b50e32}
.catalogo-desktop>h2{font:900 28px system-ui,sans-serif;letter-spacing:1.5px;margin:0 0 10px}
.catalogo-desktop>p{font:14px system-ui,sans-serif;color:#aaa;margin:0 0 24px}
.grade-catalogo{max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:15px;align-items:start}
.grade-catalogo:empty{display:none}.grade-catalogo:empty~*{display:none}
.grade-catalogo .produto{width:100%;min-width:0;max-width:245px;padding-bottom:12px;background:#12080b;border:1px solid #a31932;border-radius:13px;overflow:hidden}
.grade-catalogo .produto img{width:100%;aspect-ratio:1/1;object-fit:contain;display:block;background:#fff}
.grade-catalogo .produto h3{margin:10px 7px;font-size:15px}.grade-catalogo .produto .cor{color:#aaa;font-size:12px}
.grade-catalogo .produto button{width:90%;margin:8px auto;color:#fff;border:1px solid #c71a39;border-radius:7px;padding:10px 5px;background:#210b11;cursor:pointer}
.produto .preco-produto{font-weight:900;color:#fff;font-size:15px;margin:8px}
.produto button:disabled{opacity:.5;cursor:not-allowed}
.sem-foto{width:100%;aspect-ratio:1/1.04;display:grid;place-items:center;background:linear-gradient(135deg,#21101a,#090909);color:#aaa;font-size:12px}
@media(max-width:700px){.catalogo-desktop{display:none}}

.catalogo-vazio{grid-column:1/-1;color:#c5c5c5;text-align:center;padding:20px;font:14px system-ui,sans-serif}

/* Vitrine dinâmica posicionada no espaço dos Destaques da Semana no desktop */
.visually-hidden{position:absolute!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;width:1px!important;height:1px!important;white-space:nowrap!important}
@media (min-width:701px){
  .catalogo-desktop.vitrine-atualizada{background:#030303;border:0;padding:6px 18px 27px}
  .vitrine-atualizada>p{font-size:13px;color:#aaa;margin:0 0 17px}
  .vitrine-atualizada .grade-catalogo{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:12px;max-width:100%}
  .vitrine-atualizada .grade-catalogo>.produto{flex:0 1 156px;width:156px;max-width:calc(100vw - 44px);min-width:0;background:linear-gradient(180deg,#170c0d 0%,#080505 100%);display:flex;flex-direction:column;box-shadow:0 0 13px rgba(125,5,30,.12)}
  .vitrine-atualizada .grade-catalogo>.produto:only-child{flex-basis:210px;width:210px}
  .vitrine-atualizada .grade-catalogo>.produto img{aspect-ratio:1/1;object-fit:contain;background:#fff}
  .vitrine-atualizada .grade-catalogo>.produto h3{font-size:14px;line-height:1.2}
  .vitrine-atualizada .grade-catalogo>.produto .preco-produto{margin-top:auto;font-size:14px;padding-top:5px}
  .vitrine-atualizada .grade-catalogo>.produto button{font-size:11px;font-weight:800}
}
