.column-layout--double {
  .col {
    grid-column: span 12;
  }
  &[data-mobile-columns="1"], &[data-print-columns="1"] {
    .col {
      grid-column: span 12;
    }
  }
  &[data-mobile-columns="2"], &[data-print-columns="2"] { 
    .col {
      grid-column: span 6;
    }
  }
  &[data-widths="50_50"] {
    @container column (width > 40rem) {
      .col {
        grid-column: span 6;
      }
    }
  }
  &[data-widths="25_75"] {
    @container column (width > 40rem) {
      .col:nth-child(1) {
        grid-column: span 3;
      }
      .col:nth-child(2) {
        grid-column: span 9;
      }
    }
  }
  &[data-widths="75_25"] {
    @container column (width > 40rem) {
      .col:nth-child(1) {
        grid-column: span 9;
      }
      .col:nth-child(2) {
        grid-column: span 3;
      }
    }
  }
  &[data-widths="33_66"] {
    @container column (width > 40rem) {
      .col:nth-child(1) {
        grid-column: span 4;
      }
      .col:nth-child(2) {
        grid-column: span 8;
      }
    }
  }
  &[data-widths="66_33"] {
    @container column (width > 40rem) {
      .col:nth-child(1) {
        grid-column: span 8;
      }
      .col:nth-child(2) {
        grid-column: span 4;
      }
    }
  }
  &[data-widths="fit_auto"] {
    @container (width > 40rem) {
      .column-wrapper {
        display: flex;
        flex-wrap: nowrap;
      }
      .col {
        &:nth-of-type(1) {
          flex-grow: 1;
        }
        &:nth-child(2) {
          flex-basis: auto;
        }
      }
    }
  }
  &[data-widths="auto_fit"] {
    @container (width > 40rem) {
      .column-wrapper {
        display: flex;
        flex-wrap: nowrap;
      }
      .col {
        &:nth-child(1) {
          flex-basis: auto;
        }
        &:nth-of-type(2) {
          flex-grow: 1;
        }
      }
    }
  }
  @container column (width > 40rem) {
    .col {
      grid-column: span 6;
    }
  }
}