// Organism: Duo content

$o-duo-bp1: 1000;
$o-duo-gap: column(0.75);

.o-duo {
  @include vspacing(
    'margin-top' 1,
    'margin-bottom' 1
  );
}


.o-duo__main {
  @include mq($max: $o-duo-bp1) {
    padding: space(3) 0;
  }

  @include mq($o-duo-bp1) {
    display: flex;
  }
}


.o-duo__item {
  @include mq($o-duo-bp1) {

    // Left & Right item
    flex: 0 0 calc(50% - #{($o-duo-gap / 2)});

    // Left item only
    &:first-child {
      margin-right: ($o-duo-gap /2);
    }
  }

  // Right item only
  &:last-child {
    margin-top: space(6);

    @include mq($o-duo-bp1) {
      margin-top: 0;
      margin-left: ($o-duo-gap / 2);
    }
  }
}