@media (max-width: 1100px) {
  .footer-grid { grid-template-columns: 1.5fr repeat(2, 1fr); }
  .board-card-grid { grid-template-columns: repeat(2, 1fr); }
  .benefit-grid { grid-template-columns: repeat(2, 1fr); }
  .process-timeline { flex-wrap: wrap; row-gap: 28px; }
  .process-timeline::before { display: none; }
  .process-timeline__step { flex: 0 0 33.33%; }
  .call-card { grid-template-columns: .65fr 1.35fr; }
  .call-actions { grid-column: 2; flex-direction: row; align-items: center; }
}

@media (max-width: 900px) {
  /* Below 900px, the account links (My Dashboard/My Account/Sign Out, or
     Sign In/Register) move out of the branding row and into the utility
     bar instead of staying next to the logo -- see .account-links /
     .utility-account in main.css. Stacked full-width buttons next to the
     journal title read as broken on a narrow screen; a compact text row
     above the header doesn't. */
  .branding-inner { min-height: 88px; }
  .header-actions .account-links { display: none; }
  .utility-account { display: flex; flex-wrap: wrap; }
  .menu-toggle { position: relative; z-index: 110; display: block; }
  .primary-navigation { position: fixed!important; inset: 0 0 0 auto; z-index: 100; width: min(380px, 88vw); padding: 90px 24px 30px; overflow-y: auto; transform: translateX(105%); transition: transform .24s ease; box-shadow: -15px 0 40px rgba(16,45,64,.18); }
  .primary-navigation.is-open { transform: translateX(0); }
  .navigation-inner, .primary-menu, .secondary-menu { display: block; }
  .primary-menu a { padding: 14px 6px; border-bottom: 1px solid var(--line); font-size: 1rem; }
  .primary-menu .sub-menu { position: static; display: block; box-shadow: none; padding-left: 18px; }
  .secondary-menu-wrap { margin-top: 24px; }
  .secondary-menu li { margin-bottom: 10px; }
  .hero-layout { grid-template-columns: 1fr; min-height: auto; padding-block: 80px; }
  .hero-note { max-width: 620px; }
  .highlights-grid { grid-template-columns: repeat(3, 1fr); }
  .about-grid { grid-template-columns: 1fr .5fr; gap: 45px; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .article-layout { grid-template-columns: 1fr; }
  .article-sidebar { display: grid; grid-template-columns: repeat(2, 1fr); }
  .two-column-page, .contact-grid { grid-template-columns: 1fr; }
  .page-aside { position: static; }
}

@media (max-width: 700px) {
  :root { --shell: min(100% - 28px, 1240px); --content: min(100% - 28px, 820px); }
  .utility-identifiers { display: none; }
  .utility-inner { justify-content: center; }
  .site-description { display: none; }
  .brand-logo img { max-height: 50px; max-width: 160px; }
  .section-heading { display: block; }
  .section-heading > a, .section-heading > p { display: inline-block; margin-top: 14px; }
  .highlights-grid { grid-template-columns: repeat(2, 1fr); }
  .highlight:last-child { grid-column: 1 / -1; }
  .about-grid, .call-card, .issue-feature, .updates-inner, .issue-header-layout, .post-card { grid-template-columns: 1fr; }
  .journal-cover-wrap { max-width: 230px; }
  .call-card { padding: 28px; }
  .call-actions { grid-column: auto; }
  .topic-grid, .board-card-grid, .indexing-grid, .issue-grid { grid-template-columns: 1fr; }
  .member-bio-card { flex-direction: column; gap: 18px; }
  .topic-card { flex-direction: column; }
  .topic-card__image { width: 100%; height: 140px; }
  .member-bio-identity { width: auto; }
  .member-bio-divider { display: none; }
  .divided-list { columns: 1; }
  .indexing-card { flex-direction: column; }
  .indexing-card__logo { width: 64px; height: 64px; }
  .benefit-grid, .metrics-grid { grid-template-columns: 1fr 1fr; }
  .process-timeline__step { flex: 0 0 50%; }
  .article-sidebar { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom-inner { display: block; }
  .legal-menu { margin-top: 14px; }
  .newsletter-placeholder > div, .search-form { flex-direction: column; }
  .ijms-grid, .ijms-login-shell { grid-template-columns: 1fr; }
  .ijms-grid .ijms-wide { grid-column: auto; }
  .ijms-status-form .ijms-button { width: 100%; }
}

@media (max-width: 480px) {
  /* Logged in, the utility bar now carries My Dashboard/My Account/Sign
     Out alongside the contact email -- on a narrow phone that's too much
     to fit on one line. The email is also always on the Contact page, so
     drop it here in favor of keeping the account links legible. Signed-
     out visitors only get Sign In + a Register pill, which already fits
     fine alongside the email, so this is scoped to .logged-in only. */
  .logged-in .utility-contact { display: none; }
}

@media (max-width: 390px) {
  .site-title { font-size: 1.15rem; }
  .brand-logo { display: none; }
  .icon-button { width: 38px; height: 38px; }
  .hero-layout { padding-block: 62px; }
  .hero-actions { display: grid; }
  .highlights-grid, .benefit-grid, .metrics-grid { grid-template-columns: 1fr; }
  .process-timeline__step { flex: 0 0 100%; }
  .article-card { padding: 22px; }
  .article-card-meta, .article-card-actions { align-items: flex-start; flex-direction: column; gap: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto!important; transition-duration: .01ms!important; animation-duration: .01ms!important; animation-iteration-count: 1!important; }
}
