/* Logo-Bänder: Jeder Bereich wird mit seinem Band aus dem Signet markiert –
   in exakt der Form und Lage, wie es im Gesamtlogo erscheint.
   Die Hauptnavigation oben behält die Unterstreichung. */
.area-finance,.nav-link[href="kmu-solution.html"],.mobile-nav a[href="kmu-solution.html"],footer a[href="kmu-solution.html"]{--area-mark:url(../logo/bereich-kmu-solution.svg)}
.area-hr,.nav-link[href="hr-solution.html"],.mobile-nav a[href="hr-solution.html"],footer a[href="hr-solution.html"]{--area-mark:url(../logo/bereich-hr-solution.svg)}
.area-travel,.nav-link[href="transport-solution.html"],.mobile-nav a[href="transport-solution.html"],footer a[href="transport-solution.html"]{--area-mark:url(../logo/bereich-transport-solution.svg)}

/* Navigation oben: keine Bänder, bleibt bei der Unterstreichung in Bereichsfarbe */

/* Mobile Navigation und Fusszeile */
.mobile-nav a[href$="-solution.html"],footer a[href$="-solution.html"]{display:flex;align-items:center;gap:9px}
.mobile-nav a[href$="-solution.html"]::before,footer a[href$="-solution.html"]::before{content:"";width:20px;height:20px;flex:none;background:var(--area-mark) center/contain no-repeat}

/* Kacheln Startseite */
.pillar .tag{display:flex;align-items:center;gap:10px}
.pillar .tag::before{content:"";width:34px;height:34px;flex:none;background:var(--area-mark) center/contain no-repeat}

/* Bereichsseiten: Band vor der Dachzeile und als Wasserzeichen in der Ansatz-Karte */
.detail-hero .detail-copy>.eyebrow:first-child{display:flex;align-items:center;gap:12px}
.detail-hero .detail-copy>.eyebrow:first-child::before{content:"";width:38px;height:38px;flex:none;background:var(--area-mark) center/contain no-repeat}
.detail-hero .detail-side{position:relative;overflow:hidden}
.detail-hero .detail-side>*{position:relative;z-index:1}
.detail-hero .detail-side::after{content:"";position:absolute;right:-60px;bottom:-70px;width:300px;height:300px;background:#fff;opacity:.13;
  -webkit-mask:var(--area-mark) center/contain no-repeat;mask:var(--area-mark) center/contain no-repeat;pointer-events:none}
/* Dachzeile Startseite einzeilig */
.intro .eyebrow{white-space:nowrap}
@media(max-width:480px){.intro .eyebrow{font-size:11px;letter-spacing:1.6px}}