/* Mobile navigation, using the existing Kreativklinik typography and red. */
.mobile-menu-intro,.mobile-menu-footer{display:none}
@media(max-width:1100px){
 .site-header .menu-toggle{display:inline-flex;align-items:center;gap:13px;min-height:48px;padding:12px 16px;border:0;border-radius:14px;background:#151619;color:#fff;font-size:15px;font-weight:700;box-shadow:0 4px 0 #ed1928;position:relative;z-index:3;transition:background .2s,box-shadow .2s}
 .menu-toggle-icon{position:relative;width:22px;height:18px;display:block}
 .menu-toggle-icon i{position:absolute;left:0;top:4px;width:22px;height:2px;background:#fff;border-radius:2px;transition:transform .3s,top .3s,width .3s}
 .menu-toggle-icon i:last-child{top:12px;width:15px;left:auto;right:0;background:#ff5b68}
 .menu-toggle[aria-expanded=true] .menu-toggle-icon i{top:8px;transform:rotate(45deg);width:22px;background:#fff}
 .menu-toggle[aria-expanded=true] .menu-toggle-icon i:last-child{transform:rotate(-45deg)}
 .site-header #navigation{position:fixed;inset:0;top:0;display:flex;flex-direction:column;align-items:stretch;gap:0;height:100dvh;max-height:none;box-sizing:border-box;padding:110px max(24px,calc((100vw - 700px)/2)) 32px;margin:0;border:0;box-shadow:none;background:#c80c25;color:#fff;z-index:1;overflow-y:auto;overscroll-behavior:contain;visibility:hidden;pointer-events:none;clip-path:circle(0 at calc(100% - 46px) 32px);transition:clip-path .55s cubic-bezier(.76,0,.24,1),visibility 0s .55s;isolation:isolate}
 .site-header #navigation::before{content:"";position:fixed;width:75vw;height:75vw;min-width:320px;min-height:320px;right:-35vw;bottom:-10vw;border:1px solid #ffffff20;border-radius:50%;box-shadow:0 0 0 65px #ffffff06,0 0 0 130px #ffffff06;z-index:-1;pointer-events:none}
 .site-header #navigation.is-open{visibility:visible;pointer-events:auto;clip-path:circle(160vmax at calc(100% - 46px) 32px);transition:clip-path .55s cubic-bezier(.76,0,.24,1),visibility 0s}
 .site-header #navigation .mobile-menu-intro{display:block;margin:0 0 26px;font-size:clamp(30px,6vw,50px);font-weight:800;line-height:1.04;letter-spacing:-.055em;color:#fff9}
 .site-header #navigation>a:not(.button){display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid #ffffff35;color:#fff;font-family:var(--font-heading);font-weight:750;font-size:clamp(24px,5.7vw,40px);letter-spacing:-.045em;line-height:1.2;text-decoration:none;transition:opacity .35s,transform .35s,color .2s;opacity:0;transform:translateY(18px)}
 .site-header #navigation>a:not(.button)::after{content:"↗";font-size:23px;font-weight:400;color:#ffb4bd;transition:transform .2s}
 .site-header #navigation>a[aria-current=page]{color:#fff0bd}
 .site-header #navigation>a:hover::after{transform:translate(3px,-3px)}
 .site-header #navigation>a:focus-visible{outline:2px solid #fff;outline-offset:5px}
 .site-header #navigation.is-open>a{opacity:1;transform:translateY(0);transition-delay:calc(.12s + var(--menu-index,0)*.045s)}
 .site-header #navigation>.button{margin:26px 0 0;padding:18px 22px;display:flex;justify-content:space-between;align-items:center;background:#fff;color:#18191c;border-radius:12px;border:0;font-size:22px;font-weight:800;line-height:1.2;opacity:0;transform:translateY(18px);transition:opacity .35s,transform .35s}
 .site-header #navigation>.button::after{content:"Legen wir los ↗";font-size:13px;font-weight:600;letter-spacing:0}
 .site-header #navigation .mobile-menu-footer{display:block;margin:26px 0 0;font-size:15px;color:#fff;font-weight:650;line-height:1.5}
 .mobile-menu-footer span{display:block;font-size:12px;font-weight:400;color:#ffced4;margin-top:4px}
 body.mobile-menu-open{overflow:hidden}
 body.mobile-menu-open .site-header{transform:none!important;transition:none;background:transparent}
 body.mobile-menu-open .site-header::before{background:transparent;box-shadow:none;border:0}
 body.mobile-menu-open .site-header .brand{position:relative;z-index:3;color:#fff}
 body.mobile-menu-open .brand-name,body.mobile-menu-open .brand-person,body.mobile-menu-open .brand .red{color:#fff}
 body.mobile-menu-open .brand img{filter:brightness(0) invert(1)}
 body.mobile-menu-open .site-header .menu-toggle{background:#151619;box-shadow:none}
 body.mobile-menu-open .floating-consultation,body.mobile-menu-open .cookie-joke,body.mobile-menu-open .accessibility-launcher,body.mobile-menu-open .back-to-top{visibility:hidden}
 body.admin-bar .site-header #navigation{padding-top:140px}
}
@media(max-width:360px){.site-header .menu-toggle{padding:11px;gap:8px;font-size:13px}.site-header #navigation{padding-inline:20px}.site-header #navigation>a:not(.button){font-size:25px}.site-header #navigation>.button::after{font-size:11px}}
@media(prefers-reduced-motion:reduce){.site-header #navigation,.site-header #navigation>a,.menu-toggle-icon i{transition:none!important}.site-header #navigation>a{transform:none!important}}
.display-reduce-motion .site-header #navigation,.display-reduce-motion .site-header #navigation>a,.display-reduce-motion .menu-toggle-icon i{transition:none!important}

@media(max-width:360px){.menu-toggle-label{display:none}.site-header .menu-toggle{gap:0;min-width:46px;justify-content:center;flex-shrink:0}.site-header .brand-name{font-size:20px}}

@media(max-width:1100px){body.mobile-menu-open .site-header::after{content:"";position:absolute;inset:0 calc((100% - 100vw)/2);background:#c80c25;z-index:2;pointer-events:none}}

/* Keep the decorative fixed circle inside the menu when the sticky header moves. */
@media(max-width:1100px){.site-header #navigation{contain:paint;overflow-x:hidden}}
