/* WebDesk Referenzen V2 – ergänzende Styles auf Basis der bestehenden app.css */
.wdref-hero{padding-top:82px;padding-bottom:54px;position:relative;overflow:hidden}
.wdref-hero::before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse 35% 85% at 4% 35%,rgba(22,199,239,.09),transparent),radial-gradient(ellipse 30% 80% at 96% 20%,rgba(242,10,140,.07),transparent);pointer-events:none}
.wdref-hero h1{max-width:1040px;margin:20px auto 0}
.wdref-hero p{max-width:810px;margin-top:22px}
.wdref-hero-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px;margin-top:30px}
.wdref-hero-facts{display:inline-flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0;margin-top:36px;padding:12px 17px;border:1px solid rgba(17,27,109,.1);border-radius:20px;background:rgba(255,255,255,.65);box-shadow:0 14px 36px rgba(17,27,109,.06);backdrop-filter:blur(16px)}
.wdref-hero-facts span{padding:3px 19px;color:#64718e;font-size:.82rem;font-weight:700;border-right:1px solid rgba(17,27,109,.13)}
.wdref-hero-facts span:last-child{border-right:0}
.wdref-hero-facts strong{font-weight:950;font-size:1.06rem;color:var(--navy);margin-right:5px}
.wdref-section{padding-top:56px;padding-bottom:105px;scroll-margin-top:95px}
.wdref-section-head{align-items:flex-end;margin-bottom:34px}
.wdref-section-head h2{margin-top:17px}
.wdref-section-side{width:min(435px,100%);display:grid;gap:19px;justify-items:end}
.wdref-section-side p{text-align:right;margin:0;line-height:1.65;font-size:.93rem}
.wdref-filters{display:flex;gap:6px;padding:5px;border-radius:15px;background:rgba(255,255,255,.78);border:1px solid rgba(17,27,109,.11);box-shadow:0 8px 24px rgba(17,27,109,.06)}
.wdref-filter{border:0;padding:10px 17px;min-height:41px;border-radius:11px;color:#4b5a7b;background:transparent;font-weight:800;font-size:.84rem;transition:background .22s,color .22s,box-shadow .22s}
.wdref-filter:hover{color:var(--navy);background:rgba(22,95,219,.07)}
.wdref-filter.is-active{background:linear-gradient(115deg,var(--navy),var(--blue) 58%,var(--violet));color:#fff;box-shadow:0 9px 17px rgba(22,95,219,.2)}
.wdref-filter:focus-visible,.wdref-link:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.wdref-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:23px}
.wdref-card{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid rgba(17,27,109,.12);border-radius:27px;background:rgba(255,255,255,.88);box-shadow:0 16px 45px rgba(31,39,97,.09);transition:box-shadow .32s ease,transform .32s ease,border-color .32s ease}
.wdref-card:hover{transform:translateY(-5px);border-color:rgba(22,95,219,.23);box-shadow:0 26px 64px rgba(31,39,97,.15)}
.wdref-card[hidden]{display:none!important}
.wdref-stage{position:relative;height:300px;display:grid;place-items:center;isolation:isolate;overflow:hidden;padding:32px 26px 28px}
.wdref-stage::before,.wdref-stage::after{content:"";position:absolute;pointer-events:none;z-index:-1;border:1px solid rgba(255,255,255,.53);border-radius:50%}
.wdref-stage::before{width:410px;height:410px;right:-155px;top:-175px}
.wdref-stage::after{width:350px;height:350px;left:-160px;bottom:-235px}
.wdref-stage--satmed{background:linear-gradient(145deg,#f6fbff 5%,#d8ebff 68%,#edf4ff)}
.wdref-stage--inkerella{background:linear-gradient(135deg,#270b20 0%,#4c133d 55%,#8a295e 100%)}
.wdref-stage--becker{background:linear-gradient(135deg,#f4fbff,#cdefff 65%,#eaf5ff)}
.wdref-stage--invoice{background:linear-gradient(135deg,#101c49 0%,#1f3a78 64%,#254ea4 100%)}
.wdref-stage-spot{position:absolute;width:440px;height:255px;left:50%;top:0;transform:translateX(-50%);z-index:-1;background:radial-gradient(ellipse,rgba(255,255,255,.88),transparent 70%);opacity:.65;pointer-events:none}
.wdref-stage--inkerella .wdref-stage-spot{background:radial-gradient(ellipse,rgba(251,115,192,.48),transparent 72%)}
.wdref-stage--invoice .wdref-stage-spot{background:radial-gradient(ellipse,rgba(100,177,255,.45),transparent 72%)}
.wdref-device{width:min(100%,515px);z-index:1;overflow:hidden;border:5px solid rgba(13,35,78,.89);background:#fff;border-radius:16px;box-shadow:0 18px 35px rgba(17,40,91,.25),0 2px 0 rgba(255,255,255,.55),0 0 0 1px rgba(255,255,255,.6);transform:perspective(1100px) rotateX(2.3deg) rotateY(-2.4deg) translateY(3px);transition:transform .45s cubic-bezier(.2,.6,.2,1),box-shadow .45s}
.wdref-card:hover .wdref-device{transform:perspective(1100px) rotateX(0) rotateY(0) translateY(-4px);box-shadow:0 25px 50px rgba(15,37,85,.28),0 0 0 1px rgba(255,255,255,.72)}
.wdref-stage--inkerella .wdref-device{border-color:#21111d;box-shadow:0 20px 40px rgba(12,1,17,.42),0 0 23px rgba(244,50,140,.19)}
.wdref-stage--invoice .wdref-device{border-color:#0c1731;box-shadow:0 20px 43px rgba(1,6,20,.47),0 0 22px rgba(62,156,255,.22)}
.wdref-device-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;height:27px;padding:0 10px;color:#556280;font-weight:750;font-size:.65rem;background:linear-gradient(180deg,#f9fbff,#e8edf8);white-space:nowrap;overflow:hidden}
.wdref-device-bar>span:nth-child(2){overflow:hidden;text-overflow:ellipsis}
.wdref-dots{display:flex;gap:4px;flex-shrink:0}.wdref-dots i{width:6px;height:6px;border-radius:50%;background:#fd789d}.wdref-dots i:nth-child(2){background:#f6ca68}.wdref-dots i:nth-child(3){background:#62d9bd}
.wdref-bar-icon{color:#6b83aa}
.wdref-device-screen{position:relative;height:229px;overflow:hidden;background:#f7faff}
.wdref-device-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;image-rendering:auto}
.wdref-device--invoice .wdref-device-screen{background:#07132f;display:flex;align-items:start;justify-content:center}
.wdref-device--invoice .wdref-device-screen img{object-fit:contain;object-position:center top}
.wdref-stage-label{position:absolute;z-index:2;right:18px;bottom:14px;padding:8px 12px;border:1px solid rgba(255,255,255,.66);background:rgba(255,255,255,.87);backdrop-filter:blur(10px);color:#164b86;font-size:.67rem;font-weight:850;letter-spacing:.03em;border-radius:999px;box-shadow:0 5px 18px rgba(16,46,93,.13)}
.wdref-stage--inkerella .wdref-stage-label{color:#a42669;background:rgba(255,240,251,.93)}
.wdref-stage--invoice .wdref-stage-label{color:#f7fbff;background:rgba(30,55,105,.88);border-color:rgba(255,255,255,.23)}
.wdref-card-content{flex:1;display:flex;flex-direction:column;padding:27px 30px 28px;min-height:234px}
.wdref-kicker{display:flex;justify-content:space-between;gap:14px;color:#5468a2;font-weight:900;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}
.wdref-kicker span:last-child{color:#a8aec2;white-space:nowrap}
.wdref-card h3{font-weight:950;font-size:clamp(1.65rem,2.7vw,2.15rem);letter-spacing:-.05em;line-height:1.08;margin:12px 0 13px;color:var(--ink)}
.wdref-card--inkerella .wdref-kicker span:first-child{color:#d32288}
.wdref-title-muted{color:#216ec0}
.wdref-card-content p{color:var(--muted);font-size:.94rem;line-height:1.7;margin:0 0 23px}
.wdref-card-foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.wdref-link{font-size:.86rem;padding:12px 16px;border-radius:12px}
.wdref-link--pink{background:linear-gradient(110deg,#792257,#cf287e 65%,#f04d9b);box-shadow:0 15px 27px rgba(196,35,127,.2)}
.wdref-external{color:#919ab3;font-size:.72rem;font-weight:750;overflow-wrap:anywhere}
.wdref-work-status{display:inline-flex;align-items:center;gap:10px;border-radius:12px;padding:10px 15px;color:#fff;background:linear-gradient(105deg,#ad1f64,#ef207e);box-shadow:0 9px 25px rgba(234,38,111,.23);font-size:1.03rem;letter-spacing:.075em;font-weight:950;line-height:1}
.wdref-work-status::before{content:"";width:9px;height:16px;border-left:3px solid rgba(255,255,255,.85);border-right:3px solid rgba(255,255,255,.85);transform:skew(-23deg)}
.wdref-soon{color:#747f9d;font-size:.76rem;font-weight:800}
.wdref-cta{padding:0 0 95px}
@media(max-width:1060px){.wdref-stage{height:258px;padding-inline:18px}.wdref-device-screen{height:193px}.wdref-card-content{padding:23px}.wdref-card-content p{font-size:.87rem}}
@media(max-width:820px){.wdref-hero{padding-top:66px;padding-bottom:25px}.wdref-section{padding-top:45px;padding-bottom:77px}.wdref-section-head{align-items:start}.wdref-section-side{width:100%;justify-items:start}.wdref-section-side p{text-align:left}.wdref-grid{grid-template-columns:1fr}.wdref-stage{height:315px}.wdref-device{width:min(100%,600px)}.wdref-device-screen{height:247px}.wdref-card-content{min-height:0;padding:28px}.wdref-cta{padding-bottom:55px}}
@media(max-width:560px){.wdref-hero{padding-top:44px}.wdref-hero h1{font-size:clamp(2.15rem,9vw,3.2rem)}.wdref-hero p{font-size:.98rem}.wdref-hero-actions .btn{width:100%;max-width:330px}.wdref-hero-facts{margin-top:28px;width:100%;gap:0;padding:10px 5px}.wdref-hero-facts span{padding:5px 9px;font-size:.69rem}.wdref-hero-facts strong{display:block;font-size:1rem}.wdref-section-head{margin-bottom:26px}.wdref-section-head h2{font-size:2.3rem}.wdref-filters{width:100%}.wdref-filter{flex:1;padding:10px}.wdref-grid{gap:18px}.wdref-card{border-radius:22px}.wdref-stage{height:220px;padding:15px 13px 19px}.wdref-device{border-width:4px;border-radius:12px}.wdref-device-bar{height:21px;font-size:.51rem}.wdref-dots i{width:5px;height:5px}.wdref-device-screen{height:163px}.wdref-stage-label{font-size:.55rem;padding:6px 9px;bottom:8px;right:8px}.wdref-card-content{padding:24px 20px}.wdref-card h3{font-size:1.8rem}.wdref-card-foot{align-items:flex-start}.wdref-soon{font-size:.71rem}}
@media(max-width:380px){.wdref-stage{height:195px}.wdref-device-screen{height:140px}.wdref-work-status{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){.wdref-card,.wdref-device,.wdref-filter{transition:none!important}.wdref-card:hover{transform:none}.wdref-card:hover .wdref-device{transform:none}}