@layer reset,base,components,utilities;@layer reset{*,*:before,*:after{box-sizing:border-box}*{margin:0}:root{text-size-adjust:none}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}input,button,textarea,select{font:inherit}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;text-wrap:balance}button{all:unset;cursor:pointer;box-sizing:border-box;&:focus-visible{outline:revert}}p{text-wrap:pretty}a{color:inherit;text-decoration:none}.text-wrap{line-height:1.5;text-wrap:pretty;>*:first-child{margin-top:0}>*:last-child{margin-bottom:0}}}@layer base{@font-face{font-display:swap;font-family:Satoshi;font-style:normal;font-weight:900;src:url(/src/fonts/Satoshi-Black.woff2) format("woff2")}@font-face{font-display:swap;font-family:Outfit;font-style:normal;font-weight:300;src:url(/src/fonts/outfit-v11-latin-300.woff2) format("woff2")}@font-face{font-display:swap;font-family:Outfit;font-style:normal;font-weight:500;src:url(/src/fonts/outfit-v11-latin-500.woff2) format("woff2")}}@layer base{.skip-to-content{position:absolute;left:-9999px;top:0;z-index:100;padding:.75rem 1.5rem;background:var(--color-blue);color:#fff;font-weight:600;text-decoration:none}.skip-to-content:focus{left:0}:root{--font-headline: "Satoshi", sans-serif;--font-text: "Outfit", sans-serif;--text-sm: 1rem;--text-normal: 1.1rem;--text-lg: 1.75rem;--text-xl: 2rem;--color-blue: rgba(25.021, 56.75, 72.545);--color-slate: rgba(84.457, 102.54, 117.48);--color-grey: rgba(122, 122, 131.84);--color-peach-lightest: rgba(239.99, 189.01, 157.6);--color-peach-light: rgba(252.8, 162.96, 110.94);--color-peach: rgba(245.16, 116.75, 28.868);--color-peach-dark: rgba(194, 65, 12);--color-peach-bg: rgba(from var(--color-peach) r g b / .1);--content-width: 80rem;--max-text-width: 70ch;@media(min-width:30rem){--text-sm: 1.1rem;--text-normal: 1.35rem;--text-lg: 2.2rem;--text-xl: 2.6rem}}::selection{background-color:var(--color-peach-light)}body{font-family:var(--font-text);font-size:var(--text-normal);font-weight:300;line-height:1.5;color:var(--color-blue)}h1{font-size:var(--text-xl);font-family:var(--font-headline);line-height:1.15;font-weight:900;letter-spacing:-.025em;color:var(--color-blue);margin-bottom:.5em}h2{font-size:var(--text-lg);font-family:var(--font-headline);line-height:1.15;font-weight:900;margin-bottom:.25em;&:not(:first-child){margin-top:1rem}}nav{width:100%}p{text-wrap:pretty}p:not(:last-child),ul:not(:last-child){margin-bottom:1.5em}*:focus-visible{outline:2px solid var(--color-peach);outline-offset:2px}.text-link{color:var(--color-peach-dark);font-weight:500;text-decoration:underline;text-underline-offset:.2em;&:hover{color:var(--color-peach)}}.text-wrap{max-width:var(--max-text-width);text-wrap:pretty}.button{border-radius:.375rem;padding:.8rem 1.5rem;background:linear-gradient(135deg,var(--color-peach) 0%,var(--color-peach-light) 100%);color:#fff;font-size:1rem;box-shadow:0 1px 2px #0000000d;transition:background .3s ease;&:hover{background:linear-gradient(135deg,var(--color-peach-light) 0%,var(--color-peach) 100%)}&:focus-visible{outline:2px solid var(--color-peach);outline-offset:2px}}.container{width:100%;margin-inline:auto;padding-inline:.75rem;max-width:var(--content-width);@media(min-width:30rem){padding-inline:1.5rem}}.section{padding-block:4rem;@media(min-width:760px){padding-block:6rem}@media(min-width:1200px){padding-block:8rem}}[data-background=white][data-background]{background-color:#fff}[data-background=peach]{background-color:var(--color-peach-bg)}[data-background=peach]+[data-background=peach],[data-background=white]+[data-background=white]{padding-top:0}main{margin-top:5rem}}@layer components{.header{position:fixed;background-color:#fff9;backdrop-filter:blur(4px);padding-block:1rem;left:0;right:0;top:0;z-index:50;.header__inner{display:flex;justify-content:space-between;align-items:center}}.logo-wrapper{display:flex;align-items:center;gap:.5rem;font-family:var(--font-headline);text-transform:uppercase;color:var(--color-blue);font-weight:900}.logo-icon{width:2rem;height:auto}.logo{font-size:1.5rem;letter-spacing:.17em;text-transform:uppercase}.logo-tagline{display:block;font-size:.75rem;color:var(--color-peach);margin-top:-.5em}}@layer components{.hero{padding-top:2rem;@media(min-width:30rem){padding-top:4rem}.hero__inner{position:relative;display:block;@media(min-width:60rem){display:grid;grid-template-columns:12fr 11fr;grid-template-rows:auto auto;gap:2rem;min-height:75svh}}.hero__content{display:flex;flex-direction:column;justify-content:flex-end;align-items:start}.hero__image{display:none;align-items:center;justify-content:center;@media(min-width:60rem){display:flex}}.hero__stack{position:relative;width:100%;aspect-ratio:5 / 4;&:before{content:"";position:absolute;inset:-2rem;background-image:radial-gradient(circle,rgba(from var(--color-peach) r g b / .3) 2px,transparent 2px);background-size:1.5rem 1.5rem;border-radius:2rem;z-index:0;mask-image:radial-gradient(ellipse 80% 70% at center,black,transparent)}}.hero__stack-card{position:absolute;width:75%;border-radius:.75rem;box-shadow:0 8px 32px rgba(from var(--color-blue) r g b / .12),0 2px 8px rgba(from var(--color-blue) r g b / .08);object-fit:cover;border:1px solid rgba(from var(--color-blue) r g b / .06);transition:transform .4s ease;&:nth-child(1){top:18%;left:2%;z-index:1;transform:rotate(-3deg)}&:nth-child(2){top:28%;left:16%;z-index:2;transform:rotate(1.5deg)}&:nth-child(3){top:38%;left:8%;z-index:3;transform:rotate(-.5deg)}.hero__stack:hover &:nth-child(1){transform:rotate(-5deg) translate(-4%,-4%)}.hero__stack:hover &:nth-child(2){transform:rotate(3deg) translate(2%,-2%)}.hero__stack:hover &:nth-child(3){transform:rotate(0) translateY(4%)}}.hero__logos{grid-column:1 / span 2;display:grid;margin-top:4rem;grid-template-columns:repeat(2,1fr);align-items:center;gap:2rem 1.5rem;@media(min-width:30rem){grid-template-columns:repeat(3,1fr)}@media(min-width:48rem){grid-template-columns:repeat(6,1fr);gap:3rem 2rem}img{max-height:3rem;width:100%;object-fit:contain;#z-laser{transform:translateY(.5rem)}#bluedom{transform:translateY(-.5rem)}}}}}@layer components{.cards{display:grid;margin-top:4rem;gap:3rem 1rem;grid-template-columns:1fr;@media(min-width:48rem){grid-template-columns:repeat(auto-fill,minmax(20rem,1fr))}}.card{font-size:var(--text-sm);padding:.625rem;border-radius:3px;.card__icon{display:inline-block;background-color:var(--color-peach-light);border-radius:.5rem;padding:.5rem;svg{width:1.5rem;height:1.5rem}&.card__icon--filament svg{filter:brightness(0)}}.card__title{font-size:1.15rem;font-weight:500;margin-top:.75em;margin-bottom:.5em}}}@layer components{.about{background-color:var(--color-peach-bg);overflow:visible;position:relative;z-index:1;.about__inner{display:flex;flex-direction:column;gap:2rem;margin-block:4rem;@media(max-width:75rem){max-width:40rem}@media(min-width:75rem){display:grid;grid-template-columns:1fr 2fr}}.about__content{display:flex;flex-direction:column;justify-content:center;align-items:start}.about__links{display:flex;flex-direction:column;align-items:start;gap:.5rem;margin-top:2rem}.about__image{display:flex;align-items:start;@media(min-width:75rem){margin-top:-4rem;margin-bottom:-4rem}img{position:relative;z-index:1;width:100%;aspect-ratio:1 / 1;max-width:32rem;border-radius:1rem;object-fit:cover;box-shadow:.5rem .5rem 0 var(--color-peach-light);@media(min-width:75rem){aspect-ratio:3 / 4}}}}.facts{display:flex;flex-direction:column;width:100%;gap:2rem;margin-top:2rem;@media(min-width:30rem){flex-direction:row}}.fact{border-left:1px solid var(--color-peach-light);flex-basis:50%;padding-left:1rem;.fact__label{font-size:.875rem;opacity:.8}.fact__value{font-size:2rem;font-weight:700;margin-top:.5rem}}}@layer components{.testimonial{max-width:var(--max-text-width);blockquote{line-height:1.8;em{font-style:normal;background-color:var(--color-peach-bg)}}figcaption{display:flex;align-items:center;gap:1.5rem}.author-avatar{width:3rem;height:3rem;border-radius:50%;object-fit:cover}.author-name{font-weight:500}.author-title{margin-top:.15rem;opacity:.8}}.testimonials{.testimonials__title{font-weight:500;grid-column:1 / -1}.testimonials__inner{display:flex;flex-direction:column;gap:2rem;@media(min-width:75rem){display:grid;grid-template-columns:1fr 1fr}}.testimonial{display:flex;flex-direction:column;padding-bottom:2.5rem}.testimonial:first-of-type{@media(min-width:75rem){grid-column:1 / -1;max-width:none;padding-bottom:0;border-bottom:1px solid rgba(17,24,39,.1);padding-bottom:2rem;blockquote{max-width:var(--max-text-width)}}}.testimonial figure{display:flex;flex:1;flex-direction:column;justify-content:space-between}.testimonial blockquote{font-size:var(--text-sm);line-height:2rem}.testimonial figcaption{margin-top:2.5rem}.testimonial__logo{height:2rem;margin-left:auto;opacity:.5}.testimonial .author{font-size:1rem}@media(min-width:75rem){.testimonial{padding-bottom:0;padding-right:2rem}.testimonial:last-child{border-left:1px solid rgba(17,24,39,.1);padding-left:2rem;padding-right:0}}}}@layer components{.footer{color:#fff;background-color:var(--color-blue);a{text-decoration:none;transition:color .4s;&:hover{color:var(--color-peach)}}}.footer__grid{display:flex;flex-direction:column;gap:3rem;@media(min-width:768px){flex-direction:row;justify-content:space-between;gap:2rem}}.footer__left{display:flex;flex-direction:column;gap:1rem}.footer__logo{font-family:var(--font-headline);font-size:1.5rem;font-weight:900;letter-spacing:.17em;text-transform:uppercase}.footer__address{font-style:normal;font-size:var(--text-sm);opacity:.8;line-height:1.6}.footer__contact{font-size:var(--text-sm);line-height:1.8}.footer__social{display:flex;gap:1.25rem;margin-top:.5rem;svg{height:1.25rem;width:1.25rem}}.footer__right{display:flex;flex-wrap:wrap;gap:3rem;@media(min-width:768px){gap:4rem}}.footer__heading{font-size:var(--text-sm);font-weight:600;margin-bottom:1rem;opacity:.6;text-transform:uppercase;letter-spacing:.05em}.footer__links{display:flex;flex-direction:column;gap:.625rem;font-size:var(--text-sm)}}@layer components{.cta__title p{max-width:45rem}.cta__button{text-wrap:nowrap}.cta__content{display:flex;align-items:center;justify-content:space-between;gap:2.5rem}.cta__image{display:none;flex-shrink:0;@media(min-width:64rem){display:block}img{width:16rem;height:16rem;object-fit:cover;border-radius:42% 58% 65% 35%/38% 63% 37% 62%;border:6px solid var(--color-peach)}}@media(max-width:1024px){.cta__content{flex-direction:column;text-align:center}}@media(max-width:640px){.cta__container{padding:6rem 1.5rem}}}@layer components{.details__list{margin-top:5rem;gap:4rem}details{border-bottom:1px solid var(--color-peach-lightest);&[open]{padding-bottom:1.5rem;summary:after{transform:translateY(-50%) rotate(45deg)}}&:last-child{border-bottom:none}div{font-size:var(--text-normal);margin-top:.5rem;max-width:var(--max-text-width)}summary{position:relative;padding:1rem 0;cursor:pointer;list-style:none;font-size:var(--text-normal);font-weight:500;&::-webkit-details-marker{display:none}&:after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:2rem;color:var(--color-peach);transition:transform .2s}}}}@layer components{.home .projects{padding-top:3rem;@media(min-width:61.25rem){padding-top:6rem}}.projects__title{font-size:var(--text-lg);font-weight:500}.projects__inner{display:flex;flex-direction:column;gap:6rem;@media(min-width:61.25rem){gap:12rem}}.project{display:flex;flex-direction:column;position:relative;gap:2rem;@media(min-width:61.25rem){display:grid;grid-template-columns:1fr 1fr}}.project__image-wrapper{position:relative;width:100%;flex-shrink:0;border-radius:1rem;border:1px solid rgba(17,24,39,.1);overflow:clip;@media(min-width:61.25rem){margin-top:-6rem}}.project__image{width:100%;height:100%;object-position:top left;object-fit:cover}.project__meta{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.project__company{font-weight:500}.project__meta .project__company:after{content:"\b7";margin-left:.5rem;opacity:.4}.project__category{opacity:.5}.project__title{margin-top:.25rem;font-weight:500}.project__description{font-size:var(--text-sm);margin-top:.5rem;margin-bottom:0}.project__link{display:inline-flex;align-items:center;gap:.25rem;margin-top:1rem;font-size:var(--text-sm);font-weight:500;color:var(--color-blue);text-decoration:none;&:hover{text-decoration:underline}}.project__footer{margin-top:.75rem;padding-top:.75rem;border-top:1px solid rgba(from var(--color-blue) r g b / .1)}.project__logo{height:1.75rem}@media(max-width:768px){.project{grid-template-columns:1fr}.projects__grid{gap:3rem}}}@layer components{.case-study-back{display:inline-block;font-size:1rem;margin-bottom:2rem;opacity:.7;transition:opacity .3s;&:hover{opacity:1}}.case-study-hero{padding-top:2rem;@media(min-width:30rem){padding-top:4rem}}.case-study-hero__inner{display:flex;flex-direction:column;gap:3rem;@media(min-width:61.25rem){display:grid;grid-template-columns:2fr 1fr;gap:4rem}}.case-study-meta{display:inline-flex;align-items:center;padding:.125rem .5rem;font-size:.75rem;font-weight:500;background-color:var(--color-peach-bg);color:var(--color-peach);border-radius:1rem;margin-bottom:1rem}.case-study-hero__details{display:flex;flex-direction:column;gap:1.5rem}.case-study-detail{border-left:2px solid var(--color-peach-light);padding-left:1rem}.case-study-detail__label{font-size:.875rem;opacity:.7}.case-study-detail__value{font-weight:500;margin-top:.25rem}.case-study-features{display:grid;gap:2rem;margin-top:3rem;grid-template-columns:1fr;@media(min-width:40rem){grid-template-columns:1fr 1fr}}.case-study-feature{padding:1.5rem;border-radius:.5rem;background-color:#fff;border:1px solid rgba(from var(--color-blue) r g b / .08);h3{font-size:1.15rem;font-weight:500;margin-bottom:.5rem}p{font-size:var(--text-sm)}}.case-study-comparison{display:grid;gap:2rem;margin-top:3rem;grid-template-columns:1fr;@media(min-width:40rem){grid-template-columns:1fr 1fr}+&{margin-top:2rem}}.case-study-comparison__item{display:flex;flex-direction:column;gap:.75rem}.case-study-comparison__label{display:inline-flex;align-self:start;padding:.125rem .75rem;font-size:.875rem;font-weight:500;border-radius:1rem;border:1px solid rgba(from var(--color-blue) r g b / .1)}.case-study-comparison__image{border-radius:1rem;border:1px solid rgba(17,24,39,.1);overflow:clip;background-color:#f9fafb;aspect-ratio:16 / 10;img{width:100%;height:100%;object-fit:cover;object-position:top left}}.case-study-gallery{display:grid;gap:1.5rem;margin-top:2rem;grid-template-columns:1fr;@media(min-width:40rem){grid-template-columns:1fr 1fr}figure{margin:0;&:first-child{@media(min-width:40rem){grid-column:1 / -1}}}figcaption{font-size:.8rem;color:#6b7280;margin-top:.5rem}.case-study-comparison__label{margin-bottom:.5rem}}.case-study-gallery__item{border-radius:1rem;border:1px solid rgba(17,24,39,.1);overflow:clip;background-color:#f9fafb;aspect-ratio:16 / 10;img{width:100%;height:100%;object-fit:cover;object-position:top left}&:first-child{@media(min-width:40rem){grid-column:1 / -1}}}.case-study-gallery--phone{@media(min-width:40rem){grid-template-columns:repeat(3,1fr)}@media(min-width:61.25rem){grid-template-columns:repeat(5,1fr)}figure:first-child{@media(min-width:40rem){grid-column:auto}}.case-study-comparison__image{aspect-ratio:9 / 16}}.case-study-showcase{display:flex;flex-direction:column;gap:2rem;margin-top:2rem;@media(min-width:40rem){flex-direction:row;justify-content:center;align-items:flex-start}>div{flex:1;text-align:center;img{width:100%;border-radius:8px;box-shadow:0 8px 30px #0000001f}}.case-study-comparison__label{margin-bottom:.5rem}}.case-study-sidebyside{display:flex;flex-direction:column;gap:2rem;margin-top:2rem;@media(min-width:40rem){flex-direction:row;align-items:stretch}figure{margin:0;display:flex;flex-direction:column}.case-study-sidebyside__phone{@media(min-width:40rem){flex:0 0 25%}.case-study-comparison__image{aspect-ratio:auto;flex:1}}.case-study-sidebyside__desktop{flex:1;.case-study-comparison__image{aspect-ratio:auto;flex:1}}.case-study-comparison__label{margin-bottom:.5rem}figcaption{font-size:.8rem;color:#6b7280;margin-top:.5rem}}.case-study-video{margin-top:2rem;border-radius:1rem;overflow:clip;video{width:100%;display:block}}.project__case-study-link{font-weight:500;font-size:1rem;color:var(--color-peach);transition:opacity .3s;&:hover{opacity:.8}}.case-study-quote{blockquote{font-size:var(--text-normal)}figcaption{margin-top:2rem}.author-title{font-size:1rem}}}@layer components{.header__nav{display:none;align-items:center;justify-content:flex-end;gap:2rem;flex:1;@media(min-width:48rem){display:flex}}.header__nav a:not(.button){font-size:1rem;font-weight:500;color:var(--color-blue);transition:color .2s;&:hover,&.is-active{color:var(--color-peach)}}.header__nav .button{font-size:.875rem;padding:.6rem 1.25rem}.mobile-nav-toggle{position:fixed;bottom:1.5rem;right:1.5rem;z-index:100;width:3.5rem;height:3.5rem;border-radius:50%;border:none;background:var(--color-blue);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #00000026;transition:transform .3s ease;@media(min-width:48rem){display:none}&:hover{transform:scale(1.05)}svg{width:1.5rem;height:1.5rem;transition:opacity .2s,transform .2s}.icon-close{position:absolute;opacity:0;transform:rotate(-90deg)}&[aria-expanded=true]{.icon-burger{opacity:0;transform:rotate(90deg)}.icon-close{opacity:1;transform:rotate(0)}}}.mobile-nav-backdrop{position:fixed;inset:0;z-index:98;backdrop-filter:blur(8px);background:#fff3;opacity:0;pointer-events:none;transition:opacity .3s ease;@media(min-width:48rem){display:none}&.is-open{opacity:1;pointer-events:auto}}.mobile-nav{position:fixed;bottom:6rem;right:1.5rem;width:calc(100vw - 3rem);z-index:99;background:var(--color-blue);border-radius:1rem;padding:1.5rem 2rem;display:flex;flex-direction:column;gap:1.25rem;box-shadow:0 8px 32px #0003;transform-origin:bottom right;transform:scale(0);opacity:0;transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .25s ease;pointer-events:none;@media(min-width:48rem){display:none}&.is-open{transform:scale(1);opacity:1;pointer-events:auto}a{font-size:1.1rem;font-weight:500;color:#fff;white-space:nowrap;transition:color .2s;&:hover,&.is-active{color:var(--color-peach)}}}}@layer components{.comparison-hero{padding-top:2rem;@media(min-width:30rem){padding-top:4rem}}.comparison-grid{display:grid;gap:1.5rem;margin-top:3rem;grid-template-columns:1fr;@media(min-width:48rem){grid-template-columns:repeat(2,1fr)}@media(min-width:75rem){grid-template-columns:repeat(3,1fr)}}.comparison-card{background:#fff;border-radius:.75rem;padding:2rem;[data-background=white] &{background:var(--color-peach-bg)}h3{font-size:1.15rem;font-weight:600;margin-bottom:.75em}p{font-size:var(--text-sm);line-height:1.7}}.comparison-table-wrapper{margin-top:3rem}.comparison-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);th,td{padding:1rem 1.25rem;text-align:left;border-bottom:1px solid rgba(from var(--color-blue) r g b / .1)}thead th{font-family:var(--font-headline);font-weight:700;font-size:1.1rem;padding-bottom:1.25rem}thead th:first-child{width:20%}tbody td:first-child{font-weight:500}.comparison-table__highlight{color:var(--color-peach);font-weight:500}@media(max-width:47.99rem){thead{display:none}tbody tr{display:grid;gap:.5rem;padding:1.25rem 0;border-bottom:1px solid rgba(from var(--color-blue) r g b / .1)}tbody tr:last-child{border-bottom:none}tbody td{display:block;padding:0;border-bottom:none}tbody td:first-child{font-family:var(--font-headline);font-weight:700;font-size:1rem}tbody td:nth-child(2):before{content:"Solo-Entwickler: ";font-weight:500}tbody td:nth-child(3):before{content:"Web-Agentur: ";font-weight:500}}}}@layer components{.process{display:grid;gap:2rem;margin-top:4rem;counter-reset:process-step;@media(min-width:75rem){grid-template-columns:repeat(5,1fr);gap:1.5rem}}.process__step{counter-increment:process-step;position:relative;padding-left:3.5rem;@media(min-width:75rem){padding-left:0;padding-top:3.5rem}}.process__step:before{content:counter(process-step);position:absolute;left:0;top:0;width:2.5rem;height:2.5rem;border-radius:50%;background:linear-gradient(135deg,var(--color-peach) 0%,var(--color-peach-light) 100%);color:#fff;font-family:var(--font-headline);font-weight:900;font-size:1.1rem;display:flex;align-items:center;justify-content:center;@media(min-width:75rem){top:0;left:0}}.process__step h3{font-size:1.15rem;font-weight:500;margin-bottom:.5em}.process__step p{font-size:var(--text-sm)}}@layer utilities{.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}