.archive-list--column {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: var(--space-md);
  padding: var(--space-lg) var(--space-md);
  margin: 0 auto;
  container-type: inline-size;
  gap: var(--space-md);
  @media (max-width: 1100px) {
    grid-template-columns: 1fr 1fr;
  }
  @media (max-width: 700px) {
    grid-template-columns: 1fr;
  }
}
.column__block-link {
  display: block;
  text-decoration: none;
  color: inherit;
  width: 100%;
  &:hover {
    text-decoration: none;
    color: inherit;
  }
}
.column__block {
  display: grid;
  background: var(--color-white);
  grid-template-rows: subgrid;
  grid-row: span 2;
  padding: var(--space-base);
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-gray-300);
  position: relative;
  gap: var(--space-base);
}
.column__block-category {
  top: calc(-1 * var(--space-base));
  left: var(--space-base);
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xxs);
  margin-bottom: var(--space-xs);
  position: absolute;
}
.column__block-category-item {
  font-size: var(--font-xs);
  background: var(--color-primary-100);
  color: var(--color-primary-700);
  padding: var(--space-xxs) var(--space-xs);
  border-radius: var(--radius-sm);
  font-weight: var(--font-weight-medium);
  border: 1px solid var(--color-primary-200);
}
.column__block-category-item--column_category {
  background: var(--color-primary-100);
  color: var(--color-primary-700);
}
.column__block-image {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: var(--radius-md);
  .column__block-thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
  }
}
.column__block-image:hover .column__block-thumbnail {
  transform: scale(1.05);
}
.column__block-title {
  font-size: var(--font-md);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  color: var(--color-text);
  display: grid;
  align-items: center;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}