/* ============ DG Immobilien – Mobile / Responsive ============ */

/* --- Burger / Navigation --- */
.dg-burger{ display:none; }

@media (max-width: 880px){
  .dg-desktop-nav{ display:none !important; }
  .dg-cta{ display:none !important; }
  .dg-burger{ display:flex !important; }
  .dg-logo{ height:48px !important; }
  .dg-header{ min-height:66px !important; }
  .dg-header-inner{ padding-left:20px !important; padding-right:20px !important; }
}
@media (min-width: 881px){
  .dg-mobile-panel{ display:none !important; }
}

/* --- Mobiles Aufklapp-Menü: Aussehen rein über CSS (robust auf allen Geräten) --- */
@media (max-width: 880px){
  .dg-mobile-panel{
    display:flex !important;
    flex-direction:column !important;
    background:#ffffff !important;
    max-height:0;
    opacity:0;
    overflow:hidden;
    padding:0 22px !important;
    border-top:1px solid transparent;
    transition:max-height .4s ease, opacity .3s ease, padding .4s ease;
  }
  .dg-mobile-panel.is-open{
    max-height:88vh !important;
    opacity:1 !important;
    padding:6px 22px 26px !important;
    border-top:1px solid #ECE8DF !important;
  }
  .dg-mnav{
    font-family:'Hanken Grotesk', system-ui, sans-serif !important;
    font-size:18px !important;
    font-weight:600 !important;
    color:#0E0E0E !important;
    text-decoration:none !important;
    padding:16px 2px !important;
    border-bottom:1px solid #ECE8DF !important;
    display:block !important;
  }
  .dg-mnav-cta{
    font-family:'Hanken Grotesk', system-ui, sans-serif !important;
    font-size:16px !important;
    font-weight:600 !important;
    color:#ffffff !important;
    background:#0E0E0E !important;
    text-decoration:none !important;
    text-align:center !important;
    padding:17px !important;
    border-radius:2px !important;
    margin-top:20px !important;
    display:block !important;
  }
}

/* --- Spalten-Raster brechen um (React serialisiert mit Leerzeichen) --- */
@media (max-width: 880px){
  [style*="repeat(4, 1fr)"]{ grid-template-columns:1fr 1fr !important; }
  [style*="repeat(3, 1fr)"]{ grid-template-columns:1fr 1fr !important; }
}
@media (max-width: 600px){
  [style*="repeat(4, 1fr)"]{ grid-template-columns:1fr !important; }
  [style*="repeat(3, 1fr)"]{ grid-template-columns:1fr !important; }
  [style*="repeat(2, 1fr)"]{ grid-template-columns:1fr !important; }
}

/* --- Seitliche Abstände fürs Handy --- */
@media (max-width: 600px){
  section{ padding-left:20px !important; padding-right:20px !important; }
  /* Zweispaltige Flex-Bereiche (Hero, Schritt-Zeilen, Kontakt …) untereinander stapeln */
  [style*="flex: 1 1 "]{ flex-basis:100% !important; max-width:100% !important; }
  /* Hero-Bereiche oben weniger Luft (fixer Header ist kleiner) */
  [style*="180px 40px"]{ padding-top:100px !important; }
  [style*="172px 40px"]{ padding-top:100px !important; }
  [style*="168px 40px"]{ padding-top:98px !important; }
  [style*="150px 40px"]{ padding-top:92px !important; }
}