/* Übersicht Minibagger (13.10.2026, research/build_minibagger_seite.py).
   Kopf so knapp, dass die vier Bagger samt Namen ohne Scrollen zu sehen sind (Nutzer 13.10.): Titel links, Text rechts,
   Bagger darunter vom kleinsten zum größten (--h, R22 = 1). Auf dem Handy: Titel, Bagger 2 × 2, dann Text. */
.mb-kopf { position: relative; overflow: clip; padding: clamp(104px, 9vw, 124px) 0 clamp(20px, 3vw, 36px); background: var(--bg, #f4f4f1); }
.mb-kopf .sk-balken { clip-path: polygon(0 74%, 100% 30%, 100% 48%, 0 92%); }
.mb-kopf-in { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "titel mehr" "flotte flotte";
  gap: 0 clamp(32px, 5vw, 80px); align-items: end; }
.mb-titel { grid-area: titel; }
.mb-titel h1 { margin-bottom: 0; }
.mb-mehr { grid-area: mehr; }
.mb-mehr .lead { margin: 0; max-width: 600px; }
.mb-mehr .sk-cta { margin-top: 18px; }
/* Bagger auf einer Linie. Höhe begrenzt durch Breite UND Fensterhöhe, damit die Namen im ersten Bild bleiben */
.mb-flotte { grid-area: flotte; --hmax: max(200px, min(clamp(220px, 25vw, 370px), calc(100svh - 470px))); position: relative; display: flex; align-items: flex-end; justify-content: center; gap: 0;
  margin-top: clamp(20px, 3vw, 36px); }
.mb-f { position: relative; display: flex; flex-direction: column; align-items: center; margin: 0 -1%; text-decoration: none; color: inherit; }
.mb-f img { display: block; height: calc(var(--hmax) * var(--h)); width: auto; max-width: none; transition: transform .45s cubic-bezier(.2, .7, .2, 1); }
.mb-f:hover img { transform: translateY(-6px) scale(1.02); }
.mb-f span { display: grid; justify-items: center; gap: 3px; margin-top: 4px; text-align: center; }
.mb-f small { font: 600 11px/1.2 var(--text); letter-spacing: .12em; text-transform: uppercase; color: var(--olive, #56701f); }
.mb-f b { font: 700 clamp(18px, 1.7vw, 24px)/1 var(--display); text-transform: uppercase; color: var(--ink, #1f231c); }
.mb-f em { font-style: normal; font-size: 13px; color: var(--muted, #6b6f66); }
.minibagger-seite .sv-miete-sek { padding-block: clamp(56px, 7vw, 100px); }
@media (max-width: 900px) {
  .mb-kopf-in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "titel" "flotte" "mehr"; }
  .mb-mehr { margin-top: 26px; }
  .mb-flotte { flex-wrap: wrap; row-gap: 14px; margin-top: 18px; }
  .mb-f { flex: 0 0 50%; margin: 0; justify-content: flex-end; }
  .mb-f img { height: auto; width: calc(94% * var(--h)); max-height: 30svh; object-fit: contain; }
  .mb-kopf .sk-balken { clip-path: polygon(0 46%, 100% 30%, 100% 40%, 0 56%); }
}
