.spo-strip{
  width:100%;
  margin-top:var(--spo-margin-top, 0);
  margin-bottom:var(--spo-margin-bottom, 0);
}

.spo-strip__inner{
  background:var(--spo-box-bg, transparent);
  border-radius:var(--spo-box-radius, 0);
  padding:var(--spo-box-padding, 30px);
}

.spo-strip__intro,
.spo-strip__closing{
  width:100%;
}

.spo-strip__intro{
  margin-bottom:24px;
}

.spo-strip__closing{
  margin-top:24px;
}

.spo-strip__grid{
  display:grid;
  grid-template-columns:repeat(var(--spo-columns, 3), minmax(0, 1fr));
  gap:24px;
}

.spo-card-view{
  display:block;
  color:inherit;
  text-decoration:none;
}

.spo-card-view:hover,
.spo-card-view:focus{
  text-decoration:none;
}

.spo-card-view__media{
  display:block;
  overflow:hidden;
  background:#f2f2f2;
  aspect-ratio:1/1;
}

.spo-card-view__media img{
  display:block;
  width:100%;
  height:334px;
  transition:transform .28s ease-in-out;
  object-fit:cover;
}

.spo-card-view:hover .spo-card-view__media img,
.spo-card-view:focus .spo-card-view__media img{
  transform:scale(1.2);
}

.spo-card-view__title{
  display:block;
  margin-top:10px;
  line-height:1.3;
  font-family:"Source Sans Pro", sans-serif;
  font-size:16px;
  font-weight:600;
  color:var(--spo-title-color, #fff);
  text-transform:uppercase;
  text-align:center;
  transition:letter-spacing .28s ease-in-out;
}

.spo-card-view:hover .spo-card-view__title,
.spo-card-view:focus .spo-card-view__title{
  letter-spacing:1px;
}

@media (max-width: 900px){
  .spo-strip__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px){
  .spo-strip__inner{
    padding:20px;
  }
  .spo-strip__grid{
    grid-template-columns:1fr;
  }
}
