/* ============================================================
   MOBILE FIRST BASIS – gilt für ALLE Geräte < 480px
   Smartphones Hochformat
   ============================================================ */

/* Kopfzeile auf Smartphones AUSBLENDEN */
#headerZeile,
.naviTicker {
  display: none;
}

/* Wrapper verkleinern auf Mobil */
#wrapper {
  margin: auto;
  padding: 0;
  width: 80%;
}

/* Container ohne Rand */
#container {
  margin: 0;
  padding: 0;
}

/* #main wird bei Bedarf gefüllt */


/* ============================================================
   SM – >= 480px (große Smartphones quer)
   ============================================================ */
@media (min-width: 480px) {

  /* Noch Smartphones – aber mehr Platz */
  #wrapper {
    width: 100%;
  }
}


/* ============================================================
   MD – >= 768px (Tablets Hochformat)
   ============================================================ */
@media (min-width: 768px) {

  /* Kopfzeile ab Tablet EINBLENDEN */
  #headerZeile,
  .naviTicker {
    display: block;
  }

  /* Wrapper Volle Breite */
  #wrapper {
    width: 100%;
  }
}


/* ============================================================
   LG – >= 1024px (Tablets quer, kleine Laptops)
   ============================================================ */
@media (min-width: 1024px) {

  /* Rand einschalten */
  #wrapper {
    width: 80%;
  }
}


/* ============================================================
   XL – >= 1280px (große Laptops, Desktop)
   ============================================================ */
@media (min-width: 1280px) {
  /* Hier kannst du später Desktop-Verbesserungen einbauen */
}


/* ============================================================
   2XL – >= 1536px (große Desktop Monitore)
   ============================================================ */
@media (min-width: 1536px) {
  /* Noch mehr Platz – optional */
}


/* ============================================================
   4K – >= 2560px (UHD / 4K Monitore)
   ============================================================ */
@media (min-width: 2560px) {
  /* z. B. max-width setzen, damit Inhalte nicht zu breit werden */
  #wrapper {
    max-width: 1800px;
    margin: auto;
  }
}