:root{
  --bg:#0e0e0f;
  --card:#151515;
  --muted:#bfc0c2;
  --gold:#d4af37;
  --accent:#c69c19;
  --glass: rgba(255,255,255,0.04);
}
*{box-sizing:border-box}
body{font-family:'Poppins',sans-serif;margin:0;background:var(--bg);color:#fff;line-height:1.4}
.container{max-width:1100px;margin:0 auto;padding:1rem}
.site-header{background:linear-gradient(180deg,rgba(0,0,0,0.6),transparent);border-bottom:1px solid rgba(255,255,255,0.03)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:0.75rem 0}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:72px;height:72px;object-fit:contain;border-radius:8px}
.brand-text .title{font-size:1.25rem;font-weight:700;color:var(--gold)}
.brand-text .title span{font-weight:300;color:#eee}
.brand-text .tag{font-size:0.85rem;color:var(--muted)}
.nav .cart-btn{background:transparent;border:1px solid rgba(255,255,255,0.06);color:#fff;padding:8px 12px;border-radius:8px;cursor:pointer}
.search-wrap{margin-right:12px}

/* Modern search */
.modern-search form{display:flex;align-items:center;background:rgba(255,255,255,0.03);padding:6px;border-radius:999px;border:1px solid rgba(255,255,255,0.04);gap:8px;transition:box-shadow 180ms ease,background 180ms ease;width:320px}
.modern-search form:focus-within{box-shadow:0 6px 18px rgba(0,0,0,0.6);background:linear-gradient(90deg,rgba(255,255,255,0.02),rgba(255,255,255,0.01))}
.modern-search .search-icon{background:transparent;border:0;color:var(--muted);font-size:14px;cursor:default}
.modern-search input[type="search"]{background:transparent;border:0;color:#fff;padding:8px 6px;outline:none;width:100%}
.modern-search .clear-icon{background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:14px;opacity:0.9}
.modern-search .clear-icon.hidden{opacity:0;pointer-events:none}
.variant-select{color:var(--muted);font-size:0.9rem}
.variant-select select{margin-left:8px;padding:6px;border-radius:6px;background:transparent;color:#fff;border:1px solid rgba(255,255,255,0.04)}
.hero{padding:3.5rem 0;text-align:center}
.hero h1{font-size:2rem;margin:0 0 0.5rem;color:#fff}
.hero p{color:var(--muted);margin:0 0 1rem}
.btn{display:inline-block;padding:10px 18px;border-radius:8px;text-decoration:none;cursor:pointer}
.btn.primary{background:linear-gradient(90deg,var(--gold),#f6d36b);color:#111;font-weight:600}
.products{padding:1.5rem 0}
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.card{background:var(--card);padding:14px;border-radius:12px;border:1px solid rgba(255,255,255,0.03);display:flex;flex-direction:column;gap:10px}
.card .thumb{height:140px;border-radius:8px;background:linear-gradient(180deg,#222,#111);display:flex;align-items:center;justify-content:center;color:var(--muted);font-weight:600}
.card h3{margin:0;font-size:1.05rem}
.card p{margin:0;color:var(--muted);font-size:0.9rem}
.card .price{font-size:1.05rem;color:var(--gold);font-weight:700}
.card .actions{display:flex;gap:8px;align-items:center}
.card button{flex:1;padding:8px 10px;border-radius:8px;border:0;cursor:pointer}
.add-btn{background:var(--accent);color:#111;font-weight:600}
.details-btn{background:transparent;border:1px solid rgba(255,255,255,0.04);color:var(--muted)}
.site-footer{padding:1rem 0;border-top:1px solid rgba(255,255,255,0.03);text-align:center;color:var(--muted)}

.cart-modal{position:fixed;inset:0;display:none;background:linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.7));align-items:flex-end;justify-content:center;padding:2rem}
.cart-modal[aria-hidden="false"]{display:flex}
.cart-panel{background:#0b0b0b;width:100%;max-width:480px;padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,0.04)}
.close{background:transparent;border:0;color:#fff;font-size:1.35rem;float:right;cursor:pointer}
.cart-items{max-height:340px;overflow:auto;margin-top:8px}
.cart-item{display:flex;gap:10px;align-items:center;padding:8px;border-bottom:1px solid rgba(255,255,255,0.03)}
.cart-item .name{flex:1}
.cart-item .qty{min-width:44px;text-align:center}
.cart-footer{display:flex;align-items:center;justify-content:space-between;padding-top:10px}

.cart-summary{margin-top:10px;background:linear-gradient(180deg,transparent,rgba(255,255,255,0.01));padding:10px;border-radius:8px}
.cart-summary .summary-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px dashed rgba(255,255,255,0.03)}
.cart-summary .summary-row:last-child{border-bottom:0}
.cart-summary label{color:var(--muted)}
.cart-summary input[type=checkbox]{margin-right:8px}
.details-btn{background:transparent;border:1px solid rgba(255,255,255,0.04);color:var(--muted);padding:8px 12px;border-radius:8px;cursor:pointer}

/* subtotal riscado quando desconto aplicado */
.strikethrough{text-decoration:line-through;opacity:0.7}
.highlight-total{color:var(--gold);font-weight:800}

/* animações suaves para subtotal/total */
#cartSubtotal, #cartTotal{display:inline-block;transition:transform 220ms ease,opacity 220ms ease,color 220ms ease}
.pulse-total{transform:scale(1.06)}
.cart-summary .summary-row{transition:background-color 220ms ease,transform 220ms ease,opacity 220ms ease}

/* quando desconto aplicado, muda cor de fundo do resumo e suaviza a transição */
.cart-summary.discount-applied{background:linear-gradient(90deg,rgba(212,170,45,0.06),rgba(0,0,0,0.02));box-shadow:0 8px 24px rgba(212,170,45,0.06);transition:background 300ms ease,box-shadow 300ms ease}
.cart-summary.discount-applied .summary-row{background:transparent}

/* responsivo */
@media(max-width:900px){
  .modern-search form{width:220px}
}
@media(max-width:600px){
  .header-inner{gap:8px}
  .brand-text .title{font-size:1rem}
  .hero h1{font-size:1.5rem}
  .modern-search form{width:140px}
}

/* Improved responsiveness */
@media(max-width:900px){
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));}
}

@media(max-width:600px){
  .header-inner{flex-wrap:wrap;align-items:center}
  .brand{width:100%;justify-content:space-between}
  .nav{width:100%;display:flex;justify-content:space-between;margin-top:8px}
  .modern-search form{width:100%;max-width:100%}
  .brand-text{display:none}
  .logo{width:56px;height:56px}
  .hero{padding:2rem 0}
  .card .thumb{height:100px}
  .card{padding:12px}
  .product-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
  .cart-panel{width:100%;max-width:100%;border-radius:12px 12px 0 0;margin:0;padding:12px;height:auto}
  .cart-modal{align-items:flex-end;padding:0}
  .cart-footer{flex-direction:column;align-items:stretch;gap:8px}
  .cart-summary .summary-row{padding:8px 0}
}

/* small tweaks for very small screens */
@media(max-width:380px){
  .modern-search input[type="search"]{font-size:14px}
  .brand .logo{width:48px;height:48px}
}