/* ===========================================================
   responsive.css · 三档断点：>900 / 481-900 / <=480
   =========================================================== */

@media (max-width: 1180px){
  :root{ --sidebar-w: 296px; }
}

@media (max-width: 980px){
  .hamburger{ display: inline-flex; }

  /* 侧栏改为抽屉 */
  .sidebar{
    position: fixed; top: 0; left: 0; z-index: 70;
    width: min(86vw, 360px); flex-basis: auto; height: 100vh;
    transform: translateX(-104%); transition: transform .28s ease;
    box-shadow: var(--sh-3);
  }
  .sidebar.open{ transform: none; }
  .scrim{
    position: fixed; inset: 0; z-index: 65; background: rgba(15,23,42,.42);
    opacity: 0; visibility: hidden; transition: opacity .25s;
  }
  .scrim.open{ opacity: 1; visibility: visible; }

  .content{ max-width: 100%; padding-top: 66px; }
  .resizer{ display: none; }
  .grid-2,.grid-3,.compare,.termlist{ grid-template-columns: 1fr; }
  .kcard-body .pad{ padding-left: var(--s4); }
}

@media (max-width: 560px){
  :root{
    --fs-lg: 17px; --fs-h3: 22px;
  }
  .topbar{ padding: 0 14px; gap: 10px; }
  .topbar .logo{ font-size: var(--fs-body); }
  .chapter-head .goal{ font-size: var(--fs-body); }
  .kcard-head{ flex-wrap: wrap; gap: 12px; }
  .kcard-head .kbrief{ margin-left: 0; flex-basis: 100%; text-align: left; }
  .steps li{ padding-left: 74px; }
  .pager a{ flex-basis: 100%; }
  .cover .cta .btn{ width: 100%; justify-content: center; }
  .tagline{ display: none; }
}

@media print{
  .sidebar,.topbar,.pager,.totop,.spotlight,.hamburger{ display: none !important; }
  .content{ max-width: 100%; padding: 0; }
  .kcard-body{ grid-template-rows: 1fr !important; }
}
