/* COE Ingenieure · Website 2.0 · Kopf, Navigation, Mobilmenü, Fuß (alle Seiten, eine Quelle)
   Markup: tools/chrome.py. Eigene Variablen und Klassen mit Präfix c-, damit das alte CSS nicht greift. */
:root{--c-ink:#111318;--c-paper:#F4F0E8;--c-oxid:#C94A2A;--c-rauch:#B4B4AE;--c-line:rgba(17,19,24,.16);--c-line-d:rgba(244,240,232,.2);--c-pad:clamp(16px,4vw,64px);--c-maxw:1520px;--c-nav-h:72px;--c-sans:"DM Sans",system-ui,sans-serif;--c-mono:"JetBrains Mono",ui-monospace,monospace}
@media (max-width:980px){:root{--c-nav-h:64px}}
.c-wrap{max-width:var(--c-maxw);margin:0 auto;padding:0 var(--c-pad)}
.c-skip{position:absolute;left:var(--c-pad);top:-80px;z-index:200;background:var(--c-ink);color:var(--c-paper);padding:12px 18px;font:500 16px/1.2 var(--c-sans);min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.c-skip:focus{top:12px;color:var(--c-paper);outline:2px solid var(--c-paper);outline-offset:0;box-shadow:0 0 0 4px var(--c-ink)}

/* Kopf */
.c-nav{position:sticky;top:0;z-index:100;background:rgba(244,240,232,.96);border-bottom:1px solid var(--c-line);font-family:var(--c-sans);color:var(--c-ink)}
.c-nav a{color:var(--c-ink);text-decoration:none}
.c-nav-in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--c-nav-h)}
.c-logo{display:inline-flex;align-items:center;min-height:44px}
.c-logo img{display:block;height:32px;width:auto}
.c-nav-l{display:flex;align-items:center;gap:clamp(12px,1.9vw,30px)}
.c-nav-l a{font-family:var(--c-mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
.c-nav-l a:hover,.c-nav-l a[aria-current]{text-decoration:underline;text-decoration-color:var(--c-oxid);text-decoration-thickness:2px;text-underline-offset:5px}
.c-nav-l a.c-cta{border-bottom:2px solid var(--c-oxid);padding-top:2px}
.c-nav-l a.c-cta:hover{text-decoration:none}
.c-mctl{display:none;align-items:center;gap:4px}
.c-icb{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;padding:0;cursor:pointer;color:var(--c-ink)}
.c-icb svg{display:block}
.c-icb .i-x{display:none}
.c-icb[aria-expanded="true"] .i-x{display:block}
.c-icb[aria-expanded="true"] .i-b{display:none}
.c-mnav{position:fixed;inset:var(--c-nav-h) 0 0;z-index:110;background:var(--c-ink);color:var(--c-paper);padding:12px var(--c-pad) calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;overflow-y:auto}
.c-mnav[hidden]{display:none}
.c-mnav a{color:var(--c-paper)}
.c-mnav a.c-ml{display:flex;align-items:center;justify-content:space-between;min-height:56px;border-bottom:1px solid var(--c-line-d);font-size:1.4rem;font-weight:500;letter-spacing:-.01em}
.c-mfoot{margin-top:auto;padding-top:24px;display:flex;flex-direction:column;gap:14px}
.c-tl{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:16px;font-weight:500;border-bottom:1px solid currentColor;align-self:flex-start}
.c-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:0 24px;font:500 16px/1.2 var(--c-sans);background:var(--c-paper);color:var(--c-ink)!important;border:1px solid var(--c-paper)}
.c-btn:hover{background:transparent;color:var(--c-paper)!important}
body.menu-open{overflow:hidden}
:focus-visible{outline:2px solid var(--c-ink);outline-offset:3px}
.c-mnav :focus-visible,.c-footwrap :focus-visible,.c-foot :focus-visible{outline-color:var(--c-paper)}


/* Leistungen-Menü: Desktop aufklappbar bei Hover und Tastaturfokus, ohne Skript */
.c-dd{position:relative;display:inline-flex;align-items:center}
.c-ddp{position:absolute;top:100%;left:-24px;display:none;grid-template-columns:minmax(300px,1fr) minmax(240px,1fr);gap:0;background:var(--c-paper);border:1px solid var(--c-line);border-top:2px solid var(--c-oxid);box-shadow:0 18px 40px rgba(17,19,24,.12);z-index:120;min-width:620px}
.c-dd:hover .c-ddp,.c-dd:focus-within .c-ddp{display:grid}
.c-ddc{padding:18px 22px;display:flex;flex-direction:column}
.c-ddx{background:rgba(17,19,24,.04)}
.c-ddl{margin:0 0 8px;font-family:var(--c-mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#62626A}
.c-nav-l .c-ddp a{font-family:var(--c-sans);font-size:15px;font-weight:400;letter-spacing:0;text-transform:none;white-space:normal;min-height:40px}
.c-nav-l .c-ddp a.c-ddm{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:6px 0;min-height:52px;border-bottom:1px solid var(--c-line)}
.c-nav-l .c-ddp a.c-ddm b{font-weight:500;font-size:16px}
.c-nav-l .c-ddp a.c-ddm small{font-size:13px;color:#62626A}
.c-nav-l .c-ddp a.c-ddm[aria-current]{text-decoration:none;box-shadow:inset 3px 0 0 var(--c-oxid);padding-left:10px}
.c-nav-l .c-ddp a.c-ddm[aria-current]{text-decoration:none;box-shadow:inset 3px 0 0 var(--c-oxid);padding-left:10px}
.c-nav-l .c-ddp a.c-dda{margin-top:auto;padding-top:10px;font-weight:500}
/* Mobilmenü: Leistungen als aufklappbare Liste */
.c-msub summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;min-height:56px;border-bottom:1px solid var(--c-line-d);font-size:1.4rem;font-weight:500;letter-spacing:-.01em}
.c-msub summary::-webkit-details-marker{display:none}
.c-msub[open] summary span{transform:rotate(45deg)}
.c-msub summary span{display:inline-block;transition:transform .2s}
.c-msl{display:flex;flex-direction:column;padding:6px 0 10px;border-bottom:1px solid var(--c-line-d)}
.c-msl a{min-height:44px;display:flex;align-items:center;font-size:1.05rem;padding-left:14px;border-left:2px solid var(--c-oxid);margin:2px 0}

/* Fuß */
.c-foot{margin-top:clamp(44px,5vw,72px);padding-top:24px;border-top:1px solid var(--c-line-d);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 28px;font:400 14px/1.5 var(--c-sans);color:var(--c-rauch)}
.c-foot img{display:block;height:28px;width:auto}
.c-foot nav{display:flex;flex-wrap:wrap;gap:4px 20px}
.c-foot a{min-height:44px;display:inline-flex;align-items:center;color:var(--c-rauch);text-decoration:none}
.c-foot a:hover{color:var(--c-paper);text-decoration:underline;text-decoration-color:var(--c-oxid);text-decoration-thickness:2px;text-underline-offset:5px}
.c-footwrap{background:var(--c-ink);color:var(--c-paper);padding:clamp(32px,4vw,48px) 0 24px;font-family:var(--c-sans)}
.c-footwrap .c-foot{margin-top:20px}
.c-dc{display:flex;flex-wrap:wrap;gap:4px 28px;margin:0;font-size:15px}
.c-dc a{min-height:44px;display:inline-flex;align-items:center;color:var(--c-paper);text-decoration:none;border-bottom:1px solid var(--c-line-d)}
.c-dc a:hover{border-bottom-color:var(--c-oxid)}

@media (max-width:980px){
.c-nav-l{display:none}
.c-mctl{display:flex}
}

/* Altseiten: Kopf fest oben, die alten Abstände rechnen mit --nav-h */
body.legacy{--nav-h:72px}
body.legacy .c-nav{position:fixed;left:0;right:0;top:0}
@media (max-width:980px){body.legacy{--nav-h:64px}}
