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

@media (max-width: 1200px){
  .emoji-grid{ grid-template-columns: repeat(6,1fr); }
  .category-grid{ grid-template-columns: repeat(3,1fr); }
  .feature-grid{ grid-template-columns: repeat(3,1fr); }
  .collection-grid{ grid-template-columns: repeat(4,1fr); }
  .compat-grid{ grid-template-columns: repeat(6,1fr); }
}

.mobile-nav{
  display:none;
  flex-direction:column;
  position:absolute; top: 100%; left:0; right:0;
  background:#fff; border-bottom:1px solid var(--border); box-shadow: var(--shadow-md);
  padding: 10px 24px 18px;
}
.mobile-nav.open{ display:flex; animation: fadeSlideDown .25s ease; }
.mobile-nav a{ padding: 13px 4px; font-weight:600; font-size:15px; color: var(--text); border-bottom:1px solid var(--border); }
.mobile-nav a:last-child{ border-bottom:none; }

@media (max-width: 1024px){
  .hero-grid{ grid-template-columns: 1fr; }
  .hero-visual{ height: 320px; order:-1; }
  .main-nav{ display:none; }
  .mobile-menu-btn{ display:flex; }
  .meaning-grid{ grid-template-columns: repeat(2,1fr); }
  .steps-row{ grid-template-columns: repeat(2,1fr); row-gap:36px; }
  .step-arrow{ display:none; }
  .stats-grid{ grid-template-columns: repeat(3,1fr); row-gap: 28px; }
  .faq-columns{ grid-template-columns: 1fr; }
}

@media (max-width: 900px){
  .emoji-grid{ grid-template-columns: repeat(4,1fr); }
  .category-grid{ grid-template-columns: repeat(2,1fr); }
  .feature-grid{ grid-template-columns: repeat(2,1fr); }
  .collection-grid{ grid-template-columns: repeat(3,1fr); }
  .compat-grid{ grid-template-columns: repeat(4,1fr); }
  .footer-grid{ grid-template-columns: 1fr 1fr; row-gap: 36px; }
  .section{ padding: 64px 0; }
}

@media (max-width: 640px){
  .container{ padding: 0 18px; }
  .emoji-grid{ grid-template-columns: repeat(3,1fr); gap:10px; }
  .emoji-card .glyph{ font-size:26px; }
  .emoji-card .ename{ font-size:9px; }
  .category-grid{ grid-template-columns: repeat(2,1fr); }
  .collection-grid{ grid-template-columns: repeat(2,1fr); }
  .compat-grid{ grid-template-columns: repeat(3,1fr); }
  .stats-grid{ grid-template-columns: repeat(2,1fr); }
  .hero-cta{ flex-direction:column; align-items: stretch; }
  .hero-cta .btn{ width:100%; }
  .footer-grid{ grid-template-columns: 1fr; }
  .footer-bottom{ flex-direction:column; text-align:center; }
  .cta-section{ margin: 0 12px; padding: 48px 22px; }
  .modal-box{ padding: 26px 20px; }
  .modal-copy-row{ grid-template-columns: 1fr 1fr; }
  .search-shell{ padding: 6px 6px 6px 18px; }
  .search-go{ display:none; }
  .steps-row{ grid-template-columns: 1fr; }
  .meaning-grid{ grid-template-columns: 1fr; }
  .hero-visual{ display:none; }
}