/* ══════════════ CODION · gemeinsame Bausteine ══════════════
   Kopfzeile mit Leistungsmenü, Handy-Menü, Fußzeile und reduzierte
   Bewegung. Alles Seitenspezifische bleibt in der jeweiligen Seite.
   Liegt bewusst nicht unter /assets: dort gilt "immutable", Änderungen
   kämen sonst bei wiederkehrenden Besuchern nie an. */

/* ── Kopfzeile ── */
.cdn-hd-act{display:flex;align-items:center;gap:10px;flex-shrink:0}
/* Schmale Schirme: Logo, Knopf und Menü müssen in eine Zeile passen
   (375 px: 140 + 112 + 44 px plus Abstände) */
@media(max-width:520px){
  header>div{gap:12px!important}
  .cdn-hd-act{gap:8px}
  .cdn-hd-cta{height:40px!important;padding:0 14px!important;font-size:13.5px!important;gap:6px!important}
  .cdn-hd-cta svg{display:none}
  header img{height:19px!important}
  .cdn-cta-lang{display:none}
}
@media(max-width:359px){.cdn-hd-cta{display:none!important}}

/* ── Leistungsmenü (ab 921 px) ── */
.cdn-nav>a,.cdn-dd-btn{transition:color .2s}
.cdn-nav>a:hover,.cdn-dd-btn:hover,.cdn-dd-btn[aria-expanded="true"]{color:#F3F5F7}
.cdn-nav [aria-current="page"],.cdn-dd-btn.cdn-akt{color:#F3F5F7;position:relative}
.cdn-nav>a[aria-current="page"]::after,.cdn-dd-btn.cdn-akt::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:999px;background:#EE6C4D}
.cdn-dd-btn.cdn-akt::after{right:20px}
.cdn-dd{position:relative}
.cdn-dd-btn{display:inline-flex;align-items:center;gap:6px;margin:0;padding:6px 0;border:0;background:none;font:inherit;color:inherit;cursor:pointer;border-radius:6px}
.cdn-dd-btn svg{transition:transform .2s}
.cdn-dd-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.cdn-dd-panel{position:absolute;top:calc(100% + 14px);left:-22px;z-index:130;display:grid;grid-template-columns:1fr 1fr;gap:4px 14px;
  width:min(600px,calc(100vw - 48px));padding:16px;border-radius:18px;background:#10151B;border:1px solid rgba(255,255,255,.09);
  box-shadow:0 34px 70px -26px rgba(0,0,0,.9);white-space:normal;opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s}
/* Brücke über den Abstand, damit das Menü beim Hinüberfahren offen bleibt */
.cdn-dd-panel::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.cdn-dd[data-open] .cdn-dd-panel{opacity:1;visibility:visible;transform:none;transition:opacity .18s ease,transform .18s ease}
@media(hover:hover) and (pointer:fine){
  .cdn-dd:not([data-zu]):hover .cdn-dd-panel{opacity:1;visibility:visible;transform:none;transition:opacity .18s ease,transform .18s ease}
}
.cdn-dd-kat{display:block;padding:6px 12px 8px;font-size:10.5px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:rgba(243,245,247,.42)}
.cdn-dd-panel a{display:block;padding:10px 12px;border-radius:12px;transition:background .2s}
.cdn-dd-panel a b{display:block;font-size:14.5px;font-weight:600;color:#F3F5F7;line-height:1.3}
.cdn-dd-panel a span{display:block;margin-top:2px;font-size:13px;font-weight:400;line-height:1.4;color:rgba(243,245,247,.55)}
.cdn-dd-panel a:hover,.cdn-dd-panel a:focus-visible{background:rgba(255,255,255,.05)}
.cdn-dd-panel a[aria-current="page"]{background:rgba(238,108,77,.08)}
.cdn-dd-panel a[aria-current="page"] b{color:#EE6C4D}
.cdn-dd-alle{grid-column:1/-1;margin-top:6px;padding-top:10px;border-top:1px solid rgba(255,255,255,.07)}
.cdn-dd-alle a{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:rgba(243,245,247,.72)}

/* ── Handy-Menü (bis 920 px) ── */
.cdn-mnav{display:none}
@media(max-width:920px){.cdn-mnav{display:block}}
.cdn-mnav>summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#F3F5F7;cursor:pointer}
.cdn-mnav>summary::-webkit-details-marker{display:none}
.cdn-mnav .cdn-ico-zu{display:none}
.cdn-mnav[open] .cdn-ico-auf{display:none}
.cdn-mnav[open] .cdn-ico-zu{display:block}
.cdn-mnav-panel{position:absolute;left:0;right:0;top:100%;z-index:130;max-height:calc(100dvh - 74px);overflow-y:auto;overscroll-behavior:contain;
  padding:10px clamp(18px,4vw,36px) 26px;background:#0A0D11;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 50px -30px rgba(0,0,0,.9)}
.cdn-mnav-kat{display:block;margin:16px 0 4px;font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:#EE6C4D}
.cdn-mnav-panel a{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 4px;border-bottom:1px solid rgba(255,255,255,.05);
  font-size:16.5px;font-weight:500;color:#F3F5F7}
.cdn-mnav-panel a small{font-size:12.5px;font-weight:400;color:rgba(243,245,247,.5);text-align:right}
.cdn-mnav-panel a[aria-current="page"]{color:#EE6C4D}
.cdn-mnav-panel .cdn-mnav-cta{margin-top:18px;justify-content:center;align-items:center;height:50px;border:0;border-radius:999px;background:#EE6C4D;color:#fff;font-weight:600}
.cdn-mnav-kontakt{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.cdn-mnav-panel .cdn-mnav-kontakt a{flex:1 1 140px;justify-content:center;align-items:center;height:46px;padding:0 14px;border:1px solid rgba(255,255,255,.12);
  border-radius:999px;font-size:14.5px;font-weight:600}

/* ── Sichtbarer Fokus für Tastatur ── */
.cdn-dd-btn:focus-visible,.cdn-mnav>summary:focus-visible,.cdn-nav>a:focus-visible,.cdn-dd-panel a:focus-visible,
.cdn-ft a:focus-visible,.cdn-mnav-panel a:focus-visible{outline:2px solid #EE6C4D;outline-offset:3px}

/* ── Fußzeile ── */
.cdn-ft{background:#050608;border-top:1px solid rgba(255,255,255,.06)}
.cdn-ft-in{max-width:1240px;margin:0 auto;padding:clamp(52px,7vw,80px) clamp(18px,4vw,36px) 28px}
.cdn-ft-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:40px 30px}
.cdn-ft-marke{max-width:320px}
.cdn-ft-marke p{margin:16px 0 0;font-size:14px;line-height:1.65;color:rgba(243,245,247,.55)}
.cdn-ft-kontakt{margin-top:16px;display:flex;flex-direction:column;gap:10px}
.cdn-ft-kontakt a{display:inline-flex;align-items:center;gap:10px;font-size:14px;color:rgba(243,245,247,.72);transition:color .2s}
.cdn-ft-kontakt a:hover{color:#F3F5F7}
.cdn-ft ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;font-size:14px;color:rgba(243,245,247,.68)}
.cdn-ft ul a{transition:color .2s}
.cdn-ft ul a:hover{color:#EE6C4D}
.cdn-ft-sozial{margin-top:22px;display:flex;gap:10px}
.cdn-ft-sozial a{width:40px;height:40px;border-radius:11px;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;
  color:rgba(243,245,247,.65);transition:color .2s,border-color .2s}
.cdn-ft-sozial a:hover{color:#EE6C4D;border-color:rgba(238,108,77,.4)}
.cdn-ft-unten{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.06);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;
  font-size:13px;line-height:1.6;color:rgba(243,245,247,.45)}

/* ── Hinweis an Beispielansichten (keine echten Zahlen) ── */
.cdn-bsp{display:inline-block;padding:3px 9px;border-radius:999px;font-size:10.5px;font-weight:600;letter-spacing:.06em;
  color:rgba(243,245,247,.6);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}

/* ── Reduzierte Bewegung ──
   Wer im System weniger Bewegung eingestellt hat, bekommt Inhalte sofort
   und ohne Laufbänder, Schwebe- oder Einblendeffekte. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
}

/* Nachträge: aktive Bereiche, Pfeil bei Hover, schmale Desktops */
.cdn-nav>a.cdn-akt{color:#F3F5F7;position:relative}
.cdn-nav>a.cdn-akt::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:999px;background:#EE6C4D}
@media(hover:hover) and (pointer:fine){.cdn-dd:not([data-zu]):hover .cdn-dd-btn svg{transform:rotate(180deg)}}
@media(max-width:1100px){.cdn-nav-opt{display:none}}
.cdn-ft-h{margin:0 0 16px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(243,245,247,.42)}
.cdn-ft-sitz{margin:16px 0 0;font-size:13px;line-height:1.6;color:rgba(243,245,247,.45)}