/* Keep private-profile sections on the same mobile rail as homepage sections.
   The cover remains full-bleed; only the content sections use this gutter. */
@media (max-width: 700px) {
  body.profile-page #profileContent {
    width: calc(100% - (var(--page-gutter, 16px) * 2));
    max-width: none;
    margin-inline: auto;
  }

  body.profile-page #profileContent > .profile-card:not(.profile-identity-card),
  body.profile-page #profileContent > #profileCoffeeJourney,
  body.profile-page #profileContent > #profileGallery {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  /* The identity/about rail sits inside the full-bleed cover card. Give it
     the same safe gutter as homepage section content as well. */
  body.profile-page .profile-identity-card .profile-identity-lower {
    width: calc(100% - (var(--page-gutter, 16px) * 2));
    max-width: none;
    margin-inline: auto;
  }
}
