/* DDHQ Grid Featured Pages 1.3.0
 * ARTICLE-CARD-ONLY CSS.
 * Ordinary Infinite Grid deal cards are never restyled by this companion plugin.
 */
.ddhq-ig-article-card{
  overflow:hidden;
}
.ddhq-ig-article-card .ddhq-ig-article-media{
  background:#fff;
  position:relative;
}
.ddhq-ig-article-card .ddhq-ig-article-image{
  object-fit:cover;
}

/* Article labels now use the same corner-to-corner diagonal ribbon pattern as
 * the homepage percentage-off ribbons instead of a pill badge. */
.ddhq-ig-article-card .ddhq-ig-article-label{
  position:absolute;
  z-index:7;
  top:18px;
  left:-36px;
  width:126px;
  padding:7px 0;
  margin:0;
  border-radius:0;
  transform:rotate(-45deg);
  transform-origin:center;
  background:#a7193f;
  color:#fff;
  -webkit-text-fill-color:#fff;
  text-align:center;
  font:900 11px/15px Arial,Helvetica,sans-serif;
  letter-spacing:.3px;
  text-transform:uppercase;
  box-shadow:0 2px 5px rgba(0,0,0,.14);
  white-space:nowrap;
  pointer-events:none;
}

/* Empty native-size price row keeps article-card geometry aligned with a normal
 * deal card without showing a fake price or excerpt. */
.ddhq-ig-article-card .ddhq-ig-article-spacer{
  visibility:hidden !important;
}

/* IMPORTANT: the article CTA intentionally has NO custom background, gradient,
 * radius, shadow, font or padding here. It already carries the native
 * .ddhq-ig-deal-button class, so the live homepage grid itself supplies the
 * exact button appearance and color. */
.ddhq-ig-article-card .ddhq-ig-article-button{
  margin-top:auto !important;
}

@media(max-width:680px){
  .ddhq-ig-article-card .ddhq-ig-article-label{
    top:15px;
    left:-34px;
    width:116px;
    padding:6px 0;
    font-size:9px;
    line-height:13px;
  }
}
