/* Lorenz Schädlingsbekämpfung – Mobile-/Browser-Härtung V2.3.1
   Viewport-basiert statt User-Agent-Erkennung: robust für iOS Safari,
   Chrome/Android, Samsung Internet, Firefox, Edge und Opera. */

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  overflow-x:hidden;
}
body{overflow-x:hidden}
img,svg,video,canvas{max-width:100%;height:auto}

/* Einheitliches Hamburger-Symbol – unabhängig vom Systemfont des Geräts. */
.menu{
  display:inline-grid!important;
  place-items:center!important;
  position:relative!important;
  flex:0 0 auto!important;
  padding:0!important;
  line-height:1!important;
  font-size:0!important;
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
}
.menu::before,.menu::after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:20px;height:2px;
  margin-left:-10px;
  border-radius:999px;
  background:currentColor;
  transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease;
}
.menu::before{transform:translateY(-6px);box-shadow:0 6px 0 currentColor,0 12px 0 currentColor}
.menu::after{opacity:0}
body.lorenz-menu-open .menu::before{transform:rotate(45deg);box-shadow:none}
body.lorenz-menu-open .menu::after{opacity:1;transform:rotate(-45deg)}

/* Tablets und Smartphones: eigenes, vollständig scrollbareres Menü-Panel. */
@media (max-width:939px){
  #mobileMenu.lorenz-mobile-panel{
    display:none!important;
    position:fixed!important;
    z-index:10000!important;
    top:var(--lorenz-menu-top,72px)!important;
    left:12px!important;
    right:12px!important;
    bottom:10px!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:8px 14px 24px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    touch-action:pan-y;
    background:var(--bg)!important;
    border:1px solid var(--line)!important;
    border-radius:0 0 20px 20px!important;
    box-shadow:0 22px 50px rgba(0,0,0,.22)!important;
  }
  @supports (padding:max(0px)){
    #mobileMenu.lorenz-mobile-panel{
      left:max(12px,env(safe-area-inset-left))!important;
      right:max(12px,env(safe-area-inset-right))!important;
      bottom:max(10px,env(safe-area-inset-bottom))!important;
      padding-bottom:max(24px,calc(env(safe-area-inset-bottom) + 14px))!important;
    }
  }
  body.lorenz-menu-open #mobileMenu.lorenz-mobile-panel{display:block!important}
  body.lorenz-menu-open{overflow:hidden!important;touch-action:none}
  body.lorenz-menu-open #mobileMenu{touch-action:pan-y}
  body.lorenz-menu-open .mobilebar,
  body.lorenz-menu-open .privacyFab,
  body.lorenz-menu-open .privacyInfo{display:none!important}

  #mobileMenu .mobileClose{
    position:sticky;
    top:-8px;
    z-index:2;
    display:block;
    margin:0 -2px 6px;
    padding:12px 4px 11px!important;
    text-align:right;
    background:var(--bg)!important;
    border-bottom:1px solid var(--line)!important;
    font-size:14px!important;
    font-weight:800!important;
  }
  #mobileMenu>details{
    margin:6px 0 8px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:var(--paper)!important;
  }
  #mobileMenu>details>summary{
    padding:12px 12px!important;
    font-size:15px!important;
    line-height:1.25!important;
    border-bottom:0!important;
  }
  #mobileMenu>details[open]>summary{border-bottom:1px solid var(--line)!important}
  #mobileMenu>details>div{
    padding:4px 10px 9px!important;
    background:var(--paper)!important;
  }
  #mobileMenu>details>div>a{
    padding:9px 4px!important;
    font-size:14px!important;
    line-height:1.25!important;
    border-bottom:1px solid var(--line)!important;
  }
  #mobileMenu>details>div>a:last-child{border-bottom:0!important}
  #mobileMenu>a:not(.mobileClose){
    display:block!important;
    padding:11px 4px!important;
    font-size:15px!important;
    line-height:1.25!important;
    border-bottom:1px solid var(--line)!important;
  }
}

