add new learn page

tutorials/learn-rive.mdx

@@ -1,28 +1,91 @@
 ---
 title: 'Learn Rive'
+mode: 'wide'
+sidebarTitle: 'Overview'
 ---
 
 import { YouTube } from '/snippets/youtube.mdx'
 
-## Rive for ABSOLUTE BEGINNERS
+<CardGroup cols={2}>
+  <Card title="Rive Community" href="https://community.rive.app/c/start-here/" img="/images/learn/community.png">
+    Ask questions, share your work, find jobs, and connect with other Rive users.
+  </Card>
+  <Card title="Rive 101 Series" href="https://www.youtube.com/playlist?list=PLujDTZWVDSsFGonP9kzAnvryowW098-p3" img="/images/learn/rive-101.png" >
+    A complete YouTube series covering the fundamentals of Rive.
+  </Card>
+</CardGroup>
+<CardGroup cols={3}>
+  <Card title="Blog" href="https://rive.app/blog" img="/images/game-runtimes/logos/unity.png">
+    Deep dives, product updates, and insights into building interactive experiences.
+  </Card>
+  <Card title="Newsletter" href="https://rive.app/newsletter" img="/images/learn/newsletter.png">
+    Stay up to date with new features, tutorials, and case studies.
+  </Card>
+  <Card title="Discord" href="https://discord.com/invite/FGjmaTr" img="/images/learn/rive-discord.svg">
+    Chat with the community in real time and get quick feedback.
+  </Card>
+</CardGroup>
 
-<YouTube id="7m4dwz8SCKo" />
+## Learn by Example
 
-## Rive 101
+Learn by opening Rive files and runtime demos.
 
-<YouTube id="videoseries?list=PLujDTZWVDSsFGonP9kzAnvryowW098-p3" />
+<CardGroup cols={3}>
+  <Card title="Marketplace" href="https://rive.app/marketplace/" img="/images/learn/marketplace.jpg">
+    Explore real Rive files and open them directly in the editor to see how they’re built.
+  </Card>
+  <Card title="Scripting Demos" href="/scripting/demos" img="/images/learn/scripting-demos.png" >
+    Examples that use scripting to control behavior and interactivity.
+  </Card>
+  <Card title="Runtime Demos" href="/runtimes/demos" img="/images/learn/runtime-demos.jpg" >
+    See how Rive integrates across web, mobile, and game engines.
+  </Card>
+</CardGroup>
 
-## Community
+## Featured videos
 
-<CardGroup>
-    <Card title="School of Motion" href="https://www.schoolofmotion.com/courses/rive-academy-volume-1">
+<CardGroup cols={3}>
+  <Card title="Quick Start Tutorial" href="https://www.youtube.com/watch?v=wnwA0izJo4E" img="/images/learn/video-quickstart.jpg" />
+  <Card title="Rive for Absolute Beginners" href="https://www.youtube.com/watch?v=7m4dwz8SCKo" img="/images/learn/video-beginners.jpg" />
+  <Card title="State Machines" href="https://www.youtube.com/watch?v=7m4dwz8SCKo" img="/images/learn/video-101.jpg" />
+</CardGroup>
+
+<div style={{ display: 'flex', justifyContent: 'flex-end',marginTop: 20 }}>
+  <Link href="https://www.youtube.com/@Rive_app">More Videos &gt;</Link>
+</div>
+
+## Case Studies
+
+See how teams are using Rive in production.
+
+<CardGroup cols={3}>
+  <Card title="Rive x Duolingo" href="https://rive.app/blog/duolingo-s-ai-powered-video-call-brings-lily-to-life" img="/images/learn/case-study-duolingo.jpg" />
+  <Card title="Rive x Strava" href="https://rive.app/blog/strava-year-in-sport-built-with-rive" img="/images/learn/case-study-strava.webp" />
+  <Card title="Rive x Spotify" href="https://rive.app/blog/spotify-used-rive-for-spotify-wrapped-2025" img="/images/learn/case-study-wrapped.png" />
+</CardGroup>
+
+<div style={{ display: 'flex', justifyContent: 'flex-end',marginTop: 20 }}>
+  <Link href="https://rive.app/blog/case-studies">More Case Studies &gt;</Link>
+</div>
+
+## Community Content
+
+Learn from the Rive community through tips, tutorials, and in-depth courses.
+
+<CardGroup cols={2}>
+    <Card title="School of Motion" href="https://www.schoolofmotion.com/courses/rive-academy-volume-1" img="/images/learn/community-school-of-motion.webp">
         **Rive Academy: Volume 1**
 
-        Rive Academy: Volume 1 is the ultimate introduction to the world of interactive animation built with Rive. You’ll learn how to design, animate, and prototype interactive motion design that you can ship anywhere. By the end of the course you’ll be ready to use Rive in production, and go further in more advanced courses.
+        Rive Academy: Volume 1 is the ultimate introduction to the world of interactive animation built with Rive. You’ll learn how to design, animate, and prototype interactive motion design that you can ship anywhere.
     </Card>
-    <Card title="Motion Design School" href="https://motiondesign.school/courses/rive-interactive-motion/">
+    <Card title="Motion Design School" href="https://motiondesign.school/courses/rive-interactive-motion/" img="/images/learn/community-motion-design-school.png">
         **Rive: Interactive Motion**
 
         Discover the web-based software revolutionizing interactive experiences. Build 2 big faux 3d spaces filled with awesome interactive setups. Learn on practise all Rive techniques and use it in full power.
     </Card>
+</CardGroup>
+<CardGroup cols={1}>
+    <Card title="Community Tips & Tricks" href="https://community.rive.app/c/tips-tricks/">
+        Practical tips, tricks, and workflows shared by Rive users.
+    </Card>
 </CardGroup>