/* ===== Ablauf — scroll-drawn snaking path (wie TMB) ===== */
.process{position:relative;z-index:20;padding:0;padding-top:clamp(80px,12vh,140px)}  /* z-index über dem Curtain, damit der Pfad über dem Angebot liegt */
.process-head{max-width:1120px;margin:0 auto clamp(24px,6vh,64px);padding:0 clamp(24px,6vw,96px);text-align:center}
.process-head .sec-title,.process-head .sec-sub{margin-left:auto;margin-right:auto}
.process-head .sec-sub{max-width:60ch}
.process-track{position:relative;max-width:1120px;margin:0 auto;padding:0 clamp(24px,6vw,96px);height:300vh}
.process-path{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:visible}
.process-path path{fill:none;stroke:var(--accent);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}

.pstep{
  position:absolute;z-index:1;width:min(42%,440px);
  transform:translateY(-50%);
  background:rgba(255,255,255,.55);
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  border:1px solid rgba(255,255,255,.65);
  border-radius:22px;padding:clamp(24px,3vw,36px);
  box-shadow:0 28px 64px -30px rgba(35,85,25,.4);
  will-change:opacity,transform;
}
.card-line{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;display:block}
.card-line-rect{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.pstep--left{left:clamp(24px,6vw,96px)}
.pstep--right{right:clamp(24px,6vw,96px)}
.pstep[data-node="0"]{top:10%}
.pstep[data-node="1"]{top:32%}
.pstep[data-node="2"]{top:54%}
.pstep[data-node="3"]{top:76%}

.pstep-graphic{
  position:absolute;z-index:1;
  transform:translateY(-50%);
  pointer-events:none;
  will-change:opacity,transform;
}
.pstep-graphic--left{
  left:clamp(24px,6vw,96px);
  width:min(42%,440px);
  display:flex;justify-content:center;align-items:center;
}
.pstep-graphic--right{
  right:clamp(24px,6vw,96px);
  width:min(42%,440px);
  display:flex;justify-content:center;align-items:center;
}
.pstep-graphic[data-node="0"]{top:10%}
.pstep-graphic[data-node="1"]{top:32%}
.pstep-graphic[data-node="2"]{top:54%}
.pstep-graphic[data-node="3"]{top:76%}

.pnum{font-size:13px;letter-spacing:.22em;color:var(--accent);font-weight:700;font-style:italic;margin-bottom:12px}
.pstep-lottie{width:clamp(200px,28vw,340px);height:clamp(200px,28vw,340px);pointer-events:none}
.pstep-lottie svg{width:100%;height:100%;display:block}
.pstep-img{width:clamp(200px,28vw,340px);height:auto;display:block;object-fit:contain}
.pnum .slash{color:var(--olive-bright)}
.pstep h3{font-size:clamp(22px,2.4vw,30px);font-weight:700;letter-spacing:-.02em;margin-bottom:12px}
.pstep p{color:var(--muted);font-size:clamp(15px,1.1vw,17px);line-height:1.6}
.pstep-btn{
  margin-top:20px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--accent);color:#fff;border:none;cursor:pointer;
  font-family:var(--font);font-weight:700;font-style:italic;font-size:17px;
  padding:18px 28px;border-radius:var(--radius);text-decoration:none;
  transition:transform .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease);
}
.pstep-btn:hover{background:#235519;color:#fff;transform:translateY(-2px);box-shadow:0 16px 40px rgba(35,85,25,.4)}
.pstep-accent{border-color:rgba(217,164,4,.5);background:rgba(255,255,255,.6)}

@media(max-width:900px){
  .process-track{height:auto;padding:0 16px clamp(60px,10vh,100px)}
  .process-path{display:none}
  .pstep--left,.pstep--right{left:auto;right:auto}
  .pstep{position:relative;top:auto;transform:none;width:100%;max-width:540px;margin:32px auto 72px}
  .pstep-graphic{
    position:relative;top:auto;left:auto!important;right:auto!important;
    transform:none;margin:56px auto 12px;width:fit-content;
  }
  .pstep-graphic + .pstep{margin-top:0}
  .process-track > .pstep-graphic:first-child{margin-top:0}
  .pstep-lottie{width:min(72vw,280px);height:min(72vw,280px)}
  .pstep-img{width:min(72vw,280px)}
}