/* Landing-only campaign presentation, independently implemented from the
   rendered catalogue contract in KATANO App a71ca4e. No runtime or API imports.
   Keep this layer after the landing's legacy card overrides. */
.campaign-card.hero-card,
.collage-card .campaign-card {
  --campaign-card-bg: var(--app-card);
  --campaign-card-pill: #2c2c2c;
  --campaign-card-width: min(328px, calc(100vw - 40px));
  box-sizing: border-box;
  width: var(--campaign-card-width);
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 16px;
  background: var(--campaign-card-bg);
  box-shadow: none;
  overflow: hidden;
  color: #ededed;
  text-align: left;
  letter-spacing: 0;
}
.collage-card .campaign-card { --campaign-card-width: 330px; }
.campaign-card > .campaign-art,
.hero-card.campaign-card > .campaign-art,
.collage-card .campaign-card > .campaign-art {
  position: relative;
  height: auto;
  aspect-ratio: 41 / 22;
  border: 0;
  border-radius: 16px 16px 0 0;
  background: #202020;
  overflow: hidden;
}
.campaign-card > .campaign-art::after { background: none; box-shadow: inset 0 0 0 1px #ffffff16; }
.campaign-card .campaign-art > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 10%;
  transition: transform 450ms cubic-bezier(.22,1,.36,1);
}
.campaign-card .campaign-art.is-saved-crop { background:#141518; }
.campaign-card .campaign-art.is-saved-crop > img { object-fit:contain; object-position:center; transform:none; }
.campaign-card .campaign-info,
.hero-card.campaign-card .campaign-info,
.collage-card .campaign-info {
  box-sizing: border-box;
  display: grid;
  grid-template-rows: 28px 22px 28px 4px;
  align-content: start;
  row-gap: 10px;
  height: 136px;
  padding: 12px;
}
.campaign-card .campaign-topline {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  height: 28px;
  color: #e0e0e0;
  font-size: 12px;
  font-weight: 500;
  line-height: 14px;
  white-space: nowrap;
}
.campaign-card .campaign-owner {
  display: inline-flex;
  align-items: center;
  flex: 0 1 auto;
  gap: 6px;
  min-width: 0;
  max-width: 64%;
  color: inherit;
  font: inherit;
}
.campaign-card .campaign-company-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.campaign-card .campaign-publisher-mark { display:block; width:22px; height:22px; flex:0 0 22px; border-radius:6px; object-fit:contain; background:#272727; }
.campaign-card .campaign-verified { display:inline-flex; width:16px; height:16px; flex:none; margin-left:-2px; color:#ffcd63; }
.campaign-card .campaign-verified svg { width:100%; height:100%; }
.campaign-card .campaign-state { overflow:hidden; text-overflow:ellipsis; font-size:12px; font-weight:400; line-height:14px; color:#969696; }
.campaign-card .campaign-state::before { content:'·'; margin-right:5px; }
.campaign-card .campaign-socials { display:flex; align-items:center; flex:none; gap:0; margin-left:auto; padding-left:6px; }
.campaign-card .campaign-social { display:grid; place-items:center; box-sizing:border-box; width:28px; height:28px; margin-left:-4px; border:2px solid var(--campaign-card-bg); border-radius:50%; color:#d1d1d1; background:var(--campaign-card-pill); }
.campaign-card .campaign-social svg { display:block; width:15px; height:15px; }
.campaign-card .campaign-info h3,
.hero-card.campaign-card .campaign-info h3,
.collage-card .campaign-info h3 {
  min-height: 0;
  margin: 0;
  overflow: hidden;
  color: #ebebeb;
  font-size: 17px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: -.18px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.campaign-card .campaign-stats { display:flex; align-items:center; gap:6px; min-width:0; height:28px; margin:0; white-space:nowrap; }
.campaign-card .campaign-budget { margin-right:auto; color:#ededed; font-size:12px; font-weight:600; line-height:18px; }
.campaign-card .campaign-budget small { color:#a4a4a4; font-size:12px; font-weight:400; }
.campaign-card .campaign-budget.is-pending { color:#ededed; font-size:12px; font-weight:600; }
.campaign-card .campaign-participants { display:inline-flex; align-items:center; gap:3px; padding:3px 6px; border-radius:20px; background:#2d2d2d; color:#eee; font-size:12px; line-height:18px; }
.campaign-card .campaign-participants svg { width:12px; height:12px; }
.campaign-card .campaign-rate { display:inline-flex; align-items:center; gap:2px; padding:4px 8px; border-radius:20px; background:#0b4436; color:#33d19a; font-size:12px; font-weight:600; line-height:18px; }
.campaign-card .campaign-rate small { font-size:12px; font-weight:500; }
.campaign-card .campaign-rate.is-pending { color:#b1b1b1; background:#2b2b2b; font-size:11px; font-weight:600; }
.campaign-card .campaign-progress { height:4px; margin:0; border-radius:8px; background:var(--campaign-card-pill); overflow:hidden; }
.campaign-card .campaign-progress > span { display:block; width:var(--campaign-progress); height:100%; border-radius:inherit; background:#f78526; }
.campaign-card .campaign-progress.is-unavailable > span { display:none; }
.campaign-card .campaign-preview-badge { position:absolute; left:12px; top:12px; padding:4px 7px; border:1px solid #ffffff24; border-radius:5px; background:#141414ce; color:#ededed; font-size:10px; font-weight:650; line-height:12px; letter-spacing:.65px; }
@media (hover:hover) and (pointer:fine) {
  .campaign-card:hover .campaign-art:not(.is-saved-crop) > img { transform:scale(1.025); }
}
@media (prefers-reduced-motion:reduce) {
  .campaign-card .campaign-art > img { transition:none; }
  .campaign-card:hover .campaign-art:not(.is-saved-crop) > img { transform:none; }
}

@media(max-width:650px) {
  .hero-card.campaign-card .campaign-info h3 {font-size:15px;}
  .campaign-card .campaign-budget,.campaign-card .campaign-budget small {font-size:11px;}
  .campaign-card .campaign-rate {font-size:11px;padding:4px 6px;}
  .campaign-card .campaign-rate small {font-size:11px;}
}