/* ZOMAGI Category Cards v1.1.0 — clean circular layout */
.zomagi-clc{
    width:100%;
    max-width:1200px;
    margin:0 auto;
    padding:8px 10px 130px;
    box-sizing:border-box;
}
.zomagi-clc *{box-sizing:border-box}
.zomagi-clc-heading{
    margin:0 0 28px;
    font-size:clamp(24px,3vw,34px);
    line-height:1.15;
    text-align:center;
}
.zomagi-clc-grid{
    width:100%;
    display:grid;
    justify-items:center;
    align-items:start;
    gap:34px 28px;
}
.zomagi-clc-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.zomagi-clc-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.zomagi-clc-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.zomagi-clc-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.zomagi-clc-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.zomagi-clc-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}

.zomagi-clc-card{
    width:100%;
    max-width:220px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:12px;
    padding:0;
    margin:0;
    background:transparent;
    border:0;
    border-radius:0;
    color:inherit;
    text-decoration:none;
    transform:translateY(0);
    transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s ease;
}
.zomagi-clc-card:focus-visible{
    outline:2px solid currentColor;
    outline-offset:8px;
    border-radius:50%;
}
.zomagi-clc-image-ring{
    position:relative;
    display:block;
    width:180px;
    height:180px;
    max-width:100%;
    aspect-ratio:1/1;
    padding:5px;
    border:1px solid rgba(40,40,40,.42);
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 0 5px rgba(255,255,255,.95),0 3px 12px rgba(0,0,0,.08);
    overflow:hidden;
    transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;
}
.zomagi-clc-image-ring:after{
    content:"";
    position:absolute;
    inset:5px;
    border:1px solid rgba(60,60,60,.18);
    border-radius:50%;
    pointer-events:none;
}
.zomagi-clc-image-ring img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    border-radius:50%;
}
.zomagi-clc-name{
    display:block;
    width:100%;
    text-align:center;
    font-size:17px;
    line-height:1.25;
    font-weight:500;
    color:#111;
    word-break:break-word;
}
@media (hover:hover) and (pointer:fine){
    .zomagi-clc-card:hover{
        transform:translateY(-8px);
    }
    .zomagi-clc-card:hover .zomagi-clc-image-ring{
        transform:scale(1.025);
        box-shadow:0 0 0 5px rgba(255,255,255,.98),0 12px 24px rgba(0,0,0,.14);
    }
}
@media (max-width:1100px){
    .zomagi-clc-cols-4,.zomagi-clc-cols-5,.zomagi-clc-cols-6{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}
@media (max-width:700px){
    .zomagi-clc{
        padding:4px 14px 150px;
    }
    .zomagi-clc-grid{
        gap:34px 18px;
    }
    .zomagi-clc-cols-3,.zomagi-clc-cols-4,.zomagi-clc-cols-5,.zomagi-clc-cols-6{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .zomagi-clc-card{
        max-width:180px;
        gap:10px;
    }
    .zomagi-clc-image-ring{
        width:135px;
        height:135px;
        padding:4px;
        box-shadow:0 0 0 4px rgba(255,255,255,.95),0 3px 10px rgba(0,0,0,.08);
    }
    .zomagi-clc-image-ring:after{inset:4px}
    .zomagi-clc-name{font-size:15px}
}
@media (max-width:390px){
    .zomagi-clc{padding-left:8px;padding-right:8px;padding-bottom:155px}
    .zomagi-clc-grid{gap:30px 12px}
    .zomagi-clc-image-ring{width:125px;height:125px}
    .zomagi-clc-name{font-size:14px}
}
@media (prefers-reduced-motion:reduce){
    .zomagi-clc-card,.zomagi-clc-image-ring{transition:none!important}
}
.zomagi-clc-empty{padding:18px;border:1px dashed #bbb;border-radius:12px}