/* OMSAG LP · AIO · 02 Zielgruppe — Light. JS: .aoz-anim -> .is-in */
.omsag-lp-aoz{
  --b:var(--omsag-lp-brand,#50aa3c);--bl:var(--omsag-lp-lime,#aad337);--sky:#6fb4dd;
  --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);--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(72px,8vw,112px) 0;
  background:#fff;
}
.omsag-lp-aoz,.omsag-lp-aoz *,.omsag-lp-aoz *::before,.omsag-lp-aoz *::after{box-sizing:border-box}
.omsag-lp-aoz__container{position:relative;z-index:1;width:100%;max-width:1280px;margin:0 auto;padding:0 clamp(20px,2.5vw,28px)}

.omsag-lp-aoz__head{max-width:760px;margin:0 0 clamp(34px,4vw,48px)}
.omsag-lp-aoz__overline{margin:0 0 16px;color:var(--b);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.omsag-lp-aoz__headline{margin:0 0 16px;font-size:clamp(30px,4vw,46px);font-weight:700;letter-spacing:-.026em;line-height:1.07;color:var(--ink)}
.omsag-lp-aoz__body{margin:0;font-size:clamp(16px,1.25vw,19px);line-height:1.6;color:var(--ts);max-width:64ch}

/* Collaboration band */
.omsag-lp-aoz__collab{margin:0 0 clamp(28px,3.5vw,44px);padding:clamp(20px,2.4vw,28px);border-radius:24px;
  background:linear-gradient(150deg,#ffffff,#eef6f0);border:1px solid rgba(80,170,60,.14)}
.omsag-lp-aoz__collab-head{display:flex;align-items:flex-start;gap:15px;margin-bottom:22px}
.omsag-lp-aoz__collab-ico{flex:0 0 46px;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--bl),var(--b));box-shadow:0 10px 22px -10px rgba(80,170,60,.6)}
.omsag-lp-aoz__collab-ico svg{width:24px;height:24px}
.omsag-lp-aoz__collab-head>div strong{display:block;font-size:clamp(17px,1.6vw,21px);font-weight:700;letter-spacing:-.01em;color:var(--ink)}
/* nur den Text-Span treffen, NICHT den Icon-Holder-Span (sonst wird dessen grid-Zentrierung ueberschrieben). */
.omsag-lp-aoz__collab-head>div span{display:block;margin-top:4px;font-size:14.5px;line-height:1.5;color:var(--ts);max-width:70ch}
/* Icon-Holder hart auf grid halten, egal welche generische Text-Regel dazwischenfunkt. */
.omsag-lp-aoz__collab-ico,.omsag-lp-aoz__teamnode-ico,.omsag-lp-aoz__role-ico,.omsag-lp-aoz__challenge-mark{display:grid!important;place-items:center}
/* Die Leitung fuellt die freie Spalte und zieht sich unter die beiden Abstaende:
   so laeuft sie durchgehend von der letzten Team-Kachel bis an die Karte heran. */
.omsag-lp-aoz__flow{--flow-gap:clamp(14px,2vw,26px);display:grid;grid-template-columns:auto minmax(30px,1fr) auto;align-items:center;gap:var(--flow-gap)}
.omsag-lp-aoz__teams{display:flex;flex-wrap:wrap;gap:12px}
.omsag-lp-aoz__teamnode{display:inline-flex;align-items:center;gap:10px;padding:11px 15px;border-radius:14px;background:#fff;border:1px solid rgba(28,49,57,.1);box-shadow:0 12px 26px -20px rgba(45,100,130,.5)}
.omsag-lp-aoz__teamnode-ico{flex:0 0 34px;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--b);background:linear-gradient(135deg,rgba(170,211,55,.2),rgba(111,180,221,.2))}
.omsag-lp-aoz__teamnode-ico svg{width:19px;height:19px}
.omsag-lp-aoz__teamnode b{font-size:14px;font-weight:700;color:var(--ink)}
.omsag-lp-aoz__teamnode em{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--b);background:rgba(80,170,60,.1);border-radius:999px;padding:3px 8px}
.omsag-lp-aoz__wire{position:relative;width:auto;min-width:30px;height:2px;margin-inline:calc(var(--flow-gap) * -1);background:var(--ln);border-radius:2px;overflow:hidden}
.omsag-lp-aoz__wire i{position:absolute;top:0;left:-40%;width:40%;height:100%;background:linear-gradient(90deg,transparent,var(--b),var(--sky),transparent);animation:aoz-flow 2.6s linear infinite}
.omsag-lp-aoz__hub{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px;
  min-width:150px;padding:16px 20px;border-radius:16px;color:#fff;background:linear-gradient(140deg,#242a33,#3a4150);box-shadow:0 20px 44px -22px rgba(35,39,48,.6)}
.omsag-lp-aoz__hub-core{position:absolute;top:12px;right:12px;width:8px;height:8px;border-radius:50%;background:var(--bl);box-shadow:0 0 0 4px rgba(170,211,55,.22);animation:aoz-pulse 2.2s ease-in-out infinite}
.omsag-lp-aoz__hub strong{font-size:18px;font-weight:700}
.omsag-lp-aoz__hub-sub{font-size:12px;color:rgba(255,255,255,.72)}

/* Roles */
.omsag-lp-aoz__roles{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px);margin-bottom:clamp(26px,3vw,38px)}
.omsag-lp-aoz__role{display:flex;flex-direction:column;padding:26px 24px;border-radius:20px;background:#fff;border:1px solid rgba(28,49,57,.09);
  box-shadow:0 26px 54px -38px rgba(45,100,130,.5);transition:transform .4s var(--ez),box-shadow .4s var(--ez),border-color .3s}
