/*  Verkleinerung der Desktop-Fassung.
 *
 *  Die Seiten sind auf 2080 px Breite gesetzt. Auf schmaleren Bildschirmen
 *  wird die ganze Seite gleichmässig verkleinert, damit Bild und Text an
 *  ihrer Stelle bleiben.
 *
 *  WICHTIG – jede Stufe rechnet mit ihrer UNTEREN Kante.
 *  Eine Stufe "bis 1440 px" gilt ab 1401 px. Nähme sie den Faktor für
 *  1440 px (0.69), ergäbe das bei 1401 px Fensterbreite 2080 x 0.69 =
 *  1435 px Inhalt – die Seite würde seitlich überstehen. Deshalb steht
 *  hier der Faktor der unteren Kante; er passt dann über die ganze Stufe.
 *
 *  DIE STARTSEITE ist von der Verkleinerung ausgenommen: ihr Hintergrund-
 *  bild soll den Bildschirm füllen. Ihr MENÜ bekommt den Faktor aber
 *  einzeln – sonst wäre es dort ein Drittel grösser als auf allen anderen
 *  Seiten und spränge beim Wechsel sichtbar (gemeldet am 31.07.2026).
 *  Bei zoom auf einem einzelnen Element werden auch dessen left/top
 *  mitgerechnet, das Menü landet also an derselben Stelle wie sonst.
 *
 *  Die Stufen gehen in 40er-Schritten. Feiner lohnt nicht: der Unterschied
 *  liegt dann unter zwei Prozent und ist nicht mehr zu sehen.
 *
 *  Unter 1100 px gilt die Handy-Fassung (handy.css), darum beginnt jede
 *  Regel mit min-width: 1100px. Der Wert steht in grenze.js.
 *
 *  Reihenfolge: absteigend. Es gewinnt die letzte Regel, die passt –
 *  also die mit der kleinsten passenden Obergrenze.
 */

@media (min-width: 1100px) and (max-width: 2079px) {
  body { zoom: 0.98; }
  body.section-1 #menu { zoom: 0.98; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 2039px) {
  body { zoom: 0.96; }
  body.section-1 #menu { zoom: 0.96; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1999px) {
  body { zoom: 0.94; }
  body.section-1 #menu { zoom: 0.94; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1959px) {
  body { zoom: 0.92; }
  body.section-1 #menu { zoom: 0.92; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1919px) {
  body { zoom: 0.90; }
  body.section-1 #menu { zoom: 0.90; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1879px) {
  body { zoom: 0.88; }
  body.section-1 #menu { zoom: 0.88; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1839px) {
  body { zoom: 0.86; }
  body.section-1 #menu { zoom: 0.86; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1799px) {
  body { zoom: 0.84; }
  body.section-1 #menu { zoom: 0.84; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1759px) {
  body { zoom: 0.82; }
  body.section-1 #menu { zoom: 0.82; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1719px) {
  body { zoom: 0.80; }
  body.section-1 #menu { zoom: 0.80; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1679px) {
  body { zoom: 0.78; }
  body.section-1 #menu { zoom: 0.78; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1639px) {
  body { zoom: 0.76; }
  body.section-1 #menu { zoom: 0.76; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1599px) {
  body { zoom: 0.75; }
  body.section-1 #menu { zoom: 0.75; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1559px) {
  body { zoom: 0.73; }
  body.section-1 #menu { zoom: 0.73; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1519px) {
  body { zoom: 0.71; }
  body.section-1 #menu { zoom: 0.71; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1479px) {
  body { zoom: 0.69; }
  body.section-1 #menu { zoom: 0.69; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1439px) {
  body { zoom: 0.67; }
  body.section-1 #menu { zoom: 0.67; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1399px) {
  body { zoom: 0.65; }
  body.section-1 #menu { zoom: 0.65; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1359px) {
  body { zoom: 0.63; }
  body.section-1 #menu { zoom: 0.63; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1319px) {
  body { zoom: 0.61; }
  body.section-1 #menu { zoom: 0.61; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1279px) {
  body { zoom: 0.59; }
  body.section-1 #menu { zoom: 0.59; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1239px) {
  body { zoom: 0.57; }
  body.section-1 #menu { zoom: 0.57; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1199px) {
  body { zoom: 0.55; }
  body.section-1 #menu { zoom: 0.55; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1159px) {
  body { zoom: 0.53; }
  body.section-1 #menu { zoom: 0.53; }   /* Startseite: nur das Menü */
}
@media (min-width: 1100px) and (max-width: 1119px) {
  body { zoom: 0.52; }
  body.section-1 #menu { zoom: 0.52; }   /* Startseite: nur das Menü */
}

/* Die Startseite füllt den Bildschirm ohnehin – dort den Seiteninhalt
   nicht verkleinern. Das Menü hat seinen Faktor oben schon bekommen. */
body.section-1 { zoom: 1 !important; }