/* Homepage polish: remove accidental whitespace and keep the editorial rhythm tidy. */

main.main-wide {
  padding-bottom: 0;
}

.blog-section {
  margin-bottom: 0;
}

/* Full-bleed homepage bands: center a 100vw band against the viewport.
   Using left:50% plus -50vw was offsetting the band because main itself is centered. */
.email-capture,
.reminder-band {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.email-capture {
  margin-top: 100px;
}

.reminder-band {
  margin-top: 0;
}

/* Five useful permanent destinations fit more naturally than a seasonal nav item. */
.site-nav {
  gap: 20px;
}

.site-nav a {
  font-size: 11px;
  white-space: nowrap;
}

.post-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 44px 26px;
  align-items: start;
}

.post-card,
.post-card:first-child {
  grid-column: auto;
  grid-row: auto;
  min-width: 0;
}

.post-card:first-child h3,
.post-card h3 {
  font-size: 22px;
  line-height: 1.25;
}

/* Give the first story a subtle editorial lead without breaking the grid. */
.post-card:first-child {
  grid-column: span 2;
}

/* No aspect-ratio override here: redesign.css already sets 16/9 for this
   selector, which — unlike the 2/1 this used to say — actually matches one
   of the two hero-image ratios in use (1600x900) and crops far less off
   the other (1536x1024) than 2/1 did. Don't reintroduce a mismatched ratio
   here without checking it against public/images/*.webp dimensions first. */

.post-card:first-child h3 {
  font-size: clamp(27px, 3vw, 34px);
}

/* If the final row contains only one or two posts, let them fill the row naturally. */
.post-grid > .post-card:last-child:nth-child(3n + 2) {
  grid-column: span 2;
}

.site-footer {
  margin-top: 0;
  width: 100%;
  background: #172920;
}

.footer-inner {
  display: grid;
  grid-template-columns: minmax(260px, 1.7fr) repeat(3, minmax(130px, 1fr));
  gap: 46px;
  align-items: start;
  padding-bottom: 42px;
}

.footer-col,
.footer-brand,
.footer-col ul,
.footer-col li {
  background: transparent;
}

.footer-col ul {
  margin: 0;
  padding: 0;
}

.footer-col li {
  margin-bottom: 8px;
}

.footer-copyright {
  margin: 0;
  padding: 22px 20px 26px;
}

@media (max-width: 1050px) {
  .site-nav {
    gap: 13px;
  }
  .site-nav a {
    font-size: 10px;
    letter-spacing: .7px;
  }
}

@media (max-width: 900px) {
  .post-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .post-card:first-child,
  .post-grid > .post-card:last-child:nth-child(3n + 2) {
    grid-column: auto;
  }

  .post-card:first-child .post-card-img {
    aspect-ratio: 3 / 2;
  }

  .footer-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 28px;
  }
}

@media (max-width: 620px) {
  .post-grid {
    display: block;
  }

  .post-card,
  .post-card:first-child {
    margin-bottom: 42px;
  }

  .footer-inner {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .footer-brand {
    padding-bottom: 8px;
  }
}