/* Category Styles */

    .category-grid { display: flex; flex-wrap: wrap; margin: calc(-1 * clamp(0.875rem, 0.7885rem + 0.3846vw, 1.25rem)); }
    .category-grid .mt__col { padding: clamp(0.875rem, 0.7885rem + 0.3846vw, 1.25rem); flex: 0 1 50%; }

    .category-grid .category-card { display: grid; grid-template-columns: clamp(7.5rem, 6.6346rem + 3.8462vw, 11.25rem) 1fr; align-items: center; 
        gap: 20px; }

    .category-grid .media-group { padding: 10px; border: 2px solid var(--mt-primary); }
    .category-grid .media-group a { display: block; background: #fff; border: 1px solid #fde3bf; border-radius: 8px; padding: 5px; }
    .category-grid .media-group img { border-radius: 5px; display: block; width: 100%; height: auto; }

    .category-grid .content-group .category-title { margin-bottom: 8px; }
    .category-grid .content-group .category-description { font-size: 0.95rem; color: var(--mt-primary); line-height: 1.4; }

    .category-grid .content-group > .mt_button { transition: var(--mt-transition); }

	.category-grid .content-group > .mt_button:hover,
	.category-grid .content-group > .mt_button:focus { background-color: var(--mt-quinery); color: var(--mt-primary); }

    .category-grid .content-group > *:not(:last-child) { margin: 0 0 12px; }

/** 
    Responsive Adjustments
*/

    @media (max-width: 767px) { 
        .category-grid .category-card { grid-template-columns: 1fr; text-align: center; }
        .category-grid .media-group { margin: 0 auto; }
    }
    
    @media (max-width: 480px) { 
        .category-grid .mt__col { flex: 1 1 100%; }
    }

/* Category card image carousel */
.category-img--carousel { width: 100%; }
.category-img--carousel .fp-carousel { position: relative; width: 100%; }
.category-img--carousel .fp-carousel-viewport {
    width: 100%;
    overflow: hidden;
    background: #fff;
    border: 1px solid #fde3bf;
    border-radius: 8px;
    box-sizing: border-box;
}
.category-img--carousel .fp-carousel-track { display: flex; flex-wrap: nowrap; width: 100%; transition: transform 0.6s ease; will-change: transform; }
.category-img--carousel .fp-carousel-slide { flex: 0 0 100%; width: 100%; max-width: 100%; }
.category-img--carousel .fp-carousel-slide a { display: block; padding: 5px; box-sizing: border-box; }
.category-img--carousel .fp-carousel-slide img { width: 100%; height: auto; border-radius: 5px; }
.category-img--carousel .fp-carousel-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 50%;
    background: rgba(120, 120, 120, 0.45);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease;
}
.category-img--carousel:hover .fp-carousel-arrow { opacity: 1; visibility: visible; pointer-events: auto; }
.category-img--carousel .fp-carousel-arrow:disabled { opacity: 0.35 !important; cursor: default; }
.category-img--carousel .fp-carousel-arrow--prev { left: 8px; }
.category-img--carousel .fp-carousel-arrow--next { right: 8px; }
.category-img--carousel .fp-carousel-arrow span {
    width: 7px;
    height: 7px;
    border-style: solid;
    border-color: currentColor;
    border-width: 2px 2px 0 0;
}
.category-img--carousel .fp-carousel-arrow--prev span { transform: rotate(-135deg); margin-left: 2px; }
.category-img--carousel .fp-carousel-arrow--next span { transform: rotate(45deg); margin-right: 2px; }

/* Fallback: if JS hasn't initialized yet, show first slide only. */
[data-product-carousel]:not([data-carousel-ready="1"]) .fp-carousel-slide:not(:first-child) {
    display: none;
}