/* ==========================================================================
   Vitality Spitex – Typografie für die ganze Website (Branding)
   Stand 14.11.2026 · auf allen Seiten als letztes Stylesheet geladen

   Titel        Marcellus 400, Farbe #117FA9, Zeilenhöhe 1.25
                H1 44 px · H2 32 px · H3 24 px · H4 20 px · H5/H6 17 px
                Handy (bis 767 px): H1 32 · H2 26 · H3 21 · H4 18 · H5/H6 16
   Fliesstext   Open Sans 300, 16 px, Zeilenhöhe 1.7
   Ausnahmen    Telefonnummer/E-Mail in Titeln: Open Sans 300 (Ziffern ruhiger)
                Fusszeilen-Titel: Open Sans 700
                Kleine Hinweise, Labels und Formularteile behalten ihre Grösse
   Weisse Schrift auf farbigen Flächen (.text-white) bleibt weiss.
   ========================================================================== */
@font-face { font-family: 'Marcellus'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/marcellus-v14-latin-regular.woff2') format('woff2'); }

/* ---------- Grundschrift ---------- */
body, p, li, dt, dd, td, th, label, legend, input, select, textarea, button, blockquote, blockquote p,
.font-titillium, .font-raleway, .menuzord-menu > li > a {
  font-family: 'Open Sans', Arial, Helvetica, sans-serif !important;
}

/* ---------- Titel ---------- */
:is(h1, h2, h3, h4, h5, h6):not(.vs-label), .h1, .h2, .h3, .h4, .h5, .h6, .inner-header .title, legend.zf-title {
  font-family: 'Marcellus', Georgia, 'Times New Roman', serif !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #117FA9;
}
:is(h1, h2, h3, h4, h5, h6) :is(strong, b) { font-weight: 400; }
h1:not(.vs-label), .h1.h1 { font-size: 44px !important; }
h2:not(.vs-label), .h2.h2 { font-size: 32px !important; }
h3:not(.vs-label), .h3.h3 { font-size: 24px !important; }
h4:not(.vs-label), .h4.h4 { font-size: 20px !important; }
h5:not(.vs-label), h6:not(.vs-label), .h5.h5, .h6.h6 { font-size: 17px !important; }
@media (max-width: 767px) {
  h1:not(.vs-label), .h1.h1 { font-size: 32px !important; }
  h2:not(.vs-label), .h2.h2 { font-size: 26px !important; }
  h3:not(.vs-label), .h3.h3 { font-size: 21px !important; }
  h4:not(.vs-label), .h4.h4 { font-size: 18px !important; }
  h5:not(.vs-label), h6:not(.vs-label), .h5.h5, .h6.h6 { font-size: 16px !important; }
}

/* Klasse .h1–.h6 bestimmt die Grösse vor dem Tag (z. B. <h1 class="h3"> = Grösse H3) */

/* ---------- Fliesstext ---------- */
p:not([class*="zf-"]):not([class*="vs-"]):not([class*="font-1"]):not([class*="fs-"]):not(.h1):not(.h2):not(.h3):not(.h4):not(.h5):not(.h6):not(.title) {
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 1.7 !important;
}

/* Grosse Titel, die im HTML als <p class="fs-50"> stehen (z. B. Startseite «Alltag erleichtern.»), wie H1 */
.fs-50:not(.fa) {
  font-family: 'Marcellus', Georgia, 'Times New Roman', serif !important;
  font-weight: 400 !important;
  font-size: 44px !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}
@media (max-width: 767px) { .fs-50:not(.fa) { font-size: 32px !important; } }

/* Farbige Wörter in Titeln (z. B. <span class="text-theme-color-2">) haben dieselbe Grösse wie der Titel */
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .fs-50) span:not(.sr-only):not([class*="fa"]) {
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
}

/* Aufzählungen im Text wie Fliesstext (nicht Menüs, Fusszeile, Formulare) */
ul.lead, ul.lead > li, .main-content :is(ul, ol):not([class]) > li, .zf-done-list > li {
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 1.7 !important;
}

/* ---------- Ausnahmen ---------- */
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6):has(a[href^="tel:"], a[href^="mailto:"]) {
  font-family: 'Open Sans', Arial, Helvetica, sans-serif !important;
  font-weight: 300 !important;
}
.footer .widget-title, .footer :is(h1, h2, h3, h4, h5, h6) {
  font-family: 'Open Sans', Arial, Helvetica, sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}
