/* OMSAG LP · Web · 08 Wirkung — Light. Impact-Punkte + Ergebnisse aus der Praxis. */
.omsag-lp-wbw{
  --b:var(--omsag-lp-brand,#50aa3c);--bl:var(--omsag-lp-lime,#aad337);
  --grad:var(--omsag-lp-brand-grad,linear-gradient(135deg,#50aa3c,#aad337));
  --ink:var(--omsag-lp-ink,#232730);--ts:var(--omsag-lp-text-soft,#5a6270);--mut:var(--omsag-lp-muted,#8a93a3);
  --ln:var(--omsag-lp-line,#e6e8ec);--bga:var(--omsag-lp-bg-alt,#f9faf8);
  --pill:var(--omsag-lp-pill,999px);--r:var(--omsag-lp-radius,20px);--rl:var(--omsag-lp-radius-lg,28px);
  --ez:var(--omsag-lp-ease,cubic-bezier(.2,.7,.2,1));
  --font:var(--omsag-lp-font,'Outfit',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif);
  position:relative;isolation:isolate;overflow:hidden;font-family:var(--font);color:var(--ink);
  -webkit-font-smoothing:antialiased;padding:clamp(76px,8.5vw,116px) 0;
  background:radial-gradient(circle at 88% 0%,rgba(80,170,60,.08),transparent 44%),var(--omsag-lp-bg,#fff);
}
.omsag-lp-wbw,.omsag-lp-wbw *,.omsag-lp-wbw *::before,.omsag-lp-wbw *::after{box-sizing:border-box}
.omsag-lp-wbw a:focus,.omsag-lp-wbw a:focus-visible{outline:none;box-shadow:none}
.omsag-lp-wbw__container{position:relative;z-index:1;width:100%;max-width:1280px;margin:0 auto;padding:0 clamp(20px,2.5vw,28px)}

.omsag-lp-wbw__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.52fr);gap:clamp(24px,3.4vw,52px);
  align-items:start;margin-bottom:clamp(38px,4.6vw,58px)}
.omsag-lp-wbw__overline{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--b)}
.omsag-lp-wbw__headline{margin:0 0 16px;max-width:16ch;font-size:clamp(30px,4vw,46px);font-weight:700;letter-spacing:-.026em;line-height:1.08}
.omsag-lp-wbw__subline{margin:0;max-width:60ch;font-size:clamp(15.5px,1.25vw,17.5px);line-height:1.6;color:var(--ts)}

.omsag-lp-wbw__label{display:flex;align-items:center;gap:12px;margin:0 0 16px;
  font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--mut)}
.omsag-lp-wbw__label span{width:26px;height:1.5px;border-radius:2px;background:var(--grad)}

.omsag-lp-wbw__impact-list{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(9px,1vw,12px);margin:0;padding:0}
.omsag-lp-wbw__impact{position:relative;display:flex;flex-direction:column;gap:11px;min-width:0;
  padding:clamp(15px,1.6vw,18px);border-radius:18px;background:#fff;border:1px solid var(--ln);
  box-shadow:0 20px 44px -40px rgba(15,17,21,.5);
  transition:border-color .28s var(--ez),transform .28s var(--ez)}
.omsag-lp-wbw__impact:hover{border-color:rgba(80,170,60,.34);transform:translateY(-2px)}
.omsag-lp-wbw__impact-num{position:absolute;top:14px;right:16px;font-size:11px;font-weight:700;color:var(--mut)}
.omsag-lp-wbw__impact-ico{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;color:var(--b);
  background:linear-gradient(140deg,rgba(80,170,60,.13),rgba(170,211,55,.1));border:1px solid rgba(80,170,60,.2)}
.omsag-lp-wbw__impact-ico svg{width:21px;height:21px}
.omsag-lp-wbw__impact-txt{font-size:13.5px;font-weight:700;letter-spacing:-.014em;line-height:1.32;color:var(--ink);
  -webkit-hyphens: manual;hyphens: manual}

/* Ergebnisse aus der Praxis */
.omsag-lp-wbw__cases{margin-bottom:clamp(28px,3.4vw,44px)}
.omsag-lp-wbw__case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,24px);align-items:stretch}
.omsag-lp-wbw__case{display:flex;flex-direction:column;min-width:0;
  padding:clamp(20px,2.2vw,26px);border-radius:var(--rl);background:#fff;border:1px solid var(--ln);
  box-shadow:0 26px 58px -46px rgba(15,17,21,.5)}
