diff --git a/src/App.tsx b/src/App.tsx
index 6de287f..2fbe992 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,12 +1,10 @@
 import Nav from './components/Nav';
 import Hero from './sections/Hero';
-import ConceptSection from './sections/ConceptSection';
 import RouteSection from './sections/RouteSection';
+import FollowSection from './sections/FollowSection';
 import ItinerarySection from './sections/ItinerarySection';
-import LastYearSection from './sections/LastYearSection';
 import CrewsSection from './sections/CrewsSection';
-import FollowSection from './sections/FollowSection';
-import SignupSection from './sections/SignupSection';
+import LastYearSection from './sections/LastYearSection';
 import Footer from './sections/Footer';
 
 export default function App() {
@@ -16,12 +14,10 @@ export default function App() {
       <main>
         <Hero />
         <RouteSection />
+        <FollowSection />
         <ItinerarySection />
-        <LastYearSection />
-        <ConceptSection />
         <CrewsSection />
-        <FollowSection />
-        <SignupSection />
+        <LastYearSection />
       </main>
       <Footer />
     </div>
diff --git a/src/components/Nav.tsx b/src/components/Nav.tsx
index e2a241f..42a3f23 100644
--- a/src/components/Nav.tsx
+++ b/src/components/Nav.tsx
@@ -2,12 +2,11 @@ import { useState, useEffect } from 'react';
 import { Menu, X } from 'lucide-react';
 
 const NAV_ITEMS = [
-  { href: '#last-year', label: 'Last Year' },
-  { href: '#concept', label: 'The Idea' },
   { href: '#route', label: 'Route' },
+  { href: '#follow', label: 'Follow' },
   { href: '#itinerary', label: 'Itinerary' },
   { href: '#crews', label: 'Crews' },
-  { href: '#follow', label: 'Follow' },
+  { href: '#last-year', label: 'Last Year' },
 ];
 
 export default function Nav() {
@@ -52,11 +51,6 @@ export default function Nav() {
                 </a>
               </li>
             ))}
-            <li className="ml-2">
-              <a href="#join" className="btn-primary text-sm px-4 py-2">
-                Join →
-              </a>
-            </li>
           </ul>
 
           {/* Mobile hamburger */}
@@ -85,11 +79,6 @@ export default function Nav() {
                 </a>
               </li>
             ))}
-            <li className="pt-3">
-              <a href="#join" onClick={close} className="btn-primary w-full justify-center">
-                Join the Rallye →
-              </a>
-            </li>
           </ul>
         </div>
       )}
diff --git a/src/components/RouteMap/MediaMarkers.tsx b/src/components/RouteMap/MediaMarkers.tsx
index 996d82e..702c307 100644
--- a/src/components/RouteMap/MediaMarkers.tsx
+++ b/src/components/RouteMap/MediaMarkers.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useRef, useState } from 'react';
 import { useMap } from '@vis.gl/react-google-maps';
 import type { Marker } from '@googlemaps/markerclusterer';
-import { useMediaPosts, type MediaPost } from '../../hooks/useMediaPosts';
+import { useMediaPosts, type MediaPost, compareCapturedAtDesc } from '../../hooks/useMediaPosts';
 import MediaMarker from './MediaMarker';
 import MediaLightbox from '../MediaLightbox';
 import { useClusterer } from './useClusterer';
@@ -10,12 +10,12 @@ import { postsWithinRadius } from './mediaProximity';
 
 type GeotaggedPost = MediaPost & { lat: number; lon: number };
 
-/** Newest-first, matching how `useMediaPosts`/`PhotoStream` already order
- *  posts - rowKeys are generated with an inverted timestamp prefix, so
- *  ascending `id` sort is newest-first. Keeps lightbox ordering consistent
- *  everywhere it's opened from. */
+/** Newest-*captured*-first (not newest-uploaded) - matches how
+ *  `useMediaPosts` sorts. Crews upload with a time lag, so sorting by
+ *  `capturedAt` keeps lightbox ordering on trip-timeline order everywhere
+ *  it's opened from. */
 function sortNewestFirst(posts: readonly MediaPost[]): MediaPost[] {
-  return [...posts].sort((a, b) => (a.id < b.id ? -1 : a.id > b.id ? 1 : 0));
+  return [...posts].sort(compareCapturedAtDesc);
 }
 
 const NEARBY_RADIUS_METERS = 500;
