/* ==========================================
   PÁGINAS INTERNAS
========================================== */

.pagina-interna {

    width: 100%;

    animation: fadeEntrada 0.25s ease;
}

/* ==========================================
   ANIMAÇÃO
========================================== */

@keyframes fadeEntrada {

    from {

        opacity: 0;

        transform: translateY(10px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }
}

/* ==========================================
   TÍTULO PRINCIPAL
========================================== */

.pagina-titulo {

    font-family: 'Playfair Display', serif;

    font-size: 30px;

    color: var(--cor-texto-escura);

    margin-bottom: 18px;

    line-height: 1.2;

    font-weight: 700;

    text-align: center;
}

/* ==========================================
   SUBTÍTULO
========================================== */

.pagina-subtitulo {

    font-size: 16px;

    color: #666666;

    text-align: center;

    line-height: 1.7;

    margin-bottom: 28px;
}

/* ==========================================
   CARDS GERAIS
========================================== */

.pagina-card {

    background: #ffffff;

    border-radius: 18px;

    padding: 22px;

    margin-bottom: 22px;

    border: 1px solid rgba(0,0,0,0.06);

    box-shadow:
        0 4px 10px rgba(0,0,0,0.05);
}

/* ==========================================
   TÍTULO DOS CARDS
========================================== */

.pagina-card-titulo {

    font-family: 'Playfair Display', serif;

    font-size: 22px;

    color: var(--cor-texto-escura);

    margin-bottom: 14px;

    line-height: 1.3;

    font-weight: 700;
}

/* ==========================================
   TEXTO DOS CARDS
========================================== */

.pagina-card p {

    font-size: 15px;

    line-height: 1.8;

    color: #444444;

    margin-bottom: 14px;
}

/* ==========================================
   IMAGENS
========================================== */

.pagina-imagem {

    width: 100%;

    border-radius: 16px;

    margin-bottom: 18px;

    display: block;

    box-shadow:
        0 4px 14px rgba(0,0,0,0.12);
}

/* ==========================================
   BOTÕES
========================================== */

.pagina-botao {

    display: inline-block;

    margin-top: 14px;

    padding: 12px 20px;

    background: var(--barra-bg);

    border: var(--barra-border);

    border-radius: 12px;

    color: var(--cor-texto-barra);

    text-decoration: none;

    font-weight: 700;

    font-size: 14px;

    box-shadow: var(--barra-shadow);

    transition: transform 0.08s ease;
}

.pagina-botao:active {

    transform: scale(0.96);
}

/* ==========================================
   MENSAGEM FINAL
========================================== */

.mensagem-final {

    background:
        linear-gradient(
            135deg,
            #e8f5e9,
            #c8e6c9
        );

    border-radius: 22px;

    padding: 26px;

    margin-top: 30px;

    border:
        1px solid rgba(46,125,50,0.25);

    box-shadow:
        0 6px 16px rgba(0,0,0,0.08);
}

.mensagem-final p {

    font-size: 15px;

    line-height: 1.8;

    color: #2d3e2d;

    margin-bottom: 15px;
}

/* ==========================================
   RESPONSIVO
========================================== */

@media (max-width: 480px) {

    .pagina-titulo {

        font-size: 26px;
    }

    .pagina-card {

        padding: 18px;
    }

    .pagina-card-titulo {

        font-size: 20px;
    }

    .pagina-card p {

        font-size: 14px;
    }

}