/* Auftritt Patcharawadee (admin.patcharawadee.com), 02.10.2026.
   Wird nach styles.css geladen und stellt nur um, was die Marke trägt:
   Farben, Schrift der Wortmarke, das Markenfeld der Anmeldung.
   Werte von ihrer Webseite (neue-webseite/seite/stil.css): Papier #ece6da,
   Grün der Flächen #2f3b2d, Grün des Zeichens #1c482c, Gold der Flamme #e89c40. */

@font-face {
  font-family: "Newsreader"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("newsreader-latin.woff2") format("woff2");
}

:root {
  /* Akzent: aktive Reiter, Verweise, Fokus, Balken, Linie im Verlauf */
  --brand-600: #1c482c;
  --brand-500: #2f6a42;
  --brand-50: #edf3ea;
  /* dunkle Flächen: Knöpfe, Avatar */
  --navy-950: #1a221a;
  --navy-900: #2f3b2d;
  --navy-800: #36452f;
  --navy-700: #3e4d3b;
  --navy-600: #4d5f49;
  --auftritt-gold: #e89c40;
}
/* Im Dunkelmodus muss der Akzent hell sein, sonst verschwindet er auf dunklem Grund */
.dark {
  --brand-600: #7fc08f;
  --brand-500: #9bd0a8;
  --brand-50: #22301f;
}

/* Seitengrund: ihr Papier statt des blauen Verlaufs. Der Dunkelmodus bleibt, wie er ist: Seine Flächen sind
   bläulich grau, ein grün getönter Grund dahinter sähe wie ein Versehen aus. Dort trägt nur der Akzent die Marke. */
body { background: linear-gradient(180deg, #fff 0%, #f5f0e6 40%, #faf7f1 75%, #fff 100%) fixed; }

/* Wortmarke in der Schrift ihrer Webseite */
.auftritt-name { font-family: "Newsreader", Georgia, "Times New Roman", serif; font-weight: 600; letter-spacing: -.02em; }
.marke-name.auftritt-name { font-size: 1.1875rem; line-height: 1.15; color: #1e1d1a; }
.dark .marke-name.auftritt-name { color: #f1ede4; }
.hph-logo.auftritt-logo { gap: .75rem; }
.hph-logo.auftritt-logo .auftritt-name { font-size: 1.5625rem; }
.hph-logo.auftritt-logo img { height: 2.6875rem; }
.pw-logo .auftritt-name { font-size: 1.25rem; }
.pw-logo .auftritt-zusatz { margin-top: .3125rem; font-size: .5rem; }

/* Kacheln und Plaketten, die fest auf Indigo standen */
.t-indigo { background: #edf3ea; color: #1c482c; }
.dark .t-indigo { background: rgb(47 106 66 / .22); color: #9bd0a8; }
.dark .badge-indigo, .dark .s-geplant, .dark .wahl-knopf.wahl-projekt,
.dark .wahl-eintrag.gewaehlt, .dark .zeit-preset.aktiv { color: #9bd0a8; }

/* ------------------------------------------------------- Anmeldung */
.anmeldung-marke {
  color: #d5ddd0;
  background:
    radial-gradient(75% 55% at 100% 0%, rgb(232 156 64 / .2), transparent 70%),
    radial-gradient(80% 60% at 0% 100%, rgb(28 72 44 / .7), transparent 72%),
    linear-gradient(180deg, #2f3b2d 0%, #273226 58%, #1c241b 100%);
}
.anmeldung-oberzeile { color: #edb469; }
.anmeldung-titel { font-family: "Newsreader", Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -.02em; line-height: 1.08; }
.anmeldung-punkte { color: #e6ebe2; }
.anmeldung-punkte svg { color: var(--auftritt-gold); }
/* statt der Wabe von HomePageHeroes ihr Zeichen, groß und kaum sichtbar */
.anmeldung-wabe { display: none; }
.anmeldung-marke::after {
  content: ""; position: absolute; z-index: -1; right: -3.25rem; bottom: -4.5rem;
  width: 17rem; height: 21.25rem; opacity: .07;
  background: url("logo-hell.png") center / contain no-repeat;
}
.anmeldung-formular h1 { color: #1e1d1a; }
.dark .anmeldung-formular h1 { color: #f1ede4; }

@media (max-width: 760px) {
  .anmeldung-marke::after { width: 10rem; height: 12.5rem; right: -2rem; bottom: -5rem; }
}