diff --git a/README.md b/README.md
index a2403d3..8aad54a 100644
--- a/README.md
+++ b/README.md
@@ -102,6 +102,21 @@ Resultatlista kan sorteres på:
 
 **Tilgjengelighet:** Menyen er en vanlig `<select>` med en synlig `<label>` ("sorter"), så den kan brukes med tastatur og leses riktig av skjermlesere uten ekstra kode.
 
+## Forsiden og listesiden
+
+Appen har to hovedsider:
+
+| Adresse | Innhold |
+| --- | --- |
+| `/` | Forsiden med rader: Populære nå, og populære på PC, PlayStation og Nintendo |
+| `/spill` | Listesiden med søk, filtre, sortering og paginering |
+
+**Forsiden** henter alle radene i en forespørsel med GraphQL-aliaser (`popular:`, `pc:` osv.) og et fragment for feltene spillkortet trenger. Hver rad viser bare spill som ikke står i en rad over. De mest populære spillene finnes på nesten alle plattformer, så uten dette ville alle radene startet likt. Radene scrolles vannrett, uten automatisk rotering, og kortene kan nås med Tab. "Populære nå" bruker foreløpig RAWG sin popularitet og byttes til brukernes egen rating når den er på plass.
+
+**"Se alle"** på en rad går til listesiden med plattformfilteret satt. Valgte filtre vises ved antall treff (f.eks. "61 234 treff · PC"), så det synes at lista er filtrert.
+
+**Søk med Enter** går til listesiden. Logoen går til forsiden og nullstiller søk, filtre og sortering.
+
 ## Skisse
 
 ![Skisse av applikasjonen](documents/game-showcase.png)
@@ -114,6 +129,7 @@ Resultatlista kan sorteres på:
 
 - Detaljside for hvert spill
 - Brukere kan gi spill en vurdering, som lagres i databasen
+- Legge sketches inn i bakgrunnen og ikke inn i sidebar
 
 ## Teknologi
 
diff --git a/backend/.env.example b/backend/.env.example
index 3a763d1..04db58d 100644
--- a/backend/.env.example
+++ b/backend/.env.example
@@ -6,4 +6,6 @@ TUNNEL_PORT=5433
 # backend server env vars
 DATABASE_URL=postgresql://webapp:<PASSORD>@localhost:5433/gamesdb
 PORT=3001
+
 JWT_SECRET=aaaa
+
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index c56c5da..2670969 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -7,6 +7,7 @@ import { GameDetail } from './pages/GameDetail/GameDetail';
 import { GAMES, type GameSort } from './graphql/games';
 import { Pagination } from './components/Pagination/Pagination';
 import { SortSelect } from './components/SortSelect/SortSelect';
+import { Home } from './pages/Home/Home';
 import type { Suggestion } from './graphql/searchSuggestions';
 import type { GameSummary, GameView } from './types/game';
 import './App.css';
