diff --git a/.opencode/command/update-traincategory.md b/.opencode/command/update-traincategory.md
new file mode 100644
index 00000000..13767619
--- /dev/null
+++ b/.opencode/command/update-traincategory.md
@@ -0,0 +1,43 @@
+---
+description: Update train category information
+agent: build
+---
+
+Update the page $ARGUMENTS to new train category shortcodes.
+
+A shortcode looks like:
+
+```
+{{% train-category
+    title="title"
+    type="highspeed" (can be highspeed, regional, subway, bus, funicular, sleeper)
+    fip_accepted=true (can be true, false, partially)
+    reservation_required=true (can be true, false, partially)
+    reservation_possible=true (can be true, false, partially; omit the attribute if false or if reservation_required is true)
+    route_overview_url="https://example.com" (if there is an route overview link in the description, otherwise omit the attribute)
+    additional_information_url="https://example.com" (if there is an additional information link in the description, otherwise omit the attribute)
+%}}
+{{% /train-category %}}
+```
+
+Do not use brackets around boolean attributes like true and false. Place each attribute in a new line.
+
+Important information (previously paragraphs that started with ⚠️ in the text) should be changed to an important highlight shortcut (in the same position as the text was before):
+
+```
+{{% highlight important %}}
+{{% /highlight %}}
+```
+
+If there is a risk of confusion (previously marked with ℹ️ in the text), add it as confusion highlight (in the same position the text was before):
+
+```
+{{% highlight confusion %}}
+{{% /highlight %}}
+```
+
+Tranform the "**Reservation cost:**" (or language equivalent) section to a heading "### Reservation".
+
+If there is additional information in the text that can't be represented in the shortcode, add the information to the text. For example "**Reservation required:** ⚠️ sometimes (marked with _R_)" becomes "A reservation is required for some trains (marked with _R_)."
+
+Make sure to remove the old expanders after adding the shortcode.
diff --git a/assets/sass/_variables.scss b/assets/sass/_variables.scss
index a0f7bcaa..574bbd1e 100644
--- a/assets/sass/_variables.scss
+++ b/assets/sass/_variables.scss
@@ -14,6 +14,34 @@ $bg-code: #fff284;
 $color-onLight: #000000;
 $color-table-border: #5b5b5b;
 
+$tag-colors: (
+  success: #155724,
+  warning: #b64900,
+  error: #b70000,
+  info: #414141,
+);
+
+$tag-colors-dark: (
+  success: #a8d5ba,
+  warning: #f0d98d,
+  error: #f5a9ae,
+  info: #d1d1d1,
+);
+
+$highlight-colors: (
+  tip: #116278,
+  inofficial: #42454a,
+  important: map-get($tag-colors, warning),
+  confusion: map-get($tag-colors, warning),
+);
+
+$highlight-colors-dark: (
+  tip: #61bdd6,
+  inofficial: #acb3c1,
+  important: map-get($tag-colors-dark, warning),
+  confusion: map-get($tag-colors-dark, warning),
+);
+
 html {
   --pagefind-ui-scale: 1 !important;
   --pagefind-ui-text: #000;
@@ -29,6 +57,17 @@ html {
   --color-body: rgb(33, 37, 41);
   --color-success: #096640;
   --color-error: #ad1731;
+
+  @each $name, $color in $tag-colors {
+    --tag-#{$name}-bg: #{mix(white, $color, 90%)};
+    --tag-#{$name}-color: #{$color};
+  }
+
+  @each $name, $color in $highlight-colors {
+    --highlight-#{$name}-bg: #{mix(white, $color, 90%)};
+    --highlight-#{$name}-color: #{$color};
+  }
+
   --border-radius-s: 0.4rem;
   --border-radius-m: 0.8rem;
   --border-radius-l: 1.6rem;
@@ -36,9 +75,6 @@ html {
   --pagefind-ui-border: #000 !important;
   --box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.25);
   --box-shadow-light: 0.4rem 0.4rem 0.4rem rgba(0, 0, 0, 0.1);
-  --highlight-color-tip: #c4f2ff;
-  --highlight-color-inofficial: #f0f3f5;
-  --highlight-color-important: #ffe3d9;
   --border: 0.1rem solid transparent;
   --pagefind-ui-font: roboto, Arial, Helvetica, sans-serif;
   --outline-focus-indicator: #257fa8;
@@ -56,18 +92,27 @@ html[data-theme="dark"] {
     --link-special: #ffffff;
     --bg-default: #151b23;
     --bg-neutral: #0d1117;
+    --bg-accent: #86761a;
     --color-onLight: #ffffff;
     --color-table-border: #555;
     --color-body: #e0e0e0;
     --color-success: #2ea44f;
     --color-error: #f85149;
+
+    @each $name, $color in $tag-colors-dark {
+      --tag-#{$name}-bg: #{mix(black, $color, 65%)};
+      --tag-#{$name}-color: #{$color};
+    }
+
+    @each $name, $color in $highlight-colors-dark {
+      --highlight-#{$name}-bg: #{mix(black, $color, 65%)};
+      --highlight-#{$name}-color: #{$color};
+    }
+
     --pagefind-ui-border: #555;
     --box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.5);
     --box-shadow-light: 0.4rem 0.4rem 0.4rem rgba(0, 0, 0, 0.3);
     --pagefind-ui-background: var(--bg-default);
-    --highlight-color-tip: #1a4a5c;
-    --highlight-color-inofficial: #2a2d30;
-    --highlight-color-important: #4a2a1a;
     --border: 0.1rem solid #3d444d;
     --outline-focus-indicator: #2e9acb;
   }
diff --git a/assets/sass/expander.scss b/assets/sass/expander.scss
index 4091d161..2eb92583 100644
--- a/assets/sass/expander.scss
+++ b/assets/sass/expander.scss
@@ -47,7 +47,7 @@
     }
   }
 
