/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
/* Styling Post Utama (Full Width) */
.page-header{
    margin-bottom:30px;
}
.page-header h1{
    margin: 0;
}
.featured-post-full {
    margin-bottom: 30px;
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 3 Kolom */
    gap: 30px;
    align-items: center;
}

.featured-post-full img {
    height: auto;
    border-radius: 8px;
}
.post-content h2,
.post-content h3{
    margin-top: 0;
}
.post-content .meta-cat a{
    text-decoration: none;
}
.post-content .entry-meta{
    display: flex;
    gap: 15px;
}
.post-content .post-excerpt{
    margin-bottom: 20px;
}
.post-content .entry-meta .author-avatar{
    width: 44px;
    height: 44px;
    border-radius: 50%;
}
.post-content .entry-meta span,
.post-content .entry-meta .meta-text{
    display: flex;
    flex-direction: column;
    color:#314158;
}
.post-content h2 a{
    margin-top: 0;
    font-size: 30px;
    line-height: 45px;
    color: #261461;
    font-weight: 500;
}
/* Styling Grid (3 Kolom) */
.post-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 Kolom */
    gap: 16px;
}
.post-content h3 a{
    margin-top: 0;
    font-size: 20px;
    line-height: 30px;
    color: #261461;
    font-weight: 500;
}
/* Limit judul maksimal 2 baris */
.entry-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Angka baris yang diinginkan */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4; /* Sesuaikan tinggi baris agar rapi */
    max-height: 2.8em; /* line-height dikali 2 */
    text-decoration: none;
}

/* Responsive: Jadi 1 kolom di HP */
@media (max-width: 768px) {
    .post-grid {
        grid-template-columns: 1fr;
    }
    .featured-post-full {
        grid-template-columns: 1fr;
    }
}

.grid-item img {
    max-width: 100%;
    height: auto;
}
.category .site-main{
    padding: 30px 0 50px 0;
}
@media (min-width: 1600px) {
    .page-header .entry-title, .site-footer .footer-inner, .site-footer:not(.dynamic-footer), .site-header .header-inner, .site-header:not(.dynamic-header), body:not([class*=elementor-page-]) .site-main {
        max-width: 1440px;
    }
}
.category .pagination{
    justify-content: center;
}
.category .pagination .nav-links{
    display: flex;
    gap: 15px;
}
.category .pagination .nav-links .page-numbers{
    color: #020618;
    padding: 8px 16px;
    border-radius: 8px;
}
.category .pagination .nav-links .page-numbers.next,
.category .pagination .nav-links .page-numbers.prev{
    border: 1px solid #CAD5E2;
}
.category .pagination .nav-links .page-numbers.current,
.category .pagination .nav-links a.page-numbers:hover{
    background-color: #F1F5F9;
}

.main-cat-wrapper { display: flex; flex-direction: column; gap: 60px; margin: 20px 0; }
.category-section { }
.category-section:last-child { border-bottom: none; }

.category-title { 
    margin: 0px; 
    font-size: 30px;
    line-height: 45px;
    color: #020618;
}

.category-description {
    color: #62748E;
}

.post-item-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    padding: 30px 0;
}

.post-card {
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.post-thumb {
    transition: opacity 0.3s;
}
.post-thumb:hover { opacity: 0.8; }

.btn-selengkapnya {
    display: inline-block;
    background: #ffffff;    
    padding: 14px 20px;
    border-radius: 8px;
    text-decoration: none !important;
    font-weight: 500;
    font-size: 1rem;
    border:1px solid #7458EE;
    padding-right: 40px;
}
.btn-container .btn-selengkapnya{
    color: #020618;
    display: flex;
    gap: 10px;
    width: max-content;
    align-items: center;
    position: relative;
}
.btn-container .btn-selengkapnya:hover svg{
    fill: #7458EE;
}
.btn-container .btn-selengkapnya:hover { color: #7458EE; }
.btn-container .btn-selengkapnya svg{
    position: absolute;
    top: 16px;
    right: 16px;
}
@media (max-width: 992px) {
    .post-item-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .post-item-grid { grid-template-columns: 1fr; }
    .category-title { font-size: 1.5rem; }
}