/* =====================================================
   ROUTE TRACE - SINGLE POST.CSS
===================================================== */

:root{
    --primary:#479422;
    --primary-hover:#3B7F1C;
    --primary-light:#EAF5E4;
    --secondary:#2B764B;
    --secondary-hover:#225F3C;
    --light:#F8FAF8;
    --white:#FFFFFF;
    --dark:#252C34;
    --text:#3F4741;
    --border:#D7E3D8;
}


.et-single-layout{

    max-width:1400px;
    margin:60px auto;
    padding:0 20px;

    display:grid;
    grid-template-columns:2fr 380px;
    gap:45px;

}

.et-content{

    background:#ffffff;

    padding:45px;

    border-radius:18px;

    box-shadow:0 15px 40px rgba(37,44,52,.08);

}

body.single-post{

    background:var(--light);

}


.et-featured-image{

    margin:35px 0;

}

.et-featured-image img{

    width:100%;

    border-radius:18px;

    display:block;

}
/*=========================================
 SINGLE POST HEADER
==========================================*/

.et-breadcrumbs{

    font-size:15px;
    line-height:1.6;

    margin-bottom:28px;

    color:#6d7b93;

}

.et-breadcrumbs a{

    color:var(--secondary);
    text-decoration:none;
    font-weight:500;

    transition:.3s;

}

.et-breadcrumbs a:hover{

    color:var(--dark);

}

.et-post-title{

    font-size:30px;
    font-weight:800;
    line-height:1.25;

    color:var(--dark);

    margin:0 0 28px;

    letter-spacing:-1px;

}

.et-post-meta{

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:24px;

    margin-bottom:40px;

    padding-bottom:28px;

    border-bottom:1px solid var(--border);

}

.et-post-meta span{

    display:flex;

    align-items:center;

    gap:10px;

    font-size:16px;

    color:#5f6f89;

    font-weight:500;

}

.et-post-meta i{

    width:38px;
    height:38px;

    display:flex;

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

    border-radius:50%;

    background:var(--light);

    color:var(--secondary);

    font-size:15px;

}

/*=========================================
 Featured Image
==========================================*/

.et-featured-image{

    margin-bottom:45px;

}

.et-featured-image img{

    width:100%;

    display:block;

    border-radius:18px;

    box-shadow:0 18px 45px rgba(37,44,52,.10);

}

/*=========================================
 Content
==========================================*/

.et-post-content{

    font-size:18px;

    line-height:1.9;

    color:#364760;

}

.et-post-content p{

    margin-bottom:28px;

}

.et-post-content h2{

    /*font-size:34px;*/

    color:var(--dark);

    margin:60px 0 22px;

    line-height:1.3;

}

.et-post-content h3{

    /*font-size:28px;*/

    color:var(--dark);

    margin:45px 0 18px;

}

.et-post-content ul,

.et-post-content ol{

    margin:25px 0 35px 25px;

}

.et-post-content li{

    margin-bottom:12px;

}

/*=========================================
 Mobile
==========================================*/

@media(max-width:991px){

.et-post-title{

    font-size:34px;

}

}

@media(max-width:767px){

.et-breadcrumbs{

    font-size:14px;

}

.et-post-title{

    font-size:28px;

    line-height:1.35;

}

.et-post-meta{

    gap:15px;

    margin-bottom:30px;

}

.et-post-content{

    font-size:17px;

}

}
@media(max-width:991px){

.et-single-layout{

    grid-template-columns:1fr;

}

}