@media (max-width: 1024px) {
  .article-layout { grid-template-columns: 1fr 300px; gap: 28px; }
  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; gap: 30px; }
}

@media (max-width: 900px) {
  .hamburger { display: inline-flex; }
  .article-layout { grid-template-columns: 1fr; }
  .sidebar { order: 2; }
}

@media (max-width: 768px) {
  body { font-size: 16px; }
  .hero { padding: 50px 0 60px; margin-bottom: 26px; }
  .hero-search { flex-direction: column; padding: 12px; }
  .hero-search button { width: 100%; }
  .visitor-counter { flex-direction: column; align-items: flex-start; }
  .footer-grid { grid-template-columns: 1fr; gap: 26px; }
  .grid-cats { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
  .grid-cards { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .container { padding: 0 14px; }
  .header-inner { height: 64px; gap: 10px; }
  .brand-name { display: none; }
  .icon-btn { width: 36px; height: 36px; font-size: 16px; }
  .section { margin: 34px 0; }
  .card-body { padding: 16px; }
  .article-body { font-size: 16px; }
  .visitor-counter .vc-stats { gap: 16px; }
}

/* Small-screen safeguards shared by blog, search and admin content. */
@media (max-width: 600px) {
  .grid-cards, .grid-cats { grid-template-columns: minmax(0, 1fr); }
  .card, .card-body, .article-layout, .article-body { min-width: 0; }
  .article-meta, .share-bar { flex-wrap: wrap; }
  .share-bar button, .share-bar a { flex: 1 1 auto; }
  .admin-main { padding: 20px 14px; }
  .admin-side { max-width: 100%; }
  .admin-side a { padding: 10px 14px; }
  table.admin-table { display: block; max-width: 100%; overflow-x: auto; }
  .filters, .search-bar form { flex-wrap: wrap; }
  .filters input, .search-bar input { min-width: 0; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

.footer-bottom-inner { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px 22px; }
.footer-bottom a { color: #c9d4e5; text-decoration: underline; text-underline-offset: 3px; }
.contact-page .form-group small { display: block; margin-top: 6px; color: var(--text-muted); }
.admin-messages-mobile { white-space: nowrap; }
@media (max-width: 480px) {
  .footer-bottom-inner { flex-direction: column; gap: 5px; }
  .contact-page form.card { padding: 18px !important; }
}