/* Karte: Kunde — Projekttyp — Story — Kennzahlen als kleine Tags */
/* Titel — Haarlinie — Kunde — Story */
.omsag-lp-wbw__case-title{margin:0 0 clamp(13px,1.3vw,16px);padding-bottom:clamp(13px,1.3vw,16px);
  font-size:clamp(16px,1.4vw,18.5px);font-weight:700;letter-spacing:-.018em;line-height:1.25;
  border-bottom:1px solid var(--ln)}

/* Kunde: Logo links, senkrechter Strich, Zusatz rechts (je Angabe eine Zeile).
   Logos haben sehr unterschiedliche Seitenverhaeltnisse (4,8:1 bis 1,7:1) —
   deshalb Hoehe UND Breite begrenzen, sonst wirken schmale Logos winzig. */
.omsag-lp-wbw__case-client{display:flex;align-items:center;gap:14px;min-width:0;min-height:34px;
  margin-bottom:clamp(16px,1.8vw,20px)}
.omsag-lp-wbw__case-logo{flex:0 0 auto;width:auto;height:auto;max-width:104px;max-height:34px;
  object-fit:contain;object-position:left center;display:block}
.omsag-lp-wbw__case-name{flex:0 0 auto;font-size:13.5px;font-weight:700;line-height:1.3;color:var(--ink)}
.omsag-lp-wbw__case-note{display:flex;flex-direction:column;gap:1px;min-width:0;
  padding-left:14px;border-left:1px solid var(--ln)}
.omsag-lp-wbw__case-note span{font-size:12px;line-height:1.35;color:var(--mut)}

.omsag-lp-wbw__case-rows{margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(13px,1.4vw,16px)}
.omsag-lp-wbw__case-row{display:block;min-width:0}
.omsag-lp-wbw__case-row dt,.omsag-lp-wbw__case-eyebrow{margin:0 0 4px;font-size:11px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--mut);line-height:1.3}
.omsag-lp-wbw__case-row dd{margin:0;font-size:14px;line-height:1.5;color:var(--ts)}

