/* OMSAG LP · Data & CRM · 03 Closed Loop — Dark. Interaktiver Regelkreis; JS setzt .dal-anim -> .is-in und steuert .is-active. */
.omsag-lp-dal{
  --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,.14);--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(--tx);
  -webkit-font-smoothing:antialiased;padding:clamp(76px,9vw,120px) 0;
  background:radial-gradient(circle at 78% 6%,rgba(111,180,221,.16),transparent 46%),radial-gradient(circle at 10% 92%,rgba(80,170,60,.18),transparent 44%),var(--ink);
}
.omsag-lp-dal,.omsag-lp-dal *,.omsag-lp-dal *::before,.omsag-lp-dal *::after{box-sizing:border-box}
.omsag-lp-dal a:focus,.omsag-lp-dal button:focus,.omsag-lp-dal a:focus-visible,.omsag-lp-dal button:focus-visible{outline:none;box-shadow:none}
.omsag-lp-dal__ambient{position:absolute;z-index:0;border-radius:50%;filter:blur(80px);opacity:.4;pointer-events:none}
.omsag-lp-dal__ambient--a{width:380px;height:380px;top:8%;left:-100px;background:rgba(80,170,60,.42);animation:dal-float 16s ease-in-out infinite}
.omsag-lp-dal__ambient--b{width:320px;height:320px;bottom:2%;right:-90px;background:rgba(111,180,221,.4);animation:dal-float 19s ease-in-out infinite reverse}

.omsag-lp-dal__container{position:relative;z-index:1;width:100%;max-width:1280px;margin:0 auto;padding:0 clamp(20px,2.5vw,28px)}

.omsag-lp-dal__head{margin:0 0 clamp(34px,4.5vw,54px)}
.omsag-lp-dal__overline{margin:0 0 16px;color:var(--bl);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.omsag-lp-dal__headline{margin:0 0 22px;max-width:24ch;font-size:clamp(30px,4vw,46px);font-weight:700;letter-spacing:-.026em;line-height:1.08;color:var(--tx)}
.omsag-lp-dal__headline em{font-style:normal;background:linear-gradient(100deg,var(--bl),var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent}
.omsag-lp-dal__intro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,34px)}
.omsag-lp-dal__body{margin:0;font-size:clamp(15px,1.2vw,17px);line-height:1.62;color:var(--ts)}
.omsag-lp-dal__body--alt{padding-left:18px;border-left:1px solid var(--ln)}

