/* ============================================================
   Responsive
   ============================================================ */

/* Tablet */
@media (max-width: 768px) {
  .wrap { padding: 0 16px; }

  .navbar-inner { padding: 0 16px; }
  .navbar-nav li a { padding: 5px 10px; font-size: 14px; }
  .navbar-search { display: none; }

  .hero { padding: 40px 0 32px; }
  .hero-name { font-size: 22px; }

  .post-item { padding: 11px 10px; margin: 0 -10px; }
  .post-item-cat { display: none; }

  .footer-inner { padding: 0 16px; }
}

/* Mobile */
@media (max-width: 480px) {
  .navbar-inner { gap: 2px; }
  .navbar-logo-text { display: none; }
  .navbar-nav li a { padding: 5px 9px; font-size: 13px; }

  .hero { padding: 32px 0 24px; }
  .hero-name { font-size: 20px; }
  .hero-avatar { width: 48px; height: 48px; margin-bottom: 14px; }
  .hero-stats { gap: 14px; }

  .post-title { font-size: 21px; }
  .post-meta { gap: 10px; }
  .post-meta-sep { display: none; }

  .post-content { font-size: 15px; }
  .post-content h1 { font-size: 1.45em; }
  .post-content h2 { font-size: 1.2em; }
  .post-content pre { padding: 14px 16px; font-size: 12px; }
  figure.highlight pre { padding: 14px 16px; }

  .category-grid { grid-template-columns: 1fr 1fr; }

  .page-header { padding: 32px 0 24px; }
  .page-title { font-size: 20px; }
}