:root{--color-dark:#101010;--color-light:#FFFBF2;--color-lightdark:#616161;--color-accent:#2D9922;--color-accent-hover:#1d5e01;--font-base:16px;--fontsize-tiny:clamp(0.9rem, 1.1vw, 1rem);--fontsize-small:clamp(1rem, 1.4vw, 1.2rem);--fontsize-text:clamp(1.2rem, 2vw, 1.7rem);--fontsize-h3:clamp(1.8rem, 2.5vw, 2.2rem);--fontsize-h2:clamp(2.2rem, 3.5vw, 3rem);--fontsize-h1:clamp(2.8rem, 4.5vw, 4rem)}@media(max-width:768px){:root{--fontsize-tiny:clamp(0.9rem, 1.1vw, 1rem);--fontsize-small:clamp(1.3rem, 1.7vw, 1.6rem);--fontsize-text:clamp(1.6rem, 3vw, 2rem);--fontsize-h3:clamp(2.3rem, 3vw, 2.7rem);--fontsize-h2:clamp(3rem, 5.5vw, 3.5rem);--fontsize-h1:clamp(3.5rem, 5vw, 4.5rem)}}html,body{overflow-x:hidden;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100vh;display:flex;flex-direction:column;margin:0;padding:0;background-color:var(--color-dark);color:var(--color-light);font-family:zalando sans semiexpanded,sans-serif;font-weight:400;overflow-x:hidden;width:100%;box-sizing:border-box}.wrapper{flex:1 0 auto}footer{flex-shrink:0}*{max-width:100vw;box-sizing:border-box}body{font-family:zalando sans semiexpanded,sans-serif;font-weight:400}h1{font-size:var(--fontsize-h1);font-weight:700;line-height:1.2;margin-bottom:1.5rem}h2{font-size:var(--fontsize-h2);font-weight:600;line-height:1.3;margin-bottom:1.5rem;text-align:center}h3{font-size:var(--fontsize-h3);font-weight:600;line-height:1.3;margin-bottom:1rem}p{font-size:var(--fontsize-text);line-height:1.6;margin-bottom:1rem}#about,#portfolio,#hero,#contact{scroll-margin-top:5rem}.navbar.navbar-default{background-color:rgba(255,251,242,0);color:var(--color-light);transition:background-color .3s ease,color .3s ease;border-bottom:none;box-shadow:none}.navbar.navbar-default .navbar-brand{color:var(--color-light)!important;font-size:var(--fontsize-text);font-weight:700;text-transform:none;transition:color .3s ease;text-shadow:0 2px 6px rgba(0,0,0,.3)}@media(max-width:768px){.navbar.navbar-default .navbar-brand{font-size:calc(var(--fontsize-text)*1.2)}}@media(max-width:768px){.navbar-header{display:flex;align-items:center;justify-content:space-between;padding:1rem}.navbar-header .navbar-brand{order:1}.navbar-header .navbar-toggle{order:2;float:none;margin:0;align-self:flex-start}.navbar-toggle i{font-size:3rem}}.navbar.navbar-default .navbar-nav>li>a{color:var(--color-light)!important;font-size:var(--fontsize-text);font-weight:400;transition:color .3s ease;text-shadow:0 2px 6px rgba(0,0,0,.4)}@media(max-width:768px){.navbar.navbar-default .navbar-nav>li>a{text-shadow:0 2px 6px transparent}}.navbar.navbar-default .navbar-nav>li>a:hover,.navbar.navbar-default .navbar-nav.navbar-right>li>a:hover{color:#1db954}.navbar-nav.navbar-right{display:flex;align-items:center;justify-content:flex-end;gap:2rem;padding:1rem}.navbar.navbar-default.scrolled{background-color:var(--color-dark)!important;color:var(--color-light)!important}.navbar.navbar-default.scrolled .navbar-brand,.navbar.navbar-default.scrolled .navbar-nav>li>a,.navbar.navbar-default.scrolled .navbar-nav.navbar-right>li>a{color:var(--color-light)!important}@media(max-width:768px){.navbar.navbar-default .navbar-brand{opacity:0;transition:color .3s ease}.navbar.navbar-default.scrolled .navbar-brand{opacity:1}}.navbar-toggle.open .top-bar{transform:rotate(45deg)translate(5px,5px)}.navbar-toggle.open .middle-bar{opacity:0}.navbar-toggle.open .bottom-bar{transform:rotate(-45deg)translate(5px,-5px)}.navbar-toggle .icon-bar{transition:all .3s ease}.hamburger-icon{display:inline;font-size:1.5rem;color:var(--color-light)}.close-icon{display:none;font-size:1.5rem;color:var(--color-light)}.navbar-toggle.open .hamburger-icon{display:none}.navbar-toggle.open .close-icon{display:inline}.navbar-toggle i{font-size:1.5em;color:var(--color-light);transition:color .3s ease,transform .3s ease}.navbar-toggle.open i.bi-x-lg{color:var(--color-dark)}.navbar-toggle.open,.navbar-toggle.collapsed,.navbar-toggle:focus,.navbar-toggle:active{background-color:transparent!important;box-shadow:none!important;outline:none!important}.navbar-toggle.open{border:1.5px solid var(--color-dark);border-radius:6px;background-color:var(--color-light)}.language-switcher{display:flex!important;flex-direction:row!important;height:100%;gap:.5rem;font-size:var(--fontsize-text)}.language-switcher .flag-icon{width:2.4rem;height:auto;vertical-align:middle}.language-switcher .lang-link{color:var(--color-light);text-decoration:none;font-weight:500;display:flex;align-items:center;gap:.25rem;opacity:.5}.language-switcher .lang-link.active{opacity:1}.language-switcher .lang-link:hover{opacity:.9}.language-switcher .separator{color:var(--color-light);opacity:.8;display:inline-block;margin:0 .25rem;vertical-align:middle}@media(max-width:768px){.navbar-toggle i{font-size:3rem}.navbar-collapse.collapse{position:fixed;inset:0;margin:0!important;max-height:none!important;background-color:var(--color-light);z-index:1050;transition:none!important;display:flex;flex-direction:column;padding:0;box-sizing:border-box;overflow-y:auto;transform:translateX(100%)}.navbar-collapse.collapse .mobile-menu-wrapper{flex:auto;display:flex;flex-direction:column;justify-content:flex-end;gap:3rem;padding:7rem 5rem 2rem 2rem;box-sizing:border-box}.navbar-collapse.collapse .menu-links{display:flex;flex-direction:column;align-items:flex-end;gap:2rem;overflow-y:auto}.navbar-collapse.collapse .menu-actions{display:flex;flex-direction:column;align-items:flex-end;gap:1rem}.navbar-toggle{z-index:2000;border:1.5px solid var(--color-light);border-radius:6px;background:0 0;outline:none;transition:all .2s ease;width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center}.navbar-nav.navbar-right{flex-direction:column;align-items:flex-end}.navbar-collapse.collapse.open{transform:translateX(0)}.navbar-collapse.collapse .navbar-nav{flex-direction:column;text-align:right;margin:0;padding:0}.navbar-collapse.collapse.open .navbar-nav>li>a{padding:1rem 0;color:var(--color-dark)!important;font-size:calc(var(--fontsize-h3) * 1.3);font-weight:500}.navbar-collapse.collapse .navbar-nav>li>a:hover{color:var(--color-accent)}.navbar-collapse.collapse .navbar-right{flex-direction:column;align-items:flex-end;margin-top:2rem;gap:1rem}.mobile-overlay{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;background-color:rgba(0,0,0,.1);z-index:1040;transition:opacity .5s ease;opacity:0}.mobile-overlay.active{display:block;opacity:1}.navbar-collapse.collapse .language-switcher{color:#000;font-size:.95rem;padding-bottom:3rem}.navbar-collapse.collapse .language-switcher .flag-icon{width:3rem}.navbar-collapse.collapse .language-switcher .lang-link{color:var(--color-dark)!important;text-decoration:none;font-weight:400;font-size:var(--fontsize-text);display:flex;align-items:center;gap:.3rem}.navbar-collapse.collapse .language-switcher .separator{color:var(--color-light)!important}}.section{max-width:1200px;margin-inline:auto;padding-left:clamp(1rem,10vw,5rem);padding-right:clamp(1rem,10vw,5rem);padding-top:10rem;padding-bottom:10rem;width:100%;box-sizing:border-box}@media(max-width:768px){.section{padding-inline:3rem;padding-top:7rem;padding-bottom:7rem}}.portfolio-section{background-color:var(--color-dark)}.about-section{background-color:var(--color-light);color:var(--color-dark)}.contact-section{background-color:var(--color-dark);color:var(--color-dark);padding-bottom:15rem}#contact .section{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.7rem}.hero-section{position:relative;width:100%;height:70vh;background-image:url(/images/IMG_5133_16zu9_klein_bearbeitet.jpeg);background-size:cover;background-position:50%}.hero-overlay{width:100%;height:100%;background-color:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:flex-start}@media(min-width:768px){.hero-overlay{justify-content:flex-start;text-align:left}}.hero-content{color:var(--color-light);*/}.hero-content h1{margin-bottom:0;text-shadow:0 2px 6px rgba(0,0,0,.3);text-align:center}.hero-content h3{margin-bottom:1.2rem;text-shadow:0 2px 6px rgba(0,0,0,.3);text-align:center}.hero-content p{margin-bottom:5rem;font-size:calc(var(--fontsize-text)*1);text-shadow:0 2px 6px rgba(0,0,0,.3);text-align:center}.portfolio-section .section-title{color:var(--color-light);text-align:center}.song-list{list-style:none;padding:0;margin:0 auto;margin-top:3.5rem;margin-bottom:5rem;border-radius:8px;overflow:hidden;background-color:var(--color-light);max-width:450px;justify-content:center}.song-item{display:flex;align-items:center;padding:.5rem}.song-separator{border:none;border-top:1px solid var(--color-dark);margin:0 1rem}.song-player{width:70px;text-align:center;position:relative;margin-right:1rem}.song-info{flex:1;display:flex;flex-direction:column}.song-info h3{margin:0;font-size:var(--fontsize-text);font-weight:600;color:var(--color-dark)}.song-info p{margin:.2rem 0 0;color:var(--color-dark);font-size:var(--fontsize-small);font-weight:300}.jp-button-wrapper{position:relative;width:60px;height:60px;margin:0 auto}.jp-circle{position:absolute;top:0;left:0;transform:rotate(-90deg);pointer-events:none}.jp-progress-bg{fill:none;stroke:var(--color-dark);opacity:.3}.jp-progress-ring{fill:none;stroke:var(--color-accent);stroke-dasharray:138;stroke-dashoffset:138;transition:stroke-dashoffset .1s linear}.play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:36px;height:36px;border:none;background:var(--color-dark);color:var(--color-light);border-radius:50%;font-size:1.6rem;cursor:pointer;transition:background .3s ease,color .3s ease}.play-btn:hover{background:var(--color-accent);color:var(--color-dark)}.play-btn i{font-size:2.2rem;pointer-events:none}.portfolio-button-wrapper{text-align:center;margin-bottom:6rem}.portfolio-button{background-color:var(--color-light);border:2px solid var(--color-light);color:var(--color-dark);font-size:1.8rem;padding:1rem 2rem;font-weight:600;transition:all .1s ease;border-radius:7px;text-decoration:none}.portfolio-button:hover{background-color:var(--color-dark);border-color:var(--color-light);color:var(--color-light);text-decoration:none}.about-content{display:flex;align-items:flex-start;gap:5rem;max-width:900px;margin:0 auto}.about-image img{width:300px;border:7px solid var(--color-dark);border-radius:0;object-fit:cover}.about-text{flex:1;font-weight:500;color:var(--color-dark);line-height:1.7;font-size:var(--fontsize-text);text-align:left}@media(max-width:768px){.about-content{flex-direction:column;align-items:center;text-align:center}.about-image img{width:100%}.about-text{padding:.8em}}.contact-section{text-align:center}.contact-content{width:100%;max-width:450px;margin:0 auto}.contact-content h2{font-size:var(--fontsize-h2);color:var(--color-light);font-weight:700;margin-bottom:2rem}.contact-content p{font-size:var(--fontsize-text);color:var(--color-light);font-weight:400;margin-bottom:2rem}.direct-contact{margin:2rem 0}.direct-contact a{display:inline-block;color:var(--color-accent);font-size:var(--fontsize-text);text-decoration:none;margin:1rem 2rem;transition:color .3s ease,transform .3s ease}.direct-contact a:hover{color:var(--color-accent-hover);transform:scale(1.05)}.direct-contact i{margin-right:5px;font-size:var(--fontsize-h3)}.contact-form{max-width:450px;margin:3rem auto;padding:3rem;border-radius:8px;display:flex;flex-direction:column;align-items:center;background-color:var(--color-light)}.form-group{width:100%;margin-bottom:1.5rem;text-align:center}.form-group input,.form-group textarea{width:100%;max-width:1e3px;padding:1rem;background-color:transparent;border:2px solid var(--color-dark);border-radius:5px;color:var(--color-dark);font-size:var(--fontsize-small);font-family:inherit;text-align:left}.form-group textarea{resize:vertical}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--color-accent);background-color:rgba(255,251,242,5%)}.contact-form .portfolio-button{margin-top:2rem;cursor:pointer;min-width:200px;border:2px solid var(--color-dark);border-radius:5px;background-color:var(--color-accent)}.footer{height:5rem;width:100%;background-color:var(--color-dark);display:flex;justify-content:flex-end;align-items:center;padding-right:2rem;box-sizing:border-box}.pflichtseiten a{color:var(--color-light);font-size:1.2rem;margin:0 1rem;text-decoration:none}.pflichtseiten a:hover{color:var(--color-lightdark)}