*{box-sizing:border-box;margin:0;padding:0}
body{background:#0d0d0f;color:#e8e6e1;font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh;display:flex;flex-direction:column}
header{display:flex;align-items:center;gap:1.5rem;padding:1rem 1.5rem;border-bottom:1px solid #2a2a30;background:#131316}
.marke{color:#c8a24a;font-weight:700;letter-spacing:.22em;text-decoration:none;font-size:1.1rem}
nav{margin-left:auto;display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
nav a{color:#b8b5ae;text-decoration:none;font-size:.92rem}
nav a:hover{color:#c8a24a}
.wer{color:#6f6c66;font-size:.85rem}
.abmelden{background:none;border:1px solid #3a3a42;color:#b8b5ae;padding:.35rem .8rem;border-radius:6px;cursor:pointer;font-size:.85rem}
.abmelden:hover{border-color:#c8a24a;color:#c8a24a}
main{flex:1;padding:2.5rem 1.5rem;max-width:1100px;margin:0 auto;width:100%}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.1rem}
.kachel{position:relative;display:flex;flex-direction:column;gap:.35rem;padding:1.4rem;background:#17171b;border:1px solid #2a2a30;border-left:3px solid var(--akzent,#c8a24a);border-radius:10px;text-decoration:none;color:inherit;transition:.15s}
.kachel:hover{background:#1d1d22;border-color:#3d3d46;border-left-color:var(--akzent,#c8a24a);transform:translateY(-2px)}
.kachel .icon{font-size:1.6rem;line-height:1}
.kachel .name{font-weight:600;color:#f0eee9}
.kachel .besch{font-size:.83rem;color:#8a8780;line-height:1.35}
.kachel .sso{position:absolute;top:.8rem;right:.8rem;font-size:.62rem;letter-spacing:.1em;color:#c8a24a;border:1px solid #4a3f22;padding:.1rem .4rem;border-radius:4px}
.loginbox{max-width:370px;margin:3rem auto;background:#17171b;border:1px solid #2a2a30;border-radius:12px;padding:2rem}
.loginbox h1{color:#c8a24a;font-size:1.35rem;margin-bottom:1.4rem;letter-spacing:.05em}
label{display:block;margin-bottom:1rem;font-size:.85rem;color:#a5a29b}
input,select,textarea{width:100%;margin-top:.35rem;padding:.6rem .7rem;background:#0f0f12;border:1px solid #34343c;border-radius:7px;color:#e8e6e1;font-size:.95rem;font-family:inherit}
input:focus,select:focus,textarea:focus{outline:none;border-color:#c8a24a}
button[type=submit]{width:100%;padding:.7rem;background:#c8a24a;color:#12120f;border:none;border-radius:7px;font-weight:600;cursor:pointer;font-size:.95rem}
button[type=submit]:hover{background:#d8b45e}
.fehler{background:#3a1d1d;border:1px solid #5e2c2c;color:#f0b4b4;padding:.6rem .8rem;border-radius:7px;margin-bottom:1rem;font-size:.87rem}
.hinweis{background:#1d2c1d;border:1px solid #2f4a2f;color:#b4d8b4;padding:.6rem .8rem;border-radius:7px;margin-bottom:1rem;font-size:.87rem}
.leer{color:#6f6c66;text-align:center;padding:3rem 0}
h2{color:#c8a24a;font-size:1.1rem;margin:2rem 0 .9rem;font-weight:600}
h2:first-child{margin-top:0}
table{width:100%;border-collapse:collapse;font-size:.88rem}
th,td{text-align:left;padding:.55rem .6rem;border-bottom:1px solid #26262c}
th{color:#8a8780;font-weight:500;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase}
td a{color:#c8a24a;text-decoration:none}
.zeile{display:flex;gap:.8rem;flex-wrap:wrap;align-items:flex-end}
.zeile label{flex:1;min-width:150px}
.zeile button{width:auto;padding:.6rem 1.1rem}
footer{padding:1.5rem;text-align:center;color:#4f4d49;font-size:.78rem;border-top:1px solid #1e1e23}
.kachel.mit-logo{align-items:center;text-align:center;padding:1.1rem .9rem 1.3rem}
.kachel .logo{width:100%;max-width:175px;height:auto;object-fit:contain;margin-bottom:.55rem;filter:drop-shadow(0 6px 14px rgba(0,0,0,.55))}
.kachel.mit-logo .besch{text-align:center}
.hilfe{background:#15151a;border:1px solid #2a2a30;border-radius:10px;margin-bottom:1.6rem}
.hilfe summary{cursor:pointer;padding:.85rem 1.1rem;color:#c8a24a;font-weight:600;font-size:.92rem;list-style:none}
.hilfe summary::-webkit-details-marker{display:none}
.hilfe summary::before{content:"\25B8";display:inline-block;margin-right:.6rem;transition:transform .15s}
.hilfe[open] summary::before{transform:rotate(90deg)}
.hilfe-inhalt{padding:0 1.4rem 1.2rem;color:#a5a29b;font-size:.89rem;line-height:1.6}
.hilfe-inhalt p{margin:.6rem 0}
.hilfe-inhalt ul{margin:.7rem 0 .7rem 1.1rem}
.hilfe-inhalt li{margin:.45rem 0}
.hilfe-inhalt b{color:#d8d5ce;font-weight:600}
.verstanden{display:inline-block;margin-top:.5rem;padding:.45rem 1.1rem;background:#c8a24a;color:#12120f;border-radius:6px;text-decoration:none;font-weight:600;font-size:.85rem}
.kachel.inaktiv{cursor:not-allowed}
.kachel.inaktiv .logo,.kachel.inaktiv .icon{filter:grayscale(1);opacity:.45}
.kachel.inaktiv .name,.kachel.inaktiv .besch{opacity:.5}
.kachel.inaktiv:hover{background:#17171b;border-color:#2a2a30;transform:none}
.kachel .gesperrt{position:absolute;top:.75rem;right:.75rem;font-size:.6rem;letter-spacing:.06em;color:#a09d96;background:#26262c;border:1px solid #3a3a42;padding:.15rem .45rem;border-radius:4px}
.kachel.mit-logo .gesperrt{top:.6rem;right:.6rem}
textarea{resize:vertical;min-height:110px;line-height:1.5}
.kachel .anfragen{margin-top:.6rem;padding:.5rem 1rem;background:#c8a24a;border:none;color:#12120f;border-radius:6px;cursor:pointer;font-size:.82rem;font-weight:600;font-family:inherit;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.kachel .anfragen:hover{background:#dcb75e}

.kachel.inaktiv{pointer-events:none}
.kachel.inaktiv form,.kachel.inaktiv .anfragen{pointer-events:auto}
.kachel .angefragt{margin-top:.5rem;font-size:.74rem;color:#8a8780;border:1px dashed #3a3a42;padding:.3rem .7rem;border-radius:6px}

/* Wasserzeichen fest im Hintergrund - scrollt nicht mit */
body::before{
  content:"";
  position:fixed;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:min(80vw,600px);
  aspect-ratio:1/1;
  background:url("/static/logo-wasserzeichen.png") center/contain no-repeat;
  opacity:.5;
  pointer-events:none;
  z-index:0;
}
header,main,footer{position:relative;z-index:1}