/* 360Web — Referenzen Hero Projektvorschau */
.werke{--wk-brand:#1a4bf0;--wk-brand-tint:#eff4fe;--wk-akzent:#7fb0ff;--wk-dark:#06233f;--wk-text:#072034;--wk-text-2:#2c3e51;--wk-muted:#55677a;--wk-muted-2:#8593a3;--wk-on-dark:#c2d2e2;--wk-hell:#f4f8fd;--wk-line:rgba(6,35,63,.13);--wk-line-soft:rgba(6,35,63,.07);--wk-radius:12px;--wk-radius-xs:6px;--wk-shadow:0 34px 70px -42px rgba(7,32,52,.58);--wk-display:"Familjen Grotesk",ui-sans-serif,system-ui,sans-serif;--wk-body:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;width:min(100%,590px);margin-left:auto;background:#fff;border:1px solid var(--wk-line);border-radius:var(--wk-radius);overflow:hidden;box-shadow:var(--wk-shadow);font-family:var(--wk-body);color:var(--wk-text);font-size:16px;line-height:1.55;text-align:left;-webkit-font-smoothing:antialiased}
.werke *{box-sizing:border-box}.wk-leiste{display:flex;align-items:center;gap:11px;padding:11px 13px;border-bottom:1px solid var(--wk-line-soft);background:#f8fafc}.wk-punkte{display:flex;gap:5px;flex:none}.wk-punkte i{width:8px;height:8px;border-radius:50%;background:#cbd5df;display:block}.wk-adresse{flex:1;min-width:0;display:flex;align-items:center;gap:8px;background:#fff;border:1px solid rgba(6,35,63,.1);border-radius:7px;padding:7px 10px;font-size:12px;color:var(--wk-muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;box-shadow:inset 0 1px 1px rgba(7,32,52,.02)}.wk-adresse svg{flex:none;color:var(--wk-muted-2)}.wk-adresse b{font-weight:600;color:var(--wk-text);overflow:hidden;text-overflow:ellipsis}.wk-live{flex:none;display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--wk-brand)}.wk-live:before{content:"";width:6px;height:6px;border-radius:50%;background:#20a66a;box-shadow:0 0 0 3px rgba(32,166,106,.12)}
.wk-tafel{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--wk-dark)}.wk-tafel:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to bottom,rgba(6,35,63,.02) 42%,rgba(6,35,63,.88) 100%)}.wk-tafel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:0;transition:opacity .45s ease,transform .75s cubic-bezier(.16,1,.3,1)}.wk-tafel img.an{opacity:1}.wk-tafel:hover img.an{transform:scale(1.018)}.wk-text{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:54px 22px 18px;color:#fff;display:grid;gap:4px;background:linear-gradient(to top,rgba(6,35,63,.96) 18%,rgba(6,35,63,.72) 56%,transparent)}.wk-art-gross{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#9bc0ff}.wk-text b{font-family:var(--wk-display);font-weight:700;letter-spacing:-.032em;font-size:clamp(1.18rem,1.7vw,1.5rem);line-height:1.12;word-break:break-word}.wk-staerke{font-size:12.5px;line-height:1.45;color:#d4e0eb;max-width:48ch}.wk-cta{display:inline-flex;align-items:center;gap:8px;margin-top:5px;font-size:12.5px;font-weight:700;color:#fff}.wk-cta svg{transition:transform .25s ease}.wk-tafel:hover .wk-cta svg{transform:translateX(4px)}.wk-art-gross,.wk-text b,.wk-staerke{transition:opacity .16s ease,transform .16s ease}.werke.wechsel .wk-art-gross,.werke.wechsel .wk-text b,.werke.wechsel .wk-staerke{opacity:0;transform:translateY(3px)}
.wk-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:12px;background:#fff;border-top:1px solid var(--wk-line-soft)}.wk-zeile{position:relative;display:grid;gap:2px;align-content:center;min-height:58px;padding:9px 11px;border:1px solid var(--wk-line-soft);border-radius:8px;background:#fbfcfe;font:inherit;text-align:left;cursor:pointer;overflow:hidden;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}.wk-zeile:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:transparent}.wk-zeile:hover{background:#f6f9fd;border-color:rgba(26,75,240,.2);transform:translateY(-1px)}.wk-zeile:focus-visible{outline:2px solid var(--wk-brand);outline-offset:2px}.wk-zeile.an{background:var(--wk-brand-tint);border-color:rgba(26,75,240,.28);box-shadow:0 7px 18px -14px rgba(26,75,240,.8)}.wk-zeile.an:before{background:var(--wk-brand)}.wk-domain{font-size:12.5px;font-weight:700;letter-spacing:-.015em;color:var(--wk-text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wk-zeile.an .wk-domain{color:var(--wk-brand)}.wk-art{font-size:10.5px;color:var(--wk-muted-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wk-fuss{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;padding:12px 15px;border-top:1px solid var(--wk-line-soft);background:#f8fafc;font-size:11.5px;color:var(--wk-muted)}.wk-fuss a{font-weight:700;color:var(--wk-brand);white-space:nowrap}.wk-fuss a:hover{text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.werke{width:100%;margin:0}.wk-index{grid-template-columns:1fr 1fr}.wk-fuss{align-items:flex-start;flex-direction:column}.wk-tafel{aspect-ratio:4/3}.wk-text{padding:48px 16px 15px}}
@media(max-width:460px){.wk-punkte{display:none}.wk-index{grid-template-columns:1fr}.wk-art{display:none}.wk-zeile{min-height:48px}.wk-leiste{padding:10px}.wk-live{font-size:9.5px}}
@media(prefers-reduced-motion:reduce){.wk-tafel img,.wk-art-gross,.wk-text b,.wk-staerke,.wk-zeile,.wk-cta svg{transition:none}}