diff --git a/src/components/supply/PropertyIntelligenceCard.tsx b/src/components/supply/PropertyIntelligenceCard.tsx
index efcf738..8f3c79e 100644
--- a/src/components/supply/PropertyIntelligenceCard.tsx
+++ b/src/components/supply/PropertyIntelligenceCard.tsx
@@ -1,6 +1,7 @@
 import { memo } from 'react'
-import { Box, Chip, Tooltip, Typography } from '@mui/material'
-import { getAssetTypeColor, getAssetTypeLabel } from './propertyHelpers'
+import { Box, Chip, LinearProgress, Tooltip, Typography } from '@mui/material'
+import { MapPin } from 'lucide-react'
+import { getAssetTypeColor, getAssetTypeLabel, getAvailabilityLabel } from './propertyHelpers'
 import { DS_TEXT, DS_BORDER } from '../../lib/ds'
 import type { Property } from '../../domain/property'
 
@@ -9,24 +10,25 @@ interface Props {
   onSelect: (id: string) => void
 }
 
-const FIT_OUT_LABELS: Record<string, string> = {
-  SHELL: 'Rohbau', BASIC: 'Grundausbau', FULL: 'Vollausbau', PREMIUM: 'Premium-Ausbau',
+const AVAIL_STYLE: Record<string, { bg: string; text: string }> = {
+  AVAILABLE_NOW:  { bg: '#dcfce7', text: '#1d6342' },
+  AVAILABLE_SOON: { bg: '#fef9c3', text: '#a16207' },
+}
+
+const FIT_OUT_META: Record<string, { label: string; tip: string }> = {
+  SHELL:   { label: 'Rohbau',         tip: 'Keine Einbauten — volle Ausbauinvestition.' },
+  BASIC:   { label: 'Grundausbau',    tip: 'Grundinfrastruktur vorhanden.' },
+  FULL:    { label: 'Vollausbau',     tip: 'Bezugsfertig ausgebaut.' },
+  PREMIUM: { label: 'Premium-Ausbau', tip: 'Hochwertig, sofort bezugsfertig.' },
 }
 
 export const PropertyIntelligenceCard = memo(function PropertyIntelligenceCard({ property: p, onSelect }: Props) {
+  const confPct = Math.round(p.confidenceScore * 100)
   const annualRent = Math.round(p.areaSqm * p.rentPricePerSqm / 1000)
+  const availStyle = AVAIL_STYLE[p.availabilityStatus] ?? { bg: '#f4f3f0', text: '#9a9a9a' }
   const assetColor = getAssetTypeColor(p.assetType)
   const hasImage = !!p.images?.[0]
 
-  // single compact facts line below price
-  const facts: string[] = []
-  facts.push(`${p.areaSqm.toLocaleString('de-CH')} m²`)
-  if (p.availabilityDate) {
-    facts.push(`ab ${new Date(p.availabilityDate).toLocaleDateString('de-CH', { month: 'short', year: '2-digit' })}`)
-  }
-  if (p.hardFacts?.fitOut) facts.push(FIT_OUT_LABELS[p.hardFacts.fitOut] ?? p.hardFacts.fitOut)
-  if (p.contractDurationMonths) facts.push(`${p.contractDurationMonths}M Vertrag`)
-
   return (
     <Box
       onClick={() => onSelect(p.id)}
@@ -43,14 +45,10 @@ export const PropertyIntelligenceCard = memo(function PropertyIntelligenceCard({
       }}
     >
       {/* ── Image ── */}
-      <Box sx={{ position: 'relative', height: 180, flexShrink: 0, bgcolor: '#f4f3f0', overflow: 'hidden' }}>
+      <Box sx={{ position: 'relative', height: 160, flexShrink: 0, bgcolor: '#f4f3f0', overflow: 'hidden' }}>
         {hasImage ? (
-          <Box
-            component="img"
-            src={p.images![0]}
-            alt={p.title}
-            sx={{ width: '100%', height: '100%', objectFit: 'cover', display: 'block' }}
-          />
+          <Box component="img" src={p.images![0]} alt={p.title}
+            sx={{ width: '100%', height: '100%', objectFit: 'cover', display: 'block' }} />
         ) : (
           <Box sx={{
             width: '100%', height: '100%',
@@ -61,51 +59,120 @@ export const PropertyIntelligenceCard = memo(function PropertyIntelligenceCard({
           </Box>
         )}
 
-        {/* Single small neutral asset-type tag */}
-        <Tooltip title={getAssetTypeLabel(p.assetType)} placement="right">
-          <Box sx={{
-            position: 'absolute', top: 10, left: 10,
-            bgcolor: 'rgba(0,0,0,0.52)', borderRadius: '4px',
-            px: 0.75, py: 0.2,
-          }}>
+        {/* Dark overlay for legibility */}
+        <Box sx={{ position: 'absolute', inset: 0, background: 'linear-gradient(to top, rgba(0,0,0,0.5) 0%, transparent 50%)' }} />
+
+        {/* Top badges — asset type + availability */}
+        <Box sx={{ position: 'absolute', top: 10, left: 10, display: 'flex', gap: 0.5 }}>
+          <Box sx={{ bgcolor: 'rgba(0,0,0,0.55)', borderRadius: '5px', px: 0.75, py: 0.25 }}>
             <Typography sx={{ fontSize: '0.65rem', fontWeight: 600, color: 'white', lineHeight: 1.3 }}>
               {getAssetTypeLabel(p.assetType)}
             </Typography>
           </Box>
-        </Tooltip>
-      </Box>
-
-      {/* ── Content ── */}
-      <Box sx={{ px: 1.75, pt: 1.5, pb: 1.75, display: 'flex', flexDirection: 'column', flex: 1 }}>
-
-        {/* Location */}
-        <Typography sx={{ fontSize: '0.72rem', color: DS_TEXT.muted, mb: 0.25 }}>
-          {p.location.city}{p.location.district ? ` · ${p.location.district}` : ''}
-        </Typography>
-
-        {/* Title */}
-        <Typography sx={{ fontWeight: 600, fontSize: '0.9375rem', color: DS_TEXT.primary, lineHeight: 1.3, mb: 0.75 }} noWrap>
-          {p.title}
-        </Typography>
-
-        {/* Price — hero element */}
-        <Box sx={{ mb: 0.875 }}>
-          <Typography sx={{
-            fontFamily: '"DM Serif Display", serif',
-            fontWeight: 400, fontSize: '1.5rem',
-            color: DS_TEXT.primary, lineHeight: 1.1,
-          }}>
-            CHF {annualRent}k
-          </Typography>
-          <Typography sx={{ fontSize: '0.72rem', color: DS_TEXT.muted, mt: 0.125 }}>
-            {p.rentPricePerSqm} CHF/m²/Jahr
-          </Typography>
+          <Box sx={{ bgcolor: availStyle.bg, borderRadius: '5px', px: 0.75, py: 0.25 }}>
+            <Typography sx={{ fontSize: '0.65rem', fontWeight: 600, color: availStyle.text, lineHeight: 1.3 }}>
+              {getAvailabilityLabel(p.availabilityStatus)}
+            </Typography>
+          </Box>
         </Box>
 
-        {/* Key facts — single compact line */}
-        <Typography sx={{ fontSize: '0.8rem', color: DS_TEXT.secondary, lineHeight: 1.4 }}>
-          {facts.join(' · ')}
-        </Typography>
+        {/* Bottom — CHF hero + per-sqm */}
+        <Box sx={{ position: 'absolute', bottom: 10, left: 12, right: 12, display: 'flex', justifyContent: 'space-between', alignItems: 'flex-end' }}>
+          <Box>
+            <Typography sx={{ color: 'rgba(255,255,255,0.75)', fontSize: '0.62rem', lineHeight: 1 }}>
+              Jahresmiete ca.
+            </Typography>
+            <Typography sx={{
+              fontFamily: '"DM Serif Display", serif',
+              fontWeight: 400, fontSize: '1.375rem',
+              color: 'white', lineHeight: 1.15,
+            }}>
+              CHF {annualRent}k
+            </Typography>
+          </Box>
+          <Typography sx={{ color: 'rgba(255,255,255,0.8)', fontSize: '0.72rem', fontWeight: 500 }}>
+            {p.rentPricePerSqm} /m²/J
+          </Typography>
+        </Box>
+      </Box>
+
+      {/* ── Body ── */}
+      <Box sx={{ p: 1.75, display: 'flex', flexDirection: 'column', gap: 1.25, flex: 1 }}>
+
+        {/* Title + location */}
+        <Box>
+          <Typography sx={{ fontWeight: 600, fontSize: '0.9375rem', color: DS_TEXT.primary, lineHeight: 1.3 }} noWrap>
+            {p.title}
+          </Typography>
+          <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.4, mt: 0.3 }}>
+            <MapPin size={11} color="#9a9a9a" />
+            <Typography sx={{ fontSize: '0.75rem', color: DS_TEXT.muted }}>
+              {p.location.city}{p.location.district ? ` · ${p.location.district}` : ''}
+            </Typography>
+          </Box>
+        </Box>
+
+        {/* Metric boxes */}
+        <Box sx={{ display: 'flex', gap: 0.875 }}>
+          {[
+            { icon: '↗', label: 'FLÄCHE', value: `${p.areaSqm.toLocaleString('de-CH')} m²` },
+            ...(p.availabilityDate ? [{ icon: '📅', label: 'AB', value: new Date(p.availabilityDate).toLocaleDateString('de-CH', { month: 'short', year: '2-digit' }) }] : []),
+            ...(p.softFactors?.prestige != null ? [{ icon: '↗', label: 'PRESTIGE', value: String(p.softFactors.prestige) }] : []),
+          ].map(({ label, value }) => (
+            <Box key={label} sx={{ flex: 1, bgcolor: '#f9f8f6', borderRadius: 1.5, px: 1, py: 0.875, textAlign: 'center', border: `1px solid ${DS_BORDER.muted}` }}>
+              <Typography sx={{ fontSize: '0.58rem', color: DS_TEXT.muted, textTransform: 'uppercase', letterSpacing: '0.04em', mb: 0.25 }}>
+                {label}
+              </Typography>
+              <Typography sx={{ fontWeight: 700, fontSize: '0.875rem', color: DS_TEXT.primary }}>
+                {value}
+              </Typography>
+            </Box>
+          ))}
+        </Box>
+
+        {/* Chips */}
+        <Box sx={{ display: 'flex', gap: 0.5, flexWrap: 'wrap' }}>
+          {p.softFactors?.publicTransportMinutes != null && (
+            <Chip
+              label={`🚇 ${p.softFactors.publicTransportMinutes} min ÖV`}
+              size="small"
+              sx={{ height: 22, fontSize: '0.7rem', bgcolor: '#f4f3f0', color: DS_TEXT.secondary, border: `1px solid ${DS_BORDER.default}` }}
+            />
+          )}
+          {p.hardFacts?.fitOut && (() => {
+            const meta = FIT_OUT_META[p.hardFacts!.fitOut!] ?? { label: p.hardFacts!.fitOut!, tip: '' }
+            return (
+              <Tooltip title={meta.tip} placement="top" arrow>
+                <Chip label={meta.label} size="small"
+                  sx={{ height: 22, fontSize: '0.7rem', bgcolor: '#f4f3f0', color: DS_TEXT.secondary, border: `1px solid ${DS_BORDER.default}`, cursor: 'help' }} />
+              </Tooltip>
+            )
+          })()}
+          {p.contractDurationMonths && (
+            <Chip label={`${p.contractDurationMonths}M Vertrag`} size="small"
+              sx={{ height: 22, fontSize: '0.7rem', bgcolor: '#f4f3f0', color: DS_TEXT.secondary, border: `1px solid ${DS_BORDER.default}` }} />
+          )}
+        </Box>
+
+        {/* Confidence bar */}
+        <Box sx={{ mt: 'auto' }}>
+          <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 0.5 }}>
+            <Typography sx={{ fontSize: '0.62rem', color: DS_TEXT.disabled, textTransform: 'uppercase', letterSpacing: '0.05em' }}>
+              Datenkonfidenz
+            </Typography>
+            <Typography sx={{ fontSize: '0.75rem', fontWeight: 700, color: p.confidenceScore >= 0.75 ? '#b8975a' : DS_TEXT.muted }}>
+              {confPct}%
+            </Typography>
+          </Box>
+          <LinearProgress
+            variant="determinate"
+            value={confPct}
+            sx={{
+              height: 3, borderRadius: 2, bgcolor: '#f4f3f0',
+              '& .MuiLinearProgress-bar': { bgcolor: '#152642', borderRadius: 2 },
+            }}
+          />
+        </Box>
       </Box>
     </Box>
   )