added cart and store picker

src/components/UseCases.astro

@@ -12,7 +12,7 @@
     </div>
     <div class="basis-1/3 md:pl-4">
       <p class="md:text-left md:pr-4">
-        <strong class="block">Complete User Journey</strong>
+        <strong class="block">Complete Online Shop</strong>
         Homepage, category, stores,<br/>
         product detail, cart, checkout<br/>
         and thank you page are included.
@@ -40,10 +40,40 @@
     </div>
     <div class="basis-1/3 md:pl-4">
       <p class="md:text-left md:pr-4">
-        <strong class="block">Cross-Team Interactions</strong>
-        Product color changes.<br/>
-        Recommendations must update.
+        <strong class="block">Recommendations</strong>
+        Color-matched tractor suggestions.<br/>
+        Based on product selection<br/>
+        and shopping cart contents.
       </p>
     </div>
   </div>
+
+  <div class="mt-2 md:flex md:flex-row-reverse items-center">
+    <div class="basis-2/3">
+      <img src="images/cart.webp" alt="possible tech stack visualisation" width="500"/>
+    </div>
+    <div class="basis-1/3">
+      <p class="md:text-right md:pr-4">
+        <strong class="block">Shopping Cart</strong>
+        Add and remove tractors.<br/>
+        Minicart updates accordingly.
+      </p>
+    </div>
+  </div>
+
+
+  <div class="mt-2 md:flex items-center">
+    <div class="basis-2/3">
+      <img src="images/storepicker.webp" alt="store picker" width="500"/>
+    </div>
+    <div class="basis-1/3 md:pl-4">
+      <p class="md:text-left md:pr-4">
+        <strong class="block">Complex Forms</strong>
+        Checkout address form<br />
+        with embedded store picker<br />
+        owned by explore.
+      </p>
+    </div>
+  </div>
+
 </div>