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)

リンクされた StackBlitz の再現と、issue で説明されている mat-expansion-panel の動作から始めてください。折りたたまれたパネル内の要素に対して scrollIntoView(true) を呼び出して問題を再現し、その後、関連する expansion-panel と header の動作を追跡してください。完了条件は、header が表示されたままで、内部要素が非表示のまま、viewport がパネルまでスクロールすることです。

索引モデルが issue の本文から書いたものです。