/* ===== RESPONSIVE ===== */

@media (max-width: 768px) {
    .blog-grid, #blog_section {
        grid-template-columns: 1fr;
        gap: 1.4rem;
    }

    .hero {
        padding: 2rem 1.2rem;
        margin-bottom: 2.5rem;
    }

    .hero-cta-strip {
        flex-direction: column;
        gap: 0.6rem;
        padding: 1rem 1rem;
    }

    .hero-btn {
        width: 100%;
        justify-content: center;
        padding: 0.9rem 1.4rem;
    }

    .section-header {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }

    .search-wrap {
        max-width: 100%;
    }

    .user-profile-card {
        flex-direction: column;
        align-items: stretch;
    }

    .profile-card-actions {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .single-story-body-wrap {
        padding: 1.5rem 1.2rem;
    }

    /* Chat mobile: message input bar should sit directly below navbar */
    div[class*="fixed inset-x-0 bottom-0 top-"] {
        top: var(--navbar-height) !important;
    }
}