/* Theme: Preto e Roxo (neon) - versão limpa */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#050007;
  --panel:#0b0610;
  --muted:#9aa3ad;
  --neon-purple:#8a2be2;
  --neon-purple-2:#b84bff;
  --neon-purple-3:#5a00d6;
  --white:#f3f8ff;
}
body{
  font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
  line-height:1.6;
  color:var(--white);
  position:relative;

  /* IMAGEM DE FUNDO CENTRALIZADA */
  background: url("./img/WhatsApp\ Image\ 2026-02-21\ at\ 17.17.20.jpeg") no-repeat center center fixed;
  background-size: cover;
}

/* Camada escura para manter legibilidade e efeito roxo */
body::before{
  content:"";
  position:fixed;
  inset:0;
  background: linear-gradient(
    180deg,
    rgba(5,0,7,0.85),
    rgba(10,0,20,0.9)
  );
  z-index:-1;
}

header.site-header{
  background:linear-gradient(180deg, rgba(138,43,226,0.06), rgba(90,0,214,0.02));
  position:sticky;top:0;z-index:100;
  border-bottom:1px solid rgba(138,43,226,0.06);
  backdrop-filter:blur(4px);
}
.header-inner{max-width:1200px;margin:0 auto;padding:16px 5%;display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:800;font-size:1.25rem;color:var(--neon-purple-2);text-shadow:0 0 12px rgba(184,75,255,0.35), 0 0 24px rgba(138,43,226,0.25), 0 0 40px rgba(90,0,214,0.15);filter:brightness(1.3)}

.main-nav{display:flex;gap:12px;align-items:center}
.search{background:rgba(255,255,255,0.02);border:1px solid rgba(138,43,226,0.06);color:var(--white);padding:10px 14px;border-radius:10px;min-width:260px;box-shadow:inset 0 6px 18px rgba(138,43,226,0.03)}
.nav-actions{display:flex;gap:8px}

.hero{padding:72px 0 52px;background:linear-gradient(120deg, rgba(138,43,226,0.08), rgba(90,0,214,0.02))}
.hero-content{max-width:1100px;margin:0 auto;text-align:left}
.hero-content h1{font-size:2.6rem;margin-bottom:8px;color:var(--white);text-shadow:0 0 16px rgba(138,43,226,0.22), 0 8px 30px rgba(138,43,226,0.08), 0 0 40px rgba(90,0,214,0.06)}
.hero-content p{color:var(--muted);margin-bottom:18px}
.hero-cta .btn{margin-right:12px}

.btn{background:linear-gradient(90deg,var(--neon-purple),var(--neon-purple-2));color:var(--white);padding:10px 18px;border-radius:12px;border:2px solid rgba(184,75,255,0.22);cursor:pointer;font-weight:700;text-decoration:none;box-shadow:0 0 20px rgba(138,43,226,0.18), 0 8px 30px rgba(138,43,226,0.14), inset 0 1px 0 rgba(255,255,255,0.08)}
.btn-transparent{background:transparent;color:var(--white);border:1px solid rgba(138,43,226,0.08);padding:9px 16px;border-radius:10px}
.btn-small{background:linear-gradient(90deg, rgba(138,43,226,0.08), rgba(184,75,255,0.04));color:var(--white);padding:8px 12px;border-radius:8px;border:1px solid rgba(138,43,226,0.06);font-weight:600}

.container{max-width:1200px;margin:0 auto;padding:0 5%}
.section{padding:40px 0 56px 0}
.section h2{margin-bottom:18px;color:var(--neon-purple-2);text-shadow:0 0 12px rgba(184,75,255,0.24), 0 0 24px rgba(138,43,226,0.1);font-weight:700}

.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.card{background:linear-gradient(180deg, rgba(138,43,226,0.02), rgba(0,0,0,0.12));border:1px solid rgba(138,43,226,0.06);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 48px rgba(138,43,226,0.12)}
.thumb-wrap{width:100%;height:140px;overflow:hidden}
.thumb{width:100%;height:100%;object-fit:cover;display:block}
.card-body{padding:12px;display:flex;flex-direction:column;gap:8px}
.title{font-size:1rem;color:var(--white)}
.price{color:var(--neon-purple-2);font-size:0.95rem;font-weight:700}
.card-actions{margin-top:auto;display:flex;gap:8px;justify-content:flex-end}

