/* Branding "Wegbegleiter" – wird nach dem Inline-CSS jeder Seite geladen und überschreibt es.
   Farbwerte aus dem Logo (SVG) abgeleitet; Gold nur für Flächen und Linien, nie für Text. */
@font-face{font-family:'Lato';font-weight:400;font-style:normal;font-display:swap;src:url(fonts/Lato-Regular.woff2) format("woff2");}
@font-face{font-family:'Lato';font-weight:600;font-style:normal;font-display:swap;src:url(fonts/Lato-Semibold.woff2) format("woff2");}
@font-face{font-family:'Lato';font-weight:700;font-style:normal;font-display:swap;src:url(fonts/Lato-Bold.woff2) format("woff2");}

:root{
  /* Farben laut Brand-Guide 2026, Seite 5 */
  --navy:#1E4554;        /* Petrol */
  --navy-dark:#14343F;   /* Nachtblau */
  --teal:#1E4554;        /* Petrol (Akzentschrift, Links) */
  --teal-light:#E9EFEC;  /* heller Salbei-Ton für Flächen */
  --sage:#6F8F7A;        /* Salbei */
  --sage-light:#6F8F7A;
  --forest:#5E827D;      /* Tannengrün, nur große Schrift */
  --gold:#C9A96E;        /* nur Linien und Flächen, Akzent auf Dunkel */
  --gold-dark:#C9A96E;
  --bg:#FAF8F3;          /* Sand */
  --text:#14343F;
  --text-muted:#5E6E78;  /* Schiefer */
  --on-dark:#E8EFEC;
}
body,h1,h2,h3,h4,h5,button,input,textarea{font-family:'Lato','Calibri',sans-serif;}

/* Logo im Kopf- und Fußbereich */
.brand-logo{height:48px;width:auto;display:block;}
.footer-logo{height:52px;width:auto;margin-bottom:14px;}

/* Hero-Fläche in Logo-Petrol */
.hero{background:linear-gradient(180deg,#1E4554 0%,#14343F 100%);}

/* Gold nie als Textfarbe: Text auf Dunkel hell, auf Hell petrol; Gold bleibt Linie/Fläche */
.nav-cta{background:var(--navy);color:#fff !important;}
.nav-cta:hover,.btn-navy:hover{background:var(--navy-dark);}
.eyebrow{color:var(--on-dark);background:rgba(201,169,110,.14);border-color:rgba(201,169,110,.5);}
.hero h1 em{color:#fff;box-shadow:inset 0 -.14em 0 var(--gold);}
.btn-ghost{color:#fff;}
.btn-navy{color:#fff;}
.hero-card h3{color:var(--on-dark);}
.hero-stat .num{color:#fff;}
.pillar-label,.case-card > .m-index,.module-card .m-index,.quality-item .num{color:var(--teal);}
.cert-icon{color:#fff;}
.ref-quote::before,.ref-quote::after{color:var(--sage-light);}

.footer-tagline{font-weight:600;color:var(--on-dark);margin:0 0 10px;}
header{background:rgba(250,248,243,.94);}

/* Header: Logo mind. 220 px (Brand-Guide), Abstand zum Menü */
.brand-logo{height:auto;width:224px;}
.brand{margin-right:32px;flex-shrink:0;}
nav.links{gap:20px;}

/* Handy: Header darf nicht überlaufen; Logo behält sein Seitenverhältnis */
@media (max-width:640px){
  .nav-wrap{padding:0 16px;}
  .brand{margin-right:8px;min-width:0;}
  .brand-logo{height:36px;width:auto;}
  .nav-cta{padding:9px 14px;font-size:12.5px;white-space:nowrap;}
}
@media (max-width:360px){ .nav-cta{display:none;} }