/* FractalWays – Look 12.10.2026 (Niklas, Referenzbild „High-Ticket-Sales Masterclass“)
 * 1. Ueberschriften: grosse, eng gesetzte Grotesk mit Grauverlauf, Akzent in kursiver Serif mit Blauverlauf
 * 2. Markierte Woerter: blaue Auswahlbox wie beim Aufziehen auf dem Desktop (.fw-mark), zieht sich beim
 *    Hineinscrollen auf (fw-look.js setzt .is-an)
 * 3. Hero: Kennzeile grau mit Pulspunkt, Unterzeile gross mit Trennlinie
 * Gilt fuer Seiten mit <body class="… fw-look"> (Frontpage, die fuenf 7-€-Seiten, Kundenportfolio).
 * Das feine Punktraster selbst steckt in img/g_punkte_hell.svg?v=5 / g_punkte_dunkel.svg (ersetzen g_muster_*). */

:root{--fwl-blau:#ff6600;--fwl-tinte:#0b0a09;--fwl-grau:#8d939f;
 --fwl-sel:rgba(255,90,0,.11);--fwl-selrand:rgba(255,102,0,.78)}

/* ---------- 1. Ueberschriften (alle Seiten) ----------
   Sofort per CSS: eng gesetzte Grotesk, Akzent in kursiver Serif. Den Farbverlauf setzt fw-look.js je nach
   Untergrund: .fwl-tinte (Ueberschrift war dunkel → Tinten-Verlauf, Akzent blau) oder .fwl-licht (war hell,
   steht also auf dunklem Grund → Weiss-Silber-Verlauf, Akzentfarbe bleibt wie gebaut). */
.fw-look :is(.h1-new,h1.h1,.h2-new,.fw-frage__h2){letter-spacing:-.052em!important;font-weight:500!important}
.fw-look :is(.h1-new,h1.h1){line-height:.98!important}
.fw-look .h2-new{line-height:1.02!important}
.fw-look :is(.h1-denton,.h2-denton){font-family:'Instrument Serif',Georgia,serif!important;font-style:italic!important;
 font-weight:400!important;letter-spacing:-.025em!important;font-size:1.1em!important;line-height:.92!important}
