bug(mat-expansion-panel): header position is incorrect when call elementInsideMatExpansionPanel.scrollIntoView(true)

#### Reproduction

- Components: https://angular-mat-expansion-panel-header-gone-after-scrollintoview.stackblitz.io

Steps to reproduce:

1. open [StackBlitz reproduce example](https://angular-mat-expansion-panel-header-gone-after-scrollintoview.stackblitz.io)
2. scroll to bottom
3. click `Test ScrollIntoView` button.

or.

1. Add `test` inside `mat-expansion-panel` tag.
2. Set `mat-expansion-panel` `expanded="false"`.
3. Call `elementInsideMatExpansionPanel.scrollIntoView(true)`, e.g. `document.querySelector('.bug-target').scrollIntoView(true)`.

#### Expected Behavior

Viewport scrolls to `mat-expansion-panel` with `mat-expansion-panel-header` display, and element inside `mat-expansion-panel` remains hidden.

#### Actual Behavior

Viewport scrolls to `mat-expansion-panel` and causes `mat-expansion-panel-header` x-position changed and `mat-expansion-panel-header` is not display.

#### Environment

- Angular: 11.0.1
- CDK/Material: 11.0.1
- Browser(s): Chrome Version 87.0.4280.66 (Official Build) (64-bit)
- Operating System (e.g. Windows, macOS, Ubuntu): Windows, Ubutntu

#### Workaround

Call `window.scroll` or `scrollTo` function, see [StackBlitz reproduce example](https://angular-mat-expansion-panel-header-gone-after-scrollintoview.stackblitz.io)

Start with the linked StackBlitz reproduction and the mat-expansion-panel behavior described in the issue. Reproduce the problem by calling scrollIntoView(true) on an element inside a collapsed panel, then trace the expansion-panel and header behavior involved. Done means the viewport scrolls to the panel while its header remains displayed and the inner element stays hidden.

Written by the indexing model from the issue text.