/* ==========================================================================
   Robustbook — Bausteinbibliothek rb-v2
   Stufe 1 des Umzugs auf Redesign v2. Werte 1:1 aus
   "Robustbook Redesign v2.dc.html" (1.233 Zeilen), nicht aus Annahmen.

   Regeln dieser Datei:
   - Keine Regel beginnt mit einer Bootstrap-Klasse.
   - Keine Regel mit erzwungener Vorrangmarkierung (siehe Abnahmepunkt in
     AP 1.2). Schutz vor der Bootstrap-Kaskade kommt stattdessen aus der
     Spezifitaet: jede Bausteinregel haengt unter der Wurzelklasse .rbv2,
     zwei Klassen sind spezifischer als Bootstraps meist einzelne Klassen
     oder Elementselektoren.
   - Alle Bausteinklassen tragen den Vorsatz "rbv2-".
   - Die data-Schalter des Entwurfs (data-pad, data-sect, data-stack,
     data-row, data-cta, data-hidesm, data-desknav, data-burger, data-util,
     data-hero, data-tight, data-push) sind hier Klassen, keine
     Attributselektoren.
   - Diese Datei ersetzt css/robustbook-2026.css nicht. Die bleibt
     unangetastet, bis eine spaetere Stufe sie abloest.

   Schriften: "Space Grotesk" und "Space Mono" liegen bereits lokal unter
   /fonts/ (siehe robustbook-2026.css). "Hanken Grotesk" ist im Entwurf neu
   und liegt NICHT lokal vor — hier nur als Merkmal mit Systemfallback
   hinterlegt, kein @font-face, kein CDN-Aufruf. Siehe Gestaltungsbuch V2,
   Abschnitt "Was offen bleibt".
   ========================================================================== */

@font-face{
  font-family:"Space Grotesk";
  src:url("/fonts/SpaceGrotesk-Regular.ttf") format("truetype");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Space Grotesk";
  src:url("/fonts/SpaceGrotesk-Medium.ttf") format("truetype");
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Space Grotesk";
  src:url("/fonts/SpaceGrotesk-SemiBold.ttf") format("truetype");
  font-weight:600; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Space Grotesk";
  src:url("/fonts/SpaceGrotesk-Bold.ttf") format("truetype");
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Space Mono";
  src:url("/fonts/SpaceMono-Regular.ttf") format("truetype");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Space Mono";
  src:url("/fonts/SpaceMono-Bold.ttf") format("truetype");
  font-weight:700; font-style:normal; font-display:swap;
}

/* --------------------------------------------------------------------------
   1. Marken — Farben, Schrift, Form, Haltepunkte, alle auf :root
   -------------------------------------------------------------------------- */
