/* Standard-Design "default" fuer die Seiten des IT-Herold (Anmeldung, Impressum, Datenschutz).
   Ein anderes Design: eigene Datei anlegen (z. B. modern.css) und in den HTML-Dateien
   den <link rel="stylesheet"> darauf umstellen. Die HTML-Dateien enthalten kein eigenes Styling. */

/* Grundlage */
body { font-family: Arial, sans-serif; background: #f3f1ea; color: #1c2321; margin: 0; padding: 32px 16px; line-height: 1.55; }
a { color: #1c5c5c; }
p { margin: 0 0 16px; }
h2 { font-size: 16px; margin-top: 28px; }

/* Textseiten (Impressum, Datenschutz) */
.w { max-width: 640px; margin: 0 auto; }
.foot { margin: 20px 0 0; font-size: 12px; color: #5c635b; }

/* Anmeldeseite: Karte mit Banner */
.box { max-width: 520px; margin: 0 auto; background: #fff; border: 1px solid #ddd9cc; border-radius: 12px; overflow: hidden; box-shadow: 3px 4px 6px rgba(0, 0, 0, .14), 9px 12px 26px rgba(0, 0, 0, .18); }
.banner { position: relative; z-index: 1; box-shadow: 4px 5px 12px rgba(0, 0, 0, .40); background-color: #6b3510; background-image: linear-gradient(135deg, #b5501e 0%, #4a2f1e 50%, #2b2a28 100%); color: #fff; padding: 22px 24px; }
.banner h1 { font-size: 26px; margin: 0; }
.inner { padding: 24px; }
ul.topics { margin: 0 0 16px; padding-left: 20px; }
ul.topics li { margin-bottom: 4px; }
.note { font-size: 13px; color: #4a524c; background: #f3f1ea; border-radius: 8px; padding: 12px 14px; margin: 16px 0 0; }

/* Formular */
label { display: block; font-weight: bold; margin-bottom: 6px; }
input[type=email] { width: 100%; box-sizing: border-box; font-size: 16px; padding: 12px; border: 1px solid #b8b4a6; border-radius: 8px; }
.consent { display: flex; gap: 10px; align-items: flex-start; margin: 16px 0; font-size: 14px; font-weight: normal; }
.consent input { margin-top: 4px; width: 18px; height: 18px; flex: none; }
button { width: 100%; font-size: 16px; padding: 14px; border: 0; border-radius: 8px; background: #b5501e; color: #fff; cursor: pointer; }
button:hover { background: #8f3f17; }

/* Honeypot: fuer Menschen unsichtbar */
.hp { position: absolute; left: -9999px; }

/* Anmeldeseite: Footer unter der Karte */
.footer { max-width: 520px; margin: 0 auto; }

/* Textseiten (Impressum, Datenschutz) in derselben Huelle */
.box.wide { max-width: 640px; }
.banner .brand { font-size: 26px; font-weight: bold; }
.inner h1 { font-size: 24px; margin: 0 0 16px; }