/**
 * Big News
 * Note: we need something for labels "outside the grid" but
 * need to "line up with the grid".
 */

section.big-news {
  padding: 0;
}

.big-news .latest {
  margin: 0;
  padding: 15px 15px 0;
}

.big-news .grid {
  padding: 15px;
  grid-template-columns: 1fr;
}

.big-news .h1 {
  font-size: 2rem;
  text-align: center;
  align-self: center;
}

@media (min-width: 768px) {
  .big-news .h1 {
    font-size: 2.5rem;
  }
}

@media (min-width: 1140px) {
  .big-news .h1 {
    font-size: 3rem;
  }
}

.big-news h3,
.big-news .h3 {
  font-size: large;
}

.big-news figcaption {
  padding: 10px 15px 0;
}

.big-news figure:last-child {
  /* fix if there is no grid */
  padding-bottom: 15px;
}

.big-news .featured .package {
  padding: 15px 0 0;
}

@media (min-width: 680px) {
  .big-news .grid {
    grid-template-columns: repeat(3, 1fr);
  }
}