@import 'src/styles/variables';

.stamp {
  @include outer_shadow;

  background: #2b0011 url('/images/join_us.svg') 50% 100%;
  background-size: cover;
  width: 100%;
  border-radius: $cell_radius;
  display: flex;
  flex-direction: column;
  cursor: pointer;
}

.content {
  padding: $gap;
  box-sizing: border-box;
  flex: 0 1;

  @include phone {
    padding: $gap / 2;
  }

  h2 {
    font: $font_cell_title;
    text-transform: uppercase;
    word-break: break-word;

    @include tablet {
      font: $font_16_semibold;
    }

    @include phone {
      font: $font_14_semibold;
    }
  }

  p {
    margin: 0.5em 0;
    line-height: 1.4em;
    font: $font_16_medium;
    opacity: 0.7;

    @include tablet {
      font: $font_14_medium;
    }
  }
}

.button {
  margin-top: 1.4em;
  opacity: 0.7;

  &:hover {
    opacity: 1;
  }

  @include tablet {
    font: $font_12_semibold;
    margin-top: 1em;
  }
}
