// Teaser
//
// Displayed in listings, a teaser is a content summary that contains:
// - a label
// - a title
// - a summary text
//
// Markup: teaser.twig
//
// Styleguide: Elements.Teaser
.teaser
    _p(2)

    &-catchline
        _mt(.25)
        font-size .9em
        font-style italic

        &-communication
        &-production
            background-color var(--color-native)
            color var(--color-native-foreground)

    &-headline
        font-family $fontstack-base
        margin 0
        font-weight bold
        font-size _rem(11px)
        line-height _getLh(@font-size)
        text-transform uppercase

    &-title
        font-family $fontstack-base
        margin 0
        font-weight bold
        line-height 1.2

    &-summary
        _pt(.25)
        margin 0