/* public.css – Layout der öffentlichen Website. KEINE Farbwerte hier, nur Variablen aus farben.php. */
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--schrift); color: var(--farbe-text); background: var(--farbe-hintergrund); line-height: 1.6; }
a { color: var(--farbe-primaer); }
.seiten-kopf { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; padding: var(--abstand) 1.2rem; background: var(--farbe-primaer); }
.kopf-mitte { justify-content: center; flex-direction: column; text-align: center; }
.logo { text-decoration: none; } .logo-bild { height: var(--logo-hoehe); display: block; }
.logo-text { color: #fff; font-weight: 700; font-size: 1.3rem; }
.hauptmenue { display: flex; flex-wrap: wrap; gap: 1.2rem; align-items: center; }
.hauptmenue a { color: #fff; text-decoration: none; font-weight: 600; }
.hauptmenue a.btn { background: var(--farbe-akzent); color: var(--farbe-text); padding: .6rem 1.1rem; border-radius: var(--radius); }
.seiten-inhalt { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1.2rem 3rem; }
.banner { background: var(--farbe-flaeche); border-radius: var(--radius); padding: 2.5rem 1.5rem; text-align: center; margin-bottom: 2rem; }
.banner h1 { margin: 0 0 .5rem; color: var(--farbe-primaer); } .banner .btn { margin-top: 1rem; }
.btn { display: inline-block; background: var(--farbe-akzent); color: var(--farbe-text); padding: .8rem 1.4rem; border-radius: var(--radius); text-decoration: none; font-weight: 700; }
h1, h2, h3 { color: var(--farbe-primaer); }
.block-titel { margin-top: 2.2rem; border-bottom: 2px solid var(--farbe-flaeche); padding-bottom: .3rem; }
.kurs-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.2rem; margin: 1rem 0; }
.kurs-karte { border: 1px solid var(--farbe-flaeche); border-radius: var(--radius); padding: 1.1rem; background: var(--farbe-flaeche-hell); text-decoration: none; color: var(--farbe-text); display: block; }
.kurs-karte h3 { margin: 0 0 .4rem; font-size: 1.05rem; }
.kurs-meta { font-size: .9rem; opacity: .85; margin: .2rem 0; }
.preis { font-weight: 700; font-size: 1.1rem; }
.ampel { display: inline-block; padding: .15rem .6rem; border-radius: 999px; color: #fff; font-size: .8rem; font-weight: 600; }
.ampel-gruen { background: var(--ampel-gruen); } .ampel-orange { background: var(--ampel-orange); } .ampel-rot { background: var(--ampel-rot); }
.filter { display: flex; flex-wrap: wrap; gap: .8rem; margin-bottom: 1rem; }
.filter select { padding: .5rem; border-radius: 8px; border: 1px solid var(--farbe-flaeche); }
.termine-liste { padding-left: 1.1rem; } .termine-liste li.ausfall { text-decoration: line-through; opacity: .6; }
.seiten-fuss { background: var(--farbe-flaeche-hell); margin-top: 2rem; padding: 1.5rem 1.2rem; text-align: center; }
.fussmenue { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; margin-bottom: .6rem; }
.fussmenue a { color: var(--farbe-text); text-decoration: none; font-size: .9rem; }
.copyright { font-size: .8rem; opacity: .7; margin: 0; }
.downloads-liste { list-style: none; padding: 0; } .downloads-liste li { margin-bottom: .5rem; }
.downloads-kategorie { margin-top: 1.5rem; }
.hinweis { background: var(--farbe-flaeche-hell); border-left: 4px solid var(--farbe-akzent); padding: .8rem 1rem; border-radius: 6px; margin-bottom: 1.5rem; }
@media (max-width: 600px) { .seiten-kopf { flex-direction: column; align-items: flex-start; } }

/* Anmeldeformular */
.anmelde-formular { display: grid; gap: .9rem; max-width: 620px; }
.anmelde-formular label { display: grid; gap: .3rem; font-weight: 600; }
.anmelde-formular input, .anmelde-formular textarea { padding: .6rem; border: 1px solid var(--farbe-flaeche); border-radius: 8px; font: inherit; width: 100%; }
.hp-feld { position: absolute; left: -9999px; }
.kurswahl { display: grid; gap: .4rem; background: var(--farbe-flaeche-hell); border-radius: var(--radius); padding: .8rem; }
.kurswahl-zeile { display: flex; align-items: flex-start; gap: .5rem; font-weight: 400 !important; }
.checkbox-zeile { display: flex !important; flex-direction: row; align-items: flex-start; gap: .5rem; font-weight: 400 !important; }
.fehlerhinweis { border-left-color: var(--farbe-fehler); }

/* Startseiten-Botschaft und News */
.start-botschaft { background: var(--farbe-akzent); color: var(--farbe-text); text-align: center; padding: .7rem 1rem; border-radius: var(--radius); font-weight: 600; margin: 0 0 1.2rem; }
.news-liste { display: grid; gap: 1rem; }
.news-eintrag { border: 1px solid var(--farbe-flaeche); border-radius: var(--radius); padding: 1rem; background: var(--farbe-flaeche-hell); }
.news-eintrag h3 { margin: .2rem 0 .4rem; }
.news-datum { font-size: .8rem; opacity: .75; }