/* Fehler bei der Verkleinerung. Der Inhalt wird unverkleinert zurückgegeben.
(11,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(13,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(14,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(15,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(16,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(17,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(18,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(19,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(20,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(22,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(23,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(24,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-text'
(28,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-white'
(36,32): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(44,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-white'
(61,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(79,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(80,33): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(81,23): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(83,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-shadow'
(111,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(123,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(160,65): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(161,47): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red-dark'
(163,44): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(176,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(177,23): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(178,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-100'
(188,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(190,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(198,59): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(198,87): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(212,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(218,46): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(221,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(222,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(223,23): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(224,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-50'
(228,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(233,87): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(244,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(245,23): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(250,75): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(250,103): run-time error CSS1039: Token not allowed after unary operator: '-mbs-shadow'
(260,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(261,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(262,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-50'
(266,45): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(268,101): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(272,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(277,51): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(286,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(287,23): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(292,81): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(292,109): run-time error CSS1039: Token not allowed after unary operator: '-mbs-shadow'
(302,33): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(304,83): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(309,53): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(310,53): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(314,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(317,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-100'
(329,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(330,15): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(335,66): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-100'
(335,109): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(335,155): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(337,64): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(337,108): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(337,139): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(338,50): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(339,50): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(341,78): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(341,114): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(344,67): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(345,47): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(347,41): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(350,67): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(352,43): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(352,79): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(353,45): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(354,97): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(356,125): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(358,67): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(367,31): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(368,23): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(370,20): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(406,17): run-time error CSS1039: Token not allowed after unary operator: '-mbs-text'
(409,29): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(412,17): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(417,33): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(420,40): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(420,83): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(420,116): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-100'
(444,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(448,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(466,81): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(466,125): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(466,156): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(467,98): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(469,121): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(491,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(500,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(506,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(507,37): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(543,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(544,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(551,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(606,35): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(616,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-100'
(617,37): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(630,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(638,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(654,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(663,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(664,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-shadow'
(681,35): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(682,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(684,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(705,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(719,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(727,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(742,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(743,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(752,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(753,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-shadow-hover'
(764,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-50'
(765,37): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(792,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(793,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(802,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(814,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(821,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(832,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(833,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(840,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-100'
(841,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(842,37): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(856,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(857,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(865,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(866,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-shadow'
(876,36): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(893,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(900,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(907,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(928,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(929,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(937,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(938,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-shadow-hover'
(961,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-200'
(962,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-50'
(966,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(975,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(982,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(988,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(1002,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(1003,35): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(1004,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(1005,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-50'
(1011,26): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(1012,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(1023,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(1033,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-100'
(1034,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(1035,37): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(1041,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(1042,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(1048,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(1061,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-gray-300'
(1062,34): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(1063,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(1075,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(1081,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(1087,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(1095,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(1101,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-muted'
(1110,27): run-time error CSS1039: Token not allowed after unary operator: '-mbs-radius'
(1116,19): run-time error CSS1039: Token not allowed after unary operator: '-mbs-black'
(1138,30): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(1141,24): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
(1216,40): run-time error CSS1039: Token not allowed after unary operator: '-mbs-red'
 */
/* ============================================================
   MODELLBAHNSHOP – LANDINGPAGE-BASIS-CSS
   Vereinheitlicht aus zwei Vorlagen:
     - Design-Vorlage (mbs-railways) -> Rueckgrat, verfeinert
     - Basis-Vorlage  (ga29)         -> zusaetzliche Komponenten portiert
   Scope: alles unter .mbs-page  |  Tokens: --mbs-*
   Reines CSS (keine Sass-Syntax, kein Bootstrap) – statisch ausliefern.
   ============================================================ */