.omsag-lp-aoz__role:hover{transform:translateY(-4px);border-color:rgba(80,170,60,.3);box-shadow:0 34px 64px -34px rgba(45,100,130,.55)}
.omsag-lp-aoz__role-ico{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;color:var(--b);margin-bottom:18px;
  background:linear-gradient(135deg,rgba(170,211,55,.2),rgba(111,180,221,.18));border:1px solid rgba(80,170,60,.18)}
.omsag-lp-aoz__role-ico svg{width:27px;height:27px}
.omsag-lp-aoz__role-title{margin:0 0 10px;font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.2;color:var(--ink)}
.omsag-lp-aoz__role-desc{margin:0;font-size:14.5px;line-height:1.5;color:var(--ts)}

/* Challenge box */
.omsag-lp-aoz__challenge{display:flex;align-items:center;gap:20px;padding:clamp(20px,2.4vw,28px);border-radius:22px;
  background:var(--omsag-lp-bg-alt,#f9faf8);border:1px solid rgba(28,49,57,.1)}
.omsag-lp-aoz__challenge-mark{flex:0 0 52px;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:var(--b);background:rgba(80,170,60,.1);border:1px solid rgba(80,170,60,.2)}
.omsag-lp-aoz__challenge-mark svg{width:27px;height:27px}
.omsag-lp-aoz__challenge-body{flex:1 1 auto;min-width:0}
.omsag-lp-aoz__challenge-body strong{display:block;font-size:17px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.omsag-lp-aoz__challenge-body p{margin:6px 0 0;font-size:14.5px;line-height:1.5;color:var(--ts)}
.omsag-lp-aoz__challenge-cta{flex:0 0 auto;display:inline-flex;align-items:center;gap:9px;padding:14px 24px;border-radius:999px;
  background:linear-gradient(135deg,#232730,#3a4150);color:#fff;text-decoration:none;font-size:14.5px;font-weight:600;transition:transform .25s var(--ez),box-shadow .25s var(--ez)}
.omsag-lp-aoz__challenge-cta svg{width:17px;height:17px;transition:transform .25s var(--ez)}
.omsag-lp-aoz__challenge-cta:hover{color:#fff;transform:translateY(-2px);box-shadow:0 16px 34px -16px rgba(35,39,48,.5)}
.omsag-lp-aoz__challenge-cta:hover svg{transform:translateX(3px)}

@keyframes aoz-flow{to{left:110%}}
@keyframes aoz-flow-y{to{top:110%}}
@keyframes aoz-pulse{0%,100%{opacity:1}50%{opacity:.4}}

/* Reveal */
.omsag-lp-aoz.aoz-anim .omsag-lp-aoz__overline,.omsag-lp-aoz.aoz-anim .omsag-lp-aoz__headline,
.omsag-lp-aoz.aoz-anim .omsag-lp-aoz__body,.omsag-lp-aoz.aoz-anim .omsag-lp-aoz__collab,
.omsag-lp-aoz.aoz-anim .omsag-lp-aoz__role,.omsag-lp-aoz.aoz-anim .omsag-lp-aoz__challenge{opacity:0;transform:translateY(16px)}
.omsag-lp-aoz.aoz-anim.is-in .omsag-lp-aoz__overline{animation:aoz-up .6s var(--ez) .02s forwards}
.omsag-lp-aoz.aoz-anim.is-in .omsag-lp-aoz__headline{animation:aoz-up .7s var(--ez) .1s forwards}
.omsag-lp-aoz.aoz-anim.is-in .omsag-lp-aoz__body{animation:aoz-up .7s var(--ez) .18s forwards}
.omsag-lp-aoz.aoz-anim.is-in .omsag-lp-aoz__collab{animation:aoz-up .75s var(--ez) .28s forwards}
.omsag-lp-aoz.aoz-anim.is-in .omsag-lp-aoz__role{animation:aoz-up .6s var(--ez) forwards;animation-delay:calc(.42s + var(--r) * .09s)}
.omsag-lp-aoz.aoz-anim.is-in .omsag-lp-aoz__challenge{animation:aoz-up .7s var(--ez) .85s forwards}
@keyframes aoz-up{to{opacity:1;transform:none}}

@media(max-width:960px){
  .omsag-lp-aoz__roles{grid-template-columns:1fr 1fr}
  /* Untereinander laeuft die Leitung senkrecht — so bleibt die Richtung lesbar. */
  .omsag-lp-aoz__flow{grid-template-columns:1fr;justify-items:center;gap:0}
  .omsag-lp-aoz__teams{width:100%;justify-content:center}
  .omsag-lp-aoz__wire{width:2px;min-width:0;height:32px;margin:14px 0}
  .omsag-lp-aoz__wire i{left:0;top:-40%;width:100%;height:40%;background:linear-gradient(180deg,transparent,var(--b),var(--sky),transparent);animation-name:aoz-flow-y}
  .omsag-lp-aoz__hub{width:100%}
}
@media(max-width:520px){
  /* Gleich breite Kacheln, damit die Leitung mittig auf den Stapel trifft. */
  .omsag-lp-aoz__teamnode{width:100%;justify-content:space-between}
}
@media(max-width:380px){
  /* Ganz schmal darf das Kuerzel in die zweite Zeile rutschen, statt ueberzulaufen. */
  .omsag-lp-aoz__teamnode{flex-wrap:wrap;row-gap:6px}
}
@media(max-width:600px){
  .omsag-lp-aoz__roles{grid-template-columns:1fr}
  .omsag-lp-aoz__challenge{flex-direction:column;align-items:flex-start}
  .omsag-lp-aoz__challenge-cta{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .omsag-lp-aoz.aoz-anim [class*="omsag-lp-aoz__"]{opacity:1!important;transform:none!important}
  .omsag-lp-aoz *{animation:none!important}
}
