/* ═══════════════════════════════════════════════════════════
   RESPONSIVE – DM-Bauprojekte GmbH
   xs  < 480 px
   sm  480 – 639 px
   md  640 – 767 px
   lg  768 – 899 px
   xl  ≥ 900 px  (Desktop-Nav)
═══════════════════════════════════════════════════════════ */

/* ── Globaler Overflow-Schutz ────────────────────────────── */
html, body { overflow-x: hidden; }
img        { max-width: 100%; height: auto; }

/* ═══════════════════════════════════════════════════════════
   TABLET & KLEINER  (≤ 900 px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 900px) {

  /* Kontakt: 2-Spalten-Grid → 1 Spalte */
  .resp-split {
    grid-template-columns: 1fr !important;
    gap: 2.5rem !important;
  }

}

/* ═══════════════════════════════════════════════════════════
   MOBIL  (≤ 767 px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 767px) {

  /* Wrap & Sections */
  .wrap    { padding: 0 1.1rem; }
  section  { padding: 2.25rem 0; }
  h1       { font-size: 1.5rem; }
  h2       { font-size: 1.25rem; }

  /* Homepage: Karussell über Inhalt stapeln */
  .home-split         { flex-direction: column; gap: 1.25rem; }
  .home-carousel-wrap { flex: none; max-width: 100%; width: 100%; }
  .home-carousel      { aspect-ratio: 4 / 3; height: auto; min-height: unset; }
  .home-content       { padding: 0; }

  /* Kontakt-Schnellinfos: 1 Spalte, Block zentriert, Inhalt linksbündig */
  .contact-quick      { grid-template-columns: 1fr; width: fit-content; margin-left: auto; margin-right: auto; }

  /* Leistungen */
  .leistungen-split { flex-direction: column; gap: 1.75rem; }
  .leistungen-split > div:last-child { flex: none !important; max-width: 100% !important; }
  .leistungen-banner-img { height: 403px; object-position: center center; }

}

/* ═══════════════════════════════════════════════════════════
   KLEINES TABLET / GROSSES PHONE  (≤ 640 px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 640px) {

  /* Projekt-Karten-Grid → 1 Spalte */
  .wp-grid-2    { grid-template-columns: 1fr; column-gap: 0; row-gap: 1.5rem; }
  .wp-card__img { height: 287px; }

  /* Service-Grid → 1 Spalte */
  .service-grid       { grid-template-columns: 1fr; }
  .service-card--wide { grid-column: auto; }
  .leistungen-hero-heading { font-size: 1.3rem; }

}

/* ═══════════════════════════════════════════════════════════
   FORMULAR-REIHEN  (≤ 600 px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 600px) {

  .resp-form-row        { grid-template-columns: 1fr !important; }
  .resp-contact-actions { grid-template-columns: 1fr !important; }
  .form-row-2           { grid-template-columns: 1fr; gap: .75rem; }

}

/* ═══════════════════════════════════════════════════════════
   KLEINES PHONE  (≤ 479 px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 479px) {

  /* Wrap noch enger */
  .wrap    { padding: 0 .9rem; }
  section  { padding: 1.75rem 0; }

  /* Homepage */
  .home-carousel { aspect-ratio: 4 / 3; height: auto; min-height: unset; }
  .home-title    { font-size: 1.2rem; }
  .home-sub      { font-size: .82rem; }
  .home-links    { gap: 1rem; }

  /* Tagline-Bar */
  .tagline-bar { font-size: 1rem; padding: 1.5rem .25rem; }

  /* Filter-Tabs: volle Breite, leichter anzutippen */
  .filter-tabs { display: flex; width: 100%; }
  .filter-tab  { flex: 1; text-align: center; padding: .6rem .5rem; }

  /* Projekt-Karten */
  .wp-card__body    { padding: 1.1rem 1rem; }
  .wp-card__actions { flex-direction: column; align-items: flex-start; gap: .55rem; }

  /* Leistungen */
  .leistungen-banner-img { height: 280px; }
  .service-card          { gap: .85rem; padding: 1rem; }
  .service-card__body strong { font-size: .85rem; }
  .service-card__body span   { font-size: .75rem; }

  /* Kontakt: Action-Buttons übereinander */
  .resp-contact-actions { grid-template-columns: 1fr !important; }

  /* Diamant-Liste */
  .diamond-list li { font-size: .88rem; gap: .75rem; }

  /* FAQ-Accordion */
  .faq-q { padding: .9rem 1rem; font-size: .85rem; }
  .faq-a { padding: 0 1rem 1rem; }

  /* WhatsApp-Button kleiner & weiter innen */
  .wa-float      { width: 50px; height: 50px; bottom: 1rem; right: 1rem; }
  .wa-float svg  { width: 24px; height: 24px; }

  /* Footer */
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: .5rem; }

}