/* OMSAG LP · Audit-Ergebnis
   Default state = final/visible (works without JS). When JS adds `.ae-anim`,
   elements start hidden and animate in once `.is-in` is added (on scroll). */

.omsag-lp-ae {
  --b:   var(--omsag-lp-brand, #50aa3c);
  --bl:  var(--omsag-lp-lime, #aad337);
  --bd:  var(--omsag-lp-brand-deep, #50aa3c);
  --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);
  --line2: #e5e5ea;
  --ez:  var(--omsag-lp-ease, cubic-bezier(.25,.1,.25,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);
  padding: 96px 0;
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
.omsag-lp-ae,
.omsag-lp-ae *,
.omsag-lp-ae *::before,
.omsag-lp-ae *::after { box-sizing: border-box; }

.omsag-lp-ae__container { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 28px; }

/* --- Header --- */
.omsag-lp-ae__head { margin-bottom: 64px; }
.omsag-lp-ae__eyebrow {
  font-size: 13px; font-weight: 600; letter-spacing: .06em;
  text-transform: uppercase; color: var(--b); margin: 0 0 16px;
}
.omsag-lp-ae__head-row {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 40px;
}
.omsag-lp-ae__headline {
  font-size: clamp(32px, 4.4vw, 46px);
  font-weight: 700; letter-spacing: -0.025em; line-height: 1.06;
  color: var(--ink); margin: 0; max-width: 640px;
}
.omsag-lp-ae__subtitle {
  font-size: clamp(15px, 1.2vw, 17px); line-height: 1.55; color: var(--ts);
  margin: 0; max-width: 320px; text-align: right;
}
.omsag-lp-ae__rule {
  display: block; height: 1px; margin-top: 40px;
  background: var(--b); opacity: .3;
  transform: scaleX(1); transform-origin: left;
}
.omsag-lp-ae.ae-anim .omsag-lp-ae__rule { transform: scaleX(0); }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__rule { animation: ae-rule 1s var(--ez) .3s forwards; }
@keyframes ae-rule { to { transform: scaleX(1); } }

/* --- Grid of 4 columns with hairline dividers --- */
/* gaps reveal the grid background as inner divider lines — no outer border */
.omsag-lp-ae__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line2);
}
.omsag-lp-ae__col { background: #fff; display: flex; flex-direction: column; }
.omsag-lp-ae.ae-anim .omsag-lp-ae__col { opacity: 0; transform: translateY(12px); }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__col { animation: ae-col .6s var(--ez) forwards; animation-delay: calc(var(--col) * .1s); }
@keyframes ae-col { to { opacity: 1; transform: none; } }

/* fixed height so the divider line sits at the same y in every column */
.omsag-lp-ae__visual { display: flex; align-items: center; justify-content: center; padding: 28px 26px; height: 240px; }
.omsag-lp-ae__divider { height: 1px; margin: 0 26px; background: var(--line2); }
.omsag-lp-ae__text { padding: 24px 26px 26px; }
.omsag-lp-ae__num { font-size: 11px; color: var(--mut); letter-spacing: .04em; margin: 0 0 8px; }
.omsag-lp-ae__title { font-size: 16px; font-weight: 600; color: var(--ink); line-height: 1.3; margin: 0 0 8px; letter-spacing: -0.01em; }
.omsag-lp-ae__desc { font-size: 13px; color: var(--ts); line-height: 1.55; margin: 0; }

/* --- 01 Management Summary --- */
.omsag-lp-ae__mgmt { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.omsag-lp-ae__donut { position: relative; width: 128px; height: 128px; }
.omsag-lp-ae__donut-svg { width: 128px; height: 128px; display: block; }
.omsag-lp-ae__arc { stroke-dashoffset: var(--off); }
.omsag-lp-ae__arc--score { stroke: var(--b); }
.omsag-lp-ae__arc--pot   { stroke: var(--bl); }
.omsag-lp-ae.ae-anim .omsag-lp-ae__arc { stroke-dashoffset: var(--circ); }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__arc--score { animation: ae-arc 1.6s var(--ez) forwards; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__arc--pot   { animation: ae-arc 1.6s var(--ez) .25s forwards; }
@keyframes ae-arc { to { stroke-dashoffset: var(--off); } }
.omsag-lp-ae__donut-center {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.omsag-lp-ae__donut-center strong { font-size: 40px; font-weight: 700; color: var(--ink); line-height: 1; letter-spacing: -0.02em; }
.omsag-lp-ae__donut-center small { font-size: 11px; color: var(--mut); margin-top: 3px; letter-spacing: .02em; }
.omsag-lp-ae__badges { display: flex; align-items: center; gap: 16px; }
.omsag-lp-ae.ae-anim .omsag-lp-ae__badges { opacity: 0; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__badges { animation: ae-fade .5s ease .9s forwards; }
.omsag-lp-ae__badge { text-align: center; }
.omsag-lp-ae__badge .k { display: block; font-size: 11px; color: var(--mut); }
.omsag-lp-ae__badge .v { display: block; font-size: 15px; font-weight: 600; color: var(--ink); margin-top: 2px; }
.omsag-lp-ae__badge-sep { width: 1px; height: 24px; background: var(--line2); }

/* --- 02 Scorecards --- */
.omsag-lp-ae__scores { width: 100%; display: flex; flex-direction: column; gap: 14px; }
.omsag-lp-ae__score-row { display: flex; align-items: center; gap: 12px; }
.omsag-lp-ae.ae-anim .omsag-lp-ae__score-row { opacity: 0; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__score-row { animation: ae-fade .5s ease forwards; animation-delay: calc(.1s + var(--r) * .1s); }
.omsag-lp-ae__score-label { font-size: 13px; color: var(--ink); width: 58px; flex-shrink: 0; }
.omsag-lp-ae__score-track { flex: 1; height: 3px; background: #f0f0f0; border-radius: 999px; overflow: hidden; }
.omsag-lp-ae__score-fill { display: block; height: 100%; border-radius: 999px; width: var(--w); }
.omsag-lp-ae.ae-anim .omsag-lp-ae__score-fill { width: 0; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__score-fill { animation: ae-bar 1s var(--ez) forwards; animation-delay: calc(.2s + var(--r, 0) * .1s); }
@keyframes ae-bar { to { width: var(--w); } }
.omsag-lp-ae__score-val { font-size: 14px; font-weight: 600; width: 28px; text-align: right; flex-shrink: 0; }

/* --- 03 Wettbewerbsanalyse (radar) --- */
.omsag-lp-ae__radar-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.omsag-lp-ae__radar { width: 158px; height: 158px; flex-shrink: 0; }
.omsag-lp-ae__poly { transform: scale(1); transform-origin: 74px 74px; transform-box: view-box; }
.omsag-lp-ae__poly--du { fill: var(--b);  stroke: var(--b); }
.omsag-lp-ae__poly--a  { fill: var(--bl); stroke: var(--bl); }
.omsag-lp-ae__poly--b  { fill: #7ec8f0;   stroke: #7ec8f0; }
.omsag-lp-ae__radar-dot { fill: var(--b); }
.omsag-lp-ae.ae-anim .omsag-lp-ae__poly { transform: scale(0); }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__poly--b  { animation: ae-pop .7s var(--ez) .1s forwards; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__poly--a  { animation: ae-pop .8s var(--ez) .2s forwards; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__poly--du { animation: ae-pop 1s var(--ez) .35s forwards; }
@keyframes ae-pop { to { transform: scale(1); } }
.omsag-lp-ae.ae-anim .omsag-lp-ae__radar-dot { opacity: 0; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__radar-dot { animation: ae-fade .25s ease forwards; animation-delay: calc(.9s + var(--d) * .05s); }
.omsag-lp-ae__legend { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 8px 16px; }
.omsag-lp-ae__legend-item { display: flex; align-items: center; gap: 8px; font-size: 11px; color: var(--mut); }
.omsag-lp-ae.ae-anim .omsag-lp-ae__legend-item { opacity: 0; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__legend-item { animation: ae-fade .4s ease forwards; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__legend-item:nth-child(1) { animation-delay: .6s; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__legend-item:nth-child(2) { animation-delay: .7s; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__legend-item:nth-child(3) { animation-delay: .8s; }
.omsag-lp-ae__legend-item .ln { width: 20px; height: 2px; border-radius: 999px; background: var(--lc, #aeaeb2); flex-shrink: 0; }
.omsag-lp-ae__legend-item .ln.dash { background: repeating-linear-gradient(90deg, var(--lc) 0 3px, transparent 3px 5px); }

/* --- 04 Business-Impact-Roadmap --- */
.omsag-lp-ae__roadmap { width: 100%; display: flex; flex-direction: column; gap: 18px; }
.omsag-lp-ae__rm-bars { display: flex; align-items: flex-end; gap: 14px; height: 88px; }
.omsag-lp-ae__rm-col { flex: 1; display: flex; align-items: flex-end; }
.omsag-lp-ae__rm-bar { display: block; width: 100%; border-radius: 4px; transform: scaleY(1); transform-origin: bottom; }
.omsag-lp-ae.ae-anim .omsag-lp-ae__rm-bar { transform: scaleY(0); }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__rm-bar { animation: ae-rise .8s var(--ez) forwards; animation-delay: calc(.15s + var(--d) * .15s); }
@keyframes ae-rise { to { transform: scaleY(1); } }
.omsag-lp-ae__rm-labels { display: flex; gap: 14px; }
.omsag-lp-ae__rm-label { flex: 1; }
.omsag-lp-ae.ae-anim .omsag-lp-ae__rm-label { opacity: 0; }
.omsag-lp-ae.ae-anim.is-in .omsag-lp-ae__rm-label { animation: ae-fade .4s ease forwards; animation-delay: calc(.5s + var(--d) * .15s); }
.omsag-lp-ae__rm-label .c { display: block; font-size: 12px; font-weight: 600; }
.omsag-lp-ae__rm-label .l { display: block; font-size: 10.5px; color: var(--mut); margin-top: 2px; line-height: 1.25; }

@keyframes ae-fade { to { opacity: 1; } }

/* --- Footer --- */
.omsag-lp-ae__footer { display: flex; align-items: center; gap: 0; margin-top: 44px; }
.omsag-lp-ae__footer-rule { flex: 1; height: 1px; background: var(--line2); }
.omsag-lp-ae__footer-text { font-size: 12px; color: var(--ts); margin: 0; padding: 0 24px; display: inline-flex; align-items: center; gap: 8px; text-align: center; }
.omsag-lp-ae__lock { display: block; flex-shrink: 0; color: var(--mut); margin-top: -1px; }

/* ============ RESPONSIVE ============ */
@media (max-width: 1000px) {
  .omsag-lp-ae { padding: 76px 0; }
  .omsag-lp-ae__grid { grid-template-columns: repeat(2, 1fr); }
  .omsag-lp-ae__head { margin-bottom: 48px; }
}
@media (max-width: 600px) {
  .omsag-lp-ae { padding: 56px 0; }
  .omsag-lp-ae__container { padding: 0 20px; }
  .omsag-lp-ae__grid { grid-template-columns: 1fr; }
  .omsag-lp-ae__head-row { flex-direction: column; align-items: flex-start; }
  .omsag-lp-ae__subtitle { text-align: left; max-width: none; }
  .omsag-lp-ae__footer-text { font-size: 11.5px; padding: 0 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .omsag-lp-ae.ae-anim .omsag-lp-ae__rule,
  .omsag-lp-ae.ae-anim .omsag-lp-ae__poly,
  .omsag-lp-ae.ae-anim .omsag-lp-ae__rm-bar { transform: none; }
  .omsag-lp-ae.ae-anim .omsag-lp-ae__col,
  .omsag-lp-ae.ae-anim .omsag-lp-ae__badges,
  .omsag-lp-ae.ae-anim .omsag-lp-ae__score-row,
  .omsag-lp-ae.ae-anim .omsag-lp-ae__radar-dot,
  .omsag-lp-ae.ae-anim .omsag-lp-ae__legend-item,
  .omsag-lp-ae.ae-anim .omsag-lp-ae__rm-label { opacity: 1; }
  .omsag-lp-ae.ae-anim .omsag-lp-ae__arc { stroke-dashoffset: var(--off); }
  .omsag-lp-ae.ae-anim .omsag-lp-ae__score-fill { width: var(--w); }
  .omsag-lp-ae * { animation: none !important; }
}