:root{
  --accent:#111827;
  --accent-2:#198754;
}
body{font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
.hero img{object-fit:cover;width:100%}
.section-title{font-weight:700}
.section-lead{color:#6c757d}
.card .card-img-top{height:320px;object-fit:cover}
footer{color:#6c757d}

/* Hero text/card background */
.hero { min-height: 56vh; }
.hero .hero-card{
  background: rgba(255,255,255,0.33);       /* svijetla prozirna pozadina */
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 1rem;


  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
  backdrop-filter: blur(6px);               /* staklasti efekt (podržani browseri) */
  -webkit-backdrop-filter: blur(6px);
  max-width: 880px;
  margin-inline: auto;
}
@media (max-width: 768px){
  .hero .hero-card{
    background: rgba(255,255,255,0.33);
    padding: 1.25rem 1rem !important;
    border-radius: .85rem;
    
  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
  backdrop-filter: blur(6px);               /* staklasti efekt (podržani browseri) */
  -webkit-backdrop-filter: blur(6px);    
  }
}

/* Product meta badges ispod slike */
.product-card .card-meta { border-top: 1px solid #f1f3f5; }
.product-card .badge-soft {
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  color: #495057;
  padding: .35rem .6rem;
  font-weight: 600;
}
.product-card .badge-price {
  background: #eaf7ea;
  border: 1px solid #cde9cd;
  color: #2f7a2f;
  padding: .35rem .6rem;
  font-weight: 700;
}
.product-card .badge-soft i,
.product-card .badge-price i { opacity: .8; }