.PostCard {
  aspect-ratio: 2/1;
  height: 100%;
  position: relative;
  padding: 0 var(--size-default);
  --size-border-width: 0.25rem;
  /* outline: 1px solid white; */
}
@supports (font-size: clamp(1.25rem, 0.7rem + 8.5cqw, 3.5rem)) {
  .PostCard {
    container-type: inline-size;
    container-name: postcard;
    /* --font-size-large: clamp(1.25rem, 0.7rem + 4.5cqw, 3.5rem); */
  }
}

.PostCard-title {
  font-size: var(--font-size-large);
  font-weight: 900;
  line-height: 1;
  text-shadow: var(--text-shadow);
}
.PostCard .back {
  transform: translateX(calc(-100% + var(--size-border-width)));
  transition: transform 250ms var(--elastic-easing);
}

.PostCard:hover .back {
  transform: translateX(0);
}
.PostCard:hover a {
  text-decoration-color: var(--card-border-color);
}

.PostCard a {
  color: var(--link);
  text-decoration-color: var(--link-border);
  display: inline-flex;
  transition: text-decoration-color 250ms var(--elastic-easing);
}
.PostCard a:hover {
  text-decoration-color: var(--link-border);
}
.PostCard a:visited {
  color: var(--link);
}

.PostCard-time {
  line-height: var(--line-height-narrow);
  padding-block-start: var(--size-xsmall);
  font-size: var(--font-size-small);
  /* text-align: right; */
}
.PostCard-meta {
  text-align: left;
  font-size: var(--font-size-small);
  /* border-block-start: var(--size-border-width) solid
    var(--card-border-color, var(--base-border)); */
}
.PostCard-description {
  font-weight: 200;
  text-wrap: balance;
  color: var(--text-color);
  padding: 0 var(--size-l1) 0 var(--size-default);
}

.PostCard-logo {
  position: absolute;
  bottom: 0;
  right: 0;
  height: auto;
  width: 12%;
  border-block-start: 1px solid var(--card-border-color);
  border-inline-start: 1px solid var(--card-border-color);
  transition: transform 250ms var(--elastic-easing);
}
.PostCard:hover .PostCard-logo {
  transform: translateX(100%);
}

.PostCard-author {
  display: inline-block;
  font-weight: 600;
}

.PostCard-time {
  font-variant-numeric: oldstyle-nums;
  display: inline-block;
}
.PostCard-tags {
  display: flex;
  gap: var(--size-small);
}
.PostCard-count {
  font-weight: 200;
}

.PostCard > * {
  z-index: 1;
}

.PostCard > svg {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 0;
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: none;
}

.PostCard-tags,
.PostCard-series,
.PostCard-nav {
  padding-block: var(--size-small);
  margin-block-end: var(--size-small);
  font-size: var(--font-size);
  font-variant-caps: all-small-caps;
  color: var(--text-color);
  font-weight: 600;
}
.PostCard-date {
  padding-block: var(--size-small);
  margin-block-end: var(--size-small);
  font-size: var(--font-size);
  color: var(--text-color);
  font-weight: 200;
}

.PostCard-categories {
  /* border-block-end: var(--size-border-width) solid
    var(--card-border-color, var(--base-border)); */
  padding: 0 var(--size-l1) 0 var(--size-default);
}
.PostCard-header {
  transition: transform 250ms var(--elastic-easing);
  margin: auto 0;
  display: grid;
  /*grid-template-rows: 1fr 1fr;*/
}
