/* Keep listings compact: Gutenberg's inherited block gap must not become row gap. */
.tn-listing-header,
.tn-post-list {
  max-width: 900px !important;
}

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

.tn-listing-header > :where(:not(.wp-block-search)) {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.tn-post-list .wp-block-post-template > li:not(:last-child) > .tn-post-list-item:last-child {
  border-bottom-color: transparent;
}

.tn-post-list-item {
  padding-top: clamp(1rem, 1.45vw, 1.2rem);
  padding-bottom: clamp(0.7rem, 1vw, 0.9rem);
}

.tn-post-list-item > :where(
  .wp-block-post-title,
  .tn-post-list-categories,
  .wp-block-post-excerpt,
  .tn-post-list-image
) {
  margin-block-start: 0 !important;
}

.tn-post-list-item > .wp-block-post-title {
  margin-bottom: 0.25rem;
}

.tn-post-list-item > .tn-post-list-categories {
  margin-bottom: 0.65rem;
}

.tn-post-list-item > .wp-block-post-excerpt {
  margin-bottom: 0;
}

@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);
    row-gap: 0;
    align-items: start;
  }

  .tn-post-list-item > * {
    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 !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;
  }
}