diff --git a/src/lib/components/RecipeView.svelte b/src/lib/components/RecipeView.svelte
index 56384c5..26de28d 100644
--- a/src/lib/components/RecipeView.svelte
+++ b/src/lib/components/RecipeView.svelte
@@ -117,8 +117,12 @@
     </button>
   </div>
 
-  {#if tab === 'ing'}
-    <section class="ingredients" role="tabpanel">
+  <div class="panes">
+    <section
+      class="ingredients"
+      role="tabpanel"
+      class:hidden-mobile={tab !== 'ing'}
+    >
       <div class="servings">
         <button class="srv-btn" aria-label="Weniger" onclick={decr}>−</button>
         <div class="srv-value">
@@ -146,15 +150,18 @@
         {/each}
       </ul>
     </section>
-  {:else}
-    <section class="steps" role="tabpanel">
+    <section
+      class="steps"
+      role="tabpanel"
+      class:hidden-mobile={tab !== 'prep'}
+    >
       <ol>
         {#each recipe.steps as step (step.position)}
           <li>{step.text}</li>
         {/each}
       </ol>
     </section>
-  {/if}
+  </div>
 </article>
 
 <style>
@@ -326,4 +333,35 @@
     font-weight: 700;
     font-size: 0.95rem;
   }
+
+  .panes {
+    display: block;
+  }
+  .hidden-mobile {
+    display: none;
+  }
+
+  /* Querformat-Tablets und Desktop: Zutaten + Zubereitung nebeneinander,
+     Tabs ausgeblendet. Zutaten sticky, damit sie beim Scrollen der
+     Zubereitung oben bleiben. */
+  @media (min-width: 820px) {
+    .tabs {
+      display: none;
+    }
+    .panes {
+      display: grid;
+      grid-template-columns: minmax(260px, 1fr) 1.6fr;
+      gap: 2rem;
+      align-items: start;
+    }
+    .hidden-mobile {
+      display: block;
+    }
+    .ingredients {
+      position: sticky;
+      top: 1rem;
+      max-height: calc(100vh - 2rem);
+      overflow-y: auto;
+    }
+  }
 </style>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index d7dac99..0e37219 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -392,7 +392,7 @@
     border-bottom: 1px solid #e4eae7;
   }
   .bar-inner {
-    max-width: 760px;
+    max-width: 1040px;
     margin: 0 auto;
     display: flex;
     align-items: center;
@@ -618,7 +618,7 @@
   }
   main {
     padding: 0 1rem 4rem;
-    max-width: 760px;
+    max-width: 1040px;
     margin: 0 auto;
   }
   @media (max-width: 520px) {