/* Estrutura do Carrossel */
   
           :root {

            --muted: #6c757d;
            --card-width: 340px; /* Largura fixa para cada cartão */
            --card-gap: 3rem;   /* Espaçamento entre os cartões (48px) */
            --logo-speed: 60s; /* Velocidade do carrossel. Maior valor = mais lento */
            /* Cálculo do deslocamento total para o loop infinito (6 itens * largura + 6 itens * gap) */
            --total-original-content-width: calc((var(--card-width) + var(--card-gap)) * 6);
        }
   
        .case-carousel {
            overflow: hidden;
            width: 100%;
            padding: 2rem 0;
            
        }

        .case-track {
            display: flex;
            gap: var(--card-gap);
            width: max-content; /* Permite que o flex-container tenha o tamanho total do seu conteúdo */
            animation: scrollLogos var(--logo-speed) linear infinite;
        }

        .card-item {
            flex: 0 0 var(--card-width); /* Impede que os itens se encolham e define a largura */
            cursor: default; /* Remove o cursor de link */
        }
        
       .card {
            padding: 20px;
            border-left: 5px solid;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            display: block;
            background: #ffffff;
            border-radius: 8px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
            height: 100%;
            box-sizing: border-box;
            position: relative; /* necessário para o selo */
        }

        .card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
        }

        .card.blue-border { border-left-color: var(--blue); }
        .card.green-border { border-left-color: var(--green); }

        .card h3 { margin: 0; }
        .card p { margin: 0 0 16px; }
        .card .metrics { display: flex; flex-direction: column; gap: 8px; }
        .card .metrics p { color: var(--charcoal); font-weight: bold; margin: 0; }
        .card .metrics span { font-size: 1.2em; }

        /* Estilo dos selos */
        .card .selo {
            position: absolute;
            bottom: 8px;
            right: 8px;
            padding: 4px 10px;
            font-size: 12px;
            font-weight: bold;
            color: #fff;
            border-radius: 12px;
            z-index: 10;
            pointer-events: none;
            box-shadow: 0 2px 6px rgba(0,0,0,0.2);
        }

        .selo.green { background-color: #28a745; }
        .selo.blue { background-color: #007bff; }
        .selo.silver { background-color: #6c757d; }
        .selo.gold { background-color: #ffc107; color: #333; }

		

        
        /* Animação: Desliza da Esquerda para a Direita */
        @keyframes scrollCase {
            from {
                /* Começa com o final dos itens duplicados visível, à esquerda */
                transform: translateX(calc(-5 * var(--total-original-content-width))); 
            }
            to {
                /* Desliza para a direita até o início dos itens originais */
                transform: translateX(0);
            }
        }