/* Responsive fixes – Lovable */

/* ===== MOBILE (≤767px) ===== */
@media screen and (max-width: 767px) {
  /* Reduce excessive section paddings on Webflow sections */
  section,
  .section,
  .section_wrap,
  [class*="section"] {
    padding-top: clamp(2rem, 8vw, 4rem) !important;
    padding-bottom: clamp(2rem, 8vw, 4rem) !important;
  }

  /* Cap excessive min-heights on non-hero sections */
  section:not([class*="hero"]):not(.hero):not(.hero_wrap) {
    min-height: 0 !important;
  }

  /* Collapse empty spacer divs */
  .spacer,
  [class*="spacer"]:empty,
  .w-layout-blockcontainer:empty {
    display: none !important;
  }

  /* Tighter headlines on mobile */
  h1, .h1, [class*="heading-xxl"], [class*="display"] {
    font-size: clamp(2.2rem, 9vw, 3.4rem) !important;
    line-height: 1.05 !important;
  }
  h2, .h2 {
    font-size: clamp(1.6rem, 6.5vw, 2.4rem) !important;
    line-height: 1.15 !important;
  }
}

/* ===== TABLET (768–991px) ===== */
@media screen and (min-width: 768px) and (max-width: 991px) {
  /* Reduce huge container side paddings that were sized for desktop */
  .page-wrapper,
  .container,
  .w-container,
  [class*="container"] {
    padding-left: clamp(1.5rem, 4vw, 2.5rem) !important;
    padding-right: clamp(1.5rem, 4vw, 2.5rem) !important;
  }

  section,
  .section {
    padding-top: clamp(3rem, 8vw, 5rem) !important;
    padding-bottom: clamp(3rem, 8vw, 5rem) !important;
  }

  /* Force burger menu up to 991px (Webflow default) */
  .w-nav-button,
  [data-collapse="medium"] .w-nav-button {
    display: block !important;
  }
  .w-nav-menu,
  .nav-menu,
  .navbar_menu {
    display: none !important;
  }
  /* When menu is opened, allow it */
  /* Hide desktop nav links inside navbar_content; show burger */
  .navbar_content .flex-block,
  .navbar_content > .w-layout-vflex {
    display: none !important;
  }
  .menu-button-2,
  .w-nav-button {
    display: flex !important;
  }
}

/* ===== Detail page (objekte/:id) ===== */
@media screen and (max-width: 900px) {
  .dp-grid {
    grid-template-columns: 1fr !important;
  }
  .dp-sidebar,
  .dp-aside {
    position: static !important;
    top: auto !important;
    width: 100% !important;
  }
}
