/* ViSoPi® — Farben, Schrift und Logo-Einbindung · Version 1.0 · Stand 15.10.2026
   Erzeugt von _Quelle/_generator_visopi.py — nicht von Hand ändern. */

@font-face { font-family: "Open Sans"; src: url("fonts/OpenSans-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("fonts/OpenSans-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("fonts/OpenSans-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("fonts/OpenSans-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --visopi-ink: #15181E;
  --visopi-terra: #B5532E;
  --visopi-saffron: #E0A12E;
  --visopi-violett: #8B5CF6;
  --visopi-weiss: #FFFFFF;
  --visopi-muted: #6B7280;
  --visopi-muted-hell: #A9AEB8;
  --visopi-linie: #DCD8CF;
  --visopi-linie-dunkel: #3A3F48;
  --visopi-grau-vi: #3F3F3F;
  --visopi-grau-so: #8C8C8C;
  --visopi-grau-pi: #606060;
  /* Silben — in der Marke Video, Sound, Pictures; im Produkt gibt das Produkt die Bedeutung */
  --visopi-vi: var(--visopi-terra);
  --visopi-so: var(--visopi-saffron);
  --visopi-pi: var(--visopi-violett);
  --visopi-schrift: "Open Sans", sans-serif;
  --visopi-schutzraum: 0.5em;          /* bezogen auf die Logohöhe, s. .visopi-logo */
}

/* Logo als Bild einbinden. Höhe setzen, Breite folgt. Der Schutzraum steckt in der Datei. */
.visopi-logo { display: inline-block; line-height: 0; }
.visopi-logo img, .visopi-logo svg { height: 100%; width: auto; display: block; }
.visopi-logo--wortmarke { height: 64px; }   /* Mindesthöhe der Datei: 40 px */
.visopi-logo--quer      { height: 96px; }
.visopi-logo--quadrat   { width: 160px; height: 160px; }

/* Hell/Dunkel automatisch: zwei Bilder im <picture>, siehe einbindung.html */
