/* RE.CREATE, Loja em vidro: fundo preto com uma "mesa de luz" ao fundo e blocos de vidro por cima.
   Tudo escopado em body[data-page="loja"] para não afetar outras páginas. */
body[data-page="loja"] {
  --glass: rgba(255, 255, 255, .045);
  --glass-hi: rgba(255, 255, 255, .075);
  --glass-line: rgba(255, 255, 255, .11);
  --glass-line-hi: rgba(255, 255, 255, .26);
  --ink-0: #050505;
  background: var(--ink-0);
}

/* Mesa de luz: duas fontes de luz desfocadas que se movem devagar atrás do vidro */
body[data-page="loja"]::after {
  content: ""; position: fixed; inset: -20vmax; z-index: -1; pointer-events: none;
  background:
    radial-gradient(38vmax 30vmax at 18% 22%, rgba(255, 106, 43, .20), transparent 70%),
    radial-gradient(34vmax 28vmax at 82% 68%, rgba(155, 107, 255, .14), transparent 70%),
    radial-gradient(26vmax 22vmax at 60% 10%, rgba(255, 255, 255, .05), transparent 70%);
  filter: blur(10px);
  animation: lj-drift 38s ease-in-out infinite alternate;
}
@keyframes lj-drift { to { transform: translate3d(-4vmax, 3vmax, 0) rotate(6deg); } }

/* Área da loja: deixa de ser branca */
body[data-page="loja"] .shop { background: transparent; color: var(--paper); color-scheme: dark; }
body[data-page="loja"] .phead { background: transparent; }

/* Cabeçalhos de seção */
body[data-page="loja"] .ssec + .ssec { border-top: 1px solid var(--glass-line); }
body[data-page="loja"] .ssec__head h2 { font-family: var(--display); font-variation-settings: "wdth" 118; font-weight: 600; font-size: clamp(1.7rem, 3vw, 2.4rem); letter-spacing: -0.035em; }
body[data-page="loja"] .ssec__head p { color: #a9a9a9; }

/* Cartões de produto em vidro */
body[data-page="loja"] .prod {
  position: relative; background: var(--glass); border: 1px solid var(--glass-line); border-radius: 22px; color: var(--paper);
  -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 24px 50px -30px rgba(0,0,0,.9);
  transition: border-color .3s, transform .35s var(--ease), background .3s;
}
body[data-page="loja"] .prod:hover { border-color: var(--glass-line-hi); background: var(--glass-hi); transform: translateY(-3px); }
body[data-page="loja"] .prod__media { margin: 8px 8px 0; border-radius: 15px; background: linear-gradient(140deg, #141414, #0a0a0a); }
body[data-page="loja"] .prod__media img { transition: transform .6s var(--ease); }
body[data-page="loja"] .prod:hover .prod__media img { transform: scale(1.04); }
body[data-page="loja"] .prod__icon { color: var(--accent); opacity: .9; }
body[data-page="loja"] .prod__name { color: #fff; }
body[data-page="loja"] .prod__desc { color: #b4b4b4; }
body[data-page="loja"] .prod__price { color: #fff; }
body[data-page="loja"] .prod__price small { color: #8d8d8d; }
body[data-page="loja"] .prod__foot { border-top: 1px solid var(--glass-line); margin-top: 12px; padding-top: 14px; }

/* Botões: branco sólido sobre vidro, laranja no hover */
body[data-page="loja"] .shop .btn--dark { background: #fff; color: #0a0a0a; border-color: #fff; }
body[data-page="loja"] .shop .btn--dark:hover { background: var(--accent); border-color: var(--accent); color: #0a0a0a; }

/* Pacotes de conteúdo */
body[data-page="loja"] .pack {
  background: var(--glass); border: 1px solid var(--glass-line); border-radius: 22px; color: var(--paper);
  -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
body[data-page="loja"] .pack__media { margin: 8px; border-radius: 15px; overflow: hidden; }
body[data-page="loja"] .seg button { background: rgba(255,255,255,.04); border-color: var(--glass-line); color: #ddd; }
body[data-page="loja"] .seg button:hover { border-color: var(--glass-line-hi); color: #fff; }
body[data-page="loja"] .seg button[aria-checked="true"] { background: #fff; color: #0a0a0a; border-color: #fff; }

/* Resumo do pedido na lateral */
body[data-page="loja"] .sum {
  background: rgba(10, 10, 10, .55); border: 1px solid var(--glass-line); border-top: 1px solid rgba(255,106,43,.6);
  -webkit-backdrop-filter: blur(22px) saturate(150%); backdrop-filter: blur(22px) saturate(150%);
  box-shadow: 0 30px 60px -30px rgba(0,0,0,.95);
}
body[data-page="loja"] .how { color: #a9a9a9; }
body[data-page="loja"] .shopbar { background: rgba(10,10,10,.8); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-top: 1px solid var(--glass-line); }

/* Bloco "Soluções para sua marca" já é escuro: vira vidro também */
body[data-page="loja"] .ssec--build { background: var(--glass); border: 1px solid var(--glass-line); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }

@media (prefers-reduced-motion: reduce) {
  body[data-page="loja"]::after { animation: none; }
  body[data-page="loja"] .prod, body[data-page="loja"] .prod__media img { transition: none; }
}

/* fundo de ondas interativo (loja-bg.js) */
.lj-waves { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
