.sv-titel{display:block}@media (min-width:1280px){.sv-titel{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:baseline;display:grid}.sv-titel__links{grid-area:1/1;justify-self:start}.sv-titel__mitte{grid-area:1/2;justify-self:start;transform:translate(-50%)}.sv-titel__rechts{grid-area:1/2;justify-self:end}}.sv-einstieg__unter{gap:1.25rem;display:grid}@media (min-width:1024px){.sv-einstieg__unter{grid-template-columns:minmax(0,1fr) auto;align-items:end;column-gap:3rem}}.sv-blick__zeile{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"thema thema""shopify code";align-items:start;gap:.875rem 1.25rem;display:grid}.sv-blick__zeile--kopf{grid-template-areas:"shopify code";align-items:end}.sv-blick__thema{grid-area:thema;justify-self:center}.sv-blick__shopify{text-align:right;grid-area:shopify;justify-self:end}.sv-blick__code{text-align:left;grid-area:code;justify-self:start}.sv-blick__gross{-webkit-hyphens:auto;hyphens:auto}@media (min-width:768px){.sv-blick__zeile,.sv-blick__zeile--kopf{grid-template-columns:minmax(0,1fr) 12rem minmax(0,1fr);grid-template-areas:"shopify thema code";column-gap:clamp(1rem,2.4vw,2.25rem)}.sv-blick__thema{padding-top:calc((var(--type-h3-size) * 1.1 - var(--type-body-size) * 1.6) / 2)}}.lf-huelle{container-type:inline-size}.lf-huelle>.lf{aspect-ratio:var(--lf-schmal)}@container (min-width:700px){.lf-huelle>.lf{aspect-ratio:var(--lf-breit)}}.lf{--lf-grund:#000;--lf-kante:#ffffff9e;--lf-mitte:#ffffff5c;--lf-leise:#ffffff2e;--lf-hell:var(--accent);--lf-schrift:#ffffffc7;--lf-schrift-aktiv:#fff;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.lf[data-flaeche=hell]{--lf-grund:#fff;--lf-kante:#0d0d0d94;--lf-mitte:#0d0d0d57;--lf-leise:#0d0d0d26;--lf-schrift:#0d0d0dc7;--lf-schrift-aktiv:#0d0d0d}.lf svg path{fill:var(--lf-grund);stroke:var(--lf-mitte);stroke-width:1px;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round;transition:stroke .26s cubic-bezier(.5,0,.1,1),fill .26s cubic-bezier(.5,0,.1,1)}.lf svg .nf{fill:none}.lf svg .fo{stroke:none}.lf svg .sil{stroke:var(--lf-kante)}.lf svg .hi{stroke:var(--lf-hell)}.lf svg .lo{stroke:var(--lf-leise)}.lf svg .dash{stroke-dasharray:1 3}.lf svg .punkt{stroke:none;fill:var(--lf-hell)}.lf svg .punkt.m{fill:var(--lf-kante)}.lf svg .punkt.aus{fill:var(--lf-leise)}.lf-beschriftung{z-index:2;pointer-events:none;white-space:nowrap;color:var(--lf-schrift);transform:translate(var(--lf-schieben,0px), -50%);align-items:center;transition:color .26s cubic-bezier(.16,1,.3,1);display:flex;position:absolute}.lf-beschriftung[data-richtung=links]{transform:translate(calc(-100% + var(--lf-schieben,0px)), -50%);flex-direction:row-reverse}.lf-beschriftung[data-richtung=oben]{flex-direction:column-reverse;transform:translate(-50%,-100%)}.lf-beschriftung[data-richtung=unten]{flex-direction:column;transform:translate(-50%)}.lf-beschriftung[data-richtung=oben] .lf-beschriftung__text,.lf-beschriftung[data-richtung=unten] .lf-beschriftung__text{transform:translateX(var(--lf-schieben,0px))}.lf-beschriftung[data-richtung=frei]{transform:translate(var(--lf-schieben,0px), -100%)}.lf-beschriftung[data-richtung=frei-links]{transform:translate(calc(-100% + var(--lf-schieben,0px)), -100%);text-align:right}.lf-beschriftung__strich{opacity:.45;background:currentColor;flex:none;width:clamp(.875rem,2.2vw,1.75rem);height:1px;transition:background-color .26s cubic-bezier(.16,1,.3,1),opacity .26s cubic-bezier(.16,1,.3,1)}.lf-beschriftung[data-richtung=oben] .lf-beschriftung__strich,.lf-beschriftung[data-richtung=unten] .lf-beschriftung__strich{width:1px;height:1.125rem}.lf-beschriftung[data-richtung=frei] .lf-beschriftung__strich,.lf-beschriftung[data-richtung=frei-links] .lf-beschriftung__strich{display:none}.lf-beschriftung__text{padding:0 .5rem}.lf-beschriftung[data-richtung=oben] .lf-beschriftung__text,.lf-beschriftung[data-richtung=unten] .lf-beschriftung__text{padding:.25rem 0}.lf-beschriftung[data-richtung=frei] .lf-beschriftung__text,.lf-beschriftung[data-richtung=frei-links] .lf-beschriftung__text{padding:0}.lf-beschriftung[data-aktiv=true]{color:var(--lf-schrift-aktiv)}.lf-beschriftung[data-aktiv=true] .lf-beschriftung__strich{background:var(--lf-hell);opacity:1}@media (prefers-reduced-motion:reduce){.lf svg path,.lf-beschriftung,.lf-beschriftung__strich{transition:none}}.sv-frage__kopf{gap:1.5rem;display:grid}@media (min-width:1024px){.sv-frage__kopf{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.75rem,2.5vw,2.5rem) clamp(1.5rem,3.5vw,3.5rem)}.sv-frage__kopf>:first-child{grid-column:1/-1}.sv-frage__kopf>:last-child{grid-column:2}}.sv-frage__seiten{gap:2.25rem;display:grid}@media (min-width:768px){.sv-frage__seiten{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0}.sv-frage__seite:first-child{padding-right:clamp(1.5rem,3vw,3rem)}.sv-frage__seite+.sv-frage__seite{border-left:1px solid var(--sv-naht,#ffffff1f);padding-left:clamp(1.5rem,3vw,3rem)}}.sv-frage__seiten[data-flaeche=hell]{--sv-naht:#0d0d0d1f}.sv-paar{--sv-rand:#ffffff24;--sv-rand-stark:#ffffff3d;--sv-fenster:#ffffff08;--sv-trenner:#ffffff14;--sv-text:#fff;--sv-text-2:#ffffffc7;--sv-text-3:#ffffffa6;--sv-fuellung:#ffffff0f;--sv-balken:#ffffff8c;grid-template-columns:minmax(0,1fr);row-gap:0;display:grid}.sv-paar[data-flaeche=hell]{--sv-rand:#0d0d0d1f;--sv-rand-stark:#0d0d0d3d;--sv-fenster:#0d0d0d05;--sv-trenner:#0d0d0d14;--sv-text:#0d0d0d;--sv-text-2:#0d0d0dc7;--sv-text-3:#0d0d0da6;--sv-fuellung:#0d0d0d0d;--sv-balken:#0d0d0d80}@media (min-width:768px){.sv-paar{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(1.5rem,3.5vw,3.5rem)}}.sv-fenster{grid-template-columns:minmax(0,1fr);grid-template-rows:subgrid;grid-row:span var(--sv-zeilen,1);border:1px solid var(--sv-rand);background:var(--sv-fenster);min-width:0;color:var(--sv-text);border-radius:12px;row-gap:0;display:grid;position:relative;overflow:hidden}@media (max-width:767px){.sv-fenster+.sv-fenster{margin-top:1.75rem}}.sv-fenster__kopf{border-bottom:1px solid var(--sv-trenner);justify-content:space-between;align-items:center;gap:1rem;padding:.875rem 1.125rem;display:flex}.sv-zeile{border-top:1px solid var(--sv-trenner);padding:.875rem 1.125rem;transition:background-color .26s cubic-bezier(.16,1,.3,1);position:relative}.sv-fenster__kopf+.sv-zeile{border-top:0}.sv-zeile[data-aktiv=true]{background:var(--sv-fuellung)}.sv-zeile:before{content:"";background:var(--accent);opacity:0;border-radius:2px;width:2px;transition:opacity .26s cubic-bezier(.16,1,.3,1);position:absolute;inset:.625rem auto .625rem 0}.sv-zeile[data-aktiv=true]:before{opacity:1}.sv-knopf{border:1px solid var(--sv-rand-stark);min-height:2rem;color:var(--sv-text);white-space:nowrap;border-radius:5px;align-items:center;gap:.375rem;padding:0 .75rem;transition:transform .12s cubic-bezier(.22,1,.36,1),border-color .2s cubic-bezier(.16,1,.3,1),background-color .2s cubic-bezier(.16,1,.3,1);display:inline-flex;position:relative}.sv-knopf:active,.sv-knopf[data-druck=true]{transform:scale(.95)}.sv-knopf:disabled{cursor:default}.sv-knopf[data-fertig=true]{background:var(--sv-fuellung);border-color:#0000}@media (hover:hover) and (pointer:fine){.sv-knopf:not(:disabled):hover{border-color:var(--sv-text-3)}}.sv-schalter{border:1px solid var(--sv-rand-stark);border-radius:999px;flex:none;width:2.5rem;height:1.375rem;transition:background-color .26s cubic-bezier(.16,1,.3,1),border-color .26s cubic-bezier(.16,1,.3,1),transform .12s cubic-bezier(.22,1,.36,1);position:relative}.sv-schalter:after{content:"";background:var(--sv-text);border-radius:999px;width:calc(1.375rem - 6px);height:calc(1.375rem - 6px);transition:transform .32s cubic-bezier(.22,1,.36,1);position:absolute;top:2px;left:2px}.sv-schalter[aria-checked=true]{border-color:var(--accent);background:var(--accent)}.sv-schalter[aria-checked=true]:after{background:#fff;transform:translate(1.125rem)}.sv-schalter:active,.sv-schalter[data-druck=true]{transform:scale(.94)}.sv-fortschritt{background:var(--sv-trenner);border-radius:2px;height:2px;position:relative;overflow:hidden}.sv-fortschritt>span{background:var(--accent);border-radius:2px;position:absolute;inset:0 auto 0 0}.sv-fortschritt--kante{z-index:1;background:0 0;border-radius:0;position:absolute;inset:auto 0 -1px}.sv-fortschritt--kante>span{border-radius:0}.sv-fenster__fuss .sv-fortschritt--kante,.sv-zeile:last-child .sv-fortschritt--kante{bottom:0}.sv-anteil{background:var(--sv-trenner);border-radius:2px;height:2px;position:relative}.sv-anteil>span{background:var(--sv-balken);border-radius:2px;position:absolute;inset:0 auto 0 0}@media (prefers-reduced-motion:reduce){.sv-zeile,.sv-zeile:before,.sv-knopf,.sv-schalter,.sv-schalter:after{transition:none}}.sv-regler{appearance:none;cursor:pointer;touch-action:pan-y;--sv-spur:#ffffff52;--sv-griff:#000;background:0 0;width:100%;height:2.75rem;margin:0}.sv-regler[data-flaeche=hell]{--sv-spur:#0d0d0d4d;--sv-griff:#fff}.sv-regler:focus{outline:none}.sv-regler::-webkit-slider-runnable-track{background:var(--sv-spur);height:1px}.sv-regler::-moz-range-track{background:var(--sv-spur);height:1px}.sv-regler::-webkit-slider-thumb{appearance:none;background:var(--sv-griff);border:1px solid var(--accent);border-radius:999px;width:22px;height:22px;margin-top:-10.5px;transition:transform .14s cubic-bezier(.22,1,.36,1)}.sv-regler::-moz-range-thumb{background:var(--sv-griff);border:1px solid var(--accent);border-radius:999px;width:22px;height:22px;transition:transform .14s cubic-bezier(.22,1,.36,1)}.sv-regler:active::-webkit-slider-thumb{transform:scale(.9)}.sv-regler:active::-moz-range-thumb{transform:scale(.9)}.sv-regler:focus-visible::-webkit-slider-thumb{outline:2px solid var(--accent);outline-offset:3px}.sv-regler:focus-visible::-moz-range-thumb{outline:2px solid var(--accent);outline-offset:3px}@media (prefers-reduced-motion:reduce){.sv-regler::-webkit-slider-thumb{transition:none}.sv-regler::-moz-range-thumb{transition:none}}.sv-buehne-rahmen{container:sv-rahmen/inline-size}.sv-buehne{width:100%;display:grid;position:relative}.sv-buehne[data-demo=paneel-planer]{min-height:900px}.sv-buehne[data-demo=dielen-rechner]{min-height:640px}@container sv-rahmen (min-width:672px){.sv-buehne[data-demo=dielen-rechner]{min-height:420px}}@container sv-rahmen (min-width:768px){.sv-buehne[data-demo=paneel-planer]{min-height:480px}}