.mbs-page {
  --mbs-red: #e30613;
  --mbs-red-dark: #b9000a;
  --mbs-black: #151515;
  --mbs-text: #2a2a2a;
  --mbs-muted: #666666;
  --mbs-gray-50: #fafafa;
  --mbs-gray-100: #f4f4f4;
  --mbs-gray-200: #e8e8e8;
  --mbs-gray-300: #d2d2d2;
  --mbs-white: #ffffff;
  --mbs-radius: 7px;
  --mbs-shadow-hover: 0 15px 34px rgba(0,0,0,.15);
  --mbs-shadow: 0 7px 22px rgba(0,0,0,.08);
  color: var(--mbs-text);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.62;
  background: var(--mbs-white);
  overflow-wrap: anywhere;
}
.mbs-page *,
.mbs-page *::before,
.mbs-page *::after { box-sizing: border-box; }
.mbs-page img { display: block; max-width: 100%; }
.mbs-page a { color: inherit; }
.mbs-page strong { color: var(--mbs-black); }
.mbs-shell {
  width: min(1200px, calc(100% - 32px));
  margin-inline: auto;
}
/* Shopnaher Kopfbereich */
.mbs-hero {
  padding: 16px 0 0;
  background: var(--mbs-white);
}
.mbs-hero__brandline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 0 0 18px;
}
.mbs-hero__logo {
  width: min(420px, 52vw);
  height: auto;
}
.mbs-hero__service {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--mbs-black);
  font-size: .92rem;
  font-weight: 700;
  text-align: right;
}
.mbs-hero__service::before {
  content: "";
  flex: 0 0 11px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #2aa745;
  box-shadow: 0 0 0 4px rgba(42,167,69,.13);
}
.mbs-hero__banner {
  position: relative;
  min-height: 430px;
  overflow: hidden;
  border: 1px solid var(--mbs-gray-300);
  border-bottom: 5px solid var(--mbs-red);
  border-radius: var(--mbs-radius);
  background: #222;
  box-shadow: var(--mbs-shadow);
}
.mbs-hero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.mbs-hero__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.72) 42%, rgba(0,0,0,.18) 78%, rgba(0,0,0,.08) 100%);
}
.mbs-hero__content {
  position: relative;
  z-index: 1;
  width: min(710px, 66%);
  padding: clamp(38px, 5.4vw, 68px);
  color: #fff;
}
.mbs-kicker,
.mbs-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--mbs-red);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.mbs-kicker { color: #fff; }
.mbs-kicker::before,
.mbs-eyebrow::before {
  content: "";
  width: 28px;
  height: 4px;
  background: var(--mbs-red);
}
.mbs-hero h1 {
  margin: 14px 0 18px;
  color: #fff;
  font-size: clamp(2.15rem, 4.4vw, 4.1rem);
  line-height: 1.04;
  letter-spacing: -.035em;
  text-shadow: 0 2px 12px rgba(0,0,0,.35);
}
.mbs-hero__lead {
  max-width: 680px;
  margin: 0;
  color: rgba(255,255,255,.94);
  font-size: clamp(1rem, 1.45vw, 1.18rem);
}
.mbs-hero__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 25px;
}
.mbs-button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 11px 19px;
  border: 2px solid transparent;
  border-radius: 4px;
  font-size: .95rem;
  font-weight: 800;
  line-height: 1.15;
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.mbs-button:hover { transform: translateY(-1px); }
.mbs-button--primary { color: #fff !important; background: var(--mbs-red); }
.mbs-button--primary:hover { background: var(--mbs-red-dark); }
.mbs-button--secondary { color: #fff !important; border-color: #fff; background: rgba(0,0,0,.2); }
.mbs-button--secondary:hover { color: var(--mbs-black) !important; background: #fff; }
/* Sprungnavigation */
.mbs-anchor-nav {
  position: relative;
  z-index: 2;
  padding: 14px 0 0;
  background: #fff;
}
.mbs-anchor-nav__inner {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 11px;
  border: 1px solid var(--mbs-gray-300);
  border-radius: var(--mbs-radius);
  background: var(--mbs-gray-100);
  scrollbar-width: thin;
  scroll-snap-type: x proximity;
}
.mbs-anchor-nav a {
  flex: 0 0 auto;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border: 1px solid var(--mbs-gray-300);
  border-radius: 4px;
  color: var(--mbs-black);
  background: #fff;
  font-size: .89rem;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  scroll-snap-align: start;
}
.mbs-anchor-nav a:hover { color: #fff; border-color: var(--mbs-red); background: var(--mbs-red); }
/* Inhalt */
.mbs-intro { padding: clamp(54px, 7vw, 88px) 0 30px; }
.mbs-intro__grid,
.mbs-guide__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(310px, .85fr);
  gap: clamp(28px, 5vw, 58px);
  align-items: start;
}
.mbs-intro h2,
.mbs-guide h2,
.mbs-faq h2 {
  margin: 10px 0 18px;
  color: var(--mbs-black);
  font-size: clamp(1.75rem, 3.3vw, 2.8rem);
  line-height: 1.14;
  letter-spacing: -.025em;
}
.mbs-intro p,
.mbs-guide p { margin: 0 0 15px; color: var(--mbs-muted); }
.mbs-info-box {
  padding: 22px;
  border: 1px solid var(--mbs-gray-300);
  border-top: 5px solid var(--mbs-red);
  border-radius: var(--mbs-radius);
  background: var(--mbs-gray-50);
}
.mbs-info-box h3 {
  margin: 0 0 13px;
  color: var(--mbs-black);
  font-size: 1.25rem;
}
.mbs-info-box ul { margin: 0; padding: 0; list-style: none; }
.mbs-info-box li { position: relative; padding-left: 22px; }
.mbs-info-box li::before { content: "\2713"; position: absolute; left: 0; color: var(--mbs-red); font-weight: 900; }
.mbs-info-box li + li { margin-top: 10px; }
/* Bilder im Stil einer Shop-Kachel */
.mbs-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px;
  padding: 30px 0 clamp(56px, 7vw, 84px);
}
.mbs-gallery-card {
  overflow: hidden;
  border: 1px solid var(--mbs-gray-300);
  border-radius: var(--mbs-radius);
  background: #fff;
  text-decoration: none;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mbs-gallery-card:hover { transform: translateY(-2px); border-color: var(--mbs-red); box-shadow: var(--mbs-shadow); }
.mbs-gallery-card__image { aspect-ratio: 4/3; padding: 12px; background: #fff; }
.mbs-gallery-card__image img { width: 100%; height: 100%; object-fit: contain; }
.mbs-gallery-card > span {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 13px;
  border-top: 1px solid var(--mbs-gray-200);
  color: var(--mbs-black);
  background: var(--mbs-gray-50);
  font-size: .9rem;
  font-weight: 800;
}
.mbs-gallery-card > span span { color: var(--mbs-red); font-size: 1.12rem; }
.mbs-groups { padding: 0 0 62px; }
.mbs-group { scroll-margin-top: 20px; padding: clamp(45px, 6vw, 72px) 0; border-top: 1px solid var(--mbs-gray-300); }
.mbs-section-heading { max-width: 850px; margin-bottom: 25px; }
.mbs-section-heading h3 {
  margin: 9px 0 12px;
  color: var(--mbs-black);
  font-size: clamp(1.55rem, 2.8vw, 2.25rem);
  line-height: 1.18;
  letter-spacing: -.02em;
}
.mbs-section-heading > p { margin: 0; color: var(--mbs-muted); }
/* Bahngesellschaften wie kompakte Produktkarten */
.mbs-company-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.mbs-company-card { min-width: 0; }
.mbs-company-card__link {
  display: flex;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--mbs-gray-300);
  border-radius: var(--mbs-radius);
  background: #fff;
  text-decoration: none;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mbs-company-card__link:hover { transform: translateY(-2px); border-color: var(--mbs-red); box-shadow: var(--mbs-shadow); }
.mbs-company-card__visual {
  display: flex;
  min-height: 96px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 16px;
  color: #fff;
  background: linear-gradient(135deg, #111, #333);
  border-bottom: 4px solid var(--mbs-red);
}
.mbs-company-card__visual--logo { background: #fff; border-bottom: 4px solid var(--mbs-red); }
.mbs-company-card__visual--logo img { width: 100%; height: 64px; object-fit: contain; }
.mbs-company-card__flag { font-size: 1.55rem; }
.mbs-company-card__short { font-size: clamp(1.45rem, 2.7vw, 2rem); font-weight: 900; letter-spacing: -.02em; }
.mbs-company-card__body { display: flex; flex: 1; flex-direction: column; padding: 18px; }
.mbs-company-card h4 { margin: 0 0 9px; color: var(--mbs-black); font-size: 1.12rem; line-height: 1.25; }
.mbs-company-card p { margin: 0 0 15px; color: var(--mbs-muted); font-size: .93rem; }
.mbs-company-card__meta {
  margin-top: auto;
  padding: 9px 10px;
  border: 1px solid var(--mbs-gray-200);
  border-radius: 3px;
  color: #555;
  background: var(--mbs-gray-100);
  font-size: .77rem;
  font-weight: 800;
}
.mbs-company-card__cta {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid var(--mbs-gray-200);
  color: var(--mbs-red);
  font-size: .87rem;
  font-weight: 800;
}
/* Ratgeber */
.mbs-guide { padding: clamp(56px, 7vw, 90px) 0; background: var(--mbs-gray-100); border-top: 1px solid var(--mbs-gray-300); border-bottom: 1px solid var(--mbs-gray-300); }
.mbs-checklist { display: grid; gap: 12px; }
.mbs-checklist article { padding: 18px; border: 1px solid var(--mbs-gray-300); border-left: 5px solid var(--mbs-red); border-radius: var(--mbs-radius); background: #fff; }
.mbs-checklist h4 { margin: 0 0 5px; color: var(--mbs-black); font-size: 1.02rem; }
.mbs-checklist h5 { margin: 0 0 5px; color: var(--mbs-red); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.mbs-checklist p { margin: 0; font-size: .92rem; }
.mbs-table-wrap { overflow-x: auto; margin-top: 26px; border: 1px solid var(--mbs-gray-300); border-radius: var(--mbs-radius); background: #fff; }
.mbs-table { width: 100%; min-width: 700px; border-collapse: collapse; }
.mbs-table th,
.mbs-table td { padding: 13px 14px; border-bottom: 1px solid var(--mbs-gray-200); text-align: left; vertical-align: top; }
.mbs-table th { color: #fff; background: var(--mbs-black); font-size: .9rem; }
.mbs-table tr:last-child td { border-bottom: 0; }
.mbs-table td:first-child { color: var(--mbs-black); font-weight: 800; }
/* FAQ */
.mbs-faq { padding: clamp(56px, 7vw, 90px) 0; }
.mbs-faq__intro { max-width: 820px; margin: -5px 0 0; color: var(--mbs-muted); }
.mbs-faq-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin-top: 25px; }
.mbs-faq details { border: 1px solid var(--mbs-gray-300); border-radius: var(--mbs-radius); background: #fff; }
.mbs-faq details[open] { border-color: var(--mbs-red); }
.mbs-faq summary { cursor: pointer; min-height: 56px; padding: 16px 46px 16px 17px; color: var(--mbs-black); font-weight: 800; list-style: none; position: relative; }
.mbs-faq summary::-webkit-details-marker { display: none; }
.mbs-faq summary::after { content: "+"; position: absolute; right: 17px; top: 50%; transform: translateY(-50%); color: var(--mbs-red); font-size: 1.45rem; font-weight: 400; }
.mbs-faq details[open] summary::after { content: "\2013"; }
.mbs-faq details p { margin: 0; padding: 0 17px 18px; color: var(--mbs-muted); }
/* Abschluss */
.mbs-final-cta { padding: 0 0 clamp(58px, 7vw, 90px); }
.mbs-final-cta__box {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 22px;
  align-items: center;
  padding: clamp(26px, 4vw, 40px);
  border-left: 7px solid var(--mbs-red);
  border-radius: var(--mbs-radius);
  color: #fff;
  background: var(--mbs-black);
}
.mbs-final-cta h3 { margin: 0 0 7px; color: #fff; font-size: clamp(1.45rem, 2.8vw, 2.15rem); line-height: 1.18; }
.mbs-final-cta p { margin: 0; color: rgba(255,255,255,.8); }
/* Tablet */
@media (max-width: 1020px) {
  .mbs-intro__grid,
  .mbs-guide__grid { grid-template-columns: 1fr; }
  .mbs-company-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .mbs-gallery { grid-template-columns: repeat(4, minmax(215px,1fr)); overflow-x: auto; padding-bottom: 24px; scroll-snap-type: x proximity; }
  .mbs-gallery-card { scroll-snap-align: start; }
}
/* Smartphones: echte Mobile-First-Darstellung ohne breite Überläufe */
@media (max-width: 720px) {
  .mbs-page { font-size: 15.5px; }
  .mbs-shell { width: min(100% - 22px, 1200px); }
  .mbs-hero { padding-top: 10px; }
  .mbs-hero__banner {
    display: flex;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
  }
  .mbs-hero__banner::after { display: none; }
  .mbs-hero__image {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 16/7;
    object-position: center;
  }
  .mbs-hero__content {
    width: 100%;
    padding: 24px 18px 21px;
    color: var(--mbs-text);
    background: #fff;
  }
  .mbs-kicker { color: var(--mbs-red); }
  .mbs-hero h1 {
    margin: 10px 0 13px;
    color: var(--mbs-black);
    font-size: clamp(1.85rem, 9.2vw, 2.7rem);
    line-height: 1.06;
    text-shadow: none;
  }
  .mbs-hero__lead { color: var(--mbs-muted); font-size: 1rem; }
  .mbs-hero__buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 19px; }
  .mbs-button { min-height: 48px; padding: 10px 11px; font-size: .88rem; }
  .mbs-button--secondary { color: var(--mbs-black) !important; border-color: var(--mbs-gray-300); background: var(--mbs-gray-100); }
  .mbs-anchor-nav { padding-top: 10px; }
  .mbs-anchor-nav__inner { margin-inline: -11px; padding-inline: 11px; border-right: 0; border-left: 0; border-radius: 0; }
  .mbs-anchor-nav a { min-height: 44px; padding-inline: 13px; }
  .mbs-intro { padding-top: 44px; }
  .mbs-info-box { padding: 18px; }
  .mbs-gallery {
    grid-template-columns: repeat(8, minmax(76vw, 1fr));
    gap: 10px;
    margin-right: -11px;
    padding: 22px 11px 50px 0;
  }
  .mbs-group { padding: 42px 0; }
  .mbs-company-grid { grid-template-columns: 1fr; gap: 11px; }
  .mbs-company-card__link {
    display: grid;
    grid-template-columns: 104px minmax(0,1fr);
    min-height: 0;
  }
  .mbs-company-card__visual {
    min-height: 100%;
    align-self: stretch;
    flex-direction: column;
    padding: 10px;
    border-right: 4px solid var(--mbs-red);
    border-bottom: 0;
  }
  .mbs-company-card__visual--logo {
    border-right: 4px solid var(--mbs-red);
    border-bottom: 0;
  }
  .mbs-company-card__visual--logo img { height: 72px; }
  .mbs-company-card__short { font-size: 1.35rem; text-align: center; }
  .mbs-company-card__flag { font-size: 1.35rem; }
  .mbs-company-card__body { padding: 14px; }
  .mbs-company-card h4 { margin-bottom: 6px; font-size: 1.03rem; }
  .mbs-company-card p { margin-bottom: 11px; font-size: .88rem; line-height: 1.48; }
  .mbs-company-card__meta { padding: 7px 8px; font-size: .72rem; }
  .mbs-company-card__cta { min-height: 38px; margin-top: 8px; padding-top: 8px; font-size: .8rem; }
  .mbs-table-wrap { overflow: visible; border: 0; background: transparent; }
  .mbs-table { min-width: 0; }
  .mbs-table,
  .mbs-table tbody,
  .mbs-table tr,
  .mbs-table td { display: block; width: 100%; }
  .mbs-table thead { display: none; }
  .mbs-table tr { margin-bottom: 11px; overflow: hidden; border: 1px solid var(--mbs-gray-300); border-left: 5px solid var(--mbs-red); border-radius: var(--mbs-radius); background: #fff; }
  .mbs-table td { position: relative; padding: 10px 12px 10px 43%; border-bottom: 1px solid var(--mbs-gray-200); min-height: 43px; }
  .mbs-table td:last-child { border-bottom: 0; }
  .mbs-table td::before { content: attr(data-label); position: absolute; left: 12px; top: 10px; width: 37%; color: var(--mbs-black); font-size: .79rem; font-weight: 800; }
  .mbs-faq-grid { grid-template-columns: 1fr; }
  .mbs-final-cta__box { grid-template-columns: 1fr; }
  .mbs-final-cta .mbs-button { width: 100%; }
}
@media (max-width: 420px) {
  .mbs-hero__buttons { grid-template-columns: 1fr; }
  .mbs-company-card__link { grid-template-columns: 90px minmax(0,1fr); }
  .mbs-company-card__visual { padding: 8px; }
  .mbs-company-card__body { padding: 12px; }
  .mbs-company-card p { font-size: .84rem; }
}
@media (prefers-reduced-motion: reduce) {
  .mbs-page *, .mbs-page *::before, .mbs-page *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* ============================================================
   ZUSAETZLICHE KOMPONENTEN (portiert aus ga29, standardisiert)
   ============================================================ */

.mbs-section-title {
      margin: 10px 0 17px;
      color: var(--mbs-black);
      font-size: clamp(1.8rem, 3.5vw, 3rem);
      line-height: 1.12;
      letter-spacing: -.03em;
    }

.mbs-section-lead {
      max-width: 850px;
      margin: 0;
      color: var(--mbs-muted);
      font-size: 1.04rem;
    }

.mbs-related {
      color: #fff;
      background: var(--mbs-black);
      border-bottom: 4px solid var(--mbs-red);
    }

.mbs-related__inner {
      display: flex;
      align-items: center;
      gap: 8px;
      min-height: 48px;
      overflow-x: auto;
      scrollbar-width: thin;
    }

.mbs-related__label {
      flex: 0 0 auto;
      margin-right: 8px;
      color: rgba(255,255,255,.65);
      font-size: .75rem;
      font-weight: 900;
      letter-spacing: .08em;
      text-transform: uppercase;
    }

.mbs-related a {
      flex: 0 0 auto;
      padding: 7px 11px;
      border: 1px solid rgba(255,255,255,.22);
      border-radius: 4px;
      color: #fff;
      font-size: .82rem;
      font-weight: 800;
      text-decoration: none;
      white-space: nowrap;
    }

.mbs-related a:hover,
    .mbs-related a:focus-visible {
      border-color: var(--mbs-red);
      background: var(--mbs-red);
      outline: none;
    }

.mbs-dashboard {
      padding: 23px;
      border: 1px solid rgba(255,255,255,.22);
      border-radius: var(--mbs-radius);
      background: rgba(0,0,0,.5);
      box-shadow: 0 16px 50px rgba(0,0,0,.25);
      backdrop-filter: blur(6px);
    }

.mbs-dashboard__title {
      margin: 0 0 16px;
      color: #fff;
      font-size: 1.05rem;
      font-weight: 900;
    }

.mbs-stats {
      display: grid;
      grid-template-columns: repeat(3, minmax(0,1fr));
      gap: 8px;
    }

.mbs-stat {
      padding: 14px 8px;
      border: 1px solid rgba(255,255,255,.15);
      border-radius: 6px;
      text-align: center;
      background: rgba(255,255,255,.07);
    }

.mbs-stat strong {
      display: block;
      color: #fff;
      font-size: 1.65rem;
      line-height: 1;
    }

.mbs-stat span {
      display: block;
      margin-top: 6px;
      color: rgba(255,255,255,.7);
      font-size: .69rem;
      font-weight: 800;
      text-transform: uppercase;
    }

.mbs-dashboard__route {
      display: grid;
      gap: 8px;
      margin-top: 15px;
    }

.mbs-dashboard__route a {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 9px 11px;
      border-left: 4px solid var(--mbs-red);
      color: #fff;
      background: rgba(255,255,255,.08);
      font-size: .83rem;
      font-weight: 800;
      text-decoration: none;
    }

.mbs-brands {
      padding: 38px 0;
      background: var(--mbs-gray-100);
      border-bottom: 1px solid var(--mbs-gray-300);
    }

.mbs-brands__heading {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 19px;
    }

.mbs-brands__heading h2 {
      margin: 6px 0 0;
      color: var(--mbs-black);
      font-size: clamp(1.45rem, 2.6vw, 2.15rem);
      line-height: 1.15;
    }

.mbs-brands__heading p {
      max-width: 560px;
      margin: 0;
      color: var(--mbs-muted);
      font-size: .92rem;
    }

.mbs-logo-grid {
      display: grid;
      grid-template-columns: repeat(10, minmax(82px,1fr));
      gap: 9px;
    }

.mbs-logo-link {
      display: flex;
      min-height: 82px;
      align-items: center;
      justify-content: center;
      padding: 12px;
      border: 1px solid var(--mbs-gray-300);
      border-radius: 6px;
      background: #fff;
      text-decoration: none;
      transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
    }

.mbs-logo-link:hover {
      transform: translateY(-2px);
      border-color: var(--mbs-red);
      box-shadow: var(--mbs-shadow);
    }

.mbs-logo-link img {
      width: 100%;
      height: 48px;
      object-fit: contain;
    }

.mbs-spotlight {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 24px;
      align-items: center;
      margin-top: 34px;
      padding: clamp(23px, 4vw, 35px);
      border: 1px solid #050505;
      border-left: 8px solid var(--mbs-red);
      border-radius: var(--mbs-radius);
      color: #fff;
      background: var(--mbs-black);
    }

.mbs-spotlight h3 {
      margin: 0 0 7px;
      color: #fff;
      font-size: clamp(1.25rem, 2.6vw, 1.9rem);
    }

.mbs-spotlight p {
      margin: 0;
      color: rgba(255,255,255,.76);
    }

.mbs-systems {
      padding: 0 0 clamp(62px, 8vw, 100px);
    }

.mbs-system-group {
      scroll-margin-top: 82px;
      padding: clamp(47px, 6vw, 72px) 0 0;
      border-top: 1px solid var(--mbs-gray-300);
    }

.mbs-system-group:first-child {
      border-top: 0;
    }

.mbs-group-heading {
      max-width: 900px;
      margin-bottom: 24px;
    }

.mbs-group-heading h3 {
      margin: 9px 0 10px;
      color: var(--mbs-black);
      font-size: clamp(1.5rem, 3vw, 2.3rem);
      line-height: 1.17;
      letter-spacing: -.02em;
    }

.mbs-group-heading p {
      margin: 0;
      color: var(--mbs-muted);
    }

.mbs-card-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0,1fr));
      gap: 15px;
    }

.mbs-system-card {
      display: flex;
      min-width: 0;
      height: 100%;
      flex-direction: column;
      overflow: hidden;
      border: 1px solid var(--mbs-gray-300);
      border-radius: var(--mbs-radius);
      background: #fff;
      text-decoration: none;
      transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    }

.mbs-system-card:hover,
    .mbs-system-card:focus-visible {
      transform: translateY(-3px);
      border-color: var(--mbs-red);
      box-shadow: var(--mbs-shadow-hover);
      outline: none;
    }

.mbs-system-card__top {
      display: flex;
      min-height: 92px;
      align-items: center;
      justify-content: space-between;
      gap: 15px;
      padding: 14px 16px;
      background: var(--mbs-gray-50);
      border-bottom: 4px solid var(--mbs-red);
    }

.mbs-system-card__logo {
      display: flex;
      width: 118px;
      height: 54px;
      align-items: center;
      justify-content: center;
    }

.mbs-system-card__logo img {
      width: 100%;
      height: 52px;
      object-fit: contain;
    }

.mbs-tags {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 5px;
    }

.mbs-tag {
      padding: 5px 7px;
      border-radius: 3px;
      color: var(--mbs-black);
      background: var(--mbs-gray-200);
      font-size: .67rem;
      font-weight: 900;
      line-height: 1.1;
      text-transform: uppercase;
    }

.mbs-tag--red {
      color: #fff;
      background: var(--mbs-red);
    }

.mbs-system-card__body {
      display: flex;
      flex: 1;
      flex-direction: column;
      padding: 18px;
    }

.mbs-system-card h4 {
      margin: 0 0 9px;
      color: var(--mbs-black);
      font-size: 1.13rem;
      line-height: 1.25;
    }

.mbs-system-card p {
      margin: 0 0 15px;
      color: var(--mbs-muted);
      font-size: .91rem;
    }

.mbs-card-cta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-top: auto;
      padding-top: 12px;
      border-top: 1px solid var(--mbs-gray-200);
      color: var(--mbs-red);
      font-size: .84rem;
      font-weight: 900;
    }

.mbs-sets {
      padding: clamp(60px, 8vw, 100px) 0;
      background: var(--mbs-gray-100);
      border-top: 1px solid var(--mbs-gray-300);
      border-bottom: 1px solid var(--mbs-gray-300);
    }

.mbs-set-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0,1fr));
      gap: 12px;
      margin-top: 28px;
    }

.mbs-set-card {
      display: grid;
      grid-template-columns: 116px minmax(0,1fr);
      overflow: hidden;
      border: 1px solid var(--mbs-gray-300);
      border-radius: var(--mbs-radius);
      background: #fff;
      text-decoration: none;
      transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    }

.mbs-set-card:hover {
      transform: translateY(-2px);
      border-color: var(--mbs-red);
      box-shadow: var(--mbs-shadow);
    }

.mbs-set-card__logo {
      display: flex;
      min-height: 128px;
      align-items: center;
      justify-content: center;
      padding: 15px;
      background: #fff;
      border-right: 4px solid var(--mbs-red);
    }

.mbs-set-card__logo img {
      width: 100%;
      height: 60px;
      object-fit: contain;
    }

.mbs-set-card__body {
      display: flex;
      flex-direction: column;
      padding: 17px;
    }

.mbs-set-card h4 {
      margin: 0 0 6px;
      color: var(--mbs-black);
      font-size: 1.03rem;
      line-height: 1.25;
    }

.mbs-set-card p {
      margin: 0;
      color: var(--mbs-muted);
      font-size: .88rem;
    }

.mbs-set-card span {
      margin-top: auto;
      padding-top: 9px;
      color: var(--mbs-red);
      font-size: .8rem;
      font-weight: 900;
    }

.mbs-goods {
      padding: clamp(62px, 8vw, 100px) 0;
    }

.mbs-product-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0,1fr));
      gap: 14px;
      margin-top: 27px;
    }

.mbs-product-card {
      display: flex;
      min-width: 0;
      flex-direction: column;
      overflow: hidden;
      border: 1px solid var(--mbs-gray-300);
      border-radius: var(--mbs-radius);
      background: #fff;
      text-decoration: none;
      transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
    }

.mbs-product-card:hover {
      transform: translateY(-3px);
      border-color: var(--mbs-red);
      box-shadow: var(--mbs-shadow-hover);
    }

.mbs-product-card__image {
      display: flex;
      aspect-ratio: 1/1;
      align-items: center;
      justify-content: center;
      padding: 18px;
      background: #fff;
    }

.mbs-product-card__image img {
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

.mbs-product-card__body {
      display: flex;
      flex: 1;
      flex-direction: column;
      padding: 16px;
      border-top: 1px solid var(--mbs-gray-200);
      background: var(--mbs-gray-50);
    }

.mbs-product-card__brand {
      color: var(--mbs-red);
      font-size: .69rem;
      font-weight: 900;
      letter-spacing: .08em;
      text-transform: uppercase;
    }

.mbs-product-card h4 {
      margin: 6px 0 8px;
      color: var(--mbs-black);
      font-size: 1rem;
      line-height: 1.28;
    }

.mbs-product-card p {
      margin: 0 0 12px;
      color: var(--mbs-muted);
      font-size: .86rem;
    }

.mbs-product-card__cta {
      margin-top: auto;
      color: var(--mbs-red);
      font-size: .8rem;
      font-weight: 900;
    }

.mbs-goods-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0,1fr));
      gap: 12px;
      margin-top: 30px;
    }

