body{
    font-family: 'Playfair Display', serif;
}

.topo-0{
    padding: 40px 0;
    background-color: #111316;
    min-height: 100vh;
    background-image: url(../imagens/fundo-pc2.jpg);
    background-position: bottom;
    background-size: cover;
    background-repeat: no-repeat;
    align-items: center;
    align-content: center;
}

.topo-1{
    padding: 15px 0 15px 0;
    background-color: #111316;
}

.img-mobile{
    width: 100%;
    height: auto;
}

.img-logo{
    display: block;
    width: 70%;
    height: auto;
    margin: -100px auto 0 auto;
}

.titulo{
    font-size: 3.7rem; /* Ajuste o tamanho conforme necessário */
    text-align: left;
    line-height: 1.1;
    font-weight: 400;
    margin: 0;
    padding: 0px;
    margin-bottom: 20px;
    color: #f2f2f2;
    /* Criação do efeito metálico dourado 
    background: linear-gradient(
        to bottom, 
        #Fff 0%,   
        #f1f1f1 45%,  
        #f2f2f2 100%  
    );*/
    
    /* Aplica o gradiente apenas no texto 
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;*/ /* Fallback para navegadores antigos */
}

/* Deixa o "e" da segunda linha em itálico, como na imagem original */
.titulo b{
    color: #C19245;
}

.subtitulo{
    color: #FFF;
    font-size: 22px;
    line-height: 1.5;
    margin-top: 0;
    margin-bottom: 40px;
}

.botao-vip {
    /* Usando uma fonte sem serifa para o botão para dar contraste e modernidade */
    font-family: system-ui, -apple-system, sans-serif; 
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 2px; /* Espaçamento elegante entre as letras */
    
    /* Cores e Fundo */
    color: #ffffff; /* Texto branco */
    background: linear-gradient(135deg, #C19245 0%, #774B15 100%); /* Fundo dourado/bronze */
    
    /* Formato e Espaçamento */
    padding: 18px 45px;
    border-radius: 50px; /* Bordas arredondadas (estilo pílula) */
    
    /* Efeitos visuais */
    box-shadow: 0 8px 20px rgba(119, 75, 21, 0.25); /* Sombra suave com o tom do bronze */
    transition: all 0.3s ease; /* Transição suave para o hover */
}

/* Efeito ao passar o mouse por cima do botão */
.botao-vip:hover {
    transform: translateY(-3px); /* Levanta o botão levemente */
    box-shadow: 0 12px 25px rgba(119, 75, 21, 0.4); /* Aumenta a sombra */
    /* Inverte levemente o gradiente para dar um brilho */
    background: linear-gradient(135deg, #F8E1AC 0%, #C19245 100%); 
    color: #4A2C11; /* Muda a letra para marrom escuro para manter a leitura no fundo claro */
}

.img-rodape{
    height: 50px;
    width: auto;
}

.texto-rodape{
    color: #a0a0a0;
    font-size: 16px;
    line-height: 1.5;
    margin-top: 20px;
}

@media screen and (max-width: 600px) {

    .botao-vip {
        display: table;
        text-align: center;
        padding: 15px 35px;
        font-size: 1rem;
        margin: 0 auto;
    }

    .subtitulo{
        text-align: center;
        font-size: 18px;
    }

    .topo-0{
        background-image: none;
        padding-top: 0;
    }

    .titulo{
        font-size: 2.3rem;
        text-align: center;
        margin-top: 20px;
    }

}