*{box-sizing:border-box}
:root{
  --bg:#0b0d10; --panel:#11151a; --card:#171c22; --muted:#9aa4af;
  --text:#e9eef5; --brand:#8ec5ff; --brand-2:#a1ffd6; --line:#242b33;
}
html,body{margin:0;padding:0;font-family:'Inter',system-ui,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}

.container{width:min(1100px,92%);margin:0 auto}
.narrow{width:min(760px,92%)}
.section{padding:64px 0}
.section.muted{background:linear-gradient(180deg,transparent,rgba(255,255,255,0.02))}

.site-header{position:sticky;top:0;backdrop-filter:saturate(120%) blur(10px);background:rgba(11,13,16,0.6);border-bottom:1px solid var(--line);z-index:30}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.logo{font-weight:800;text-decoration:none;color:var(--text);font-size:20px;letter-spacing:.3px}
.logo span{color:var(--brand)}
.nav a{color:var(--muted);text-decoration:none;margin:0 10px}
.nav a:hover{color:var(--text)}
.cart-btn{background:var(--card);color:var(--text);border:1px solid var(--line);padding:8px 12px;border-radius:999px;cursor:pointer;display:flex;align-items:center;gap:8px}
.badge{background:var(--brand);color:#001b36;padding:2px 8px;border-radius:999px;font-weight:700}

.hero{border-bottom:1px solid var(--line);background:radial-gradient(80% 120% at 20% 0%, rgba(142,197,255,.15), transparent 60%),radial-gradient(80% 120% at 80% 0%, rgba(161,255,214,.12), transparent 60%)}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:24px;padding:40px 0}
.hero-copy h1{font-size:44px;line-height:1.1;margin:0 0 10px}
.hero-copy p{color:var(--muted);margin:0 0 18px}
.hero-cta{display:flex;gap:12px}
.hero-art{height:280px;border:1px dashed var(--line);border-radius:20px;background:
  linear-gradient(135deg,rgba(142,197,255,.14),transparent 40%),
  linear-gradient(335deg,rgba(161,255,214,.14),transparent 40%),
  radial-gradient(50% 120% at 50% 100%,rgba(255,255,255,.05),transparent 60%)
}
.btn{padding:10px 16px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);text-decoration:none;display:inline-block;cursor:pointer}
.btn.primary{background:linear-gradient(180deg,var(--brand),#66b6ff);border:none;color:#00264a}
.btn.ghost{background:transparent}
.btn.full{width:100%}

.grid{display:grid;gap:16px}
.cat-grid{grid-template-columns:repeat(4,1fr)}
.cat-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;text-decoration:none;color:var(--text);cursor:pointer;transition:.2s transform}
.cat-card:hover{transform:translateY(-2px)}
.cat-art{height:120px;border-radius:12px;border:1px dashed var(--line);background:radial-gradient(80% 120% at 50% 70%,rgba(255,255,255,.05),transparent)}
.cat-art.ganesh{background-image:radial-gradient(80% 120% at 30% 70%,rgba(142,197,255,.12),transparent)}
.cat-art.buddha{background-image:radial-gradient(80% 120% at 70% 30%,rgba(161,255,214,.12),transparent)}
.cat-art.vishnu{background-image:radial-gradient(80% 120% at 30% 30%,rgba(255,200,150,.12),transparent)}
.cat-art.shiva{background-image:radial-gradient(80% 120% at 70% 70%,rgba(200,150,255,.12),transparent)}

.catalog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.filters{display:flex;gap:10px;align-items:center}
select,input[type=search]{background:var(--panel);color:var(--text);border:1px solid var(--line);padding:10px 12px;border-radius:12px}

.product-grid{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
/*.thumb{height:160px;background:linear-gradient(180deg,rgba(255,255,255,.04),transparent),radial-gradient(60% 100% at 50% 100%,rgba(142,197,255,.08),transparent);display:flex;align-items:end;justify-content:end;padding:8px}*/
.thumb {
  width: 100%;                         /* Make container full width */
  aspect-ratio: 1 / 1;                  /* Square image area (adjustable) */
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;

  display: flex;
  align-items: end;
  justify-content: end;
  padding: 8px;

  background-image:
    linear-gradient(180deg,rgba(255,255,255,.04),transparent),
    radial-gradient(60% 100% at 50% 100%,rgba(142,197,255,.08),transparent);
}
.tag{font-size:12px;background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:999px;padding:4px 8px;color:var(--muted)}
.card-body{padding:12px;display:flex;flex-direction:column;gap:8px}
.price-row{display:flex;align-items:center;justify-content:space-between}
.price{font-size:14px}
.small{font-size:12px;color:var(--muted)}
.muted-text{color:var(--muted)}

.site-footer{border-top:1px solid var(--line);padding:24px 0;background:rgba(255,255,255,.02)}
.footer-inner{display:flex;align-items:center;justify-content:space-between}
h2{margin:0 0 14px}

.modal{border:none;border-radius:16px;padding:0;max-width:900px;background:transparent}
.modal-card{display:grid;grid-template-columns:1fr 1.1fr;gap:0;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.modal-img{width:100%;height:100%;object-fit:cover;background:radial-gradient(60% 100% at 50% 100%,rgba(161,255,214,.1),transparent)}
.modal-body{padding:18px}
.meta-row{display:flex;gap:8px;margin:8px 0 16px}
.modal-close{position:absolute;right:10px;top:10px;border:none;background:transparent;color:var(--muted);font-size:18px;cursor:pointer}

.cart{position:fixed;right:-420px;top:0;width:380px;height:100vh;background:var(--panel);border-left:1px solid var(--line);transition:right .25s ease;z-index:40;display:flex;flex-direction:column}
.cart.open{right:0}
.backdrop{position:fixed;inset:0;background:rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .2s;z-index:35}
.backdrop.show{opacity:1;pointer-events:auto}
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:14px;border-bottom:1px solid var(--line)}
.icon-btn{background:transparent;border:1px solid var(--line);border-radius:10px;color:var(--text);padding:6px 10px;cursor:pointer}
.cart-items{flex:1;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:10px}
.cart-item{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px}
.cart-foot{padding:14px;border-top:1px solid var(--line);background:var(--card)}
.totals{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}

@media (max-width: 980px){
  .hero-inner{grid-template-columns:1fr}
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .cat-grid{grid-template-columns:repeat(2,1fr)}
  .modal-card{grid-template-columns:1fr}
  .cart{width:92vw}
}
