/* APOsite – Mobile-Layout (<768px). Ab 768px wird das 1920px-Design proportional skaliert (js/slider.js). */
@media (max-width: 767px) {
  .apo-root{width:100% !important;overflow-x:hidden}
  /* Header: eine Zeile, Hamburger-Menü */
  .apo-root header{height:60px !important;padding:0;position:relative !important}
  .apo-root header > div{width:100% !important;padding:0 16px;box-sizing:border-box;flex-wrap:nowrap;justify-content:space-between !important;position:static !important}
  .apo-root header > div > a[style*="border-radius:100px"]{display:none !important}
  .apo-burger{display:block}
  .apo-root header nav{display:none !important;position:absolute;top:100%;margin-top:0 !important;left:0;right:0;background:rgb(255,255,255);flex-direction:column !important;align-items:stretch !important;gap:0 !important;box-shadow:0 12px 24px rgba(0,0,0,0.08);border-top:1px solid rgb(237,237,237);z-index:99}
  .apo-root header nav.open{display:flex !important}
  .apo-root header nav a{padding:14px 20px;border-bottom:1px solid rgb(246,246,246)}
  /* Sektionen: absolute Container in den Fluss holen */
  .apo-root section,.apo-root footer{height:auto !important;padding:48px 16px;box-sizing:border-box}
  .apo-root section > div,.apo-root footer > div{position:static !important;width:100% !important;max-width:560px;margin:0 auto;box-sizing:border-box}
  .apo-root section > a,.apo-root section > button{position:static !important;display:flex;margin:24px auto 0;width:max-content}
  /* Deko ausblenden */
  .apo-root [style*="pointer-events"]{display:none !important}
  /* Typo */
  .apo-root h1{font-size:32px !important}
  .apo-root h2{font-size:27px !important}
  .apo-root section p{font-size:18px !important}
  /* Hero */
  /* Hero-Bildcollage skaliert anzeigen */
  #hero > div[style*="964px"]{position:relative !important;left:0 !important;top:0 !important;width:566px !important;height:490px !important;max-width:none !important;zoom:0.58;margin:28px auto 0}
  #hero > div{position:static !important;width:100% !important;max-width:560px;margin:0 auto}
  /* Quick-Infos + News */
  .apo-root section div[style*="gap:80px"]{flex-direction:column !important;gap:32px !important;height:auto !important}
  .apo-root div[style*="width:486px"]{width:100% !important;gap:24px !important}
  .apo-root div[style*="width:574px"]{width:100% !important;height:auto !important}
  .apo-root div[style*="width:510px"]{position:static !important;width:100% !important;height:auto !important;padding:24px;box-sizing:border-box}
  .apo-root div[style*="height:286px"]{height:auto !important;gap:20px}
  /* Schwerpunkte-Raster */
  .apo-root div[style*="grid-template-columns"]{display:flex !important;flex-direction:column;gap:24px !important;row-gap:24px !important;margin-top:28px !important}
  .apo-root div[style*="width:350px"]{width:auto !important;flex:1}
  /* Team */
  #team div[style*="gap:24px"][style*="row"]{flex-direction:column !important;align-items:center}
  #team div[style*="width:364px"]{max-width:100%}
  /* Tipps */
  #news a[style*="space-between"],#news div[style*="space-between"]{flex-direction:column !important;align-items:flex-start !important;gap:8px}
  #news div[style*="width:445px"],#news div[style*="width:556px"]{width:100% !important}
  /* Wichtige Informationen */
  .apo-root div[style*="height:582px"]{height:auto !important;display:flex;flex-direction:column;gap:24px;margin-top:28px !important}
  .apo-root div[style*="height:279px"]{position:static !important;width:100% !important;height:auto !important;overflow:visible !important}
  .apo-root div[style*="height:279px"] > div[style*="left:40px"]{position:static !important;width:100% !important;padding:24px;box-sizing:border-box}
  .apo-root div[style*="height:279px"] > div[style*="left:626px"],
  .apo-root div[style*="height:279px"] > div[style*="left:239px"],
  .apo-root div[style*="height:279px"] > div[style*="left:34px"]{display:none !important}
  /* Footer */
  .apo-root footer div[style*="space-between"]{flex-direction:column !important;align-items:center !important;gap:28px;text-align:center}
  .apo-root footer div[style*="width:300px"],.apo-root footer div[style*="width:280px"]{width:100% !important;align-items:center !important}
  .apo-root footer [style*="text-align:right"]{text-align:center !important}
  .apo-root footer div[style*="width:1140px"]{width:100% !important}
  /* Überlauf-Fixes */
  .apo-root div{min-width:0;overflow-wrap:anywhere}
  .apo-root div[style*="height:120px"][style*="align-items:center"]{height:auto !important;min-height:88px}
  .apo-root div[style*="width:120px"][style*="height:120px"]{width:88px !important;height:88px !important}
  .apo-root div[style*="width:120px"][style*="height:120px"] img{left:14px !important;top:14px !important}
  #produkte div[style*="padding-top"]{padding-bottom:12px}
  /* Dezenter & eleganter: kleinere Typo, kompaktere Elemente */
  .apo-root section,.apo-root footer{padding:20px 20px 40px}
  .apo-root h1{font-size:27px !important;line-height:1.25 !important}
  .apo-root h2{font-size:22px !important}
  .apo-root section p{font-size:15px !important;line-height:1.6 !important;color:rgb(126,126,126)}
  .apo-root header > div > a:first-child img{width:140px !important;height:31px !important}
  .apo-root header nav a{font-size:14px !important}
  .apo-root a[style*="border-radius:100px"][style*="background:var(--accent"]{font-size:15px !important;height:38px !important;padding:6px 18px !important}
  .apo-root a[style*="border-radius:100px"] img{width:18px !important;height:18px !important}
  .apo-root [style*="24px/1 Outfit"]{font-size:18px !important}
  .apo-root [style*="16px/1.4 Outfit"]{font-size:13.5px !important}
  .apo-root [style*="31px/1 Outfit"]{font-size:21px !important}
  .apo-root [style*="20px/1.3 Outfit"]{font-size:16px !important}
  .apo-root [style*="600 20px/1.3 Outfit"]{font-size:16px !important}
  .apo-root div[style*="width:120px"][style*="height:120px"]{width:64px !important;height:64px !important;border-radius:14px !important}
  .apo-root div[style*="width:120px"][style*="height:120px"] img{left:14px !important;top:14px !important;width:36px !important;height:36px !important}
  .apo-root div[style*="height:120px"][style*="align-items:center"]{min-height:64px;gap:14px !important}
  /* Produkte kompakter */
  #apo-track > div, #produkte .apo-card{width:150px !important}
  #produkte div[style*="width:200px"][style*="height:200px"]{width:150px !important;height:150px !important;border-radius:14px !important}
  #produkte div[style*="cubic-bezier"]{gap:24px !important}
  /* News-Box */
  .apo-root div[style*="width:510px"]{padding:20px}
  .apo-root div[style*="height:286px"]{gap:14px}
  .apo-root div[style*="height:80px"][style*="gap:16px"]{height:auto !important}
  /* Team */
  #team div[style*="width:364px"]{gap:14px !important}
  /* Footer */
  .apo-root footer [style*="32px/1.2"]{font-size:20px !important}
  .apo-root footer [style*="16px/1.7 Inter"]{font-size:13.5px !important}
  .apo-root footer a[aria-label]{width:44px !important;height:44px !important}
      .apo-root footer [style*="16px/1.5 Outfit"]{font-size:12.5px !important}
  .apo-root footer [style*="15px/1 Outfit"]{font-size:12px !important}
  .apo-root footer div[style*="space-between"]{gap:22px}
  /* === Screenshot-Layout (Mobil) === */
  /* Hero: Bildcollage zuerst, Text darunter, Button links */
  #hero{display:flex !important;flex-direction:column}
  #hero > div[style*="964px"]{order:-1;margin:8px auto 20px}
  .apo-root section > a,.apo-root section > button{margin:24px 0 0}
  /* Überschriften links (außer Team) */
  #schwerpunkte h2,#schwerpunkte p,
  section[data-screen-label="Wichtige Informationen"] h2,
  section[data-screen-label="Wichtige Informationen"] p{text-align:left !important}
  /* Produkte: Slider mit 2 sichtbaren Karten */
  #produkte div[style*="padding-top"]{overflow:hidden !important}
  #produkte div[style*="cubic-bezier"]{gap:20px !important;width:100% !important}
  #apo-track > div,#produkte .apo-card{width:calc(50% - 10px) !important}
  #produkte div[style*="width:200px"][style*="height:200px"]{width:100% !important;height:auto !important;aspect-ratio:1/1}
  /* Team: Bilder in voller Breite */
  #team div[style*="width:364px"]{width:100% !important;max-width:100% !important}
  #team div[style*="width:364px"] div[style*="height:364px"]{width:100% !important;height:auto !important;aspect-ratio:1/1}
  /* Tipps: Pfeil rechts neben dem Text */
  #news a[style*="space-between"],#news div[style*="space-between"]{display:grid !important;grid-template-columns:1fr auto;gap:6px 14px;align-items:center !important}
  #news a[style*="space-between"] > div[style*="width:38px"],#news div[style*="space-between"] > div[style*="width:38px"]{grid-column:2;grid-row:1 / span 2}
  /* Bereitschaft-Card: Status-Widget anzeigen (skaliert) */
  .apo-root div[style*="height:279px"] > div[style*="left:626px"]{display:block !important;position:relative !important;left:0 !important;top:0 !important;width:762px !important;height:250px !important;zoom:0.44;margin:12px auto 0}
  /* Footer: Öffnungszeiten + Kontakt links, Follow Us zentriert */
  .apo-root footer div[style*="space-between"]{align-items:flex-start !important;text-align:left}
  .apo-root footer div[style*="width:300px"]{align-items:flex-start !important}
  .apo-root footer div[style*="width:300px"] [style*="text-align"]{text-align:left !important}
  .apo-root footer div[style*="width:280px"]{align-items:center !important;align-self:center}
  .apo-root footer div[style*="width:280px"] [style*="text-align"]{text-align:center !important}
  .apo-root footer div[style*="width:1140px"] ~ span,.apo-root footer span[style*="text-align:center"]{text-align:center !important}
  /* === 1:1-Feinschliff nach PDF === */
  /* Tipps: Plus-Kreis statt Pfeil-Quadrat */
  #news div[style*="width:38px"]{border-radius:50% !important;width:32px !important;height:32px !important;position:relative}
  #news div[style*="width:38px"] img{display:none !important}
  #news div[style*="width:38px"]::after{content:"+";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:400 20px/1 Outfit,sans-serif;color:rgb(36,36,36)}
  /* Produkte: Preis dunkel statt grün */
  #produkte [style*="600 20px/1.3"]{color:rgb(36,36,36) !important}
  /* Vorbestellung-Card: Icon-Gruppe zeigen (skaliert) */
  .apo-root div[style*="height:279px"] > div[style*="left:239px"]{display:block !important;position:relative !important;left:0 !important;top:0 !important;width:319px !important;height:216px !important;zoom:0.55;margin:12px auto 0}
  /* Notruf-Card: Nummern-Pills zeigen (skaliert) */
  .apo-root div[style*="height:279px"] > div[style*="left:34px"]{display:block !important;position:relative !important;left:0 !important;top:0 !important;width:524px !important;height:179px !important;zoom:0.6;margin:12px auto 0}
  /* Footer Kontakt links ausrichten */
  .apo-root footer div[style*="align-items:flex-end"]{align-items:flex-start !important}
  .apo-root footer [style*="text-align:right"]{text-align:left !important}
  /* Slider: Pfeile links/rechts neben den Karten, Touch-Swipe */
  #produkte{position:relative}
  #produkte div[style*="padding-top"]{padding-top:12px !important;padding-bottom:0 !important}
  #apo-prev,#apo-next{display:flex !important;position:absolute !important;top:50% !important;transform:translateY(-50%);width:36px !important;height:36px !important;align-items:center;justify-content:center;margin:0 !important;z-index:2;background:rgba(255,255,255,0.9) !important;border-radius:50%;box-shadow:0 1px 6px rgba(0,0,0,0.12)}
  #apo-prev{left:12px !important;right:auto !important}
  #apo-next{right:12px !important;left:auto !important}
  #apo-track{touch-action:pan-y}

  /* Tipps: Abstand Text zu Liste */
  #news div[style*="top:229px"]{margin-top:28px !important}
  /* Social-Buttons: Icons in verkleinerten Kreisen zentrieren */
  .apo-root footer a[aria-label]{position:relative;overflow:hidden}
  .apo-root footer a[aria-label] img{left:50% !important;top:50% !important;transform:translate(-50%,-50%) !important;width:20px !important;height:auto !important}
  .apo-root footer a[aria-label] > span{left:50% !important;top:50% !important;margin:0 !important;transform:translate(-50%,-50%) scale(0.55) !important}
}