.mbs-goods-card {
      padding: 19px;
      border: 1px solid var(--mbs-gray-300);
      border-left: 5px solid var(--mbs-red);
      border-radius: var(--mbs-radius);
      background: var(--mbs-gray-50);
      text-decoration: none;
    }

.mbs-goods-card:hover {
      color: #fff;
      border-color: var(--mbs-black);
      background: var(--mbs-black);
    }

.mbs-goods-card h4 {
      margin: 0 0 7px;
      color: inherit;
      font-size: 1.02rem;
    }

.mbs-goods-card p {
      margin: 0;
      color: var(--mbs-muted);
      font-size: .84rem;
    }

.mbs-goods-card:hover p {
      color: rgba(255,255,255,.75);
    }

.mbs-gauges {
      padding: clamp(62px, 8vw, 100px) 0;
      background: var(--mbs-gray-100);
      border-top: 1px solid var(--mbs-gray-300);
      border-bottom: 1px solid var(--mbs-gray-300);
    }

.mbs-table-wrap {
      overflow-x: auto;
      margin-top: 28px;
      border: 1px solid var(--mbs-gray-300);
      border-radius: var(--mbs-radius);
      background: #fff;
    }

.mbs-table-note {
      margin: 16px 0 0;
      color: var(--mbs-muted);
      font-size: .88rem;
    }

