/* A personal composition: large type, overlapping paper, offset project covers. */
.about-hero{position:relative;grid-template-columns:1.1fr 1fr;gap:15px;min-height:700px;padding:45px 0 115px;align-items:center}.about-copy{position:relative;z-index:2}.about-hero .eyebrow{margin-bottom:18px;font-size:11px}.about-hero h1{margin-bottom:22px}.about-hero .intro-prefix{display:block;font:28px/1.2 var(--sans);letter-spacing:-.8px;color:var(--body);margin-bottom:5px}.about-hero .intro-name{display:block;font-size:clamp(160px,20.8vw,300px);line-height:.9;letter-spacing:-.085em;margin-left:-12px}.hero-lead{font-size:21px;max-width:440px;margin-top:29px}.hero-lead br{display:none}.about-points{max-width:450px;margin-top:24px}.text-link{border-color:var(--accent);gap:48px}.about-visual{position:relative;height:510px;margin:10px 20px 0 0;padding:0;isolation:isolate}.workbench-sheet{position:absolute;inset:6px -4px 8px 15px;background:#2525cc;transform:rotate(5deg);z-index:-1;border:1px solid rgba(234,235,242,.45)}.workbench-sheet::before{content:'';position:absolute;inset:13px;border:1px solid rgba(234,235,242,.16)}.workbench-sheet svg{width:100%;height:100%}.about-visual>.hero-mascot{position:absolute;width:94%;max-width:460px;left:7%;bottom:49px;margin:0;transform:rotate(-4deg);transform-origin:55% 80%;transition:transform .35s cubic-bezier(.16,1,.3,1)}.about-visual:hover>.hero-mascot{transform:rotate(-1deg) translateY(-6px)}.about-visual .scribble-note{position:absolute;bottom:-28px;left:18px;margin:0;padding:10px 15px;background:var(--ink);color:var(--bg);font:italic 17px/1.5 Georgia,serif;transform:rotate(-4deg);z-index:3}.scribble-note svg{position:absolute;width:85px;height:50px;right:-90px;top:-31px;color:var(--ink);overflow:visible}
.work-section{padding-top:60px;border-top:0}.work-section .section-intro{padding-bottom:7px;align-items:center}.work-section .section-intro h2{font-size:clamp(54px,7vw,98px);line-height:.97;letter-spacing:-.065em}.work-section .section-intro h2 span{color:var(--muted)}.work-section .section-intro p{border-left:2px solid var(--accent);padding-left:22px;max-width:350px}.work-section .produkte{margin-top:54px;column-gap:25px;align-items:start;padding-bottom:70px}.work-section .produkt:nth-child(1){margin-top:28px}.work-section .produkt:nth-child(2){margin-top:92px}.work-section .produkt:nth-child(3){margin-top:0}.work-section .produkt{outline:1px solid rgba(234,235,242,.18);outline-offset:5px}.work-section .produkt:focus-visible{outline:2px solid var(--ink);outline-offset:7px}.playground{border-top:1px solid var(--line);padding-top:63px}.playground .section-intro h2{font-size:clamp(40px,5vw,64px);letter-spacing:-.045em}.playground .project-tabs{gap:36px;margin-top:29px}.playground .project-tabs button[aria-selected=true]{color:var(--ink)}.playground .project-tabs button::after{height:2px}.playground .desk-stage{padding-top:143px;padding-bottom:10px}
.contact-section{--accent:#eaebf2;position:relative;background:#2525cc;color:#eaebf2;padding:53px 50px 34px;margin-top:45px;margin-bottom:85px;border:0}.contact-section>p{color:rgba(234,235,242,.7)}.contact-section h2{font-size:clamp(65px,10vw,140px);line-height:.87;letter-spacing:-.065em;margin-bottom:35px}.contact-section>a{font-size:20px;color:#eaebf2;border-color:rgba(234,235,242,.55)}.contact-profiles{margin-top:55px;gap:0 32px}.contact-profiles li{border-color:rgba(234,235,242,.3)}.contact-profiles a,.contact-profiles strong{color:#eaebf2}.contact-profiles small{color:rgba(234,235,242,.7)}.contact-profiles a:hover{color:white}.contact-profiles a:hover strong{text-decoration:underline;text-underline-offset:5px}.site-footer{border-top:0}
@media(min-width:1100px){.contact-section h2 br{display:none}.contact-section h2 br::after{content:' '}}
@media(max-width:1100px){.about-hero{min-height:600px;padding-bottom:90px}.about-visual{height:425px;margin-right:10px}.about-hero .intro-name{font-size:21vw}.hero-lead{font-size:19px}.about-points{font-size:12px}.work-section .produkte{gap:18px}.work-section .produkt:nth-child(2){margin-top:65px}.contact-section{padding:44px 35px 20px}.contact-section h2 br{display:none}}
@media(max-width:760px){.about-hero{grid-template-columns:1fr;min-height:0;gap:28px;padding:30px 0 65px}.about-hero .intro-prefix{font-size:23px}.about-hero .intro-name{font-size:clamp(130px,28vw,210px);margin-left:-7px;line-height:.9}.about-copy{max-width:100%}.hero-lead{font-size:20px;margin-top:20px;max-width:410px}.about-points{display:flex;max-width:440px;margin:22px 0 16px}.about-visual{height:380px;width:min(92%,480px);margin:18px auto 0;display:block}.about-visual>.hero-mascot{width:86%;left:12%;bottom:22px;max-width:355px}.workbench-sheet{inset:10px 9px 0 0;transform:rotate(4deg)}.about-visual .scribble-note{bottom:-16px;left:8px;font-size:15px}.scribble-note svg{right:-67px;top:-34px;width:65px}.work-section{padding-top:43px}.work-section .section-intro{align-items:flex-start;gap:25px}.work-section .section-intro h2{font-size:65px}.work-section .section-intro p{font-size:14px;padding-left:18px}.work-section .produkte{margin-top:30px;gap:36px;padding-bottom:43px;padding-inline:6px}.work-section .produkt:nth-child(n){margin-top:0}.work-section .produkt:nth-child(2){margin-left:12px}.work-section .produkt:nth-child(1),.work-section .produkt:nth-child(3){margin-right:12px}.work-section .produkt{outline-offset:4px}.playground{padding-top:37px;padding-bottom:25px}.playground .section-intro h2{font-size:39px}.playground .desk-stage{padding-top:116px}.contact-section{width:calc(100% - 28px);padding:33px 22px 12px;margin-top:30px;margin-bottom:50px}.contact-section h2{font-size:72px;line-height:.9}.contact-section h2 br{display:initial}.contact-section>a{font-size:16px;gap:19px}.contact-profiles{margin-top:36px;gap:0 19px}.contact-profiles strong{font-size:13px}.contact-profiles a{gap:11px}.contact-profiles svg{width:24px;height:24px}}
@media(max-width:390px){.about-visual{height:325px;width:94%}.about-visual>.hero-mascot{width:92%;left:9%;bottom:19px}.about-visual .scribble-note{font-size:13px;left:0}.scribble-note svg{right:-55px;width:53px}.contact-profiles{grid-template-columns:1fr}.contact-profiles strong{font-size:16px}.contact-section h2{font-size:65px}.about-hero .intro-name{font-size:30vw}}
@media(prefers-reduced-motion:reduce){.about-visual>.hero-mascot{transition:none;transform:rotate(-4deg)}.about-visual:hover>.hero-mascot{transform:rotate(-4deg)}}