/* drivebro — Seitenbanner (werbung.js), Präfix sb-, 07.10.2026.
   Rand: hohes Bild 300 × 600 rechts neben dem Inhalt, mitlaufend, nur wenn daneben Platz ist (Inhalt 1360 px: ab 1912 px, Suche mit
   1120 px: ab 1672 px; 16 px Abstand zum Inhalt, Reserve für eine Bildlaufleiste). Dann entfallen die Zeilen.
   Zeile: breites Bild 1200 × 300 (4 : 1) zwischen Abschnitten. Ohne Buchung ein flaches, dezentes Feld (96 px hoch); bis die Daten da
   sind, ist so viel Platz reserviert. Die Zeilen liegen unterhalb des ersten Bildschirms, ein gebuchtes Banner verschiebt also nichts
   Sichtbares. Telefon: nur mit Banner.
   Ruhig: weisse bzw. hellgraue Fläche, keine Schatten, «Anzeige» klein über dem Bild. */
[data-sb-rand]{position:relative;--sb-halb:624px}
[data-sb-rand="1120"]{--sb-halb:504px}
.sb-rand{display:none}

/* Zeile zwischen Abschnitten */
.sb-slot{position:relative;max-width:1200px;margin-inline:auto;padding-top:22px}
.sb-slot:empty::before{content:"";display:block;height:96px;border-radius:12px;background:var(--flaeche)}
.sb-kopf{position:absolute;top:0;left:0;font-size:12px;line-height:16px;font-weight:600;color:var(--grau);letter-spacing:.01em}
.sb-anz{display:block;aspect-ratio:4/1;border-radius:12px;overflow:hidden;background:var(--flaeche);border:1px solid var(--linie)}
.sb-anz img{width:100%;height:100%;object-fit:cover;display:block}
.sb-anz:focus-visible{outline:2px solid var(--akzent);outline-offset:3px}
.sb-platz{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 14px;min-height:96px;padding:14px 20px;border:1.5px dashed var(--linie-stark);border-radius:12px;
  background:var(--flaeche);color:var(--sub);text-align:center;font-size:14px;line-height:1.35;transition:border-color .2s}
.sb-platz b{font-size:16px;font-weight:800;color:var(--tinte);letter-spacing:-.01em}
.sb-platz-link{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--tinte);border-bottom:1.5px solid currentColor}
.sb-platz-link .ic{width:13px;height:13px}
.sb-platz:hover{border-color:var(--tinte)}

/* Rand rechts neben dem Inhalt (hohes Bild) */
.sb-rand-innen{position:sticky;top:calc(var(--kopf-h) + var(--sb-oben, 24px));padding-top:22px}  /* Suche: unter der Filterleiste */
.sb-rand-innen:empty::before{content:"";display:block;height:200px;border-radius:12px;background:var(--flaeche)}
.sb-rand .sb-anz{aspect-ratio:1/2}
.sb-platz-hoch{flex-direction:column;min-height:200px;gap:8px;padding:24px}
.sb-platz-hoch b{font-size:19px;line-height:1.25;text-wrap:balance}

/* Lage der Zeilen auf den Seiten (Fahrzeugseite unter den Angaben, Suche nach dem 8. Treffer, im Raster über die ganze Breite) */
.sb-zeile-fd{margin:32px 0 8px}
.sb-zeile-su{padding:20px 0}
.sb-zeile-raster{grid-column:1/-1}

@media (prefers-reduced-motion:reduce){.sb-platz{transition:none}}
@media print{.sb-rand,[data-werbung]{display:none!important}}
/* Telefon: Zeile nur mit gebuchtem Banner (kein Platzhalter) */
@media (max-width:760px){
  [data-werbung="breit"]:not(.sb-hat){display:none!important}
  .sb-slot{padding-top:20px}
  .sb-anz{border-radius:10px}
}
/* Genug Platz rechts neben dem Inhalt: Rand statt Zeilen */
@media (min-width:1672px){
  [data-sb-rand="1120"]>.sb-rand{display:block;position:absolute;top:0;bottom:0;left:calc(50% + var(--sb-halb) + 16px);width:300px;z-index:2}
  [data-sb-rand="1120"] [data-werbung="breit"]{display:none!important}
}
@media (min-width:1912px){
  [data-sb-rand]>.sb-rand{display:block;position:absolute;top:0;bottom:0;left:calc(50% + var(--sb-halb) + 16px);width:300px;z-index:2}
  [data-sb-rand] [data-werbung="breit"]{display:none!important}
}
