/* ==========================================================================
   1acloud.de — Schritt 1: Farben & Typografie (v4 — kuehleres Kobalt/Azurblau statt Bronze/Teal)
   Nutzt Bootstrap 5 CSS-Variablen (--bs-*), damit sich die Aenderung
   automatisch auf Buttons, Links, Formularfelder etc. auswirkt.
   Kein Markup, keine Texte, keine URLs werden veraendert -> SEO-neutral.
   ========================================================================== */

:root {
  /* Kern-Palette: klares Kobaltblau statt Bronze */
  --bs-primary: #005A9E;
  --bs-primary-rgb: 0, 90, 158;
  --bs-link-color: #005A9E;
  --bs-link-hover-color: #003F6B;
  --bs-link-color-rgb: 0, 90, 158;
  --bs-link-hover-color-rgb: 0, 63, 107;

  --bs-body-color: #16233D;         /* dunkles Navy - unveraendert, kein Teil der Kritik */
  --bs-body-bg: #F6F8F9;            /* kuehleres, helleres Papierweiss statt warmem Creme */
  --bs-heading-color: #16233D;

  /* System-Font-Stacks statt Google Fonts */
  --bs-body-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Helvetica, Arial, sans-serif;
  --bs-font-monospace: ui-monospace, SFMono-Regular, Menlo, Consolas,
    "Liberation Mono", monospace;
}

/* Ueberschriften: bewusst KEINE Serife mehr - dieselbe klare Sans wie der
   Fliesstext. Serife + gedeckte Erdfarbe war der Haupttreiber des "alten",
   amtlichen Eindrucks; reine Sans + klarer Akzent wirkt zeitgemaesser. */
h1, h2, h3, h4, h5, h6,
.navbar-brand {
  font-family: var(--bs-body-font-family);
  color: var(--bs-heading-color);
}

/* Primär-Buttons: Kobaltblau mit weisser Schrift (Kontrast ca. 7,1:1, WCAG AAA) */
.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #FFFFFF;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #003F6B !important;
  border-color: #003F6B !important;
  color: #FFFFFF !important;
}

/* Sekundär-/Outline-Buttons */
.btn-outline-primary {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-outline-primary:hover {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #FFFFFF;
}

/* Aktiver Menüpunkt in der Hauptnavigation */
.navbar .nav-link.active,
.navbar .nav-item.active > .nav-link {
  border-bottom: 2px solid var(--bs-primary);
}

/* Karten (Bootstrap .card), z.B. auf /card-cloud-services */
.card {
  border-color: #E1E6EA;
  background-color: #FFFFFF;
}
.card:hover {
  box-shadow: 0 6px 18px rgba(22, 35, 61, 0.08);
}

/* Formularfelder (Filterleiste, Suchfeld) */
.form-select:focus,
.form-control:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
}