sw-in-grid-content {
  grid-column: span 2;
  grid-row: span 2;
}
@media (max-width: 1024px) {
  sw-in-grid-content {
    grid-row: span unset;
    aspect-ratio: 4/5;
  }
}
sw-in-grid-content .promo-card {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 250px;
  padding: var(--promo-tile-padding) !important;
}
@media (max-width: 1024px) {
  sw-in-grid-content .promo-card {
    padding: calc(var(--promo-tile-padding) * var(--promo-tile-responsive-modifier));
  }
}
sw-in-grid-content .promo-card [slot=media] > img, sw-in-grid-content .promo-card [slot=media] > video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
sw-in-grid-content .promo-card [slot=text] {
  position: absolute;
  bottom: var(--promo-tile-padding);
  left: var(--promo-tile-padding);
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  height: 100%;
  width: 100%;
}
@media (max-width: 1024px) {
  sw-in-grid-content .promo-card [slot=text] {
    bottom: calc(var(--promo-tile-padding) * var(--promo-tile-responsive-modifier));
    left: calc(var(--promo-tile-padding) * var(--promo-tile-responsive-modifier));
    width: unset;
  }
}
sw-in-grid-content .promo-card [slot=text].light-infill a, sw-in-grid-content .promo-card [slot=text].light-infill h3, sw-in-grid-content .promo-card [slot=text].light-infill h5, sw-in-grid-content .promo-card [slot=text].light-infill p {
  color: white;
}
sw-in-grid-content .promo-card [slot=text].light-infill a::before {
  background: white;
}
sw-in-grid-content .promo-card [slot=text].dark-infill a, sw-in-grid-content .promo-card [slot=text].dark-infill h3, sw-in-grid-content .promo-card [slot=text].dark-infill h5, sw-in-grid-content .promo-card [slot=text].dark-infill p {
  color: black;
}
sw-in-grid-content .promo-card [slot=text].dark-infill a::before {
  background: black;
}
sw-in-grid-content .promo-card [slot=text] a {
  position: relative;
  transition: all 0.5s;
}
sw-in-grid-content .promo-card [slot=text] a::before {
  content: "";
  position: absolute;
  height: 2px;
  width: 0;
  bottom: -4px;
  left: 0;
  transition: all 0.5s;
}
sw-in-grid-content .promo-card [slot=text] a:hover {
  transition: all 0.5s;
}
sw-in-grid-content .promo-card [slot=text] a:hover::before {
  transition: all 0.5s;
  width: 100%;
}
sw-in-grid-content .promo-card [slot=text] h3, sw-in-grid-content .promo-card [slot=text] h5, sw-in-grid-content .promo-card [slot=text] a, sw-in-grid-content .promo-card [slot=text] p {
  padding: 0;
  margin: 0 0 var(--promo-tile-item-spacing) 0;
  font-family: var(--font-base);
}
@media (max-width: 1024px) {
  sw-in-grid-content .promo-card [slot=text] h3, sw-in-grid-content .promo-card [slot=text] h5, sw-in-grid-content .promo-card [slot=text] a, sw-in-grid-content .promo-card [slot=text] p {
    margin: 0 0 calc(var(--promo-tile-item-spacing) * var(--promo-tile-responsive-modifier)) 0;
  }
}
sw-in-grid-content .promo-card [slot=text] h5 {
  font-size: var(--promo-tile-secondary-title-size);
}
@media (max-width: 1024px) {
  sw-in-grid-content .promo-card [slot=text] h5 {
    font-size: calc(var(--promo-tile-secondary-title-size) * var(--promo-tile-responsive-modifier));
  }
}
sw-in-grid-content .promo-card [slot=text] h3 {
  font-size: var(--promo-tile-primary-title-size);
}
@media (max-width: 1024px) {
  sw-in-grid-content .promo-card [slot=text] h3 {
    font-size: calc(var(--promo-tile-primary-title-size) * var(--promo-tile-responsive-modifier));
  }
}
sw-in-grid-content .promo-card [slot=text] p, sw-in-grid-content .promo-card [slot=text] a {
  font-size: var(--promo-tile-text-size);
}
@media (max-width: 1024px) {
  sw-in-grid-content .promo-card [slot=text] p, sw-in-grid-content .promo-card [slot=text] a {
    font-size: calc(var(--promo-tile-text-size) * var(--promo-tile-responsive-modifier));
  }
}