/*
Theme Name: Siegbert Mattheis – Navigation oben
Description: Eigenes Child-Theme mit oberer Navigation, angelehnt an die gelieferte Agentur-Navigation.
Author: Siegbert Mattheis
Template: twentytwelve
Version: 1.0.0
*/
body {background:#fff; color:#484847; font-family:Arial,sans-serif;}
body .site {margin:0; padding:0; max-width:none; box-shadow:none;}
#main.wrapper {max-width:1200px; margin:0 auto; padding:40px 24px; box-sizing:border-box;}
body.page .site-content {float:none; width:100%;}
body.page #secondary {display:none;}
#colophon {max-width:1152px; margin:0 auto; padding:24px;}
#masthead.sm-header {position:sticky; top:0; z-index:999; padding:0; background:#000; color:#fff; box-shadow:0 2px 6px #0003;}
.admin-bar #masthead.sm-header {top:32px;}
.sm-header-inner {display:flex; align-items:center; justify-content:space-between; gap:32px; padding:24px 40px; transition:padding .2s;}
.sm-header.is-compact .sm-header-inner {padding-top:12px; padding-bottom:12px;}
.sm-brand {flex:0 0 240px;}
.sm-brand a {color:#fff; text-decoration:none; font-size:24px;}
.sm-brand img {display:block; max-width:100%; width:auto; max-height:95px; height:auto; background:#fff; padding:8px; box-sizing:border-box;}
#site-navigation.sm-navigation {margin:0; text-align:left;}
#site-navigation .sm-menu {display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px 24px; margin:0; padding:0; border:0; list-style:none;}
#site-navigation .sm-menu li {position:relative; margin:0; list-style:none; font-size:16px; line-height:1.4; white-space:normal;}
#site-navigation .sm-menu a {display:inline-block; padding:12px 0; color:#fff; text-decoration:none; text-transform:none; line-height:1.4;}
#site-navigation .sm-menu a:hover, #site-navigation .sm-menu .current-menu-item>a {color:#5fb6b6;}
#site-navigation a:focus-visible, #site-navigation button:focus-visible {outline:2px solid #5fb6b6; outline-offset:4px;}
#site-navigation .sub-menu {display:none; position:absolute; top:100%; left:0; min-width:220px; margin:0; padding:12px 20px; background:#111; z-index:10;}
#site-navigation .sub-menu li {display:block; width:auto;}
#site-navigation .sub-menu a {width:auto; background:transparent; border:0; font-size:16px; padding:10px 0;}
#site-navigation .sub-menu .sub-menu {top:0; left:100%;}
#site-navigation li:hover>.sub-menu, #site-navigation li:focus-within>.sub-menu, #site-navigation li.sm-open>.sub-menu {display:block;}
#site-navigation .sm-menu>li:last-child>.sub-menu {left:auto; right:0;}
.sm-menu-toggle, .sm-sub-toggle {display:none;}
.sm-sub-toggle {margin-left:8px; padding:4px 8px; background:transparent; color:white; border:1px solid #777; box-shadow:none; border-radius:0;}
@media(max-width:1100px) {
.sm-header-inner {padding:16px 24px; flex-wrap:wrap; gap:12px;}
.sm-brand {flex:1; max-width:240px;}
#site-navigation.sm-navigation {margin-left:auto;}
.sm-menu-toggle {display:block; background:transparent; color:white; border:1px solid #aaa; border-radius:0; box-shadow:none; padding:12px; font-size:16px;}
#site-navigation .sm-menu {display:block; position:absolute; top:100%; left:0; right:0; background:#000; padding:16px 24px; max-height:70vh; overflow-y:auto;}
.sm-js #site-navigation .sm-menu {display:none;}
.sm-js #site-navigation.sm-expanded .sm-menu {display:block;}
#site-navigation .sm-menu li {display:block;}
#site-navigation .sub-menu, #site-navigation .sub-menu .sub-menu {position:static; min-width:0; padding:0 0 0 20px; background:#111;}
#site-navigation li:hover>.sub-menu, #site-navigation li:focus-within>.sub-menu {display:none;}
#site-navigation li.sm-open>.sub-menu {display:block;}
.sm-sub-toggle {display:inline-block;}
}
@media(max-width:782px) {.admin-bar #masthead.sm-header {top:46px;}}
@media(max-width:600px) {.admin-bar #masthead.sm-header {top:0;}}
@media(prefers-reduced-motion:reduce) {.sm-header-inner {transition:none;}}