-  > div {
+  &-title {
     display: flex;
     align-items: center;
     gap: 0.5rem;
diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index 639c39d7..bb57e276 100644
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -17,3 +17,5 @@
 @import "startpage.scss";
 @import "interactiveMap.scss";
 @import "dropdown.scss";
+@import "trainCategory.scss";
+@import "tag.scss";
diff --git a/assets/sass/tag.scss b/assets/sass/tag.scss
new file mode 100644
index 00000000..4d3fcd6e
--- /dev/null
+++ b/assets/sass/tag.scss
@@ -0,0 +1,18 @@
+.a-tag {
+  display: flex;
+  align-items: center;
+  gap: 0.4rem;
+  padding: 0.4rem 0.8rem;
+  border-radius: var(--border-radius-s);
+  font-size: 0.7em;
+  font-weight: 500;
+  white-space: nowrap;
+
+  @each $name, $color in $tag-colors {
+    &--#{$name} {
+      background: var(--tag-#{$name}-bg);
+      color: var(--tag-#{$name}-color);
+      border: 0.1rem solid var(--tag-#{$name}-color);
+    }
+  }
+}
diff --git a/assets/sass/textHighlight.scss b/assets/sass/textHighlight.scss
index e2657c14..948cca8d 100644
--- a/assets/sass/textHighlight.scss
+++ b/assets/sass/textHighlight.scss
@@ -1,9 +1,11 @@
 .m-text-highlight {
-  background-color: var(--bg-neutral);
   padding: 1.2rem;
   margin-bottom: 1.2rem;
   border-radius: var(--border-radius-m);
-  border-left: var(--bg-neutral) solid 1rem;
+
+  @media print {
+    border-width: 0.1rem;
+  }
 
   // Remove margins from last elements of expander (up to 2 levels deep)
   & > *:last-child,
@@ -28,29 +30,18 @@
   gap: 0.4rem;
 }
 
-.m-text-highlight--tip {
-  background-color: var(--highlight-color-tip);
-  border-left: #1db5df solid 1rem;
-
-  @media print {
-    border: 0.2rem solid #1db5df;
-  }
-}
+@each $name, $color in $highlight-colors {
+  .m-text-highlight--#{$name} {
+    background-color: var(--highlight-#{$name}-bg);
+    border: var(--highlight-#{$name}-color) solid 0.1rem;
+    border-width: 0.1rem 0.1rem 0.1rem 1rem;
 
-.m-text-highlight--inofficial {
-  background-color: var(--highlight-color-inofficial);
-  border-left: #878c96 solid 1rem;
+    @media print {
+      background-color: none;
+    }
 
-  @media print {
-    border: 0.2rem solid #878c96;
-  }
-}
-
-.m-text-highlight--important {
-  background-color: var(--highlight-color-important);
-  border-left: #ba3d12 solid 1rem;
-
-  @media print {
-    border: 0.2rem solid #ba3d12;
+    > .m-text-highlight__roofline {
+      color: var(--highlight-#{$name}-color);
+    }
   }
 }
diff --git a/assets/sass/trainCategory.scss b/assets/sass/trainCategory.scss
new file mode 100644
index 00000000..b6223c05
--- /dev/null
+++ b/assets/sass/trainCategory.scss
@@ -0,0 +1,36 @@
+.o-train-category__header {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 0.8rem;
+}
+
+.o-train-category__title {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-weight: 600;
+}
+
+.o-train-category__tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.6rem;
+}
+
+details.o-expander__summary--train-category {
+  &:hover,
+  &:focus {
+    .o-train-category__title-text {
+      text-decoration: underline;
+    }
+  }
+}
+
+details.o-expander--train-category:not([open]) {
+  @media (max-width: $breakpoint-md) {
+    .a-tag__text {
+      display: none;
+    }
+  }
+}
diff --git a/content/operator/sncf/index.en.md b/content/operator/sncf/index.en.md
index fbc1af15..d3534621 100644
--- a/content/operator/sncf/index.en.md
+++ b/content/operator/sncf/index.en.md
@@ -36,84 +36,138 @@ Reservations are mandatory on all `TGV`, almost all `IC` trains, and some region
 
 ### Long-distance
 
-{{% expander "Train à grande vitesse inOui (TGV inOui) ⚠️ℹ️" traincategory "long-distance" %}}
-**Description:** \
-The `TGV` inOui is SNCF Voyageurs's high-speed train, connecting many cities in France and international destinations (e.g. Munich, Frankfurt am Main, Barcelona, Luxembourg, Brussels, Zurich, Milan). [Route overview](https://www.sncf-connect.com/assets/media/2021-05/2014_axes-tgv_0.pdf). Each seat number exists twice in the carriage; the reserved seat is the one with the illuminated number.
+{{% train-category
+  title="Train à grande vitesse inOui (TGV inOui)"
+  type="highspeed"
+  fip_accepted=true
+  reservation_required=true
+  route_overview_url="https://www.sncf-connect.com/assets/media/2021-05/2014_axes-tgv_0.pdf"
+%}}
+The `TGV` inOui is SNCF Voyageurs's high-speed train, connecting many cities in France and international destinations (e.g. Munich, Frankfurt am Main, Barcelona, Luxembourg, Brussels, Zurich, Milan). Each seat number exists twice in the carriage; the reserved seat is the one with the illuminated number.
+
+{{% highlight confusion %}}
+SNCF also operates low-cost long-distance trains under the OUIGO brand, but these are not valid with FIP.
+{{% /highlight %}}
 
-ℹ️ SNCF also operates low-cost long-distance trains under the OUIGO brand, but these are not valid with FIP.
+{{% highlight important %}}
+Special conditions apply for international connections, see [International TGV inOui / ICE trains](#international-tgv-inoui--ice-trains).
 
-⚠️ Special conditions apply for international connections, see [International TGV inOui / ICE trains](#international-tgv-inoui--ice-trains). \
-**Reservation possible:** yes \
-**Reservation required:** yes ⚠️ \
-**Reservation cost:** \
-Reservation prices differ between peak and off-peak trains. Off-peak: €2 (1st/2nd class); peak: €16 (1st class), €11 (2nd class). The classification of trains is unfortunately not publicly available.
+{{% /highlight %}}
 
-On international journeys, the reservation price is €40 (1st class) and €20 (2nd class).
-{{% /expander %}}
+### Reservation
 
-{{% expander "OUIGO (Grande Vitesse / Train Classique) ⛔⚠️ℹ️" traincategory "long-distance" %}}
-**Description:** \
-OUIGO (Grande Vitesse) is SNCF's low-cost high-speed train connecting numerous cities in France and some international destinations. There are also OUIGO Classique trains composed of conventional coaching stock.
+Prices differ between peak and off-peak trains for national journeys. The classification is not publicly available.
+
+|                   | 1st class | 2nd class |
+| ----------------- | --------- | --------- |
+| National Off-peak | €2        | €2        |
+| National Peak     | €16       | €16       |
+| International     | €40       | €20       |
+
+{{% /train-category %}}
+
+{{% train-category
+  title="OUIGO (Grande Vitesse / Train Classique)"
+  type="highspeed"
+  fip_accepted=false
+  reservation_required=true
+%}}
 
-ℹ️ SNCF also operates `TGV` trains under the inOui brand, which are valid with FIP. \
-**Reservation possible:** yes \
-**Reservation required:** yes ⚠️ \
-**FIP:** ⛔ FIP not accepted
-{{% /expander %}}
+OUIGO (Grande Vitesse) is SNCF's low-cost high-speed train connecting numerous cities in France and some international destinations. There are also OUIGO Classique trains composed of conventional coaching stock.
 
-{{% expander "Intercity-Express (ICE) ⚠️" traincategory "long-distance" %}}
-**Description:** \
+{{% highlight confusion %}}
+SNCF also operates `TGV` trains under the inOui brand, which are valid with FIP.
+{{% /highlight %}}
+{{% /train-category %}}
+
+{{% train-category
+  title="Intercity-Express (ICE)"
+  type="highspeed"
+  fip_accepted=true
+  reservation_required=true
+%}}
 International high-speed trains operated by SNCF in cooperation with Deutsche Bahn, running between France (Paris Est, Strasbourg) and Germany (Karlsruhe, Mannheim, Frankfurt am Main, Stuttgart, Munich).
 
-⚠️ Special conditions apply for international connections, see [International TGV inOui / ICE trains](#international-tgv-inoui--ice-trains). \
-**Reservation possible:** yes \
-**Reservation required:** yes ⚠️ \
-**Reservation cost:** \
-Reservation prices differ between peak and off-peak trains. Off-peak: €2 (1st/2nd class); peak: €16 (1st class), €11 (2nd class). The classification of trains is unfortunately not publicly available.
+{{% highlight important %}}
+Special conditions apply for international connections, see [International TGV inOui / ICE trains](#international-tgv-inoui--ice-trains).
+{{% /highlight %}}
+
+### Reservation
+
+Prices differ between peak and off-peak trains for national journeys. The classification is not publicly available.
+
+|                   | 1st class | 2nd class |
+| ----------------- | --------- | --------- |
+| National Off-peak | €2        | €2        |
+| National Peak     | €16       | €16       |
+| International     | €40       | €20       |
 
-On international journeys, the reservation price is €40 (1st class) and €20 (2nd class).
-{{% /expander %}}
+{{% /train-category %}}
 
-{{% expander "Intercité (IC) ⚠️" traincategory "long-distance" %}}
-**Description:** \
+{{% train-category
+  title="Intercité (IC)"
+  type="highspeed"
+  fip_accepted=true
+  reservation_required=partially
+%}}
 Intercity trains operated by SNCF, connecting various cities in France, mostly requiring reservations.
 
-SNCF does not provide public information on which `IC` trains require reservations. If in doubt, check with SNCF or purchase a reservation. \
-**Reservation possible:** yes \
-**Reservation required:** mostly ⚠️ \
-**Reservation cost:** \
-Reservation prices differ between peak and off-peak trains. Off-peak: €2 (1st/2nd class); peak: €16 (1st class), €11 (2nd class). The classification of trains is unfortunately not publicly available.
+SNCF does not provide public information on which `IC` trains require reservations. If in doubt, check with SNCF or purchase a reservation.
 
-On international journeys, the reservation price is €40 (1st class) and €20 (2nd class).
-{{% /expander %}}
+### Reservation
 
-{{% expander "Intercité de nuit ⚠️" traincategory "long-distance" %}}
-**Description:** \
-SNCF night trains within France. International Nightjet connections ended in December 2025. \
-**Reservation possible:** yes \
-**Reservation required:** yes ⚠️ \
-**Reservation cost:** depends on route and occupancy
-{{% /expander %}}
+Prices differ between peak and off-peak trains for national journeys. The classification is not publicly available.
 
-### Regional
+|                   | 1st class | 2nd class |
+| ----------------- | --------- | --------- |
+| National Off-peak | €2        | €2        |
+| National Peak     | €16       | €16       |
+| International     | €40       | €20       |
+
+{{% /train-category %}}
+
+{{% train-category
+  title="Intercité de nuit"
+  type="sleeper"
+  fip_accepted=true
+  reservation_required=true
+%}}
+SNCF night trains within France. International Nightjet connections ended in December 2025.
 
-{{% expander "Train express régional (TER) ⚠️ℹ️" traincategory "regional" %}}
-**Description:** \
-`TER` is a regional train, connecting various cities in France.
+### Reservation
 
-ℹ️ On the Marseille – Nice route, Transdev operates the trains, so FIP is not accepted. However, on the Marseille – Toulon route, SNCF trains are also used, where FIP is accepted. Prior verification of the operator is essential here. \
-**Reservation possible:** sometimes \
-**Reservation required:** sometimes ⚠️ \
-Some lines from Paris require reservations, see [Reservation requirement in regional trains](#reservation-requirement-in-regional-trains)
-{{% /expander %}}
+Cost depends on route and occupancy.
+
+{{% /train-category %}}
+
+### Regional
 
-{{% expander "Réseau Express Régional (RER) ⚠️" traincategory "regional" %}}
-**Description:** \
+{{% train-category
+  title="Train express régional (TER)"
+  type="regional"
+  fip_accepted=true
+  reservation_required=partially
+%}}
+`TER` is SNCF's regional train, connecting various cities in France.
+Some lines from Paris require reservations, see [Reservation requirement in regional trains](#reservation-requirement-in-regional-trains).
+
+{{% highlight confusion %}}
+On the Marseille – Nice route, Transdev operates the trains, so FIP is not accepted. However, on the Marseille – Toulon route, SNCF trains are also used, where FIP is accepted. Prior verification of the operator is essential here.
+{{% /highlight %}}
+{{% /train-category %}}
+
+{{% train-category
+  title="Réseau Express Régional (RER)"
+  type="regional"
+  fip_accepted=partially
+  reservation_possible=false
+%}}
 RER is a suburban train operated by SNCF in Île de France (Greater Paris) and surrounding cities.
 
-⚠️ FIP is only valid on certain RER lines, see [Trains in Greater Paris](#trains-in-greater-paris) \
-**Reservation possible:** no
-{{% /expander %}}
+{{% highlight important %}}
+FIP is only valid on certain RER lines, see [Trains in Greater Paris](#trains-in-greater-paris)
+{{% /highlight %}}
+{{% /train-category %}}
 
 ## Ticket and Reservation Purchase
 
@@ -182,17 +236,32 @@ This reservation requirement applies to the following lines:
 
 ### International TGV inOui / ICE trains
 
-{{% expander "TGV/ICE trains to Germany" info %}}
+{{% train-category
+  title="TGV/ICE trains to Germany"
+  type="highspeed"
+  fip_accepted=true
+  reservation_required=partially
+%}}
 International `TGV` and `ICE` trains are reservation-required in the French section. In Germany, reservations are not required and FIP Coupons are valid.
-{{% /expander %}}
-
-{{% expander "TGV trains to Italy, Spain, and Belgium" info %}}
-International `TGV` services from France to Italy, Spain, or Belgium are reservation-required throughout and FIP Coupons are not valid. Instead, FIP Global Fares can be purchased, which can be expensive (up to €130). [^1]
-{{% /expander %}}
-
-{{% expander "TGV Lyria trains to Switzerland" info %}}
+{{% /train-category %}}
+
+{{% train-category
+  title="TGV trains to Italy, Spain, and Belgium"
+  type="highspeed"
+  fip_accepted=partially
+  reservation_required=true
+%}}
+International `TGV` services from France to Italy, Spain, or Belgium are reservation-required throughout and FIP Coupons are not valid. Instead, FIP Global Fares can be purchased, which can be expensive (up to €130).
+{{% /train-category %}}
+
+{{% train-category
+  title="TGV Lyria trains to Switzerland"
+  type="highspeed"
+  fip_accepted=partially
+  reservation_required=partially
+%}}
 International `TGV` Lyria services from France to Switzerland are reservation-required in the French section and FIP Coupons are not valid. FIP Global Fares can be purchased. In Switzerland, reservations are not required and FIP Coupons are valid.
-{{% /expander %}}
+{{% /train-category %}}
 
 ### Trains in Greater Paris
 
@@ -200,7 +269,12 @@ International `TGV` Lyria services from France to Switzerland are reservation-re
 
 RATP operates the Paris Métro, bus lines, and part of the tram and RER networks. SNCF operates the rest of the RER network and some tram lines. FIP discounts do not apply on RATP services.
 
-{{% expander "RER trains" info %}}
+{{% train-category
+  title="RER trains"
+  type="regional"
+  fip_accepted=partially
+  reservation_possible=nil
+%}}
 Some RER lines are operated by SNCF. FIP discounts apply on the following sections:
 
 - RER Line A – only branches A3 & A5 west of Nanterre Préfecture to Poissy or Cergy-le-Haut
@@ -210,15 +284,25 @@ Some RER lines are operated by SNCF. FIP discounts apply on the following sectio
 - RER Line E – entire line
 
 Note: For journeys between Gare du Nord and Châtelet – Les Halles, only SNCF-operated RER Line D can be used. FIP discounts are not valid on RATP-operated RER Line B on the same section.
-{{% /expander %}}
-
-{{% expander "Transilien trains" info %}}
+{{% /train-category %}}
+
+{{% train-category
+  title="Transilien trains"
+  type="regional"
+  fip_accepted=true
+  reservation_possible=nil
+%}}
 FIP discounts apply on all Transilien lines H, J, K, L, N, P, R, U, and V.
-{{% /expander %}}
-
-{{% expander "Trams" info %}}
+{{% /train-category %}}
+
+{{% train-category
+  title="Trams"
+  type="tram"
+  fip_accepted=partially
+  reservation_possible=nil
+%}}
 Tram lines T4 and T11 are operated by SNCF and can be used with FIP discounts. Tram lines T9 and T13 are operated by SNCF and Keolis and can be used with FIP discounts as well. FIP discounts do not apply on other tram lines.
-{{% /expander %}}
+{{% /train-category %}}
 
 <img src="/en/operator/sncf/contramarquedePassage.webp" alt="Contramarque de Passage" style="width: 60%; float: right; margin-left: 2rem; margin-bottom: 1rem">
 
diff --git a/i18n/de.yaml b/i18n/de.yaml
index 63776d4c..8c6c2414 100644
--- a/i18n/de.yaml
+++ b/i18n/de.yaml
@@ -36,6 +36,7 @@ footer-love:
   text: Made with ♥️ in Europe
 general: Übergreifendes
 highlight:
+  confusion: Verwechslungsgefahr
   important: Wichtige Information
   inofficial: Inoffizielle Information
   tip: Persönlicher Tipp
@@ -118,6 +119,21 @@ support:
     href="/de/contact">Kontaktformular</a> schreiben.
   title: Unterstütze uns
 toc_name: Inhalt
+trainCategory:
+  acceptance:
+    accepted: FIP akzeptiert
+    notAccepted: FIP nicht akzeptiert
+    partiallyAccepted: FIP teilweise akzeptiert
+  additionalInformation: Zusätzliche Informationen
+  importantInformation: Wichtige Informationen
+  reservation:
+    notPossible: Keine Reservierung möglich
+    partiallyPossible: Reservierung teilweise möglich
+    partiallyRequired: Reservierung teilweise erforderlich
+    possible: Reservierung möglich
+    required: Reservierung erforderlich
+  riskOfConfusion: Verwechslungsgefahr
+  routeOverview: Streckenübersicht
 updateDate:
   aria-label: Öffne die Commit-Verlauf der Seite
   label: Zuletzt aktualisiert
diff --git a/i18n/en.yaml b/i18n/en.yaml
index 5ad6d12f..c2221494 100644
--- a/i18n/en.yaml
+++ b/i18n/en.yaml
@@ -34,6 +34,7 @@ footer-love:
   text: Made with ♥️ in Europe
 general: general
 highlight:
+  confusion: Risk of Confusion
   important: Important Information
   inofficial: Unofficial Information
   tip: Personal Tip
@@ -112,6 +113,21 @@ support:
     href="/en/contact">contact form</a>.
   title: Support Us
 toc_name: Contents
+trainCategory:
+  acceptance:
+    accepted: FIP accepted
+    notAccepted: FIP not accepted
+    partiallyAccepted: FIP partially accepted
+  additionalInformation: Additional information
+  importantInformation: Important information
+  reservation:
+    notPossible: No reservation possible
+    partiallyPossible: Reservation partially possible
+    partiallyRequired: Reservation partially required
+    possible: Reservation possible
+    required: Reservation required
+  riskOfConfusion: Risk of confusion
+  routeOverview: Route overview
 updateDate:
   aria-label: Open the commit history of the page
   label: Last updated
diff --git a/i18n/fr.yaml b/i18n/fr.yaml
index 46299f7d..18820f12 100644
--- a/i18n/fr.yaml
+++ b/i18n/fr.yaml
@@ -36,6 +36,7 @@ footer-love:
   aria-label: Fait avec amour en Europe
   text: Fait avec ♥️ en Europe
 highlight:
+  confusion: Risque de confusion
   important: Informations importantes
   inofficial: Informations non officielles
   tip: Conseil personnel
@@ -115,6 +116,21 @@ support:
     le <a href="/fr/contact">formulaire de contact</a>.
   title: Soutenez-nous
 toc_name: Sommaire
+trainCategory:
+  acceptance:
+    accepted: FIP accepté
+    notAccepted: FIP non accepté
+    partiallyAccepted: FIP partiellement accepté
+  additionalInformation: Informations complémentaires
+  importantInformation: Informations importantes
+  reservation:
+    notPossible: Aucune réservation possible
+    partiallyPossible: Réservation partiellement possible
+    partiallyRequired: Réservation partiellement requise
+    possible: Réservation possible
+    required: Réservation requise
+  riskOfConfusion: Risque de confusion
+  routeOverview: Aperçu de l'itinéraire
 updateDate:
   aria-label: Ouvrir l'historique des commits de la page
   label: Dernière mise à jour
diff --git a/layouts/partials/highlight.html b/layouts/partials/highlight.html
index 573301fb..e36a48f7 100644
--- a/layouts/partials/highlight.html
+++ b/layouts/partials/highlight.html
@@ -1,4 +1,9 @@
-{{ $iconMapping := dict "important" "error" "inofficial" "warning" "tip" "lightbulb_2" }}
+{{ $iconMapping := dict
+  "important" "campaign"
+  "inofficial" "warning"
+  "tip" "lightbulb_2"
+  "confusion" "question_exchange"
+}}
 
 
 <div class="m-text-highlight m-text-highlight--{{ .Type }}">
diff --git a/layouts/partials/tag.html b/layouts/partials/tag.html
new file mode 100644
index 00000000..c53e1662
--- /dev/null
+++ b/layouts/partials/tag.html
@@ -0,0 +1,4 @@
+<span class="a-tag a-tag--{{ .Type }}">
+  {{ partial "icon" .Icon }}
+  <span class="a-tag__text">{{ i18n .Text }}</span>
+</span>
diff --git a/layouts/partials/train-category.html b/layouts/partials/train-category.html
new file mode 100644
index 00000000..8954669d
--- /dev/null
+++ b/layouts/partials/train-category.html
@@ -0,0 +1,133 @@
+<details class="o-expander o-expander--train-category" name="train-category">
+  <summary class="o-expander__summary o-expander__summary--train-category">
+    <div class="o-train-category__header">
+      <div class="o-train-category__title">
+        {{ $iconMapping := dict
+          "highspeed" "train"
+          "regional" "directions_subway"
+          "subway" "subway"
+          "sleeper" "hotel"
+          "funicular" "funicular"
+          "bus" "directions_bus"
+          "tram" "tram"
+        }}
+        {{- partial "icon" (index $iconMapping .type) -}}
+        <span class="o-train-category__title-text">{{- .title -}}</span>
+      </div>
+      <div class="o-train-category__tags">
+        {{- if eq .fip_accepted true -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "check_circle"
+            "Text" "trainCategory.acceptance.accepted"
+            "Type" "success"
+            )
+          }}
+        {{- else if eq .fip_accepted "partially" -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "info"
+            "Text" "trainCategory.acceptance.partiallyAccepted"
+            "Type" "warning"
+            )
+          }}
+        {{- else -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "cancel"
+            "Text" "trainCategory.acceptance.notAccepted"
+            "Type" "error"
+            )
+          }}
+        {{- end -}}
+
+        {{- if eq .reservation_required true -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "calendar_add_on"
+            "Text" "trainCategory.reservation.required"
+            "Type" "error"
+            )
+          }}
+        {{- else if eq .reservation_required "partially" -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "calendar_add_on"
+            "Text" "trainCategory.reservation.partiallyRequired"
+            "Type" "warning"
+            )
+          }}
+        {{- else if eq .reservation_possible true -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "calendar_check"
+            "Text" "trainCategory.reservation.possible"
+            "Type" "info"
+            )
+          }}
+        {{- else if eq .reservation_possible "partially" -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "calendar_lock"
+            "Text" "trainCategory.reservation.partiallyPossible"
+            "Type" "info"
+            )
+          }}
+        {{- else if eq .reservation_possible false -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "calendar_lock"
+            "Text" "trainCategory.reservation.notPossible"
+            "Type" "info"
+            )
+          }}
+        {{- end -}}
+
+        {{- if .risk_of_confusion -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "question_exchange"
+            "Text" "trainCategory.riskOfConfusion"
+            "Type" "warning"
+            )
+          }}
+        {{- end -}}
+
+        {{- if .important_info -}}
+          {{ partial "tag" (
+            dict
+            "Icon" "campaign"
+            "Text" "trainCategory.importantInformation"
+            "Type" "warning"
+            )
+          }}
+        {{- end -}}
+      </div>
+    </div>
+    {{- partial "icon" "keyboard_arrow_down" -}}
+  </summary>
+  <hr aria-hidden="true" />
+  <div class="o-expander__content o-train-category__content">
+    {{- .content -}}
+    {{- if or .route_overview_url .additional_information_url -}}
+      <div>
+        {{- if .route_overview_url -}}
+          {{- partial "button"
+            (dict
+            "Destination" .route_overview_url
+            "Text" (T "trainCategory.routeOverview")
+            )
+          -}}
+        {{- end -}}
+        {{- if .additional_information_url -}}
+          {{- partial "button"
+            (dict
+            "Destination" .additional_information_url
+            "Text" (T "trainCategory.additionalInformation")
+            )
+          -}}
+        {{- end -}}
+      </div>
+    {{- end -}}
+  </div>
+</details>
diff --git a/layouts/shortcodes/expander.html b/layouts/shortcodes/expander.html
index 03ed31b1..63005d1d 100644
--- a/layouts/shortcodes/expander.html
+++ b/layouts/shortcodes/expander.html
@@ -4,7 +4,7 @@
 
 <details name="{{ (.Get 2) }}" class="o-expander">
   <summary class="o-expander__summary">
-    <div>
+    <div class="o-expander__summary-title">
       {{- partial "icon" (index $iconMapping $param) -}}
       <span class="o-expander__summary-text">{{ (.Get 0) }}</span>
     </div>
diff --git a/layouts/shortcodes/train-category.html b/layouts/shortcodes/train-category.html
new file mode 100644
index 00000000..48022f4f
--- /dev/null
+++ b/layouts/shortcodes/train-category.html
@@ -0,0 +1,14 @@
+{{- $data := dict
+  "title" (.Get "title")
+  "type" (default "regional" (.Get "type"))
+  "fip_accepted" (default true (.Get "fip_accepted"))
+  "reservation_required" (default false (.Get "reservation_required"))
+  "reservation_possible" (default false (.Get "reservation_possible"))
+  "risk_of_confusion" (strings.Contains .Inner "m-text-highlight--confusion")
+  "important_info" (strings.Contains .Inner "m-text-highlight--important")
+  "route_overview_url" (.Get "route_overview_url")
+  "additional_information_url" (.Get "additional_information_url")
+  "content" (.Inner | .Page.RenderString)
+-}}
+
+{{- partial "train-category" $data -}}
diff --git a/package-lock.json b/package-lock.json
index 44749d9d..22cfd218 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
       "version": "1.0.0",
       "license": "ISC",
       "dependencies": {
-        "@fontsource/material-symbols-rounded": "^5.2.26",
+        "@fontsource/material-symbols-rounded": "^5.2.29",
         "@fontsource/roboto": "^5.2.8",
         "@fontsource/sansita": "^5.2.8",
         "@panzoom/panzoom": "^4.6.0",
@@ -21,9 +21,9 @@
       }
     },
     "node_modules/@fontsource/material-symbols-rounded": {
-      "version": "5.2.26",
-      "resolved": "https://registry.npmjs.org/@fontsource/material-symbols-rounded/-/material-symbols-rounded-5.2.26.tgz",
-      "integrity": "sha512-uvafxIB7sAzXhhwpZHAaugvgULhfA+wyzPomU2CyI+xzNMfyR/42QOKlEQkac+/0alRlczMI1f9o07CtN3a9dw==",
+      "version": "5.2.29",
+      "resolved": "https://registry.npmjs.org/@fontsource/material-symbols-rounded/-/material-symbols-rounded-5.2.29.tgz",
+      "integrity": "sha512-7TajzVIcRvnHfbnOWQ9G9tDmZSp7xyX8jK52c/tVPYpUPVvSxZOmQOffYrF1tbqr1HH8DXJd2I+oMIRrrDd20Q==",
       "license": "OFL-1.1",
       "funding": {
         "url": "https://github.com/sponsors/ayuhito"
diff --git a/package.json b/package.json
index 26efce55..2555ed29 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
   "homepage": "https://github.com/fipguide/fipguide.github.io#readme",
   "description": "",
   "dependencies": {
-    "@fontsource/material-symbols-rounded": "^5.2.26",
+    "@fontsource/material-symbols-rounded": "^5.2.29",
     "@fontsource/roboto": "^5.2.8",
     "@fontsource/sansita": "^5.2.8",
     "@panzoom/panzoom": "^4.6.0",