.blog-nav {
  position: sticky;
  height: var(--nav-height);
  top: var(--nav-height);
  z-index: 1;
}

.blog-index {}

.blog-single {}

.ph-footer {
  background-color: lightblue;
  height: 100px;
}

.push-feature {
  padding-bottom: calc(50% / var(--feat-aspect));
}

.frame-feature {
  max-width: 800px;
  margin: 0 auto;
}

.ph-featured {
  display: flex;
  &::before {
    content: '';
    display: block;
    width: 0;
    height: 0;
    padding-bottom: calc(100% / var(--feat-aspect));
  }
  // background-color: limegreen;
  margin-top: calc(-50% / var(--feat-aspect));
}