Dialog header/footer shifting in Safari

[mkrause]

See the "Dialog With Title Overflow" story in Safari and try scrolling. There's some minor 1px shifting going on and I haven't been able to fix it. Even removing the -1px pixel rounding fix does not work. Probably better to just move away from the position: sticky solution and move to a CSS grid here instead.

EDIT: This is also very apparent during the entry animation of a DialogModal, the footer shifts significantly.

[mkrause]

Another thing we should fix as part of this ticket is the focus outline on slide modals. Currently it's outset which gets cut off at the top and bottom. We can do:

    &.bk-dialog-modal--slide-over {
      @include bk.focus-inset;
    }

However that doesn't work currently due to the header/footer having z-index: 1. Turning it into a grid should solve this.