@import "src/styles/variables"; $pad_danger: mix($red, $content_bg, 70%); $pad_usual: mix(white, $content_bg, 10%); .wrap { padding: $gap; z-index: 4; } .pad { padding: $gap * 1.5 $gap $gap; box-shadow: inset $pad_usual 0 0 0 2px; border-radius: $radius; position: relative; &_danger { box-shadow: inset $pad_danger 0 0 0 2px; .pad__title { span { background: $pad_danger; } } } &__title { position: relative; span { position: absolute; top: -5px; left: $radius; transform: translate(0, -100%); background: $pad_usual; border-radius: 4px; font: $font_10_semibold; line-height: 12px; padding: 2px $gap / 2; text-transform: uppercase; } } } .small { font: $font_12_regular; padding: 0 $gap 0; } .grid { }