.mbs-guide-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0,1fr));
      gap: 13px;
      margin-top: 29px;
    }

.mbs-guide-card {
      padding: 22px;
      border: 1px solid var(--mbs-gray-300);
      border-top: 5px solid var(--mbs-red);
      border-radius: var(--mbs-radius);
      background: #fff;
    }

.mbs-guide-card__number {
      display: inline-flex;
      min-width: 34px;
      height: 34px;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      color: #fff;
      background: var(--mbs-red);
      font-weight: 900;
    }

.mbs-guide-card h4 {
      margin: 13px 0 6px;
      color: var(--mbs-black);
      font-size: 1.18rem;
    }

.mbs-guide-card h5 {
      margin: 12px 0 4px;
      color: var(--mbs-red);
      font-size: .78rem;
      letter-spacing: .07em;
      text-transform: uppercase;
    }

.mbs-guide-card h6 {
      margin: 0 0 8px;
      color: var(--mbs-black);
      font-size: .9rem;
    }

.mbs-guide-card p {
      margin: 0;
      color: var(--mbs-muted);
      font-size: .92rem;
    }

.mbs-warning {
      margin-top: 27px;
      padding: 23px;
      border: 1px solid #e4c76b;
      border-left: 7px solid #e0ae00;
      border-radius: var(--mbs-radius);
      background: #fff9de;
    }

