/* ============================================================
   MOBILE / TABLET LAYER — shared, injected on every page
   ============================================================ */
html{overflow-x:hidden}
body{overflow-x:hidden;max-width:100%}
img,svg,video,canvas,picture{max-width:100%}

/* ---------- Hamburger button ---------- */
.m-burger{display:none;margin-left:auto;background:#141416;border:1px solid #2a2a2e;
  width:46px;height:46px;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;flex:0 0 auto;box-sizing:border-box}
.m-burger span{display:block;width:22px;height:2px;background:#f2f0ec;transition:.25s}
.m-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.m-burger.open span:nth-child(2){opacity:0}
.m-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- Full-screen menu overlay (iOS-robust) ---------- */
.m-drawer{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;box-sizing:border-box;
  z-index:2147483000;background:#0f0f11;
  display:none;flex-direction:column;align-items:stretch;
  padding:66px 22px 44px;overflow-y:auto}
.m-drawer.open{display:flex}
.m-close{position:fixed;top:12px;right:14px;width:48px;height:48px;box-sizing:border-box;z-index:2147483001;
  background:#1c1c1f;border:1px solid #3a3a3e;color:#fff;font-size:24px;line-height:1;border-radius:6px;
  display:flex;align-items:center;justify-content:center;cursor:pointer}
.m-drawer a{display:block;width:100%;box-sizing:border-box;text-align:left;color:#f2f0ec;text-decoration:none;
  font-size:19px;padding:16px 2px;border-bottom:1px solid #2a2a2e;text-transform:uppercase;letter-spacing:.04em}
.m-drawer a:active{color:#f8a400}
.m-drawer a.m-cta{margin-top:22px;background:#f8a400;color:#151204;text-align:center;font-weight:800;border-bottom:0;border-radius:4px;padding:18px;text-transform:uppercase}
.m-drawer .m-ttl{color:#8f8d88;font-size:11px;letter-spacing:.2em;margin-top:24px;font-family:'IBM Plex Mono',monospace}
.m-drawer .m-langs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.m-drawer .m-langs a{width:auto;display:inline-block;font-size:13px;padding:9px 12px;border:1px solid #2a2a2e;text-transform:none;letter-spacing:0}
.m-backdrop{display:none!important}
body.m-noscroll{overflow:hidden}
@media(min-width:901px){.m-burger,.m-drawer{display:none!important}}

/* ---------- <=900px : hamburger, collapse ONLY the top nav, hide dev artefacts ---------- */
@media(max-width:900px){
  .m-burger{display:flex}
  nav:not(.m-drawer){gap:12px!important;padding:12px 18px!important;flex-wrap:nowrap!important}
  nav:not(.m-drawer)>*:not(.logo):not(.m-burger){display:none!important}
  .logo{font-size:15px!important}
  /* dev widgets + tech/CAD style artefacts off on mobile (verhindert Overflow) */
  .themer,.stiler,.pressbar,.schriftfeld,.techhud{display:none!important}
  body.tech{background-image:none!important;cursor:auto!important}
  .hero-grid>*{min-width:0!important}
  .bp,.stat,.stage,.stage3{min-width:0!important}
}

/* ---------- iPad / tablet (601-1024) ---------- */
@media(min-width:601px) and (max-width:1024px){
  .hero{padding-left:34px!important;padding-right:34px!important}
  .stats{grid-template-columns:1fr 1fr!important}
}

/* ---------- Phone (<=600px) ---------- */
@media(max-width:600px){
  h1{font-size:clamp(29px,8.6vw,44px)!important;line-height:1.02!important;word-break:break-word;overflow-wrap:anywhere;hyphens:auto}
  .hero{padding:96px 18px 30px!important;min-height:auto!important}
  .hero-grid{gap:26px!important;margin-top:24px!important}
  .tag{font-size:11px!important;letter-spacing:.16em!important}
  .sub{font-size:15.5px!important;margin:20px 0 24px!important;max-width:100%!important}
  .cta-row .btn,.btn{padding:14px 20px!important;font-size:12.5px!important}
  .trust{width:100%!important}
  .trust div{padding:14px 16px!important;font-size:12px!important}
  .trust b{font-size:clamp(32px,11vw,46px)!important}
  .stats{grid-template-columns:1fr!important;padding:56px 16px!important}
  .stat{padding:32px 22px!important}
  .stat b{font-size:clamp(52px,16vw,86px)!important;white-space:normal!important}
  .stat span{font-size:16px!important;max-width:100%!important}
  .marq-in{font-size:11px!important;gap:30px!important}
  .chapter{padding:0 18px!important;min-height:auto!important;margin:40px 0!important}
  .chapter .box{padding:30px 22px 24px!important;max-width:100%!important}
  .chapter h2{font-size:clamp(27px,8vw,40px)!important}
  .chapter p{font-size:16px!important}
  .daten{padding:0 16px!important;margin-top:56px!important}
  .daten .panel{padding:40px 20px!important;gap:30px!important}
  section{padding-left:18px!important;padding-right:18px!important}
  footer{padding:26px 18px!important;font-size:12px!important;line-height:1.9}
  main{padding:84px 14px 40px!important}
  .stage,.stage3{min-height:300px!important}
  .field input,.field select,.field textarea{font-size:16px!important}
  .fgrid{grid-template-columns:1fr!important}
  .kontaktblock,#kontaktblock{padding:22px 16px!important}
}