/*
 * Dateiname: public/assets/css/besucher.css
 * Zweck:     Gestaltung der Besucherseite (schatzkontor.de). Vorläufig –
 *            die eigentliche Gestaltung folgt mit den Inhalten.
 */

:root {
    --gold: #a07c1f;
    --gold-hell: #f3ead2;
    --tinte: #1f1d1a;
    --grau: #6b665d;
    --flaeche: #faf8f3;
    --schrift: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box; }
body.besucher { margin: 0; font-family: var(--schrift); color: var(--tinte); background: var(--flaeche); line-height: 1.6; }
.kopf { padding: 1rem 1.5rem; background: var(--tinte); }
.marke { color: #fff; text-decoration: none; font-weight: 700; font-size: 1.2rem; }
.marke-zeichen { color: var(--gold); }
.held { max-width: 760px; margin: 0 auto; padding: 5rem 1.5rem; text-align: center; }
.held h1 { font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.2; margin: 0 0 1rem; }
.held p { font-size: 1.15rem; color: var(--grau); }
.bald { display: inline-block; margin-top: 1.5rem; padding: .5rem 1rem; border-radius: 999px; background: var(--gold-hell); color: var(--tinte) !important; font-size: 1rem !important; }
.fuss { text-align: center; padding: 2rem 1rem; color: var(--grau); font-size: .9rem; }
#meldungen { position: fixed; top: 1rem; left: 50%; transform: translateX(-50%); z-index: 1000; display: flex; flex-direction: column; gap: .5rem; width: min(560px, calc(100vw - 2rem)); }
.meldung { padding: .8rem 1.1rem; border-radius: 8px; color: #fff; cursor: pointer; transition: opacity .35s, transform .35s; }
.meldung-erfolg { background: #2f7d4f; } .meldung-hinweis { background: #2c5d8f; }
.meldung-warnung { background: #b5680f; } .meldung-fehler { background: #b3261e; }
.meldung-weg { opacity: 0; transform: translateY(-8px); }