/* ============================================
   responsive.css - レスポンシブ対応
   ============================================ */

@media (max-width: 900px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  /* モバイルナビ */
  .nav-toggle { display: inline-grid; place-items: center; }
  .nav-links {
    position: absolute;
    top: 62px;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    background: var(--navy);
    padding: 10px 16px 18px;
    box-shadow: var(--shadow-md);
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    padding-top: 0;
    padding-bottom: 0;
  }
  .nav-links.open {
    max-height: 460px;
    padding-top: 10px;
    padding-bottom: 18px;
  }
  .nav-links a { padding: 12px 14px; font-size: 1rem; }

  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .vs-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 20px; }

  .hero { padding: 56px 0 48px; }
  .section { padding: 40px 0; }
  .hero-actions .btn { flex: 1; }

  .bar-row { grid-template-columns: 92px 1fr 40px; }
}

@media (max-width: 460px) {
  .container { padding-inline: 16px; }
  .quiz-card { padding: 22px; }
  .card, .etf-card { padding: 18px; }
}

/* 印刷 */
@media print {
  .site-header, .site-footer, .nav-toggle, .theme-toggle, .compare-bar, .toolbar { display: none; }
}
