.collections {
  font-size: 18px;
  line-height: var(--line-height-lg, 1.5);
}

.collections__wrapper--padding-top {
  padding-top: var(--padding-top-mobile, 16px);
}

.collections__wrapper--padding-bottom {
  padding-bottom: var(--padding-bottom-mobile, 16px);
}

.collections__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 16px;
}

.collections__list.collections__list--multiple {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.collections__item {
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius-block-rounded);
}

.collections__item:last-child {
  margin-bottom: 0;
}

.collections__heading {
  font-size: 24px;
  line-height: 1.4;
}

.collections__heading a {
  font-family: inherit;
}

.collections__link {
  display: block;
  position: relative;
}

.collections__item > .collections__image-item {
  position: relative;
}

.collections__item > .collections__image-item::after,
.collections__link::after {
  content: "";
  display: block;
  aspect-ratio: 1 / 0.69;
}

.collections__image {
  display: block;
  max-width: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: var(--object-fit);
}

.collections__image-item {
  display: block;
  position: absolute;
  inset: 0;
}

.palette-one.collections__wrapper {
  background: var(--background-primary, #FFF);
}

.palette-two.collections__wrapper {
  background: var(--background-primary-2, #0B1A26);
}

.palette-three.collections__wrapper {
  background: var(--background-primary-3, #F4B841);
}

.classic-design .collections__item {
  padding: 8px;
  border: 1px solid transparent;
}

.classic-design .collections__heading {
  padding: 16px 0 8px;
  margin: 0;
  text-align: center;
}

.classic-design .collections__link:hover {
  opacity: 0.9;
}

.modern-design .collections__image-item::before {
  content: "";
  position: absolute;
  inset: 0 0 -50px;
  z-index: 1;
  transition: all var(--animation-duration, 200ms) var(--transition-function-ease-out);
}

.modern-design .collections__heading {
  display: inline;
  position: absolute;
  left: 24px;
  bottom: 24px;
  padding: 0 24px 0 0;
  font-size: 24px;
  line-height: 1.4;
  margin: 0;
  z-index: 1;
}

.modern-design .collections__link {
  height: 100%;
}

.modern-design .collections__item:hover .collections__link .collections__image-item::before {
  bottom: 0;
}

.modern-design .palette-one .collections__image-item::before {
  background: var(--color-image-placeholder, #0B1A2626);
}

.modern-design .palette-one.collections__wrapper--with-overlay .collections__heading {
  color: var(--color-overlay, #FFF);
}

.modern-design .palette-one.collections__wrapper--with-overlay .collections__image-item::before {
  background: linear-gradient(0.13deg, var(--background-overlay, #0B1A26) 10%, var(--background-overlay-00, #0B1A2600) 95.37%);
}

.modern-design .palette-two .collections__image-item::before {
  background: var(--color-image-placeholder-2, #FFFFFF47);
}

.modern-design .palette-two.collections__wrapper--with-overlay .collections__heading {
  color: var(--color-overlay, #FFF);
}

.modern-design .palette-two.collections__wrapper--with-overlay .collections__image-item::before {
  background: linear-gradient(0.13deg, var(--background-overlay, #0B1A26) 10%, var(--background-overlay-00, #0B1A2600) 95.37%);
}

.modern-design .palette-three .collections__image-item::before {
  background: var(--color-image-placeholder-3, #0B1A2626);
}

.modern-design .palette-three.collections__wrapper--with-overlay .collections__heading {
  color: var(--color-overlay, #FFF);
}

.modern-design .palette-three.collections__wrapper--with-overlay .collections__image-item::before {
  background: linear-gradient(0.13deg, var(--background-overlay, #0B1A26) 10%, var(--background-overlay-00, #0B1A2600) 95.37%);
}

.classic-design .palette-one .collections__item {
  border-color: var(--background-accent, #F4B841);
}

.classic-design .palette-one .collections__heading a:hover {
  color: var(--color-outline, #F4B841);
}

.classic-design .palette-two .collections__item {
  border-color: var(--background-accent-2, #F4B841);
}

.classic-design .palette-two .collections__heading a:hover {
  color: var(--color-outline-2, #F4B841);
}

.classic-design .palette-three .collections__item {
  border-color: var(--background-accent-3, #0B1A26);
}

.classic-design .palette-three .collections__heading a:hover {
  color: var(--color-outline-3, #0B1A26);
}

@media (width >= 768px) {
  .collections__list {
    grid-template-columns: minmax(280px, 300px);
  }

  .collections__item > .collections__image-item::after,
  .collections__link::after {
    aspect-ratio: 1 / 1.48;
  }

  .collections__list-2 .collections__item > .collections__image-item::after,
  .collections__list-2 .collections__link::after {
    aspect-ratio: 1 / 0.92;
  }

  .collections__list-3 .collections__item > .collections__image-item::after,
  .collections__list-3 .collections__link::after {
    aspect-ratio: 1 / 1.42;
  }
}

@media (width >= 1100px) {
  .collections__list {
    gap: 32px;
  }

  .collections__wrapper--padding-top {
    padding-top: var(--padding-top, 16px);
  }

  .collections__wrapper--padding-bottom {
    padding-bottom: var(--padding-bottom, 16px);
  }
}
