/* ---------- Kompakte Hero auf Unterseiten ---------- */
  .hero-kompakt{min-height:60svh;padding:8rem 5vw 4rem}
  .hero-kompakt .logo{width:120px;height:120px}
  .hero-kompakt h1{font-size:clamp(2rem,5.5vw,3.6rem);margin-top:1.1rem}
  .hero-kompakt .tag{font-size:1.05rem;margin-bottom:1.4rem}

  /* ---------- Ablauf ---------- */
  #ablauf{background:linear-gradient(180deg,var(--nacht) 0%,var(--nacht2) 100%)}
  .schritte{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:1.2rem;max-width:1200px;margin:0 auto}
  .schritt{background:var(--karte);border:1px solid var(--rand);border-radius:var(--radius);padding:1.7rem 1.5rem 1.5rem}
  .schritt .nr{width:38px;height:38px;border-radius:50%;background:var(--sunset);color:#241018;
    font-weight:900;display:grid;place-items:center;margin-bottom:.9rem}
  .schritt h3{font-size:1.02rem;color:var(--sonne);margin-bottom:.4rem}
  .schritt p{color:var(--dampf);font-size:.9rem}
  .schritt code{background:rgba(0,0,0,.35);border:1px solid var(--rand);border-radius:6px;
    padding:.12rem .4rem;color:var(--creme);font-size:.86em}

  /* ---------- Ausruestung ---------- */
  #ausruestung{background:var(--nacht2)}
  .pflicht{max-width:1150px;margin:0 auto 2.4rem;background:rgba(216,30,91,.10);
    border:1px solid rgba(216,30,91,.5);border-radius:var(--radius);padding:1.7rem 1.9rem}
  .pflicht h3{color:var(--beere);font-size:1.1rem;margin-bottom:.9rem;letter-spacing:.04em}
  .pflicht ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:.75rem}
  .pflicht li{position:relative;padding-left:1.5rem;color:var(--dampf);font-size:.93rem}
  .pflicht li::before{content:"\2713";position:absolute;left:0;color:var(--sonne);font-weight:900}
  .pflicht .hinweis{margin-top:1.1rem;font-size:.85rem;color:var(--creme);opacity:.8}

  .hotkeys{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;max-width:1150px;margin:0 auto}
  .taste{background:var(--karte);border:1px solid var(--rand);border-radius:var(--radius);
    padding:1.2rem 1.3rem;display:flex;gap:1rem;align-items:center}
  .taste kbd{flex:0 0 auto;min-width:56px;text-align:center;background:rgba(0,0,0,.5);
    border:1px solid var(--rand);border-bottom-width:3px;border-radius:10px;padding:.5rem .6rem;
    font-family:var(--font);font-weight:800;font-size:.92rem;color:var(--sonne)}
  .taste b{display:block;font-size:.95rem;color:var(--creme)}
  .taste span{color:var(--dampf);font-size:.85rem}
  .taste.pflicht-taste{border-color:rgba(255,179,71,.55);background:rgba(255,179,71,.07)}
  .stand-hinweis{max-width:1150px;margin:1.8rem auto 0;color:var(--dampf);font-size:.88rem;
    border-left:3px solid var(--sonne);padding-left:1rem}

  /* ---------- Formular ---------- */
  #formular{background:linear-gradient(180deg,var(--nacht2) 0%,var(--nacht) 100%)}
  form.bewerbung{max-width:900px;margin:0 auto;background:var(--karte);border:1px solid var(--rand);
    border-radius:var(--radius);padding:2.2rem}
  .feld-gruppe{margin-bottom:2.4rem}
  .feld-gruppe h3{font-size:1.05rem;color:var(--sonne);margin-bottom:1.2rem;
    border-bottom:1px solid var(--rand);padding-bottom:.6rem;letter-spacing:.04em}
  .zeile{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem}
  .feld{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1.2rem}
  .feld label{font-weight:700;font-size:.92rem;color:var(--creme)}
  .feld label .pflicht-tag{color:var(--beere);font-weight:900}
  .feld small{color:var(--dampf);font-size:.8rem}
  .feld input,.feld select,.feld textarea{width:100%;background:rgba(21,13,30,.75);
    border:1px solid var(--rand);border-radius:12px;padding:.8rem .95rem;color:var(--creme);
    font-family:var(--font);font-size:.95rem;transition:border-color .2s,box-shadow .2s}
  .feld textarea{min-height:190px;resize:vertical;line-height:1.55}
  .feld input:focus,.feld select:focus,.feld textarea:focus{outline:none;border-color:var(--sonne);
    box-shadow:0 0 0 3px rgba(255,179,71,.18)}
  .feld select option{background:var(--nacht2);color:var(--creme)}
  .feld.falsch input,.feld.falsch select,.feld.falsch textarea{border-color:var(--beere);
    box-shadow:0 0 0 3px rgba(216,30,91,.2)}

  .check{display:flex;gap:.8rem;align-items:flex-start;margin-bottom:1rem;cursor:pointer}
  .feld label.check{font-weight:400;color:var(--dampf)}
  .check input{flex:0 0 auto;width:20px;height:20px;margin-top:.2rem;accent-color:var(--sonne);cursor:pointer}
  .check span{font-size:.9rem;color:var(--dampf)}
  .check span b{color:var(--creme)}

  .counter{font-size:.8rem;color:var(--dampf);text-align:right}
  .counter.unter{color:var(--beere);font-weight:700}
  .fehler{display:none;background:rgba(216,30,91,.14);border:1px solid rgba(216,30,91,.55);
    border-radius:12px;padding:.9rem 1.1rem;margin-bottom:1.2rem;font-size:.9rem;color:var(--creme)}
  .fehler.zeigen{display:block}
  .erfolg{display:none;background:rgba(61,220,132,.12);border:1px solid rgba(61,220,132,.55);
    border-radius:12px;padding:.9rem 1.1rem;margin-bottom:1.2rem;font-size:.9rem;color:var(--creme)}
  .erfolg.zeigen{display:block}

  .sender{display:flex;gap:1.2rem;align-items:center;flex-wrap:wrap;margin-top:1.6rem}
  .sender .hin{color:var(--dampf);font-size:.85rem}
  .btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
  .alt-weg .actions{justify-content:flex-start;margin-top:1.2rem}

  @media(max-width:640px){
    form.bewerbung{padding:1.4rem}
    .hotkeys{grid-template-columns:1fr}
  }