src/app/modules/pro/channel/home/home.component.html

@@ -6,7 +6,10 @@
   ></m-pro--channel--categories>
 
   <div class="m-proChannelHome__section" *ngIf="featuredContent?.length">
-    <div class="m-proChannelHome__featuredContent">
+    <div
+      class="m-proChannelHome__featuredContent"
+      [class.m-proChannelHome__featuredContent--prominent]="false"
+    >
       <m-pro--channel-tile
         *ngFor="let entity of featuredContent"
         [entity]="entity"

src/app/modules/pro/channel/home/home.component.scss

@@ -56,15 +56,17 @@ m-proChannel__home {
   .m-proChannelHome__featuredContent {
     grid-template-columns: repeat(2, 1fr);
 
-    *:nth-child(1) {
-      grid-column: span 2;
-    }
-
     @media screen and (max-width: $max-mobile) {
       grid-template-columns: 100%;
+    }
 
+    &.m-proChannelHome__featuredContent--prominent {
       *:nth-child(1) {
-        grid-column: initial;
+        grid-column: span 2;
+
+        @media screen and (max-width: $max-mobile) {
+          grid-column: initial;
+        }
       }
     }
   }