/* @cap k2-director-monitor-design | Referenzmonitor: Film unbeschnitten, Leisten ausserhalb des Bildes, nur echte Daten.*/
.hero{--mon-nav:70px;--mon-rail-t:40px;--mon-rail-b:58px;--mon-bezel:10px;--mon-gap:12px;--mon-side:24px;--mon-border:1px;--mon-fit:calc((100svh - var(--mon-nav) - var(--mon-rail-t) - var(--mon-rail-b) - 2 * var(--mon-gap) - 2 * var(--mon-border)) * 16 / 9);--mon-pic-w:min(100% - 2 * var(--mon-side) - 2 * var(--mon-bezel),var(--mon-fit));--mon-w:calc(var(--mon-pic-w) + 2 * var(--mon-bezel) + 2 * var(--mon-border));padding-top:var(--mon-nav);background:radial-gradient(70% 55% at 50% 0%,#17181b 0%,#0a0a0a 72%) #0a0a0a}@media (max-width:1080px){.hero{--mon-nav:82px}}@media (max-width:480px){.hero{--mon-nav:74px}}.hero-bg{position:relative;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:var(--mon-rail-t) auto var(--mon-rail-b);box-sizing:content-box;width:var(--mon-pic-w);max-width:none;height:auto;min-height:0;max-height:none;aspect-ratio:auto;margin:var(--mon-gap) auto;padding:0 var(--mon-bezel);overflow:visible;isolation:isolate;container-type:inline-size;background:#0c0d10;border:var(--mon-border) solid #ffffff1f;border-radius:10px;box-shadow:0 0 0 1px #000,0 46px 90px -40px #000}.hero-bg #heroVid{grid-area:2/1/3/2;position:relative;inset:auto;z-index:1;display:block;width:100%;height:auto;min-height:0;aspect-ratio:16/9;object-fit:contain;opacity:1;background:transparent}.hero-bg #hero-poster{grid-area:2/1/3/2;position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:contain;background:#000}.hero-bg .hero-camera{grid-area:2/1/3/2;position:absolute;inset:0;z-index:4;pointer-events:none;color:#f4f4f5;letter-spacing:.04em}.hero-bg:has(>.hero-camera[hidden]){grid-template-rows:0 auto 0;padding:0;background:transparent;border-color:transparent;box-shadow:none}.hero-bg .hero-c{grid-area:2/1/3/2;position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:auto;max-width:none;margin:0;padding:2.8125cqi 0 2.8125cqi 5cqi;background:transparent;pointer-events:none}.hero-bg .hero-c:before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 52% 74% at 23% 53%,#000b 0%,#0008 40%,#0003 66%,transparent 84%);pointer-events:none}.hero-bg .hero-c .hero-ey{margin:0 0 clamp(14px,1.9cqi,26px);font-size:clamp(9px,.74cqi,11px);letter-spacing:.14em;gap:12px;line-height:1.6;text-shadow:0 1px 4px #000;max-width:48cqi;flex-wrap:wrap}.hero-bg .hero-c .hero-ey .badge img{height:clamp(24px,2.5cqi,34px);max-width:none}.hero-bg .hero-c h1{font-size:clamp(40px,7.1cqi,104px);line-height:.98;letter-spacing:-.055em;margin:0 0 clamp(16px,2.1cqi,30px);max-width:none;text-shadow:0 2px 18px #0005}.hero-bg .hero-c .hero-p{font-size:clamp(14px,1.36cqi,20px);line-height:1.6;max-width:max(300px,43cqi);margin:0 0 clamp(16px,2.1cqi,30px);color:#fafaf7;text-shadow:0 1px 5px #000}.hero-bg .hero-c .hero-btns{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px;align-items:center;margin:0;pointer-events:auto}.hero-bg .hero-c .hero-btns>*{flex:none;min-width:0;min-height:clamp(46px,3.9cqi,52px);padding:clamp(12px,1.15cqi,17px) clamp(16px,1.5cqi,20px);justify-content:center;font-size:10px}.hero-bg .hero-c .hero-btns .btn-gl{background:#101012c9;border-color:#bcbcbc;color:#fff}.hero-bg .hero-c a{pointer-events:auto}.hero-bg .camera-corner{width:clamp(16px,2.3cqi,34px);height:clamp(12px,1.8cqi,26px);border-color:#fff;opacity:.92;filter:drop-shadow(0 0 1px #000)}.hero-bg .camera-tl,.hero-bg .camera-tr{top:3.5%}.hero-bg .camera-bl,.hero-bg .camera-br{bottom:3.5%}.hero-bg .camera-tl,.hero-bg .camera-bl{left:3.5%}.hero-bg .camera-tr,.hero-bg .camera-br{right:3.5%}.hero-bg .camera-safe{position:absolute;inset:5%;border:1px solid #ffffff21}.hero-bg .monitor-center{position:absolute;left:50%;top:50%;width:14px;height:14px;transform:translate(-50%,-50%);opacity:.55}.hero-bg .monitor-center:before,.hero-bg .monitor-center:after{content:'';position:absolute;background:#fff;box-shadow:0 0 1px #000}.hero-bg .monitor-center:before{width:14px;height:1px;top:7px}.hero-bg .monitor-center:after{height:14px;width:1px;left:7px}.hero-bg .monitor-top,.hero-bg .monitor-bottom{position:absolute;left:calc(-1 * var(--mon-bezel));right:calc(-1 * var(--mon-bezel));display:flex;align-items:center;gap:22px;padding:0 18px;color:#f4f4f5;background:transparent;border:0}.hero-bg .monitor-top{top:calc(-1 * var(--mon-rail-t));height:var(--mon-rail-t);border-bottom:1px solid #ffffff14}.hero-bg .monitor-bottom{bottom:calc(-1 * var(--mon-rail-b));height:var(--mon-rail-b);border-top:1px solid #ffffff14;padding-right:max(18px,calc(206px - (100vw - min(100vw - 2 * var(--mon-side) - 2 * var(--mon-bezel),var(--mon-fit))) / 2 + var(--mon-bezel)))}.hero-bg .monitor-brand{display:flex;align-items:center;gap:10px;flex:none;font-family:var(--sans);font-weight:600}.hero-bg .monitor-brand b{color:#ff6066;font-size:21px;letter-spacing:-.08em;line-height:1}.hero-bg .monitor-brand span{font-family:var(--mono);font-size:8.5px;font-weight:400;letter-spacing:.16em;line-height:1.45}.hero-bg .monitor-state{display:flex;gap:8px;align-items:center;flex:none;min-width:84px;padding-left:18px;border-left:1px solid #ffffff1a;font-size:10.5px;letter-spacing:.14em}.hero-bg .monitor-state i{width:0;height:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid #f4f4f4}.hero-bg .hero-camera[data-playing="false"] .monitor-state i{width:6px;height:9px;border:0;border-right:2px solid #fff;border-left:2px solid #fff}.hero-bg .monitor-top dl,.hero-bg .monitor-bottom dl{display:flex;gap:0;margin:0;align-items:center}.hero-bg .monitor-top dl{margin-left:auto}.hero-bg .monitor-top dl>div,.hero-bg .monitor-bottom dl>div{display:grid;gap:3px;padding:0 18px;border-left:1px solid #ffffff14}.hero-bg .monitor-top dl>div:last-child{padding-right:0}.hero-bg .monitor-bottom dl>div:first-child{padding-left:0;border-left:0}.hero-bg .monitor-top dt,.hero-bg .monitor-bottom dt,.hero-bg .monitor-scope figcaption{font-size:7.5px;color:#a3a6ad;letter-spacing:.14em;line-height:1.3;white-space:nowrap}.hero-bg .monitor-top dd,.hero-bg .monitor-bottom dd{margin:0;font-size:12px;line-height:1.3;white-space:nowrap}.hero-bg .monitor-bottom .monitor-tc{font-size:22px;font-weight:500;letter-spacing:.06em;line-height:1.05}.hero-bg .monitor-timeline{position:relative;flex:1;align-self:center;height:24px;min-width:90px;border-bottom:1px solid #8b8c92;background:repeating-linear-gradient(90deg,#a1a1a540 0 1px,transparent 1px 8.3333%)}.hero-bg .monitor-timeline i{position:absolute;inset:auto auto -1px 0;width:100%;height:2px;background:#ff555d;transform:scaleX(0);transform-origin:0 50%}.hero-bg .monitor-timeline span{position:absolute;bottom:-1px;width:1px;height:10px;background:#f1f1f1}.hero-bg .monitor-scope{display:grid;gap:3px;flex:none;margin:0}.hero-bg .monitor-scope[hidden]{display:none}.hero-bg .monitor-scope canvas{display:block;width:120px;height:30px;background:#ffffff08;outline:1px solid #ffffff12}.hero-bg .monitor-project{flex:none;font-size:8.5px;letter-spacing:.14em;line-height:1.5;white-space:nowrap}@container (max-width:1180px){.hero-bg .monitor-project{display:none}}@container (max-width:860px){.hero-bg .monitor-bottom .monitor-wave{display:none}.hero-bg .monitor-top dl>div,.hero-bg .monitor-bottom dl>div{padding:0 14px}}@container (max-width:700px){.hero-bg .monitor-top .monitor-extra,.hero-bg .monitor-top .monitor-state,.hero-bg .monitor-bottom .monitor-scope{display:none}}@container (max-width:360px){.hero-bg .monitor-bottom dl>.monitor-frames{display:none}}@container (max-width:480px){.hero-bg .monitor-top,.hero-bg .monitor-bottom{gap:12px;padding:0 12px}.hero-bg .monitor-brand{gap:7px}.hero-bg .monitor-brand b{font-size:16px}.hero-bg .monitor-brand span{font-size:7px;letter-spacing:.11em}.hero-bg .monitor-top dl>div,.hero-bg .monitor-bottom dl>div{padding:0 10px}.hero-bg .monitor-top dt,.hero-bg .monitor-bottom dt{font-size:6.5px;letter-spacing:.1em}.hero-bg .monitor-top dd,.hero-bg .monitor-bottom dd{font-size:10px}.hero-bg .monitor-bottom .monitor-tc{font-size:14px;letter-spacing:.03em}.hero-bg .monitor-timeline{height:14px;min-width:60px}.hero-bg .monitor-timeline span{height:7px}}.hero-film-rail{box-sizing:border-box;width:var(--mon-w);max-width:100%;margin:0 auto;padding:6px 0 18px;background:transparent;border-bottom:0}.hero:has(#hero-camera-view[hidden]) .hero-film-rail{width:var(--mon-pic-w)}@media (max-width:760px),(max-aspect-ratio:1/1),(max-height:580px){.hero{--mon-rail-t:32px;--mon-rail-b:40px;--mon-bezel:0px;--mon-gap:4px;--mon-side:24px;--mon-border:0px}.hero-bg{grid-template-rows:var(--mon-rail-t) auto var(--mon-rail-b) auto;margin:0 auto;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}.hero-bg .monitor-top,.hero-bg .monitor-bottom{background:#0c0d10;padding-right:12px}.hero-bg .monitor-top{border-bottom:1px solid #ffffff14}.hero-bg .monitor-bottom{border-top:1px solid #ffffff14;border-bottom:1px solid #ffffff14}.hero-bg .hero-c{grid-area:4/1/5/2;position:relative;inset:auto;display:block;padding:24px 0 26px;pointer-events:auto}.hero-bg .hero-c:before{content:none}.hero-bg .hero-c .hero-ey{font-size:9px;letter-spacing:.08em;gap:9px;margin:0 0 16px;max-width:none;flex-wrap:nowrap;text-shadow:none}.hero-bg .hero-c .hero-ey .hl{width:17px;flex:none}.hero-bg .hero-c .hero-ey .badge img{height:28px}.hero-bg .hero-c h1{font-size:clamp(38px,11.2vw,64px);line-height:1.02;letter-spacing:-.05em;margin:0 0 16px;text-shadow:none}.hero-bg .hero-c .hero-p{font-size:15px;line-height:1.55;max-width:560px;margin:0 0 20px;text-shadow:none;color:#ededed}.hero-bg .hero-c .hero-btns{gap:10px}.hero-bg .hero-c .hero-btns>*{flex:1 1 220px;min-height:48px;padding:13px 14px;font-size:10px}.hero-film-rail{padding:4px 0 20px}}@media (max-width:600px){.hero{--mon-side:0px}.hero-bg .hero-c{padding:22px var(--page) 22px}.hero-bg .hero-c .hero-ey{font-size:8px;letter-spacing:.06em;gap:8px;margin-bottom:14px}.hero-bg .hero-c .hero-ey .badge img{height:26px}.hero-bg .hero-c h1{margin-bottom:14px}.hero-bg .hero-c h1 br{display:block}.hero-bg .hero-c .hero-p{font-size:14px;margin-bottom:18px}.hero-bg .hero-c .hero-btns{flex-direction:column;align-items:stretch;gap:8px}.hero-bg .hero-c .hero-btns>*{flex:none;min-height:46px;padding:12px;font-size:9px;letter-spacing:.7px}.hero-film-rail{padding:0 var(--page) 16px}}@media (prefers-reduced-motion:reduce){.hero-bg .monitor-timeline i{transition:none}}.phone-device{filter:none!important;border-radius:15.4% / 7.1%;box-shadow:0 50px 90px #0008,0 18px 32px #0004}.k2-motion,.k2-motion:focus,.k2-motion:not(:focus){position:fixed!important;right:16px!important;bottom:16px!important;left:auto!important;top:auto!important;transform:none!important;clip:auto!important;clip-path:none!important;width:auto!important;height:auto!important;opacity:1!important;overflow:visible!important;white-space:normal!important;padding:10px 14px!important;z-index:120!important}