/* Schnittspur: one family of four frames, from raw ideas to the next edit. */
.cp .cm-rail{position:fixed;left:12px;top:40%;z-index:20;writing-mode:vertical-rl;font-size:9px;letter-spacing:.12em;pointer-events:none;mix-blend-mode:difference;color:#fff;display:flex;gap:20px;align-items:center}
.cm-rail::before{content:"";width:1px;height:110px;background:#fff4}.cm-rail i{position:absolute;top:0;left:4px;width:3px;height:110px;background:#ff6eaf;transform:scaleY(var(--journey,0));transform-origin:top}
.cm-score{position:relative;margin:50px 0 30px;--ink:#225cf2;color:var(--ink)}
.cm-score svg{display:block;width:100%;height:clamp(150px,19vw,290px);overflow:visible}
.cm-score rect,.cm-score path,.cm-score circle{vector-effect:non-scaling-stroke}
.cm-score .cm-wire{fill:none;stroke:currentColor;stroke-width:1;opacity:.35}
.cm-score .cm-cell rect{fill:#fff;stroke:currentColor;stroke-width:1.5}.cm-score .cm-cell:nth-of-type(2) rect{fill:#ff6eaf;stroke:#111}.cm-score .cm-cell text{fill:#111;font-family:Arial,sans-serif;font-size:10px;letter-spacing:1px}
.cm-score .cm-cell path{stroke:#111;stroke-width:1;fill:none}
.cm-score>figcaption{display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.07em;padding-top:20px;border-top:1px solid #1113}.cm-score>figcaption span:last-child{text-align:right}
.cp-problem .cm-score{margin:0 0 45px}.cp-turn .cm-score{--ink:#eeebdc;max-width:850px;margin:45px 0 0 auto}.cp-turn .cm-score>figcaption{border-color:#fff5}
.cp-loop .cm-score{margin:20px 0 0}.cp-loop .cm-score svg{height:130px}.cp-loop .cm-score>figcaption{font-size:8px;padding-top:12px}.cp-loop .cp-counter{font-size:clamp(90px,12vw,190px);margin-top:30px}.cp-loop-mark{display:none}
.cp-os .cm-score{--ink:#eeebdc;margin:35px 0}.cp-os .cm-score>figcaption{border-color:#fff5}.cp-ninety .cm-score{max-width:900px;margin-inline:auto}
.cp-os .cp-os-sheet .cm-score{--ink:#225cf2}.cp-os .cp-os-sheet .cm-score>figcaption{border-color:#225cf240}
.cp-offer-scope>div,.cp-phases li,.cp-loop-steps li,.cp-comparison dl>div,.cp-start ol>li{position:relative}
.cm-tracked::after{content:"";position:absolute;top:-1px;left:0;height:2px;width:100%;background:var(--cm-ink,#225cf2);transform:scaleX(var(--row-progress,0));transform-origin:left;pointer-events:none}
.cm-tracked.cm-active dt,.cm-tracked.cm-active h3{color:var(--cm-ink,#225cf2)}.cp-start .cm-tracked{--cm-ink:#ff6eaf}
.cp .cp-compare-note{margin-top:70px;padding-top:25px;border-top:1px solid #aaa;line-height:1.65}
.cp-hero-media svg{translate:var(--media-depth-x,0px) var(--media-depth-y,0px)}
.cp-hero-stamp{box-shadow:8px 10px 0 #ff6eaf19}
.cp-problem::before{content:"";position:absolute;top:-24px;left:0;width:100%;height:25px;background:#fff;clip-path:polygon(0 100%,100% 0,100% 100%)}
.cp-turn h2{translate:var(--turn-drift,0px) 0}
.cm-signature{position:relative;margin:75px calc(-1 * var(--cp-pad)) 55px;background:#090a0b;color:#fff}
.cm-stage{position:relative;min-height:730px;padding:45px var(--cp-pad);overflow:hidden;isolation:isolate}
.cm-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 65%,#302128,transparent 70%);z-index:-1}
.cm-stage-top{display:flex;justify-content:space-between;gap:30px;font-size:10px;letter-spacing:.09em}.cm-stage-top span:last-child{color:#ff6eaf}
.cp .cm-stage h3{font-size:clamp(36px,4.8vw,82px);font-weight:500;letter-spacing:-.055em;line-height:1.06;max-width:15ch;margin:28px 0 0}.cm-stage h3 i{color:#ff6eaf}
.cm-aperture{position:relative;height:440px;width:100%;max-width:1300px;margin:auto;perspective:1100px;transform-style:preserve-3d}
.cm-output{position:absolute;left:50%;top:50%;margin:0;width:28%;height:56%;transform:translate(-50%,-50%);transform-origin:center;will-change:transform;box-shadow:0 20px 50px #0005;border:1px solid #ffffff65;background:#111;overflow:hidden}
.cm-output svg{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(.68)}
.cm-output:nth-child(2){width:18%;height:80%;border-color:#ff6eaf}.cm-output:nth-child(3){width:22%;height:68%;border-color:#225cf2}.cm-output:nth-child(4){width:20%;height:72%}
.cm-output figcaption{position:absolute;inset:12px 12px auto;display:flex;justify-content:space-between;gap:10px;font-size:9px;letter-spacing:.04em}.cm-output strong{position:absolute;inset:auto 12px 30px;font-size:clamp(18px,2.6vw,42px);line-height:1.04;letter-spacing:-.05em;max-width:12ch}.cm-output:first-child strong{font-family:Georgia,serif;font-weight:400;font-style:italic}.cm-output:nth-child(2) strong{color:#ff6eaf}.cm-output:nth-child(3) strong{background:#225cf2;padding:10px;font-size:clamp(18px,2vw,29px)}
.cm-output::after{content:"";position:absolute;bottom:12px;left:12px;right:12px;height:5px;background:repeating-linear-gradient(90deg,#ff6eaf 0 12%,transparent 12% 14%,#eeebdc 14% 36%,transparent 36% 38%)}
.cm-stage-bottom{display:flex;justify-content:space-between;gap:30px;font-size:12px;line-height:1.5;align-items:end}.cm-stage-bottom p{max-width:36ch}.cm-stage-bottom b{color:#ff6eaf;font-weight:400}
.cm-scrub-line{height:2px;background:#ffffff30;margin-top:30px;overflow:hidden}.cm-scrub-line span{display:block;height:100%;background:#ff6eaf;transform:scaleX(var(--signature-progress,0));transform-origin:left}
.cp.cm-enabled:not(.cm-rest) .cm-signature{height:230svh}.cp.cm-enabled:not(.cm-rest) .cm-stage{position:sticky;top:70px;height:calc(100svh - 70px);min-height:700px;display:flex;flex-direction:column}.cp.cm-enabled:not(.cm-rest) .cm-aperture{flex:1;min-height:320px}.cp.cm-enabled:not(.cm-rest) .cm-stage-bottom{margin-top:auto}
.cm-rest .cm-output,.cp:not(.cm-enabled) .cm-output{position:relative;left:auto;top:auto;transform:none!important;opacity:1!important;width:auto;height:280px;will-change:auto}
.cm-rest .cm-aperture,.cp:not(.cm-enabled) .cm-aperture{height:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:35px 0}
.cm-rest .cm-stage{height:auto}.cm-rest .cm-scrub-line{display:none}
.cp.cm-enabled:not(.cm-rest) .cm-output{width:var(--output-w);height:var(--output-h)}
.cm-proof-art{height:480px;background:#111113;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#ff6eaf;perspective:800px}
.cm-proof-art span{position:absolute;width:70%;height:60%;border:1px solid #ff6eaf;transform:translate(calc(var(--layer) * 22px),calc(var(--layer) * -18px)) rotate(calc(-12deg + var(--layer) * 7deg + var(--proof-turn,0deg)));background:#111113}.cm-proof-art span:nth-child(2){border-color:#eeebdc}.cm-proof-art span:nth-child(3){border-color:#225cf2}.cm-proof-art b{position:relative;font-size:clamp(60px,10vw,160px);font-weight:500;letter-spacing:-.08em;line-height:.85;transform:rotate(-7deg)}
.cm-proof-art::after{content:"KONZEPT / PRODUKTION / UMSETZUNG";position:absolute;bottom:24px;left:24px;font-size:9px;letter-spacing:.08em;color:#fff}
.cp-proof-medium{rotate:0}.cp .cp-work-invitation{align-items:center}
.cp [data-offer-cta]>span{translate:var(--magnet-x,0px) var(--magnet-y,0px);transition:translate .25s ease-out}
.cm-format-hover .cp-format-frame svg{transform:scale(1.06)}.cp-format-frame svg{transition:transform .7s,filter .6s}
.cp .cp-format-stage>.cp-frame-marks{inset:38px 28px auto;height:45px}.cp .cp-format-stage>.cp-frame-marks b{top:18px;min-width:50px;text-align:left}
.cp .cp-format-buttons button{position:relative;padding-right:25px}.cp .cp-format-buttons button[aria-pressed=true]::after{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.cp .cp-edit-overlay strong{height:3.15em;max-width:none;width:100%;box-sizing:content-box;padding:0;background:none}
.cp .cp-edit-overlay small{height:40px}.cp .cp-edit-bars{background:repeating-linear-gradient(90deg,#ff6eaf 0 12%,transparent 12% 14%,#eeebdc 14% 30%,transparent 30% 32%)}.cp .cp-edit-bars span{display:none!important}
.cp .cp-format-stage[data-edit=web] .cp-edit-bars{background:linear-gradient(90deg,#eeebdc 0 49%,transparent 49% 51%,#ff6eaf 51%)}.cp .cp-format-stage[data-edit=ads] .cp-edit-bars{background:linear-gradient(90deg,#225cf2 0 30%,transparent 30% 32%,#ff6eaf 32% 46%,transparent 46% 48%,#eeebdc 48% 80%,transparent 80% 82%,#ff6eaf 82%)}
.cm-signature-state{width:220px;min-height:24px;flex-shrink:0;text-align:left}
.cp-os-sheet{transform:perspective(1000px) rotateY(var(--sheet-turn,0deg));transform-origin:left center}
.cp-duet-shot:first-child{translate:0 var(--duet-shift,0px)}.cp-duet-shot:nth-child(2){translate:0 calc(var(--duet-shift,0px) * -1)}
@media(min-width:1800px){.cm-stage{padding-top:55px}.cm-aperture{max-width:1600px}}
@media(max-width:800px){.cm-rail{left:5px;font-size:7px}.cm-score svg{height:180px}.cp-loop .cm-score svg{height:100px}.cm-output figcaption{font-size:7px;inset:9px 9px auto}.cm-output strong{font-size:21px}.cm-output:nth-child(3) strong{font-size:18px}.cm-stage{min-height:700px}.cm-proof-art{height:390px}}
@media(max-width:550px){.cm-rail{display:none}.cm-score{margin:30px 0}.cm-score svg{height:135px}.cm-score>figcaption{font-size:8px;gap:14px}.cp-loop .cm-score{margin-bottom:35px}.cp-loop .cm-score svg{height:125px}.cm-signature{margin-top:45px}.cm-stage{padding-top:26px;min-height:680px}.cm-stage-top{font-size:8px;gap:15px}.cp .cm-stage h3{font-size:36px;max-width:14ch;margin-top:24px}.cm-aperture{height:360px;perspective:850px}.cm-output,.cm-output:nth-child(n){width:42%;height:40%}.cm-output:nth-child(2){height:47%}.cm-output:nth-child(3){height:44%}.cm-output:nth-child(4){height:44%}.cm-output strong,.cm-output:nth-child(3) strong{font-size:18px;bottom:25px;inset-inline:8px}.cm-output figcaption{font-size:7px;gap:3px;inset:8px 8px auto}.cm-output:nth-child(3) strong{padding:5px}.cm-stage-bottom{font-size:10px;gap:20px}.cm-stage-bottom p{max-width:23ch}.cp.cm-enabled:not(.cm-rest) .cm-signature{height:210svh}.cp.cm-enabled:not(.cm-rest) .cm-stage{top:70px;min-height:620px}.cp.cm-enabled:not(.cm-rest) .cm-aperture{min-height:320px}.cm-rest .cm-aperture,.cp:not(.cm-enabled) .cm-aperture{grid-template-columns:1fr 1fr;gap:14px}.cm-rest .cm-output,.cp:not(.cm-enabled) .cm-output{width:auto;height:220px}.cm-proof-art{height:340px}.cp .cp-compare-note{margin-top:50px}.cp-duet-shot{translate:none!important}}
@media(prefers-reduced-motion:reduce){.cp .cm-signature{height:auto!important}.cp .cm-stage{position:relative!important;top:0!important;height:auto!important}.cm-rail{display:none}.cp-turn h2,.cp-hero-media svg,.cp-duet-shot{translate:none!important}.cp-os-sheet{transform:none}.cm-output{will-change:auto}}
@media(max-width:550px){.cp .cm-rail{display:none}}
@media(max-width:550px){.cm-signature-state{width:130px;min-height:30px}.cp .cp-format-stage>.cp-frame-marks{inset:28px 22px auto}.cp .cp-edit-overlay strong{font-size:25px}}
@media(max-width:550px){.cm-output:first-child strong{font-size:clamp(12px,3.5vw,18px);bottom:22px;inset-inline:8px}}
@media(prefers-reduced-motion:reduce){.cp .cm-rail{display:none}}
@media(max-width:550px) and (max-height:740px){.cp.cm-enabled:not(.cm-rest) .cm-stage{min-height:570px;padding-top:22px;padding-bottom:22px}.cp.cm-enabled:not(.cm-rest) .cm-aperture{min-height:260px}.cp .cm-stage h3{font-size:30px;max-width:17ch;margin-top:18px}.cm-stage-bottom{font-size:9px}.cm-scrub-line{margin-top:16px}}
