/* ===== Objekte-Übersicht: editorial gestaffeltes Raster =====
   Nummer ÜBER dem Bild, Bilder mit wechselndem Seitenverhältnis (Stagger),
   Name UNTER dem Bild. Zeilen sind oben bündig (align-items:start). */
body#immo-objekte{ background: #fff; }

section.objekte{ padding: 420px 0 90px 0; }   /* viel Platz unter dem fixen Header */

.objekt-grid{
    list-style: none; margin: 0; padding: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 14px;
    row-gap: 38px;
    align-items: start;          /* Karten oben bündig => kürzere lassen Platz darunter */
}

.objekt > a{ display: block; color: #000; }

/* Nummer ÜBER dem Bild (klein, grau) */
.objekt-num{
    color: #8d8d8d;
    margin: 0 0 14px 0;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

/* Bildfenster mit horizontal laufender Bilderfolge; Seitenverhältnis variiert */
.objekt-media{
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #ececec;
    aspect-ratio: 4 / 3;          /* Standard: quer */
}
.objekt-media.port{ aspect-ratio: 4 / 5; }   /* hoch */

.objekt-media .photos{
    position: absolute; top: 0; left: 0;
    width: 100%; height: 100%;
    display: flex;
    will-change: transform;
    transform: translate3d(0,0,0);
}
/* jedes Bild = volle Fensterbreite (egal welches Seitenverhältnis) */
.objekt-media .photo{ flex: 0 0 100%; height: 100%; }
.objekt-media .photo img{
    width: 100%; height: 100%;
    object-fit: cover; display: block;
    -webkit-user-drag: none; user-select: none; pointer-events: none;
}

/* Name UNTER dem Bild – gleiche Größe wie die Nummer darüber (p3); kein Hover-Unterstrich */
.objekt-name{ margin-top: 14px; color: #000; line-height: 1.2; }

/* Tablet: 2 Spalten */
@media (min-width:768px) and (max-width:1100px){
    .objekt-grid{ grid-template-columns: repeat(2, 1fr); column-gap: 12px; row-gap: 30px; }
}
/* Mobile: 1 Spalte, einheitlich quer */
@media (max-width:768px){
    section.objekte{ padding: 260px 0 50px 0; }
    .objekt-grid{ grid-template-columns: 1fr; row-gap: 24px; }
    .objekt-media, .objekt-media.port{ aspect-ratio: 4 / 3; }
    .objekt-num{ margin-bottom: 11px; }
    .objekt-name{ margin-top: 11px; }
}