.fw-look .fwl-tinte{padding-bottom:.08em;
 background-image:linear-gradient(96deg,#080707 0%,#32302f 28%,#6f7584 50%,#32302f 72%,#080707 100%)!important;
 -webkit-background-clip:text!important;background-clip:text!important;
 -webkit-text-fill-color:transparent!important;color:transparent!important}
.fw-look .fwl-tinte :is(.h1-denton,.h2-denton){padding:0 .07em .06em 0;margin-right:-.06em;
 background-image:linear-gradient(100deg,#9a3e00 0%,#ff6600 38%,#e6762a 60%,#ff6600 82%,#9a3e00 100%)!important;
 -webkit-background-clip:text!important;background-clip:text!important;
 -webkit-text-fill-color:transparent!important;color:transparent!important}
.fw-look .fwl-licht{padding-bottom:.08em;
 background-image:linear-gradient(96deg,#fff 0%,#f6f1ee 34%,#bdada3 56%,#f6f1ee 78%,#fff 100%)!important;
 -webkit-background-clip:text!important;background-clip:text!important;
 -webkit-text-fill-color:transparent!important;color:transparent!important}
.fw-look .fwl-licht :is(.h1-denton,.h2-denton){-webkit-text-fill-color:currentColor!important}
/* Zeilen-Animation (line-reveal → SplitText-Zeilen .line mit transform): Safari malt den Text-Verlauf der
   Ueberschrift nicht in verschobene Kinder – am iPhone blieb nur das Akzentwort sichtbar (16.10.). Jede Zeile
   traegt den Verlauf deshalb selbst; Polster + Gegenrand, damit Umlaut-Punkte und Unterlaengen nicht abreissen. */
.fw-look :is(.fwl-tinte,.fwl-licht)>.line{background-image:inherit!important;
 -webkit-background-clip:text!important;background-clip:text!important;
 -webkit-text-fill-color:transparent!important;color:transparent!important;
 padding:.12em 0 .16em;margin:-.12em 0 -.16em}
/* Hero-Ueberschrift wie im Referenzbild: gross; breitere Spalte, damit lange Zeilen nicht auf 5 Zeilen umbrechen */
.fw-look .section_hero-new .hero-new_heading-wrapper{max-width:640px!important}
.fw-look .section_hero-new .h1-new{font-size:clamp(2.6rem,4.9vw,4.9rem)!important;line-height:.96!important;
 letter-spacing:-.055em!important}
.fw-look .section_hero-new .h1-new .h1-denton{line-height:.9!important}
/* Webinar-Kopf: normale Schreibweise wie im Referenzbild statt Versalien */
.fw-look .fw-webhero__h1,.fw-look .fw-webhero__h1 *{text-transform:none!important}
/* Abschnitts-Ueberschriften ohne eigene Groesse etwas groesser */
.fw-look .h2-new:not(.is-smaller):not(.is-smaller-mob):not(.fw-dankeglas__h2):not(.fw-kh3):not(.fw-webh2):not(.fw-film__kopf){
 font-size:clamp(2.1rem,3.4vw,3.3rem)!important}
/* Kennzeilen (kleine Marke mit Haken) im Stil der Referenz: grauer Text mit Punkt statt Pille */
.fw-look .label-wrapper{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;
 gap:10px!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.fw-look .label-wrapper>img{display:none!important}
.fw-look .label-wrapper:before{content:"";flex:0 0 9px;width:9px;height:9px;border-radius:50%;background:#ff6600;
 box-shadow:0 0 0 4px rgba(255,102,0,.13)}
.fw-look .label-wrapper .text-block-2,.fw-look .label-wrapper>div{color:#8d939f!important;font-size:clamp(.95rem,1.1vw,1.08rem)!important;
 letter-spacing:-.03em!important;font-weight:500!important}

/* ---------- 2. Markierung = Auswahlbox ---------- */
.fw-mark{position:relative;display:inline-block;white-space:nowrap;padding:0 .12em;margin:0 .02em;
 z-index:0;-webkit-text-fill-color:currentColor}
.fw-mark:before{content:"";position:absolute;left:-.04em;right:-.04em;top:.02em;bottom:-.04em;z-index:-1;
 background:var(--fwl-sel);border:1px solid var(--fwl-selrand);border-radius:1px;pointer-events:none}
.fwl-js .fw-mark:before{clip-path:inset(0 100% 100% 0)}
.fwl-js .fw-mark.is-an:before{animation:fwl-aufziehen 1s cubic-bezier(.6,.04,.24,1) forwards}
@keyframes fwl-aufziehen{0%{clip-path:inset(0 100% 100% 0)}100%{clip-path:inset(0 0 0 0)}}
/* Mauszeiger, der die Box aufzieht (nur wo .fw-mark--zeiger gesetzt ist) */
.fw-mark--zeiger:after{content:"";position:absolute;left:0;top:0;width:15px;height:22px;opacity:0;z-index:2;
 pointer-events:none;transform:translate(-2px,-2px);
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 22'%3E%3Cpath d='M1 1v17.5l4.3-4.1 2.9 6.6 2.9-1.3-2.9-6.4H14z' fill='%23000' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 0 0/contain;
 filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.fwl-js .fw-mark--zeiger.is-an:after{animation:fwl-zeiger 1.9s cubic-bezier(.6,.04,.24,1) forwards}
@keyframes fwl-zeiger{0%{left:0;top:0;opacity:0}8%{opacity:1}52%{left:100%;top:100%;opacity:1}
 80%{left:100%;top:100%;opacity:1}100%{left:100%;top:100%;opacity:0}}
/* Markierung auf Blau/Dunkel */
.fw-mark.is-hell{--fwl-sel:rgba(255,255,255,.14);--fwl-selrand:rgba(255,255,255,.85)}

/* ---------- 3. Hero ---------- */
.fw-look .hero-new_label-wrapper{background:none!important;border:0!important;box-shadow:none!important;
 padding:0!important;gap:14px!important;margin-bottom:22px!important;align-items:center!important;
 font-size:clamp(1.02rem,1.35vw,1.3rem)!important;letter-spacing:-.035em!important;color:var(--fwl-grau)!important;
 -webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.fw-look .hero-new_label-wrapper>div{color:var(--fwl-grau)!important;font-size:inherit!important;
 letter-spacing:inherit!important;font-weight:500!important}
.fw-look .hero-new_label-wrapper img{display:none!important}
.fw-look .hero-new_label-wrapper:before{content:"";flex:0 0 12px;width:12px;height:12px;border-radius:50%;
 background:var(--fwl-blau);box-shadow:0 0 0 5px rgba(255,102,0,.14);animation:fwl-puls 2.2s ease-out infinite}
@keyframes fwl-puls{0%{box-shadow:0 0 0 0 rgba(255,102,0,.35)}70%{box-shadow:0 0 0 11px rgba(255,102,0,0)}
 100%{box-shadow:0 0 0 0 rgba(255,102,0,0)}}
.fw-look .hero-new_subtext{border-top:1px solid rgba(11,10,9,.14);padding-top:1.25rem!important;
 margin-top:1.5rem!important}
.fw-look .hero-new_subtext,.fw-look .hero-new_subtext div{font-size:clamp(1.08rem,1.42vw,1.36rem)!important;
 line-height:1.24!important;letter-spacing:-.032em!important;color:#2e2c2b!important;font-weight:400!important}

/* Rahmen mit Anfassern (wie ein ausgewaehltes Textfeld) */
.fwl-rahmen{position:relative;display:inline-flex;align-self:flex-start;width:auto;max-width:100%;align-items:baseline;gap:.32em;margin:0 0 .5em;
 padding:.34em .75em .38em;font-size:clamp(1.25rem,2vw,1.95rem);letter-spacing:-.045em;line-height:1.1;
 color:#1a1817;font-weight:500;background:rgba(255,255,255,.62);border:1px solid rgba(11,10,9,.1);
 -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
 box-shadow:0 10px 30px -18px rgba(11,10,9,.35),inset 0 1px 0 rgba(255,255,255,.9)}
.fwl-rahmen em{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;
 font-size:1.08em;letter-spacing:-.03em}
.fwl-rahmen i{position:absolute;width:7px;height:7px;background:#fff;border:1px solid #9aa0ab;border-radius:1px}
.fwl-rahmen i:nth-of-type(1){left:-4px;top:-4px}.fwl-rahmen i:nth-of-type(2){right:-4px;top:-4px}
.fwl-rahmen i:nth-of-type(3){left:-4px;bottom:-4px}.fwl-rahmen i:nth-of-type(4){right:-4px;bottom:-4px}

/* Bewertungspille: wieder hinter Fabians Schulter (neues Foto, gemessen am Freisteller: Schulterkante bei
   x 1820–1880 / y 715–815 von 2800x1568, Fabian sitzt bei x 2250) — Prozent der Bildhuelle .fw-held, also bei jeder Breite gleich */
.fw-look .fw-tp{top:45.6%!important;right:30.6%!important;bottom:auto!important;left:auto!important}

/* Punktraster im Hero ueber die ganze Breite, unten weich auslaufend */
.fw-look .section_hero-new:before{background-size:216px 216px!important;
 -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.92) 50%,transparent 100%)!important;
 mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.92) 50%,transparent 100%)!important}

/* ---------- 4. Fabian-Bilder = Avatar (KI) ----------
   Seit 12.10.2026 zeigen alle Fabian-Bilder seinen KI-Avatar. Wo die Seite selbst keine „AI generated"-Marke
   setzt (Portraet im „Ich bin Fabian"-Block), kommt sie hier dazu — gleiche Optik wie .fw-ki (bau.py Block 127). */
.fw-look .fw-ich__bild:after{content:none;display:none;position:absolute;right:14px;top:14px;z-index:5;pointer-events:none;
 display:inline-flex;align-items:center;padding:5px 9px 5px 18px;border-radius:999px;font:600 10px/1 'Inter Tight',Inter,sans-serif;
 letter-spacing:.05em;text-transform:uppercase;color:#fff;white-space:nowrap;
 background:radial-gradient(circle at 10px 50%,#ffc69f 2.4px,transparent 3px),linear-gradient(135deg,rgba(26,24,22,.5),rgba(26,24,22,.3));
 border:1px solid rgba(255,255,255,.28);-webkit-backdrop-filter:blur(14px) saturate(170%);backdrop-filter:blur(14px) saturate(170%)}

/* ---------- 5. Knoepfe (alle Seiten, Niklas 12.10.: „passend zum Gesamtbild") ----------
   Statt der cryptory-Glow-Pille (Bild knopf_fw.webp + Lichthof + Leuchtellipse): kantig wie der Auswahlrahmen,
   sattes Fabian-Blau mit feinem Verlauf und Innenkante, Pfeil als Zeichen, beim Zeigen blauer Fokusring. */
.fw-look .button-wrapper-main{padding:0!important;border-radius:6px!important;background:none!important;
 box-shadow:none!important;transition:transform .25s cubic-bezier(.2,.8,.2,1)!important}
.fw-look .button-wrapper-main:hover{transform:translateY(-2px)}
.fw-look .button-bg-main,.fw-look .button-elipse-main{display:none!important}
.fw-look .button-main{position:relative;border-radius:6px!important;color:#fff;gap:12px!important;overflow:hidden;
 background-image:linear-gradient(180deg,#e87325 0%,#ff6600 52%,#b24800 100%)!important;background-color:#ff6600!important;
 border:1px solid #a64300!important;
 box-shadow:0 14px 30px -14px rgba(255,102,0,.75),inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.2)!important;
 transition:box-shadow .25s ease,background-color .25s ease,border-color .25s ease,color .25s ease!important}
.fw-look .button-main:before{content:"";position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.18) 48%,transparent 66%);transform:translateX(-120%);
 transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.fw-look .button-wrapper-main:hover .button-main:before{transform:translateX(120%)}
.fw-look .button-wrapper-main:hover .button-main{
 box-shadow:0 18px 36px -14px rgba(255,102,0,.85),0 0 0 4px rgba(255,102,0,.14),inset 0 1px 0 rgba(255,255,255,.3)!important}
.fw-look .button-text-main{position:relative;color:inherit!important;font-weight:500!important;letter-spacing:-.02em!important;
 text-shadow:none!important}
.fw-look .button-icon-main{display:none!important}
.fw-look .button-main:after{content:"";position:relative;flex:none;width:16px;height:16px;background-color:currentColor;
 -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5L13 8l-4.5 4.5' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
 mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h10M8.5 3.5L13 8l-4.5 4.5' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
 transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.fw-look .button-wrapper-main:hover .button-main:after{transform:translateX(3px)}
/* Zweitknopf: hell mit feiner Kante, beim Zeigen „ausgewaehlt" */
.fw-look .button-main.is-white{color:#0f0e0d;background-image:none!important;background-color:rgba(255,255,255,.86)!important;
 border:1px solid rgba(11,10,9,.16)!important;box-shadow:0 10px 26px -18px rgba(13,12,11,.35),inset 0 1px 0 #fff!important}
.fw-look .button-main.is-white:before{display:none}
.fw-look .button-wrapper-main:hover .button-main.is-white{color:#ff6600;border-color:#ff6600!important;
 background-color:rgba(255,244,236,.95)!important;box-shadow:0 0 0 4px rgba(255,102,0,.1)!important}
/* Vertrauensleiste im Hero im selben kantigen Stil */
.fw-look .hero-work_trust-wrapper{border-radius:6px!important}
/* kleine Knoepfe (Kanal-Kacheln u. a.) */
.fw-look .button-regular{border-radius:4px!important;background-image:linear-gradient(180deg,#e87325,#ff6600 55%,#b24800)!important;
 border:1px solid #a64300!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 18px -10px rgba(255,102,0,.7)!important;
 letter-spacing:-.01em!important;font-weight:500!important}
.fw-look .button-regular:hover{box-shadow:0 0 0 3px rgba(255,102,0,.14),inset 0 1px 0 rgba(255,255,255,.28)!important}
/* Trading-Check: Antwortkarten und Weiter-Knoepfe im selben Rahmen-Stil */
.fw-look :is(.fw-antwort,.tc4-quiz__antwort){border-radius:6px!important;transition:border-color .2s,background-color .2s,box-shadow .2s!important}
.fw-look :is(.fw-antwort,.tc4-quiz__antwort):hover{border-color:#ff6600!important;background-color:rgba(255,90,0,.05)!important;
 box-shadow:0 0 0 3px rgba(255,102,0,.1)!important}
.fw-look :is(.fw-frage__weiter,.tc4-sticky__knopf,.fw-obknopf){border-radius:6px!important}
/* Kundenergebnisse (16.10., Niklas): JEDES Ergebnis als eigene blaue Auswahlbox mit vier Anfassern – am Handy
   stehen alle untereinander, am Schreibtisch ist es die sichtbare Reiter-Box. Die gemeinsame Box der Frontpage
   (.w-tab-content mit Rand + .fp2-griff) faellt dafuer weg; die weisse Karte der 7-€-Seiten auch. */
.fw-look .section_tabs .w-tab-content{border:0!important;background:transparent!important;border-radius:0!important}
.fw-look .section_tabs .w-tab-content>.fp2-griff{display:none!important}
.fw-look .section_tabs .w-tab-pane{position:relative;overflow:visible!important;border:1px solid var(--fwl-selrand);
 border-radius:2px;background:rgba(255,255,255,.6)}
.fw-look .section_tabs .w-tab-pane:before{content:"";position:absolute;inset:0;z-index:0;background:rgba(255,90,0,.07);
 pointer-events:none;opacity:1!important}
.fw-look .section_tabs .w-tab-pane:after{content:"";position:absolute;inset:-5px;z-index:3;pointer-events:none;background:
 linear-gradient(#fff,#fff) left 1px top 1px/7px 7px no-repeat,linear-gradient(#fff,#fff) right 1px top 1px/7px 7px no-repeat,
 linear-gradient(#fff,#fff) left 1px bottom 1px/7px 7px no-repeat,linear-gradient(#fff,#fff) right 1px bottom 1px/7px 7px no-repeat,
 linear-gradient(#ff6600,#ff6600) left top/9px 9px no-repeat,linear-gradient(#ff6600,#ff6600) right top/9px 9px no-repeat,
 linear-gradient(#ff6600,#ff6600) left bottom/9px 9px no-repeat,linear-gradient(#ff6600,#ff6600) right bottom/9px 9px no-repeat}
.fw-look .section_tabs .w-tab-pane>*{position:relative;z-index:1}
.fw-look .section_tabs .fw-tabgrid{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
/* „Bevor du dich entscheidest“ (section_trade, 7-€-Seiten): Safari zeichnete das Bild mit filter + object-fit
   verzerrt (16.10.). Abdunkeln jetzt per Ueberlagerung (0.28 Schwarz = brightness .72), Bild absolut ueber den
   ganzen Abschnitt; KI-Plakette ueber der Ueberlagerung, am Handy mit Abstand unter den Knoepfen im Eck. */
.fw-look .section_trade .trade_image{filter:none!important;position:absolute!important;inset:0;width:100%!important;
 height:100%!important;max-width:none}
.fw-look .section_trade .trade_image-wrapper:after{content:"";position:absolute;inset:0;z-index:2;background:rgba(0,0,0,.28);
 pointer-events:none}
.fw-look .section_trade .trade_image-wrapper .fw-ki{z-index:3}

@media screen and (max-width:767px){
 .fw-look .section_hero-new .h1-new{font-size:clamp(2.3rem,10.4vw,3.2rem)!important;line-height:.98!important}
 .fw-look .h2-new:not(.is-smaller):not(.is-smaller-mob):not(.fw-dankeglas__h2):not(.fw-kh3):not(.fw-webh2):not(.fw-film__kopf){
  font-size:clamp(1.95rem,8.4vw,2.6rem)!important}
 .fwl-rahmen{font-size:1.12rem;align-self:center}
 .fw-look .section_trade{padding-bottom:66px!important}
 .fw-look .section_trade .trade_image-wrapper .fw-ki{bottom:16px!important;right:16px!important}
 .fw-mark{white-space:normal}
}
@media (prefers-reduced-motion:reduce){
 .fwl-js .fw-mark:before{clip-path:none!important;animation:none!important}
 .fw-mark--zeiger:after{display:none}
 .fw-look .hero-new_label-wrapper:before{animation:none}
}

/* ---------- 6. Sprungleiste unten (Niklas 13.10.2026: „in so einer Box, wie wenn man sowas markiert hätte“) ----------
   Die Leiste der Vorlage (Logo links, Sprungziele, Knopf rechts) wird zur blauen Auswahlbox mit vier Anfassern und
   oeffnet sich wie der Cookie-Banner (Aufziehen von links oben), sobald man nach unten scrollt. Das Ein-/Ausblenden
   steuert fw-look.js ueber .is-an; die GSAP-Tweens der Vorlage (display/opacity/scale) werden per !important ueberstimmt. */
.fw-look .sticky-links-wrapper{display:flex!important;opacity:0!important;transform:translateY(16px)!important;
 pointer-events:none;bottom:22px!important;padding-left:24px!important;padding-right:24px!important;
 transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)!important}
.fw-look .sticky-links-wrapper.is-an{opacity:1!important;transform:none!important;pointer-events:auto}
.fw-look .sticky-container{position:relative;opacity:1!important;max-width:1080px!important;min-height:0;
 border-radius:2px!important;padding:8px 8px 8px 20px!important;align-items:center;
 background:linear-gradient(rgba(255,90,0,.09),rgba(255,90,0,.09)),rgba(255,255,255,.82)!important;
 border:1px solid rgba(255,102,0,.8)!important;
 -webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
 box-shadow:0 34px 80px -30px rgba(13,12,11,.45),0 10px 26px -14px rgba(13,12,11,.25),inset 0 1px 0 rgba(255,255,255,.75)!important}
.fw-look .sticky-links-wrapper.is-an .sticky-container{animation:fwl-leiste-auf .75s cubic-bezier(.6,.04,.24,1) both}
@keyframes fwl-leiste-auf{0%{clip-path:inset(0 100% 100% 0)}100%{clip-path:inset(-60px -60px -60px -60px)}}
.fwl-griff{position:absolute;width:9px;height:9px;background:#fff;border:1px solid #ff6600;border-radius:1px;z-index:2;pointer-events:none}
.fwl-griff:nth-of-type(1){left:-5px;top:-5px}.fwl-griff:nth-of-type(2){right:-5px;top:-5px}
.fwl-griff:nth-of-type(3){left:-5px;bottom:-5px}.fwl-griff:nth-of-type(4){right:-5px;bottom:-5px}
.fw-look .sticky-container:before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:2px;
 background:url(/fp/img/g_punkte_hell.svg?v=5) 0 0/216px 216px;opacity:.5;
 -webkit-mask-image:radial-gradient(70% 90% at 100% 0%,#000,transparent 75%);mask-image:radial-gradient(70% 90% at 100% 0%,#000,transparent 75%)}
.fw-look .sticky-container>*{position:relative}
.fw-look .sticky-container>.fwl-griff{position:absolute}
.fw-look .nav_logo.in-sticky{height:30px!important;width:auto!important;margin-right:10px!important}
.fw-look .sticky-link-grid{gap:4px 26px!important}
.fw-look .sticky_link{font-family:'Inter Tight',Inter,sans-serif!important;font-size:.92rem!important;font-weight:500!important;
 letter-spacing:-.02em!important;line-height:1.2!important;color:#0f0e0d!important;padding:6px 0;
 border-bottom:1px solid transparent;text-decoration:none!important;transition:color .2s,border-color .2s}
.fw-look .sticky_link:hover{color:#ff6600!important;border-bottom-color:rgba(255,102,0,.5)}
.fw-look .sticky-container .button-wrapper-main{flex:none}
@media screen and (max-width:479px){
 .fw-look .sticky-links-wrapper{padding-left:12px!important;padding-right:12px!important;bottom:14px!important}
 .fw-look .sticky-container{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;
  -webkit-backdrop-filter:none;backdrop-filter:none}
 .fw-look .sticky-container:before,.fw-look .sticky-container .fwl-griff{display:none}
 .fw-look .sticky-links-wrapper.is-an .sticky-container{animation:none}
}
@media (prefers-reduced-motion:reduce){
 .fw-look .sticky-links-wrapper.is-an .sticky-container{animation:none}
}