/* SM Hörakustik – Mobile Fullscreen-Menü (≤767px und Handy-Querformat). Desktop bleibt Elementor. */
:root{
  --sm-mnav-open:650ms; --sm-mnav-close:420ms;
  --sm-mnav-ease:cubic-bezier(.22,.61,.21,1);
  --sm-mnav-x:calc(100% - 38px); --sm-mnav-y:44px;
}
button.sm-mnav-btn{ display:none !important; }
@media (max-width:767px), ((max-width:1024px) and (max-height:520px)){
  .sm-mnav-js .elementor-location-header .elementor-menu-toggle,
  .sm-mnav-js .elementor-location-header .elementor-nav-menu--dropdown{ display:none !important; }
  button.sm-mnav-btn{ display:inline-flex !important; }
}
/* Burger: zwei Linien, die zum X werden */
/* Reset gegen Elementor-Kit-Button-Styles (Kit setzt background/padding auf jedes <button>) */
button.sm-burger, button.sm-burger:hover, button.sm-burger:focus, button.sm-burger:active{ position:relative; width:48px !important; min-width:0 !important; height:48px !important; min-height:0 !important; flex:0 0 48px;
  border:0 !important; padding:0 !important; margin:0 !important; background:transparent !important; box-shadow:none !important; border-radius:12px;
  color:#5A3525 !important; font-size:0; line-height:0; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent; transition:none; }
.sm-burger:focus-visible{ outline:2px solid #D25522; outline-offset:3px; }
.sm-burger__l{ position:absolute; left:12px; top:23px; width:24px; height:2px; border-radius:2px; background:currentColor;
  transition:transform var(--sm-mnav-close) var(--sm-mnav-ease); }
.sm-burger__l:nth-child(1){ transform:translateY(-4px); }
.sm-burger__l:nth-child(2){ transform:translateY(4px); }
.sm-burger.is-x .sm-burger__l:nth-child(1){ transform:rotate(45deg); }
.sm-burger.is-x .sm-burger__l:nth-child(2){ transform:rotate(-45deg); }
.sm-burger.is-x .sm-burger__l{ transition-duration:var(--sm-mnav-open); }

/* Dialog = das Overlay selbst */
.sm-mnav{ position:fixed; inset:0; width:100vw; height:100vh; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0;
  background:#FDFDFD; color:#5A3525; overflow:hidden; display:none;
  clip-path:circle(0px at var(--sm-mnav-x) var(--sm-mnav-y));
  transition:clip-path var(--sm-mnav-close) var(--sm-mnav-ease); }
.sm-mnav[open]{ display:block; }
.sm-mnav::backdrop{ background:transparent; }
.sm-mnav.is-open{ clip-path:circle(150% at var(--sm-mnav-x) var(--sm-mnav-y)); transition-duration:var(--sm-mnav-open); }
@supports not (clip-path:circle(1px at 1px 1px)){
  .sm-mnav{ clip-path:none; opacity:0; transform:scale(.985); transform-origin:var(--sm-mnav-x) var(--sm-mnav-y);
    transition:opacity var(--sm-mnav-close) var(--sm-mnav-ease), transform var(--sm-mnav-close) var(--sm-mnav-ease); }
  .sm-mnav.is-open{ opacity:1; transform:none; }
}
/* Warmes Farbklima: helle CI-Basis + große, weiche Lichtflächen aus Orange/Gold/Braun */
.sm-mnav__bg{ position:absolute; inset:0; pointer-events:none; background:
  radial-gradient(120% 85% at 100% 0%, rgba(210,85,34,.17) 0%, rgba(210,85,34,0) 60%),
  radial-gradient(95% 70% at 0% 100%, rgba(223,152,39,.15) 0%, rgba(223,152,39,0) 62%),
  radial-gradient(70% 45% at 55% 55%, rgba(90,53,37,.06) 0%, rgba(90,53,37,0) 70%),
  linear-gradient(180deg,#FDFDFD 0%,#F7F3F1 100%); }
/* Bildmarke als stilles Hintergrundelement */
.sm-mnav__art{ position:absolute; right:-16%; bottom:-4%; width:min(74vw,340px); aspect-ratio:486/761; opacity:.07; filter:blur(.5px); pointer-events:none;
  transform:rotate(-2.5deg) scale(.96); transform-origin:60% 60%;
  transition:transform 950ms var(--sm-mnav-ease); }
.sm-mnav.is-open .sm-mnav__art{ transform:rotate(0deg) scale(1); }
.sm-mnav__art svg{ display:block; width:100%; height:100%; }

/* Layout */
.sm-mnav__inner{ position:relative; display:flex; flex-direction:column; height:100%; overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding:calc(env(safe-area-inset-top,0px) + 12px) max(22px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 22px) max(22px,env(safe-area-inset-left,0px)); }
.sm-mnav__top{ display:flex; align-items:center; min-height:64px; }
.sm-mnav__logo{ display:inline-block; line-height:0; border-radius:8px; }
.sm-mnav__logo:focus-visible{ outline:2px solid #D25522; outline-offset:4px; }
.sm-mnav__logo img{ height:40px; width:auto; display:block; }
.sm-mnav button.sm-mnav__close{ position:absolute !important; left:calc(var(--sm-mnav-x) - 24px); top:calc(var(--sm-mnav-y) - 24px); z-index:2; }
.sm-mnav__sr{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* Navigation */
.sm-mnav__nav{ flex:1 1 auto; display:flex; align-items:center; padding:20px 0 16px; }
.sm-mnav__list{ list-style:none; margin:0; padding:0; width:100%; }
.sm-mnav .sm-mnav__list a{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:56px; padding:4px 4px; border-radius:8px;
  text-decoration:none; color:#5A3525; font-size:clamp(26px,8.6vw,36px); font-weight:600; line-height:1.25; letter-spacing:-.012em;
  -webkit-tap-highlight-color:transparent; transition:color .25s var(--sm-mnav-ease); }
.sm-mnav__list a:focus-visible{ outline:2px solid #D25522; outline-offset:2px; }
.sm-mnav__txt{ display:inline-flex; align-items:center; min-width:0; overflow-wrap:anywhere; }
.sm-mnav__arrow{ flex:0 0 auto; width:22px; height:22px; color:#D25522; opacity:.55;
  transition:transform .3s var(--sm-mnav-ease), opacity .3s; }
.sm-mnav__arrow svg{ display:block; width:100%; height:100%; }
.sm-mnav__list a:hover, .sm-mnav__list a:active{ color:#A63E15; }
.sm-mnav__list a:hover .sm-mnav__arrow, .sm-mnav__list a:active .sm-mnav__arrow{ transform:translateX(4px); opacity:1; }
.sm-mnav__list a[aria-current="page"]{ color:#A63E15; }
.sm-mnav__list a[aria-current="page"] .sm-mnav__txt::before{ content:""; width:9px; height:9px; border-radius:50%; margin-right:14px; flex:0 0 auto;
  background:linear-gradient(135deg,#DF9827,#D25522); box-shadow:0 0 0 4px rgba(223,152,39,.14); }

/* Unterer Bereich */
.sm-mnav__bottom{ flex:0 0 auto; }
.sm-mnav__rule{ border:0; height:1px; margin:0 0 16px; background:linear-gradient(90deg,rgba(90,53,37,.2),rgba(90,53,37,0)); }
.sm-mnav .sm-mnav__tel{ display:flex; align-items:center; min-height:44px; margin-bottom:10px; font-size:20px; font-weight:700; color:#5A3525; text-decoration:none; letter-spacing:.01em; }
.sm-mnav__tel:hover{ color:#A63E15; }
.sm-mnav .sm-mnav__cta, .sm-mnav .sm-mnav__cta:visited{ display:flex; align-items:center; justify-content:center; min-height:56px; border-radius:12px; background:#D25522; color:#FFFFFF;
  font-size:19px; font-weight:700; text-decoration:none; color:#FFFFFF !important; box-shadow:0 12px 26px -14px rgba(210,85,34,.6);
  transition:background .2s, transform .2s var(--sm-mnav-ease); }
.sm-mnav .sm-mnav__cta:hover{ background:#C24A1C; }
.sm-mnav__cta:active{ transform:scale(.985); }
.sm-mnav__cta:focus-visible, .sm-mnav__tel:focus-visible{ outline:2px solid #5A3525; outline-offset:3px; }
.sm-mnav__loc{ margin:14px 0 0; font-size:13px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:#8A7268; }

/* Ruhiges Auftauchen: Reihenfolge Logo → Menüpunkte → unten */
.sm-mnav__top, .sm-mnav__list > li, .sm-mnav__bottom{ opacity:0; transform:translateY(20px);
  transition:opacity 200ms var(--sm-mnav-ease), transform 200ms var(--sm-mnav-ease); }
.sm-mnav.is-open .sm-mnav__top, .sm-mnav.is-open .sm-mnav__list > li, .sm-mnav.is-open .sm-mnav__bottom{ opacity:1; transform:none;
  transition-duration:500ms; transition-delay:calc(140ms + var(--i,0) * 75ms); }

/* QA-Hook: Endzustand ohne Transition */
.sm-mnav--posed, .sm-mnav--posed *{ transition:none !important; }

/* Scroll-Sperre ohne Layout-Sprung (Position wird per JS gemerkt) */
body.sm-mnav-lock{ position:fixed; left:0; right:0; width:100%; overflow:hidden; }

@media (prefers-reduced-motion:reduce){
  .sm-mnav, .sm-mnav.is-open{ clip-path:none; transform:none; opacity:0; transition:opacity 160ms linear; }
  .sm-mnav.is-open{ opacity:1; }
  .sm-mnav__top, .sm-mnav__list > li, .sm-mnav__bottom{ transform:none; transition:opacity 160ms linear !important; transition-delay:0ms !important; }
  .sm-mnav__art{ transform:none; transition:none; }
  .sm-burger__l, .sm-mnav__arrow{ transition:none; }
}