/* ==========================================================================
   Breakpoints — must load last.
   1120px: desktop nav collapses to the hamburger menu
   900px:  two/three/four-column grids collapse; pricing becomes one column
   560px:  remaining multi-column grids collapse to a single column
   ========================================================================== */

@media (max-width: 1120px) {
  .nav { display: none; }
  .btn--header { display: none; }
  .menu-btn { display: flex; }
}

@media (max-width: 900px) {
  .sec-hero-home { padding-top: 56px; }

  .grid-4 { grid-template-columns: 1fr 1fr; }
  .grid-4--cards { grid-template-columns: 1fr 1fr; }
  .grid-3 { grid-template-columns: 1fr 1fr; }

  .grid-2,
  .grid-2--tight,
  .grid-2--panel,
  .grid-2--intro,
  .grid-2--contact { grid-template-columns: 1fr; gap: 30px; }

  .price-grid { grid-template-columns: 1fr; max-width: 440px; margin-left: auto; margin-right: auto; }

  .edition-row { grid-template-columns: 1fr auto; }
  .edition-row__desc { grid-column: 1 / -1; order: 3; }

  .site-footer__grid { grid-template-columns: 1fr; gap: 30px; }

  .dark-panel { padding: 32px; }
}

@media (max-width: 560px) {
  .grid-3 { grid-template-columns: 1fr; }
  .grid-4, .grid-4--cards { grid-template-columns: 1fr; }
  .toc-list { grid-template-columns: 1fr; }
  .step-row { grid-template-columns: 1fr; gap: 10px; }
  .form-row { grid-template-columns: 1fr; }

  .sec-hero-home { padding: 56px 20px 56px; }
  .sec-band { padding: 56px 20px 60px; }
  .panel-note { padding: 28px 22px; }
  .form-panel { padding: 26px 20px; }
  .site-footer__inner { padding: 48px 20px 32px; }
  .sec-404 { padding: 80px 20px; }
}
/* Keyboard focus treatment shared by links and accordion controls. */
.btn:focus-visible,
.nav__link:focus-visible,
.mobile-menu__link:focus-visible,
.mobile-menu__cta:focus-visible,
.faq-item__trigger:focus-visible,
.site-footer a:focus-visible {
  outline: var(--focus-ring-strong);
  outline-offset: 3px;
}

.form-notice {
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid #b7473a;
  color: #7c2d25;
  background: #fff7f5;
  font-size: 14px;
}