@@ -31,7 +32,8 @@ function App() {
   const [view, setView] = useState<GameView>('list');
   const [showFavorites, setShowFavorites] = useState(false);
   const navigate = useNavigate();
-  const onHome = useLocation().pathname === '/';
+  // Søk, filtre og sortering vises på listesiden /spill. Forsiden / har rader
+  const onListPage = useLocation().pathname === '/spill';
 
   // Søket i hovedlista. Settes først når brukeren trykker Enter, ikke for hver bokstav
   // (forslagene i søkefeltet tar seg av det), så lista og pagineringen ikke hopper
@@ -68,24 +70,24 @@ function App() {
 
   // Valgene i dropdownene (sjangre og plattformer) fra databasen.
   // Filtrene vises bare på forsiden, så de hentes ikke på detaljsiden.
-  const { data: options } = useQuery(FILTER_OPTIONS, { skip: !onHome });
+  const { data: options } = useQuery(FILTER_OPTIONS, { skip: !onListPage });
 
   // Valgt forslag i søkefeltet åpner detaljsiden til spillet
   const handleSelectGame = (game: Suggestion) => navigate(`/game/${game.id}`);
 
-  // Søkeresultater og favoritter vises på forsiden, så fra detaljsiden går vi dit
+  // Søkeresultater vises på listesiden. Tømmes søket (X) andre steder, blir man der man er
   const handleSearch = (term: string) => {
     setQuery(term);
-    resetPage(); // nytt søk starter på side 1
-    if (!onHome) navigate('/');
+    resetPage();
+    if (term && !onListPage) navigate('/spill');
   };
 
   const handleToggleFavorites = () => {
-    if (onHome) {
+    if (onListPage) {
       setShowFavorites((v) => !v);
     } else {
       setShowFavorites(true);
-      navigate('/');
+      navigate('/spill');
     }
   };
 
@@ -100,6 +102,18 @@ function App() {
     resetPage();
   };
 
+  // "Se alle" på en rad på forsiden: lista med plattformfilteret, uten søk,
+  // mest populære først. Selve sidebyttet gjør lenken i GameRow
+  const handleShowAll = (platformIds: string[]) => {
+    setQuery('');
+    setFilters({ ...defaultFilters, platformIds });
+    setSort('POPULARITY');
+    setShowFavorites(false);
+    resetPage();
+    setSearchResetKey((k) => k + 1);
+    window.scrollTo({ top: 0 });
+  };
+
   // Forrige side: siste 20 før startCursor. Ellers: første 20 etter endCursor (eller fra start)
   const pageVars = cursor.before
     ? { last: PAGE_SIZE, before: cursor.before }
@@ -114,7 +128,7 @@ function App() {
       sort,
       ...pageVars,
     },
-    skip: !onHome,
+    skip: !onListPage,
   });
 
   const result = data ?? previousData; // forrige liste vises mens den nye lastes
@@ -152,11 +166,20 @@ function App() {
   // Når favoritter lagres i databasen, bør de hentes derfra i stedet.
   const games = showFavorites ? allGames.filter((g) => favorites.has(g.id)) : allGames;
 
+  // Navnene på valgte sjangre og plattformer, så det synes at lista er filtrert
+  // (f.eks. etter "se alle" på forsiden, når filtergruppene i sidefeltet er lukket)
+  const activeFilterNames = [
+    ...(options?.genres ?? []).filter((g) => filters.genreIds.includes(g.id)),
+    ...(options?.platforms ?? []).filter((p) => filters.platformIds.includes(p.id)),
+  ].map((f) => f.name);
+
   // Teksten over lista. role="status" gjør at skjermlesere leser den opp når den endres
   let status = '';
   if (loading && !result) status = 'Laster …';
-  else if (result && !showFavorites)
+  else if (result && !showFavorites) {
     status = `${result.games.totalCount.toLocaleString('nb-NO')} treff`;
+    if (activeFilterNames.length) status += ` · ${activeFilterNames.join(', ')}`;
+  }
 
   const toggleFavorite = (id: string) => {
     setFavorites((prev) => {
@@ -175,13 +198,24 @@ function App() {
         onSearch={handleSearch}
         onSelectGame={handleSelectGame}
         favoritesCount={favorites.size}
-        showFavorites={showFavorites && onHome}
+        showFavorites={showFavorites && onListPage}
         onToggleFavorites={handleToggleFavorites}
       />
 
       <Routes>
+        {/* Forsiden med rader */}
         <Route
           path="/"
+          element={
+            <Home
+              favorites={favorites}
+              onToggleFavorite={toggleFavorite}
+              onShowAll={handleShowAll}
+            />
+          }
+        />
+        <Route
+          path="/spill"
           element={
             <>
               <FilterSidebar
diff --git a/frontend/src/components/GameRow/GameRow.css b/frontend/src/components/GameRow/GameRow.css
new file mode 100644
index 0000000..dd8d63b
--- /dev/null
+++ b/frontend/src/components/GameRow/GameRow.css
@@ -0,0 +1,40 @@
+.game-row {
+  margin-bottom: 40px;
+}
+
+/* Overskrift til venstre, "se alle" til høyre, tynn linje under */
+.game-row__header {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  margin-bottom: 16px;
+  padding-bottom: 8px;
+  border-bottom: 1px solid var(--border);
+}
+
+.game-row__all {
+  font-family: var(--mono);
+  font-size: 14px;
+  text-decoration: none;
+}
+
+/* Kortene ligger bortover og scrolles vannrett */
+.game-row__list {
+  display: grid;
+  grid-auto-flow: column; /* nye kort legges til høyre, ikke under */
+  grid-auto-columns: 220px; /* fast bredde per kort */
+  gap: 20px;
+  margin: 0;
+  padding: 0 0 12px; /* plass til scrollbaren */
+  list-style: none;
+  overflow-x: auto;
+  scroll-snap-type: x mandatory; /* kortene stopper pent på kanten når man sveiper */
+  scrollbar-width: thin;
+}
+
+/* Kortet fyller hele høyden, så bunnlinjene står likt */
+.game-row__list > li {
+  display: flex;
+  flex-direction: column;
+  scroll-snap-align: start;
+}
diff --git a/frontend/src/components/GameRow/GameRow.tsx b/frontend/src/components/GameRow/GameRow.tsx
new file mode 100644
index 0000000..3c6848d
--- /dev/null
+++ b/frontend/src/components/GameRow/GameRow.tsx
@@ -0,0 +1,55 @@
+import { useId } from 'react';
+import { Link } from 'react-router';
+import type { GameSummary } from '../../types/game';
+import { GameCard } from '../GameCard/GameCard';
+import './GameRow.css';
+
+interface GameRowProps {
+  title: string;
+  games: GameSummary[];
+  favorites: Set<string>;
+  onToggleFavorite: (id: string) => void;
+  /** Kalles før "se alle" går til listesiden, så App kan sette riktig filter */
+  onShowAll: () => void;
+}
+
+/**
+ * En rad på forsiden: overskrift, "se alle" og spillkort som scrolles bortover.
+ * Ingen automatisk rotering (WCAG). Kortene kan nås med Tab, og nettleseren
+ * scroller raden av seg selv til kortet som har fokus.
+ */
+export function GameRow({ title, games, favorites, onToggleFavorite, onShowAll }: GameRowProps) {
+  const headingId = useId(); // kobler <section> til overskriften for skjermlesere
+
+  return (
+    <section className="game-row" aria-labelledby={headingId}>
+      <div className="game-row__header">
+        <h2 id={headingId} className="label">
+          {title}
+        </h2>
+        {/* aria-label så skjermlesere hører hvilken rad "se alle" gjelder */}
+        <Link
+          to="/spill"
+          className="text-button game-row__all"
+          aria-label={`Se alle, ${title}`}
+          onClick={onShowAll}
+        >
+          se alle →
+        </Link>
+      </div>
+
+      <ul className="game-row__list">
+        {games.map((game) => (
+          <li key={game.id}>
+            <GameCard
+              game={game}
+              view="grid"
+              isFavorite={favorites.has(game.id)}
+              onToggleFavorite={onToggleFavorite}
+            />
+          </li>
+        ))}
+      </ul>
+    </section>
+  );
+}
diff --git a/frontend/src/graphql/games.ts b/frontend/src/graphql/games.ts
index cdf81fc..c50d813 100644
--- a/frontend/src/graphql/games.ts
+++ b/frontend/src/graphql/games.ts
@@ -1,7 +1,7 @@
 import { gql, type TypedDocumentNode } from '@apollo/client';
 
 /** Ett spill slik backend sender det til resultatlista */
-interface GameNode {
+export interface GameNode {
   id: string;
   name: string;
   released: string | null;
diff --git a/frontend/src/graphql/homeRows.ts b/frontend/src/graphql/homeRows.ts
new file mode 100644
index 0000000..b8105c5
--- /dev/null
+++ b/frontend/src/graphql/homeRows.ts
@@ -0,0 +1,71 @@
+import { gql, type TypedDocumentNode } from '@apollo/client';
+import type { GameNode } from './games';
+
+interface Row {
+  edges: { node: GameNode }[];
+}
+
+/** Svaret: en liste med spill per rad, med navnene fra aliasene i spørringen */
+export interface HomeRowsData {
+  popular: Row;
+  pc: Row;
+  playstation: Row;
+  nintendo: Row;
+}
+
+/** Plattform-ID-ene for hver rad (se PLATFORMS i Home.tsx) */
+interface HomeRowsVars {
+  pc: string[];
+  playstation: string[];
+  nintendo: string[];
+}
+
+/**
+ * Henter alle radene på forsiden i en forespørsel. Hver rad er games-queryen med et
+ * eget navn (alias) og eget filter. Bare 12 spill per rad og ingen totalCount,
+ * så databasen slipper å telle alle treff.
+ */
+export const HOME_ROWS: TypedDocumentNode<HomeRowsData, HomeRowsVars> = gql`
+  fragment RowGame on Game {
+    id
+    name
+    released
+    backgroundImage
+    rating
+    metacritic
+    genres {
+      name
+    }
+  }
+
+  query HomeRows($pc: [ID!], $playstation: [ID!], $nintendo: [ID!]) {
+    popular: games(first: 12) {
+      edges {
+        node {
+          ...RowGame
+        }
+      }
+    }
+    pc: games(filter: { platformIds: $pc }, first: 36) {
+      edges {
+        node {
+          ...RowGame
+        }
+      }
+    }
+    playstation: games(filter: { platformIds: $playstation }, first: 36) {
+      edges {
+        node {
+          ...RowGame
+        }
+      }
+    }
+    nintendo: games(filter: { platformIds: $nintendo }, first: 36) {
+      edges {
+        node {
+          ...RowGame
+        }
+      }
+    }
+  }
+`;
diff --git a/frontend/src/pages/GameDetail/GameDetail.tsx b/frontend/src/pages/GameDetail/GameDetail.tsx
index b53947c..7118154 100644
--- a/frontend/src/pages/GameDetail/GameDetail.tsx
+++ b/frontend/src/pages/GameDetail/GameDetail.tsx
@@ -55,7 +55,7 @@ export function GameDetail({ favorites, onToggleFavorite }: GameDetailProps) {
   }, [loadedId, title]);
 
   const backLink = (
-    <Link to="/" className="text-button game-detail__back">
+    <Link to="/spill" className="text-button game-detail__back">
       ← tilbake til resultatene
     </Link>
   );
diff --git a/frontend/src/pages/Home/Home.tsx b/frontend/src/pages/Home/Home.tsx
new file mode 100644
index 0000000..af86dc8
--- /dev/null
+++ b/frontend/src/pages/Home/Home.tsx
@@ -0,0 +1,68 @@
+import { useQuery } from '@apollo/client/react';
+import { GameRow } from '../../components/GameRow/GameRow';
+import { HOME_ROWS, type HomeRowsData } from '../../graphql/homeRows';
+
+// Plattform-ID-er fra databasen. Sjekk dem med { platforms { id name } } i Apollo Sandbox
+const PLATFORMS = {
+  pc: ['9'],
+  playstation: ['10'],
+  nintendo: ['8'],
+};
+
+// Radene på forsiden, i rekkefølge. key er aliaset i spørringen
+const ROWS: { key: keyof HomeRowsData; title: string; platformIds: string[] }[] = [
+  // MIDLERTIDIG: bruker RAWG sin popularitet til brukernes egen rating er på plass
+  { key: 'popular', title: 'Populære nå', platformIds: [] },
+  { key: 'pc', title: 'Populære på PC', platformIds: PLATFORMS.pc },
+  { key: 'playstation', title: 'Populære på PlayStation', platformIds: PLATFORMS.playstation },
+  { key: 'nintendo', title: 'Populære på Nintendo', platformIds: PLATFORMS.nintendo },
+];
+
+// Antall spill som vises i hver rad
+const ROW_SIZE = 12;
+
+interface HomeProps {
+  favorites: Set<string>;
+  onToggleFavorite: (id: string) => void;
+  /** "Se alle" på en rad: App setter plattformfilteret før listesiden vises */
+  onShowAll: (platformIds: string[]) => void;
+}
+
+/** Forsiden: rader med populære spill, totalt og per plattform. */
+export function Home({ favorites, onToggleFavorite, onShowAll }: HomeProps) {
+  const { data, loading, error } = useQuery(HOME_ROWS, { variables: PLATFORMS });
+
+  // Hver rad viser bare spill som ikke allerede står i en rad over.
+  // De mest populære spillene finnes på nesten alle plattformer, så uten dette
+  // ville alle radene startet med de samme spillene.
+  const shown = new Set<string>();
+  const rows = ROWS.map((row) => {
+    const games = (data?.[row.key].edges ?? [])
+      .map(({ node }) => node)
+      .filter((game) => !shown.has(game.id)) // hopp over spill som er vist over
+      .slice(0, ROW_SIZE) // ta de 12 første av de som er igjen
+      // Backend gir sjangre som objekter ({ name }), spillkortet forventer bare navnene
+      .map((game) => ({ ...game, genres: game.genres.map((g) => g.name) }));
+    games.forEach((game) => shown.add(game.id)); // husk dem til neste rad
+    return { ...row, games };
+  });
+
+  return (
+    <main className="main">
+      {loading && !data && <p role="status">Laster …</p>}
+      {error && <p role="alert">Kunne ikke hente spill: {error.message}</p>}
+
+      {data &&
+        rows.map((row) => (
+          <GameRow
+            key={row.key}
+            title={row.title}
+            games={row.games}
+            favorites={favorites}
+            onToggleFavorite={onToggleFavorite}
+            onShowAll={() => onShowAll(row.platformIds)}
+          />
+        ))}
+    </main>
+  );
+}