/* =====================================================
   WORKERNOW – MOBILE STYLES (SAFE VERSION)
   Datei: workernow-mobile.css
   ===================================================== */

@media (max-width: 991px) {

  /* ---------------------------------
     HEADER - Top Bar verstecken
     --------------------------------- */
  .header-top {
    display: none !important;
  }

  /* ---------------------------------
     HERO SECTION
     --------------------------------- */
  
  /* Hintergrund-Shapes ausblenden */
  .tj-banner-section-2 .bg-shape-1,
  .tj-banner-section-2 .bg-shape-2 {
    display: none !important;
  }

  /* Scroll-Pfeil ausblenden */
  .tj-banner-section-2 .banner-scroll {
    display: none !important;
  }

  /* Dekorative Elemente ausblenden */
  .tj-banner-section-2 .brand-name {
    display: none !important;
  }
  
  .tj-banner-section-2 .growth-box {
    display: none !important;
  }
  
  .tj-banner-section-2 .banner-author {
    display: none !important;
  }

  /* ---------------------------------
     HERO TEXT - Zentrieren
     --------------------------------- */
  .banner-content-2 {
    text-align: center !important;
  }

  .banner-content-2 .sub-title {
    justify-content: center;
  }

  .banner-title {
    text-align: center !important;
  }

  .banner-content-2 .desc {
    text-align: center;
  }

  /* ---------------------------------
     HERO BUTTONS
     --------------------------------- */
  .hero-download-links {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
  }

  .hero-download-links .download-link {
    width: 100%;
    max-width: 300px;
    min-height: 52px;
    justify-content: center;
    background: var(--tj-primary-color) !important;
    color: #fff !important;
    border-radius: 14px;
  }

  .hero-download-links .download-link:hover {
    background: #000 !important;
  }

  /* ---------------------------------
     HERO BILD - ZENTRIEREN (DER FIX!)
     --------------------------------- */
  .banner-img-area {
    text-align: center !important;
  }

  .banner-img {
    display: flex !important;
    justify-content: center !important;
    margin: 30px auto 0 auto !important;
  }

  .banner-img img {
    max-width: 360px !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }
}

/* ---------------------------------
   KLEINE SMARTPHONES
   --------------------------------- */
@media (max-width: 576px) {
  
  .banner-title {
    font-size: 26px !important;
  }

  .banner-img img {
    max-width: 300px !important;
  }
}