/* ============================================================
   BDIBBS — responsive.css
   Media queries do portal (1024 / 768 / 480)
   ============================================================ */

/* ---------- ≤ 1024px ---------- */
@media (max-width: 1024px) {
    .featured-grid { grid-template-columns: 1fr; }
    .featured-side { max-width: 640px; }
    .articles-grid { grid-template-columns: repeat(2, 1fr); }
    .pulse-grid { grid-template-columns: repeat(2, 1fr); }
    .authors-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .sobre-grid { grid-template-columns: repeat(2, 1fr); }
    .search input { width: 180px; }
}

/* ---------- ≤ 768px ---------- */
@media (max-width: 768px) {
    .masthead { flex-wrap: wrap; }
    .search { order: 3; width: 100%; }
    .search input { width: 100%; flex: 1; }
    .menu-toggle { display: flex; }
    .categories {
        position: fixed;
        top: 0; right: -100%;
        width: min(80vw, 300px);
        height: 100vh;
        background: var(--panel);
        flex-direction: column;
        padding: 80px 26px 26px;
        gap: 8px;
        transition: right 0.3s ease;
        z-index: 40;
        overflow-y: auto;
    }
    .categories.open { right: 0; }
    .categories a { font-size: 1rem; padding: 10px 14px; }
    .articles-grid { grid-template-columns: 1fr; }
    .pulse-grid { grid-template-columns: 1fr; }
    .authors-grid { grid-template-columns: 1fr; }
    .newsletter-box { grid-template-columns: 1fr; padding: 30px; }
    .glossario-lista { grid-template-columns: 1fr; }
    .sobre-grid { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .footer-brand { grid-column: 1 / -1; }
    .section { padding: 52px 0; }
    .featured { padding: 36px 0 48px; }
}

/* ---------- ≤ 480px ---------- */
@media (max-width: 480px) {
    body { font-size: 1rem; }
    .brand-name { font-size: 1.15rem; }
    .featured-body h1 { font-size: 1.4rem; }
    .filter-btn { padding: 8px 14px; font-size: 0.75rem; }
    .most-read li { padding-left: 34px; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; }
    .newsletter-form input { min-width: 100%; }
    .btn-cyan { width: 100%; }
}