/* Cart drawer */
.cart-drawer{position:fixed;right:16px;top:80px;width:340px;max-height:72vh;background:var(--panel);border:1px solid rgba(138,43,226,0.06);padding:12px;border-radius:10px;box-shadow:0 14px 40px rgba(2,6,23,0.6);display:none;flex-direction:column;z-index:200}
.cart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.cart-items{overflow:auto;max-height:44vh;display:flex;flex-direction:column;gap:8px}
.cart-row{display:flex;gap:8px;align-items:center;padding:8px;border-radius:6px;background:rgba(255,255,255,0.01)}
.cart-thumb{width:56px;height:40px;object-fit:cover;border-radius:4px}
.cart-meta{flex:1}
.cart-name{font-size:.95rem}
.cart-price{font-size:.85rem;color:var(--muted)}
.cart-footer{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.remove{background:rgba(255,0,0,0.08);border:1px solid rgba(255,0,0,0.06);color:#fff;padding:6px 8px;border-radius:6px}

/* Search drawer */
.search-drawer{position:fixed;right:16px;top:80px;width:380px;max-height:80vh;background:var(--panel);border:1px solid rgba(138,43,226,0.06);padding:16px;border-radius:10px;box-shadow:0 14px 40px rgba(2,6,23,0.8);display:flex;flex-direction:column;z-index:200;overflow:hidden}
.search-drawer[aria-hidden="true"]{display:none!important}
.search-drawer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;border-bottom:1px solid rgba(138,43,226,0.06);padding-bottom:12px}
.search-drawer-header h3{color:var(--neon-purple-2);text-shadow:0 0 12px rgba(184,75,255,0.2);font-size:1rem}
.search-drawer-filters{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.filter-btn{background:rgba(138,43,226,0.06);color:var(--white);border:1px solid rgba(138,43,226,0.06);padding:10px 12px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s ease;text-align:left;font-size:0.95rem}
.filter-btn:hover{background:rgba(138,43,226,0.12);border-color:rgba(138,43,226,0.12)}
.filter-btn.active{background:linear-gradient(90deg,var(--neon-purple),var(--neon-purple-2));border-color:rgba(184,75,255,0.3);box-shadow:0 6px 16px rgba(138,43,226,0.14)}
.search-drawer-results{flex:1;overflow-y:auto}
.search-drawer-results .games-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}

footer{padding:18px 5%;border-top:1px solid rgba(138,43,226,0.04);color:var(--muted)}
.footer-inner{display:flex;justify-content:space-between;align-items:center}
.footer-links{color:var(--muted)}

/* Achievemnts */
.achievements-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.achievement-card{background:linear-gradient(180deg, rgba(138,43,226,0.03), rgba(0,0,0,0.08));border:1px solid rgba(138,43,226,0.06);border-radius:10px;padding:12px;display:flex;gap:12px;align-items:center;transition:all .2s ease}
.achievement-card.unlocked{border-color:rgba(184,75,255,0.12);background:linear-gradient(180deg, rgba(138,43,226,0.07), rgba(90,0,214,0.04));box-shadow:0 6px 16px rgba(138,43,226,0.08)}
.achievement-card.locked{opacity:0.5}
.achievement-icon{font-size:2.4rem;min-width:56px;text-align:center}
.achievement-info h4{font-size:0.95rem;color:var(--white)}
.achievement-info p{font-size:0.8rem;color:var(--muted)}

/* Section with discount */
.section-with-discount{display:grid;grid-template-columns:1fr 300px;gap:32px;align-items:start}
.offers-column h2{margin-bottom:18px;color:var(--neon-purple-2);text-shadow:0 0 12px rgba(184,75,255,0.24), 0 0 24px rgba(138,43,226,0.1);font-weight:700}
.discount-column h2{margin-bottom:18px;color:var(--neon-purple-2);text-shadow:0 0 12px rgba(184,75,255,0.24), 0 0 24px rgba(138,43,226,0.1);font-weight:700}

.achievements-discount{background:linear-gradient(135deg, rgba(138,43,226,0.06), rgba(90,0,214,0.03));border:1px solid rgba(184,75,255,0.08);border-radius:12px;padding:20px;text-align:center}
.discount-badge{font-size:3rem;color:var(--neon-purple-2);font-weight:800;text-shadow:0 0 16px rgba(184,75,255,0.2);margin-bottom:12px}
.achievements-discount p{font-size:0.9rem;color:var(--muted);line-height:1.5}

@media(max-width:1000px){.section-with-discount{grid-template-columns:1fr}.discount-column{padding-top:0}}

/* Categories */
.categories-nav{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.category-btn{background:rgba(138,43,226,0.06);color:var(--white);border:1px solid rgba(138,43,226,0.06);padding:10px 16px;border-radius:20px;cursor:pointer;font-weight:600;transition:all .2s ease}
.category-btn:hover{background:rgba(138,43,226,0.12);border-color:rgba(138,43,226,0.12)}
.category-btn.active{background:linear-gradient(90deg,var(--neon-purple),var(--neon-purple-2));border-color:rgba(184,75,255,0.3);box-shadow:0 6px 18px rgba(138,43,226,0.16)}

@media(max-width:640px){.categories-nav{gap:6px}.category-btn{padding:8px 12px;font-size:0.9rem}}




@media(max-width:900px){.search{min-width:180px}.thumb-wrap{height:140px}}
@media(max-width:640px){.header-inner{padding:12px 4%}.main-nav{flex-direction:column;gap:8px;align-items:stretch}.search{width:100%}.games-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:420px){.games-grid{grid-template-columns:1fr}}

@keyframes fadeInUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* end */