/* Give chronological listings room without turning excerpts into long lines. */
.tn-listing-header,
.tn-post-list {
  max-width: 900px !important;
}

.tn-listing-header .wp-block-search {
  margin-left: 0 !important;
}

/* Align archive titles and descriptions with the listing's left edge. */
.tn-listing-header > :where(:not(.wp-block-search)) {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Keep one divider between cards while preserving the existing border space. */
.tn-post-list .wp-block-post-template > li:not(:last-child) > .tn-post-list-item:last-child {
  border-bottom-color: transparent;
}

@media (min-width: 721px) {
  .tn-post-list-item:has(.tn-post-list-image) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(190px, 23vw, 230px);
    grid-template-rows: auto auto auto;
    column-gap: clamp(1.25rem, 3vw, 2rem);
    align-items: start;
  }

  /* WordPress constrained groups otherwise shrink grid children to their content. */
  .tn-post-list-item:has(.tn-post-list-image) > * {
    justify-self: stretch;
    width: auto;
    max-width: none;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .tn-post-list-item:has(.tn-post-list-image)::after {
    display: none;
  }

  .tn-post-list-item:has(.tn-post-list-image) .wp-block-post-title {
    grid-row: 1;
    grid-column: 1 / -1;
  }

  .tn-post-list-item:has(.tn-post-list-image) .tn-post-list-categories {
    grid-row: 2;
    grid-column: 1 / -1;
  }

  .tn-post-list-item:has(.tn-post-list-image) .tn-post-list-image {
    grid-row: 3;
    grid-column: 2;
    float: none;
    width: 100% !important;
    height: auto;
    aspect-ratio: 16 / 9;
    margin: 0 0 1rem !important;
  }

  .tn-post-list-item:has(.tn-post-list-image) .wp-block-post-excerpt {
    grid-row: 3;
    grid-column: 1;
    max-width: none;
  }
}

@media (max-width: 720px) {
  .tn-post-list-item .tn-post-list-image {
    float: none;
    width: 100% !important;
    max-width: none;
    height: auto;
    aspect-ratio: 16 / 9;
    margin-top: 0;
    margin-right: 0 !important;
    margin-bottom: 0.85rem;
    margin-left: 0 !important;
  }
}
