body {
    background-color: #000; /* Fundo preto */
    color: #fff; /* Texto branco para contraste (opcional) */
    margin: 0; /* Remove as margens padrão */
    padding-top: 50px; /* Espaço entre o topo da página e o conteúdo */
    font-family: Arial, sans-serif; /* Define uma fonte padrão (opcional) */
}

.image-container {
    display: flex;
    flex-direction: column; /* Organização em coluna */
    align-items: center; /* Centraliza as imagens horizontalmente */
    gap: 20px; /* Espaçamento entre as imagens */
    margin: 20px; /* Espaçamento ao redor do container (opcional) */
}

.image-container a {
    display: flex; /* Garante que o link seja tratado como bloco flexível */
    justify-content: center; /* Centraliza o conteúdo (imagem) dentro do link */
    text-decoration: none; /* Remove sublinhados (opcional) */
}

.image-container img {
    width: 40%; /* Largura padrão de 50% */
    height: auto; /* Mantém a proporção das imagens */
    max-width: 100%; /* Garante que não exceda o tamanho do container */
    border-radius: 15px; /* Define cantos arredondados */
    transition: 0.3s ease-in-out; /* Adiciona uma transição suave para hover (opcional) */
    box-shadow: 0 0 12px rgba(255, 51, 0, 0.2); /* Brilho inicial dourado */
}

.image-container img:hover {
    transform: scale(1.05); /* Amplia a imagem levemente em 5% */
    border-radius: 20px; /* Opcional: aumenta o arredondamento no hover */
}

/* Estilo responsivo */
@media (max-width: 768px) {
    .image-container img {
        width: 90%; /* Largura de 80% em telas menores */
    }
}
