@font-face{font-family: "Plus Jakarta Sans";font-style: normal;font-weight: 200 800;font-display: swap;src: url("/vio-fonts/plus-jakarta-sans.woff2") format("woff2")}
@font-face{font-family: "Instrument Serif";font-style: italic;font-weight: 400;font-display: swap;src: url("/assets/fonts/instrument-serif-italic-latin.woff2") format("woff2");unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family: "Instrument Serif";font-style: italic;font-weight: 400;font-display: swap;src: url("/assets/fonts/instrument-serif-italic-latin-ext.woff2") format("woff2");unicode-range: U+0100-02BA,U+02BD-02C5,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--accent: #F26522;--accent-ink: #C2410C;--accent-cta: #C74E13;--accent2: #2E5CE6;--ink: #16181a;--muted: #5b6068;--line: #e4e5e7;--play: running;--grain-o: 0.05;--font: "Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--mono: "Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--it: "Instrument Serif","Iowan Old Style",Georgia,serif;--nav-h: 84px}
@media (prefers-reduced-motion: reduce){:root{--play: paused;--grain-o: 0}
}
html{scroll-behavior: smooth;scroll-padding-top: 96px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior: auto}
}
body{margin: 0;background: #EFEFEF;color: var(--ink);font-family: var(--font,"Archivo"),"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing: antialiased}
a{color: inherit;text-decoration: none}
a:hover{color: inherit}
h1,h2,h3,p{margin: 0}
h1,h2,h3,h4{overflow-wrap: break-word}
html{-webkit-text-size-adjust: 100%;text-size-adjust: 100%}
:focus-visible{outline: 2px solid var(--accent);outline-offset: 3px;border-radius: 4px}
.skip{position: absolute;left: 12px;top: -80px;z-index: 60;background: var(--ink);color: #ffffff;border-radius: 10px;padding: 11px 18px;font-size: 14px;font-weight: 600;transition: top 0.18s ease}
.skip:focus{top: 12px;color: #ffffff}
@keyframes drift1{0%{transform: translate(0,0) scale(1)}
100%{transform: translate(8vw,6vh) scale(1.15)}
}
@keyframes glowPulse{0%{opacity: 0.42;transform: translateY(0) scale(1)}
100%{opacity: 0.62;transform: translateY(-3vh) scale(1.06)}
}
@keyframes grainShift{0%{transform: translate(0,0)}
50%{transform: translate(-3%,2%)}
100%{transform: translate(2%,-3%)}
}
@keyframes sheetUp{from{transform: translateY(100%)}
to{transform: translateY(0)}
}
.mural{opacity: 0}
.mural.is-ready{opacity: 1;transition: opacity 0.28s ease}
.mural{position: absolute;inset: 0;z-index: 0;display: grid;grid-auto-rows: 1fr;align-items: center;padding: var(--nav-h) 0 0;box-sizing: border-box;pointer-events: none;overflow: hidden;-webkit-mask-image: linear-gradient(to right,#000 0,#000 74%,transparent 97%);mask-image: linear-gradient(to right,#000 0,#000 74%,transparent 97%)}
.mural i{font-style: normal;white-space: nowrap;padding-left: 3.5vw;font-size: clamp(1.05rem,1.9vw,1.95rem);font-weight: 500;letter-spacing: -0.03em;line-height: 1.05;color: #1a1c1f}
.mural i:nth-child(3n+1){font-size: clamp(1.3rem,2.5vw,2.5rem)}
.mural i:nth-child(4n){font-size: clamp(0.95rem,1.5vw,1.55rem)}
.mural i:nth-child(2n){margin-left: -13%}
.mural i:nth-child(3n){margin-left: -6%}
.mural i:nth-child(5n){margin-left: -22%}
.mural i:nth-child(7n){margin-left: -31%}
.mural i.d{color: rgba(26,28,31,0.34)}
.mural i em{font-style: normal;color: var(--accent)}
.mural i b{font-weight: 500;color: color-mix(in oklab,var(--accent2) 80%,#16181a)}
.mural i u.t{text-decoration: none;display: inline}
.mural i s{text-decoration: none;color: var(--accent);opacity: 0.5;margin: 0 0.5em}
@media (max-height: 860px){.mural i.x2{display: none}
}
@media (max-height: 680px){.mural i.x1{display: none}
}
.scrim{position: absolute;left: 0;right: 0;bottom: 0;height: 44%;z-index: 10;pointer-events: none;background: linear-gradient(to top,rgba(240,239,236,0.94) 0%,rgba(240,239,236,0.74) 42%,rgba(240,239,236,0) 100%)}
.lens{position: absolute;inset: 0;z-index: 1;background: rgba(241,240,238,0.44);backdrop-filter: blur(18px) saturate(1.05);-webkit-backdrop-filter: blur(18px) saturate(1.05);-webkit-mask-image: radial-gradient(circle var(--lr,230px) at var(--mx,58%) var(--my,40%),transparent 0%,transparent 32%,rgba(0,0,0,0.55) 62%,#000 82%);mask-image: radial-gradient(circle var(--lr,230px) at var(--mx,58%) var(--my,40%),transparent 0%,transparent 32%,rgba(0,0,0,0.55) 62%,#000 82%)}
.gdot{position: absolute;left: 0;top: 0;z-index: 0;pointer-events: none;width: clamp(300px,38vw,540px);aspect-ratio: 1;transform: translate3d(calc(var(--gx,50vw) - 50%),calc(var(--gy,45vh) - 50%),0);background: radial-gradient(closest-side,color-mix(in oklab,var(--accent) 42%,#ffffff) 0%,rgba(255,255,255,0) 72%);filter: blur(56px);opacity: 0.34;will-change: transform}
.grain{position: absolute;inset: -10%;z-index: 2;pointer-events: none;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity: var(--grain-o);animation: grainShift 1.6s steps(3) infinite;animation-play-state: var(--play)}
.nav{position: fixed;top: 0;left: 0;right: 0;z-index: 40;transition: background 0.35s,box-shadow 0.35s,border-color 0.35s;background: transparent;border-bottom: 1px solid transparent}
.nav__cta{display: flex;align-items: center;gap: 10px;flex-shrink: 0;background: var(--ink);color: #ffffff;border-radius: 999px;padding: 7px 7px 7px 20px;font-size: 13px;font-weight: 500}
.nav__cta:hover{color: #ffffff}
.nav__in{max-width: 1440px;margin: 0 auto;box-sizing: border-box;padding: 0 clamp(20px,3.5vw,48px);height: var(--nav-h);display: flex;align-items: center;justify-content: space-between;gap: 24px;transition: height 0.35s cubic-bezier(0.25,0.1,0.25,1)}
.nav.is-stuck{background: rgba(246,245,243,0.86);backdrop-filter: blur(16px) saturate(1.4);-webkit-backdrop-filter: blur(16px) saturate(1.4);border-bottom-color: rgba(22,24,26,0.09)}
@media (max-width: 879px){.nav.is-stuck{background: rgba(246,245,243,0.97);backdrop-filter: none;-webkit-backdrop-filter: none}
.pill-glas{backdrop-filter: none !important;-webkit-backdrop-filter: none !important;background: rgba(255,255,255,0.97) !important}
}
.nav.is-stuck .nav__in{height: 60px}
.brand{display: flex;align-items: center;gap: 9px;flex-shrink: 0}
.brand img{width: 26px;height: 26px;display: block}
.brand span{font-size: 19px;font-weight: 700;letter-spacing: -0.04em;line-height: 1}
.brand span i{font-style: normal;color: var(--accent-ink)}
.nav__links{display: flex;align-items: center;gap: clamp(20px,2.4vw,36px)}
.nav__links a{position: relative;display: flex;align-items: baseline;gap: 6px;font-size: 14px;font-weight: 500;color: var(--ink);transition: color 0.25s}
.nav__links a span{font-family: var(--mono);font-size: 10px;color: #4a4f57;transition: color 0.25s}
.nav__links a::after{content: "";position: absolute;left: 0;right: 100%;bottom: -6px;height: 1.5px;background: var(--accent);transition: right 0.3s ease}
.nav__links a:hover::after,.nav__links a[aria-current="page"]::after{right: 0}
.nav__links a[aria-current="page"] span{color: var(--ink)}
.nav__right{display: flex;align-items: center;gap: 18px}
.nav__mail{display: none}
.nav__mail{font-size: 13.5px;color: var(--muted);transition: color 0.25s}
.nav__mail:hover{color: var(--ink)}
[data-nav] .nav__trigger{display: none}
.nav__trigger{display: flex;align-items: center;gap: 10px;cursor: pointer;background: none;border: none;padding: 8px 0;font-family: inherit;font-size: 14px;font-weight: 500;color: var(--ink)}
.nav__trigger b{font-weight: 500}
.nav__trigger u{text-decoration: none;display: flex;flex-direction: column;gap: 4px}
.nav__trigger u::before,.nav__trigger u::after{content: "";display: block;width: 22px;height: 1.5px;background: var(--ink);transition: transform 0.3s}
.nav__trigger[aria-expanded="true"] u::before{transform: translateY(2.75px) rotate(45deg)}
.nav__trigger[aria-expanded="true"] u::after{transform: translateY(-2.75px) rotate(-45deg)}
.ovl{position: fixed;inset: 0;z-index: 39;background: #F1F0EE;display: grid;grid-template-rows: var(--nav-h) 1fr;opacity: 0;visibility: hidden;transition: opacity 0.2s ease,visibility 0.2s}
.ovl.open{opacity: 1;visibility: visible}
.ovl__in{max-width: 1440px;width: 100%;margin: 0 auto;box-sizing: border-box;padding: clamp(24px,5vh,64px) clamp(20px,3.5vw,48px) clamp(32px,6vh,72px);display: grid;gap: clamp(32px,5vw,80px);align-content: space-between}
.ovl__nav{display: flex;flex-direction: column}
.ovl__nav a{display: flex;align-items: baseline;gap: 16px;padding: clamp(10px,1.6vh,18px) 0;border-top: 1px solid rgba(22,24,26,0.12);font-size: clamp(2rem,6vw,4.4rem);font-weight: 500;letter-spacing: -0.03em;line-height: 1;transition: color 0.25s,padding-left 0.35s cubic-bezier(0.25,0.1,0.25,1)}
.ovl__nav a:last-child{border-bottom: 1px solid rgba(22,24,26,0.12)}
.ovl__nav a span{font-family: var(--mono);font-size: 11px;color: #666b73}
.ovl__nav a:hover{color: var(--accent);padding-left: 14px}
.ovl__foot{display: flex;flex-wrap: wrap;gap: 12px 40px;align-items: flex-end;justify-content: space-between}
.ovl__foot p{font-size: 12px;font-family: var(--mono);letter-spacing: 0.06em;text-transform: uppercase;color: #666b73;margin-bottom: 8px}
.ovl__foot a{font-size: clamp(15px,1.6vw,18px);font-weight: 500}
.ovl__foot a:hover{color: var(--accent)}
.dock{display: none}
@media (max-width: 879px){.dock{position: fixed;left: 50%;transform: translateX(-50%);bottom: calc(12px + env(safe-area-inset-bottom));z-index: 45;display: grid;grid-template-columns: repeat(5,minmax(56px,64px));align-items: stretch;gap: 2px;background: rgba(255,255,255,0.94);border: 1px solid rgba(22,24,26,0.08);border-radius: 26px;padding: 7px 9px;box-shadow: 0 12px 40px rgba(22,24,26,0.18);-webkit-backdrop-filter: blur(14px) saturate(1.3);backdrop-filter: blur(14px) saturate(1.3)}
.dock a{position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 4px;min-height: 52px;border-radius: 18px;font-size: 10px;font-weight: 500;letter-spacing: 0.01em;color: #5b6068;-webkit-tap-highlight-color: transparent;transition: transform 0.15s}
.dock a svg{width: 21px;height: 21px;display: block}
.dock a[aria-current="page"]{color: var(--accent-ink);font-weight: 700;background: color-mix(in oklab,var(--accent) 9%,#ffffff)}
.dock a[aria-current="page"] svg{stroke-width: 2.2}
.dock a:active{transform: scale(0.93)}
.dock a.dock__fab{margin-top: -16px;width: 48px;height: 48px;min-height: 0;justify-self: center;align-self: start;border-radius: 999px;background: #25D366;color: #ffffff;gap: 0;box-shadow: 0 6px 16px rgba(37,211,102,0.35),0 0 0 4px rgba(246,245,243,0.92)}
.dock a.dock__fab svg{width: 22px;height: 22px}
.dock a.dock__fab span{position: absolute;bottom: -15px;font-size: 9.5px;font-weight: 600;color: #5b6068}
.dock a.dock__fab[aria-current="page"]{background: var(--accent-cta);color: #ffffff}
.dock a.dock__fab[aria-current="page"] span{color: var(--accent-ink)}
:root{--dock-h: 96px}
[data-lens] [data-copy]{padding-bottom: calc(clamp(46px,5vh,72px) + var(--dock-h)) !important}
footer{padding-bottom: calc(var(--dock-h) + 16px + env(safe-area-inset-bottom)) !important}
}
.rbtn{transition: filter 0.3s,box-shadow 0.3s,transform 0.15s}
.rbtn:active{transform: scale(0.97)}
.rbtn:hover .ri{transform: translateY(-50%)}
.rbtn:hover .ra{transform: rotate(-45deg)}
.abtn{box-shadow: 0 8px 22px color-mix(in oklab,var(--accent) 26%,transparent)}
.abtn:hover{filter: brightness(0.94);box-shadow: 0 12px 32px color-mix(in oklab,var(--accent) 38%,transparent)}
.dbtn{box-shadow: 0 4px 14px rgba(22,24,26,0.18)}
.dbtn:hover{box-shadow: 0 8px 22px rgba(22,24,26,0.26)}
.xicon{transform: rotate(-45deg);transition: transform 0.3s ease-in-out}
.mcard:hover .xbtn{width: 150px}
.mcard:hover .xlabel{opacity: 1;transition-delay: 0.1s}
.mcard:hover .xicon{transform: rotate(0deg)}
.mcard .mimg{height: 122%;transform: translateY(-11.5%);transition: transform 0.6s cubic-bezier(0.25,0.1,0.25,1)}
.mcard:hover .mimg{transform: translateY(-11.5%) scale(1.03)}
.navlink{position: relative}
.navlink:hover{color: var(--ink) !important}
.navlink::after{content: "";position: absolute;left: 0;right: 100%;bottom: -4px;height: 1.5px;background: var(--accent);transition: right 0.3s ease}
.navlink:hover::after{right: 0}
.flink:hover{color: #ffffff !important}
.lrow{transition: background 0.25s}
.lrow:hover{background: #fafafa}
.wx{display: flex;flex-direction: column}
.wx__cat{display: grid;grid-template-columns: minmax(72px,120px) 1fr;gap: 20px;border-top: 1px solid var(--ink);padding: 28px 0 4px;margin-top: 32px}
.wx__cat:first-child{margin-top: 0}
.wx__num{font-family: var(--mono);font-size: 13px;color: #666b73}
.wx__head{display: flex;flex-wrap: wrap;align-items: baseline;gap: 6px 16px;margin-bottom: 6px}
.wx__head h3{font-size: clamp(1.4rem,2.4vw,1.9rem);font-weight: 500;letter-spacing: -0.02em}
.wx__head p{font-size: 14px;color: var(--muted)}
.wx__row{display: grid;grid-template-columns: 1fr auto;gap: 6px 24px;align-items: center;border-top: 1px solid #ececee;padding: 16px 0;transition: background 0.25s,padding-left 0.3s cubic-bezier(0.25,0.1,0.25,1)}
.wx__row:hover{background: #fafafa;padding-left: 10px}
.wx__row h4{font-size: 16px;font-weight: 600;letter-spacing: -0.01em;display: flex;align-items: center;gap: 10px}
.wx__row h4 svg{opacity: 0;transform: translateX(-4px);transition: opacity 0.25s,transform 0.25s;color: var(--accent)}
.wx__row:hover h4 svg{opacity: 1;transform: translateX(0)}
.wx__meta{font-size: 13.5px;color: var(--muted);line-height: 1.5;margin-top: 3px}
.wx__tag{justify-self: end;white-space: nowrap;font-family: var(--mono);font-size: 11px;letter-spacing: 0.06em;text-transform: uppercase;color: var(--muted);border: 1px solid var(--line);border-radius: 999px;padding: 5px 11px}
.wx__tag.live{color: var(--accent-ink);border-color: color-mix(in oklab,var(--accent) 40%,#ffffff);background: color-mix(in oklab,var(--accent) 7%,#ffffff)}
@media (max-width: 640px){.wx__cat{grid-template-columns: 1fr;gap: 8px}
.wx__row{grid-template-columns: 1fr}
.wx__tag{justify-self: start}
}
.cx{display: flex;flex-direction: column;max-width: 420px;margin-top: 28px}
.cx > a,.cx > p{display: flex;justify-content: space-between;align-items: baseline;gap: 16px;border-top: 1px solid #dddedf;padding: 13px 0;font-size: 15px;font-weight: 600;transition: color 0.25s}
.cx > *:last-child{border-bottom: 1px solid #dddedf}
.cx > a:hover{color: var(--accent-ink)}
.cx b{font-size: 14px;font-weight: 400;color: var(--muted)}
.chip{border: 1px solid #e0e1e3;background: #ffffff;border-radius: 12px;cursor: pointer;transition: border-color 0.2s,background 0.2s,color 0.2s;font-family: inherit}
.chip:hover{border-color: var(--ink)}
.chip[aria-pressed="true"]{border-color: var(--accent);background: color-mix(in oklab,var(--accent) 8%,#ffffff);color: var(--accent-ink)}
input.tin,textarea.tin,select.tin{width: 100%;box-sizing: border-box;border: 1px solid #e0e1e3;border-radius: 12px;background: #ffffff;padding: 12px 14px;font-family: inherit;font-size: 14px;color: var(--ink);outline: none;transition: border-color 0.2s}
input.tin:focus,textarea.tin:focus,select.tin:focus{border-color: var(--accent)}
input.tin:-webkit-autofill,input.tin:-webkit-autofill:hover,input.tin:-webkit-autofill:focus{-webkit-box-shadow: 0 0 0 40px #ffffff inset;box-shadow: 0 0 0 40px #ffffff inset;-webkit-text-fill-color: var(--ink);caret-color: var(--ink);transition: background-color 5000s ease-in-out 0s}
select.tin{-webkit-appearance: none;appearance: none;padding-right: 38px;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6068' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: right 13px center;background-size: 15px 15px}
.g-studio,.g-kontakt,.g-page{grid-template-columns: 1fr}
.g-footer{grid-template-columns: minmax(0,1fr)}
@media (min-width: 360px) and (max-width: 879px){.g-footer{grid-template-columns: repeat(2,minmax(0,1fr))}
.g-footer > :first-child{grid-column: 1 / -1}
}
.only-desktop{display: none}
@media (min-width: 880px){.g-studio{grid-template-columns: 26% minmax(0,1fr) 42%}
.g-kontakt{grid-template-columns: minmax(0,1fr) 400px}
.g-page{grid-template-columns: minmax(0,1fr) 440px}
.g-footer{grid-template-columns: minmax(240px,1.4fr) 1fr 1fr 1fr}
.only-desktop{display: flex}
.ovl__in{grid-template-columns: minmax(0,1fr)}
}
@media (max-width: 879px){[data-nav] .nav__links,[data-nav] .nav__cta,[data-nav] .nav__mail{display: none}
[data-nav] .nav__trigger{display: none}
:root{--nav-h: 68px}
[data-lens] .lens{display: none}
[data-lens]{min-height: 100vh !important}
[data-lens]{min-height: 100svh !important}
[data-lens]:not(#top){min-height: 62vh !important}
[data-lens]:not(#top){min-height: 62svh !important}
.hero-gap{display: block}
.mural i{font-size: clamp(0.88rem,3.6vw,1.1rem);padding-left: 6vw;color: rgba(26,28,31,0.17)}
.mural i:nth-child(3n+1){font-size: clamp(1rem,4.4vw,1.3rem)}
.mural i:nth-child(4n){font-size: clamp(0.82rem,3.2vw,1rem)}
.mural i:nth-child(2n),.mural i:nth-child(3n),.mural i:nth-child(5n),.mural i:nth-child(7n){margin-left: 0}
.mural i.d{color: rgba(26,28,31,0.1)}
.mural i em,.mural i b,.mural i s{color: inherit;opacity: 1}
.mural{-webkit-mask-image: linear-gradient(to right,#000 0,#000 52%,transparent 92%);mask-image: linear-gradient(to right,#000 0,#000 52%,transparent 92%)}
.scrim{height: 58%;background: linear-gradient(to top,rgba(240,239,236,0.97) 0%,rgba(240,239,236,0.82) 46%,rgba(240,239,236,0) 100%)}
:root{--play: paused}
}
.tiles{display: grid;grid-template-columns: repeat(auto-fit,minmax(300px,1fr));gap: clamp(16px,2vw,28px)}
.tiles.wide{grid-template-columns: repeat(auto-fit,minmax(420px,1fr))}
.tile{display: block;background: #ffffff;border: 1px solid var(--line);border-radius: 18px;overflow: hidden;transition: border-color 0.3s,box-shadow 0.3s,transform 0.3s cubic-bezier(0.25,0.1,0.25,1)}
.tile:hover{border-color: rgba(22,24,26,0.22);box-shadow: 0 18px 44px rgba(0,0,0,0.10);transform: translateY(-3px)}
.tile__shot{display: block;position: relative;aspect-ratio: 16/11;overflow: hidden;background: #f2f2f1;border-bottom: 1px solid var(--line)}
.tile__shot img{position: absolute;top: 0;left: 0;width: 100%;display: block;transition: transform 0.7s cubic-bezier(0.25,0.1,0.25,1)}
.tile:hover .tile__shot img{transform: scale(1.035)}
.tile__body{padding: 16px 20px 20px;display: flex;flex-direction: column;gap: 7px}
.tile__body h3{font-size: 18px;font-weight: 600;letter-spacing: -0.01em;display: flex;align-items: center;gap: 9px}
.tile__body h3 svg{opacity: 0;transform: translateX(-4px);transition: opacity 0.25s,transform 0.25s;color: var(--accent-ink)}
.tile:hover h3 svg{opacity: 1;transform: translateX(0)}
.tile__body p{font-size: 13.5px;color: var(--muted);line-height: 1.5}
.tile__foot{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 10px;margin-top: 3px}
.moreline{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 16px;border-top: 1px solid var(--ink);margin-top: clamp(28px,3.5vw,44px);padding-top: 20px}
.moreline p{font-size: 13.5px;color: var(--muted)}
.story{border-top: 1px solid var(--ink);padding: clamp(40px,7.5vw,130px) 0 clamp(34px,6vw,100px)}
.story__head{max-width: 900px}
.story__brow{display: flex;flex-wrap: wrap;gap: 6px 14px;font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.16em;text-transform: uppercase;color: #666b73}
.story__brow span + span::before{content: "· ";color: var(--line)}
.story__claim{font-size: clamp(1.5rem,3.4vw,2.9rem);line-height: 1.14;letter-spacing: -0.035em;text-wrap: balance;margin-top: 20px}
.story__sub{font-size: 16.5px;line-height: 1.62;color: var(--muted);max-width: 620px;margin-top: 22px}
.story figure{margin: 0}
.story figure img{display: block;width: 100%;height: 100%;object-fit: cover}
.story figcaption{font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.12em;text-transform: uppercase;color: #666b73;margin-top: 10px}
.story__hero{margin-top: clamp(38px,5vw,72px)}
.story__hero img{aspect-ratio: 16 / 8;border-radius: 16px;border: 1px solid var(--line);box-shadow: 0 18px 48px rgba(0,0,0,0.09)}
.story__kpi{display: grid;grid-template-columns: 1fr;gap: 0;margin-top: clamp(30px,5.5vw,84px)}
.story__kpi div{border-top: 1px solid #ececee;padding: 16px 0}
.story__kpi b{display: block;font-size: clamp(2rem,4vw,3.4rem);font-weight: 700;letter-spacing: -0.035em;line-height: 1.05}
.story__kpi span{display: block;font-size: 14.5px;line-height: 1.5;color: var(--muted);margin-top: 6px;max-width: 30ch}
.story__acts{display: grid;grid-template-columns: 1fr;gap: 0;margin-top: clamp(26px,4.5vw,64px)}
.story__acts div{border-top: 1px solid #ececee;padding: 18px 0}
.story__acts i{font-style: normal;display: block;font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.16em;text-transform: uppercase;color: #666b73;margin-bottom: 8px}
.story__acts p{font-size: 15.5px;line-height: 1.62;color: var(--muted)}
.story__built{margin-top: clamp(28px,5vw,72px);border-top: 1px solid #ececee;padding-top: 20px}
.story__aufklapp{display: flex;align-items: center;justify-content: space-between;gap: 16px;cursor: pointer;list-style: none;min-height: 44px;padding: 2px 0}
.story__aufklapp::-webkit-details-marker{display: none}
.story__zahl{display: inline-flex;align-items: center;gap: 8px;flex-shrink: 0;font-family: var(--mono);font-size: 12px;letter-spacing: 0.04em;color: var(--muted)}
.story__zahl::after{content: "";width: 9px;height: 9px;border-right: 1.6px solid currentColor;border-bottom: 1.6px solid currentColor;transform: rotate(45deg) translate(-2px,-2px);transition: transform 0.25s}
.story__built[open] .story__zahl::after{transform: rotate(-135deg) translate(-3px,-3px)}
.story__aufklapp:hover .story__zahl{color: var(--accent-ink)}
@media (min-width: 880px){.story__built > ul{display: flex !important}
.story__aufklapp{cursor: default}
.story__zahl::after{display: none}
}
.story__built ul{list-style: none;margin: 14px 0 0;padding: 0;display: flex;flex-wrap: wrap;gap: 8px}
.story__built li{font-size: 13.5px;font-weight: 500;color: var(--ink);border: 1px solid var(--line);border-radius: 999px;padding: 7px 14px;background: #ffffff}
.story__quote{margin: clamp(38px,5vw,72px) 0 0;padding: clamp(30px,4vw,52px) 0;border-top: 1px solid var(--ink);border-bottom: 1px solid #ececee;display: grid;grid-template-columns: 1fr;gap: 18px}
.story__quote p{font-family: var(--it);font-style: italic;font-size: clamp(1.45rem,3.1vw,2.6rem);line-height: 1.26;letter-spacing: -0.012em;max-width: 30ch;text-wrap: balance}
.story__quote cite{display: block;font-style: normal;font-size: 13.5px;color: var(--muted)}
.story__quote cite b{display: block;font-weight: 600;color: var(--ink);margin-bottom: 3px}
@media (min-width: 860px){.story__quote{grid-template-columns: minmax(0,1fr) 220px;gap: clamp(32px,4vw,64px);align-items: end}
.story__quote p{max-width: none}
.story__quote cite{padding-bottom: 0.5em}
}
.story__links{display: flex;flex-wrap: wrap;gap: 12px 32px;margin-top: clamp(28px,3.5vw,44px)}
.story__links a{display: inline-flex;align-items: center;gap: 9px;font-size: 15px;font-weight: 600;transition: color 0.25s}
.story__links a svg{transition: transform 0.3s}
.story__links a:hover{color: var(--accent-ink)}
.story__links a:hover svg{transform: translateX(4px)}
@media (min-width: 760px){.story__kpi{grid-template-columns: repeat(3,1fr);column-gap: clamp(24px,3vw,48px)}
.story__acts{grid-template-columns: repeat(3,1fr);column-gap: clamp(24px,3vw,48px)}
}
.faq{display: grid;grid-template-columns: 1fr;gap: 0;margin-top: clamp(22px,3vw,38px)}
.faq > div{border-top: 1px solid #ececee;padding: 22px 0}
.faq h3{font-size: 16.5px;font-weight: 600;letter-spacing: -0.005em}
.faq p{font-size: 15px;line-height: 1.62;color: var(--muted);margin-top: 7px;max-width: 54ch}
@media (min-width: 860px){.faq{grid-template-columns: 1fr 1fr;column-gap: clamp(40px,5vw,90px)}
}
.voices{display: grid;grid-template-columns: 1fr;gap: 28px}
.voices blockquote{margin: 0;border-top: 1px solid var(--ink);padding-top: 18px}
.voices blockquote p{font-family: var(--it);font-style: italic;font-size: clamp(1.15rem,1.9vw,1.5rem);line-height: 1.3;letter-spacing: -0.01em}
.voices cite{display: block;font-style: normal;font-size: 13px;color: var(--muted);margin-top: 12px}
.voices cite b{font-weight: 600;color: var(--ink);margin-right: 9px}
@media (min-width: 860px){.voices{grid-template-columns: 1fr 1fr auto;gap: clamp(32px,4vw,64px);align-items: start}
}
.srail{position: fixed;right: 8px;top: 50%;transform: translateY(-50%);z-index: 44;display: flex;flex-direction: column;gap: 8px;opacity: 0.6;transition: opacity 0.3s ease}
.srail:hover,.srail:focus-within{opacity: 1}
.srail-item{position: relative;display: grid;place-items: center;width: 36px;height: 36px;border-radius: 11px;background: rgba(255,255,255,0.86);border: 1px solid var(--line);color: var(--ink);-webkit-backdrop-filter: blur(9px);backdrop-filter: blur(9px);box-shadow: 0 2px 8px rgba(22,24,26,0.12);transition: transform 0.22s cubic-bezier(0.34,1.56,0.64,1),background 0.22s,color 0.22s,border-color 0.22s}
.srail-item svg{width: 16px;height: 16px;display: block}
.srail-item:hover{transform: translateX(-2px) scale(1.06)}
.srail-item.sr-whatsapp:hover{background: #25D366;border-color: #25D366;color: #ffffff}
.srail-item.sr-phone:hover{background: var(--accent-cta);border-color: var(--accent-cta);color: #ffffff}
.srail-item.sr-linkedin:hover{background: #0A66C2;border-color: #0A66C2;color: #ffffff}
.srail-item.sr-instagram:hover{background: #E1306C;border-color: #E1306C;color: #ffffff}
.srail-lbl{position: absolute;right: calc(100% + 10px);top: 50%;white-space: nowrap;font-family: var(--mono);font-size: 10px;font-weight: 600;letter-spacing: 0.1em;text-transform: uppercase;color: var(--ink);background: #ffffff;border: 1px solid var(--line);border-radius: 9px;padding: 6px 10px;box-shadow: 0 6px 18px rgba(22,24,26,0.14);opacity: 0;pointer-events: none;transform: translateY(-50%) translateX(6px);transition: opacity 0.2s ease,transform 0.25s cubic-bezier(0.16,1,0.3,1)}
.srail-item:hover .srail-lbl,.srail-item:focus-visible .srail-lbl{opacity: 1;transform: translateY(-50%) translateX(0)}
@media (max-width: 1080px){.srail{display: none}
}
@media (prefers-reduced-motion: reduce){.srail,.srail-item,.srail-lbl{transition: none}
.srail-item:hover{transform: none}
}
:root{--display: var(--font)}
h1,h2,.story__claim,.ovl__nav a{font-family: var(--display);font-weight: 700}
h1,h2{letter-spacing: -0.035em}
.ovl__nav a{letter-spacing: -0.035em}
.dot{color: var(--accent-ink)}
.dot-d{color: var(--accent)}
.it{font-style: normal;margin-left: -0.1em;padding-left: 0.1em;background-repeat: no-repeat;background-size: 100% 0.88em;background-position: 0 0.24em;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 100' preserveAspectRatio='none'%3E%3Cpath d='M2 22 C 48 12 98 20 148 12 C 198 4 248 12 296 3 L 298 74 C 250 86 200 78 150 86 C 100 94 48 84 4 92 Z' fill='%23F26522' fill-opacity='.5'/%3E%3Cpath d='M8 58 C 58 50 112 58 168 49 C 216 42 258 49 294 40 L 296 72 C 250 84 200 76 150 84 C 100 92 50 82 6 90 Z' fill='%23F26522' fill-opacity='.24'/%3E%3C/svg%3E");-webkit-box-decoration-break: clone;box-decoration-break: clone}
.on-dark .it{background-image: none}
.it--anim{background-size: 0% 0.88em;transition: background-size 0.66s cubic-bezier(0.22,0.61,0.36,1)}
.it--anim.is-on{background-size: 100% 0.88em}
.kicker{display: block;font-family: var(--font,"Archivo"),sans-serif;font-size: 11px;font-weight: 500;letter-spacing: 0.18em;text-transform: uppercase;color: #666b73;margin-bottom: 18px}
.kicker--d{color: #8d939b}
.flow{display: flex;flex-direction: column}
.flow__row{display: grid;grid-template-columns: 46px minmax(0,1fr);gap: 14px;border-top: 1px solid var(--line);padding: clamp(20px,2.4vw,32px) 0}
.flow__row:last-child{border-bottom: 1px solid var(--line)}
.flow__n{font-family: var(--mono);font-size: 11px;letter-spacing: 0.14em;color: #666b73;padding-top: 0.6em}
.flow__main{display: grid;grid-template-columns: 1fr;gap: 8px}
.flow__name{font-family: var(--display);font-size: clamp(1.25rem,2.2vw,1.8rem);font-weight: 700;letter-spacing: -0.032em;line-height: 1.12}
.flow__desc{font-size: 15px;line-height: 1.6;color: var(--muted)}
.flow__meta{font-family: var(--mono);font-size: 11px;letter-spacing: 0.11em;text-transform: uppercase;color: #666b73;white-space: nowrap}
@media (min-width: 900px){.flow__main{grid-template-columns: minmax(0,0.8fr) minmax(0,1fr) 190px;gap: 40px;align-items: baseline}
.flow__meta{text-align: right}
}
.sec{border-top: 1px solid var(--ink);padding: clamp(40px,5.5vw,84px) 0 clamp(32px,4vw,56px)}
.sec__head{display: grid;grid-template-columns: 1fr;gap: 14px;margin-bottom: clamp(22px,3vw,38px)}
.sec__head h2{font-size: clamp(1.7rem,3.4vw,2.9rem);line-height: 1.12}
.sec__lead{font-size: 16px;line-height: 1.65;color: var(--muted);max-width: 440px}
@media (min-width: 900px){.sec__head{grid-template-columns: minmax(0,1.1fr) minmax(0,0.9fr);gap: clamp(32px,5vw,80px);align-items: end}
}
.offer{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-start;gap: 8px 32px;border-top: 1px solid #ececee;padding: 20px 0;transition: background 0.25s,padding-left 0.3s}
.offer:hover{background: #fafafa;padding-left: 10px}
.offer:last-of-type{border-bottom: 1px solid #ececee}
.offer h3{font-family: var(--font,"Archivo"),sans-serif;font-size: 16.5px;font-weight: 600;letter-spacing: -0.005em}
.offer p{font-size: 14.5px;color: var(--muted);line-height: 1.55;margin-top: 5px;max-width: 620px}
.offer__meta{font-family: var(--mono);font-size: 11.5px;letter-spacing: 0.09em;text-transform: uppercase;color: var(--muted);white-space: nowrap;padding-top: 3px}
.offer__badge{font-family: var(--mono);font-size: 9.5px;font-weight: 400;letter-spacing: 0.14em;text-transform: uppercase;color: var(--accent-ink);border: 1px solid color-mix(in oklab,var(--accent) 35%,#ffffff);border-radius: 999px;padding: 3px 9px;vertical-align: 3px;margin-left: 10px}
.proof-note{display: flex;flex-wrap: wrap;align-items: center;gap: 10px 18px;border-top: 1px solid #ececee;margin-top: 4px;padding: 20px 0 0;font-size: 14.5px;color: var(--muted)}
.svc{display: flex;flex-direction: column}
.svc__row{border-top: 1px solid var(--line);transition: padding-left 0.35s cubic-bezier(0.25,0.1,0.25,1),background 0.3s}
.svc__row:last-child{border-bottom: 1px solid var(--line)}
.svc__row:hover{background: #fafafa;padding-left: 12px}
.svc__row[open]{background: #fafafa}
.svc__sum{display: grid;grid-template-columns: 46px minmax(0,1fr) 24px;gap: 14px;padding: clamp(20px,2.4vw,34px) 0;cursor: pointer;list-style: none}
.svc__sum::-webkit-details-marker{display: none}
.svc__sum:focus-visible{outline: 2px solid var(--accent);outline-offset: 3px;border-radius: 4px}
.svc__chev{align-self: center;color: #666b73;transition: transform 0.3s cubic-bezier(0.25,0.1,0.25,1)}
.svc__row[open] .svc__chev{transform: rotate(180deg)}
.svc__more{padding: 0 0 clamp(18px,2.2vw,30px) 60px}
.svc__more dl{margin: 0;display: grid;grid-template-columns: 1fr;gap: 0;max-width: 900px}
.svc__more dt{font-size: 12px;font-weight: 600;letter-spacing: 0.11em;text-transform: uppercase;color: #666b73;border-top: 1px solid #ececee;padding-top: 14px}
.svc__more dd{margin: 4px 0 14px;font-size: 15px;line-height: 1.6;color: var(--muted)}
@media (min-width: 900px){.svc__more dl{grid-template-columns: 210px minmax(0,1fr);column-gap: 40px}
.svc__more dt{grid-column: 1}
.svc__more dd{grid-column: 2;margin: 0;border-top: 1px solid #ececee;padding-top: 14px;padding-bottom: 14px}
.svc__more dt{padding-bottom: 14px}
}
@media (max-width: 640px){.svc__more{padding-left: 0}
}
@media (max-width: 879px){.story__acts p{font-size: 15px;line-height: 1.52}
.story__acts div{padding: 13px 0}
.story__acts i{margin-bottom: 4px}
.story__kpi div{padding: 12px 0}
.story__kpi span{line-height: 1.42;margin-top: 4px}
.story__quote p{line-height: 1.4}
}
.svc__n{font-family: var(--mono);font-size: 11px;letter-spacing: 0.14em;color: #666b73;padding-top: 0.7em}
.svc__main{display: grid;grid-template-columns: 1fr;gap: 8px}
.svc__name,.svc__desc,.svc__meta{display: block}
.svc__name{font-family: var(--display);font-size: clamp(1.4rem,2.7vw,2.2rem);font-weight: 700;letter-spacing: -0.032em;line-height: 1.1}
.svc__desc{font-size: 15px;line-height: 1.55;color: var(--muted)}
.svc__meta{font-family: var(--mono);font-size: 11px;letter-spacing: 0.11em;text-transform: uppercase;color: var(--muted);white-space: nowrap}
@media (min-width: 900px){.svc__meta{text-align: right}
}
@media (min-width: 900px){.svc__main{grid-template-columns: minmax(0,0.85fr) minmax(0,1fr) 200px;gap: 40px;align-items: baseline}
}
.doc{padding: calc(var(--nav-h) + clamp(30px,4vw,58px)) 0 clamp(56px,7vw,104px)}
.doc__in{max-width: 1440px;margin: 0 auto;padding: 0 clamp(20px,3.5vw,48px);box-sizing: border-box}
.doc__hd{border-bottom: 1px solid var(--ink);padding-bottom: clamp(24px,3.2vw,42px);margin-bottom: clamp(28px,3.6vw,52px)}
.doc__eyebrow{font-family: var(--mono);font-size: 11.5px;font-weight: 600;letter-spacing: 0.15em;text-transform: uppercase;color: var(--accent-ink)}
.doc__hd h1{font-size: clamp(2rem,5.2vw,3.9rem);line-height: 1.04;margin-top: 13px}
.doc__lead{font-size: clamp(16px,1.4vw,17.5px);line-height: 1.64;color: var(--muted);max-width: 58ch;margin-top: 17px}
.doc__stand{font-family: var(--mono);font-size: 11.5px;letter-spacing: 0.12em;text-transform: uppercase;color: #666b73;margin-top: 20px}
.doc__grid{display: grid;grid-template-columns: minmax(0,1fr);gap: clamp(26px,3.4vw,56px);align-items: start}
@media (min-width: 1080px){.doc__grid{grid-template-columns: 216px minmax(0,1fr)}
}
.doc__toc{display: none}
@media (min-width: 1080px){.doc__toc{display: block;position: sticky;top: calc(var(--nav-h) + 24px)}
}
.doc__toc p{font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.14em;text-transform: uppercase;color: #666b73;padding-bottom: 12px;border-bottom: 1px solid var(--line)}
.doc__toc a{display: block;font-size: 13.5px;line-height: 1.4;color: #4a4f56;padding: 8px 0;border-bottom: 1px solid var(--line);transition: color 0.2s,padding-left 0.2s}
.doc__toc a:hover{color: var(--accent-ink);padding-left: 5px}
.doc__body{min-width: 0;max-width: 68ch;font-size: 16.5px;line-height: 1.75;color: #2a2e33}
.doc__body h2{font-size: clamp(1.28rem,2.2vw,1.72rem);line-height: 1.18;color: var(--ink);margin: clamp(38px,4.4vw,60px) 0 14px;scroll-margin-top: calc(var(--nav-h) + 20px)}
.doc__body > h2:first-child{margin-top: 0}
.doc__body h3{font-size: 17px;font-weight: 700;letter-spacing: -0.01em;color: var(--ink);margin: 26px 0 8px}
.doc__body p{margin: 0 0 15px}
.doc__body p:last-child{margin-bottom: 0}
.doc__body a:not(.doc__btn):not(.dcard){color: var(--accent-ink);text-decoration: underline;text-underline-offset: 3px;text-decoration-thickness: 1px;transition: color 0.2s}
.doc__body a:not(.doc__btn):not(.dcard):hover{color: var(--ink)}
.doc__body strong,.doc__body b{font-weight: 700;color: var(--ink)}
.doc__body ul,.doc__body ol{margin: 0 0 16px;padding-left: 22px}
.doc__body li{margin-bottom: 7px}
.doc__body li::marker{color: var(--accent-ink)}
.doc__body hr{border: 0;border-top: 1px solid var(--line);margin: clamp(30px,3.6vw,46px) 0}
.doc__body table{border-collapse: collapse;width: 100%;font-size: 15px;margin: 0 0 18px}
.doc__body th,.doc__body td{text-align: left;padding: 11px 14px 11px 0;border-bottom: 1px solid var(--line);vertical-align: top}
.doc__body th{font-family: var(--mono);font-size: 11.5px;font-weight: 600;letter-spacing: 0.1em;text-transform: uppercase;color: #666b73}
.doc__scroll{overflow-x: auto}
.doc__note{background: #e7e8ea;border: 1px solid #d6d8db;border-radius: 14px;padding: clamp(18px,2.2vw,26px);margin: clamp(24px,3vw,36px) 0;font-size: 15.5px;line-height: 1.68}
.doc__note-k{font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.14em;text-transform: uppercase;color: #5f646b;display: block;margin-bottom: 9px}
.doc__note p:last-child{margin-bottom: 0}
.doc__btn{display: inline-flex;align-items: center;gap: 9px;background: var(--ink);color: #ffffff;border-radius: 999px;padding: 13px 22px;font-size: 15px;font-weight: 600;margin-top: 6px;transition: background 0.25s,transform 0.25s}
.doc__btn:hover{background: var(--accent-cta);color: #ffffff;transform: translateY(-2px)}
.doc__sib{border-top: 1px solid var(--ink);margin-top: clamp(46px,5.5vw,78px);padding-top: clamp(20px,2.6vw,30px);display: flex;flex-wrap: wrap;gap: 10px 20px;align-items: baseline}
.doc__sib > p{font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.14em;text-transform: uppercase;color: #666b73}
.doc__sib a{font-size: 14.5px;color: #4a4f56;transition: color 0.2s}
.doc__sib a:hover{color: var(--accent-ink)}
.doc__sib a[aria-current="page"]{color: var(--ink);font-weight: 700}
@media (prefers-reduced-motion: reduce){.it--anim{transition: none;background-size: 100% 0.88em}
.doc__toc a,.doc__btn,.doc__sib a,.doc__body a{transition: none}
.doc__toc a:hover{padding-left: 0}
.doc__btn:hover{transform: none}
}
.doc__grid--voll{grid-template-columns: minmax(0,1fr)}
.doc__body--weit{max-width: 860px}
.dlist{border-top: 1px solid var(--ink);margin-bottom: clamp(34px,4vw,54px)}
.dcard{display: grid;grid-template-columns: 1fr;gap: 5px;padding: clamp(20px,2.4vw,28px) 0;border-bottom: 1px solid var(--line);transition: padding-left 0.28s cubic-bezier(0.22,0.61,0.36,1)}
.dcard:hover{padding-left: 10px}
.dcard__k{font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.14em;text-transform: uppercase;color: var(--accent-ink)}
.dcard__h{font-family: var(--display);font-size: clamp(1.25rem,2.3vw,1.75rem);font-weight: 700;letter-spacing: -0.032em;line-height: 1.14;color: var(--ink)}
.dcard__d{font-size: 15.5px;line-height: 1.6;color: var(--muted);max-width: 62ch;margin-top: 2px}
.dcard__m{font-family: var(--mono);font-size: 11px;letter-spacing: 0.11em;text-transform: uppercase;color: #666b73;margin-top: 4px}
.dcard__h::after{content: " ↗";color: var(--accent-ink);font-size: 0.7em;vertical-align: 0.15em}
@media (min-width: 760px){.dcard{grid-template-columns: 150px minmax(0,1fr);grid-template-areas: "k h" ". d" ". m";column-gap: 26px}
.dcard__k{grid-area: k;padding-top: 0.55em}
.dcard__h{grid-area: h}
.dcard__d{grid-area: d}
.dcard__m{grid-area: m}
}
@media (prefers-reduced-motion: reduce){.dcard{transition: none}
.dcard:hover{padding-left: 0}
}
.stats{display: grid;grid-template-columns: repeat(auto-fit,minmax(150px,1fr));gap: 0;border-top: 1px solid var(--ink);border-bottom: 1px solid var(--ink);margin: 0 0 clamp(30px,3.6vw,46px)}
.stats > div{padding: clamp(18px,2.2vw,26px) 20px clamp(18px,2.2vw,26px) 0;border-right: 1px solid var(--line)}
.stats > div:last-child{border-right: 0;padding-right: 0}
.stats b{display: block;font-family: var(--display);font-size: clamp(1.9rem,3.6vw,2.9rem);font-weight: 700;letter-spacing: -0.042em;line-height: 1;color: var(--ink)}
.stats span{display: block;font-size: 14px;line-height: 1.45;color: var(--muted);margin-top: 9px}
.stats i{display: block;font-family: var(--mono);font-style: normal;font-size: 10.5px;font-weight: 600;letter-spacing: 0.13em;text-transform: uppercase;color: var(--accent-ink);margin-top: 11px}
@media (max-width: 620px){.stats > div{border-right: 0;border-bottom: 1px solid var(--line);padding-right: 0}
.stats > div:last-child{border-bottom: 0}
}
@media (pointer: coarse){.brand{min-height: 44px}
.nav__trigger{min-height: 44px;padding-top: 5px;padding-bottom: 5px}
.nav__links a{min-height: 44px;display: inline-flex;align-items: center}
.ovl__nav a,.ovl__foot a{min-height: 44px;display: flex;align-items: center}
.srail-item{min-height: 44px}
.doc__toc a,.doc__sib a,.flink{min-height: 44px;display: inline-flex;align-items: center}
.dcard{min-height: 44px}
}
.skip{min-height: 44px;display: inline-flex;align-items: center;box-sizing: border-box}
@media (pointer: coarse){.navlink{min-height: 44px;display: inline-flex;align-items: center}
.rbtn{min-height: 44px}
footer a{min-height: 44px;display: inline-flex;align-items: center}
}
@media (pointer: coarse){.story__links a{min-height: 44px}
}
#top,[data-gdot],.hero-col{box-sizing: border-box;padding-top: calc(var(--nav-h) + 12px)}
@media (max-height: 520px){#top,[data-gdot]{min-height: auto}
}
@media (max-width: 879px){#top,[data-lens]{padding-top: calc(var(--nav-h) + 40px)}
}
.rev{margin: clamp(22px,2.8vw,32px) 0}
.rev__lbl{font-family: var(--mono);font-size: 11.5px;font-weight: 600;letter-spacing: 0.14em;text-transform: uppercase;color: #5f646b;margin-bottom: 9px}
.rev__ta{resize: vertical;min-height: 120px;line-height: 1.6;font-size: 15.5px}
.rev__hint{font-size: 13.5px;line-height: 1.55;color: var(--muted);margin-top: 9px}
.rev__akt{display: flex;flex-wrap: wrap;gap: 10px;margin-top: 14px;align-items: center}
.rev__ghost{background: #ffffff;color: var(--ink);border: 1px solid #d6d8db;border-radius: 999px;padding: 12px 20px;font-family: inherit;font-size: 14.5px;font-weight: 600;cursor: pointer;transition: border-color 0.2s,background 0.2s}
.rev__ghost:hover{border-color: var(--ink);background: #f4f4f5}
.rev__toast{min-height: 22px;margin-top: 12px;font-size: 14px;font-weight: 600;color: var(--accent-ink);visibility: hidden;opacity: 0;transition: opacity 0.25s}
.rev__toast.is-on{visibility: visible;opacity: 1}
.rev__toast.is-bad{color: #a03024}
@media (prefers-reduced-motion: reduce){.rev__toast,.rev__ghost{transition: none}
}
@media (pointer: coarse){.rev__ghost{min-height: 44px}
}
.nlz[hidden]{display: none}
.nlz{margin-bottom: clamp(26px,3vw,38px)}
.nlz > h2:first-child{margin-top: 0}
body.appbody{background: #EFEFEF}
.appx{min-height: 100dvh;box-sizing: border-box;max-width: 620px;margin: 0 auto;padding: calc(env(safe-area-inset-top) + 18px) calc(env(safe-area-inset-right) + 18px)
calc(env(safe-area-inset-bottom) + 26px) calc(env(safe-area-inset-left) + 18px);display: flex;flex-direction: column}
.appx__bar{display: flex;align-items: center;justify-content: space-between;gap: 12px}
.appx__logo{font-family: var(--display);font-size: 20px;font-weight: 700;letter-spacing: -0.04em;color: var(--ink)}
.appx__net{display: inline-flex;align-items: center;gap: 7px;font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.12em;text-transform: uppercase;color: #5f646b}
.appx__net i{width: 7px;height: 7px;border-radius: 999px;background: #1f9d55;flex-shrink: 0}
.appx__net.is-off i{background: #a03024}
.appx__hero{padding: clamp(30px,7vh,56px) 0 clamp(22px,4vh,34px)}
.appx__kick{font-family: var(--mono);font-size: 11.5px;font-weight: 600;letter-spacing: 0.15em;text-transform: uppercase;color: var(--accent-ink)}
.appx__greet{font-size: clamp(2.1rem,9vw,2.9rem);line-height: 1.05;margin-top: 10px}
.appx__sub{font-size: 15.5px;line-height: 1.6;color: var(--muted);margin-top: 12px;max-width: 40ch}
.appx__grid{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 12px}
.appx__tile{display: flex;flex-direction: column;gap: 4px;background: #ffffff;border: 1px solid var(--line);border-radius: 18px;padding: 16px 16px 18px;min-height: 118px;transition: transform 0.2s cubic-bezier(0.22,0.61,0.36,1),border-color 0.2s}
.appx__tile:active{transform: scale(0.975)}
.appx__tile:hover{border-color: #c9cbcf}
.appx__tile--gross{grid-column: 1 / -1;min-height: auto}
.appx__ic{width: 34px;height: 34px;border-radius: 11px;background: color-mix(in oklab,var(--accent) 13%,#ffffff);color: var(--accent-ink);display: flex;align-items: center;justify-content: center;margin-bottom: 8px}
.appx__ic svg{width: 18px;height: 18px}
.appx__tile b{font-size: 16px;font-weight: 700;letter-spacing: -0.015em;color: var(--ink)}
.appx__tx{font-size: 13.5px;line-height: 1.45;color: var(--muted)}
.appx__fuss{margin-top: auto;padding-top: clamp(26px,5vh,40px);font-size: 12.5px;color: #5f646b;text-align: center}
.appx__fuss a{color: #5f646b;text-decoration: underline;text-underline-offset: 3px}
.appx__fuss a:hover{color: var(--accent-ink)}
@media (pointer: coarse){.appx__fuss a{min-height: 44px;display: inline-flex;align-items: center}
}
@media (prefers-reduced-motion: reduce){.appx__tile{transition: none}
.appx__tile:active{transform: none}
}
body.appbody::before{content: "";position: fixed;left: -28vw;top: -20vh;width: 92vw;height: 58vh;background: radial-gradient(closest-side,color-mix(in oklab,var(--accent) 32%,#ffffff),rgba(255,255,255,0));filter: blur(60px);opacity: 0.55;pointer-events: none;z-index: 0}
body.appbody::after{content: "";position: fixed;right: -32vw;top: 14vh;width: 84vw;height: 52vh;background: radial-gradient(closest-side,color-mix(in oklab,var(--accent2) 26%,#ffffff),rgba(255,255,255,0));filter: blur(70px);opacity: 0.4;pointer-events: none;z-index: 0}
.app{position: relative;z-index: 1}
@media (min-width: 880px){[data-lens]#top{min-height: 100svh !important}
}
.app{min-height: 100dvh;box-sizing: border-box;max-width: 620px;margin: 0 auto;padding: calc(env(safe-area-inset-top) + 14px) calc(env(safe-area-inset-right) + 18px) calc(var(--dock-h,96px) + env(safe-area-inset-bottom) + 18px) calc(env(safe-area-inset-left) + 18px);display: flex;flex-direction: column;gap: 13px}
.app__top{display: flex;align-items: center;justify-content: space-between;gap: 12px;padding: 4px 2px}
.app__brand{font-family: var(--display);font-size: 20px;font-weight: 700;letter-spacing: -0.04em;color: var(--ink)}
.app__brand img{width: 24px;height: 24px;display: inline-block;vertical-align: -6px;margin-right: 8px}
.app__brand i{font-style: normal;color: var(--accent-ink)}
.app__pill{display: inline-flex;align-items: center;gap: 7px;font-family: var(--mono);font-size: 10.5px;font-weight: 600;letter-spacing: 0.12em;text-transform: uppercase;color: #5f646b;border: 1px solid var(--line);background: #ffffff;border-radius: 999px;padding: 7px 12px}
.app__pill i{width: 7px;height: 7px;border-radius: 999px;background: #1f9d55}
.app__wa{display: inline-flex;align-items: center;justify-content: center;width: 42px;height: 42px;border-radius: 999px;background: var(--accent-cta);color: #ffffff;box-shadow: 0 4px 14px color-mix(in oklab,var(--accent) 28%,transparent);transition: transform 0.15s}
.app__wa:active{transform: scale(0.92)}
.app__wa svg{width: 21px;height: 21px;display: block}
.aava{display: block;width: 116px;height: 116px;border-radius: 999px;overflow: hidden;margin: 0 auto;border: 4px solid #ffffff;box-shadow: 0 10px 28px rgba(22,24,26,0.18),0 0 0 1px var(--line)}
.aava img{width: 100%;height: 100%;object-fit: cover;object-position: 50% 18%;display: block}
@keyframes appIn{from{opacity: 0;transform: translateY(14px)}
to{opacity: 1;transform: none}
}
.app > *{animation: appIn 0.4s cubic-bezier(0.22,0.61,0.36,1) both}
.app > :nth-child(2){animation-delay: 0.06s}
.app > :nth-child(3){animation-delay: 0.12s}
.app > :nth-child(4){animation-delay: 0.18s}
.app > :nth-child(5){animation-delay: 0.24s}
.app > :nth-child(n+6){animation-delay: 0.3s}
@media (prefers-reduced-motion: reduce){.app > *{animation: none}
.app__wa{transition: none}
.app__wa:active{transform: none}
}
.app__hero{padding: 14px 2px 6px}
.app__kick{font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.15em;text-transform: uppercase;color: var(--accent-ink)}
.app__h1{font-family: var(--display);font-size: clamp(1.85rem,8vw,2.5rem);font-weight: 700;letter-spacing: -0.035em;line-height: 1.07;margin-top: 9px;text-wrap: balance}
.app__sub{font-size: 15px;line-height: 1.6;color: var(--muted);margin-top: 10px;max-width: 42ch}
.asec{font-family: var(--mono);font-size: 11px;font-weight: 600;letter-spacing: 0.15em;text-transform: uppercase;color: #666b73;margin: 12px 2px 0}
.acard{display: block;background: #ffffff;border: 1px solid var(--line);border-radius: 20px;padding: 18px;box-sizing: border-box}
.acard--dark{background: #131416;border-color: #131416;color: #ffffff}
.acard--accent{background: var(--accent-cta);border-color: var(--accent-cta);color: #ffffff}
a.acard{transition: transform 0.2s cubic-bezier(0.22,0.61,0.36,1),border-color 0.2s}
a.acard:active{transform: scale(0.98)}
.agrid{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 12px}
.arow{display: flex;align-items: center;justify-content: space-between;gap: 12px;min-height: 52px;border-top: 1px solid #ececee;font-size: 14.5px;font-weight: 500;color: var(--ink)}
.arow:first-child{border-top: 0;min-height: 44px}
.arow b{font-weight: 600}
.arow > span{color: var(--muted);font-weight: 400;font-size: 13.5px;text-align: right}
.arow svg{color: #9ba0a8;flex-shrink: 0}
.ashot{display: block;border-radius: 14px;overflow: hidden;aspect-ratio: 16/10;background: #eceded}
.ashot img{width: 100%;height: 100%;object-fit: cover;display: block}
.achips{display: flex;flex-wrap: wrap;gap: 8px}
.achips span{font-size: 12px;font-weight: 600;color: var(--ink);border: 1px solid var(--line);border-radius: 999px;padding: 6px 11px;background: #ffffff}
.ago{display: inline-flex;align-items: center;gap: 8px;font-size: 13.5px;font-weight: 600;color: var(--accent-ink)}
@media (prefers-reduced-motion: reduce){a.acard,.dock a{transition: none}
a.acard:active,.dock a:active{transform: none}
}
.tmfx{position: fixed;inset: 0;z-index: 70;display: flex;align-items: center;justify-content: center;background: rgba(240,239,236,0.8);-webkit-backdrop-filter: blur(12px);backdrop-filter: blur(12px);opacity: 0;transition: opacity 0.3s ease;pointer-events: none}
.tmfx.on{opacity: 1}
.tmfx__plane{position: absolute;left: 4%;bottom: 30%;color: var(--accent-cta);filter: drop-shadow(0 10px 22px color-mix(in oklab,var(--accent) 40%,transparent));animation: tmPlane 1.5s cubic-bezier(0.5,0,0.3,1) 0.12s both}
@keyframes tmPlane{0%{transform: translate(-24vw,12vh) rotate(24deg) scale(0.7);opacity: 0}
14%{opacity: 1}
55%{transform: translate(36vw,-14vh) rotate(-2deg) scale(1.08)}
100%{transform: translate(108vw,-40vh) rotate(-20deg) scale(0.85);opacity: 1}
}
.tmfx__ok{display: flex;flex-direction: column;align-items: center;gap: 15px;animation: tmPop 0.5s cubic-bezier(0.34,1.56,0.64,1) both}
.tmfx__ok[hidden]{display: none}
.tmfx__ring{width: 78px;height: 78px;border-radius: 999px;background: var(--accent-cta);color: #ffffff;display: flex;align-items: center;justify-content: center;box-shadow: 0 16px 44px color-mix(in oklab,var(--accent) 45%,transparent)}
.tmfx__ok b{font-family: var(--display);font-size: clamp(1.3rem,5vw,1.7rem);font-weight: 700;letter-spacing: -0.03em;color: var(--ink)}
@keyframes tmPop{0%{transform: scale(0.4);opacity: 0}
60%{transform: scale(1.07);opacity: 1}
100%{transform: scale(1);opacity: 1}
}
@keyframes skel{0%{background-position: 120% 0}
100%{background-position: -20% 0}
}
.skel{border: 1px solid #ececee;border-radius: 12px;background: linear-gradient(100deg,#ececee 40%,#f8f8f8 50%,#ececee 60%);background-size: 220% 100%;animation: skel 1.1s linear infinite}
.tm-leer{grid-column: 1 / -1;text-align: center;padding: 20px 12px;border: 1px dashed #d9dade;border-radius: 14px;color: #5b6068;font-size: 13.5px;line-height: 1.55;animation: appIn 0.35s cubic-bezier(0.22,0.61,0.36,1) both}
.tm-leer svg{display: block;margin: 0 auto 8px;color: #9ba0a8}
@media (prefers-reduced-motion: reduce){.skel,.tm-leer{animation: none}
}
.tprog{height: 4px;border-radius: 99px;background: #ececee;overflow: hidden}
.tprog i{display: block;height: 100%;background: var(--accent-cta);border-radius: 99px;transition: width 0.35s cubic-bezier(0.22,0.61,0.36,1)}
.a2hs{position: fixed;left: 14px;right: 14px;bottom: calc(var(--dock-h,96px) + env(safe-area-inset-bottom) + 8px);z-index: 46;background: #ffffff;border: 1px solid var(--line);border-radius: 18px;padding: 16px;box-shadow: 0 18px 48px rgba(22,24,26,0.2);max-width: 560px;margin: 0 auto;box-sizing: border-box;transform: translateY(16px);opacity: 0;transition: transform 0.3s cubic-bezier(0.22,0.61,0.36,1),opacity 0.3s}
.a2hs.on{transform: none;opacity: 1}
.a2hs b{font-size: 15px;font-weight: 700;letter-spacing: -0.01em}
.a2hs p{font-size: 13px;color: #5b6068;line-height: 1.5;margin-top: 4px}
.a2hs div{display: flex;gap: 8px;margin-top: 12px}
.a2hs__go{flex: 1;min-height: 44px;border: 0;border-radius: 999px;background: var(--accent-cta);color: #ffffff;font: inherit;font-size: 14px;font-weight: 600;cursor: pointer}
.a2hs__no{min-height: 44px;border: 1px solid #d6d8db;border-radius: 999px;background: #ffffff;color: var(--ink);font: inherit;font-size: 14px;font-weight: 500;padding: 0 18px;cursor: pointer}
@media (prefers-reduced-motion: reduce){.a2hs,.tprog i{transition: none}
}
.gbw-slot{min-height: 20px;display: inline-flex;align-items: center}
.gbw{display: inline-flex;align-items: center;gap: 8px;text-decoration: none;color: var(--ink);font-size: 13px;line-height: 20px;min-height: 44px}
.gbw:hover .gbw__zahl{text-decoration: underline}
.gbw__sterne{position: relative;display: inline-block;height: 14px;flex: none}
.gbw__leer,.gbw__voll{display: flex;gap: 2px;height: 14px}
.gbw__leer{color: #cfd2d6}
.gbw__voll{position: absolute;inset: 0;overflow: hidden;color: var(--accent)}
.gbw svg{width: 14px;height: 14px;fill: currentColor;flex: none;display: block}
.gbw__wert{font-weight: 700;letter-spacing: -0.01em}
.gbw__zahl{color: #5b6068}
@media (max-width: 520px){.gbw__zahl{font-size: 12px}
}
.app__faq{margin-top: 30px}
.app__h2{font-family: var(--display);font-size: clamp(1.35rem,5.6vw,1.7rem);font-weight: 700;letter-spacing: -0.03em;line-height: 1.12;margin-bottom: 6px;text-wrap: balance}
.afq{border-top: 1px solid #e1e2e4}
.afq:last-of-type{border-bottom: 1px solid #e1e2e4}
.afq>summary{list-style: none;cursor: pointer;display: flex;align-items: center;justify-content: space-between;gap: 14px;min-height: 48px;padding: 12px 0;font-size: 15px;font-weight: 600;letter-spacing: -0.005em;color: var(--ink)}
.afq>summary::-webkit-details-marker{display: none}
.afq>summary:focus-visible{outline: 2px solid var(--accent);outline-offset: 3px;border-radius: 6px}
.afq__i{flex: none;width: 9px;height: 9px;border-right: 2px solid #9aa0a7;border-bottom: 2px solid #9aa0a7;transform: rotate(45deg) translate(-2px,-2px);transition: transform .2s}
.afq[open]>summary .afq__i{transform: rotate(-135deg) translate(-2px,-2px)}
.afq>p{font-size: 14.5px;line-height: 1.62;color: var(--muted);margin: 0 0 16px;padding-right: 22px}
.werk-reihe{margin-bottom: clamp(32px,7vw,100px)}
.werk{display: none}
@media (min-width: 880px){.werk-reihe{display: grid;grid-template-columns: minmax(0,1fr) clamp(300px,32vw,430px);gap: clamp(28px,4vw,72px);align-items: center}
.werk{display: block}
}
.werk__typo{display: flex;justify-content: center;align-items: baseline;font-size: clamp(3.2rem,5.5vw,5.2rem);font-weight: 700;letter-spacing: -0.035em;line-height: 1;height: 1.1em;white-space: nowrap}
.werk__punkt{color: var(--accent-ink);display: inline-block}
.werk__zeile{font-size: 12.5px;color: var(--muted);text-align: center;margin: 16px 0 0}
