
.m18-cat-section{
    width:100%;
    margin:24px 0;
    box-sizing:border-box;
}
.m18-cat-heading{
    font-size:24px;
    font-weight:800;
    margin:0 0 22px;
    color:#111827;
    text-align:right;
}
.m18-cat-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:28px 24px;
    align-items:start;
}
.m18-cat-card{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    text-decoration:none !important;
    color:inherit !important;
    min-width:0;
    transition:transform .22s ease;
}
.m18-cat-card:hover{
    transform:translateY(-4px);
}
.m18-cat-image-wrap{
    position:relative;
    width:100%;
    max-width:190px;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center;
}
.m18-cat-circle{
    position:absolute;
    width:78%;
    height:78%;
    border-radius:50%;
    background:linear-gradient(145deg,#f1f2f5,#e3e5ea);
    z-index:0;
}
.m18-cat-image{
    position:relative;
    z-index:1;
    width:90%;
    height:90%;
    object-fit:contain;
    display:block;
    filter:drop-shadow(0 7px 10px rgba(0,0,0,.08));
    transition:transform .22s ease;
}
.m18-cat-card:hover .m18-cat-image{
    transform:scale(1.045);
}
.m18-cat-name{
    display:block;
    margin-top:8px;
    font-size:17px;
    font-weight:600;
    line-height:1.6;
    text-align:center;
    color:#171717;
    white-space:normal;
}
@media (max-width: 900px){
    .m18-cat-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 16px;}
    .m18-cat-image-wrap{max-width:175px;}
}
@media (max-width: 600px){
    .m18-cat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px;}
    .m18-cat-image-wrap{max-width:165px;}
    .m18-cat-name{font-size:15px;}
    .m18-cat-heading{font-size:20px;}
}
