.custom-cat-carousel-container {
width: 100%;
margin: 20px 0;
}
.custom-cat-carousel-track {
display: flex;
align-items: flex-start;
gap: 25px; overflow-x: auto;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
padding-bottom: 10px;
} .custom-cat-carousel-track::-webkit-scrollbar {
display: none;
}
.custom-cat-carousel-track {
-ms-overflow-style: none;
scrollbar-width: none;
} .custom-cat-item {
flex: 0 0 auto;
display: flex;
flex-direction: column;
align-items: center;
width: 140px;
text-align: center;
scroll-snap-align: start;
} .custom-cat-circle-img {
width: 140px;
height: 140px;
border-radius: 50%;
object-fit: cover;
display: block;
box-shadow: 0 4px 10px rgba(0,0,0,0.05);
transition: transform 0.2s ease;
}
.custom-cat-image-link:hover .custom-cat-circle-img {
transform: scale(1.03);
} .custom-cat-title-link {
margin-top: 12px;
font-size: 16px;
color: #222;
text-decoration: none;
font-weight: 500;
line-height: 1.2;
}
.custom-cat-title-link:hover {
text-decoration: underline;
} .custom-cat-more-button {
width: 140px;
height: 140px;
border-radius: 50%;
background-color: #f7f7f7;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
transition: background-color 0.2s ease, transform 0.2s ease;
}
.custom-cat-more-button:hover {
background-color: #eee;
transform: scale(1.03);
}
.custom-cat-plus-icon {
font-size: 48px;
font-weight: 300;
color: #111;
line-height: 1;
}