/*******************************************************/
/****************** ## Features Area *******************/
/*******************************************************/
/* Featured Style */
.featured-item
    display: flex
    padding: 25px 40px
    border-radius: 10px
    background: white
    margin-bottom: 30px
    border: 1px solid $lighter-color
    transition: 0.3s
    +res-bt(xl, lp)
        +gapLR(padding, 25px)
    +res-bl(lg)
        +gapLR(padding, 20px)
    .icon
        flex: none
        font-size: 60px
        line-height: 1
        margin-right: 35px
        color: $primary-color
        +res-bt(xl, lp)
            margin-right: 25px
        +res-bl(lg)
            font-size: 50px
            margin-right: 20px
    .content
        h4
            +res-bl(lg)
                font-size: 24px
            +res-bl(xs)
                font-size: 22px
        p
            margin-bottom: 0
    &:hover
        border-color: transparent
        box-shadow: 0px 10px 60px rgba(236, 61, 8, 0.1)
    
.features-five-wrap
    +res-bl(lg)
        max-width: 600px
    
.featured-item-two
    display: flex
    &:not(:last-child)
        padding-bottom: 40px
        margin-bottom: 50px
        border-bottom: 1px dashed white
    .icon
        flex: none
        margin-right: 50px
        font-size: 50px
        color: black
        +circle($secondary-color, 100px)
        +res-bt(lg, xl)
            +size(70px)
            font-size: 40px
            line-height: 70px
            margin-right: 20px
        +res-bl(sm)
            +size(70px)
            font-size: 40px
            line-height: 70px
            margin-right: 20px
    .content
        h4
            color: white
            +res-bl(xs)
                font-size: 24px
        p
            color: white
            margin-bottom: 0
        
.food-category-shape
    .shape
        z-index: -1
        max-width: 11%
        position: absolute
        &.one
            top: 27%
            left: 6%
        &.two
            top: 15%
            right: 9%
            
/* Features Style Two */
.feature-two-image
    height: 100%
    overflow: hidden
    img
        height: 100%
        max-width: none
        +res-bl(lg)
            width: 100%

.feature-two-content
    height: 100%
    display: flex
    padding: 50px 70px
    flex-direction: column
    align-items: flex-start
    justify-content: center
    border: 1px solid black
    +res-bl(sm)
        +gapLR(padding, 50px)
    +res-bl(ms)
        +gapLR(padding, 25px)
    h3
        margin-top: -5px
        margin-bottom: 12px
    .theme-btn
        font-size: 16px
        padding: 7px 30px