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)

Bắt đầu với bản tái hiện StackBlitz được liên kết và hành vi của mat-expansion-panel được mô tả trong issue. Tái hiện vấn đề bằng cách gọi scrollIntoView(true) trên một phần tử bên trong panel đang thu gọn, sau đó theo dõi hành vi liên quan của expansion-panel và header. Được xem là hoàn tất khi viewport cuộn đến panel, trong khi header của panel vẫn được hiển thị và phần tử bên trong vẫn bị ẩn.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.