/* =========================================================
   BuyNewLink AI — Estilos responsive
   Cargado después de style.css y main.css
   ========================================================= */

/* Tablet */
@media (max-width: 1024px) {
  .bnl-hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .bnl-grid.grid-4 { grid-template-columns: repeat(3, 1fr); }
  .bnl-footer-grid { grid-template-columns: repeat(2, 1fr); }
  .bnl-footer-cols { grid-template-columns: repeat(2, 1fr); }
  h1 { font-size: 42px; }
  h2 { font-size: 34px; }
}

/* Móvil */
@media (max-width: 768px) {
  .bnl-nav, .bnl-header-cta { display: none; }
  .bnl-burger { display: inline-flex; }
  .bnl-grid.grid-4,
  .bnl-grid.grid-3,
  .post-grid { grid-template-columns: 1fr; }
  .bnl-stat-cards { grid-template-columns: repeat(2, 1fr); }
  .bnl-footer-grid,
  .bnl-footer-cols { grid-template-columns: 1fr; }
  .bnl-hero-media { order: -1; }
  h1 { font-size: 34px; }
  h2 { font-size: 28px; }
  .bnl-section { padding-block: 56px; }
  .bnl-searchbar { flex-wrap: wrap; }
  .bnl-searchbar .bnl-btn { width: 100%; }
}

/* Pantallas pequeñas */
@media (max-width: 480px) {
  .bnl-stat-cards { grid-template-columns: 1fr; }
  .brand-grid { grid-template-columns: repeat(2, 1fr); }
}