/* Unterseiten im Steingarten-Look der Startseite (05.11.2026): nach stil.css bzw. app.css geladen, von _steingarten.py eingehängt.
   Farb-/Schriftwerte wie start.css; dazu Aliasse für die App-Variablen von Bildungs- und Jobsuche (--fl, --tx, --ak …). */
@import url(fonts/zen.css);
:root{
  --sand:#F7F5EF;--sand2:#EEEBE2;--kies:#D9D5CA;--stein:#4A4D48;--stein2:#7C807A;--ai:#2B4C6F;--ai2:#3E6A95;--matcha:#7E9B74;--auf-ai:#FFFFFF;
  --bg:var(--sand);--karte:#FFFFFF;--linie:var(--kies);--tinte:#1F2321;--tinte-weich:var(--stein);--grau:var(--stein2);
  --gelb:var(--ai);--gelb-dunkel:var(--ai2);--gelb-blass:#E3EAF1;--auf-akzent:#FFFFFF;--blau:var(--ai);--blau-bg:#E3EAF1;
  --gruen:#4F6E46;--gruen-bg:#E8EEE5;--rot:#8a3b1f;--rot-bg:#F6E9E2;
  --w1:var(--ai);--w1-soft:#E3EAF1;--w2:var(--ai);--w2-soft:#EEF2F6;--w3:var(--stein);--w3-soft:var(--sand2);
  --schatten:0 1px 0 var(--kies);--radius:20px 6px 20px 6px;--eck:28px 6px 28px 6px;--eck-klein:20px 6px 20px 6px;
  --serif:"Zen Old Mincho",Georgia,serif;--sans:"Zen Kaku Gothic New",system-ui,-apple-system,sans-serif;
  --fl:var(--karte);--tx:var(--tinte);--mt:var(--stein2);--ak:var(--ai);--rand:var(--kies);--sig:var(--sand2);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --sand:#15181A;--sand2:#1C2023;--kies:#2E3438;--stein:#B9B6AD;--stein2:#8D918A;--ai:#8FB3D9;--ai2:#A9C6E6;--matcha:#9DB893;--auf-ai:#10181F;
    --karte:#1D2124;--tinte:#ECEAE3;--gelb-blass:#22303E;--auf-akzent:#10181F;--blau-bg:#22303E;
    --gruen:#9DB893;--gruen-bg:#1F2A1E;--rot:#f0a184;--rot-bg:#33201a;--w1-soft:#22303E;--w2-soft:#1B2630;
  }
}
:root[data-theme="dark"]{
  --sand:#15181A;--sand2:#1C2023;--kies:#2E3438;--stein:#B9B6AD;--stein2:#8D918A;--ai:#8FB3D9;--ai2:#A9C6E6;--matcha:#9DB893;--auf-ai:#10181F;
  --karte:#1D2124;--tinte:#ECEAE3;--gelb-blass:#22303E;--auf-akzent:#10181F;--blau-bg:#22303E;
  --gruen:#9DB893;--gruen-bg:#1F2A1E;--rot:#f0a184;--rot-bg:#33201a;--w1-soft:#22303E;--w2-soft:#1B2630;
}
body{font-family:var(--sans);font-size:16px;line-height:1.7}
body::before{display:none}
h1,h2,h3,.kachel .titel,.blatt .marke{font-family:var(--serif);font-weight:500;letter-spacing:-.005em}
h1{font-size:2.1rem;line-height:1.2}@media(max-width:520px){h1{font-size:1.55rem}}
h3{border-left-color:var(--matcha)}
a{color:var(--ai)}a:hover{color:var(--tinte)}

/* Kopf: ruhig auf Sand statt weißer Leiste, Marke mit Punkt wie auf der Startseite */
.kopf{background:color-mix(in srgb,var(--sand) 92%,transparent);backdrop-filter:blur(6px);box-shadow:none;border-bottom:1px solid var(--kies)}
.marke{font-family:var(--serif);font-weight:500;letter-spacing:.12em;color:var(--tinte)}
.marke .logo{background:none;color:var(--tinte);padding:0;font-weight:500;letter-spacing:.2em;display:inline-flex;align-items:center}
.marke .logo::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--ai);margin-right:10px}
.marke .zusatz{letter-spacing:.04em;color:var(--stein2)}
.suchfeld input{border-radius:999px;background:var(--karte)}
.thema{box-shadow:none}.thema:hover,.thema:focus-visible{border-color:var(--ai);color:var(--ai);background:var(--gelb-blass)}

/* Flächen: weiße Karten mit Steingarten-Ecken, keine Schlagschatten */
.blatt,.kachel,.themenliste a,.tief,.fristen,.metabox,.betraege,.naechster,.wer{border-radius:var(--eck-klein)}
.blatt{border-color:var(--kies)}
.kachel{color:var(--tinte)}
.kachel:hover{transform:translateY(-2px);box-shadow:0 1px 0 var(--kies);border-color:var(--ai);background:var(--karte)}
.kachel .sym,.kopfzeile .sym{background:var(--sand2);border-color:var(--kies)}
.themenliste a:hover,.marken a:hover,.weiter a:hover{background:var(--gelb-blass);border-color:var(--ai)}
.hinweisbox,.warnung{border-radius:6px 16px 6px 16px}
.hinweisbox{border-left-color:var(--ai)}
.schritte li::before{background:var(--ai);font-family:var(--sans);font-weight:500}
.naechster{background:var(--w2-soft);border-color:var(--kies);border-left:3px solid var(--ai)}
.naechster strong{color:var(--ai)}
.naechster .knopf,.leiste .knopf,.ergebnis .knopf,.kontaktform button{background:var(--ai);color:var(--auf-ai);font-weight:500;letter-spacing:.06em;box-shadow:none}
.naechster .knopf:hover,.leiste .knopf:hover,.ergebnis .knopf:hover,.kontaktform button:hover{background:var(--ai2)}
.knopf{border-radius:999px}
.fuss{border-top-color:var(--kies)}

/* Apps (Bildungs-/Jobsuche): eigene Gerüste, nur Formen und Knöpfe angleichen */
body>header h1{font-family:var(--serif)}
form,fieldset{border-radius:var(--eck-klein)}
button,input[type=submit]{font-family:var(--sans)}

/* Tagesrunde (Deutsch im Beruf): Startknopf in Ai-Blau statt Orange; Serie/Flamme bleibt warm */
body #bd-spiel .bd-cta{background:var(--ai);color:var(--auf-ai);border-bottom-color:rgba(0,0,0,.25);border-radius:var(--eck-klein);font-family:var(--sans)}
body #bd-spiel .bd-cta:hover{background:var(--ai2)}