:root{
      --bg:#0b0b0c;        /* fundo principal (quase preto) */
      --card:#121214;      /* card escuro */
      --muted:#8a8a8e;     /* cinza texto secundário */
      --text:#ffffff;      /* branco */
      --brand:#ffffff;     /* realce primário (neon branco para combinar com a logo) */
      --accent:#14b8a6;    /* turquesa sutil para estados/hover */
      --danger:#ff5555;    /* cor para destaque de promoção */
}

html,body{
    background:var(--bg); 
    color:var(--text); 
    font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
}

/* Navbar */
.navbar{
    background:rgba(0,0,0,.75); 
    backdrop-filter: blur(8px);
}    

.navbar-brand{
    font-weight:800; 
    letter-spacing:.5px;
}

.logo-img{
    height:40px; 
    width:auto; 
    filter: drop-shadow(0 0 12px rgba(255,255,255,.25));
}

/* Hero */
.hero{
    position:relative; 
    padding:96px 0 60px; 
    background:radial-gradient(1200px 600px at 80% -10%, rgba(255,255,255,.06), transparent), radial-gradient(900px 480px at -10% 10%, rgba(20,184,166,.12), transparent);
}   

.hero h1{
    font-family:Poppins, Inter, sans-serif; font-weight:800; line-height:1.05; letter-spacing:.5px;
}

.tagline{
    color:var(--muted);
}

.neon-script{
    font-family: 'Poppins', cursive; 
    font-weight:300; 
    letter-spacing:3px; 
    text-shadow:0 0 8px rgba(255,255,255,.45),0 0 22px rgba(255,255,255,.25);
}    

/* Filtro */
.filter-bar{
    position:sticky; 
    top:66px; 
    z-index:1030; 
    background:rgba(10,10,11,.8); 
    backdrop-filter: blur(8px); 
    border-bottom:1px solid rgba(255,255,255,.06);
}    

/* Cards */
.product-card{
    background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)); 
    border:1px solid rgba(255,255,255,.08); 
    border-radius:20px; box-shadow:0 10px 30px rgba(0,0,0,.35); 
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; 
    height:100%;
}

.product-card:hover{
    transform: translateY(-4px); 
    box-shadow:0 16px 40px rgba(0,0,0,.45); 
    border-color: rgba(255,255,255,.18);
}   

.product-img{
    width:100%; 
    aspect-ratio: 4/3; 
    object-fit: cover; 
    border-top-left-radius: 20px; 
    border-top-right-radius: 20px; 
    background: #0f0f10;
}
    
.badge-promo{
    background:linear-gradient(90deg, var(--danger), #ff874d); 
    border:none;
}
    
.price{
    font-size:1.35rem; 
    font-weight:800;
}

/* Footer */
footer{
    border-top:1px solid rgba(255,255,255,.08);
}
    
.tiny{
    font-size:.875rem; 
    color:var(--muted);
}

/* Util */
.shadow-soft{
    box-shadow:0 2px 16px rgba(255,255,255,.06);
}
    
.hidden{
    display:none !important;
}

/* Acessibilidade foco */
:focus-visible{
    outline:2px dashed var(--accent); 
    outline-offset:2px;
}