/* ── Ring ──────────────────────────────────────────────────────────────── */
.omsag-lp-dal__stage{position:relative;padding:clamp(6px,1.6vw,18px) 0}
.omsag-lp-dal__ring{position:relative;width:min(100%,720px);aspect-ratio:1;margin:0 auto}
.omsag-lp-dal__track{position:absolute;inset:8%;border-radius:50%;border:1px dashed rgba(150,190,195,.22)}
/* Sweep und Laufpunkt folgen der aktiven Station (JS setzt --rot am Ring). */
.omsag-lp-dal__sweep{position:absolute;inset:8%;border-radius:50%;
  background:conic-gradient(from 0deg,transparent 0 58%,rgba(170,211,55,.4) 76%,rgba(111,180,221,.44) 92%,transparent 99%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  filter:drop-shadow(0 0 8px rgba(80,170,60,.35));
  transform:rotate(var(--rot,0deg));transition:transform .82s cubic-bezier(.45,.05,.2,1)}
/* Laufpunkt auf einer inneren Bahn, damit er nicht hinter den Station-Karten verschwindet. */
.omsag-lp-dal__runner{position:absolute;inset:18%;border-radius:50%;
  transform:rotate(var(--rot,0deg));transition:transform .82s cubic-bezier(.45,.05,.2,1)}
.omsag-lp-dal__runner i{position:absolute;top:-6px;left:calc(50% - 6px);width:12px;height:12px;border-radius:50%;
  background:var(--bl);box-shadow:0 0 16px var(--bl),0 0 0 5px rgba(170,211,55,.16)}

/* Hub */
.omsag-lp-dal__hub{position:absolute;top:50%;left:50%;width:46%;aspect-ratio:1;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;
  padding:clamp(16px,2.4vw,30px);border-radius:50%;
  background:radial-gradient(circle at 50% 30%,rgba(38,52,58,.98),rgba(20,28,33,.98));
  border:1px solid rgba(150,190,195,.18);box-shadow:0 30px 70px -34px rgba(0,0,0,.8),inset 0 1px rgba(255,255,255,.05)}
.omsag-lp-dal__hub-label{display:inline-flex;align-items:center;gap:7px;font-size:10.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--bl)}
.omsag-lp-dal__hub-label svg{width:14px;height:14px;animation:dal-spin 9s linear infinite}
.omsag-lp-dal__hub-stack{position:relative;width:100%;flex:1 1 auto;min-height:0;display:grid}
.omsag-lp-dal__hub-panel{grid-area:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  opacity:0;visibility:hidden;transition:opacity .45s var(--ez)}
.omsag-lp-dal__hub-panel.is-active{opacity:1;visibility:visible}
.omsag-lp-dal__hub-num{font-size:10.5px;font-weight:700;letter-spacing:.14em;color:var(--mut)}
.omsag-lp-dal__hub-panel strong{font-size:clamp(15px,1.7vw,21px);font-weight:700;letter-spacing:-.02em;line-height:1.18;color:#fff;max-width:16ch}
.omsag-lp-dal__hub-panel p{margin:0;font-size:clamp(12px,1.05vw,14px);line-height:1.5;color:var(--ts);max-width:30ch}
.omsag-lp-dal__hub-dots{display:flex;gap:6px}
.omsag-lp-dal__dot{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(150,190,195,.3);cursor:pointer;
  transition:background .3s var(--ez),width .3s var(--ez)}
.omsag-lp-dal__dot.is-active{width:18px;border-radius:4px;background:var(--bl)}

/* Nodes */
.omsag-lp-dal__node{position:absolute;top:var(--y);left:var(--x);transform:translate(-50%,-50%);z-index:3;
  width:clamp(148px,22vw,196px);display:flex;align-items:center;gap:10px;padding:11px 13px;cursor:pointer;text-align:left;
  border-radius:14px;border:1px solid rgba(150,190,195,.16);background:linear-gradient(150deg,rgba(30,42,48,.96),rgba(20,28,33,.96));
  color:var(--tx);font-family:inherit;box-shadow:0 18px 40px -26px rgba(0,0,0,.85);
  transition:border-color .35s var(--ez),background .35s var(--ez),box-shadow .35s var(--ez)}
.omsag-lp-dal__node:hover{border-color:rgba(170,211,55,.4)}
.omsag-lp-dal__node.is-active{border-color:rgba(170,211,55,.6);background:linear-gradient(150deg,rgba(46,62,44,.98),rgba(24,34,30,.98));
  box-shadow:0 20px 44px -22px rgba(80,170,60,.6)}
.omsag-lp-dal__node-ico{flex:0 0 34px;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:var(--bl);
  background:linear-gradient(135deg,rgba(170,211,55,.16),rgba(111,180,221,.14));border:1px solid rgba(170,211,55,.2)}
.omsag-lp-dal__node-ico svg{width:19px;height:19px}
.omsag-lp-dal__node-text{min-width:0;display:flex;flex-direction:column;gap:2px;font-size:12.5px;font-weight:600;line-height:1.25;color:#e7eeee;
  overflow-wrap:break-word}
.omsag-lp-dal__node-text em{font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.12em;color:var(--mut)}
.omsag-lp-dal__node.is-active .omsag-lp-dal__node-text{color:#fff}
/* Aufklapp-Pfeil: nur im mobilen Akkordeon sichtbar. */
.omsag-lp-dal__node-toggle{display:none}

/* ── Foot ──────────────────────────────────────────────────────────────── */
.omsag-lp-dal__foot{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);align-items:center;
  gap:clamp(18px,2.6vw,34px);margin-top:clamp(28px,4vw,48px)}
.omsag-lp-dal__note{padding:clamp(20px,2.2vw,26px);border-radius:18px;border:1px solid rgba(111,180,221,.24);
  background:linear-gradient(150deg,rgba(111,180,221,.1),rgba(255,255,255,.02))}
.omsag-lp-dal__note strong{display:block;margin-bottom:8px;font-size:15px;font-weight:700;letter-spacing:-.014em;color:#fff}
.omsag-lp-dal__note p{margin:0;font-size:13.5px;line-height:1.55;color:var(--ts)}

.omsag-lp-dal__cta-row{margin-top:0;display:flex;justify-content:center}
.omsag-lp-dal__cta{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:var(--omsag-lp-pill,999px);
  background:var(--grad);color:#fff;font-size:15px;font-weight:600;text-decoration:none;
  transition:transform .25s var(--ez),box-shadow .25s var(--ez)}
.omsag-lp-dal__cta svg{width:18px;height:18px;transition:transform .25s var(--ez)}
.omsag-lp-dal__cta:hover{color:#fff;transform:translateY(-2px);box-shadow:0 18px 44px -14px rgba(80,170,60,.55)}
.omsag-lp-dal__cta:hover svg{transform:translateX(4px)}

@keyframes dal-float{0%,100%{transform:translate(0,0)}50%{transform:translate(18px,-20px)}}
@keyframes dal-spin{to{transform:rotate(360deg)}}

/* Reveal */
.omsag-lp-dal.dal-anim .omsag-lp-dal__overline,.omsag-lp-dal.dal-anim .omsag-lp-dal__headline,
.omsag-lp-dal.dal-anim .omsag-lp-dal__body,
.omsag-lp-dal.dal-anim .omsag-lp-dal__note,.omsag-lp-dal.dal-anim .omsag-lp-dal__cta-row{opacity:0;transform:translateY(18px)}
.omsag-lp-dal.dal-anim .omsag-lp-dal__stage{opacity:0}
.omsag-lp-dal.dal-anim.is-in .omsag-lp-dal__overline{animation:dal-up .6s var(--ez) .02s forwards}
.omsag-lp-dal.dal-anim.is-in .omsag-lp-dal__headline{animation:dal-up .7s var(--ez) .1s forwards}
.omsag-lp-dal.dal-anim.is-in .omsag-lp-dal__body{animation:dal-up .7s var(--ez) .2s forwards}
.omsag-lp-dal.dal-anim.is-in .omsag-lp-dal__stage{animation:dal-fade .9s var(--ez) .26s forwards}
.omsag-lp-dal.dal-anim.is-in .omsag-lp-dal__note{animation:dal-up .7s var(--ez) .58s forwards}
.omsag-lp-dal.dal-anim.is-in .omsag-lp-dal__cta-row{animation:dal-up .7s var(--ez) .68s forwards}
@keyframes dal-up{to{opacity:1;transform:none}}
@keyframes dal-fade{to{opacity:1}}

@media(max-width:1080px){
  .omsag-lp-dal__intro{grid-template-columns:1fr}
  .omsag-lp-dal__body--alt{padding-left:0;border-left:0}
  .omsag-lp-dal__foot{grid-template-columns:minmax(0,1fr)}
}
/* Mobil: Match-Rate-Box entfaellt, CTA steht zentriert. */
@media(max-width:700px){
  .omsag-lp-dal__note{display:none}
  .omsag-lp-dal__foot{margin-top:clamp(24px,5vw,34px)}
  .omsag-lp-dal__cta{width:100%;max-width:420px;justify-content:center}
}
/* Unter 860px: aus dem Kreis wird ein Akkordeon. Jede Station traegt ihren
   Inhalt direkt unter sich (JS schiebt den Hub unter die offene Station),
   nur die erste ist von Anfang an aufgeklappt. */
@media(max-width:860px){
  .omsag-lp-dal__ring{aspect-ratio:auto;width:100%;display:flex;flex-direction:column;gap:10px}
  .omsag-lp-dal__track,.omsag-lp-dal__sweep,.omsag-lp-dal__runner{display:none}
  .omsag-lp-dal__hub{position:static;width:100%;aspect-ratio:auto;transform:none;border-radius:20px;
    padding:clamp(20px,4vw,28px);gap:14px}
  .omsag-lp-dal__hub-stack{min-height:132px}
  /* Kein Tap-Blitz und kein Fokusrahmen beim Antippen. */
  .omsag-lp-dal__node{position:static;transform:none;width:100%;-webkit-tap-highlight-color:transparent}
  .omsag-lp-dal__node-text{flex:1 1 auto}
  .omsag-lp-dal__node-toggle{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;color:var(--mut);
    transition:transform .3s var(--ez),color .3s var(--ez)}
  .omsag-lp-dal__node-toggle svg{width:18px;height:18px}
  .omsag-lp-dal__node.is-active .omsag-lp-dal__node-toggle{transform:rotate(180deg);color:var(--bl)}

  /* Offene Station und Inhalt bilden einen Block: die Innenkanten laufen
     flach zusammen, die Linie dazwischen entfaellt. Der Verlauf laeuft
     senkrecht durch beide Kaesten, damit an der Nahtstelle keine Kante
     entsteht. Deckende Farben und ein Stoss ohne Ueberlappung: sonst liegen zwei
     halbtransparente Flaechen 1px breit uebereinander und es entsteht genau
     dort ein heller Strich. */
  .omsag-lp-dal.is-accordion .omsag-lp-dal__node.is-active{
    border-bottom-color:transparent;border-bottom-left-radius:0;border-bottom-right-radius:0;box-shadow:none;
    background:linear-gradient(180deg,#2e3e2c,#222f25);background-origin:border-box}
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub{
    margin-top:-10px;padding:0 16px 16px 57px;gap:0;text-align:left;align-items:stretch;
    border-radius:0 0 14px 14px;border-color:rgba(170,211,55,.6);border-top:0;
    background:linear-gradient(180deg,#222f25,#161f1b);background-origin:border-box;box-shadow:none}
  /* Nummer, Titel, Punktleiste und Kranz-Label doppeln im Akkordeon nur die
     Zeile darueber — deshalb bleibt allein der Beschreibungstext. */
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-label,
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-dots,
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-num,
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-panel strong{display:none}
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-stack{min-height:0;display:block}
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-panel{display:none;opacity:1;visibility:visible;transition:none}
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-panel.is-active{display:block}
  .omsag-lp-dal.is-accordion .omsag-lp-dal__hub-panel p{max-width:none;font-size:13.5px;line-height:1.55}
}
@media(prefers-reduced-motion:reduce){
  .omsag-lp-dal .omsag-lp-dal__track,.omsag-lp-dal .omsag-lp-dal__sweep,.omsag-lp-dal .omsag-lp-dal__runner{display:none}
  .omsag-lp-dal .omsag-lp-dal__ring{aspect-ratio:auto;width:100%;display:flex;flex-direction:column;gap:12px}
  .omsag-lp-dal .omsag-lp-dal__hub{position:static;width:100%;aspect-ratio:auto;transform:none;border-radius:20px;order:-1}
  .omsag-lp-dal .omsag-lp-dal__node{position:static;transform:none;width:100%}
  .omsag-lp-dal.dal-anim .omsag-lp-dal__overline,.omsag-lp-dal.dal-anim .omsag-lp-dal__headline,
  .omsag-lp-dal.dal-anim .omsag-lp-dal__body,
  .omsag-lp-dal.dal-anim .omsag-lp-dal__note,.omsag-lp-dal.dal-anim .omsag-lp-dal__cta-row,
  .omsag-lp-dal.dal-anim .omsag-lp-dal__stage{opacity:1!important;transform:none!important}
  .omsag-lp-dal *{animation:none!important}
}

/* Lange Komposita duerfen nie ueberlaufen */
.omsag-lp-dal :is(h1,h2,h3,h4,p,strong,small,em,b,span,dd,li){overflow-wrap:break-word}