diff --git a/src/components/RouteMap/PhotoStreamTile.tsx b/src/components/RouteMap/PhotoStreamTile.tsx
index eb7f2fb..a95207e 100644
--- a/src/components/RouteMap/PhotoStreamTile.tsx
+++ b/src/components/RouteMap/PhotoStreamTile.tsx
@@ -1,16 +1,17 @@
 import { useState } from 'react';
-import { Video, Camera } from 'lucide-react';
+import { Video } from 'lucide-react';
 import { useMediaPosts } from '../../hooks/useMediaPosts';
 import MediaLightbox from '../MediaLightbox';
 
 /**
  * Compact preview of the live photo stream, shown next to the map so
- * visitors don't have to scroll all the way down to `/photos` / the
- * `FollowSection` grid to see what's just been uploaded. Shows the most
- * recent thumbnails; tapping one opens the same shared `MediaLightbox`
- * used everywhere else, seeded with the *full* posts list (not just this
- * tile's truncated subset) so browsing from here isn't more limited than
- * browsing from the main stream.
+ * visitors don't have to scroll all the way down to the `FollowSection`
+ * grid to see the most recently *captured* photos/videos. Shows the
+ * newest-captured thumbnails (see `useMediaPosts`, sorted by
+ * `capturedAt` rather than upload time); tapping one opens the same
+ * shared `MediaLightbox` used everywhere else, seeded with the *full*
+ * posts list (not just this tile's truncated subset) so browsing from
+ * here isn't more limited than browsing from the main stream.
  */
 const TILE_COUNT = 6;
 
@@ -26,7 +27,7 @@ export default function PhotoStreamTile() {
     <div className="bg-white border border-asphalt-700 shadow-sm rounded flex flex-col">
       <div className="flex items-center justify-between px-4 pt-4 pb-3">
         <h3 className="text-sm font-semibold uppercase tracking-wide text-asphalt-300">Latest photos</h3>
-        <a href="/photos" className="text-xs font-semibold text-rally-600 hover:text-rally-700">
+        <a href="#follow" className="text-xs font-semibold text-rally-600 hover:text-rally-700">
           View all
         </a>
       </div>
@@ -67,13 +68,6 @@ export default function PhotoStreamTile() {
         ))}
       </div>
 
-      <a
-        href="/photos"
-        className="flex-none flex items-center justify-center gap-1.5 text-xs font-semibold text-rally-600 border-t border-asphalt-700 py-2.5 hover:bg-asphalt-900/5 transition-colors"
-      >
-        <Camera size={13} /> Share a photo
-      </a>
-
       {selectedIndex !== null && (
         <MediaLightbox posts={posts} initialIndex={selectedIndex} onClose={() => setSelectedIndex(null)} />
       )}
diff --git a/src/components/RouteMap/mediaClusterRenderer.ts b/src/components/RouteMap/mediaClusterRenderer.ts
index 78dd09e..846b201 100644
--- a/src/components/RouteMap/mediaClusterRenderer.ts
+++ b/src/components/RouteMap/mediaClusterRenderer.ts
@@ -1,5 +1,5 @@
 import type { Cluster, Marker, Renderer } from '@googlemaps/markerclusterer';
-import type { MediaPost } from '../../hooks/useMediaPosts';
+import { type MediaPost, compareCapturedAtDesc } from '../../hooks/useMediaPosts';
 
 /** Markers tagged with their post data by `MediaMarkers.tsx` on ref-set. */
 export type TaggedMediaMarker = Marker & { __mediaPost?: MediaPost };
