[data-layout="3"] {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 24px 0;
  margin-top: 30px;
}
@media screen and (max-width: 1024px) {
  [data-layout="3"] {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  [data-layout="3"] {
    flex-direction: column;
    margin-top: 14px;
  }
}
[data-layout="3"] > div {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
[data-layout="3"] > div img {
  aspect-ratio: 1.7777777778;
  object-fit: cover;
}
[data-layout="3"] .column-1 {
  width: 48.7%;
  padding-right: 24px;
  border-right-width: 1px;
}
@media screen and (max-width: 1440px) {
  [data-layout="3"] .column-1 {
    width: 46.8%;
  }
}
@media screen and (max-width: 1024px) {
  [data-layout="3"] .column-1 {
    width: 65%;
  }
}
@media screen and (max-width: 767px) {
  [data-layout="3"] .column-1 {
    width: 100%;
    padding: 0;
    border-right: none;
    padding-bottom: 24px;
  }
}
[data-layout="3"] .column-2 {
  width: 29.25%;
  padding: 0 24px;
  border-right-width: 1px;
}
@media screen and (max-width: 1440px) {
  [data-layout="3"] .column-2 {
    width: 28.6%;
  }
}
@media screen and (max-width: 1024px) {
  [data-layout="3"] .column-2 {
    width: 100%;
    padding: 0;
    border-right: none;
    order: 3;
    flex-direction: row;
  }
}
@media screen and (max-width: 767px) {
  [data-layout="3"] .column-2 {
    width: 100%;
    padding: 0;
    flex-direction: column;
    order: unset;
  }
}
[data-layout="3"] .column-3 {
  width: 22.05%;
  padding-left: 24px;
}
@media screen and (max-width: 1440px) {
  [data-layout="3"] .column-3 {
    width: 24.6%;
  }
}
@media screen and (max-width: 1024px) {
  [data-layout="3"] .column-3 {
    width: 35%;
  }
}
@media screen and (max-width: 767px) {
  [data-layout="3"] .column-3 {
    width: 100%;
    padding: 0;
    display: flex;
  }
}