@media (min-width: 1024px) {
  .hero-inner { padding-inline: var(--space-l); }
  .gallery-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 480px) {
  .hero-character img { width: 160px; }
  .menu-tabs { gap: 4px; }
  .menu-tab { padding: 0.4em 0.7em; font-size: 0.7rem; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .gallery-item:nth-child(1), .gallery-item:nth-child(4) { grid-row: span 1; }
  .chatbot-panel { bottom: 80px; right: 12px; }
  .chatbot-trigger { bottom: 16px; right: 16px; width: 48px; height: 48px; }
}