@@ -15,14 +15,13 @@ function pickThumbnailPost(markers: readonly Marker[]): MediaPost | undefined {
   if (posts.length === 0) return undefined;
   // Apple Photos-style: prefer a photo so the cluster bubble feels like
   // "one of your photos", falling back to a video only if the cluster has
-  // no photos at all. Pick deterministically (newest first, by `id` -
-  // rowKeys are generated with an inverted timestamp prefix so they sort
-  // newest-first ascending) rather than randomly, so the same cluster
-  // doesn't flicker between different thumbnails on every pan/zoom
-  // re-render.
+  // no photos at all. Pick deterministically (newest *captured* first,
+  // with an `id` tie-breaker baked into `compareCapturedAtDesc`) rather
+  // than randomly, so the same cluster doesn't flicker between different
+  // thumbnails on every pan/zoom re-render.
   const photos = posts.filter((p) => p.mediaType === 'photo');
   const pool = photos.length > 0 ? photos : posts;
-  return [...pool].sort((a, b) => (a.id < b.id ? -1 : a.id > b.id ? 1 : 0))[0];
+  return [...pool].sort(compareCapturedAtDesc)[0];
 }
 
 /**
diff --git a/src/hooks/useMediaPosts.ts b/src/hooks/useMediaPosts.ts
index 311ea8a..c88da7b 100644
--- a/src/hooks/useMediaPosts.ts
+++ b/src/hooks/useMediaPosts.ts
@@ -13,6 +13,28 @@ export interface MediaPost {
 
 const POLL_INTERVAL_MS = 30_000;
 
+/**
+ * Numeric compare of two posts by `capturedAt`, newest first. Crews upload
+ * with a time lag, but followers should see photos in the trip's actual
+ * timeline order regardless of when they landed in Blob/Table Storage.
+ * Parses to epoch ms rather than comparing the raw strings - `capturedAt`
+ * is client-supplied (see `mediaComplete` in the API) so its precision/
+ * offset can vary, and lexicographic string comparison can mis-order
+ * those. Falls back to `id` as a deterministic tie-breaker when
+ * timestamps are equal (or both fail to parse), so results stay stable
+ * across re-renders instead of depending on array/marker iteration order.
+ */
+export function compareCapturedAtDesc(a: MediaPost, b: MediaPost): number {
+  const at = Date.parse(a.capturedAt) || 0;
+  const bt = Date.parse(b.capturedAt) || 0;
+  if (at !== bt) return bt - at;
+  return a.id < b.id ? 1 : a.id > b.id ? -1 : 0;
+}
+
+function sortByCapturedAtDesc(posts: MediaPost[]): MediaPost[] {
+  return [...posts].sort(compareCapturedAtDesc);
+}
+
 /**
  * Polls the `/api/media` Azure Function (backed by Table Storage, blob
  * bytes served directly from Blob Storage via `blobUrl`) for recently
@@ -32,7 +54,11 @@ export function useMediaPosts(): MediaPost[] {
         const res = await fetch('/api/media', { cache: 'no-store' });
         if (!res.ok) return;
         const data: MediaPost[] = await res.json();
-        if (isMounted.current) setPosts(data);
+        // The API returns newest-*uploaded*-first (cheap Table Storage
+        // pagination via an inverted-timestamp rowKey) - re-sort here by
+        // when the photo was actually taken so every consumer of this
+        // hook gets trip-timeline order "for free".
+        if (isMounted.current) setPosts(sortByCapturedAtDesc(data));
       } catch {
         // Network hiccup or offline - keep showing the last known posts
         // and try again on the next tick.
diff --git a/src/sections/ConceptSection.tsx b/src/sections/ConceptSection.tsx
deleted file mode 100644
index 16f305a..0000000
--- a/src/sections/ConceptSection.tsx
+++ /dev/null
@@ -1,105 +0,0 @@
-import { Wrench, Mountain, Map, Users, MapPin, Banknote, CheckCircle } from 'lucide-react';
-
-const CARDS = [
-  {
-    Icon: Wrench,
-    title: 'Cheap, old, or characterful',
-    body: 'Any car works if it is interesting. A Ferrari is welcome but would look a bit out of place next to someone\'s 200k km classic.',
-  },
-  {
-    Icon: Wrench,
-    title: 'Breakdowns welcome',
-    body: 'Old cars fail sometimes. When they do, we fix them on the road ourselves. Bring more tools than you think you need and know roughly how your car works.',
-  },
-  {
-    Icon: Map,
-    title: 'Shared plan, your pace',
-    body: 'There\'s a rough itinerary, but it is not binding. Split off, take detours, meet at stops, or skip things. We share live location so everyone can find each other.',
-  },
-  {
-    Icon: Users,
-    title: 'Multiple crews',
-    body: 'We travel loosely together in more than one car. More stories, more help when something fails, better evenings.',
-  },
-  {
-    Icon: MapPin,
-    title: 'Live tracking',
-    body: 'Anyone can follow along online - live map, photos, and updates as they happen.',
-  },
-  {
-    Icon: Banknote,
-    title: 'Low-cost by design',
-    body: 'No luxury package, no shared budget. Keep it simple, split what makes sense, spend money where it is worth it.',
-  },
-];
-
-const WHAT_TO_BRING = [
-  'Valid documents for every country on the route',
-  'European breakdown kit (warning triangle, vest, first-aid)',
-  'Vignettes for Austria and Switzerland - mandatory',
-  'Basic tools and spare fluids for your specific car',
-  'Cash - some alpine passes and toll booths don\'t take cards',
-  'A dashcam (you will want the footage)',
-  'Sense of humour',
-];
-
-export default function ConceptSection() {
-  return (
-    <section id="concept" className="section-pad bg-asphalt-950">
-      <div className="max-w-7xl mx-auto">
-        <div className="grid md:grid-cols-2 gap-12 mb-16">
-          <div>
-            <p className="text-rally-500 text-sm font-semibold uppercase tracking-widest mb-3">
-              The Idea
-            </p>
-            <h2 className="font-display text-5xl md:text-6xl text-asphalt-100 mb-6 leading-none tracking-wide">
-              NOT YOUR USUAL<br />
-              <span className="text-rally-500">VACATION.</span>
-            </h2>
-            <p className="text-asphalt-300 text-base leading-relaxed mb-4">
-              <strong>Cicerone Rallye</strong> is a week on the road in fun, old, unreliable cars with a decent chance something will need fixing.
-            </p>
-            <p className="text-asphalt-300 text-base leading-relaxed mb-4">
-              We drive thousands of kilometers and stop at interesting places along the way. Going by car lets us experience a lot in one week without turning it into a polished tour.
-            </p>
-            <p className="text-asphalt-300 text-base leading-relaxed">
-              Not many rules. But the ones we have, we take seriously.
-            </p>
-          </div>
-
-          <div className="flex flex-col gap-4">
-            {CARDS.map(({ Icon, title, body }) => (
-              <div key={title} className="card p-5 flex items-start gap-4">
-                <Icon size={22} strokeWidth={1.25} className="text-rally-500 flex-shrink-0 mt-0.5" />
-                <div>
-                  <p className="font-semibold text-asphalt-100 mb-1">{title}</p>
-                  <p className="text-asphalt-300 text-sm leading-relaxed">{body}</p>
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-
-        {/* What to bring */}
-        <div className="border-t border-asphalt-700 pt-16">
-          <div className="card p-8 max-w-2xl mx-auto">
-            <div className="flex items-center gap-3 mb-6">
-              <Mountain size={22} strokeWidth={1.25} className="text-rally-500" />
-              <h3 className="font-display text-2xl text-asphalt-100 tracking-wide">
-                WHAT TO BRING
-              </h3>
-            </div>
-            <ul className="flex flex-col gap-3">
-              {WHAT_TO_BRING.map((item) => (
-                <li key={item} className="flex items-start gap-3 text-asphalt-300 text-sm">
-                  <CheckCircle size={14} strokeWidth={1.5} className="text-rally-500 mt-0.5 flex-shrink-0" />
-                  <span>{item}</span>
-                </li>
-              ))}
-            </ul>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}
diff --git a/src/sections/CrewsSection.tsx b/src/sections/CrewsSection.tsx
index 6cbcb2c..481ed64 100644
--- a/src/sections/CrewsSection.tsx
+++ b/src/sections/CrewsSection.tsx
@@ -7,17 +7,11 @@ export default function CrewsSection() {
       <div className="max-w-7xl mx-auto">
         <div className="text-center mb-12">
           <p className="text-rally-500 text-sm font-semibold uppercase tracking-widest mb-3">
-            Who's Coming
+            On The Road
           </p>
           <h2 className="font-display text-5xl md:text-6xl text-asphalt-100 tracking-wide">
-            SIGNED UP CREWS
+            THE CREWS
           </h2>
-          <p className="text-asphalt-400 text-sm mt-4">
-            List updates as confirmations come in. Want to see your name here?{' '}
-            <a href="#join" className="text-rally-400 hover:text-rally-300 underline underline-offset-2">
-              Sign up below →
-            </a>
-          </p>
         </div>
 
         <div className="grid sm:grid-cols-2 lg:grid-cols-3 gap-6">
diff --git a/src/sections/FollowSection.tsx b/src/sections/FollowSection.tsx
index 3cda6fe..c130f8e 100644
--- a/src/sections/FollowSection.tsx
+++ b/src/sections/FollowSection.tsx
@@ -1,4 +1,4 @@
-import { Radio, Camera } from 'lucide-react';
+import { Radio } from 'lucide-react';
 import PhotoStream from '../components/PhotoStream';
 
 export default function FollowSection() {
@@ -19,11 +19,6 @@ export default function FollowSection() {
             Scroll up for the live map. Below is the live photo/video stream, straight from the
             crews' phones. Also check our Instagram Stories for daily highlights.
           </p>
-          <a href="/photos" className="btn-primary inline-flex items-center gap-2 mb-8">
-            <Camera size={16} strokeWidth={1.75} />
-            Share a photo from your phone
-          </a>
-
           <PhotoStream />
         </div>
       </div>
diff --git a/src/sections/Footer.tsx b/src/sections/Footer.tsx
index fbcf92f..936eeb1 100644
--- a/src/sections/Footer.tsx
+++ b/src/sections/Footer.tsx
@@ -11,12 +11,11 @@ export default function Footer() {
         {/* Nav links */}
         <nav className="flex flex-wrap justify-center gap-x-6 gap-y-2">
           {[
-            ['#last-year', 'Last Year'],
-            ['#concept', 'The Idea'],
             ['#route', 'Route'],
+            ['#follow', 'Follow'],
             ['#itinerary', 'Itinerary'],
             ['#crews', 'Crews'],
-            ['#join', 'Join'],
+            ['#last-year', 'Last Year'],
           ].map(([href, label]) => (
             <a
               key={href}
diff --git a/src/sections/Hero.tsx b/src/sections/Hero.tsx
index 8f8613c..efb53e6 100644
--- a/src/sections/Hero.tsx
+++ b/src/sections/Hero.tsx
@@ -42,12 +42,9 @@ export default function Hero() {
           18–26 July 2026 · Fun cars. Great places. Breakdowns welcome.
         </p>
 
-        {/* CTAs */}
+        {/* CTA */}
         <div className="flex flex-col sm:flex-row gap-4 justify-center">
-          <a href="#join" className="btn-primary text-base px-8 py-4">
-            Join the Rallye
-          </a>
-          <a href="#route" className="inline-flex items-center gap-2 rounded font-semibold transition-all duration-150 cursor-pointer select-none border-2 border-white text-white px-8 py-4 text-base hover:bg-white hover:text-asphalt-100 active:scale-95">
+          <a href="#route" className="btn-primary text-base px-8 py-4">
             See the Route
           </a>
         </div>
diff --git a/src/sections/SignupSection.tsx b/src/sections/SignupSection.tsx
deleted file mode 100644
index 554cade..0000000
--- a/src/sections/SignupSection.tsx
+++ /dev/null
@@ -1,114 +0,0 @@
-import { Mail, Tag, Users, Car, HelpCircle } from 'lucide-react';
-
-const SIGNUP_EMAIL = 'adam.prokop@networg.com';
-
-const MAILTO_SUBJECT = encodeURIComponent('Cicerone Rallye 2026 - Sign Up');
-const MAILTO_BODY = encodeURIComponent(
-  `Hi,
-
-I'd like to join the Cicerone Rallye - Transalpine Edition 2026.
-
-Crew name: 
-Members: 
-Car (make, model, year): 
-Car note (anything interesting / relevant):
-Questions: 
-
-See you on the road!
-`
-);
-
-const MAILTO_HREF = `mailto:${SIGNUP_EMAIL}?subject=${MAILTO_SUBJECT}&body=${MAILTO_BODY}`;
-
-const FAQ = [
-  {
-    q: 'Do I need to do the full route?',
-    a: 'No. Join for a day, a leg, or the whole week. The itinerary is open.',
-  },
-  {
-    q: 'What car should I bring?',
-    a: 'Something interesting. Cheap, old, or just characterful. A completely standard car is fine but boring. A truly questionable car is perfect.',
-  },
-  {
-    q: 'What if my car breaks down?',
-    a: "Good. Bring tools and know roughly how your car works. It's part of the trip.",
-  },
-  {
-    q: 'Is it expensive?',
-    a: "That's up to you. Costs are accommodation, fuel, food, entry fees. We don't run a shared budget - everyone handles their own.",
-  },
-  {
-    q: 'Can I bring friends or family?',
-    a: 'Yes. Crews of any size are welcome.',
-  },
-];
-
-export default function SignupSection() {
-  return (
-    <section id="join" className="section-pad bg-asphalt-900">
-      <div className="max-w-4xl mx-auto">
-        <div className="text-center mb-12">
-          <p className="text-rally-500 text-sm font-semibold uppercase tracking-widest mb-3">
-            Ready?
-          </p>
-          <h2 className="font-display text-5xl md:text-6xl text-asphalt-100 mb-4 tracking-wide">
-            JOIN THE RALLYE
-          </h2>
-          <p className="text-asphalt-300 text-base max-w-xl mx-auto">
-            Send us an email with your crew details. We'll reply with what you need to know.
-          </p>
-        </div>
-
-        <div className="grid md:grid-cols-2 gap-10 mb-16">
-          {/* CTA card */}
-          <div className="card p-8 flex flex-col items-center text-center gap-6">
-            <Mail size={40} strokeWidth={1} className="text-rally-500" />
-            <div>
-              <p className="text-asphalt-100 font-semibold text-lg mb-2">Drop us a line</p>
-              <p className="text-asphalt-400 text-sm mb-6">
-                Tell us about your crew and car. We'll get back to you.
-              </p>
-              <a href={MAILTO_HREF} className="btn-primary text-base w-full justify-center">
-                Sign up by email
-              </a>
-              <p className="text-asphalt-500 text-xs mt-3">{SIGNUP_EMAIL}</p>
-            </div>
-          </div>
-
-          <div className="flex flex-col gap-4">
-            <p className="font-semibold text-asphalt-100 text-sm uppercase tracking-widest">
-              Include in your email:
-            </p>
-            {[
-              { Icon: Tag,          label: 'Crew name',  desc: 'Something memorable. Or your surname. Up to you.' },
-              { Icon: Users,        label: 'Members',    desc: "First names, or full names if you'd like to be on the crew list." },
-              { Icon: Car,          label: 'Car',        desc: "Make, model, year - and any relevant notes (condition, modifications, risk level)." },
-              { Icon: HelpCircle,   label: 'Questions',  desc: "Anything you're unsure about." },
-            ].map(({ Icon, label, desc }) => (
-              <div key={label} className="flex items-start gap-3">
-                <Icon size={18} strokeWidth={1.25} className="text-rally-500 flex-shrink-0 mt-0.5" />
-                <div>
-                  <p className="font-medium text-asphalt-100 text-sm">{label}</p>
-                  <p className="text-asphalt-400 text-xs">{desc}</p>
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-
-        {/* FAQ */}
-        <div>
-          <h3 className="font-display text-3xl text-asphalt-100 mb-6 tracking-wide">FAQ</h3>
-          <div className="flex flex-col gap-4">
-            {FAQ.map((item) => (
-              <div key={item.q} className="card p-5">
-                <p className="font-semibold text-asphalt-100 mb-2 text-sm">{item.q}</p>
-                <p className="text-asphalt-300 text-sm leading-relaxed">{item.a}</p>
-              </div>
-            ))}
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}