/* de Sede Möbel – Eye Catcher Basis-Stylesheet (einmal pro Seite einbinden) */
:root{--ec-ink:#0f0f0f;--ec-red:#e4002b;--ec-red-l:#ff4d6a;--ec-grey:#f5f5f5;--ec-serif:'Instrument Serif',Georgia,'Times New Roman',serif;--ec-sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif}
.ec,.ec *{box-sizing:border-box}
.ec{display:block;width:100%;font-family:var(--ec-sans);-webkit-font-smoothing:antialiased;line-height:1.4}
.ec h3,.ec p,.ec ul,.ec li{color:inherit;margin:0}
.ec ul{list-style:none;padding:0}
.ec em{font-style:italic}
.ec a{text-decoration:none;transition:opacity .2s}
.ec a:hover{opacity:.85}
.ec a:focus-visible{outline:2px solid var(--ec-red);outline-offset:3px}
.ec-pct::after{content:counter(ecpct)}
.ec[data-off] *,.ec[data-off] *::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){.ec *,.ec *::after{animation-play-state:paused!important}}
@property --ec-pct{syntax:'<integer>';inherits:false;initial-value:0}
@keyframes ec-mq{to{transform:translateX(-50%)}}
@keyframes ec-mqr{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@keyframes ec-wc{0%{opacity:0;transform:translateY(.5em)}5%,30%{opacity:1;transform:none}36%,100%{opacity:0;transform:translateY(-.5em)}}
@keyframes ec-typeq{0%,8%{clip-path:inset(0 100% 0 0)}45%,85%{clip-path:inset(0 0 0 0)}95%,100%{clip-path:inset(0 100% 0 0)}}
@keyframes ec-blink{50%{opacity:0}}
@keyframes ec-res{0%,45%{opacity:0;transform:translateY(16px)}52%,88%{opacity:1;transform:none}95%,100%{opacity:0;transform:none}}
@keyframes ec-stamp{0%,30%{opacity:0;transform:scale(2.6) rotate(-24deg)}36%{opacity:1;transform:scale(.94) rotate(-8deg)}40%,90%{opacity:1;transform:scale(1) rotate(-8deg)}100%{opacity:0;transform:scale(1) rotate(-8deg)}}
@keyframes ec-chk{0%{opacity:.3}6%,82%{opacity:1}92%,100%{opacity:.3}}
@keyframes ec-tick{0%{transform:scale(0)}6%,82%{transform:scale(1)}92%,100%{transform:scale(0)}}
@keyframes ec-ring{0%{transform:scale(1);opacity:.55}100%{transform:scale(2.6);opacity:0}}
@keyframes ec-mark{0%{background-size:0% 38%}12%,85%{background-size:100% 38%}95%,100%{background-size:0% 38%}}
@keyframes ec-strike{0%{transform:scaleX(0)}10%,85%{transform:scaleX(1)}95%,100%{transform:scaleX(0)}}
@keyframes ec-dim{0%,8%{opacity:1}16%,85%{opacity:.35}95%,100%{opacity:1}}
@keyframes ec-popin{0%,50%{opacity:0;transform:translateY(20px)}60%,90%{opacity:1;transform:none}100%{opacity:0;transform:none}}
@keyframes ec-flip{0%,15%{transform:rotateY(0)}25%,60%{transform:rotateY(180deg)}70%,100%{transform:rotateY(360deg)}}
@keyframes ec-pin{0%{transform:translateY(-300%);opacity:0}10%{transform:translateY(0);opacity:1}14%{transform:translateY(-18%)}18%,88%{transform:translateY(0);opacity:1}100%{transform:translateY(0);opacity:0}}
@keyframes ec-acc{0%,2%{max-height:0;opacity:0}6%,28%{max-height:8em;opacity:1}32%,100%{max-height:0;opacity:0}}
@keyframes ec-accl{0%{transform:scaleX(0)}30%{transform:scaleX(1)}31%,100%{transform:scaleX(0)}}
@keyframes ec-stack{0%,20%{transform:none;opacity:1;z-index:4}25%{transform:translateX(110%) rotate(10deg);opacity:0;z-index:4}26%{transform:translateY(-42px) scale(.85);opacity:0;z-index:1}30%,45%{transform:translateY(-42px) scale(.85);opacity:.5;z-index:1}50%,70%{transform:translateY(-28px) scale(.9);opacity:.75;z-index:2}75%,95%{transform:translateY(-14px) scale(.95);opacity:1;z-index:3}100%{transform:none;opacity:1;z-index:4}}
@keyframes ec-spin{to{transform:rotate(360deg)}}
@keyframes ec-tw{0%{clip-path:inset(0 100% 0 0);opacity:1}12%,28%{clip-path:inset(0 0 0 0);opacity:1}33%{clip-path:inset(0 100% 0 0);opacity:1}33.4%,100%{clip-path:inset(0 100% 0 0);opacity:0}}
@keyframes ec-travel{0%{left:0%}85%,100%{left:100%}}
@keyframes ec-pass{0%{transform:scale(1);opacity:.45}4%{transform:scale(1.25);opacity:1}12%,100%{transform:scale(1);opacity:1}}
@keyframes ec-load{0%{--ec-pct:0}75%,100%{--ec-pct:100}}
@keyframes ec-loadbar{0%{transform:scaleX(0)}75%,100%{transform:scaleX(1)}}
@keyframes ec-done{0%,72%{opacity:0;transform:translateY(10px)}78%,96%{opacity:1;transform:none}100%{opacity:0}}
@keyframes ec-knob{0%,40%{transform:translateX(0)}50%,90%{transform:translateX(100%)}100%{transform:translateX(0)}}
@keyframes ec-trk{0%,40%{opacity:0}50%,90%{opacity:1}100%{opacity:0}}
@keyframes ec-swapA{0%,40%{opacity:1;transform:none}48%,92%{opacity:0;transform:translateY(-10%)}100%{opacity:1;transform:none}}
@keyframes ec-swapB{0%,42%{opacity:0;transform:translateY(25%)}50%,92%{opacity:1;transform:none}100%{opacity:0;transform:translateY(25%)}}
@keyframes ec-notif{0%{opacity:0;transform:translateX(40px)}6%,80%{opacity:1;transform:none}90%,100%{opacity:0;transform:translateY(-12px)}}
@keyframes ec-breathe{0%,100%{letter-spacing:-.04em;transform:scale(1)}50%{letter-spacing:0em;transform:scale(1.03)}}
@keyframes ec-nudge{0%,55%,100%{transform:translateX(0)}70%{transform:translateX(7px)}}
@keyframes ec-grow{0%{transform:scaleY(0)}60%,90%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@keyframes ec-rise{0%{transform:translateY(110%);opacity:0}12%,80%{transform:none;opacity:1}92%,100%{transform:translateY(-40%);opacity:0}}
@keyframes ec-wipe{0%{clip-path:inset(0 100% 0 0)}25%,85%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
@keyframes ec-splitT{0%,15%,85%,100%{transform:none}35%,65%{transform:translateX(-7%)}}
@keyframes ec-splitB{0%,15%,85%,100%{transform:none}35%,65%{transform:translateX(7%)}}
@keyframes ec-echo{0%,100%{opacity:.12}50%{opacity:.6}}
@keyframes ec-ul{0%{transform:scaleX(0)}12%,80%{transform:scaleX(1)}92%,100%{transform:scaleX(0)}}
@keyframes ec-tkr{0%,20%{transform:translateY(0)}25%,45%{transform:translateY(-1.2em)}50%,70%{transform:translateY(-2.4em)}75%,95%{transform:translateY(-3.6em)}100%{transform:translateY(-4.8em)}}
@keyframes ec-sew{0%{clip-path:inset(0 100% 0 0);opacity:1}85%{clip-path:inset(0 0 0 0);opacity:1}95%,100%{clip-path:inset(0 0 0 0);opacity:0}}
@keyframes ec-fx{0%{transform:scaleX(0)}20%,85%{transform:scaleX(1)}100%{transform:scaleX(1);opacity:0}}
@keyframes ec-fy{0%{transform:scaleY(0)}20%,85%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@keyframes ec-swing{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
