/* =========================================================
   Responsive
   header.mobile は design_spec で unknown → ハンバーガーで暫定実装
   ========================================================= */
@media (max-width: 1024px) {
  :root { --section-py: 60px; --text-hero: 38px; }
  .article { padding: 40px 36px 44px; }
}

@media (max-width: 900px) {
  .nav-toggle { display: inline-flex; }
  .global-nav { display: none; }
  .global-nav.is-open {
    display: block; position: absolute; left: 0; right: 0; top: 100%; z-index: 50;
    background: var(--color-surface); border-bottom: 1px solid var(--color-border); box-shadow: var(--shadow-card);
  }
  .global-nav.is-open ul { flex-direction: column; gap: 0; padding: 8px var(--container-px) 16px; font-size: 15px; }
  .global-nav.is-open li + li { border-top: 1px solid var(--color-border); }
  .global-nav.is-open a { display: flex; padding-block: 14px; }
  .site-header { position: relative; }
  .header-actions { gap: 8px; }
}

@media (max-width: 600px) {
  :root {
    --section-py: 48px; /* estimated */
    --container-px: 16px;
    --text-hero: 30px;
    --text-article-h1: 24px;
    --text-section-h2: 24px;
    --text-article-h2: 20px;
    --text-article-h3: 18px;
  }
  .site-logo__main { font-size: 21px; }
  .site-logo__sub { font-size: 10px; letter-spacing: .14em; }
  .hero { padding-block: 32px 48px; gap: 32px; }
  .hero__lead { font-size: 15px; }
  .feature-card__body { padding: 20px; }
  .feature-card__title { font-size: 18px; }
  .article { padding: 28px 20px 36px; border-radius: var(--radius-box); } /* estimated */
  .content-area { padding-block: 16px 56px; gap: 32px; }
  .entry-content h2::before { font-size: 22px; }
  .toc, .author-box, .company-card { padding: 20px; }
  .recruit-band { padding: 24px 20px; }
  .roadmap__step { min-height: 0; }
  .profile-hero { padding: 24px 20px; }
  .notfound__code { font-size: 72px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* スマホ：STEPカードを横並びのコンパクト表示に */
@media (max-width: 600px) {
  .roadmap { gap: 10px; margin-top: 24px; }
  .roadmap__step { display: grid; grid-template-columns: 48px 1fr; column-gap: 12px; row-gap: 2px; padding: 16px 18px; align-items: center; }
  .roadmap__no { grid-row: 1 / span 2; font-size: 30px; }
  .roadmap__title { font-size: 16px; }
  .roadmap__desc { display: none; }
  .roadmap__link { margin-top: 0; font-size: 12px; }
}