/* Responsive CSS */
@media (max-width: 1024px) {
    .container.with-sidebar { flex-direction: column; }
    .sidebar { width: 100%; }
    .featured-grid { grid-template-columns: 1fr; }
    .featured-grid .featured-card:first-child { grid-row: auto; }
    .featured-card:first-child img { min-height: 240px; }
}

@media (max-width: 768px) {
    .main-nav {
        display: none;
        position: absolute;
        top: 64px;
        left: 0;
        right: 0;
        background: var(--bg);
        flex-direction: column;
        padding: 16px;
        border-bottom: 1px solid var(--border);
        box-shadow: var(--shadow-md);
    }

    .main-nav.open { display: flex; }
    .menu-toggle { display: block; }
    .hero { padding: 48px 16px 40px; }
    .hero h1 { font-size: 30px; }
    .hero p { font-size: 16px; }
    .post-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
    .featured-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .single-post { padding: 0 0 32px; }
    .single-header h1 { font-size: 28px; }
    .post-hero { height: 260px; }
    .pagination { flex-wrap: wrap; }
    .sidebar { margin-top: 32px; }
    .author-header { flex-direction: column; text-align: center; }
    .author-avatar { margin: 0 auto 16px; }
    .related-grid { grid-template-columns: repeat(2, 1fr); }
    .container.with-sidebar { padding-top: 24px; padding-bottom: 40px; }
}

@media (max-width: 480px) {
    .container { padding: 0 16px; }
    .hero h1 { font-size: 26px; }
    .hero-search { flex-direction: column; }
    .hero-search input { border-radius: var(--radius-md); border-right: 2px solid var(--border); }
    .hero-search button { border-radius: var(--radius-md); }
    .search-form { flex-direction: column; }
    .search-form input { border-radius: var(--radius-md); border-right: 2px solid var(--border); }
    .search-form button { border-radius: var(--radius-md); }
    .footer-grid { grid-template-columns: 1fr; }
    .post-grid { grid-template-columns: 1fr; }
    .related-grid { grid-template-columns: 1fr; }
    .lang-switcher .lang-dropdown { right: 0; left: auto; }
    .post-card .post-image img { height: 180px; }
    .single-header h1 { font-size: 24px; }
    .post-body { font-size: 16px; }
    .page-header h1 { font-size: 26px; }
    .breadcrumb { font-size: 13px; }
}