Добавить псевдоэлемент в sass

Подскажите пожалуйста как в класс .services добавить псевдоэлемент :before?

.services
&__container
    padding: 120px 0px
    display: grid
    grid-template-columns: 1fr
    grid-gap: 24px
&__description
    color: rgba(0, 0, 0, 0.72)
&__list
    display: grid
    grid-template-columns: repeat(6, 1fr)
    grid-gap: 32px
    padding-top: 40px
&__item
    background: #EEFAFF
    grid-column: span 2
    padding: 32px
    border-radius: 12px
    position: relative
    overflow: hidden
    z-index: 1
    &:nth-child(1),
    &:nth-child(2)
        grid-column: span 3
    &:nth-child(1n+2),
    &:nth-child(1n+3)
        background: #FFF7E3
        &:hover
            box-shadow: 0px 0px 0px 2px #FFF7E3
    &:nth-child(1n+4)
        background: #F0FFE7
        &:hover
            box-shadow: 0px 0px 0px 2px #F0FFE7
    &:nth-child(1n+5)
        background: #FCF0FF
        &:hover
            box-shadow: 0px 0px 0px 2px #FCF0FF
    a
        display: grid
        grid-template-columns: 1fr
        grid-gap: 32px
    &::before
        content: ""
        position: absolute
        top: 0
        left: 50%
        width: 100px
        height: 100px
        transform: translate(-50%, -50%) scale(0)
        background: #fff
        border-radius: 200px
        transition: all 0.5s
        z-index: -2
        pointer-events: none
    &:hover
        box-shadow: 0px 0px 0px 2px #EEFAFF
        &::before
            transform: translate(-50%, -50%) scale(9)
    .hover-element
        background: inherit
        z-index: -1

&__icon
    img
        display: block
        width: 80px
        height: 80px
&__info
    display: grid
    grid-template-columns: 1fr
    grid-gap: 8px
    &-name
        font-weight: 700
        font-size: 18px
        color: #0B0B0B
    &-description
        color: rgba(0, 0, 0, 0.72)
        max-width: 336px