/* OMSAG LP · B2B Growth · 02 Engpass (CMO-Hub)
   Default = final/visible (no-JS safe). JS adds `.bge-anim` then `.is-in`. */

.omsag-lp-bge {
  --b:   var(--omsag-lp-brand, #50aa3c);
  --bl:  var(--omsag-lp-lime, #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);
  --bg-alt: var(--omsag-lp-bg-alt, #f9faf8);
  --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;
  font-family: var(--font);
  color: var(--ink);
  background: #fff;
  padding: 116px 0;
  -webkit-font-smoothing: antialiased;
}
.omsag-lp-bge, .omsag-lp-bge *, .omsag-lp-bge *::before, .omsag-lp-bge *::after { box-sizing: border-box; }

.omsag-lp-bge__container {
  width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 28px;
  display: grid; grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  gap: 72px; align-items: center;
}

/* ---------- Left copy ---------- */
.omsag-lp-bge__eyebrow {
  font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--b); margin: 0 0 18px;
}
.omsag-lp-bge__headline {
  font-size: clamp(30px, 3.8vw, 44px); font-weight: 700; letter-spacing: -0.026em;
  line-height: 1.08; color: var(--ink); margin: 0 0 22px; max-width: 16ch;
}
.omsag-lp-bge__lead {
  font-size: clamp(15px, 1.15vw, 17px); line-height: 1.6; color: var(--ts);
  margin: 0 0 32px; max-width: 48ch;
}
.omsag-lp-bge__q {
  display: flex; align-items: flex-start; gap: 16px;
  background: var(--bg-alt); border: 1px solid var(--ln); border-radius: var(--omsag-lp-radius, 20px);
  padding: 22px 24px; margin-bottom: 28px;
}
.omsag-lp-bge__q-ico {
  flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%;
  display: grid; place-items: center; background: #fff; border: 1px solid var(--ln); color: var(--b);
}
.omsag-lp-bge__q-ico svg { width: 22px; height: 22px; }
.omsag-lp-bge__q-txt { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.45; color: var(--ink); letter-spacing: -0.01em; }
.omsag-lp-bge__link { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: var(--ink); text-decoration: none; }
.omsag-lp-bge__link span { border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.omsag-lp-bge__link svg { width: 17px; height: 17px; transition: transform .25s var(--ez); }
.omsag-lp-bge__link:hover { color: var(--b); }
.omsag-lp-bge__link:hover svg { transform: translateX(4px); }

/* ---------- Right hub ---------- */
.omsag-lp-bge__constellation { position: relative; }
.omsag-lp-bge__wires { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; overflow: visible; }
.omsag-lp-bge__wire {
  stroke: var(--b); stroke-width: 1.8; stroke-dasharray: 3 5; stroke-linecap: round; opacity: .75;
  vector-effect: non-scaling-stroke;
  stroke-dashoffset: 0;
}
.omsag-lp-bge__grid {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 224px; row-gap: 116px;
}
.omsag-lp-bge__card {
  position: relative; background: #fff; border: 1px solid var(--ln); border-radius: var(--omsag-lp-radius-sm, 12px);
  padding: 18px 18px 16px; text-align: center;
  width: 100%; max-width: 216px; justify-self: center;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  box-shadow: 0 18px 40px -32px rgba(35,39,48,.4);
  transition: transform .3s var(--ez), box-shadow .3s var(--ez);
}
.omsag-lp-bge__card:hover { transform: translateY(-3px); box-shadow: 0 24px 48px -32px rgba(35,39,48,.5); }
.omsag-lp-bge__card-num {
  position: absolute; top: 12px; left: 12px;
  width: 22px; height: 22px; border-radius: 50%; background: var(--bg-alt); border: 1px solid var(--ln);
  display: grid; place-items: center; font-size: 11px; font-weight: 700; color: var(--ts);
}
.omsag-lp-bge__card-ico { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: var(--b); background: #fff; border: 1px solid var(--ln); }
.omsag-lp-bge__card-ico svg { width: 20px; height: 20px; }
.omsag-lp-bge__card-txt { margin: 0; font-size: 13px; font-weight: 500; line-height: 1.4; color: var(--ink); max-width: 20ch; }

/* Center: persona portrait card */
.omsag-lp-bge__center {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3;
  width: 172px; aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden;
  background: var(--ink); color: #fff;
  box-shadow: 0 18px 40px rgba(15,17,21,.22), 0 44px 90px -30px rgba(80,170,60,.30);
}
.omsag-lp-bge__center::before {
  content: ""; position: absolute; inset: 0; z-index: 3; border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); pointer-events: none;
}
.omsag-lp-bge__center::after {
  content: ""; position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(180deg, rgba(20,22,28,0) 40%, rgba(18,20,25,.55) 70%, rgba(16,18,22,.92) 100%);
}
.omsag-lp-bge__center-media { position: absolute; inset: 0; z-index: 1; }
.omsag-lp-bge__center-img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(.18) contrast(1.02); }
.omsag-lp-bge__center-ph {
  position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.25);
  background: radial-gradient(circle at 50% 28%, rgba(170,211,55,.2), transparent 60%), linear-gradient(180deg, #2c313c, #1c1f27);
}
.omsag-lp-bge__center-ph svg { width: 72px; height: 72px; }
.omsag-lp-bge__center-meta { position: absolute; left: 0; right: 0; bottom: 0; z-index: 4; padding: 18px 18px 16px; text-align: left; }
.omsag-lp-bge__center-title { display: block; font-size: 16px; font-weight: 700; line-height: 1.15; letter-spacing: -0.01em; }
.omsag-lp-bge__center-sub { display: block; margin-top: 5px; font-size: 11.5px; line-height: 1.35; color: rgba(255,255,255,.74); }

/* Case-Signal bar */
.omsag-lp-bge__case {
  display: flex; align-items: flex-start; gap: 14px; margin-top: 52px;
  background: var(--bg-alt); border: 1px solid var(--ln); border-radius: var(--omsag-lp-radius, 20px);
  padding: 18px 20px;
}
.omsag-lp-bge__case-ico { flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: var(--b); background: #fff; border: 1px solid var(--ln); }
.omsag-lp-bge__case-ico svg { width: 20px; height: 20px; }
/* Herkunft zuerst, dann der Satz — die beiden Zahlen tragen die Aussage und
   werden deshalb farblich herausgehoben. */
.omsag-lp-bge__case-body { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
.omsag-lp-bge__case-txt { margin: 0; font-size: 14px; font-weight: 500; line-height: 1.5; color: var(--ts); letter-spacing: -0.01em; }
.omsag-lp-bge__case-txt strong { font-weight: 700; color: var(--ink); white-space: nowrap; }
.omsag-lp-bge__case-chip {
  flex-shrink: 0; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--b); background: #fff; border: 1px solid rgba(80,170,60,.28); border-radius: var(--omsag-lp-pill, 999px); padding: 5px 12px;
}

/* Herkunft und Case-Zugang in der Signal-Leiste */
.omsag-lp-bge__case-head { align-self: stretch; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.omsag-lp-bge__case-logo { flex: 0 0 auto; display: block; width: 100px; height: 24px; object-fit: contain; object-position: left center; }
.omsag-lp-bge__case-open {
  display: inline-flex; align-items: center; gap: 9px; margin-top: 2px; padding: 9px 16px;
  border: 1px solid var(--ln); border-radius: var(--omsag-lp-pill, 999px); background: #fff;
  font-family: inherit; font-size: 13px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink);
  cursor: pointer; transition: transform .25s var(--ez), border-color .25s var(--ez), box-shadow .25s var(--ez);
}
.omsag-lp-bge__case-open svg { width: 16px; height: 16px; color: var(--b); transition: transform .25s var(--ez); }
.omsag-lp-bge__case-open:hover, .omsag-lp-bge__case-open:focus-visible {
  transform: translateY(-2px); border-color: rgba(80,170,60,.45); box-shadow: 0 16px 32px -22px rgba(35,39,48,.5);
}
.omsag-lp-bge__case-open:hover svg { transform: translateX(3px); }

/* ---------- Animations ---------- */
.omsag-lp-bge.bge-anim .omsag-lp-bge__eyebrow,
.omsag-lp-bge.bge-anim .omsag-lp-bge__headline,
.omsag-lp-bge.bge-anim .omsag-lp-bge__lead,
.omsag-lp-bge.bge-anim .omsag-lp-bge__q,
.omsag-lp-bge.bge-anim .omsag-lp-bge__link { opacity: 0; transform: translateY(14px); }
.omsag-lp-bge.bge-anim .omsag-lp-bge__card { opacity: 0; transform: translateY(16px) scale(.96); }
.omsag-lp-bge.bge-anim .omsag-lp-bge__center { opacity: 0; transform: translate(-50%, -50%) scale(.6); }
.omsag-lp-bge.bge-anim .omsag-lp-bge__wire { stroke-dasharray: 4 4; stroke-dashoffset: 240; opacity: 0; }
.omsag-lp-bge.bge-anim .omsag-lp-bge__case { opacity: 0; transform: translateY(14px); }

.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__eyebrow  { animation: bge-up .6s var(--ez) .02s forwards; }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__headline { animation: bge-up .7s var(--ez) .08s forwards; }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__lead     { animation: bge-up .7s var(--ez) .16s forwards; }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__q        { animation: bge-up .7s var(--ez) .24s forwards; }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__link     { animation: bge-up .6s var(--ez) .32s forwards; }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__center   { animation: bge-center .7s var(--ez) .15s forwards; }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__wire     { animation: bge-wire .7s var(--ez) forwards; animation-delay: calc(.35s + var(--w) * .1s); }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__card     { animation: bge-card .6s var(--ez) forwards; animation-delay: calc(.4s + var(--c) * .12s); }
.omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__case     { animation: bge-up .7s var(--ez) .9s forwards; }

@keyframes bge-up     { to { opacity: 1; transform: none; } }
@keyframes bge-card   { to { opacity: 1; transform: none; } }
@keyframes bge-center { to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes bge-wire   { to { opacity: .5; stroke-dashoffset: 0; } }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
  .omsag-lp-bge { padding: 80px 0; }
  .omsag-lp-bge__container { grid-template-columns: minmax(0, 1fr); gap: 52px; }
  .omsag-lp-bge__headline, .omsag-lp-bge__lead { max-width: 60ch; }
  .omsag-lp-bge__hub { max-width: 640px; }
}
@media (max-width: 600px) {
  .omsag-lp-bge { padding: 60px 0; }
  .omsag-lp-bge__container { padding: 0 20px; }
  /* Stack the hub: center on top, cards single-column, hide wires */
  .omsag-lp-bge__wires { display: none; }
  .omsag-lp-bge__constellation { display: flex; flex-direction: column; }
  .omsag-lp-bge__center { position: relative; left: auto; top: auto; transform: none; margin: 0 auto 22px; }
  .omsag-lp-bge.bge-anim .omsag-lp-bge__center { transform: scale(.6); }
  .omsag-lp-bge.bge-anim.is-in .omsag-lp-bge__center { animation: bge-center-m .7s var(--ez) .15s forwards; }
  .omsag-lp-bge__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; order: 2; }
  .omsag-lp-bge__card { flex-direction: row; text-align: left; align-items: center; gap: 14px;
    max-width: none; padding: 16px 18px 16px 44px; }
  .omsag-lp-bge__card-num { top: 50%; transform: translateY(-50%); }
  /* Icon-Halter darf nicht zur Ellipse gequetscht werden */
  .omsag-lp-bge__card-ico { flex: 0 0 38px; }
  .omsag-lp-bge__card-txt { max-width: none; }
  .omsag-lp-bge__q-txt { font-size: 15px; }
}
@keyframes bge-center-m { to { opacity: 1; transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
  .omsag-lp-bge.bge-anim .omsag-lp-bge__eyebrow,
  .omsag-lp-bge.bge-anim .omsag-lp-bge__headline,
  .omsag-lp-bge.bge-anim .omsag-lp-bge__lead,
  .omsag-lp-bge.bge-anim .omsag-lp-bge__q,
  .omsag-lp-bge.bge-anim .omsag-lp-bge__link,
  .omsag-lp-bge.bge-anim .omsag-lp-bge__card,
  .omsag-lp-bge.bge-anim .omsag-lp-bge__case { opacity: 1; transform: none; }
  .omsag-lp-bge.bge-anim .omsag-lp-bge__center { opacity: 1; transform: translate(-50%, -50%); }
  .omsag-lp-bge.bge-anim .omsag-lp-bge__wire { opacity: .5; stroke-dashoffset: 0; }
  .omsag-lp-bge * { animation: none !important; }
}

/* Lange Komposita duerfen die Spalte nie sprengen */
.omsag-lp-bge :is(h1,h2,h3,h4,h5,p,li,span,strong,b,em,dt,dd){overflow-wrap:break-word;hyphens: manual}

/* ── Case-Fenster ──────────────────────────────────────────────────────── */
body.omsag-bge-modal-open{overflow:hidden}
.omsag-lp-bge .bgec-dialog{
  width:min(920px,calc(100vw - 32px));max-width:none;max-height:calc(100vh - 32px);
  padding:0;border:0;border-radius:24px;overflow:hidden;background:#fff;color:var(--ink);
  box-shadow:0 60px 120px -40px rgba(8,14,12,.6);
}
.omsag-lp-bge .bgec-dialog[open]{animation:bgec-in .4s var(--ez) both}
.omsag-lp-bge .bgec-dialog::backdrop{background:rgba(14,22,19,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.omsag-lp-bge .bgec-dialog__shell{position:relative;display:flex;flex-direction:column;height:min(860px,calc(100vh - 34px))}
.omsag-lp-bge .bgec-dialog__scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.omsag-lp-bge .bgec-dialog__close{
  position:absolute;z-index:6;top:16px;right:16px;display:grid;width:42px;height:42px;place-items:center;
  border:0;border-radius:50%;background:rgba(16,26,22,.5);color:#fff;cursor:pointer;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .25s var(--ez),transform .25s var(--ez);
}
.omsag-lp-bge .bgec-dialog__close svg{width:20px;height:20px}
.omsag-lp-bge .bgec-dialog__close:hover{background:rgba(16,26,22,.78);transform:rotate(4deg)}

.omsag-lp-bge .bgec-dlg__hero{
  position:relative;display:flex;align-items:flex-end;background:#0d181d;width:100%;
  /* Das Bildformat gibt die Hoehe vor, damit vom Visual moeglichst wenig wegfaellt. */
  aspect-ratio:850/486;min-height:240px;max-height:min(430px,48vh);
}
.omsag-lp-bge .bgec-dlg__hero.is-plain{aspect-ratio:auto;min-height:0;max-height:none;background:var(--bg-alt,#f9faf8)}
.omsag-lp-bge .bgec-dlg__hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.omsag-lp-bge .bgec-dlg__hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,14,12,.15),rgba(8,14,12,.82))}
.omsag-lp-bge .bgec-dlg__hero-copy{position:relative;z-index:2;padding:clamp(22px,3vw,34px);display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.omsag-lp-bge .bgec-dlg__hero-logo{display:block;width:auto;max-width:150px;max-height:34px;object-fit:contain;background:#fff;border-radius:10px;padding:7px 11px}
.omsag-lp-bge .bgec-dlg__hero.is-plain .bgec-dlg__hero-logo{background:transparent;padding:0}
.omsag-lp-bge .bgec-dlg__hero-copy h2{margin:0;max-width:22ch;font-size:clamp(23px,3vw,34px);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:#fff}
.omsag-lp-bge .bgec-dlg__hero.is-plain .bgec-dlg__hero-copy h2{color:var(--ink)}

.omsag-lp-bge .bgec-dlg__facts{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0;
  padding:clamp(20px,2.4vw,26px) clamp(22px,3vw,34px);border-bottom:1px solid var(--ln);
}
.omsag-lp-bge .bgec-dlg__facts>div{padding:0 clamp(12px,1.8vw,22px);border-left:1px solid var(--ln)}
.omsag-lp-bge .bgec-dlg__facts>div:first-child{padding-left:0;border-left:0}
.omsag-lp-bge .bgec-dlg__facts dt{margin:0 0 5px;font-size:12px;font-weight:600;letter-spacing:.05em;color:var(--mut)}
.omsag-lp-bge .bgec-dlg__facts dd{margin:0;font-size:14.5px;font-weight:600;line-height:1.35;letter-spacing:-.012em;color:var(--ink)}

.omsag-lp-bge .bgec-dlg__body{padding:clamp(24px,3vw,34px);display:flex;flex-direction:column;gap:clamp(22px,2.6vw,30px)}
.omsag-lp-bge .bgec-dlg__kpis{display:flex;flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none}
.omsag-lp-bge .bgec-dlg__kpis li{
  flex:1 1 160px;padding:16px 20px;border:1px solid rgba(80,170,60,.24);border-radius:16px;
  background:linear-gradient(150deg,rgba(80,170,60,.09),rgba(170,211,55,.05));
}
.omsag-lp-bge .bgec-dlg__kpis b{display:block;font-size:clamp(24px,2.4vw,30px);font-weight:700;letter-spacing:-.03em;line-height:1.05;color:var(--b)}
.omsag-lp-bge .bgec-dlg__kpis span{display:block;margin-top:5px;font-size:12.5px;line-height:1.3;color:var(--ts)}
.omsag-lp-bge .bgec-dlg__part h3{
  margin:0 0 8px;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--b);
}
.omsag-lp-bge .bgec-dlg__part p{margin:0;max-width:70ch;font-size:15px;line-height:1.65;color:var(--ts)}
.omsag-lp-bge .bgec-dlg__quote{
  margin:0;padding:clamp(20px,2.4vw,26px);border-radius:18px;border:1px solid var(--ln);background:var(--bg-alt,#f9faf8);
}
.omsag-lp-bge .bgec-dlg__quote blockquote{margin:0;font-size:clamp(16px,1.5vw,19px);font-weight:600;line-height:1.5;letter-spacing:-.015em;color:var(--ink)}
.omsag-lp-bge .bgec-dlg__quote figcaption{
  display:flex;align-items:center;gap:14px;margin-top:18px;font-size:13px;color:var(--mut);
}
.omsag-lp-bge .bgec-dlg__quote-img{
  flex:0 0 auto;width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:50% 22%;
  background:#fff;box-shadow:0 0 0 1px var(--ln);display:block;
}
.omsag-lp-bge .bgec-dlg__quote-by{display:flex;flex-direction:column;gap:2px;min-width:0}
.omsag-lp-bge .bgec-dlg__quote-by strong{font-size:14px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.omsag-lp-bge .bgec-dlg__quote-by span{font-size:12.5px;line-height:1.4;color:var(--mut)}
.omsag-lp-bge .bgec-dlg__stack-label{margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--mut)}
.omsag-lp-bge .bgec-dlg__stack ul{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.omsag-lp-bge .bgec-dlg__stack li{
  display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1px solid var(--ln);
  border-radius:var(--omsag-lp-pill,999px);font-size:13.5px;font-weight:600;color:var(--ink);background:#fff;
}
.omsag-lp-bge .bgec-dlg__stack svg{width:15px;height:15px;color:var(--b)}
@keyframes bgec-in{from{opacity:0;transform:translateY(18px) scale(.985)}}

@media(max-width:900px){
  .omsag-lp-bge .bgec-dlg__facts{grid-template-columns:1fr;gap:16px}
  .omsag-lp-bge .bgec-dlg__facts>div{padding:0;border-left:0}
}
@media(max-width:640px){
  .omsag-lp-bge .bgec-dialog{width:calc(100vw - 12px);max-height:calc(100dvh - 12px);border-radius:16px}
  .omsag-lp-bge .bgec-dialog__shell{height:calc(100dvh - 14px)}
  .omsag-lp-bge .bgec-dlg__hero{min-height:200px;max-height:none}
}
@media(prefers-reduced-motion:reduce){
  .omsag-lp-bge .bgec-dialog[open]{animation:none}
  .omsag-lp-bge__case-open,.omsag-lp-bge__case-open svg{transition:none}
}
