:root{
		  --dj-green:#0f4229;
		  --dj-green-2:#0b3b2e;
		  --dj-text:#0f172a;
		  --dj-muted:#64748b;
		  --dj-border:#e5e7eb;
		  --dj-bg:#ffffff;
		  --dj-soft:#f8fafc;
		  --dj-yellow:#fbbf24;
		}

		.dj-card{
		  display:grid;
		  grid-template-columns: 280px 1fr 260px;
		  gap:16px;
		  background:var(--dj-bg);
		  border:1px solid var(--dj-border);
		  border-radius:16px;
		  padding:16px;
		  box-shadow: 0 8px 30px rgba(2,6,23,.06);
		}

		.dj-card__media{
		  position:relative;
		  border-radius:14px;
		  overflow:hidden;
		  background:var(--dj-soft);
		  min-height:190px;
		}

		.dj-card__link{ display:block; height:100%; }
		.dj-card__img{ width:100%; height:100%;display:block; }

		.dj-badge{
		  position: absolute;
		  top: 12px;
		  left: 12px;
		  padding: 5px 10px;
		  border-radius: 100px;
		  font-size: 13px;
		  font-weight: 800;
		  box-shadow: 0 10px 18px rgba(2, 6, 23, .16);
		  z-index: 2;
		}
		.dj-badge--featured{ background:var(--dj-yellow); color:#111827; }
		.dj-badge--discount{ background:#111827; color:#fff; }

		.dj-plate{
		  position:absolute;
		  left:12px;
		  bottom:12px;
		  background:rgba(255,255,255,.92);
		  border:1px solid rgba(17,24,39,.08);
		  padding:7px 10px;
		  border-radius:10px;
		  font-weight:800;
		  font-size:13px;
		  z-index:2;
		  backdrop-filter: blur(6px);
		}

		.dj-plate-icon{
		  position:absolute;
		  right:12px;
		  bottom:12px;
		  width: 120px;
		  height:auto;
		  z-index:2;
		  opacity:.95;
		}

		.dj-card__info{
		  display:flex;
		  flex-direction:column;
		  gap:12px;
		}

		.dj-top{
		  display:flex;
		  align-items:flex-start;
		  justify-content:space-between;
		  gap:12px;
		}

		.dj-title{
		  font-size:20px;
		  font-weight:900;
		  line-height:1.1;
		}
		.dj-title__link{
		  color:var(--dj-text);
		  text-decoration:none;
		}
		.dj-title__link:hover{ text-decoration:underline; }

		.dj-sub{
		  margin-top:6px;
		  font-size:13px;
		  color:var(--dj-muted);
		  display:flex;
		  flex-wrap:wrap;
		  gap:10px;
		}
		.dj-dot{ position:relative; padding-right:10px; }
		.dj-dot::after{
		  content:"";
		  position:absolute;
		  right:0;
		  top:50%;
		  transform:translateY(-50%);
		  width:4px;height:4px;border-radius:50%;
		  background:#cbd5e1;
		}
		.dj-dot:last-child{ padding-right:0; }
		.dj-dot:last-child::after{ display:none; }

		.dj-smallbrand img{
		  width:48px;
		  height:auto;
		  opacity:.7;
		}

		.dj-specs{
		  display:flex;
		  flex-wrap:wrap;
		  gap:10px;
		}
		.dj-chip{
		    display: inline-flex;
		  align-items: center;
		  gap: 8px;
		  background: var(--dj-soft);
		  border: 1px solid var(--dj-border);
		  color: #0f172a;
		  padding: 1px 7px;
		  border-radius: 500px;
		  font-size: 13px;
		  font-weight: 700;
		}
		.dj-chip img{ display:block; }

		.dj-trust{
		  display:flex;
		  flex-wrap:wrap;
		  gap:14px;
		  font-size:13px;
		  color:var(--dj-muted);
		  margin-top:auto;
		}

		.dj-card__cta{
		  display:flex;
		  flex-direction:column;
		  justify-content:space-between;
		  gap:14px;
		  padding-left:8px;
		  border-left:1px dashed var(--dj-border);
		}

		.dj-price__main{
		  display:flex;
		  align-items:baseline;
		  gap:6px;
		  color:var(--dj-green);
		}
		.dj-currency{ font-weight:900; font-size:16px; }
		.dj-amount{ font-weight:950; font-size:28px; letter-spacing:.2px; }
		.dj-unit{ font-weight:800; font-size:14px; color:var(--dj-muted); }

		.dj-price__meta{
		  margin-top:4px;
		  font-size:13px;
		  color:var(--dj-muted);
		}

		.dj-price__secondary{
		  margin-top:10px;
		  font-size:13px;
		  color:var(--dj-muted);
		}

		.dj-price__strike{
		  margin-top:6px;
		  font-size:13px;
		  color:#94a3b8;
		}

		.dj-actions{
		  display:flex;
		  gap:10px;
		  justify-content:flex-end;
		  flex-wrap:wrap;
		}

		.dj-btn{
		  display: inline-flex;
		    align-items: center;
		    justify-content: center;
		    height: 35px;
		    padding: 0 15px;
		    border-radius: 5px;
		    font-weight: 900;
		    font-size: 14px;
		    text-decoration: none;
		    transition: transform .08s ease, background .12s ease;
		}
		.dj-btn:active{ transform:scale(.98); }

		.dj-btn--primary{
		  background:var(--dj-green);
		  color:#fff;
		}
		.dj-btn--primary:hover{ background:var(--dj-green-2); }

		.dj-btn--ghost{
		  background:#fff;
		  border:1px solid var(--dj-border);
		  color:#0f172a;
		}
		.dj-btn--ghost:hover{ background:var(--dj-soft); }

		/* Responsive */
		@media (max-width: 980px){
		  .dj-card{
		    grid-template-columns: 240px 1fr;
		    grid-template-areas:
		      "media info"
		      "cta cta";
		  }
		  .dj-card__media{ grid-area: media; }
		  .dj-card__info{ grid-area: info; }
		  .dj-card__cta{
		    grid-area: cta;
		    border-left:none;
		    border-top:1px dashed var(--dj-border);
		    padding-left:0;
		    padding-top:14px;
		    flex-direction:row;
		    align-items:center;
		  }
		  .dj-actions{ margin-left:auto; }
		}

		@media (max-width: 640px){
		  .dj-card{
		    grid-template-columns: 1fr;
		    grid-template-areas:
		      "media"
		      "info"
		      "cta";
		  }
		  .dj-card__media{ min-height:210px; }
		  .dj-card__cta{
		    flex-direction:column;
		    align-items:stretch;
		  }
		  .dj-actions{ justify-content:stretch; }
		   
		}