.zp-card {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(199, 120, 69, 0.24);
  background:
    radial-gradient(circle at 22% -5%, rgba(255, 255, 255, 0.9), transparent 58%),
    linear-gradient(175deg, rgba(255, 255, 255, 0.98), rgba(255, 235, 212, 0.95));
  box-shadow: 0 30px 65px rgba(23, 8, 3, 0.18);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
  outline: none;
  isolation: isolate;
}

.zp-card::before {
  content: '';
  position: absolute;
  inset: -16px;
  border-radius: 32px;
  background: radial-gradient(circle at 40% 20%, rgba(255, 210, 170, 0.5), transparent 65%);
  filter: blur(28px);
  opacity: 0;
  transition: opacity .4s ease;
  z-index: -1;
}

.zp-card::after {
  content: '';
  position: absolute;
  inset: 10px;
  border-radius: 20px;
  border: 1px dashed rgba(247, 165, 69, 0.35);
  opacity: 0;
  transition: opacity .25s ease;
}

.zp-card:hover,
.zp-card:focus-visible {
  transform: translateY(-5px);
  border-color: rgba(199, 120, 69, 0.5);
  box-shadow: 0 45px 95px rgba(15, 4, 1, 0.28);
}

.zp-card:hover::after,
.zp-card:focus-visible::after {
  opacity: 1;
}

.zp-card:hover::before,
.zp-card:focus-visible::before {
  opacity: 1;
}
.zp-card__top{position:relative;}
.zp-card__img{
  width:100%;
  height:270px;
  object-fit:cover;
  filter:saturate(1.08) contrast(1.02);
  opacity:.92;
  margin-bottom: 0px !important;
}
.zp-card__img--placeholder{
  height:270px;
  background:
    radial-gradient(circle at 20% 15%, rgba(242, 92, 60, 0.32), transparent 60%),
    linear-gradient(135deg, #fff7ef 0%, #ffe6cf 100%);
}

/* this needs to be 220px height for the placeholder image */
.zp-card__top .zp-card__img--placeholder{
  height:220px;
  background:
    linear-gradient(135deg,#faf0f2 0%,#f3f3f6 100%);
}
.zp-grid-4 .zp-card__top .zp-card__img,
.zp-grid-4 .zp-card__top .zp-card__img--placeholder{
  height:220px;
}
.zp-card__glow{display:none}
.zp-card__body{padding:24px 24px 26px;background:rgba(255,255,255,0.6);border-radius:0 0 24px 24px}
.zp-card__meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.zp-card__chip{
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--zp-bone-2);
  padding:8px 16px;
  border-radius:999px;
  border:1px solid rgba(199, 120, 69, 0.35);
  background:rgba(255,255,255,.85);
  box-shadow:0 8px 16px rgba(40,12,5,.12);
}
.zp-card__titleRow{display:grid;gap:4px}
.zp-card__sub{color:var(--zp-muted);font-size:.88rem;text-transform:uppercase;letter-spacing:.16em}
.zp-card__p{margin:12px 0 0;color:var(--zp-muted);max-width:70ch;line-height:1.75}
.zp-card__cta{margin-top:18px}

@media (max-width:1024px){
  .zp-card{
    border-radius:24px;
  }
}

@media (max-width:900px){
  .zp-grid-4{
    grid-template-columns:1fr !important;
    gap:var(--space-5);
  }
}

@media (max-width:768px){
  .zp-card{
    border-radius:24px;
    margin-bottom:var(--space-4);
    box-shadow:0 20px 45px rgba(40,12,5,.12);
  }
  .zp-card__body{
    padding:var(--space-5);
  }
  .zp-grid {
    width: 100% !important;
  }
  .zp-card__img,
  .zp-grid-4 .zp-card__top .zp-card__img{
    height:220px;
  }
}

@media (max-width:520px){
  .zp-card{
    border-radius:28px;
  }
  .zp-card__body{
    padding:var(--space-4);
  }
  .zp-card__img,
  .zp-grid-4 .zp-card__top .zp-card__img{
    height:200px;
  }
  .zp-grid {
    width: 100% !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .zp-card{transition:none}
}