/*
Talanoa API Posts DEV
Home - Bloco Post
Version: 3.0-dev
*/

/* ===========================
BLOCO POST
=========================== */

.ppi-home-post {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 32px;
width: 100%;
margin-bottom: 40px;
}

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

.ppi-home-post-imagem {
width: 42%;
flex-shrink: 0;
overflow: hidden;
border-radius: 18px;
}

.ppi-home-post-imagem-link {
display: block;
overflow: hidden;
border-radius: 18px;
}

.ppi-home-post-imagem img {
display: block;
width: 100%;
height: auto;
border-radius: 18px;
}

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

.ppi-home-post-conteudo {
width: 58%;
padding-top: 2px;
}

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

.ppi-home-post-chapeu {
margin: 0 0 10px;
font-family: "Roobert", Arial, sans-serif;
font-size: 14px;
font-weight: 700;
letter-spacing: 0.5px;
line-height: 1.2;
text-transform: uppercase;
color: #666;
}

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

.ppi-home-post-titulo {
margin: 0 0 16px;
line-height: 1.15;
}

.ppi-home-post-titulo a {
font-family: "Roobert", Arial, sans-serif;
font-size: 30px;
line-height: 1.15;
font-weight: 700;
color: #222;
text-decoration: none;
}

.ppi-home-post-titulo a:hover {
color: #222;
}

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

.ppi-home-post-resumo {
margin: 0 0 20px;
font-family: "Roobert", Arial, sans-serif;
font-size: 16px;
line-height: 1.55;
color: #333;
}

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

.ppi-home-post-botao {
display: inline-block;
margin-top: 4px;
padding: 11px 20px;
border-radius: 8px;
background-color: #000;
color: #fff !important;
font-family: "Roobert", Arial, sans-serif;
font-size: 15px;
font-weight: 600;
line-height: 1;
text-decoration: none !important;
transition: opacity 0.2s ease;
}

.ppi-home-post-botao:hover {
background-color: #000;
color: #fff !important;
opacity: 0.8;
}

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

@media (max-width: 768px) {


.ppi-home-post {
    flex-direction: column;
    gap: 22px;
}

.ppi-home-post-imagem,
.ppi-home-post-conteudo {
    width: 100%;
}

.ppi-home-post-titulo a {
    font-size: 26px;
}


}
