:root{
      --sht-blue:#014672;
      --sht-blue-2:#036ea5;
      --sht-orange:#ff8200;

      --content-max: clamp(1200px, 96vw, 1840px);
      --side-pad: max(1rem, calc((100vw - var(--content-max)) / 2));

      --banner-h: 2.5rem;
      --header-h: 4.25rem;
      --header-border: .25rem;

      --fs-nav: clamp(0.86rem, .86vw, 1.05rem);
      --fs-ticker: clamp(0.85rem, 1.2vw, 1.0625rem);
    }

    @media (max-width: 768px){
      :root{ --banner-h: 2rem; --header-h: 3.5rem; --content-max: 100%; }
    }
    @media (min-width:1600px){
      :root{ --header-h: 4.5rem; --fs-nav: clamp(1rem, .9vw, 1.2rem); }
    }

    *{margin:0;padding:0;box-sizing:border-box;font-family:sans-serif;}
    html{scroll-behavior:smooth;}
    html, body{max-width:100%; overflow-x:hidden;} /* verhindert horizontales Scrollen */
    body{padding-top: 0;}

    .blue_line_top{
      height:var(--banner-h);
      position:fixed;top:0;left:0;right:0;z-index:1000;
      background:linear-gradient(135deg, var(--sht-blue), var(--sht-blue-2));
    }
    .banner{
      height:100%;display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden;
      font-size:var(--fs-ticker);padding-inline: var(--side-pad);
    }
    .ticker{display:inline-block;white-space:nowrap;animation:scroll-left 20s linear infinite;max-width: var(--content-max);will-change:transform;}
    .ticker span,.ticker a{display:inline-block;margin:0 1em;text-decoration:none;color:inherit;}
    .ticker a:hover{text-decoration:underline;}
    .separator{color:rgba(255,255,255,.5);}
    @keyframes scroll-left{from{transform:translateX(100%);}to{transform:translateX(-100%);} }

    .main-header{
      position:fixed;top:var(--banner-h);left:0;right:0;z-index:1001;
      display:grid;grid-template-columns:auto minmax(0, 1fr) auto;align-items:center;background:#fff;
      padding-inline:var(--side-pad);column-gap:clamp(.5rem, 1vw, 1rem);
      border-bottom: var(--header-border) solid var(--sht-orange);height:var(--header-h);
    }
    .logo img{
      height:clamp(2.25rem, 4vw, 3.2rem);
      display:block;
    }

    .main-nav{ justify-self:stretch; min-width:0; width:100%; font-size:var(--fs-nav); max-width:none; }
    .main-nav > ul{
      list-style:none;display:flex;justify-content:center;gap:clamp(.45rem,.75vw,.9rem);align-items:center;
      margin:0;
    }
    .main-nav > ul > li{ position:relative; white-space:nowrap; }
    .main-nav a{
      color:var(--sht-blue);text-decoration:none;font-weight:700;
      padding:.35rem .25rem;position:relative;overflow:hidden;transition:color .3s ease;
    }
    .main-nav a::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:2px;background:var(--sht-blue);transition:width .3s ease,left .3s ease;}
    .main-nav a:hover::after{width:100%;left:0;}

    .lang-switcher{ justify-self:end; display:flex; flex-shrink:0; gap:.4rem; }
    .lang-btn{
      padding:.375rem .875rem;border:2px solid var(--sht-blue);border-radius:999px;font-weight:600;color:var(--sht-blue);
      background:#fff;text-decoration:none;transition:all .3s ease;font-size: clamp(.9rem, .9vw, 1.05rem);
    }
    .lang-btn:hover{border-color:var(--sht-blue-2);background:#f0f8ff;}
    .lang-btn.active{background:var(--sht-blue);color:#fff;}

    /* Submenü: zentriert, nicht bildschirmbreit, smooth (nur Desktop relevant) */
    .main-nav > ul > li > .dropdown.submenu{
      position: fixed;
      top: calc(var(--banner-h) + var(--header-h) + var(--header-border));
      left: 50%;
      transform: translate(-50%, -8px);
      width: clamp(720px, 70vw, 1100px);
      margin: 0; padding: .5rem 0; background: #fff;
      box-shadow: 0 18px 40px rgba(0,0,0,.1), 0 6px 16px rgba(0,0,0,.06);
      border-radius: 0 0 .6rem .6rem; z-index: 1003;

      display: block; list-style: none;
      max-height: 0; opacity: 0; overflow: hidden; pointer-events: none; visibility: hidden;

      transition:
        max-height .45s cubic-bezier(.17,.67,.3,1),
        opacity .28s ease,
        transform .35s cubic-bezier(.17,.67,.3,1),
        visibility 0s linear .28s;
    }
    .main-nav > ul > li > .dropdown.submenu::before{
      content:""; position:absolute; left:0; right:0; top:-48px; height:48px; background:transparent; pointer-events:auto;
    }
    .main-nav > ul > li > .dropdown.submenu > li{display:block;border-bottom:1px solid #eee;}
    .main-nav > ul > li > .dropdown.submenu > li:last-child{border-bottom:0;}
    .main-nav > ul > li > .dropdown.submenu a{display:block;padding:.75rem .9rem;color:var(--sht-blue);font-weight:700;text-decoration:none;}
    .main-nav > ul > li > .dropdown.submenu a:hover{background:#f7fbff;text-decoration:underline;}

    .main-nav > ul > li.open > .dropdown.submenu,
    .main-nav > ul > li > .dropdown.submenu:hover{
      max-height:640px; opacity:1; transform:translate(-50%,0); pointer-events:auto; visibility:visible;
      transition:
        max-height .55s cubic-bezier(.17,.67,.3,1),
        opacity .26s ease,
        transform .35s cubic-bezier(.17,.67,.3,1),
        visibility 0s;
    }

    .main-nav .has-dropdown-right > .dropdown-right{
      position: static !important; display: block !important; margin: 0 0 0 1rem; padding: 0; border: 0; box-shadow: none;
    }
    .main-nav .has-dropdown-right > .dropdown-right > li > a{ font-weight:600; padding:.55rem 0; }

    /* Brücke nur Desktop; 100vw -> links/rechts statt Breite (kein Overflow) */
    .nav-open .main-header::after{
      content:""; position: fixed; left:0; right:0; top: calc(var(--banner-h) + var(--header-h));
      height: calc(var(--header-border) + 48px); pointer-events:auto; background:transparent; z-index:1002;
    }

    /* ======= Mobile/Tablet ======= */
    .hamburger{ display:none; }
    @media (max-width:1600px){
      /* Brücke aus auf Mobile */
      .nav-open .main-header::after{ content:none; pointer-events:none; }

      .hamburger{
        display:flex; align-items:center; justify-content:center;
        margin-left:auto; font-size:1.6rem; background:none; border:none; line-height:1;
        position:relative; z-index:1101; -webkit-tap-highlight-color:transparent;
        min-width:44px; min-height:44px; cursor:pointer;
        padding:0; touch-action:manipulation;
      }

      .main-nav{
        position:absolute; top:100%; left:0; right:0;
        background:#fff; display:none; flex-direction:column; padding:.5rem 0;
        box-shadow:0 2px 8px rgba(0,0,0,.1); max-height:80vh; overflow-y:auto; z-index:1100;
        -webkit-overflow-scrolling: touch;
      }
      .main-nav.active{display:flex;}
      .main-nav > ul{flex-direction:column; gap:0; padding-left:0; width:100%;}
      .main-nav > ul > li{border-bottom:1px solid #ddd; width:100%;}
      .main-nav a{display:block; padding:.75rem 1.25rem; font-size:1rem;}
      .submenu{background:#f8f9fa; padding-left:0; box-shadow:none;}
      .main-nav > ul > li > .dropdown.submenu{
        position: static !important; width:100% !important; transform:none !important; max-height:none !important;
        opacity:1 !important; pointer-events:auto !important; visibility:visible !important; border-radius:0 !important; box-shadow:none !important;
      }
    }

    @media (max-width:576px){
      .banner{padding-inline:.5rem;}
      .logo img{height: clamp(2rem, 8vw, 2.5rem);}
      .lang-switcher{gap:.4rem;}
      .lang-btn{padding:.25rem .625rem; font-size:.85rem; border-width:1.5px;}
    }

    @media (prefers-reduced-motion: reduce){
      .main-nav > ul > li > .dropdown.submenu{
        transition:none !important; transform:none !important; opacity:1 !important; max-height:none !important;
      }
    }