.paid {
    max-width: 1100px; /* Defina o valor que deseja, como 960px, 800px, etc. */
    margin: 0 auto; /* Centraliza o conteúdo horizontalmente */
}

.cta-section .custom-container {
    width: 80% !important; /* Defina o novo tamanho desejado para .custom-container dentro de .cta-section */
    max-width: 80% !important; /* Ajuste o tamanho máximo, se necessário */
}

.time {
    font-size: 1.1em;
    margin-bottom: 0px;
    text-transform: uppercase;
    color: #333;
}

@media (max-width: 480px) {
    /* Ajustando o tamanho da fonte */
    .cta-section .titulos h2,
    .cta-section h3 {
        font-size: 1.2rem;
        margin-bottom: 5px;
        margin-top: 10px;
    }

    /* Ajuste da imagem */
    .cta-section .cta-images img {
        width: 100%;
        /* A imagem ocupará toda a largura do container */
        max-width: 250px;
        /* Limita a largura máxima */
        height: auto;
        /* Mantém a proporção da imagem */
    }

    /* Ajuste do botão CTA */
    .cta-section .btn-comprar {
        font-size: 0.9rem;
        /* Reduz o tamanho do texto do botão */
        padding: 10px 20px;
        /* Ajusta o preenchimento do botão */
        width: 100%;
        /* Faz com que o botão ocupe toda a largura */
        box-sizing: border-box;
        /* Garante que o padding seja incluído na largura */
    }

    /* Ajustando os preços e texto */
    .cta-section .cta-price-promotion,
    .cta-section .cta-price-final {
        font-size: 1rem;
        /* Reduz o tamanho do texto de preço */
    }

    /* Ajustando a largura das colunas */
    .cta-section .col-6 {
        width: 100%;
        /* A coluna ocupará 100% da largura em telas menores */
        margin-bottom: 20px;
        /* Espaço entre as colunas */
    }

    /* Reduzindo a margem e o padding da seção */
    .cta-section {
        padding: 20px 10px;
        /* Diminui o espaçamento geral da seção */
    }
}