/* ===========================================
   AJAR Journal Description
   Modern Journal Style for OJS 3.x
=========================================== */

.journal-description{
    max-width:1200px;
    margin:50px auto;
    padding:0 20px;
    font-family:"Segoe UI",Roboto,Arial,sans-serif;
    color:#333;
    line-height:1.8;
}

.journal-description h2{
    font-size:38px;
    font-weight:700;
    color:#0b3d91;
    margin-bottom:25px;
    border-left:6px solid #1E102B;
    padding-left:18px;
}

.journal-description h3{
    margin-top:45px;
    margin-bottom:25px;
    font-size:26px;
    color:#1E102B;
    position:relative;
}

.journal-description h3:after{
    content:"";
    display:block;
    width:70px;
    height:3px;
    background:#1E102B;
    margin-top:10px;
    border-radius:10px;
}

.journal-description p{
    font-size:17px;
    text-align:justify;
    margin-bottom:20px;
    color:#555;
}

.journal-description strong{
    color:#1E102B;
}

.journal-description hr{
    border:none;
    height:1px;
    background:#e6e6e6;
    margin:45px 0;
}

/* ===========================================
   Statistics
=========================================== */

.journal-stats{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:25px;
    margin-top:30px;
}

.stat-box{

    background:#fff;
    border-radius:16px;
    padding:35px 20px;
    text-align:center;
    box-shadow:0 8px 30px rgba(0,0,0,.08);
    transition:.35s;
    border-top:4px solid #1E102B;
}

.stat-box:hover{

    transform:translateY(-8px);
    box-shadow:0 18px 40px rgba(0,0,0,.12);

}

.stat-box h2{

    font-size:42px;
    color:#1E102B;
    margin-bottom:10px;
    font-weight:700;

}

.stat-box p{

    margin:0;
    font-size:15px;
    color:#666;
    font-weight:600;

}

/* ===========================================
   Why Publish List
=========================================== */

.journal-description ul{

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:18px;
    list-style:none;
    padding:0;
    margin-top:25px;

}

.journal-description ul li{

    background:#f8fbff;
    border-left:4px solid ;
    border-radius:10px;
    padding:16px 18px;
    box-shadow:0 4px 12px rgba(0,0,0,.04);
    transition:.3s;

}

.journal-description ul li:hover{

    background:#eef6ff;
    transform:translateX(6px);

}

.journal-description ul li:before{

    content:"✓";
    color:#28a745;
    font-weight:bold;
    margin-right:12px;

}

/* ===========================================
   Research Areas
=========================================== */

.journal-description p:last-of-type{

    background:#f7f9fc;
    padding:25px;
    border-radius:12px;
    border:1px solid #e6edf5;

}

/* ===========================================
   Table
=========================================== */

.journal-description table{

    width:100%;
    border-collapse:collapse;
    margin-top:30px;
    overflow:hidden;
    border-radius:12px;
    box-shadow:0 5px 25px rgba(0,0,0,.06);

}

.journal-description table td{

    padding:16px;
    border:1px solid #ececec;
    font-size:15px;

}

.journal-description table tr:nth-child(odd){

    background:#fafafa;

}

.journal-description table tr:hover{

    background:#eef6ff;

}

.journal-description table td:first-child{

    width:240px;
    font-weight:700;
    color:#0b3d91;
    background:#f5f9ff;

}

/* ===========================================
   Responsive
=========================================== */

@media(max-width:992px){

.journal-description h2{

font-size:30px;

}

.journal-description h3{

font-size:22px;

}

.stat-box h2{

font-size:34px;

}

}

@media(max-width:768px){

.journal-description{

padding:0 15px;

}

.journal-description p{

font-size:16px;

}

.journal-description table{

display:block;
overflow-x:auto;

}

.stat-box{

padding:25px 15px;

}

}

@media(max-width:480px){

.journal-description h2{

font-size:26px;

}

.journal-description h3{

font-size:20px;

}

.stat-box h2{

font-size:28px;

}

}
/*==========================
Homepage About
==========================*/

.homepage-about{

    display:flex;
    flex-wrap:wrap;
    gap:40px;
    align-items:flex-start;
    margin:60px auto;
    max-width:1300px;
    
    }
    
    .about-left{
    
    flex:2;
    min-width:350px;
    
    }
    
    .about-right{
    
    flex:1;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:20px;
    
    }
    
    .about-left h2{
    
    font-size:42px;
    font-weight:700;
    color:#1E102B;
    margin-bottom:25px;
    
    }
    
    .about-left p{
    
    font-size:18px;
    line-height:1.9;
    color:#555;
    text-align:justify;
    
    }
    
    .about-btn{
    
    display:inline-block;
    margin-top:20px;
    padding:14px 35px;
    background:#1E102B;
    color:#fff;
    border-radius:40px;
    text-decoration:none;
    font-weight:600;
    transition:.3s;
    
    }
    
    .about-btn:hover{
    
    background:#ff6a3d;
    transform:translateY(-3px);
    
    }
    
    /*==========================
    Info Cards
    ==========================*/
    
    .info-card{
    
    background:#fff;
    padding:30px;
    border-radius:15px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.3s;
    
    }
    
    .info-card:hover{
    
    transform:translateY(-8px);
    
    }
    
    .info-card h3{
    
    font-size:18px;
    margin-bottom:10px;
    color:#1E102B;
    
    }
    
    .info-card span{
    
    font-size:16px;
    color:#666;
    
    }
    
    /*==========================
    Features
    ==========================*/
    
    .homepage-features{
    
    margin:80px auto;
    max-width:1300px;
    
    }
    
    .homepage-features h2{
    
    font-size:40px;
    text-align:center;
    margin-bottom:50px;
    color:#1E102B;
    
    }
    
    .feature-grid{
    
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:30px;
    
    }
    
    .feature-box{
    
    padding:35px;
    background:#fff;
    border-radius:18px;
    box-shadow:0 12px 30px rgba(0,0,0,.08);
    transition:.3s;
    
    }
    
    .feature-box:hover{
    
    transform:translateY(-8px);
    
    }
    
    .feature-box h3{
    
    font-size:24px;
    margin-bottom:18px;
    color:#1E102B;
    
    }
    
    .feature-box p{
    
    font-size:17px;
    line-height:1.8;
    color:#666;
    
    }
    
    /*==========================
    Responsive
    ==========================*/
    
    @media(max-width:900px){
    
    .homepage-about{
    
    display:block;
    
    }
    
    .about-right{
    
    margin-top:40px;
    
    }
    
    }