.mbs-warning h3 {
      margin: 0 0 8px;
      color: var(--mbs-black);
      font-size: 1.2rem;
    }

.mbs-warning p {
      margin: 0;
      color: #5f5530;
    }

.mbs-faq-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0,1fr));
      gap: 12px;
      margin-top: 28px;
    }

.mbs-ratgeber-link {
      display: inline-flex;
      min-height: 52px;
      align-items: center;
      justify-content: center;
      padding: 12px 21px;
      border: 2px solid var(--mbs-red);
      border-radius: 5px;
      color: #fff !important;
      background: var(--mbs-red);
      font-weight: 900;
      text-align: center;
      text-decoration: none;
    }

.mbs-ratgeber-link:hover {
      border-color: #fff;
      background: transparent;
    }

/* --- Responsive fuer portierte Komponenten --- */

@media (max-width: 1050px) {
  .mbs-dashboard {
          max-width: 680px;
        }
  .mbs-logo-grid {
          grid-template-columns: repeat(5, minmax(90px,1fr));
        }
  .mbs-card-grid {
          grid-template-columns: repeat(2, minmax(0,1fr));
        }
  .mbs-product-grid,
        .mbs-goods-grid {
          grid-template-columns: repeat(2, minmax(0,1fr));
        }
}

@media (max-width: 720px) {
  .mbs-related__inner {
          padding-block: 7px;
        }
  .mbs-related__label {
          display: none;
        }
  .mbs-stats {
          grid-template-columns: repeat(3,1fr);
        }
  .mbs-brands__heading {
          display: block;
        }
  .mbs-brands__heading p {
          margin-top: 10px;
        }
  .mbs-logo-grid {
          grid-template-columns: repeat(5, minmax(0,1fr));
          gap: 6px;
        }
  .mbs-logo-link {
          min-height: 66px;
          padding: 8px;
        }
  .mbs-logo-link img {
          height: 36px;
        }
  .mbs-spotlight,
        .mbs-final__box {
          grid-template-columns: 1fr;
        }
  .mbs-card-grid,
        .mbs-set-grid,
        .mbs-guide-grid,
        .mbs-faq-grid {
          grid-template-columns: 1fr;
        }
  .mbs-system-card {
          display: grid;
          grid-template-columns: 104px minmax(0,1fr);
        }
  .mbs-system-card__top {
          min-height: 100%;
          flex-direction: column;
          justify-content: center;
          padding: 11px;
          border-right: 4px solid var(--mbs-red);
          border-bottom: 0;
        }
  .mbs-system-card__logo {
          width: 82px;
        }
  .mbs-system-card__logo img {
          height: 45px;
        }
  .mbs-tags {
          justify-content: center;
        }
  .mbs-system-card__body {
          padding: 14px;
        }
  .mbs-system-card h4 {
          font-size: 1.02rem;
        }
  .mbs-system-card p {
          font-size: .86rem;
        }
  .mbs-set-card {
          grid-template-columns: 92px minmax(0,1fr);
        }
  .mbs-set-card__logo {
          padding: 10px;
        }
  .mbs-product-grid {
          display: flex;
          gap: 10px;
          overflow-x: auto;
          margin-right: -11px;
          padding-right: 11px;
          scroll-snap-type: x proximity;
        }
  .mbs-product-card {
          flex: 0 0 78vw;
          scroll-snap-align: start;
        }
  .mbs-goods-grid {
          grid-template-columns: 1fr;
        }
  .mbs-table-wrap {
          overflow: visible;
          border: 0;
          background: transparent;
        }
  .mbs-ratgeber-link {
          width: 100%;
        }
}

@media (max-width: 430px) {
  .mbs-stats {
          grid-template-columns: 1fr;
        }
  .mbs-stat {
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 9px;
        }
  .mbs-stat span {
          margin-top: 0;
        }
  .mbs-logo-grid {
          grid-template-columns: repeat(2, minmax(0,1fr));
        }
  .mbs-system-card {
          grid-template-columns: 88px minmax(0,1fr);
        }
  .mbs-system-card__logo {
          width: 68px;
        }
  .mbs-tag {
          font-size: .58rem;
        }
}