.hero{
  min-height: 92vh;
  display:grid;
  align-items:center;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,.62)),
    url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?q=80&w=2400")
      center/cover no-repeat;
  color:#fff;
}

.hero-inner{
  padding-top: 110px; /* keeps text clear of fixed header */
  padding-bottom: var(--s6);
}

.hero .lede{ color: rgba(255,255,255,.82); }

.featured-img{
  aspect-ratio: 4 / 3;
  object-fit: cover;
  width: 100%;
}

.content{
  background: #f6f7f9;
  padding: 90px var(--gutter);
}

.spacer{ height: 1200px; }