.category-contant {
    max-width:820px;
    text-align:center;
    margin:0 auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
}

.catbox_item {
    position:relative;
    padding:35px;
    margin:16px;
    max-width:430px;
    min-width:350px;
    cursor: pointer;
    flex:1;
    border-radius:var(--largeradius);
    transition:all 300ms ease;
    overflow:hidden;
    background:white;
}

.-primary-body  .catbox_item {
    background:var(--background);
    margin: 0;
}

 
.YC-Cat-v2 {position:relative;display:flex;flex-wrap:wrap;}

.cat_icom {
    height:60px;
    width:60px;
    background:var(--uicolor);
    color:white;
    font-size:28px;
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:21px;
    position:relative;
    z-index:1;
}

.cat_title a {
    font-size: 24px;
    font-weight:500;
    transition:300ms all ease;
}

.catbox_item:hover .cat_title a {
    color:var(--uicolor);
}

.cat_title {
    position:relative;
    z-index:1;
}

.cat_conten {
    font-size:18px;
    line-height:1.5;
    opacity:.9;
    color:var(--secondarytext);
    transition:300ms all ease;
    position:relative;
    z-index:1;
    max-width:85%;
}

.catbox_item:hover .cat_conten {
    color:var(--uicolor);
}

.category_box {
    position:relative;
    z-index:7;
}

.-YC-Category {
    position:relative;
    overflow:hidden;
    margin:-8px;
}

 
.category-backgroung {
    background:var(--background-color);
}

.cat-num {
    position:absolute;
    z-index:1;
    background: var(--background);
    left: 42px;
    display:flex;
    justify-content:center;
    align-items:center;
    color:white;
    font-size:20px;
    font-family:var(--f-number);
    font-weight:600;
    border-radius:50% 50% 0 0;
    bottom:0;
    transition:300ms all ease;
    padding:10px;
}

.-primary-body .cat-num {
    background:white;
}

.cat-num::after,.cat-num::before {
    content:"";
    position:absolute;
    background-color:#00000000;
    bottom:0px;
    height:40px;
    width:20px;
    box-shadow: 0 15px 0 0 var(--background);
    border-bottom-left-radius:15px;
    border-bottom-right-radius:0px;
    left:100%;
    right:inherit;
}
.cat-num::after {
    transform:rotateY(180deg);
    left:auto;
    right:100%;
}

.cat-num i {
    width:50px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:var(--uicolor2);
    color:#ffffff;
    border-radius:50%;
    transform:rotate(45deg);
}
 
.cat_header {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:17px;
    border-bottom:1px solid var(--diver);
    padding-bottom:27px;
}.-ycw-section.-ycwt-cat {
    margin-inline: 30px;
    background: var(--background);
    border-radius: 25px;
}