/* --- House Ads: base slot wrapper --- */
.ad-slot{
  margin: 18px 0;
}

/* --- Clickable card --- */
.ad-card{
  display: block;
  text-decoration: none;
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
}

/* Hover polish */
.ad-card:hover{
  box-shadow: 0 6px 18px rgba(0,0,0,0.10);
  transform: translateY(-1px);
}

/* Content spacing */
.ad-card__content{
  padding: 14px 16px;
}

/* --- Image sizing (prevents "huge") --- */
.ad-card__media{
  width: 100%;
  max-height: 260px;            /* adjust this */
  overflow: hidden;
  background: #f2f2f2;
}

.ad-card__img{
  width: 100%;
  height: 260px;                /* match max-height */
  object-fit: cover;            /* crop nicely */
  display: block;
}

/* Title and body */
.ad-card__title{
  font-weight: 800;
  font-size: 18px;
  line-height: 1.2;
  margin-bottom: 6px;
  color: #111;
}

.ad-card__body{
  font-size: 14px;
  line-height: 1.45;
  color: #333;
  margin-top: 6px;
  text-align: left;             /* avoids awkward justified look */
}

/* CTA looks like a button */
.ad-card__cta{
  display: inline-block;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.18);
  background: #fff;
  font-weight: 700;
  font-size: 13px;
  color: #111;
}

/* Make CTA pop on hover, while whole card remains clickable */
.ad-card:hover .ad-card__cta{
  background: rgba(0,0,0,0.04);
}

/* Text-only ads: your special style */
.ad-card--text-only{
  padding: 18px 20px;
  border: 1px dashed rgba(0,0,0,0.14);
  background: #fafafa;
}
.ad-card--text-only .ad-card__content{
  padding: 0;
}