.Card {
  overflow: hidden;
  background-color: color('white');
  box-shadow: shadow();

  + .Card {
    margin-top: spacing(loose);
  }

  @include page-content-when-not-fully-condensed {
    border-radius: border-radius();
  }
}

.subdued {
  background-color: color('sky', 'lighter');
}

.Header {
  padding: spacing() spacing() 0;

  @include page-content-when-not-fully-condensed {
    padding: spacing(loose) spacing(loose) 0;
  }
}

.Section {
  padding: spacing();

  @include page-content-when-not-fully-condensed {
    padding: spacing(loose);
  }

  + .Section {
    border-top: border-width() solid color('sky');
  }
}

.Section-fullWidth {
  padding: spacing(loose) spacing(none);
}

.Section-subdued {
  background-color: color('sky', 'lighter');
}

.SectionHeader {
  padding-bottom: spacing(tight);

  .Section-fullWidth & {
    padding-left: spacing();
    padding-right: spacing();

    @include page-content-when-not-fully-condensed {
      padding-left: spacing(loose);
      padding-right: spacing(loose);
    }
  }
}

.Footer {
  display: flex;
  justify-content: flex-end;
  padding: 0 spacing() spacing();

  @include page-content-when-not-fully-condensed {
    padding: 0 spacing(loose) spacing(loose);
  }
}