/* ============================================================
   SALI Gruppe · gemeinsames Branding für alle Tools (Stand 12.11.2026)
   Quelle: Sali Gruppe Design System. Alles lokal, keine externen Dateien.
   Einbindung in jedem Tool: <link rel="stylesheet" href="../sali-brand/brand.css">
   ============================================================ */

@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/Montserrat-Regular.woff') format('woff')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/Montserrat-Medium.woff') format('woff')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/Montserrat-SemiBold.woff') format('woff')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/Montserrat-Bold.woff') format('woff')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/Montserrat-ExtraBold.woff') format('woff')}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:900;font-display:swap;src:url('fonts/Montserrat-Black.woff') format('woff')}

:root{
  --sali-red:#D1370D;
  --sali-red-dark:#B02E0B;
  --sali-graphite:#2D2D2D;
  --sali-seashell:#FFF5EC;
  --sali-tangerine:#FF8244;
  --sali-gold-line:linear-gradient(90deg,#FFEBB5 0%,#E4B26A 45%,#C69057 100%);
  --sali-font:'Montserrat','Helvetica Neue',Arial,sans-serif;
}

/* ---------- Kopfleiste ---------- */
.sali-bar{position:relative;background:#FFFFFF;border-bottom:1px solid #E0E0E0;font-family:var(--sali-font)}
.sali-bar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--sali-gold-line)}
.sali-bar__in{max-width:var(--sali-max,1320px);margin:0 auto;padding:10px max(16px,env(safe-area-inset-left,0px));display:flex;align-items:center;gap:14px;min-height:52px}
.sali-bar__logo{display:block;height:26px;width:auto;transform:translateY(-12%)}
.sali-bar__sep{width:1px;height:22px;background:#E0E0E0;flex:none}
.sali-bar__eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sali-red);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sali-bar__side{margin-left:auto;font-size:11.5px;font-weight:600;letter-spacing:.04em;color:#707070;white-space:nowrap}
@media (max-width:520px){.sali-bar__side{display:none}.sali-bar__logo{height:22px}}

/* Logo-Varianten: rot auf hell, weiß auf dunkel */
.sali-home{display:block;flex:none;line-height:0;text-decoration:none}
.sali-home:hover{opacity:.8}
.sali-logo-d{display:none}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .sali-logo-l{display:none}
  :root:not([data-theme="light"]) .sali-logo-d{display:block}
  :root:not([data-theme="light"]) .sali-bar{background:#2D2D2D;border-bottom-color:#3F3F3F}
  :root:not([data-theme="light"]) .sali-bar__sep{background:#3F3F3F}
  :root:not([data-theme="light"]) .sali-bar__eyebrow{color:#FF8244}
  :root:not([data-theme="light"]) .sali-bar__side{color:#B8B8B8}
  :root:not([data-theme="light"]) .sali-foot{border-top-color:#3F3F3F;color:#B8B8B8}
}
:root[data-theme="dark"] .sali-logo-l{display:none}
:root[data-theme="dark"] .sali-logo-d{display:block}
:root[data-theme="dark"] .sali-bar{background:#2D2D2D;border-bottom-color:#3F3F3F}
:root[data-theme="dark"] .sali-bar__sep{background:#3F3F3F}
:root[data-theme="dark"] .sali-bar__eyebrow{color:#FF8244}
:root[data-theme="dark"] .sali-bar__side{color:#B8B8B8}
:root[data-theme="dark"] .sali-foot{border-top-color:#3F3F3F;color:#B8B8B8}

/* ---------- Fußzeile ---------- */
.sali-foot{font-family:var(--sali-font);max-width:var(--sali-max,1320px);margin:32px auto 0;padding:16px max(16px,env(safe-area-inset-left,0px)) 24px;border-top:1px solid #E0E0E0;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;font-weight:500;color:#707070}
.sali-foot img{height:16px;width:auto}
.sali-foot b{font-weight:700}

/* ---------- Bausteine ---------- */
.sali-eyebrow{font-family:var(--sali-font);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sali-red)}
.sali-rule{display:block;width:56px;height:2px;background:var(--sali-red);border:0;margin:10px 0 16px}
.sali-goldline{height:3px;background:var(--sali-gold-line);border:0}

@media print{.sali-bar,.sali-foot{display:none!important}}

/* Zeile „Ein Tool von Sali Consulting“ innerhalb vorhandener Fußzeilen */
.sali-brandline{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-family:var(--sali-font);font-size:12px;font-weight:500}
.sali-brandline img{height:16px;width:auto}
.sali-brandline b{font-weight:700}
@media print{.sali-brandline{display:none!important}}