/*
=========================================
SINGLE ARTICLE
GRENLI THEME
=========================================
*/

.grenli-single-hero{

    background:#f7f9fc;

    padding:70px 0 20px;

}

.grenli-single-header{

    max-width:900px;

    margin:0 auto 40px;

}

.grenli-single-category{

    display:inline-block;

    background:#1e66f5;

    color:#fff;

    padding:8px 18px;

    border-radius:50px;

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.5px;

    margin-bottom:20px;

}

.grenli-single-title{

    font-size:52px;

    line-height:1.15;

    font-weight:800;

    color:#0b1f44;

    margin-bottom:25px;

}

.grenli-single-meta{

    display:flex;

    flex-wrap:wrap;

    gap:25px;

    color:#6b7280;

    font-size:15px;

}

.grenli-single-meta span{

    display:flex;

    align-items:center;

    gap:8px;

}

.grenli-single-meta i{

    color:#1e66f5;

}

.grenli-single-image{

    margin-top:40px;

    border-radius:18px;

    overflow:hidden;

    box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.grenli-single-image img{

    width:100%;

    display:block;

}

/*
=========================================
RESPONSIVE
=========================================
*/

@media(max-width:992px){

    .grenli-single-title{

        font-size:40px;

    }

}

@media(max-width:768px){

    .grenli-single-hero{

        padding:50px 0;

    }

    .grenli-single-title{

        font-size:32px;

    }

    .grenli-single-meta{

        gap:15px;

        font-size:14px;

    }

}

@media(max-width:576px){

    .grenli-single-title{

        font-size:28px;

        line-height:1.25;

    }

    .grenli-single-meta{

        flex-direction:column;

        gap:10px;

    }

}

/*
=========================================
CONTENIDO DEL ARTÍCULO
=========================================
*/

.grenli-single-content{

    padding:0 0 80px;

}

.grenli-single-layout{

    display:grid;

    grid-template-columns:1fr 340px;

    gap:60px;

    align-items:start;

}

.grenli-single-article{

    width:100%;
    max-width:100%;
    min-width:0;
     background:transparent;

}

.grenli-single-article p{

    font-size:18px;

    line-height:1.9;

    color:#404040;

    margin-bottom:28px;

}

.grenli-single-article h2{

    font-size:34px;

    margin:60px 0 20px;

    color:#0b1f44;

    font-weight:700;

}

.grenli-single-article h3{

    font-size:28px;

    margin:45px 0 20px;

    color:#0b1f44;

}

.grenli-single-article ul,
.grenli-single-article ol{

    margin-bottom:25px;

    padding-left:25px;

}

.grenli-single-article li{

    margin-bottom:10px;

    line-height:1.8;

}

.grenli-single-article img{

    width:100%;

    height:auto;

    border-radius:16px;

    margin:35px 0;

}

.grenli-single-article table{

    width:100%;

    border-collapse:collapse;

    margin:35px 0;

}

.grenli-single-article table th{

    background:#1e66f5;

    color:#fff;

    padding:14px;

}

.grenli-single-article table td{

    border:1px solid #e5e7eb;

    padding:14px;

}

@media(max-width:992px){

    .grenli-single-layout{

        grid-template-columns:1fr;

    }

}

/*
====================================
SIDEBAR
====================================
*/

.grenli-single-right{

    align-self:start;

}

.grenli-sidebar-inner{

    position:sticky;

    top:30px;


}

.grenli-widget{

    background:#ffffff;

    border-radius:18px;

    padding:28px;

    margin-bottom:30px;

    box-shadow:0 10px 30px rgba(0,0,0,.06);
    
    overflow:hidden;

}

.grenli-widget h3{

    font-size:22px;

    margin-bottom:20px;

    color:#0b1f44;

    font-weight:700;

}

.grenli-toc{

    list-style:none;

    margin:0;

    padding:0;

}

.grenli-toc li{

    padding:12px 0;

    border-bottom:1px solid #ececec;

    font-size:15px;

}

.grenli-download-box{

    background:#f8f9fc;

    border-radius:14px;

    padding:20px;

}

.grenli-download-box p{

    margin:0;

    font-size:15px;

    color:#6b7280;

}

.grenli-toc a{

    display:block;

    text-decoration:none;

    color:#374151;

    transition:.25s;

    padding:6px 0;

    font-weight:500;

}

.grenli-toc a:hover{

    color:#2563eb;

    padding-left:8px;

}

/*====================================================
CONTENIDO PROFESIONAL
====================================================*/

.grenli-single-article{

    font-size:18px;

    line-height:1.95;

    color:#374151;

}

.grenli-single-article h2{

    font-size:42px;

    font-weight:800;

    color:#0F172A;

    margin-top:80px;

    margin-bottom:28px;

    position:relative;

}

.grenli-single-article h2::after{

    content:"";

    width:70px;

    height:5px;

    background:#2563EB;

    display:block;

    margin-top:15px;

    border-radius:50px;

}

.grenli-single-article h3{

    font-size:30px;

    margin-top:55px;

    margin-bottom:18px;

    color:#1E3A8A;

    font-weight:700;

}

.grenli-single-article p{

    margin-bottom:28px;

    color:#4B5563;

    text-align:justify;

}

.grenli-single-article strong{

    color:#111827;

    font-weight:700;

}

.grenli-single-article ul{

    margin:35px 0;

    padding-left:28px;

}

.grenli-single-article li{

    margin-bottom:16px;

}

.grenli-single-article img{

    width:100%;

    border-radius:20px;

    margin:45px 0;

    box-shadow:0 20px 50px rgba(0,0,0,.08);

}

/*====================================================
TABLAS
====================================================*/

.grenli-single-article table{

    width:100%;

    border-collapse:collapse;

    margin:45px 0;

    background:#fff;

    border-radius:16px;

    overflow:hidden;

    box-shadow:0 12px 35px rgba(0,0,0,.05);

}

.grenli-single-article thead{

    background:#2563EB;

    color:#fff;

}

.grenli-single-article th{

    padding:18px;

    text-align:left;

    font-size:16px;

}

.grenli-single-article td{

    padding:18px;

    border-bottom:1px solid #ECECEC;

}

/*====================================================
CAJAS
====================================================*/

.grenli-note{

    background:#EFF6FF;

    border-left:6px solid #2563EB;

    padding:25px;

    border-radius:14px;

    margin:40px 0;

}

.grenli-warning{

    background:#FEF3C7;

    border-left:6px solid #F59E0B;

    padding:25px;

    border-radius:14px;

    margin:40px 0;

}

.grenli-success{

    background:#ECFDF5;

    border-left:6px solid #10B981;

    padding:25px;

    border-radius:14px;

    margin:40px 0;
}

/*=====================================
ARTÍCULOS RELACIONADOS
=====================================*/

.grenli-related-posts{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.grenli-related-item{

    display:flex;

    gap:15px;

    text-decoration:none;

    color:inherit;

    transition:.25s;

}

.grenli-related-item:hover{

    transform:translateX(6px);

}

.grenli-related-thumb{

    width:85px;

    flex-shrink:0;

}

.grenli-related-thumb img{

    width:100%;

    height:70px;

    object-fit:cover;

    border-radius:10px;

}

.grenli-related-info{

    flex:1;

}

.grenli-related-info h4{

    font-size:15px;

    line-height:1.45;

    margin-bottom:8px;

    color:#0f172a;

}

.grenli-related-info span{

    font-size:13px;

    color:#6b7280;

}

.grenli-single-sidebar .grenli-widget:last-child{

    margin-bottom:0;

}

/*=====================================
LAYOUT PRINCIPAL
=====================================*/

.grenli-single-left{

    min-width:0;

}

.grenli-single-right{

    width:340px;

    align-self:start;

}

.grenli-sidebar-inner{

    position:sticky;

    top:30px;

}

/*=====================================
CONTENEDOR GRENLI
=====================================*/

.container-grenli{

    max-width:1320px;
    width:100%;
    margin:0 auto;
    padding:0 20px;

}

/* Separación superior del sidebar */

.grenli-single-right{

    padding-top: 100px;

}