/*
|--------------------------------------------------------------------------
| WRAPPER
|--------------------------------------------------------------------------
*/

.crp-products-wrapper{

    width:100%;

    margin-top:25px;

}

.crp-heading{

    font-size:24px;
    padding:15px 15px!important;

    font-weight:600;

    margin:0 0 20px;

    line-height:1.2;

    text-align:center;

    background-color:#f0f0f0;

}

/*
|--------------------------------------------------------------------------
| GRID
|--------------------------------------------------------------------------
*/

.crp-grid{

    display:grid;

    gap:14px;

    grid-template-columns:
        repeat(
            var(--crp-desktop),
            minmax(0,1fr)
        );

}

/*
|--------------------------------------------------------------------------
| ITEM
|--------------------------------------------------------------------------
*/

.crp-item{

    display:flex;

    align-items:flex-start;

    gap:14px;

    text-decoration:none;

    background:#fff;

    border:1px solid #d1d1d1;

    border-radius:10px;

    padding:12px;

    transition:.25s;

}

.crp-item:hover{

    transform:translateY(-2px);

    border-color:#d6d6d6;

    box-shadow:
        0 8px 20px rgba(0,0,0,.05);

}

/*
|--------------------------------------------------------------------------
| IMAGE
|--------------------------------------------------------------------------
*/

.crp-image{

    width:64px;

    height:64px;

    flex-shrink:0;

    overflow:hidden;

    border-radius:8px;

    background:#fafafa;

}

.crp-image img{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

}

/*
|--------------------------------------------------------------------------
| CONTENT
|--------------------------------------------------------------------------
*/

.crp-content{

    min-width:0;

    flex:1;

}

.crp-content h4{

    margin:0 0 8px;

    color:#222;

    font-size:18px;

    font-weight:600;

    line-height:1.35;

    display:-webkit-box;


    -webkit-box-orient:vertical;

    overflow:hidden;

}

.crp-price{

    margin-bottom:6px;

    color:#bd0101;

    font-size:16px;

    font-weight:500;

}

.crp-price del{

    opacity:.6;

    margin-right:6px;

    font-size:14px;

}

.crp-price ins{

    text-decoration:none;

}

.crp-view{

    display:inline-block;

    color:#444;

    font-size:15px;

    transition:.25s;

}

.crp-item:hover .crp-view{

    transform:translateX(4px);

}

/*
|--------------------------------------------------------------------------
| TABLET
|--------------------------------------------------------------------------
*/

@media(max-width:1024px){

    .crp-grid{

        grid-template-columns:
            repeat(
                var(--crp-tablet),
                minmax(0,1fr)
            );

    }

    .crp-heading{

        font-size:26px;

    }

}

/*
|--------------------------------------------------------------------------
| MOBILE
|--------------------------------------------------------------------------
*/

@media(max-width:500px){

    .crp-grid{

        grid-template-columns:
            repeat(
                var(--crp-mobile),
                minmax(0,1fr)
            );

    }

    .crp-item{

        padding:10px;

        gap:12px;

    }

    .crp-image{

        width:58px;

        height:58px;

    }

    .crp-content h4{

        font-size:16px;

    }

    .crp-price{

        font-size:16px;

    }

    .crp-view{

        font-size:14px;

    }

}