/* OMSAG LP · Web · 05 Vier Ebenen — Dark. Vier Ebenen mit Rückkopplung auf Nutzer & Ziele. */
.omsag-lp-wbl{
  --b:var(--omsag-lp-brand,#50aa3c);--bl:var(--omsag-lp-lime,#aad337);--sky:#6fb4dd;
  --grad:var(--omsag-lp-brand-grad,linear-gradient(135deg,#50aa3c,#aad337));
  --ink:var(--omsag-lp-ink,#232730);--tx:#f3f6f7;--ts:#9eabb5;--mut:#6f7d87;
  --ln:rgba(150,190,195,.15);--ez:var(--omsag-lp-ease,cubic-bezier(.2,.7,.2,1));
  --pill:var(--omsag-lp-pill,999px);--r:var(--omsag-lp-radius,20px);
  --font:var(--omsag-lp-font,'Outfit',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif);
  --rail:54px;
  position:relative;isolation:isolate;overflow:hidden;font-family:var(--font);color:var(--tx);
  -webkit-font-smoothing:antialiased;padding:clamp(78px,9vw,120px) 0;
  background:radial-gradient(circle at 8% 0%,rgba(80,170,60,.2),transparent 44%),
             radial-gradient(circle at 92% 96%,rgba(111,180,221,.14),transparent 46%),var(--ink);
}
.omsag-lp-wbl,.omsag-lp-wbl *,.omsag-lp-wbl *::before,.omsag-lp-wbl *::after{box-sizing:border-box}
.omsag-lp-wbl a:focus,.omsag-lp-wbl a:focus-visible{outline:none;box-shadow:none}
.omsag-lp-wbl__ambient{position:absolute;z-index:0;width:420px;height:420px;top:-160px;right:-90px;border-radius:50%;
  background:rgba(80,170,60,.22);filter:blur(90px);pointer-events:none}
.omsag-lp-wbl__container{position:relative;z-index:1;width:100%;max-width:1280px;margin:0 auto;padding:0 clamp(20px,2.5vw,28px)}

.omsag-lp-wbl__head{max-width:62ch;margin:0 auto clamp(34px,4.2vw,50px);text-align:center}
.omsag-lp-wbl__overline{margin:0 0 14px;font-size:12.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--bl)}
.omsag-lp-wbl__headline{margin:0 auto 16px;max-width:20ch;font-size:clamp(30px,4vw,46px);font-weight:700;letter-spacing:-.028em;line-height:1.07;color:var(--tx)}
.omsag-lp-wbl__headline em{font-style:normal;background:linear-gradient(100deg,var(--bl),var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent}
.omsag-lp-wbl__subline{margin:0 auto;max-width:62ch;font-size:clamp(15.5px,1.25vw,18px);line-height:1.6;color:var(--ts)}

/* Stack */
.omsag-lp-wbl__stack{position:relative;display:flex;flex-direction:column;gap:12px;padding-right:var(--rail);padding-bottom:2px}
.omsag-lp-wbl__layer{position:relative;z-index:1;display:grid;grid-template-columns:34px 128px minmax(0,1fr);gap:clamp(12px,1.6vw,18px);
  align-items:stretch}
.omsag-lp-wbl__layer-num{align-self:center;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;
  font-size:12.5px;font-weight:700;color:var(--bl);background:rgba(170,211,55,.1);border:1px solid rgba(170,211,55,.3)}

.omsag-lp-wbl__tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;
  padding:16px 10px;border-radius:16px;color:var(--bl);
  background:linear-gradient(150deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--ln);
  transition:border-color .35s var(--ez),background .35s var(--ez)}
.omsag-lp-wbl__tile-ico svg{width:30px;height:30px;display:block}
.omsag-lp-wbl__tile-tag{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ts);text-align:center;line-height:1.25}

.omsag-lp-wbl__panel{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:14px clamp(18px,2.4vw,32px);min-width:0;padding:clamp(16px,1.9vw,22px) clamp(18px,2.2vw,26px);
  border-radius:16px;background:rgba(255,255,255,.038);border:1px solid var(--ln);
  transition:border-color .35s var(--ez),background .35s var(--ez)}
.omsag-lp-wbl__panel-copy{min-width:0;flex:1 1 320px}
.omsag-lp-wbl__layer-title{margin:0 0 6px;font-size:clamp(16.5px,1.5vw,19px);font-weight:700;letter-spacing:-.018em;line-height:1.25;color:var(--tx)}
.omsag-lp-wbl__layer-body{margin:0;max-width:52ch;font-size:14px;line-height:1.55;color:var(--ts)}
.omsag-lp-wbl__chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.omsag-lp-wbl__chips li{padding:7px 13px;border-radius:var(--pill);border:1px solid var(--ln);background:rgba(255,255,255,.04);
  font-size:12.5px;font-weight:600;color:#cfdad9;line-height:1.2;white-space:nowrap}

.omsag-lp-wbl__layer:hover .omsag-lp-wbl__tile,
.omsag-lp-wbl__layer:hover .omsag-lp-wbl__panel{border-color:rgba(170,211,55,.4);background:rgba(170,211,55,.06)}

/* Rueckkopplung als durchgehender Pfad (JS zeichnet ihn pixelgenau) */
.omsag-lp-wbl__flow{position:absolute;inset:0;pointer-events:none;z-index:0}
.omsag-lp-wbl__flow svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.omsag-lp-wbl__flow-base{fill:none;stroke:rgba(170,211,55,.3);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:5 6;animation:wbl-dash 3.6s linear infinite}
.omsag-lp-wbl__flow-comet{fill:none;stroke:var(--bl);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 0 6px rgba(170,211,55,.75));
  stroke-dashoffset:var(--from,0px);animation:wbl-comet var(--dur,6s) linear infinite}
.omsag-lp-wbl__flow-ticks path{fill:none;stroke:rgba(150,190,195,.42);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:4 5}
.omsag-lp-wbl__flow-ticks polyline{fill:none;stroke:rgba(170,211,55,.7);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.omsag-lp-wbl__flow-ticks path.is-flow{stroke:var(--bl);stroke-width:2.2;stroke-dasharray:var(--tl,40px) var(--tl,40px);
  stroke-dashoffset:var(--tl,40px);opacity:0;filter:drop-shadow(0 0 5px rgba(170,211,55,.8));
  animation:wbl-tickflow var(--dur,8s) linear infinite}
@keyframes wbl-tickflow{
  0%{stroke-dashoffset:var(--tl,40px);opacity:0}
  1%{opacity:1}
  7%{stroke-dashoffset:0;opacity:1}
  11%{stroke-dashoffset:0;opacity:0}
  100%{stroke-dashoffset:0;opacity:0}
}
@keyframes wbl-dash{to{stroke-dashoffset:-44}}
@keyframes wbl-comet{from{stroke-dashoffset:var(--from,0px)}to{stroke-dashoffset:var(--to,0px)}}

/* Ziel-Knoten */
.omsag-lp-wbl__goal{position:relative;z-index:1;align-self:center;display:inline-flex;align-items:center;gap:12px;margin-top:28px;
  padding:12px 20px 12px 12px;border-radius:var(--pill);background:rgba(170,211,55,.08);border:1px solid rgba(170,211,55,.32)}
.omsag-lp-wbl__goal-ico{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:var(--bl);
  background:rgba(35,39,48,.6);border:1px solid rgba(170,211,55,.34)}
.omsag-lp-wbl__goal-ico svg{width:21px;height:21px}
.omsag-lp-wbl__goal-label{font-size:14px;font-weight:700;color:#eaf6d8;letter-spacing:-.01em}

.omsag-lp-wbl__link{display:flex;width:fit-content;max-width:100%;align-items:center;gap:9px;margin:clamp(26px,3vw,36px) auto 0;
  color:#dfe8e6;font-size:15px;font-weight:600;text-decoration:none}
.omsag-lp-wbl__link span{border-bottom:1.5px solid rgba(170,211,55,.6);padding-bottom:2px;transition:border-color .25s var(--ez)}
.omsag-lp-wbl__link svg{width:17px;height:17px;color:var(--bl);transition:transform .25s var(--ez)}
.omsag-lp-wbl__link:hover{color:#fff}
.omsag-lp-wbl__link:hover span{border-color:var(--bl)}
.omsag-lp-wbl__link:hover svg{transform:translateX(4px)}

/* Reveal */
.omsag-lp-wbl.wbl-anim .omsag-lp-wbl__overline,.omsag-lp-wbl.wbl-anim .omsag-lp-wbl__headline,
.omsag-lp-wbl.wbl-anim .omsag-lp-wbl__subline,.omsag-lp-wbl.wbl-anim .omsag-lp-wbl__layer,
.omsag-lp-wbl.wbl-anim .omsag-lp-wbl__goal,.omsag-lp-wbl.wbl-anim .omsag-lp-wbl__link{opacity:0;transform:translateY(18px)}
.omsag-lp-wbl.wbl-anim .omsag-lp-wbl__flow{opacity:0}
.omsag-lp-wbl.wbl-anim.is-in .omsag-lp-wbl__overline{animation:wbl-up .6s var(--ez) .02s forwards}
.omsag-lp-wbl.wbl-anim.is-in .omsag-lp-wbl__headline{animation:wbl-up .7s var(--ez) .08s forwards}
.omsag-lp-wbl.wbl-anim.is-in .omsag-lp-wbl__subline{animation:wbl-up .7s var(--ez) .16s forwards}
.omsag-lp-wbl.wbl-anim.is-in .omsag-lp-wbl__layer{animation:wbl-up .66s var(--ez) forwards;animation-delay:calc(.24s + var(--l) * .11s)}
.omsag-lp-wbl.wbl-anim.is-in .omsag-lp-wbl__flow{animation:wbl-in .7s var(--ez) .72s forwards}
.omsag-lp-wbl.wbl-anim.is-in .omsag-lp-wbl__goal{animation:wbl-up .66s var(--ez) .8s forwards}
.omsag-lp-wbl.wbl-anim.is-in .omsag-lp-wbl__link{animation:wbl-up .6s var(--ez) .9s forwards}
@keyframes wbl-up{to{opacity:1;transform:none}}
@keyframes wbl-in{to{opacity:1}}

/* Responsive */
@media(max-width:1080px){
  .omsag-lp-wbl{--rail:26px}
  .omsag-lp-wbl__layer{grid-template-columns:30px 104px minmax(0,1fr);gap:12px}
  .omsag-lp-wbl__tile-ico svg{width:26px;height:26px}
}
@media(max-width:720px){
  .omsag-lp-wbl{--rail:0px}
  .omsag-lp-wbl__stack{padding-right:0}
  .omsag-lp-wbl__flow{display:none}
  .omsag-lp-wbl__layer{grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;gap:10px 12px}
  .omsag-lp-wbl__tile{flex-direction:row;justify-content:flex-start;gap:12px;padding:12px 16px}
  .omsag-lp-wbl__tile-tag{text-align:left}
  .omsag-lp-wbl__panel{grid-column:1 / -1}
  .omsag-lp-wbl__chips li{white-space:normal}
}

@media(prefers-reduced-motion:reduce){
  .omsag-lp-wbl.wbl-anim [class*="omsag-lp-wbl__"]{opacity:1!important;transform:none!important;animation:none!important}
  .omsag-lp-wbl__flow-comet{display:none}
}

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