/*!
Theme Name: Kadence Child
Theme URI: https://www.kadencewp.com/kadence-theme/
Template: kadence
Author: Kadence WP
Author URI: https://www.kadencewp.com/
Description: A child theme for the Kadence Theme.
Version: 1.0.0
License: GNU General Public License v3.0 (or later)
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: kadence-child
*/

/* Theme customization starts here
-------------------------------------------------------------- */

/* ==========================================================
   ARTIGOS - HOME
========================================================== */

.stbg-artigos-home{

    padding:40px 0;

    background:#ffffff;
}


/* ==========================================================
   CABEÇALHO
========================================================== */

.stbg-artigos-cabecalho{

    max-width:760px;

    margin:0 auto 60px;

    text-align:center;
}

.stbg-artigos-sobretitulo{

    display:inline-block;

    margin-bottom:12px;

    color:#8f1519;

    font-size:13px;
    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;
}

.stbg-artigos-cabecalho h2{

    margin:0;

    color:#1f1f1f;

    font-size:clamp(34px,4vw,46px);

    line-height:1.2;
}

.stbg-artigos-cabecalho p{

    

    margin:18px auto 0;

    color:#666;

    font-size:17px;

    line-height:1.8;
}


/* ==========================================================
   GRID
========================================================== */

.stbg-artigos-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;
}


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

.stbg-artigo-card{

    display:flex;

    flex-direction:column;

    background:#fff;

    border:1px solid #e8e8e8;

    border-radius:14px;

    transition:.30s;

    overflow:hidden;
}

.stbg-artigo-card:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 45px rgba(0,0,0,.08);
}


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

.stbg-artigo-conteudo{

    display:flex;

    flex-direction:column;

    height:100%;

    padding:35px;
}


/* ==========================================================
   ÍCONE
========================================================== */

.stbg-artigo-icone{

    width:72px;
    height:72px;

    display:flex;

    align-items:center;
    justify-content:center;

    margin-bottom:25px;

    border-radius:50%;

    background:#8f1519;

    color:#fff;

    font-size:28px;
}


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

.stbg-artigo-conteudo h3{

    flex:1;

    margin:0;

    color:#222;

    font-size:24px;

    line-height:1.4;
}

/* ==========================================================
   DOCUMENTO
========================================================== */

.stbg-artigo-documento{

    margin-bottom:28px;
}

.stbg-artigo-folha{

    position:relative;

    width:70px;
    height:86px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#ffffff;

    border-radius:8px;

    border:2px solid #ececec;

    box-shadow:
        0 10px 25px rgba(0,0,0,.06);

    transition:.35s;
}

/* dobra da folha */

.stbg-artigo-folha::before{

    content:"";

    position:absolute;

    top:-2px;
    right:-2px;

    width:18px;
    height:18px;

    background:#f3f3f3;

    border-left:2px solid #ececec;
    border-bottom:2px solid #ececec;

    clip-path:polygon(
        100% 0,
        0 0,
        100% 100%
    );
}

.stbg-artigo-folha i{

    color:#8f1519;

    font-size:30px;
}

.stbg-artigo-card:hover
.stbg-artigo-folha{

    transform:
        rotate(-4deg)
        translateY(-4px);

    box-shadow:
        0 18px 40px rgba(0,0,0,.12);
}


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

.stbg-artigo-botao{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-top:35px;

    padding:16px 20px;

    border-radius:8px;

    background:#2d2d2d;

    color:#fff;

    text-decoration:none;

    text-transform:uppercase;

    font-size:13px;

    font-weight:700;

    letter-spacing:.4px;

    transition:.30s;
}

.stbg-artigo-botao:hover{

    background:#8f1519;

    color:#fff;
}

.stbg-artigo-botao i{

    transition:.30s;
}

.stbg-artigo-botao:hover i{

    transform:translateX(5px);
}


/* ==========================================================
   TABLET
========================================================== */

@media(max-width:1024px){

    .stbg-artigos-grid{

        grid-template-columns:repeat(2,1fr);
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media(max-width:767px){

    .stbg-artigos-home{

        padding:60px 0;
    }

    .stbg-artigos-cabecalho{

        padding:0 20px;

        margin-bottom:40px;
    }

    .stbg-artigos-grid{

        grid-template-columns:1fr;

        gap:20px;
    }

    .stbg-artigo-conteudo{

        padding:28px;
    }

    .stbg-artigo-conteudo h3{

        font-size:22px;
    }

}