.category-container {
                display: flex;
                justify-content: center;
                margin: 10px auto;
                margin-top: -80px;
                margin-bottom: 180px;
                max-width: 1400px;
                gap: 10px;
            }
            .category-card {
                width: 270px;
                height: 560px;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                color: #fff;
                text-align: center;
                border-radius: 16px;
                position: relative;
                overflow: hidden;
                box-shadow: 0 4px 16px rgba(0,0,0,0.10);
                background-size: cover;
                background-position: center;
                cursor: pointer;
                transition: width 0.35s cubic-bezier(.77,0,.18,1);
                z-index: 1;
            }
            
            .category-card::before {
                content: '';
                position: absolute;
                inset: 0;
                z-index: 1;
                pointer-events: none;

            }
            .category-card:hover::before,
            .category-card:focus-visible::before {
                background: linear-gradient(45deg, rgba(1, 155, 191, 1) 25%, rgba(255, 255, 255, 0.1) 80%);
                
            }
            .category-card:hover {
                box-shadow: 0 8px 32px rgba(0,0,0,0.18), 0 1.5px 8px rgba(0,0,0,0.10);
               
            }
            .category-card img {
                width: 64px;
                height: 64px;
                margin-bottom: 22px;
                position: relative;
                z-index: 2;
                border-radius: 50%;
                background: rgba(255,255,255,0.12);
                box-shadow: 0 2px 8px rgba(0,0,0,0.10);
            }
            .category-card p {
                margin: 0;
                position: relative;
                z-index: 2;
                font-size: 2rem;
                font-weight: 500;
                letter-spacing: 1px;
                color: #fff;
            }

            .category-card span {
                display: block;
                font-size: 13px;
                margin-top: 6px;
                opacity: 0.82;
                font-weight: 400;
                letter-spacing: 1.5px;
                color: #fff;
            }
            .category-details {
                position: relative;
                margin-top: 30px;
                z-index: 3;
                font-size: 15px;
                line-height: 1.7;
                border-radius: 0 0 16px 16px;
                
                display: none;
            }
            
            .category-card:hover .category-details,
            .category-card:focus-visible .category-details {
                display: block;
            }
            .category-card:hover,
            .category-card:focus-visible {
                width: 540px;
                z-index: 10;
            }
            /* Backgrounds */
            
            @media (max-width: 1200px) {
                .category-container { flex-wrap: wrap; }
                .category-card { width: 44vw; min-width: 220px; max-width: 340px; }
                .category-card:hover, .category-card:focus-visible { width: 90vw; max-width: 540px; }
            }
            @media (max-width: 800px) {
                .category-container { flex-direction: column; align-items: center; }
                .category-card, .category-card:hover, .category-card:focus-visible {
                    width: 96vw; max-width: 540px; min-width: 0;
                    margin-bottom: 18px;
                }
            }
@media (max-width: 1450px) {
  .bubble-mobile-hide {
    display: none !important;
  }
}