/* /sicherheit/ im 100k-Look (11.10.2026). Liegt ueber rollen.css und
   unterseite-100k.css. Erzeugt von werkzeuge/sicherheit-bauen.py. */

.si-seite { --f: var(--accent); --f-bg: var(--tint); }

/* Kopf: frei stehendes Glas rechts neben dem Text. */
.si-glas-schloss { width: 176px; right: 15%; top: 50%; margin-top: -120px; rotate: -9deg; filter: drop-shadow(0 30px 34px rgba(5, 2, 15, .6)); }
.si-glas-schild  { width: 112px; right: 6%; top: 50%; margin-top: 10px; rotate: 11deg; filter: drop-shadow(0 26px 30px rgba(5, 2, 15, .55)); }

/* Dunkles Panel Datenstandort: Quellenzeile hell. */
.u-dunkel .si-quelle { margin-top: 22px; font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, .7); }
.u-dunkel .si-quelle a { color: var(--accent-soft); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Glas-Icon in den Vertragskarten. */
.si-glas { display: grid; place-items: center; margin-bottom: 16px; }

@media (max-width: 1100px) {
  .si-glas-schloss { width: 130px; right: 6%; }
  .si-glas-schild { display: none; }
}
@media (max-width: 980px) {
  .si-glas-schloss { width: 76px; right: 18px; top: 22px; margin-top: 0; }
}
/* Handy. */
@media (max-width: 620px) {
  .si-glas-schloss { width: 50px; right: 14px; top: 16px; }
  /* Lange Woerter in der Einwilligungs-Karte trennen statt unter die Pille laufen. */
  #einwilligungen .uk-reihe strong { hyphens: auto; -webkit-hyphens: auto; overflow-wrap: anywhere; }
}
