/* psychoSocial — Desktop Enhancements (v1.11.1)
   GOAL: exploit desktop space without impacting mobile.
   RULE: only min-width media queries; mobile remains unchanged.
*/

/* Wider reading canvas on large screens (keeps mobile-first baseline). */
@media (min-width: 1100px){
  :root{ --pageW: 980px; }
}
@media (min-width: 1400px){
  :root{ --pageW: 1100px; }
}

/* HOME: when a panel is open, show cards in 2–3 columns. */
@media (min-width: 900px){
  body[data-page="home"] #homeBlogList.posts{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
  body[data-page="home"] #homeResourcesList{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
  }
}
@media (min-width: 1300px){
  body[data-page="home"] #homeBlogList.posts{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body[data-page="home"] #homeResourcesList{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Small comfort tweaks for wider viewports (no visual change on mobile). */
@media (min-width: 900px){
  .card{ padding-left: 18px; padding-right: 18px; }
}