/* Category Carousel Section CSS - Extracted from home.css */
/* This file contains ONLY category carousel section styles */

body.home-page .category-carousel-section {
    padding: 50px 0;
    background: #fff9fe;
    overflow: hidden;
    position: relative;
}

body.home-page .sunburst-bg {
    position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
    background: repeating-conic-gradient(from 0deg, rgba(255, 240, 245, 0.4) 0deg 10deg, rgba(255, 255, 255, 0) 10deg 20deg);
    animation: rotateSunburst 60s linear infinite; z-index: 0; pointer-events: none;
}
@keyframes rotateSunburst { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

body.home-page .carousel-track-container { 
    width: 95%; 
    max-width: 100%; 
    margin: 0 auto; 
    position: relative; 
    z-index: 1; 
    overflow: hidden;
    padding: 11px 0;
}
body.home-page .carousel-track { 
    display: flex; 
    transition: transform 0.5s ease-in-out; 
    gap: 0; 
    will-change: transform;
}
body.home-page .cat-item { 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    justify-content: center; 
    text-align: center; 
    flex: 0 0 calc(100% / 7); /* 7 items on desktop */
    cursor: pointer; 
    padding: 0 15px; 
    box-sizing: border-box;
    text-decoration: none;
    color: inherit;
}

body.home-page .cat-img-wrap {
    width: 170px; height: 170px; border-radius: 50%; padding: 6px;
    border: 2px solid transparent;
    background: linear-gradient(to right, #fff, #fff), linear-gradient(45deg, #d4af37, #8b5e3c);
    background-clip: content-box, border-box;
    box-shadow: 0 10px 25px rgba(139, 94, 60, 0.15);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    margin-bottom: 20px; overflow: hidden; position: relative;
}
body.home-page .cat-img-wrap img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; transition: opacity 0.3s ease, transform 0.5s ease; }
body.home-page .cat-img-wrap img.hover { opacity: 0; }
body.home-page .cat-item h3 { font-size: 14px; font-weight: 700; letter-spacing: 2px; color: var(--dark-brown); margin: 0; transition: color 0.3s; }
body.home-page .cat-item:hover .cat-img-wrap { transform: scale(1.1); box-shadow: 0 15px 35px rgba(139, 94, 60, 0.3); border-color: var(--gold); }
body.home-page .cat-item:hover .cat-img-wrap img.primary { opacity: 0; transform: scale(1.1) rotate(5deg); }
body.home-page .cat-item:hover .cat-img-wrap img.hover { opacity: 1; transform: scale(1.05); }
body.home-page .cat-item:hover h3 { color: var(--primary-brown); transform: translateY(5px); }

/* Responsive */
@media (max-width: 1024px) {
    body.home-page .cat-item { flex: 0 0 calc(100% / 3); } /* 3 items on tablet */
}

@media (max-width: 768px) {
    body.home-page .cat-img-wrap { width: 250px; height: 250px; }
    body.home-page .cat-item { flex: 0 0 100%; } /* 1 item on mobile */
}

