.rj-columns {
  display: grid;
  gap: var(--rj-cols-gap, 16px);
  align-items: var(--rj-cols-align, stretch);
}

/* Mobile default */
.rj-columns {
  grid-template-columns: repeat(var(--rj-cols-mobile, 1), minmax(0, 1fr));
}

/* Vars from data attrs */
.rj-columns[data-mobile="1"] { --rj-cols-mobile: 1; }
.rj-columns[data-mobile="2"] { --rj-cols-mobile: 2; }
.rj-columns[data-mobile="3"] { --rj-cols-mobile: 3; }
.rj-columns[data-mobile="4"] { --rj-cols-mobile: 4; }
.rj-columns[data-mobile="5"] { --rj-cols-mobile: 5; }
.rj-columns[data-mobile="6"] { --rj-cols-mobile: 6; }

@media (min-width: 768px) {
  .rj-columns {
    grid-template-columns: repeat(var(--rj-cols-tablet, 2), minmax(0, 1fr));
  }
  .rj-columns[data-tablet="1"] { --rj-cols-tablet: 1; }
  .rj-columns[data-tablet="2"] { --rj-cols-tablet: 2; }
  .rj-columns[data-tablet="3"] { --rj-cols-tablet: 3; }
  .rj-columns[data-tablet="4"] { --rj-cols-tablet: 4; }
  .rj-columns[data-tablet="5"] { --rj-cols-tablet: 5; }
  .rj-columns[data-tablet="6"] { --rj-cols-tablet: 6; }
}

@media (min-width: 1024px) {
  .rj-columns {
    grid-template-columns: repeat(var(--rj-cols-desktop, 3), minmax(0, 1fr));
  }
  .rj-columns[data-desktop="1"] { --rj-cols-desktop: 1; }
  .rj-columns[data-desktop="2"] { --rj-cols-desktop: 2; }
  .rj-columns[data-desktop="3"] { --rj-cols-desktop: 3; }
  .rj-columns[data-desktop="4"] { --rj-cols-desktop: 4; }
  .rj-columns[data-desktop="5"] { --rj-cols-desktop: 5; }
  .rj-columns[data-desktop="6"] { --rj-cols-desktop: 6; }
}

.rj-col { min-width: 0; }
.rj-col img { max-width: 100%; height: auto; }

/* Reverse stacking ONLY when breakpoint is actually 1 column */
@media (max-width: 767px) {
  .rj-columns.rj-reverse-mobile[data-mobile="1"] {
    display: flex;
    flex-direction: column-reverse;
    gap: var(--rj-cols-gap, 16px);
  }
}

@media (max-width: 1023px) {
  .rj-columns.rj-reverse-tablet[data-tablet="1"] {
    display: flex;
    flex-direction: column-reverse;
    gap: var(--rj-cols-gap, 16px);
  }
}

@media (min-width: 1024px) {
  .rj-columns.rj-reverse-desktop[data-desktop="1"] {
    display: flex;
    flex-direction: column-reverse;
    gap: var(--rj-cols-gap, 16px);
  }
}

/* Horizontal alignment of content INSIDE columns */
.rj-columns.rj-content-start .rj-col {
  justify-self: start;
  text-align: left;
}

.rj-columns.rj-content-center .rj-col {
  justify-self: center;
  text-align: center;
}

.rj-columns.rj-content-end .rj-col {
  justify-self: end;
  text-align: right;
}

/* Vertical alignment of content inside columns */
.rj-columns.rj-vertical-start .rj-col {
  align-self: start;
}

.rj-columns.rj-vertical-center .rj-col {
  align-self: center;
}

.rj-columns.rj-vertical-end .rj-col {
  align-self: end;
}

/* Default */
.rj-columns.rj-vertical-stretch .rj-col {
  align-self: stretch;
}
