/* ==========================================================================
   Responsive: Tablet (<=900px) und Mobile (<=600px)
   ========================================================================== */

@media (max-width: 900px){
  .site-nav{ display: none; }
  .site-header__cta{ display: none; } /* CTA raus, sonst draengt sie den Burger aus dem Viewport */
  .burger{ display: inline-flex; }

  /* Desktop-Dropdown-Hover/Focus-Reset: hoehere Spezifitaet muss hier erneut gebrochen werden */
  .site-nav .menu-item-has-children:hover > .sub-menu,
  .site-nav .menu-item-has-children:focus-within > .sub-menu{
    transform: none;
  }

  .hero{ padding-block: var(--space-m) var(--space-s); }
  .hero__figure img{ height: clamp(260px, 60vw, 420px); }

  .footer-grid{ grid-template-columns: 1fr 1fr; }

  .grid-12{ grid-template-columns: repeat(6, 1fr); }
  .cs-1, .cs-2, .cs-3, .cs-4, .cs-5, .cs-6{ grid-column-start: 1; }
  .span-4, .span-5, .span-6, .span-7, .span-8, .span-9, .span-10{ grid-column: span 6; }

  .split-block{ grid-template-columns: 1fr; }
  .split-block__figure{ order: -1; }

  .cta-break__grid{ grid-template-columns: 1fr; }
}

@media (max-width: 600px){
  body{ font-size: 1.0625rem; } /* >=16px Pflicht, hier 17px */

  .container{ padding-inline: 1.25rem; }

  .site-header__inner{ padding-block: 1rem; }
  .site-header.is-scrolled .site-header__inner{ padding-block: 0.6rem; }

  .hero__actions{ flex-direction: column; align-items: stretch; }
  .hero__actions .btn{ justify-content: center; }
  .hero__figure{ border-radius: 16px; }

  .slider__slide{ flex-basis: 88vw; }
  .slider__caption h3{ font-size: 1.25rem; }

  .footer-grid{ grid-template-columns: 1fr; gap: 2.25rem; }
  .footer-bottom{ flex-direction: column; align-items: flex-start; }

  .service-item__figure img{ height: 200px; }

  .mobile-drawer{ width: 100vw; padding-inline: 1.5rem; }

  .contact-form-wrap{ padding: 1.5rem; }
  .map-frame iframe{ height: 280px; }
}