Describe the bug

The grid gap classes on that part of the footer cause a space on the right that misaligns what seems to be right-justified content and causes it to misalign from the grid. This misalignment becomes apparent if you have other right-justified content close-by:

An easy fix that worked for me is to remove mobile-lg:grid-gap-2 on .usa-footer__logo and set the distance between the agency logo and title through CSS margin instead:

I also removed the grip-gap on the parent grid-row in that usa-footer__secondary-section, but mileage could vary by use-case (in other word, some more work could be needed to fully align content in that section of the footer)

Steps to reproduce the bug

1. Examine the alignment of the Agency section of the footer with the grid, specifically on the right side.

Expected Behavior

I expect the 'Agency Contact' section that is comprisd of the social nav, Agency Contact Center header and agency contact info to be right justified and align with the grid on the right.

Related code

No response

Screenshots

System setup

• 3.4.1
• OS
• Chrome

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct.
• I checked the current issues for duplicate bug reports.