/* Kennzahlen als kleine Tags, nebeneinander mit Umbruch */
.omsag-lp-wbw__case-effect{margin-top:auto;padding-top:clamp(16px,1.7vw,20px)}
.omsag-lp-wbw__case-eyebrow{color:var(--b);margin-bottom:8px}
.omsag-lp-wbw__kpis{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.omsag-lp-wbw__kpi{display:inline-flex;align-items:baseline;gap:5px;max-width:100%;
  padding:5px 11px;border-radius:999px;font-size:12.5px;line-height:1.4;
  background:rgba(80,170,60,.07);border:1px solid rgba(80,170,60,.2);color:var(--ink)}
.omsag-lp-wbw__kpi-val{font-weight:700;color:var(--b);font-variant-numeric:tabular-nums;white-space:nowrap}
.omsag-lp-wbw__kpi-lbl{min-width:0}
.omsag-lp-wbw__kpi.is-text{background:var(--bga);border-color:var(--ln);color:var(--ts)}

/* Fuss */
.omsag-lp-wbw__foot{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(18px,2.6vw,32px);align-items:center;
  padding-top:clamp(24px,2.8vw,34px);border-top:1px solid var(--ln)}
/* Zitat: Portrait links, Aussage rechts, Zuordnung darunter */
.omsag-lp-wbw__quote{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:start;gap:clamp(18px,2.2vw,26px);
  margin:0;padding:clamp(22px,2.4vw,30px) clamp(22px,2.4vw,30px);border-radius:var(--r);
  background:var(--bga);border:1px solid var(--ln);overflow:hidden}
.omsag-lp-wbw__quote-portrait{position:relative;z-index:1;flex:0 0 auto;width:76px;height:76px;border-radius:50%;
  object-fit:cover;object-position:center top;display:block;background:#fff;
  box-shadow:0 0 0 1px var(--ln),0 10px 26px -18px rgba(15,17,21,.6)}
.omsag-lp-wbw__quote-portrait.is-empty{display:grid;place-items:center;color:var(--mut);border:1px solid var(--ln)}
.omsag-lp-wbw__quote-portrait.is-empty svg{width:30px;height:30px}
.omsag-lp-wbw__quote-body{position:relative;z-index:1;min-width:0}
.omsag-lp-wbw__quote blockquote{margin:0;min-width:0}
.omsag-lp-wbw__quote blockquote p{margin:0;font-size:clamp(15px,1.15vw,16.5px);line-height:1.62;font-weight:500;color:var(--ink)}
.omsag-lp-wbw__quote blockquote p::before{content:"„";margin-right:1px;color:var(--b)}
.omsag-lp-wbw__quote blockquote p::after{content:"“";margin-left:1px;color:var(--b)}
.omsag-lp-wbw__quote figcaption{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;min-width:0;
  margin-top:clamp(14px,1.6vw,18px);padding-top:clamp(13px,1.4vw,16px);border-top:1px solid var(--ln)}
.omsag-lp-wbw__quote figcaption strong{font-size:14px;font-weight:700;color:var(--ink);line-height:1.3}
.omsag-lp-wbw__quote figcaption small{font-size:12.5px;color:var(--mut);line-height:1.35}
.omsag-lp-wbw__btn{display:inline-flex;align-items:center;gap:10px;padding:16px 28px;border-radius:var(--pill);
  background:linear-gradient(135deg,#232730,#3a4150);color:#fff;font-size:15px;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap;
  transition:transform .25s var(--ez),box-shadow .25s var(--ez)}
.omsag-lp-wbw__btn svg{width:18px;height:18px;transition:transform .25s var(--ez)}
.omsag-lp-wbw__btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 18px 40px -16px rgba(35,39,48,.5)}
.omsag-lp-wbw__btn:hover svg{transform:translateX(4px)}

/* Reveal */
.omsag-lp-wbw.wbw-anim .omsag-lp-wbw__overline,.omsag-lp-wbw.wbw-anim .omsag-lp-wbw__headline,
.omsag-lp-wbw.wbw-anim .omsag-lp-wbw__subline,.omsag-lp-wbw.wbw-anim .omsag-lp-wbw__label,
.omsag-lp-wbw.wbw-anim .omsag-lp-wbw__impact,.omsag-lp-wbw.wbw-anim .omsag-lp-wbw__case,
.omsag-lp-wbw.wbw-anim .omsag-lp-wbw__foot{opacity:0;transform:translateY(18px)}
.omsag-lp-wbw.wbw-anim.is-in .omsag-lp-wbw__overline{animation:wbw-up .6s var(--ez) .02s forwards}
.omsag-lp-wbw.wbw-anim.is-in .omsag-lp-wbw__headline{animation:wbw-up .7s var(--ez) .08s forwards}
.omsag-lp-wbw.wbw-anim.is-in .omsag-lp-wbw__subline{animation:wbw-up .7s var(--ez) .16s forwards}
.omsag-lp-wbw.wbw-anim.is-in .omsag-lp-wbw__label{animation:wbw-up .6s var(--ez) .2s forwards}
.omsag-lp-wbw.wbw-anim.is-in .omsag-lp-wbw__impact{animation:wbw-up .6s var(--ez) forwards;animation-delay:calc(.26s + var(--i) * .07s)}
.omsag-lp-wbw.wbw-anim.is-in .omsag-lp-wbw__case{animation:wbw-up .68s var(--ez) forwards;animation-delay:calc(.62s + var(--c) * .1s)}
.omsag-lp-wbw.wbw-anim.is-in .omsag-lp-wbw__foot{animation:wbw-up .66s var(--ez) .96s forwards}
@keyframes wbw-up{to{opacity:1;transform:none}}

/* Responsive */
@media(max-width:1080px){
  .omsag-lp-wbw__top{grid-template-columns:1fr}
  .omsag-lp-wbw__case-grid{grid-template-columns:1fr}
  /* einspaltig gibt es nichts auszurichten — Platzhalter weg */
  .omsag-lp-wbw__case-client.is-empty{display:none}
  .omsag-lp-wbw__foot{grid-template-columns:1fr}
}
@media(max-width:640px){
  .omsag-lp-wbw__impact-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .omsag-lp-wbw__btn{width:100%;justify-content:space-between}
}

/* Schmale Karten: Logo und Zusatz untereinander, damit der Trenner nicht
   am Zeilenende haengen bleibt */
@media(max-width:560px){
  .omsag-lp-wbw__quote{grid-template-columns:minmax(0,1fr);gap:16px}
  .omsag-lp-wbw__quote-portrait{width:62px;height:62px}
}

@media(prefers-reduced-motion:reduce){
  .omsag-lp-wbw.wbw-anim [class*="omsag-lp-wbw__"]{opacity:1!important;transform:none!important;animation:none!important}
  .omsag-lp-wbw__impact:hover{transform:none}
}

.omsag-lp-wbw :is(h1,h2,h3,p,li,span,strong,small,b,em,dt,dd,blockquote){overflow-wrap:break-word}