:root{
  /* Grund */
  --rbv2-grund:#0B0F1A;
  --rbv2-grund-tief:#080C15;
  --rbv2-flaeche:#101728;

  /* Linien — vier Stufen, von deutlich bis kaum sichtbar */
  --rbv2-linie:#1C2435;        /* Sektionsgrenzen, Kopf-/Fusszeile */
  --rbv2-linie-fein:#1F2738;   /* Karten, Formularfelder, Tabellenrahmen */
  --rbv2-linie-schwach:#131B29;/* Tabellenzeilen, mobiles Menue */
  --rbv2-linie-stark:#283447;  /* Rahmen von Outline-Knoepfen, Trenner */

  /* Akzent */
  --rbv2-akzent:#2F80FF;
  --rbv2-akzent-hover:#1B5FD9;
  --rbv2-akzent-hell:#6BA4FF;
  --rbv2-akzent-schwach:rgba(47,128,255,.09);   /* Trefferzeile Geraetewahl */
  --rbv2-akzent-schwach-2:rgba(47,128,255,.12); /* Auswahl-Chip Vergleich */
  --rbv2-akzent-schwach-3:rgba(47,128,255,.14); /* aktiver Vergleichsknopf */
  --rbv2-akzent-schwach-4:rgba(47,128,255,.05); /* Diagonalraster */
  --rbv2-akzent-schwach-5:rgba(47,128,255,.18); /* Glow-Blob Zentrum */

  /* Text, dunkler Grund */
  --rbv2-text:#E7EAF0;
  --rbv2-text-2:#C2C9D6;
  --rbv2-text-3:#A7AFBE;
  --rbv2-text-4:#9AA4B2;
  --rbv2-text-5:#D6DCE6;
  --rbv2-gedaempft:#6B7587;
  --rbv2-gedaempft-2:#5C6678;
  --rbv2-gedaempft-3:#3A4255;

  /* Helle Abschnitte — neu gegenueber der Augustfassung, eigene Textstufen */
  --rbv2-hell-grund:#FFFFFF;
  --rbv2-hell-ink:#0B0F1A;
  --rbv2-hell-text:#3A4255;     /* Fliesstext, z. B. Herstellerbeschreibung */
  --rbv2-hell-text-2:#6B7280;   /* Lead-Text "Nach Branche" — Abweichung von
                                    --rbv2-gedaempft (#6B7587), siehe Bestands-
                                    aufnahme AP 1.1 */
  --rbv2-hell-text-3:#28323F;   /* Listenzeilen "Auf einen Blick" */
  --rbv2-hell-kante:#EAEDF3;
  --rbv2-hell-kante-2:#D6DCE6;

  /* Schrift */
  --rbv2-schrift-display:'Space Grotesk','Noto Sans','Noto Sans SC',sans-serif;
  --rbv2-schrift-text:'Hanken Grotesk','Noto Sans','Noto Sans SC',sans-serif;
  --rbv2-schrift-mono:'Space Mono',monospace;

  /* Form */
  --rbv2-radius-sm:5px;
  --rbv2-radius:6px;
  --rbv2-radius-md:8px;
  --rbv2-radius-lg:10px;

  /* Bahnbreite */
  --rbv2-max:1320px;
  --rbv2-pad-desk:40px;
  --rbv2-pad-mobil:20px;

  /* Haltepunkte des Entwurfs — als Merkmal dokumentiert; Medienabfragen
     koennen die Werte nicht auswerten, sie stehen zusaetzlich als Beleg. */
  --rbv2-bp-nav:1080px;
  --rbv2-bp-service:980px;
  --rbv2-bp-stapel:820px;
  --rbv2-bp-eng:520px;
}

/* --------------------------------------------------------------------------
   2. Wurzel und Grundregeln — nur innerhalb .rbv2 wirksam
   -------------------------------------------------------------------------- */
.rbv2{
  background:var(--rbv2-grund);
  color:var(--rbv2-text-2);
  font-family:var(--rbv2-schrift-text);
  font-size:16px;
  line-height:1.6;
  min-height:100vh;
  overflow-x:hidden;
}
.rbv2 *{box-sizing:border-box}
/* height:auto gehoert zu max-width:100%. Ohne diese Zeile bleibt das
   height-Attribut aus dem Markup wirksam, sobald die Breite begrenzt wird -
   gemessen am 23.08.2026 am Hero-Bild der Startseite: 800x640 im Attribut,
   576 px verfuegbar, gerendert 576x640 statt 576x461, also 39 Prozent zu
   hoch. Die spezifischeren img-Regeln weiter unten (Navigation, Karten,
   Galerie) bleiben davon unberuehrt. */
.rbv2 img{max-width:100%;height:auto}
.rbv2 a{color:var(--rbv2-akzent);text-decoration:none;font-family:inherit}
.rbv2 a:hover{color:var(--rbv2-akzent-hell)}
.rbv2 input,
.rbv2 select,
.rbv2 textarea,
.rbv2 button{font-family:inherit}
.rbv2 ::selection{background:var(--rbv2-akzent);color:#fff}
.rbv2 ::placeholder{color:var(--rbv2-gedaempft-2)}

@keyframes rbv2In{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.rbv2 .rbv2-enter{animation:rbv2In .18s ease}
.rbv2 .rbv2-enter-slow{animation:rbv2In .3s ease}

.rbv2 a:focus-visible,
.rbv2 button:focus-visible,
.rbv2 input:focus-visible,
.rbv2 select:focus-visible,
.rbv2 textarea:focus-visible,
.rbv2 [tabindex]:focus-visible{
  outline:2px solid var(--rbv2-akzent);
  outline-offset:2px;
  border-radius:var(--rbv2-radius-sm);
}

/* --------------------------------------------------------------------------
   3. data-Schalter des Entwurfs, als Klassen
   -------------------------------------------------------------------------- */

/* data-pad: seitliche Innenabstaende einer Bahn, nur links/rechts betroffen */
.rbv2 .rbv2-pad{padding-left:var(--rbv2-pad-desk);padding-right:var(--rbv2-pad-desk)}
@media (max-width:820px){
  .rbv2 .rbv2-pad{padding-left:var(--rbv2-pad-mobil);padding-right:var(--rbv2-pad-mobil)}
}

/* data-sect: Sektionsabstand oben/unten, bei 820px greift der Fusswert */
.rbv2 .rbv2-sect{}
@media (max-width:820px){
  .rbv2 .rbv2-sect{padding-top:56px;padding-bottom:0}
}

/* data-stack: aus dem Zwei-Spalten-Grid wird eine Spalte */
.rbv2 .rbv2-stack{}
@media (max-width:820px){
  .rbv2 .rbv2-stack{grid-template-columns:1fr;gap:28px}
}

/* data-row: aus der Zeile wird eine Spalte, linksbuendig */
.rbv2 .rbv2-row{}
@media (max-width:820px){
  .rbv2 .rbv2-row{flex-direction:column;align-items:flex-start}
  .rbv2 .rbv2-row .rbv2-push{margin-left:0}
}

/* data-cta: Aktionsknopf wird auf kleinen Breiten volle Breite */
.rbv2 .rbv2-cta{}
@media (max-width:820px){
  .rbv2 .rbv2-cta{width:100%;justify-content:center}
}

/* data-hidesm: auf kleinen Breiten ausgeblendet */
.rbv2 .rbv2-hidesm{}
@media (max-width:820px){
  .rbv2 .rbv2-hidesm{display:none}
}

/* data-desknav / data-burger: Nav wechselt bei 1080px auf Burger */
.rbv2 .rbv2-desknav{display:flex}
.rbv2 .rbv2-burger{display:none}
@media (max-width:1080px){
  .rbv2 .rbv2-desknav{display:none}
  .rbv2 .rbv2-burger{display:flex}
}

/* data-util: Servicezeile faellt bei 980px weg */
.rbv2 .rbv2-util{}
@media (max-width:980px){
  .rbv2 .rbv2-util{display:none}
}

/* data-hero: Hero-Innenabstand oben/unten schrumpft bei 820px */
/* Innenabstand des Hero-Bereichs. Stand bis 23.08.2026 leer - gemessen sass
   die erste Zeile jeder Unterseite exakt auf der Unterkante der Kopfzeile
   (Luecke 0 px). Die Vorgabe gibt dem Hero jeder Unterseite 56 px oben und
   46 px unten; unterhalb von 820 px greifen weiter die Werte darunter. */
.rbv2 .rbv2-hero{padding-top:56px;padding-bottom:46px}
@media (max-width:820px){
  .rbv2 .rbv2-hero{padding-top:44px;padding-bottom:48px}
}

/* data-tight: Karteninnenabstand schrumpft bei 520px */
.rbv2 .rbv2-tight{}
@media (max-width:520px){
  .rbv2 .rbv2-tight{padding:22px 18px}
}

/* data-push: schiebt sich in der Zeile nach rechts, siehe .rbv2-row oben
   fuer das Rueckgaengigmachen bei 820px */
.rbv2 .rbv2-push{margin-left:auto}

/* --------------------------------------------------------------------------
   4. Bahn und Gitter
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-container{max-width:var(--rbv2-max);margin:0 auto;padding-left:var(--rbv2-pad-desk);padding-right:var(--rbv2-pad-desk)}

.rbv2 .rbv2-grid{display:grid;gap:18px}
.rbv2 .rbv2-grid-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.rbv2 .rbv2-grid-4{grid-template-columns:repeat(auto-fit,minmax(238px,1fr))}
.rbv2 .rbv2-grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px}

/* Sektionskopf — Kopfzeile aus H2 und einem rechtsbündigen Verweis
   (__push, z. B. "Geräte vergleichen →" in A5) oder einer rechtsbündigen
   Notiz (__notiz, z. B. "5 Marken · 45 Geräte" in A4). Eigene, benannte
   Klasse statt des generischen Paars .rbv2-row/.rbv2-push, weil beide
   Endungen eine eigene Typografie tragen statt nur margin-left:auto. Unter
   820px verlieren beide margin-left:auto, sonst kleben sie am Rand, sobald
   die Kopfzeile umbricht (flex-wrap:wrap gilt bereits ab Vollbreite). */
.rbv2 .rbv2-sektionskopf{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px;margin-bottom:32px}
.rbv2 .rbv2-sektionskopf__push{
  margin-left:auto;font-family:var(--rbv2-schrift-mono);font-size:11.5px;
  letter-spacing:.12em;text-transform:uppercase;
}
.rbv2 .rbv2-sektionskopf__notiz{margin-left:auto;font-size:15px;color:var(--rbv2-gedaempft)}
@media (max-width:820px){
  .rbv2 .rbv2-sektionskopf__push,
  .rbv2 .rbv2-sektionskopf__notiz{margin-left:0}
}

/* Zweispaltiges Raster für die helle "Nach Branche"-Sektion (A6): links
   Text und .rbv2-hell-verweis, rechts das Branchenraster (.rbv2-panel mit
   .rbv2-tile-link). Eigene Klasse statt .rbv2-grid.rbv2-grid-2, weil die
   Markup-Vorgabe dort ohne die Basisklasse .rbv2-grid auskommt — dieselben
   Werte, nur als eigenständige, kombinationsfreie Klasse. */
.rbv2 .rbv2-zweispalt{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px}

/* --------------------------------------------------------------------------
   5. Typografie
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-kicker-row{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.rbv2 .rbv2-kicker-rule{width:42px;height:3px;background:var(--rbv2-akzent);display:block}
.rbv2 .rbv2-kicker{
  font-family:var(--rbv2-schrift-mono);
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--rbv2-akzent);
}

/* Schrittnummer der Ablaufkarten "So läuft's ab" (A7) — Mono-Zahlenmarke
   01/02/03 statt der bisherigen Zählung "1./2./3.". Eigene, schlankere
   Klasse statt Wiederverwendung von .rbv2-kicker: die Zahl braucht weder
   dessen .2em-Sperrung/Grossschreibung noch den vorangestellten Strich. */
.rbv2 .rbv2-schrittnummer{
  display:block;font-family:var(--rbv2-schrift-mono);font-size:12px;
  letter-spacing:.14em;color:var(--rbv2-akzent);margin-bottom:18px;
}

.rbv2 .rbv2-eyebrow{
  font-family:var(--rbv2-schrift-mono);
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--rbv2-gedaempft-3);
}

.rbv2 .rbv2-h1{
  font-family:var(--rbv2-schrift-display);font-weight:700;
  font-size:clamp(30px,4.2vw,66px);line-height:1.1;letter-spacing:-.025em;
  margin:0 0 18px;color:#fff;
}
.rbv2 .rbv2-h1 .rbv2-h1-akzent{color:var(--rbv2-akzent)}

.rbv2 .rbv2-h2{
  font-family:var(--rbv2-schrift-display);font-weight:700;
  font-size:clamp(26px,3vw,40px);letter-spacing:-.02em;margin:0;color:#fff;
}
.rbv2 .rbv2-h2--klein{font-size:clamp(23px,2.6vw,34px)}

.rbv2 .rbv2-h3{
  font-family:var(--rbv2-schrift-display);font-weight:700;
  font-size:20px;letter-spacing:-.01em;margin:0 0 12px;color:#fff;
}

.rbv2 .rbv2-lead{
  font-size:18px;line-height:1.66;color:var(--rbv2-text-3);
  max-width:54ch;margin:0;text-wrap:pretty;
}

.rbv2 .rbv2-fliesstext{font-size:16px;color:var(--rbv2-text-3);margin:0;text-wrap:pretty}

/* Helle Fliesstext-Variante fuer weisse Abschnitte */
.rbv2 .rbv2-fliesstext--hell{color:var(--rbv2-hell-text);font-size:17px;line-height:1.72}

/* Bildunterschrift unter dem Hero-Bild der Startseite (A2) — Muster
   "MODELL · CPU · SCHUTZART · ZOLL". Nur gesetzt, wenn das Bild ein
   benanntes Modell zeigt und jeder Wert aus dessen Datenblatt belegt ist. */
.rbv2 .rbv2-hero-bildunterschrift{
  font-family:var(--rbv2-schrift-mono);font-size:11.5px;letter-spacing:.08em;
  color:var(--rbv2-gedaempft-3);text-align:center;margin-top:6px;
}

/* Schlagschatten des Hero-Bildes, wie die Vorlage ihn setzt. Bewusst eine
   eigene Klasse statt .rbv2-hero img: die Produktseiten tragen inzwischen
   ebenfalls .rbv2-hero, ihr Foto sitzt dort in .rbv2-gallery-main und
   braucht keinen Schatten. */
.rbv2 .rbv2-hero-bild{filter:drop-shadow(0 40px 60px rgba(0,0,0,.6))}
@media (prefers-reduced-motion: reduce){
  .rbv2 .rbv2-hero-bild{filter:none}
}

/* --------------------------------------------------------------------------
   6. Knoepfe
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--rbv2-schrift-display);font-weight:600;
  border-radius:var(--rbv2-radius);cursor:pointer;border:none;
  font-size:15px;padding:15px 26px;
}
.rbv2 .rbv2-btn-primary{
  background:var(--rbv2-akzent);color:#fff;
}
.rbv2 .rbv2-btn-primary:hover{background:var(--rbv2-akzent-hover);color:#fff}

.rbv2 .rbv2-btn-outline{
  background:none;border:1px solid var(--rbv2-linie-stark);color:var(--rbv2-text);
}
.rbv2 .rbv2-btn-outline:hover{border-color:var(--rbv2-akzent);color:var(--rbv2-akzent)}

.rbv2 .rbv2-btn-outline--mono{
  font-family:var(--rbv2-schrift-mono);font-weight:400;font-size:14px;
}

.rbv2 .rbv2-btn--klein{font-size:14.5px;padding:14px 24px}
.rbv2 .rbv2-btn--block{display:flex;width:100%;text-align:center;justify-content:center}

/* Vergleichsknopf auf Produktkarten — zwei Zustaende, aus JS-Logik
   this.cmpButton() abgeleitet: aus/an */
.rbv2 .rbv2-btn-compare{
  margin-top:auto;cursor:pointer;border-radius:var(--rbv2-radius);
  font-family:var(--rbv2-schrift-display);font-weight:600;font-size:13.5px;
  padding:11px 12px;width:100%;
  background:transparent;border:1px solid var(--rbv2-linie-stark);color:var(--rbv2-text-2);
}
.rbv2 .rbv2-btn-compare.rbv2-is-active{
  background:var(--rbv2-akzent-schwach-3);border-color:var(--rbv2-akzent);color:var(--rbv2-akzent-hell);
}

/* --------------------------------------------------------------------------
   7. Karten
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-card{
  background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);
  border-radius:var(--rbv2-radius-lg);
}
.rbv2 .rbv2-card--pad{padding:30px}
.rbv2 .rbv2-card--pad-lg{padding:34px 32px}

.rbv2 .rbv2-product-card{
  display:flex;flex-direction:column;
  background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);
  border-radius:var(--rbv2-radius-lg);overflow:hidden;color:var(--rbv2-text);
}
.rbv2 .rbv2-product-card:hover{border-color:var(--rbv2-akzent)}
.rbv2 .rbv2-product-card__figure{
  background:var(--rbv2-grund);padding:22px;display:flex;align-items:center;justify-content:center;
  height:186px;border-bottom:1px solid var(--rbv2-linie-fein);
}
.rbv2 .rbv2-product-card__figure img{max-width:100%;max-height:142px;object-fit:contain}
.rbv2 .rbv2-product-card__body{padding:17px 19px 19px;display:flex;flex-direction:column;flex:1;gap:7px}
.rbv2 .rbv2-product-card__brand{
  font-family:var(--rbv2-schrift-mono);font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--rbv2-gedaempft-3);
}
.rbv2 .rbv2-product-card__name{
  font-family:var(--rbv2-schrift-display);font-weight:700;font-size:19px;color:#fff;
}
.rbv2 .rbv2-product-card__spec{font-size:14px;color:var(--rbv2-gedaempft)}

/* Kategorie-Kachel, hoeher, mit Bild mittig */
.rbv2 .rbv2-category-card{
  display:flex;flex-direction:column;color:var(--rbv2-text);
  background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);border-radius:var(--rbv2-radius-lg);
  padding:26px 26px 22px;min-height:330px;
}
.rbv2 .rbv2-category-card:hover{border-color:var(--rbv2-akzent)}

/* Innenaufbau der Kategorie-Kachel (A4, Startseiten-Sektion "Nach Bauform")
   — Kopf mit Titel und blauer Mono-Anzahl, Notiz, mittig gesetztes Bild,
   Fusszeile "Modelle →" mit Trennlinie. .rbv2-category-card selbst lieferte
   bislang nur die Aussenform; diese Klassen ergaenzen das Innere als
   eigene Bausteine statt Inline-Stil je Vorkommen. */
.rbv2 .rbv2-category-card__kopf{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.rbv2 .rbv2-category-card__titel{font-family:var(--rbv2-schrift-display);font-weight:700;font-size:23px;color:#fff}
.rbv2 .rbv2-category-card__anzahl{font-family:var(--rbv2-schrift-mono);font-size:11.5px;letter-spacing:.08em;color:var(--rbv2-akzent)}
.rbv2 .rbv2-category-card__notiz{font-size:14.5px;color:var(--rbv2-gedaempft);margin:9px 0 0;max-width:34ch}
.rbv2 .rbv2-category-card__bild{flex:1;display:flex;align-items:center;justify-content:center;padding:14px 0}
.rbv2 .rbv2-category-card__bild img{max-width:78%;max-height:150px;object-fit:contain}
.rbv2 .rbv2-category-card__fuss{
  font-family:var(--rbv2-schrift-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--rbv2-akzent);border-top:1px solid var(--rbv2-linie-fein);padding-top:14px;
}

/* --------------------------------------------------------------------------
   8. Formulare
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-field{display:flex;flex-direction:column;gap:8px}
.rbv2 .rbv2-field-label{
  display:block;font-family:var(--rbv2-schrift-mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--rbv2-gedaempft);
}
.rbv2 .rbv2-field-input{
  width:100%;background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);
  border-radius:var(--rbv2-radius);color:var(--rbv2-text);padding:13px 15px;font-size:15.5px;
}
.rbv2 .rbv2-field-input:focus{border-color:var(--rbv2-akzent);outline:none}
.rbv2 .rbv2-field-input--dunkel{background:var(--rbv2-grund)}
.rbv2 .rbv2-field-input textarea,
.rbv2 textarea.rbv2-field-input{resize:vertical}

.rbv2 .rbv2-form-row{display:grid;gap:20px}
.rbv2 .rbv2-form-row--2{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.rbv2 .rbv2-form-row--wide{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}

.rbv2 .rbv2-checkbox-row{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--rbv2-text-3);cursor:pointer}
.rbv2 .rbv2-checkbox-row input[type="checkbox"]{margin-top:5px;width:17px;height:17px;accent-color:var(--rbv2-akzent)}

/* --------------------------------------------------------------------------
   9. Abzeichen, Pillen, Filter — inklusive Normfilter (neu ggue. August)
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-chip{
  border:1px solid var(--rbv2-linie-fein);border-radius:var(--rbv2-radius-sm);
  padding:8px 12px;font-family:var(--rbv2-schrift-mono);font-size:11.5px;
  letter-spacing:.04em;color:var(--rbv2-text-2);display:inline-block;
}

/* Normfilter-Pille: aus/an, aus der JS-Logik normFilters uebernommen */
.rbv2 .rbv2-filter-pill{
  cursor:pointer;border-radius:var(--rbv2-radius-sm);
  font-family:var(--rbv2-schrift-mono);font-size:11.5px;letter-spacing:.06em;
  padding:9px 13px;background:transparent;border:1px solid var(--rbv2-linie-stark);color:var(--rbv2-text-2);
}
.rbv2 .rbv2-filter-pill.rbv2-is-active{
  background:var(--rbv2-akzent);border-color:var(--rbv2-akzent);color:#fff;
}

/* Segment-Knopf (Typ-/Marken-Tabs im Vergleich, Blog-Tabs) */
.rbv2 .rbv2-segment{display:flex;gap:1px;background:var(--rbv2-linie-fein);border-radius:var(--rbv2-radius);overflow:hidden}
.rbv2 .rbv2-segment-btn{
  flex:1;cursor:pointer;border:none;background:var(--rbv2-flaeche);color:var(--rbv2-gedaempft);
  padding:12px 8px;font-family:var(--rbv2-schrift-display);font-weight:600;font-size:13px;
}
.rbv2 .rbv2-segment-btn.rbv2-is-active{background:var(--rbv2-akzent);color:#fff}

/* Blogfilter-Pille — eigene Form (Rahmen statt Segment), neu ggue. August */
.rbv2 .rbv2-blog-tab{
  cursor:pointer;border-radius:var(--rbv2-radius);
  font-family:var(--rbv2-schrift-display);font-weight:600;font-size:13.5px;
  padding:9px 15px;background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);color:var(--rbv2-gedaempft);
}
.rbv2 .rbv2-blog-tab.rbv2-is-active{background:var(--rbv2-akzent);border-color:var(--rbv2-akzent);color:#fff}

/* Auswahl-Chip im Geraetevergleich */
.rbv2 .rbv2-selection-chip{
  display:flex;align-items:center;gap:9px;background:var(--rbv2-akzent-schwach-2);
  border:1px solid var(--rbv2-akzent);border-radius:var(--rbv2-radius);color:var(--rbv2-akzent-hell);
  padding:8px 9px 8px 13px;font-family:var(--rbv2-schrift-display);font-weight:600;font-size:13.5px;
}
.rbv2 .rbv2-selection-chip__brand{
  font-family:var(--rbv2-schrift-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#3A6BB8;
}
.rbv2 .rbv2-selection-chip__remove{background:none;border:none;color:var(--rbv2-akzent-hell);cursor:pointer;font-size:16px;line-height:1;padding:0 2px}

/* --------------------------------------------------------------------------
   10. Bildergalerie — Produktseite, neu ggue. August
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-gallery-main{
  background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);border-radius:var(--rbv2-radius-lg);
  padding:32px;display:flex;align-items:center;justify-content:center;min-height:380px;
}
.rbv2 .rbv2-gallery-main img{max-width:100%;max-height:360px;object-fit:contain}
.rbv2 .rbv2-gallery-thumbs{display:flex;gap:9px;margin-top:9px}
.rbv2 .rbv2-gallery-thumb{
  flex:1;background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);border-radius:var(--rbv2-radius-md);
  padding:12px;cursor:pointer;height:92px;display:flex;align-items:center;justify-content:center;
}
.rbv2 .rbv2-gallery-thumb.rbv2-is-active{border-color:var(--rbv2-akzent)}
.rbv2 .rbv2-gallery-thumb img{max-width:100%;max-height:66px;object-fit:contain}

/* --------------------------------------------------------------------------
   11. Tabellen — Datenblatt und Vergleich
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-spec-table{width:100%;border-collapse:collapse;font-size:15px}
.rbv2 .rbv2-spec-table tr{border-bottom:1px solid var(--rbv2-linie)}
.rbv2 .rbv2-spec-table th{
  text-align:left;padding:12px 16px 12px 0;font-family:var(--rbv2-schrift-mono);font-weight:400;
  font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--rbv2-gedaempft-2);
  width:40%;vertical-align:top;
}
.rbv2 .rbv2-spec-table td{padding:12px 0;color:var(--rbv2-text-5);vertical-align:top}

.rbv2 .rbv2-compare-table{width:100%;border-collapse:collapse;margin-top:-1px}
.rbv2 .rbv2-compare-table th,
.rbv2 .rbv2-compare-table td{border-left:1px solid var(--rbv2-linie-schwach)}
.rbv2 .rbv2-compare-table thead th{
  background:var(--rbv2-flaeche);border-bottom:1px solid var(--rbv2-linie-fein);
  padding:20px 18px;text-align:left;vertical-align:bottom;min-width:186px;
}
.rbv2 .rbv2-compare-table thead th.rbv2-is-secondary{background:var(--rbv2-grund)}
.rbv2 .rbv2-compare-table tbody th{
  text-align:left;background:var(--rbv2-grund-tief);border-bottom:1px solid var(--rbv2-linie);
  padding:15px 16px;font-family:var(--rbv2-schrift-mono);font-weight:400;font-size:11.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--rbv2-gedaempft);vertical-align:top;
}
.rbv2 .rbv2-compare-table tbody td{border-bottom:1px solid var(--rbv2-linie);padding:15px 18px;font-size:15px;vertical-align:top}
.rbv2 .rbv2-compare-table td.rbv2-value-fehlt{color:var(--rbv2-gedaempft-3)}
.rbv2 .rbv2-compare-table td.rbv2-value-belegt{color:var(--rbv2-text-5)}

/* --------------------------------------------------------------------------
   12. Geteilte Kacheln (Info-Panel) — Kontakt, Branche
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-panel{display:grid;gap:1px;background:var(--rbv2-linie-fein);border:1px solid var(--rbv2-linie-fein);border-radius:var(--rbv2-radius-lg);overflow:hidden}
.rbv2 .rbv2-panel--stack{display:flex;flex-direction:column}
.rbv2 .rbv2-panel__tile{background:var(--rbv2-flaeche);padding:28px}
.rbv2 .rbv2-panel__tile-titel{
  font-family:var(--rbv2-schrift-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--rbv2-akzent);margin-bottom:15px;
}

/* Abwandlungen der Tafel, gemessen am 23.08.2026 auf der Startseite:
   die Tafel stand im hellen Branchenabschnitt mit dunklen Fugen (#1F2738)
   auf Weiss und als einspaltige Liste von zehn Kacheln (631 px hoch,
   die linke Spalte blieb daneben leer). Die Vorgabe zeigt dort helle
   Fugen (#EAEDF3) und ein Raster ab 180 px Spaltenbreite. */
.rbv2 .rbv2-panel--hell{
  background:var(--rbv2-hell-kante);border-color:var(--rbv2-hell-kante);
}
/* 240 px statt der 180 px der Vorgabe: bei zehn Kacheln und 574 px
   Spaltenbreite ergaeben 180 px drei Spalten und damit zwei leere Zellen in
   der letzten Reihe, in denen die Fugenfarbe steht. 240 px ergeben zwei
   Spalten, fuenf volle Reihen, keine leere Zelle. */
.rbv2 .rbv2-panel--kacheln{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}

/* Helle Kachel-Verlinkung (Branchen-Raster auf Startseite) */
.rbv2 .rbv2-tile-link{
  background:var(--rbv2-hell-grund);padding:19px 18px;color:var(--rbv2-hell-ink);
  font-family:var(--rbv2-schrift-display);font-weight:600;font-size:15px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.rbv2 .rbv2-tile-link:hover{background:#EEF1F6;color:var(--rbv2-akzent-hover)}

/* Bild-Abwandlung der Kachel-Verlinkung — Branchen-Raster mit Foto statt
   reiner Textzeile. Die Textfassung (.rbv2-tile-link allein, siehe oben,
   weiterhin in _bausteine.php gezeigt) bleibt unveraendert; diese Klasse
   kommt zusaetzlich dazu und schaltet nur Richtung/Innenabstand um. */
.rbv2 .rbv2-tile-link--bild{
  flex-direction:column;align-items:stretch;justify-content:flex-start;
  gap:0;padding:0;min-width:0;overflow:hidden;
  border:1px solid var(--rbv2-hell-kante);border-radius:var(--rbv2-radius-md);
}
.rbv2 .rbv2-tile-link--bild:hover{border-color:var(--rbv2-akzent)}
.rbv2 .rbv2-tile-link--bild .rbv2-tile-link__bild{
  display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;
}
.rbv2 .rbv2-tile-link--bild .rbv2-tile-link__beschriftung{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:16px 18px;
}

/* Helle Listenzeile ("Auf einen Blick") */
.rbv2 .rbv2-glance-row{background:var(--rbv2-hell-grund);padding:15px 18px;font-size:15px;color:var(--rbv2-hell-text-3)}

/* --------------------------------------------------------------------------
   13. Bahnbruecken — Kopfzeile, Servicezeile, Fusszeile
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-servicezeile{background:var(--rbv2-grund-tief);border-bottom:1px solid var(--rbv2-linie)}
.rbv2 .rbv2-servicezeile-inner{
  display:flex;flex-wrap:wrap;gap:22px;align-items:center;
  font-family:var(--rbv2-schrift-mono);font-size:11.5px;letter-spacing:.06em;color:var(--rbv2-gedaempft-2);
  padding:9px var(--rbv2-pad-desk);
}
.rbv2 .rbv2-servicezeile a{color:var(--rbv2-text-4)}

.rbv2 .rbv2-header{background:rgba(11,15,26,.94)}
.rbv2 .rbv2-header-inner{display:flex;align-items:center;gap:32px;padding:15px var(--rbv2-pad-desk)}

.rbv2 .rbv2-burger-btn{
  background:none;border:1px solid var(--rbv2-linie-stark);border-radius:var(--rbv2-radius);
  color:var(--rbv2-text);cursor:pointer;padding:9px 14px;
  font-family:var(--rbv2-schrift-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  align-items:center;gap:9px;
}
.rbv2 .rbv2-burger-bar{width:15px;height:1.5px;background:var(--rbv2-text);display:block}

.rbv2 .rbv2-mobile-menu{border-top:1px solid var(--rbv2-linie);background:var(--rbv2-grund);padding:18px var(--rbv2-pad-desk) 24px}
.rbv2 .rbv2-mobile-nav-link{
  display:block;padding:14px 0;border-bottom:1px solid var(--rbv2-linie-schwach);
  font-family:var(--rbv2-schrift-display);font-weight:500;font-size:19px;color:var(--rbv2-text);
}

.rbv2 .rbv2-breadcrumb{
  font-family:var(--rbv2-schrift-mono);font-size:11.5px;color:var(--rbv2-gedaempft-3);
  display:flex;flex-wrap:wrap;gap:9px;padding:12px var(--rbv2-pad-desk);
  background:var(--rbv2-grund-tief);border-bottom:1px solid var(--rbv2-linie);
}
.rbv2 .rbv2-breadcrumb a{color:var(--rbv2-gedaempft)}
.rbv2 .rbv2-breadcrumb .rbv2-is-current{color:var(--rbv2-text-2)}

.rbv2 .rbv2-footer{background:var(--rbv2-grund-tief);border-top:1px solid var(--rbv2-linie)}
.rbv2 .rbv2-footer-col-titel{
  font-family:var(--rbv2-schrift-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--rbv2-gedaempft-3);margin-bottom:15px;
}
.rbv2 .rbv2-footer-link{font-size:15px;color:var(--rbv2-text-4)}
.rbv2 .rbv2-footer-link:hover{color:var(--rbv2-akzent)}
.rbv2 .rbv2-footer-bottom{
  border-top:1px solid var(--rbv2-linie-schwach);display:flex;flex-wrap:wrap;gap:14px;
  font-family:var(--rbv2-schrift-mono);font-size:11.5px;color:var(--rbv2-gedaempft-3);
  padding:20px var(--rbv2-pad-desk) 32px;
}

/* Abschlussband (A8) — volle Breite mit Oberkante am Seitenende, ersetzt
   die bisherige "normale Sektion" von FINAL CTA. .rbv2-band__inner traegt
   nur den senkrechten Innenabstand; der waagrechte kommt weiterhin von
   .rbv2-pad an derselben Bahn (Markup: rbv2-container rbv2-pad
   rbv2-band__inner), deshalb hier "padding:56px 0" statt "56px 40px".
   Bricht unter 820px von selbst um (flex-wrap:wrap gilt durchgehend, nicht
   erst ab einem Haltepunkt), .rbv2-band__aktionen braucht kein eigenes
   margin-left — .rbv2-band__text (flex:1) schiebt es bereits an den Rand. */
.rbv2 .rbv2-band{background:var(--rbv2-flaeche);border-top:1px solid var(--rbv2-linie)}
.rbv2 .rbv2-band__inner{display:flex;flex-wrap:wrap;gap:28px;align-items:center;padding:56px 0}
.rbv2 .rbv2-band__text{flex:1;min-width:280px}
.rbv2 .rbv2-band__aktionen{display:flex;flex-wrap:wrap;gap:12px}

/* --------------------------------------------------------------------------
   14. Hintergruende — Diagonalraster und Glow
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-raster{
  position:absolute;inset:0;
  background:repeating-linear-gradient(-47deg,
    var(--rbv2-akzent-schwach-4) 0, var(--rbv2-akzent-schwach-4) 1px,
    transparent 1px, transparent 66px);
}
.rbv2 .rbv2-glow{
  position:absolute;top:-200px;right:-160px;width:660px;height:660px;border-radius:50%;
  background:radial-gradient(circle,var(--rbv2-akzent-schwach-5),transparent 65%);
}
.rbv2 .rbv2-hero-flaeche{position:relative;border-bottom:1px solid var(--rbv2-linie);overflow:hidden}

/* Hero-Band der Unterseiten. Die Vorgabe gibt jedem Seitentyp ausser der
   Startseite denselben Kopf: Rasterflaeche, Kickerzeile, linksbuendige H1.
   .rbv2-hero traegt am Schreibtisch bewusst keinen Innenabstand (die
   Startseite bekommt ihre Hoehe aus der Bildspalte) - deshalb hier eine
   eigene Abwandlung statt einer Aenderung an .rbv2-hero. */
.rbv2 .rbv2-hero--unterseite{padding-top:56px;padding-bottom:46px}
@media (max-width:820px){
  .rbv2 .rbv2-hero--unterseite{padding-top:40px;padding-bottom:34px}
}

/* --------------------------------------------------------------------------
   15. Helle Abschnitte — neu gegenueber der Augustfassung
   -------------------------------------------------------------------------- */
.rbv2 .rbv2-section-light{background:var(--rbv2-hell-grund);color:var(--rbv2-hell-ink)}
.rbv2 .rbv2-section-light a{color:var(--rbv2-hell-ink)}

/* Ueberschriften und Fliesstext im hellen Abschnitt duerfen die weisse Tinte
   der dunklen Buehne nicht erben. robustbook-2026.css spricht h1-h3 direkt
   an (".rb-2026 h1/h2/h3", Spezifitaet 0,1,1) und schlaegt damit die
   Vererbung von .rbv2-section-light; .rbv2 .rbv2-h1/h2/h3 (0,2,0) setzt
   Weiss ebenso fest verdrahtet. Beide Faelle — mit rbv2-Klasse und ohne —
   bekommen hier die noetige Spezifitaet, um auf --rbv2-hell-ink zu drehen. */
.rbv2 .rbv2-section-light h1,
.rbv2 .rbv2-section-light h2,
.rbv2 .rbv2-section-light h3,
.rbv2 .rbv2-section-light .rbv2-lead,
.rbv2 .rbv2-section-light .rbv2-fliesstext{color:var(--rbv2-hell-ink)}
.rbv2 .rbv2-section-light .rbv2-h1,
.rbv2 .rbv2-section-light .rbv2-h2,
.rbv2 .rbv2-section-light .rbv2-h3{color:var(--rbv2-hell-ink)}

/* Textverweis im hellen Abschnitt (A6, "Beratung anfragen →" unter der
   Branchen-Spalte). Kontrast gegen den weissen Grund gerechnet (WCAG-
   Relativluminanz): --rbv2-hell-ink #0B0F1A auf #FFFFFF ergibt 19,2:1,
   weit ueber der Schwelle 4,5:1. */
.rbv2 .rbv2-hell-verweis{
  font-family:var(--rbv2-schrift-display);font-weight:600;font-size:15px;
  color:var(--rbv2-hell-ink);border-bottom:2px solid var(--rbv2-akzent);padding-bottom:3px;
}

/* --------------------------------------------------------------------------
   Nachtrag 22.08.2026 — Markenbeifuegung im Kopf
   Die drei Angaben standen als Inline-Stil an der <span> in header.php und
   hoben damit die Ausblendregel aus robustbook-2026.css Zeile 344
   (@media max-width:1300px {display:none}) auf: ein Inline-Stil schlaegt
   jede Regel aus einem Stilblatt, solange diese nicht erzwungen ist. Sichtbar wurde das erst auf Niederlaendisch —
   "Onderdeel van Bitblade Group" ist mit 28 Zeichen die laengste Fassung und
   liess den Kopf bei 384px um 7px ueberlaufen; Franzoesisch stand mit 25
   Zeichen exakt auf der Kante (rechte Kante 384 bei clientWidth 384).
   Dieselben Angaben hier als Regel, damit die Ausblendung wieder greift.
   -------------------------------------------------------------------------- */
.rbv2 .rb-nav__bitblade-text{white-space:normal;max-width:100px;display:inline-block}
@media (max-width:1300px){
  .rbv2 .rb-nav__bitblade-text{display:none}
}

/* --------------------------------------------------------------------------
   Nachtrag 22.08.2026 — Akzentfarbe ausserhalb von .rbv2-h1
   Die vier Produktseiten-Bausteine (partner_cta.php, fact_blocks.php,
   lead_checklist.php, faqs.php) heben je eine Textspanne innerhalb von
   Ueberschriften der Stufe h2/h3 farblich hervor (z. B. "GEO" in der
   Kurzprofil-Ueberschrift, "Extreme" im Partner-CTA), zusaetzlich einmal an
   einem blossen Icon (Telefon im Partner-CTA). Die einzige vorhandene
   Akzentklasse .rbv2-h1-akzent (Zeile 268) ist an den Vorfahren .rbv2-h1
   gebunden und greift dort nicht. Generische, von der Ueberschriftenstufe
   unabhaengige Klasse, damit dieselbe Hervorhebung ohne neue Bindung an h1
   nutzbar ist. Keine erzwungene Vorrangmarkierung, keine Farbe im style=-Attribut. */
.rbv2 .rbv2-akzent-text{color:var(--rbv2-akzent)}

/* --------------------------------------------------------------------------
   Nachtrag 22.08.2026 — Formular-Rueckmeldung (lead_checklist.php)
   Der Katalog kennt keine Zustandsflaeche fuer Formular-Feedback (Anmeldung
   erfolgreich / Anmeldung fehlgeschlagen). Beide Zustaende sind fuer die
   Checkliste-Anmeldung auf 315 Produktseiten funktional noetig, nicht nur
   dekorativ - ohne sie ist "erfolgreich" und "Fehler" optisch nicht zu
   unterscheiden. Modifikatoren auf Basis von .rbv2-card, gleiches Muster wie
   .rbv2-btn-primary/.rbv2-btn-outline. Keine erzwungene Vorrangmarkierung, keine Farbe im
   style=-Attribut. -------------------------------------------------------- */
.rbv2 .rbv2-card--erfolg{background:var(--rbv2-akzent);border-color:var(--rbv2-akzent);color:#fff}
.rbv2 .rbv2-card--erfolg a{color:#fff}
.rbv2 .rbv2-card--warnung{border-color:var(--rbv2-akzent-hell)}

/* --------------------------------------------------------------------------
   16. Kopfmenue-Klappflaechen und Mega-Panel — Nachtrag 22.08.2026
   Stufe 2, Inhalt der fuenf Kopf-Klappmenues (Tablets, Notebooks,
   Smartphones, Branchen, Unternehmen). Die Klappmechanik selbst (Klassen
   dropdown/dropdown-toggle/dropdown-menu/dropdown-menu-mega, Attribut
   data-toggle, die .show-Umschaltung) bleibt unangetastet — sie traegt
   Bootstraps eigenes JS und darf nicht verschwinden, auch die bereits
   gehaerteten Breitenregeln fuer dropdown-menu-mega (1280/1200/1100px,
   21.08.2026) bleiben dort stehen. Diese Regeln liefern nur die sichtbare
   Haut der Kopfzeilen-Verweise und der aufgeklappten Flaeche: dunkler
   Grund statt Bootstraps weissem Standard, dieselben Marken wie ueberall
   sonst in dieser Datei. Unter den Bausteinen fehlte bisher ein
   Mega-Panel; rbv2-mega ist die Ergaenzung dafuer. Ohne erzwungenen
   Vorrang, wie der Rest der Datei.

   Die Spalten- und Stapel-Massewerte (180px/150px Basisbreite, Umschalten
   auf Stapel unterhalb 1199.98px) sind wortgleich aus den bisherigen
   Klassen dropdown-mega-cols/dropdown-mega-col uebernommen (style.css) —
   nicht neu bemessen, sondern die bereits bewaehrten Werte unter neuem
   Namen, damit hier keine vierte Ueberlaufreparatur noetig wird. -------- */

.rbv2 .rbv2-nav-item{list-style:none}
.rbv2 .rbv2-nav-link{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--rbv2-schrift-display);font-weight:500;
  font-size:14.5px;letter-spacing:.01em;color:var(--rbv2-text-3);
  padding:.4rem .3rem;padding-bottom:2px;border-bottom:1.5px solid transparent;
}
.rbv2 .rbv2-nav-link:hover{color:var(--rbv2-text)}
.rbv2 .rbv2-nav-link>i{display:none}
.rbv2 .rbv2-nav-item.active>.rbv2-nav-link,
.rbv2 .rbv2-nav-link[aria-expanded="true"]{
  color:var(--rbv2-text);border-bottom-color:var(--rbv2-akzent);
}

.rbv2 .rbv2-mega{
  background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);
  border-radius:var(--rbv2-radius-lg);box-shadow:0 20px 45px rgba(0,0,0,.45);
  padding:22px 24px;color:var(--rbv2-text-2);
}
.rbv2 .rbv2-mega--simple{min-width:15rem;padding:8px}

.rbv2 .rbv2-mega-cols{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px 32px}
.rbv2 .rbv2-mega-col{flex:0 1 180px;min-width:150px}
@media (max-width:1199.98px){
  .rbv2 .rbv2-mega-cols{flex-direction:column;flex-wrap:nowrap}
  .rbv2 .rbv2-mega-col{flex:0 0 auto;max-width:none}
}

.rbv2 .rbv2-mega-heading{
  font-family:var(--rbv2-schrift-mono);font-weight:400;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--rbv2-akzent);
  padding:.2rem .5rem;margin:0 0 4px;border-bottom:1px solid var(--rbv2-linie-fein);
}

.rbv2 .rbv2-mega-item{
  display:flex;align-items:center;gap:10px;
  padding:7px 8px;border-radius:var(--rbv2-radius-sm);
  font-family:var(--rbv2-schrift-text);font-size:13.5px;line-height:1.3;color:var(--rbv2-text-2);
}
.rbv2 .rbv2-mega-item:hover{background:var(--rbv2-akzent-schwach);color:var(--rbv2-akzent-hell)}
.rbv2 .rbv2-mega-item img{max-height:46px;width:auto;height:auto;flex-shrink:0}
.rbv2 .rbv2-mega-item__model{font-family:var(--rbv2-schrift-display);font-weight:700;color:var(--rbv2-text)}
.rbv2 .rbv2-mega-item:hover .rbv2-mega-item__model{color:var(--rbv2-akzent-hell)}

.rbv2 .rbv2-mega-item--icon{gap:12px;padding:9px 8px;font-size:14.5px}
.rbv2 .rbv2-mega-item--icon i{color:var(--rbv2-akzent);width:18px;text-align:center;flex-shrink:0}
.rbv2 .rbv2-mega-item--icon .rbv2-mega-item__label{font-family:var(--rbv2-schrift-display);font-weight:600;color:var(--rbv2-text)}
.rbv2 .rbv2-mega-item--icon:hover .rbv2-mega-item__label{color:var(--rbv2-akzent-hell)}

.rbv2 .rbv2-mega-footer{
  display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;justify-content:center;
  border-top:1px solid var(--rbv2-linie-fein);margin-top:.5rem;padding-top:.75rem;
}
.rbv2 .rbv2-mega-item--footer{width:auto;justify-content:center;text-align:center}
.rbv2 .rbv2-mega-item--footer .rbv2-mega-item__model{font-size:13px}

/* --------------------------------------------------------------------------
   Nachtrag 23.08.2026 — dritte Stufe fuer rbv2-compare-table
   Die Vorlage kennt nur zwei Werte-Zustaende (rbv2-value-belegt/-fehlt,
   Abschnitt 11). Die migrierten Vergleichstabellen (vergleichstabelle-*.php)
   fuehrten in der Vorgaengerfassung eine dritte, mittlere Stufe (Bootstrap
   "text-warning": optional/eingeschraenkt verfuegbar, weder voll belegt noch
   fehlend) - das ist eine echte Bausteinluecke, keine Ermessensfrage, siehe
   Ruecklauf zur Pilotseite. Ergaenzung statt Informationsverlust: dieselbe
   Zellklasse wie belegt/fehlt, eigener Farbwert zwischen --rbv2-text-5 und
   --rbv2-gedaempft-3. Keine Regel mit erzwungener Vorrangmarkierung, wie im
   Kopf dieser Datei festgelegt. -------------------------------------------- */
.rbv2 .rbv2-compare-table td.rbv2-value-mittel{color:var(--rbv2-akzent-hell)}

/* --------------------------------------------------------------------------
   17. Konfigurator-Feldgruppen — Nachtrag 23.08.2026 (konfigurator.php)
   Jedes <fieldset> baendelt eine Konfigurator-Gruppe (Dropdown oder
   Checkbox-Liste), bis zu 15 je Geraet - ohne sichtbare Aussenkante liefen
   sie auf der Produktseite optisch ineinander. .rbv2-card ist mit 30px
   Innenabstand und 10px Eckenradius fuer diese Wiederholungsdichte zu
   grosszuegig bemessen, deshalb eigene, kompaktere Aussenwerte - dieselbe
   Flaechen-/Linienfarbe wie .rbv2-card, nur weniger Abstand. Passend dazu
   traegt das <select> darin .rbv2-field-input--dunkel (Grundfarbe statt
   Flaechenfarbe), sonst waeren Feld und Feldgruppe im selben Farbton nicht
   zu unterscheiden - dasselbe Zusammenspiel wie bei der Hero-B-Karte.

   Dazu eine Kontrastkorrektur, die beim Umbau sichtbar wurde: bitblade.css
   setzt fuer den Konfigurator "legend{color:#20242b}", vom frueheren hellen
   Konfigurator-Hintergrund - auf dem heutigen dunklen rbv2-Grund praktisch
   unlesbar (Kontrast unter 1,2:1, live auf durabook-s15 gemessen), und war
   von robustbook-2026.css nie mitgefasst (das Blatt kennt kein
   ".rb-2026 legend"). Hier fest auf die Akzentfarbe gesetzt, damit die
   Gruppenueberschrift unabhaengig von robustbook-2026.css lesbar bleibt.
   label selbst braucht keine eigene Regel mehr: jedes <label> im
   Konfigurator traegt inzwischen .rbv2-field-label oder .rbv2-checkbox-row
   mit je eigener, bereits passender Farbe (Zeile 372 bzw. 389) - eine
   zusaetzliche Element-Regel hier wuerde beide durch hoehere Spezifitaet
   (zwei Klassen plus Element schlaegt zwei Klassen allein) unbeabsichtigt
   uebersteuern. Keine Regel mit erzwungenem Vorrang, wie im Kopf dieser
   Datei festgelegt. */
.rbv2 .rbv2-cfg-feld{
  background:var(--rbv2-flaeche);border:1px solid var(--rbv2-linie-fein);
  border-radius:var(--rbv2-radius-md);padding:16px 18px;margin:0 0 14px;
  max-width:100%;box-sizing:border-box;
}
.rbv2 .rbv2-cfg-feld legend{
  font-family:var(--rbv2-schrift-mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--rbv2-akzent);padding:0 6px;width:auto;
}
.rbv2 .rbv2-cfg-details summary{cursor:pointer}

/* ==========================================================================
   18. Ablösung robustbook-2026.css — Nachtrag 23.08.2026
   Vor dem Herausnehmen von robustbook-2026.css aus der Einbindung systematisch
   geprueft: Kopfzeile, Servicezeile, Sprachklappe und eine Reihe alter
   Bootstrap-Klassen (text-muted, text-primary, btn, card, table, label,
   form-control, alert, img-fluid, h1-h6 ohne eigene rbv2-Klasse) tragen ihre
   heutige Farbe/Schrift/Abstaende AUSSCHLIESSLICH ueber .rb-2026-Regeln aus
   jener Datei - .rbv2 hat dafuer noch keine eigene Entsprechung. body traegt
   "rb-2026 rbv2" gleichzeitig; ohne diesen Nachtrag wuerden alle folgenden
   Ziele beim Herausnehmen auf die alten, fuer helle Seiten gedachten Regeln
   aus bitblade.css/style.css zurueckfallen (u.a. Logo verzerrt, Trennlinie
   im Kopf unsichtbar, Sprachklappe unstyled, Kontaktformular-Beschriftungen
   fast unlesbar, alle Tabellen/Kaesten/Knoepfe ohne Kontur). Werte 1:1 aus
   robustbook-2026.css uebernommen (Custom Properties dort verschwaenden mit
   der Datei, deshalb hier als Festwerte), keine neu erfundene Farbe. Klassen
   ohne jede noch lebende Fundstelle im Bestand (rb-karte, rb-knopf,
   rb-kennwerte, rb-marke, rb-formular, rb-feld, rb-fuss, rb-band,
   rb-zweispaltig, rb-container, rb-abschnitt, rb-aufmacher, rb-raster,
   rb-augenbraue, rb-sprungmarken, rb-nav__klappe, navbar-collapse,
   navbar-toggler) sind bewusst NICHT mitgenommen - fuer sie gibt es nichts
   mehr zu maskieren.
   -------------------------------------------------------------------------- */

/* 18.1 Bewegungsreduktion (unveraendert aus robustbook-2026.css uebernommen) */
@media (prefers-reduced-motion: reduce){
  .rbv2 *, .rbv2 *::before, .rbv2 *::after{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
  }
}

/* 18.2 Servicezeile — verschwindet unter 980px (Kontakt-/Haendler-/
   Sprachzeile oberhalb der Hauptnavigation, auf jeder Seite eingebunden) */
.rbv2 .rb-servicezeile a{color:#A7AFBE}
.rbv2 .rb-servicezeile a:hover{color:#6BA4FF}
.rbv2 .rb-servicezeile__kontakt{display:flex;gap:18px;flex-wrap:wrap}
.rbv2 .rb-servicezeile__rechts{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.rbv2 .rb-servicezeile__haendler{color:#9AA4B2;text-transform:uppercase}
.rbv2 .rb-servicezeile__sprache{display:flex;align-items:center;gap:8px}
.rbv2 .rb-servicezeile__sprache-label{color:#6B7587;letter-spacing:.04em;text-transform:uppercase}

/* 18.3 Sprachklappe (Klappfeld in der Servicezeile) */
.rbv2 .rb-sprachklappe{position:relative}
.rbv2 .rb-sprachklappe__kopf{
  display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;
  border:1px solid #1F2738;border-radius:5px;background:#101728;
  color:#C2C9D6;cursor:pointer;list-style:none;
}
.rbv2 .rb-sprachklappe__kopf::-webkit-details-marker{display:none}
.rbv2 .rb-sprachklappe__kopf::after{
  content:"";width:5px;height:5px;border-right:1px solid #A7AFBE;
  border-bottom:1px solid #A7AFBE;transform:rotate(45deg) translateY(-2px);
  margin-left:2px;
}
.rbv2 .rb-sprachklappe:hover .rb-sprachklappe__kopf,
.rbv2 .rb-sprachklappe[open] .rb-sprachklappe__kopf{border-color:#283447;color:#FFFFFF}
.rbv2 .rb-sprachklappe__liste{
  position:absolute;top:calc(100% + 4px);right:0;min-width:140px;
  background:#101728;border:1px solid #283447;border-radius:5px;padding:4px;
  display:flex;flex-direction:column;z-index:60;
}
.rbv2 .rb-sprachklappe__liste a{
  padding:6px 8px;border-radius:5px;color:#C2C9D6;text-transform:none;letter-spacing:normal;
}
.rbv2 .rb-sprachklappe__liste a:hover{background:#080C15;color:#FFFFFF}
.rbv2 .rb-sprachklappe__liste a[aria-current="true"]{color:#2F80FF}
@media (max-width:980px){
  .rbv2 .rb-servicezeile{display:none}
}

/* 18.4 Hauptnavigation (Logo, Trennlinie, Menueliste, Bitblade-Beifuegung,
   mobile Sprachliste im Klapp-Drawer) */
.rbv2 .rb-nav{background:rgba(11,15,26,.92);border-bottom:1px solid #1F2738;position:relative}
.rbv2 .rb-nav__innen{
  max-width:1240px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.rbv2 .rb-nav__marke{font-weight:700;font-size:19px;color:#FFFFFF;letter-spacing:-.01em}
.rbv2 .rb-nav__marke span{color:#2F80FF}
.rbv2 .rb-nav__marke-gespann{display:flex;align-items:center;gap:14px;min-width:0}
.rbv2 .rb-nav__trenner{width:1px;align-self:stretch;min-height:26px;background:#283447;flex:none}
.rbv2 .rb-nav__bitblade{display:flex;align-items:center;gap:7px}
.rbv2 .rb-nav .rb-nav__bitblade-icon{width:17px;height:17px;max-width:none;flex:none}
.rbv2 .rb-nav__bitblade-text{
  font-family:var(--rbv2-schrift-mono);font-size:9px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;line-height:1.45;color:#6B7587;white-space:nowrap;
}
@media (max-width:1300px){
  .rbv2 .rb-nav__bitblade-text{display:none}
}
.rbv2 .rb-nav__liste{
  display:flex;flex-direction:row;align-items:center;gap:12px;
  list-style:none;margin:0;padding:0;
}
.rbv2 .rb-nav__liste a{font-size:12.5px;font-weight:600;letter-spacing:-.005em;color:#C2C9D6}
.rbv2 .rb-nav__liste a:hover{color:#FFFFFF}
.rbv2 .rb-nav__liste .nav-link{padding:.4rem .3rem}
.rbv2 .rb-nav__liste .nav-link > i{display:none}
.rbv2 .rb-nav__mobil-sprachen{display:none;padding:14px 0 6px;border-bottom:1px solid #1F2738}
.rbv2 .rb-nav__mobil-sprachen-label{
  display:block;font-family:var(--rbv2-schrift-mono);font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:#6B7587;margin-bottom:10px;
}
.rbv2 .rb-nav__mobil-sprachen-liste{display:flex;flex-wrap:wrap;gap:8px}
.rbv2 .rb-nav__mobil-sprachen-liste a{
  padding:6px 12px;border:1px solid #1F2738;border-radius:5px;color:#C2C9D6;font-size:13px;
}
.rbv2 .rb-nav__mobil-sprachen-liste a:hover{border-color:#283447;color:#FFFFFF}
.rbv2 .rb-nav__mobil-sprachen-liste a[aria-current="true"]{border-color:#2F80FF;color:#2F80FF}
@media (max-width:1080px){
  .rbv2 .rb-nav__mobil-sprachen{display:block}
}
/* Kopflogo misst 2901x484 (6:1) - ohne eigene Regel quetscht max-width:100%
   es schmal; hier Verhaeltnis gewahrt. */
.rbv2 .rb-nav img{height:40px;width:auto;max-width:none;object-fit:contain}

/* 18.5 Textfarben-Hilfsklassen (text-muted 3438x, text-primary 5289x,
   text-success/text-warning seltener - alle vier sitzen ueberall im
   Bestand, nicht nur auf den in Teil 1 umgestellten Seiten) */
.rbv2 .text-muted{color:#9AA4B2 !important}
.rbv2 .text-primary{color:#2F80FF !important}
.rbv2 .text-success{color:#6BA4FF !important}
.rbv2 .text-warning{color:#E7EAF0 !important;font-weight:600}

/* 18.6 Ueberschriften h1-h6 ohne eigene rbv2-h*-Klasse (z.B. Produktkarten,
   Kartentitel in noch nicht auf Teil 1 umgestellten Fragmenten) */
.rbv2 h1{font-weight:700;font-size:clamp(26px,3vw,40px);line-height:1.1;letter-spacing:-.02em;color:#FFFFFF}
.rbv2 h2{font-weight:700;font-size:clamp(22px,2.4vw,32px);line-height:1.15;letter-spacing:-.02em;color:#FFFFFF}
.rbv2 h3{font-weight:700;font-size:22px;line-height:1.2;letter-spacing:-.01em;color:#FFFFFF}
.rbv2 h4, .rbv2 .h4{font-weight:600;font-size:19px;line-height:1.3;letter-spacing:-.01em;color:#FFFFFF}
.rbv2 h5, .rbv2 .h5{font-weight:600;font-size:16px;line-height:1.35;letter-spacing:-.01em;color:#E7EAF0}
.rbv2 h6{font-weight:700;font-size:13.5px;line-height:1.4;letter-spacing:-.01em;color:#E7EAF0}
.rbv2 .text-robustbook-logo{font-family:inherit;font-weight:700;letter-spacing:-.01em;color:#FFFFFF}

/* 18.x .text-durabook-model (62 Fundstellen, Modellbeschriftungen mit dem
   Durabook-Schriftzug). style.css setzt dort color:rgb(0,73,157) und eine
   Schrift, die nicht ausgeliefert wird. Auf dem dunklen Grund misst dieses
   Blau 2,12:1 gegen #101728 - unter der Schwelle. Farbe und Schrift erben
   deshalb hier; das !important spiegelt nur das !important der Quelle. */
.rbv2 .text-durabook-model{font-family:inherit !important;color:inherit;-webkit-text-stroke-width:0}
.rbv2 .text-durabook-model:hover{color:inherit !important}

/* 18.7 Knoepfe btn/btn-primary/btn-secondary/btn-sm (Bootstrap-Klassen im
   Inhalt alter Seiten, getrennt vom eigenen rbv2-btn-Bauteil) */
.rbv2 .btn{
  font-family:var(--rbv2-schrift-mono);font-weight:700;font-size:12.5px;
  letter-spacing:.14em;text-transform:uppercase;border-radius:6px;padding:12px 22px;
  border:1px solid transparent;transition:background-color .15s ease,border-color .15s ease,color .15s ease;
}
.rbv2 .btn-sm{font-size:11px;letter-spacing:.12em;padding:8px 14px}
.rbv2 .btn-primary,
.rbv2 .btn-primary:hover,
.rbv2 .btn-primary:focus,
.rbv2 .btn-primary.focus,
.rbv2 .btn-primary:not([disabled]):not(.disabled).active,
.rbv2 .btn-primary:not([disabled]):not(.disabled):active{
  background-color:#2F80FF !important;border-color:#2F80FF !important;color:#FFFFFF !important;
}
.rbv2 .btn-primary:hover{background-color:#6BA4FF !important;border-color:#6BA4FF !important}
.rbv2 .btn-secondary,
.rbv2 .btn-secondary:focus,
.rbv2 .btn-secondary.focus,
.rbv2 .btn-secondary:not([disabled]):not(.disabled).active,
.rbv2 .btn-secondary:not([disabled]):not(.disabled):active{
  background-color:transparent !important;border-color:#283447 !important;color:#E7EAF0 !important;
}
.rbv2 .btn-secondary:hover{background-color:transparent !important;border-color:#2F80FF !important;color:#FFFFFF !important}
.rbv2 .btn.rb-knopf--haupt,
.rbv2 .btn-secondary.rb-knopf--haupt{
  background-color:#2F80FF !important;border-color:#2F80FF !important;color:#FFFFFF !important;
}
.rbv2 .btn.rb-knopf--haupt:hover,
.rbv2 .btn-secondary.rb-knopf--haupt:hover,
.rbv2 .btn-secondary.rb-knopf--haupt:focus{
  background-color:#6BA4FF !important;border-color:#6BA4FF !important;color:#FFFFFF !important;
}

/* 18.8 Karten card/card-body (649x im Bestand) */
.rbv2 .card{background:#101728;border:1px solid #1F2738;border-radius:10px;color:#C2C9D6}
.rbv2 .card-body{padding:22px}

/* 18.9 Tabellen table/table-sm/table-responsive (557x im Bestand,
   einschliesslich der Vergleichstabellen mit fixierter erster Spalte) */
.rbv2 .table-responsive{
  border:1px solid #1F2738;border-radius:10px;overflow-x:auto;overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}
.rbv2 .table{margin-bottom:0;color:#C2C9D6;background-color:#101728}
.rbv2 .table th,
.rbv2 .table td{border-color:#1F2738;padding:12px 14px;font-variant-numeric:tabular-nums}
.rbv2 .table thead th{
  font-family:var(--rbv2-schrift-mono);font-weight:700;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:#9AA4B2;border-bottom-color:#283447;
}
.rbv2 .table tbody tr:nth-of-type(odd){background-color:#080C15}
.rbv2 .table-sm th,
.rbv2 .table-sm td{padding:8px 10px;font-size:12.5px}
.rbv2 .table-responsive table tbody th:first-child,
.rbv2 .table-responsive table tbody td:first-child{background-color:#101728;color:#C2C9D6}

/* 18.10 Produktbilder img-fluid (352 Dateien im Bestand) - heller Fotogrund
   als gestaltete Kachel statt Kontrastbruch auf dunklem Grund. */
.rbv2 img.img-fluid{
  background:#E7EAF0;border:1px solid #D6DCE6;border-radius:10px !important;
  padding:14px;box-sizing:border-box;
}
.rbv2 .rb-nav img.img-fluid,
.rbv2 .rb-fuss img.img-fluid,
.rbv2 .rb-servicezeile img.img-fluid{
  background:none;border:none;border-radius:0;padding:0;box-sizing:content-box;
}

/* 18.11 Formulare — Bootstraps .form-control (Kontaktseite u.a.), plus
   Beschriftungen ausserhalb des Konfigurators (dort bereits ueber
   .rbv2-field-label/.rbv2-checkbox-row geloest, siehe Abschnitt 17). Ohne
   diese Regel fallen <label> global auf bitblade.css' helle Grundfarbe
   zurueck (auf /de/kontakt gemessen: Name/Firma/E-Mail/Telefon/Branche). */
.rbv2 label{color:#E7EAF0}
.rbv2 .form-control{
  background-color:#101728;border:1px solid #1F2738;border-radius:5px;padding:13px 15px;
  font-weight:400;font-size:14px;color:#E7EAF0;height:auto;
  transition:border-color .15s ease,box-shadow .15s ease;
}
.rbv2 .form-control:hover{border-color:#283447}
.rbv2 .form-control:focus{
  background-color:#101728;border-color:#2F80FF;color:#E7EAF0;outline:none;
  box-shadow:0 0 0 3px rgba(47,128,255,.25);
}
.rbv2 select.form-control{color:#E7EAF0}

/* 18.12 .intro-header (alte Absatzkorrektur, Ueberschrift sass sonst in der
   Kopfzeile) */
.rbv2 .intro-header{margin-top:0}

/* 18.13 Hinweiskaesten alert/alert-warning/alert-primary (349x "alert
   alert-warning" im Bestand, vor allem der Quellenvorbehalt auf den
   Datenblattseiten) */
.rbv2 .alert{border-radius:10px;border:1px solid #1F2738;background:#101728;color:#E7EAF0;padding:18px 20px}
.rbv2 .alert-warning{border-left:3px solid #2F80FF}
.rbv2 .alert-primary{border-left:3px solid #2F80FF}
.rbv2 .alert a{color:#2F80FF}
.rbv2 .alert code{background:#080C15;color:#C2C9D6;border-radius:4px;padding:1px 5px}

/* --------------------------------------------------------------------------
   19. Mobilgeraet — Nachtrag 23.08.2026, gemessen bei 375 px
   -------------------------------------------------------------------------- */

/* 19.1 Innenabstand der Bahn. .rbv2-container setzte den Schreibtischwert
   ohne Mobil-Ausnahme und steht in dieser Datei HINTER dem @media-Block von
   .rbv2-pad - bei gleicher Spezifitaet gewinnt die spaetere Regel. Auf einem
   375-px-Schirm gingen dadurch 80 px an den Rand, 21 Prozent der Breite.
   Gemessen am Kontaktformular: Eingabefelder 229 px statt 295 px.
   Dieselbe Ursache in der Fusszeile und der Servicezeile. */
@media (max-width:820px){
  .rbv2 .rbv2-container{
    padding-left:var(--rbv2-pad-mobil);padding-right:var(--rbv2-pad-mobil);
  }
  .rbv2 .rbv2-footer-bottom{
    padding-left:var(--rbv2-pad-mobil);padding-right:var(--rbv2-pad-mobil);
  }
}

/* 19.2 Karteninnenabstand. 30 bzw. 34/32 px sind am Schreibtisch richtig,
   auf 375 px fressen sie zusammen mit 19.1 die halbe Zeilenbreite. */
@media (max-width:520px){
  .rbv2 .rbv2-card--pad{padding:20px}
  .rbv2 .rbv2-card--pad-lg{padding:22px 20px}
}

/* 19.3 Trefferflaechen. Gemessen lagen Normmarken bei 38 px, Fusszeilen- und
   Sprachverweise bei 35 px - unter den 44 px, die eine Fingerkuppe braucht.
   Die Schriftgroessen bleiben unveraendert, nur die Flaeche waechst. */
@media (max-width:820px){
  .rbv2 .rbv2-filter-pill{
    display:inline-flex;align-items:center;min-height:44px;
    padding-top:12px;padding-bottom:12px;
  }
  .rbv2 .rbv2-footer-link{
    display:inline-flex;align-items:center;min-height:44px;
  }
  .rbv2 .rbv2-tile-link{min-height:52px}
  .rbv2 .rbv2-chip{display:inline-flex;align-items:center;min-height:34px}
}

/* 19.4 Eingabefelder. Unter 16 px zoomt iOS beim Antippen in die Seite und
   kehrt nicht von selbst zurueck. Gemessen standen die Felder auf 15,5 px. */
@media (max-width:820px){
  .rbv2 .rbv2-field-input,
  .rbv2 input[type="text"],
  .rbv2 input[type="email"],
  .rbv2 input[type="tel"],
  .rbv2 input[type="number"],
  .rbv2 input[type="search"],
  .rbv2 select,
  .rbv2 textarea{font-size:16px}
}

/* 19.5 Hero-Bild. Bei 375 px steht ihm ein 300-px-Platz zur Verfuegung; das
   Bild ist 1600 px breit. Ohne srcset laedt das Telefon die volle Fassung. */
@media (max-width:820px){
  .rbv2 .rbv2-hero-bild{filter:drop-shadow(0 20px 30px rgba(0,0,0,.55))}
}

/* 19.6 Nachtrag zu 19.3: die Sprachverweise im Klappmenue lagen bei 35 px,
   der rechtsbuendige Verweis der Sektionskopfzeile bei 18 px. */
@media (max-width:820px){
  .rbv2 .rb-nav__mobil-sprachen-liste a{
    display:inline-flex;align-items:center;min-height:44px;padding:6px 14px;
  }
  .rbv2 .rbv2-sektionskopf__push{
    display:inline-flex;align-items:center;min-height:44px;
  }
}
