/* ============================================
   Yinxinglu - Responsive
   ============================================ */

/* Tablet (≤ 1024px) */
@media (max-width: 1024px) {
    :root { --sidebar-w: 260px; }
    .content-layout { gap: 1.5rem; }
    .posts-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
    .footer-widgets-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-widgets-grid .footer-col:last-child { grid-column: 1 / -1; }
    .hero-title { font-size: 2rem; }
}

/* Mobile (≤ 768px) */
@media (max-width: 768px) {
    /* Layout */
    .content-layout { flex-direction: column; }
    .sidebar { width: 100%; }

    /* Header */
    .site-header .primary-nav { display: none; }
    .menu-toggle { display: flex; }

    /* Hero */
    .hero-section { padding: 2.5rem 1rem; }
    .hero-title { font-size: 1.75rem; }
    .hero-subtitle { font-size: 1rem; }
    .hero-actions { flex-direction: column; align-items: center; }
    .hero-actions .btn { width: 100%; max-width: 280px; }

    /* Posts */
    .posts-grid { grid-template-columns: 1fr; gap: 1rem; }
    .post-card-title { font-size: 1.1rem; }

    /* Single */
    .single-post-content, .single-page-content { padding: 1.25rem; }
    .post-title { font-size: 1.5rem; }
    .post-meta-info { gap: 0.75rem; font-size: 0.8rem; }
    .post-body { font-size: 1rem; }

    /* Post Nav */
    .post-nav-links { grid-template-columns: 1fr; }

    /* Comments */
    .comment-list .children { padding-left: 1rem; }

    /* Footer */
    .footer-widgets-grid { grid-template-columns: 1fr; gap: 1.5rem; }
    .footer-widgets-grid .footer-col:last-child { grid-column: 1; }

    /* Back to Top */
    .back-to-top { bottom: 20px; right: 20px; width: 40px; height: 40px; }

    /* Pagination */
    .pagination a, .pagination span { min-width: 34px; height: 34px; font-size: 0.8rem; }

    /* 404 */
    .error-404-num { font-size: 4rem; }
    .error-404-icon { width: 60px; height: 60px; }

    /* Breadcrumbs */
    .breadcrumbs { font-size: 0.75rem; }
}

/* Small Mobile (≤ 480px) */
@media (max-width: 480px) {
    .container { padding: 0 14px; }
    .hero-title { font-size: 1.5rem; }
    .section-title { font-size: 1.25rem; }
    .single-post-content, .single-page-content { padding: 1rem; }
}