@bytebrand/fe-ui-core-autobahn 1.0.42 → 1.0.43

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core-autobahn",
-  "version": "1.0.42",
+  "version": "1.0.43",
   "description": "auto.de md3 (Autobahn) design system — UI primitives, cards, chrome, VDP modules, theme CSS and locales. Ships raw TypeScript source (like fe-ui-core before it); each consumer's bundler compiles it.",
   "main": "index.ts",
   "license": "UNLICENSED",

package/theme/md3.css

@@ -1630,8 +1630,9 @@
   .md3 .bb-cta-row .mbtn--outlined:not(.bb-adjust) { box-shadow: inset 0 0 0 1.5px var(--md-primary); }
   /* mobile page is WHITE like the Figma master — beats the .vdp-tint inline gray */
   .md3 .vdp-tint { background: var(--md-sc-lowest) !important; }
-  /* mockup hero rate is a notch bigger on phone (inline style says 48 — hence !important) */
-  .md3 .fin-rate-main .num { font-size: 52px !important; letter-spacing: -1.5px !important; }
+  /* phone hero rate: 44px — with the € folded into the big span (round 11) 52px pushed the
+     stacked /mtl. unit onto a second line; 44px fits "143 €" + stack beside the rating column */
+  .md3 .fin-rate-main .num { font-size: 44px !important; letter-spacing: -1.2px !important; }
   /* the struck old figure must NOT inherit the 52px hero size */
   .md3 .fin-rate-main .fin-rate-old { font-size: 15px !important; letter-spacing: 0 !important; }
   /* narrower rating column (figma bar is 115px) frees room for the bigger rate; let the

package/vdp/FinanceCalculator.tsx

@@ -341,9 +341,12 @@ const FinanceCalculator: React.FunctionComponent<FinanceCalculatorProps> = ({
               className="num"
               style={{ fontSize: 48, fontWeight: 800, color: 'var(--md-primary)', letterSpacing: '-2px' }}
             >
-              {isCash ? eur(price) : eur(Math.round(monthly))} €
+              {/* cash keeps the long price number-only (a big "13.249 €" overflows the grid cell) */}
+              {isCash ? eur(price) : `${eur(Math.round(monthly))} €`}
             </span>
-            {!isCash && (
+            {isCash ? (
+              <span className="md-body-sm" style={{ fontWeight: 600 }}>€</span>
+            ) : (
               <span className="fin-rate-unit">
                 {/* struck old rate (REAL oldMonthlyInstallment; SRP strikes the same source) */}
                 {oldMonthly != null && <s className="num fin-rate-old">{eur(Math.round(oldMonthly))} €</s>}