/* 
 * CORREÇÃO V3 PARA IMAGENS DOS CARDS
 * Usando a técnica de background-image para garantir cobertura total
 */

/* Estilo específico para a grade de serviços */
.services-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* Exatamente 2 colunas */
    gap: 30px !important;
    margin-top: 30px !important;
}

/* Responsividade para telas pequenas */
@media (max-width: 768px) {
    .services-grid {
        grid-template-columns: 1fr !important; /* Uma coluna em telas pequenas */
    }
}

/* Estilo específico para os itens de serviço */
.services-grid .service-item {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    transition: transform 0.3s ease !important;
    text-decoration: none !important;
    background-color: white !important;
}

/* Estilo específico para a seção de Pacotes Populares */
.services-grid .service-image {
    width: 100% !important;
    height: 250px !important; /* Altura ajustada para os cards de pacotes */
    position: relative !important;
    background-size: cover !important;
    background-position: center center !important;
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
    overflow: hidden !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 100% !important;
}

/* Estilo geral para todos os outros cards */
.service-image {
    width: 100% !important;
    height: 350px !important;
    position: relative !important;
    background-size: cover !important;
    background-position: center !important;
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
    overflow: hidden !important;
}

/* Esconder a imagem original mas manter para acessibilidade */
.service-image img {
    opacity: 0 !important;
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* Container do card */
.service-item {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    transition: transform 0.3s ease !important;
    text-decoration: none !important;
}

/* Efeito hover */
.service-item:hover {
    transform: translateY(-5px) !important;
}

/* Conteúdo do card */
.service-content {
    padding: 20px !important;
    background: #fff !important;
}

/* Garantir que não haja margens indesejadas */
.service-image,
.service-content {
    margin: 0 !important;
}

/* Remover qualquer pseudo-elemento que possa estar interferindo */
.service-image::before,
.service-image::after {
    display: none !important;
    content: none !important;
}
