/**
 * @file
 * Visual styles for Bartik's featured bottom component.
 */

.featured-bottom {
  border-top: 1px solid var(--gray-600);
  background: var(--gray-300);
}
.featured-bottom .container-fluid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 1rem;
}

@media (min-width: 560px) {
  .featured-bottom .container-fluid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
.featured-bottom .block__title {
  margin-bottom: 0.5rem;
  text-align: center;
  color: #000;
  text-shadow: 2px 2px 0 var(--red);
  font-size: 1rem;
}