.wpplatform-post-listing {
  --post-listing-heading: var(--school-heading);
  --post-listing-text: var(--school-text);
  --post-listing-primary: var(--school-primary);
  --post-listing-secondary: var(--school-secondary);
  --post-listing-surface: var(--school-surface);
  --post-listing-surface-alt: var(--school-surface-alt);
  --post-listing-border: var(--school-card-border-color);
  --post-listing-card: var(--school-card-background);
  --post-listing-radius: var(--school-card-radius);
  --post-listing-radius-lg: var(--school-radius-large);
  --post-listing-shadow: var(--school-card-shadow);
  color: var(--post-listing-text);
}

.wpplatform-post-listing > * {
  margin-block-start: 0;
}

.wpplatform-post-listing__content {
  padding-block: var(--school-section-padding-y-lg);
  background:
    linear-gradient(90deg, var(--post-listing-surface) 0%, var(--school-background) 52%, var(--post-listing-surface-alt) 100%);
}

.wpplatform-post-listing__columns {
  gap: var(--school-space-6);
  align-items: flex-start !important;
}

.wpplatform-post-listing__main,
.wpplatform-post-listing__sidebar-column {
  min-width: 0;
}

.wpplatform-post-listing__header {
  margin-bottom: var(--school-space-4);
}

.wpplatform-post-listing__eyebrow,
.wpplatform-post-listing__cta-eyebrow {
  margin: 0 0 var(--school-space-1);
  color: var(--post-listing-primary);
  font-size: var(--wp--preset--font-size--caption);
  font-weight: 800;
  text-transform: uppercase;
}

.wpplatform-post-listing__title {
  margin-block-end: 20px !important;
  color: var(--post-listing-heading);
  font-size: var(--wp--preset--font-size--heading-3);
}

.wpplatform-post-listing__description {
  max-width: var(--school-layout-text);
  color: var(--school-text);
}

.wpplatform-post-listing__description > :last-child {
  margin-bottom: 0;
}

.wpplatform-post-listing__grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--school-space-5);
  margin: 0;
  padding: 0;
  list-style: none;
}

.wpplatform-post-listing__grid > li {
  margin: 0;
}

.wpplatform-post-listing__pagination {
  display: flex;
  flex-wrap: wrap;
  gap: var(--school-space-1);
  align-items: center;
  margin-top: var(--school-space-6);
  justify-content: center;
}

.wpplatform-post-listing__pagination .wp-block-query-pagination-previous,
.wpplatform-post-listing__pagination .wp-block-query-pagination-next,
.wpplatform-post-listing__pagination .page-numbers {
  display: inline-grid;
  place-items: center;
  min-width: 2.75rem;
  min-height: 2.75rem;
  margin: 0;
  padding: 0.65rem 0.95rem;
  border: var(--school-card-border-width) solid var(--post-listing-border);
  border-radius: var(--school-radius-pill);
  background: var(--school-background);
  color: var(--post-listing-primary);
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}

.wpplatform-post-listing__pagination .current {
  border-color: var(--post-listing-primary);
  background: var(--post-listing-primary);
  color: var(--school-background);
}

.wpplatform-post-listing__pagination a:hover,
.wpplatform-post-listing__pagination a:focus-visible {
  border-color: var(--post-listing-primary);
  box-shadow: var(--school-shadow-focus);
}

.wpplatform-post-listing__no-results {
  padding: var(--school-space-5);
  border: var(--school-card-border-width) solid var(--post-listing-border);
  border-radius: var(--post-listing-radius);
  background: var(--school-background);
}

.wpplatform-post-listing__cta-section {
  padding-block: var(--school-section-padding-y-lg);
  background: var(--school-background);
}

.wpplatform-post-listing__cta {
  overflow: hidden;
  border-radius: var(--post-listing-radius-lg);
  color: var(--school-background);
  box-shadow: var(--school-shadow-overlay);
}

.wpplatform-post-listing__cta .wp-block-cover__inner-container {
  color: var(--school-background);
}

.wpplatform-post-listing__cta :where(h2, p, .wpplatform-post-listing__cta-eyebrow) {
  color: var(--school-background);
}

.wpplatform-post-listing__cta h2 {
  max-width: 18ch;
  margin-block: 0 var(--school-space-2);
  font-size: var(--wp--preset--font-size--heading-2);
}

.wpplatform-post-listing__cta-layout {
  align-items: center !important;
  gap: var(--school-space-4);
}

.wpplatform-post-listing__cta-actions {
  display: flex;
  justify-content: flex-end;
}

.wpplatform-post-listing__cta .wpplatform-button--outline .wp-block-button__link {
  border: var(--school-button-border-width) solid currentColor;
  background: transparent;
  color: var(--school-background);
}

@media (max-width: 59.9375rem) {
  .wpplatform-post-listing__columns {
    flex-direction: column;
  }

  .wpplatform-post-listing__main,
  .wpplatform-post-listing__sidebar-column {
    flex-basis: 100% !important;
  }

  .wpplatform-post-listing__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@media (max-width: 37.4375rem) {
  .wpplatform-post-listing__content,
  .wpplatform-post-listing__cta-section {
    padding-block: var(--school-section-padding-y-mobile);
  }

  .wpplatform-post-listing__grid {
    grid-template-columns: 1fr;
  }

  .wpplatform-post-listing__cta-actions {
    justify-content: flex-start;
  }
}
