fix(card): title styles being overridden by global typography

Fixes the card title styles potentially being overridden by the global `.mat-typography` styles if the title is set on a header node.

Fixes #10215.

Author: crisbeto

src/lib/card/_card-theme.scss

@@ -20,18 +20,19 @@
 @mixin mat-card-typography($config) {
   .mat-card {
     font-family: mat-font-family($config);
-  }
 
-  .mat-card-title {
-    font: {
-      size: mat-font-size($config, headline);
-      weight: mat-font-weight($config, headline);
+    // These need the extra specificity, because they can be
+    // easily overridden by the global typography styles.
+    .mat-card-title {
+      font-size: mat-font-size($config, headline);
+      font-weight: mat-font-weight($config, headline);
+      line-height: normal;
     }
-  }
 
-  .mat-card-subtitle,
-  .mat-card-content,
-  .mat-card-header .mat-card-title {
-    font-size: mat-font-size($config, body-1);
+    .mat-card-subtitle,
+    .mat-card-content,
+    .mat-card-header .mat-card-title {
+      font-size: mat-font-size($config, body-1);
+    }
   }
 }

src/lib/card/card.scss

@@ -47,8 +47,12 @@ $mat-card-header-size: 40px !default;
   margin-bottom: 16px;
 }
 
-.mat-card-title, .mat-card-subtitle, .mat-card-content {
-  @extend %mat-card-section-base;
+// Needs slightly higher specificity due to it potentially
+// being overridden by the global typography styles.
+.mat-card {
+  .mat-card-title, .mat-card-subtitle, .mat-card-content {
+    @extend %mat-card-section-base;
+  }
 }
 
 .mat-card-actions {