/* --- Core Layout --- */
.wppui-wrapper.layout-2 { display: flex; align-items: flex-start; gap: 30px; margin: 40px 0; box-sizing: border-box; }
.wppui-wrapper.layout-2 * { box-sizing: border-box; }
.wppui-main { flex-grow: 1; display: flex; flex-direction: column; min-width: 0; }
.wppui-wrapper.layout-2 a { text-decoration: none !important; color: inherit; display: block; }

/* --- SIDEBAR STICKY LOGIC (DESKTOP ONLY, STRICTLY HIDDEN ON MOBILE) --- */
.wppui-sidebar { 
    display: none !important; 
} 

@media (min-width: 1025px) { 
    .wppui-sidebar { 
        display: block !important; 
        width: 160px; 
        flex-shrink: 0; 
        position: sticky; 
        top: 20px; 
        height: fit-content; 
    } 
}

/* --- Top Section (Hero + Sidebar) --- */
.wppui-l2-top-section { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 768px) {
    .wppui-l2-top-section { grid-template-columns: 2fr 1fr; align-items: stretch; }
}

/* Base Card Style (Used in Hero and Grid) */
.wppui-l2-card-link { display: flex; flex-direction: column; width: 100%; height: 100%; transition: opacity 0.2s; }
.wppui-l2-card-link:hover { opacity: 0.9; }

/* Hero Flex Fixes */
.wppui-l2-hero { height: 100%; }
.wppui-l2-hero .wppui-l2-img-container { 
    height: 300px; 
    width: 100%; 
    overflow: hidden; 
}
@media (min-width: 768px) {
    .wppui-l2-hero .wppui-l2-img-container { flex-grow: 1; height: auto; min-height: 250px; }
}
.wppui-l2-hero .wppui-l2-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wppui-l2-noimg { background: #eee; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #999; }

/* The Dark Content Box attached below images */
.wppui-l2-content-box {
    padding: 20px; 
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Hero Specific Tweaks */
.wppui-l2-hero-title { font-size: 24px !important; font-weight: 800; margin: 0 0 10px 0; line-height: 1.2; }
.wppui-l2-excerpt { font-size: 14px; margin: 0; line-height: 1.4; opacity: 0.9; }

/* --- Sidebar List (Latest News) --- */
.wppui-l2-news-sidebar { display: flex; flex-direction: column; height: 100%; }
.wppui-l2-sidebar-header {
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    color: #111;
    padding-bottom: 10px;
    margin-bottom: 0;
    border-top: 2px solid #0066cc; 
    border-bottom: 1px solid #ccc; 
    padding-top: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.wppui-l2-star { background: #ccc; color: #fff; border-radius: 50%; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; }

.wppui-l2-sidebar-list { display: flex; flex-direction: column; flex-grow: 1; }
.wppui-l2-list-link { 
    padding: 15px 0; 
    border-bottom: 1px dotted #ccc; 
}
.wppui-l2-list-link:last-child { border-bottom: none; }
.wppui-l2-list-title { font-size: 15px; font-weight: 700; color: #333; margin: 0 0 5px 0; line-height: 1.3; }
.wppui-l2-list-excerpt { font-size: 13px; color: #666; margin: 0; line-height: 1.4; }
.wppui-l2-list-link:hover .wppui-l2-list-title { color: #0066cc; }

/* --- Bottom Grid (Responsive) --- */
.wppui-l2-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); 
    gap: 20px;
}

.wppui-l2-grid-item { display: flex; flex-direction: column; height: 100%; }
.wppui-l2-grid-item .wppui-l2-img-container { height: 160px; flex-shrink: 0; width: 100%; overflow: hidden; }
.wppui-l2-grid-item .wppui-l2-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wppui-l2-grid-item .wppui-l2-content-box { flex-grow: 1; justify-content: flex-start; padding: 15px; }
.wppui-l2-grid-item .wppui-l2-title { font-weight: 700; margin: 0; line-height: 1.3; }

/* --- Load More Button --- */
.wppui-load-more-wrap { text-align: center; margin-top: 30px; width: 100%; }
.wppui-btn { background: #3a3a3a; color: #fff; border: none; padding: 14px 35px; font-size: 14px; font-weight: bold; cursor: pointer; text-transform: uppercase; transition: background 0.2s; }
.wppui-btn:hover { background: #111; }

/* --- Specific Category Section --- */
.wppui-l2-cat-section { margin-top: 50px; border-top: 2px solid #eaeaea; padding-top: 30px; }
.wppui-l2-cat-header { 
    font-weight: 800; 
    color: #111; 
    margin: 0 0 25px 0; 
    line-height: 1.2; 
    border-left: 5px solid #0066cc; 
    padding-left: 12px; 
}
.wppui-l2-cat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); 
    gap: 20px;
}

/* --- Mobile Overrides --- */
@media (max-width: 767px) {
    .wppui-wrapper.layout-2 { margin: 20px 0; gap: 15px; }
    .wppui-l2-hero-title { font-size: 20px !important; }
    .wppui-l2-content-box { padding: 15px; }
    .wppui-l2-sidebar-header { padding-top: 8px; margin-bottom: 5px; }
    .wppui-btn { width: 100%; padding: 15px; }
    .wppui-l2-cat-section { margin-top: 35px; padding-top: 20px; }
}