/* =====================================================================
   I4U b2b.css – B2B-Seiten /unternehmen/* (27.10.2026).
   Ergänzt site.css + tool.css, nutzt nur deren Tokens. Erzeugt von site/b2bpages/build.py.
   ===================================================================== */
.b-kicker{color:var(--mute);margin-bottom:18px}
.b-hero h1{max-width:12em}
.b-li-btn svg,.b-li-cta svg{width:18px;height:18px;flex:none}

/* Hero-Bühne: Mini-UI statt Foto */
.b-board{position:relative;border-radius:calc(var(--r-card) + 6px);padding:clamp(22px,3vw,40px);display:grid;gap:16px;min-height:420px;align-content:center}
.b-ui{background:var(--white);border-radius:var(--r-chip);padding:16px 18px;box-shadow:var(--shadow)}
.b-ui .t-label{color:var(--mute);margin-bottom:10px}
.b-ui-plan{max-width:340px;transform:rotate(-1.5deg)}
.b-ui-plan ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;font-size:15px}
.b-ui-plan li{display:flex;gap:10px;align-items:center}
.b-ui-plan i{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--ink);flex:none}
.b-ui-plan i.done{background:var(--ink)}
.b-ui-kpi{justify-self:end;max-width:360px;transform:rotate(1.2deg)}
.b-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.b-kpis div{background:var(--bg);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column}
.b-kpis b{font:480 22px/1.1 var(--display);font-stretch:110%}
.b-kpis span{font-size:12.5px;color:var(--mute)}
.b-ui-flow{justify-self:start;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;font-weight:500}
.b-ui-flow span{background:var(--bg);border-radius:var(--pill);padding:7px 12px}
.b-ui-flow span+span::before{content:"→";margin-right:8px;color:var(--mute)}
.b-ui-flow .ai{background:var(--mint)}

/* Zielgruppen */
.b-aud{list-style:none;margin:0;padding:0;display:grid;gap:var(--gutter)}
@media(min-width:900px){.b-aud{grid-template-columns:repeat(3,1fr)}}
.b-aud li{border-radius:var(--r-card);padding:28px 26px 30px;display:flex;flex-direction:column;gap:10px;min-height:260px}
.b-aud .t-label{color:var(--ink-2)}
.b-aud h3{font:420 clamp(30px,3vw,40px)/1.05 var(--display);font-stretch:116%}
.b-aud p:last-child{color:var(--ink);margin-top:auto}

/* Leistungs-Karten */
.b-svcs{display:grid;gap:var(--gutter)}
@media(min-width:640px){.b-svcs{grid-template-columns:1fr 1fr}}
@media(min-width:1024px){.b-svcs{grid-template-columns:repeat(4,1fr)}.b-svcs.three{grid-template-columns:repeat(3,1fr)}}
.b-svc{background:var(--white);border-radius:var(--r-card);padding:24px 22px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink);min-height:200px;transition:transform var(--t-med) var(--ease),box-shadow var(--t-med) var(--ease)}
.b-svc:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.b-svc h3{font:480 22px/1.2 var(--display);font-stretch:110%}
.b-svc p{color:var(--ink-2);font-size:15px}
.b-svc .go{margin-top:auto;font-weight:600;font-size:14px}
.b-all{margin-top:20px}

/* Formate */
.b-formats{list-style:none;margin:0;padding:0;display:grid;gap:var(--gutter)}
@media(min-width:900px){.b-formats{grid-template-columns:repeat(3,1fr)}}
.b-formats li{background:var(--ink);color:var(--bg);border-radius:var(--r-card);padding:26px;display:flex;flex-direction:column;gap:10px}
.b-formats h3{font:480 24px/1.15 var(--display);font-stretch:110%}
.b-formats p{opacity:.88;font-size:15.5px}
.b-formats .text-link{color:var(--bg);margin-top:auto;font-size:14px}
.b-contact-card .b-cc-links{color:var(--ink)}
#ueber .tp-cta{margin-top:4px}

/* LinkedIn-Block */
.b-li{display:grid;gap:20px;align-items:center;background:var(--g-band);border-radius:calc(var(--r-card) + 6px);padding:clamp(24px,3.6vw,44px)}
.b-li img{width:88px;height:88px;border-radius:50%;object-fit:cover;object-position:50% 18%}
.b-li .t-label{color:var(--ink-2);margin-bottom:8px}
.b-li h2{margin-bottom:8px;max-width:22em}
.b-li p{color:var(--ink-2);max-width:40em}
.b-li-cta{background:var(--ink);color:var(--bg)!important;justify-self:start}
.b-li-cta:hover{background:var(--teal)}
@media(min-width:900px){.b-li{grid-template-columns:auto 1fr auto}}

/* Kontakt */
.b2b .biz .checks{margin:0 0 26px}
.b-contact-card{display:flex;gap:14px;align-items:center;background:var(--bg);border-radius:var(--r-chip);padding:14px 16px}
.b-contact-card img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:50% 18%;flex:none}
.b-contact-card p{display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.45}
.b-contact-card b{font-weight:600;font-size:15px}
.b-contact-card span{color:var(--mute)}

/* Themenseiten */
.b-glance{background:var(--white);border-radius:calc(var(--r-card) + 6px);padding:clamp(22px,3vw,34px);box-shadow:var(--shadow)}
.b-glance>.t-label{color:var(--mute);margin-bottom:12px}
.b-glance dl{margin:0 0 24px;display:flex;flex-direction:column}
.b-glance dl div{display:grid;grid-template-columns:7.5em 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.b-glance dt{font-weight:600;font-size:14px}
.b-glance dd{margin:0;color:var(--ink-2);font-size:15px}
.b-chips{display:flex;flex-wrap:wrap;gap:8px}
.b-chips span{background:var(--g-sage);border-radius:var(--pill);padding:7px 12px;font-size:13.5px;font-weight:500}
.b-get{display:grid;gap:clamp(24px,4vw,64px)}
@media(min-width:900px){.b-get{grid-template-columns:5fr 7fr;align-items:start}}
.b-get-list{background:var(--white);border-radius:var(--r-card);padding:26px;margin:0}
.band .tp-cta{justify-content:center}
@media(max-width:400px){.b-hero h1{font-size:34px}.b-board{min-height:0;padding:18px}}