/* Smartphone-Typografie: kompakter, ohne die Desktop-Gestaltung zu verändern. */
@media (max-width:719px){
  body{font-size:15px!important;line-height:1.5!important}
  .wrap{width:min(var(--max),calc(100% - 28px))!important}

  .navin{height:70px!important;gap:8px!important}
  .brand{min-width:0!important;gap:8px!important}
  .brand img{width:56px!important;max-height:56px!important;object-fit:contain}
  .navcta{gap:7px!important;flex:0 0 auto!important}
  .navcta .btn{min-height:43px!important;padding:9px 14px!important;font-size:14px!important;white-space:nowrap}
  .menu{width:43px!important;height:43px!important}

  h1{
    font-size:clamp(28px,8.2vw,36px)!important;
    line-height:1.03!important;
    letter-spacing:-.035em!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    hyphens:none!important;
  }
  h2.sectionTitle,.sectionHead h2,.sectionhead h2,.ctabox h2,.regionTop h2,
  .panel h2,.business h2{
    font-size:clamp(25px,7vw,32px)!important;
    line-height:1.08!important;
    overflow-wrap:break-word;
  }
  h3{overflow-wrap:break-word}
  .heroLead,.hero>.wrap p,.hero p{font-size:15.5px!important;line-height:1.48!important}
  .sectionHead p,.sectionhead p{font-size:15px!important;line-height:1.48!important}
  .panel p,.serviceCard p,.warning p,.regionCard p,.detailbody,.metric span{line-height:1.47}
  .panel,.heroCard,.regionCard,.warning,.serviceCard{padding-left:17px!important;padding-right:17px!important}
  section{scroll-margin-top:82px}

  .heroGrid,.grid2,.stripgrid,.serviceGrid,.related{min-width:0!important}
  .heroGrid>*,.grid2>*,.stripgrid>*,.serviceGrid>*,.related>*{min-width:0!important}

  .mobilebar .btn{min-height:46px!important;font-size:14.5px!important}
  .privacyFab{transform:scale(.92);transform-origin:left bottom}

  /* Sonntag-/Saisonkarte: auf kleinen Displays niemals starre Höhe. */
  #heroSeasonCard{height:auto!important;min-height:0!important;overflow:visible!important}
  #heroSeasonCard .heroCardTop{min-height:0!important}
  #heroSeasonCard .season{min-height:0!important;padding-bottom:18px!important}
  .sundaySpecial:not([hidden]){gap:12px!important;margin-top:14px!important;padding-bottom:2px!important}
  .sundayActions{grid-template-columns:1fr!important;gap:8px!important;margin-bottom:8px!important}
  .sundayActions .btn{min-height:46px!important;font-size:13px!important}
  .sundayFair{padding:12px 13px!important}

  /* Kontakt-Dialog auch auf älteren/kleinen Geräten vollständig bedienbar. */
  dialog#contactDialog{
    width:calc(100% - 14px)!important;
    max-width:720px!important;
    max-height:calc(100vh - 14px)!important;
    margin:auto!important;
    border-radius:20px!important;
  }
  @supports (height:100dvh){dialog#contactDialog{max-height:calc(100dvh - 14px)!important}}
  #contactDialog .modal{padding:17px!important}
  #contactDialog .modalTop{gap:10px!important;align-items:flex-start!important}
  #contactDialog .modalTop>div{min-width:0!important}
  #contactDialog h2{font-size:clamp(21px,6vw,27px)!important;line-height:1.12!important;overflow-wrap:break-word!important}
  #contactDialog p{font-size:14px!important;line-height:1.45!important}
  #contactDialog input,#contactDialog textarea,#contactDialog select{font-size:16px!important;max-width:100%!important}

  /* Lange Orts-/Leistungsnamen dürfen niemals seitlich aus dem Viewport laufen. */
  .breadcrumbs,.related a,.serviceCard,.servicechips>*{overflow-wrap:break-word;word-break:normal}
}

@media (max-width:390px){
  h1{font-size:30px!important}
  .navcta .btn{padding-left:12px!important;padding-right:12px!important}
  #mobileMenu>details>summary,#mobileMenu>a:not(.mobileClose){font-size:14.5px!important}
  #mobileMenu>details>div>a{font-size:13.5px!important}
}

@media (max-width:340px){
  .wrap{width:calc(100% - 20px)!important}
  .brand img{width:50px!important;max-height:50px!important}
  .navcta .btn{font-size:13px!important;padding:8px 10px!important}
  .menu{width:40px!important;height:40px!important}
  h1{font-size:27px!important}
  h2.sectionTitle,.sectionHead h2,.sectionhead h2,.ctabox h2,.regionTop h2,.panel h2,.business h2{font-size:24px!important}
}

@media (min-width:940px){#mobileMenu.lorenz-mobile-panel{display:none!important}}

@media (prefers-reduced-motion:reduce){
  .menu::before,.menu::after{transition:none}
  html{scroll-behavior:auto}
}

/* Tablet-Härtung und nachträgliche QA-Korrekturen V2.3.1.1 */
#heroSeasonCard.sundayMode{
  height:auto!important;
  min-height:470px!important;
  overflow:visible!important;
}

@media (max-width:939px){
  .heroGrid,.grid2,.stripgrid,.steps,.serviceGrid,.related,.citycards,.audience{min-width:0!important}
  .heroGrid>*,.grid2>*,.stripgrid>*,.steps>*,.serviceGrid>*,.related>*,.citycards>*,.audience>*{min-width:0!important;max-width:100%!important}
}

@media (min-width:720px) and (max-width:1099px){
  h1{
    font-size:clamp(40px,5.6vw,52px)!important;
    line-height:1.02!important;
    letter-spacing:-.04em!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    hyphens:none!important;
  }
  h2.sectionTitle,.sectionHead h2,.sectionhead h2,.ctabox h2,.regionTop h2,.panel h2,.business h2{
    font-size:clamp(30px,4.2vw,40px)!important;
    line-height:1.07!important;
  }
  .heroLead,.hero>.wrap p,.hero p{font-size:16.5px!important;line-height:1.5!important}
  #heroSeasonCard.sundayMode{min-height:0!important}
}

@media (max-width:719px){
  #heroSeasonCard.sundayMode{min-height:0!important}
  .audience>*{width:100%!important}
}

@media (max-width:1099px){
  #heroSeasonCard .heroCardTop{min-width:0!important;gap:8px!important}
  #heroSeasonCard .heroCardTop>div{min-width:0!important}
  #heroSeasonCard .auto{
    flex:0 1 auto!important;
    max-width:46%!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.15!important;
  }
}

/* Karten-/Leistungsrahmen explizit absichern, damit Browser-Cascades keine
   einzelne Leistungsauflistung rahmenlos darstellen. */
.serviceGrid .serviceCard,.related a,.steps .step{
  border-style:solid!important;
  border-width:1px!important;
  border-color:var(--line)!important;
}
