/*
Plugin Name: Talanoa API Posts
Description: Estilos dos cards de posts do Política por Inteiro
Version: 2.4.1-dev
*/


/* ======================================
   CARD PRINCIPAL
====================================== */

.ppi-post {

    display: flex;

    flex-direction: row;

    gap: 40px;

    align-items: center;

    margin-bottom: 48px;

    padding-bottom: 48px;

    border-bottom: 1px solid #e6e6e6;

}



/* ======================================
   CONTEÚDO
====================================== */

.ppi-conteudo {

    flex: 1;

    order: 1;

}



/* ======================================
   IMAGEM
====================================== */

.ppi-imagem {

    width: 42%;

    height: 260px;

    order: 2;

    overflow: hidden;

    border-radius: 16px;

}



.ppi-imagem a {

    display: block;

    width: 100%;

    height: 100%;

}



.ppi-imagem img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    border-radius: 16px !important;

    transition: transform .3s ease;

}



/* efeito hover imagem */

.ppi-imagem:hover img {

    transform: scale(1.04);

}



/* ======================================
   CHAPÉU
====================================== */

.ppi-chapeu {

    margin: 0 0 12px;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 0.08em;

    text-transform: uppercase;

    line-height: 1.4;

}



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

.ppi-titulo {

    margin: 0 0 14px;

    font-size: 32px;

    line-height: 1.2;

}



.ppi-post .ppi-titulo a {

    color: #1f2937 !important;

    text-decoration: none;

}



.ppi-post .ppi-titulo a:hover {

    color: #164638 !important;

    text-decoration: underline;

}



/* ======================================
   AUTOR E DATA
====================================== */

.ppi-meta {

    margin: 0 0 18px;

    font-size: 14px;

    line-height: 1.5;

}



/* ======================================
   RESUMO
====================================== */

.ppi-resumo {

    margin-bottom: 24px;

    font-size: 16px;

    line-height: 1.6;

}



/* ======================================
   BOTÃO
====================================== */

.ppi-link {

    display: inline-block;

    padding: 12px 24px;

    border-radius: 30px;

    background-color: #1f5c4a;

    color: #ffffff !important;

    text-decoration: none;

    font-size: 15px;

    font-weight: 600;

    transition: all .3s ease;

}



.ppi-link:hover {

    background-color: #164638;

    color: #ffffff !important;

    transform: translateY(-2px);

}



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

@media (max-width: 768px) {


    .ppi-post {

        flex-direction: column;

        gap: 24px;

    }


    .ppi-imagem {

        width: 100%;

        height: 240px;

        order: 1;

    }


    .ppi-conteudo {

        order: 2;

    }


    .ppi-titulo {

        font-size: 26px;

    }


}