/* ============ Responsive (Mobile First Anpassungen) ============ */

/* Tablet */
@media (max-width: 1024px) {
  .nav { display: none; }
  .menu-toggle { display: flex; }

  .service { grid-template-columns: 3.6rem minmax(0, 1fr); }
  .service__text { grid-column: 2; }
  .why { grid-template-columns: repeat(2, 1fr); }
  .masonry { columns: 2; }
  .ba-grid { grid-template-columns: 1fr; }
  .ba-pair__images img { aspect-ratio: 4 / 3; }
  .reviews { grid-template-columns: 1fr; }

  .about { grid-template-columns: 1fr; }
  .about__media { max-width: 560px; }
  .about__badge { right: 1.2rem; }

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

/* Mobile */
@media (max-width: 640px) {
  .phone-cta { display: none; }

  /* Logo bleibt komplett sichtbar — nur kompakter gesetzt */
  .brand { gap: 0.6rem; }
  .brand__logo { height: 2rem; }
  .brand__name { font-size: 0.88rem; letter-spacing: 0.26em; }
  .brand__tag { font-size: 0.54rem; letter-spacing: 0.09em; }

  .service { grid-template-columns: 1fr; gap: 0.9rem; }
  .service__text { grid-column: 1; }
  .service__lead { padding-top: 0; }
  .service__icon { width: 2rem; }
  .why { grid-template-columns: 1fr; }
  .masonry { columns: 1; }
  .ba-pair__images img { aspect-ratio: 3 / 4; }

  .br-desktop { display: none; }

  .hero__actions .btn { width: 100%; text-align: center; }

  .hero__trust {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
  }
  .hero__trust-sep { display: none; }

  .ba__frame { aspect-ratio: 4 / 3; }

  .contact__row { grid-template-columns: 1fr; gap: 0.3rem; }

  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__bottom { flex-direction: column; gap: 0.7rem; }
  .site-footer__legal { gap: 1.4rem; }
}

/* Sehr schmale Geräte: Logo weiter verkleinern statt abschneiden */
@media (max-width: 380px) {
  .brand__logo { height: 1.8rem; }
  .brand__name { font-size: 0.8rem; letter-spacing: 0.2em; }
  .brand__tag { font-size: 0.5rem; letter-spacing: 0.06em; }
}