:root{--bg:#000;--fg:#fff;--fg-invert:#000;--font-serif:"calluna",serif;--font-sans:"din-2014",sans-serif;--font-logo:"din-1451-lt-pro-engschrift",sans-serif;--pad:20px;--menu-gap:15px;--dot-size:5px;--transition-fast:0.3s ease;--transition-slow:1s ease;--caption-max:500px}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;background:var(--bg);color:var(--fg);overflow:hidden;-webkit-font-smoothing:antialiased;font-smooth:antialiased}.no-transition *,.no-transition *::before,.no-transition *::after{transition:none !important;animation:none !important}.hidden{display:none !important}.skip-link{position:fixed;left:-9999px;top:calc(env(safe-area-inset-top) + 8px);z-index:3000;background:#000;color:#fff;padding:8px 12px;border-radius:6px;font-family:var(--font-sans);font-size:13px;text-decoration:none;transform:translateY(-10px);transition:transform .2s ease,left .2s ease,opacity .2s ease;opacity:0}.skip-link:focus,.skip-link:focus-visible{left:calc(env(safe-area-inset-left) + 20px);opacity:1;transform:translateY(0);outline:2px solid #fff;outline-offset:2px}:focus-visible{outline:2px solid var(--fg);outline-offset:2px}header.invert:focus-visible{outline-color:var(--fg-invert)}@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}#home.fade-out #video-slider,#home.fade-in .video-slide.active{opacity:1 !important}}header{position:fixed;inset:0 0 auto 0;z-index:2001;display:flex;justify-content:space-between;padding:var(--pad);pointer-events:none}.logo{display:flex;align-items:center;pointer-events:auto;color:var(--fg);transition:color 0.5s ease;cursor:pointer}.logo-svg{height:38px;width:auto}.logo-text{font-family:var(--font-logo);font-size:25px;font-weight:400;text-transform:uppercase;fill:currentColor}header.invert .logo,header.invert .menu-item{color:var(--fg-invert)}nav{flex:1;display:flex;justify-content:flex-end;min-width:0}nav ul{list-style:none;display:flex;gap:var(--menu-gap);pointer-events:auto;padding-top:10px;white-space:nowrap}.menu-item{font-family:var(--font-sans);font-size:12px;font-weight:400;color:var(--fg);text-transform:uppercase;letter-spacing:0.075em;cursor:pointer;opacity:1;transition:opacity 0.3s ease}#main-menu:not([data-selected]) ul:hover .menu-item{opacity:0.5}#main-menu:not([data-selected]) ul:hover .menu-item:hover{opacity:1}#main-menu[data-selected] .menu-item{opacity:0.5}#main-menu[data-selected] .menu-item.selected,#main-menu[data-selected] .menu-item[aria-current="page"]{opacity:1}#main-menu[data-selected] ul:hover .menu-item:hover{opacity:1}#main-menu[data-selected] ul:hover .menu-item.selected{opacity:1}.page-section{position:absolute;top:100vh;left:0;width:100%;height:100vh;opacity:0;pointer-events:none;transition:transform var(--transition-slow),opacity var(--transition-slow);z-index:1;will-change:opacity,transform}.page-section.active{top:0;opacity:1;pointer-events:auto;z-index:10}.video-slider{position:relative;width:100vw;height:100vh;overflow:hidden}.video-slide{position:absolute;inset:0;opacity:0;transition:opacity var(--transition-slow);pointer-events:none;will-change:opacity}.video-slide.active{opacity:1;pointer-events:auto;z-index:1}.video-slide video{width:100%;height:100%;object-fit:cover}.video-slide.fading-out{opacity:0 !important}#video-slider.no-transition .video-slide{transition:none !important}#video-slider.no-transition .slide-caption h1,#video-slider.no-transition .slide-caption h2{animation:none !important;opacity:1 !important}.slide-caption{position:absolute;top:50%;left:var(--pad);transform:translateY(-50%);text-align:left;color:var(--fg);pointer-events:none;will-change:opacity,transform;contain:layout style}.slide-caption h1{font-family:var(--font-serif);font-size:55px;font-weight:700}.slide-caption h2{font-family:var(--font-sans);font-size:12px;font-weight:400;display:flex;gap:0.4em;letter-spacing:0.075em;text-transform:uppercase;flex-wrap:wrap;align-items:center}.for-class{text-transform:lowercase}.dot-nav{position:fixed;top:50%;left:calc(100% - 50px);transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:50}.dot-nav .dot{width:var(--dot-size);height:var(--dot-size);border-radius:50%;background:var(--fg);opacity:0.3;cursor:pointer;transition:opacity var(--transition-fast),transform var(--transition-fast)}.dot-nav .dot.active{opacity:1}.dot-nav .dot:focus-visible{transform:scale(1.6)}#home{z-index:1;position:relative}#home.fade-out #video-slider{opacity:0;transition:opacity var(--transition-slow)}#home.fade-in .video-slide.active{animation:fadeInVideo 1s ease forwards}#home.fade-out,#projects.fade-out{opacity:0;transition:opacity var(--transition-slow);pointer-events:none}#home.fade-in,#projects.fade-in{opacity:1;transition:opacity var(--transition-slow);pointer-events:auto}#about{position:absolute;top:-100vh;width:100%;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#fff;color:#000;z-index:2;overflow-y:auto;scroll-behavior:smooth;transition:top var(--transition-slow);transition-delay:0.2s}#about.active{top:0;transition-delay:0s}#about.exiting{top:-100vh}.about-wrapper{max-width:950px;max-height:90vh;padding:0 var(--pad);font-family:var(--font-serif);font-size:15px;overflow-y:auto;text-align:justify}.about-columns{display:grid;grid-template-columns:1fr 300px;gap:50px;align-items:stretch;height:100%}.about-left{width:600px}.about-right{display:flex;flex-direction:column;justify-content:space-between;height:100%}.external-links{list-style:none;padding:0;opacity:0;transform:translateY(20px);transition:all 0.8s ease;will-change:opacity,transform}.external-links li{margin-bottom:20px;text-align:center;transform:translateY(10px);opacity:0}.external-link-title{font-family:var(--font-sans);font-size:12px;text-transform:uppercase;letter-spacing:0.075em;margin-bottom:10px;color:#000}.external-links a{display:inline-flex;justify-content:space-between;align-items:center;width:170px;padding:7px 10px;background:#000;color:#fff;font-family:var(--font-sans);font-size:13px;border-radius:25px;text-decoration:none;transition:background var(--transition-fast);position:relative;overflow:hidden}.external-links a::after{content:'→';margin-left:10px;transition:transform var(--transition-fast)}.external-links a:hover::after{transform:translateX(5px)}.socials{list-style:none;display:flex;justify-content:space-between;width:170px;margin:10px auto 0;padding:0 0 10px}.socials li{transform:translateY(10px);opacity:0}.socials li img{width:30px;height:30px;transition:transform var(--transition-fast);display:block}.socials li:hover img{transform:scale(1.15)}#about.active .about-wrapper p{opacity:1;transform:translateY(0);transition-delay:0.3s}#about.active .external-links{opacity:1;transform:translateY(0);transition-delay:1s}#about.active .external-links li,#about.active .socials li{animation:fadeInUp 0.4s ease forwards}#about.active .external-links li:nth-child(1){animation-delay:1s}#about.active .external-links li:nth-child(2){animation-delay:1.3s}#about.active .socials li:nth-child(1){animation-delay:1.5s}#about.active .socials li:nth-child(2){animation-delay:1.7s}#about.active .socials li:nth-child(3){animation-delay:1.9s}#about.active .socials li:nth-child(4){animation-delay:2.1s}#about.active .socials li:nth-child(5){animation-delay:2.3s}#projects{position:absolute;top:100vh;width:100%;height:100vh;z-index:2;background:var(--bg);color:var(--fg);overflow:hidden;transition:top var(--transition-slow)}#projects.active{top:0}#projects.exiting{top:100vh}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:50vh;width:100vw;height:100vh;gap:0;overflow-y:auto;scroll-snap-type:y mandatory;-webkit-scroll-snap-type:y mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.project-item{position:relative;width:100%;height:100%;overflow:hidden;cursor:pointer;scroll-snap-align:start;-webkit-scroll-snap-align:start;content-visibility:auto;contain-intrinsic-size:50vh}.project-thumb{position:relative;inset:0;width:100%;height:100%;overflow:hidden}.project-thumb img,.project-thumb video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:opacity 0.5s ease;will-change:opacity}.project-thumb video{opacity:0;pointer-events:none}.project-thumb .project-overlay{position:absolute;inset:0;background:#000;opacity:0;z-index:2;transition:opacity 0.5s ease}.project-thumb:hover .project-overlay{opacity:0.4}.project-thumb:hover .project-preview{opacity:1}.project-caption{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--fg);text-align:center;z-index:2;pointer-events:none}.project-caption h1{font-family:var(--font-serif);font-size:40px;font-weight:700}.project-caption h2{font-family:var(--font-sans);font-size:12px;text-transform:uppercase;font-weight:400}#fullscreen-player{position:fixed;inset:0;width:100vw;height:100vh;background:var(--bg);z-index:1000;display:none;flex-direction:column;justify-content:center;align-items:center}#fullscreen-player.visible{display:flex;animation:fadeInPlayer 0.6s ease forwards}#fullscreen-player.fade-out{animation:fadeOutPlayer 0.6s ease forwards}#fullscreen-player.visible:not(.paused){cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Crect%20x%3D%226%22%20y%3D%224%22%20width%3D%224%22%20height%3D%2216%22%20fill%3D%22white%22/%3E%3Crect%20x%3D%2214%22%20y%3D%224%22%20width%3D%224%22%20height%3D%2216%22%20fill%3D%22white%22/%3E%3C/svg%3E") 12 12,pointer}#fullscreen-player.visible.paused{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpolygon%20points%3D%228%2C4%2020%2C12%208%2C20%22%20fill%3D%22white%22/%3E%3C/svg%3E") 12 12,pointer}#player-video{width:100%;height:100%;object-fit:contain;background:var(--bg)}.player-controls{position:absolute;bottom:40px;left:var(--pad);right:var(--pad);z-index:1001;display:flex;flex-direction:column;gap:15px;transition:opacity 0.5s ease}#player-seek{width:100%;height:2px;background:rgba(255,255,255,0.3);appearance:none;cursor:pointer}#player-seek::-webkit-slider-thumb{width:0;height:0;appearance:none}#player-seek::-webkit-slider-runnable-track{height:2px;background:linear-gradient( to right,#fff 0,#fff var(--seek-fill,0%),rgba(255,255,255,0.3) var(--seek-fill,0%),rgba(255,255,255,0.3) 100% )}.player-bottom-controls{display:flex;justify-content:space-between;align-items:center}.right-controls{display:flex;gap:20px}.player-controls button,#player-close{background:none;border:none;color:var(--fg);font-family:var(--font-sans);font-size:12px;text-transform:uppercase;letter-spacing:0.075em;cursor:pointer}#player-close{position:fixed;top:30px;right:20px;z-index:1001}#fullscreen-player.visible + header #main-menu{display:none}.player-caption{position:absolute;bottom:150px;left:var(--pad);right:var(--pad);max-width:var(--caption-max);color:var(--fg);font-family:var(--font-serif);z-index:1002;transition:opacity 0.5s ease}.player-caption h1{font-size:32px;font-weight:700;margin-bottom:10px}.player-caption h2{font-family:var(--font-sans);font-size:12px;font-weight:400;letter-spacing:0.075em;display:flex;gap:0.4em;margin-bottom:10px;text-transform:uppercase}.player-caption p{margin-top:30px;font-size:14px;line-height:1.4}.player-ui-hidden .player-caption,.player-ui-hidden .player-controls{opacity:0;pointer-events:none}@keyframes fadeInVideo{from{opacity:0}to{opacity:1}}@keyframes fadeInStatic{from{opacity:0}to{opacity:1}}@keyframes fadeOutStatic{from{opacity:1}to{opacity:0}}@keyframes fadeDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeDownOut{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-20px)}}@keyframes fadeUpOut{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}@keyframes fadeInUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInPlayer{from{opacity:0}to{opacity:1}}@keyframes fadeOutPlayer{from{opacity:1}to{opacity:0}}.slide-caption h1,.slide-caption h2{opacity:0;animation-fill-mode:forwards}.slide-caption.animate-in h1{animation:fadeInStatic 1s ease forwards}.slide-caption.animate-in h2:first-of-type{animation:fadeDown 1s ease forwards}.slide-caption.animate-in h2:last-of-type{animation:fadeUp 1s ease forwards}.slide-caption.animate-out h1{animation:fadeOutStatic 0.6s ease forwards}.slide-caption.animate-out h2:first-of-type{animation:fadeDownOut 0.6s ease forwards}.slide-caption.animate-out h2:last-of-type{animation:fadeUpOut 0.6s ease forwards}:root{--vh:1vh}.page-section,.video-slider,#projects,#about,#fullscreen-player,#player-video{height:calc(var(--vh,1svh) * 100)}@supports (height:100svh){.page-section,.video-slider,#projects,#about,#fullscreen-player,#player-video{height:100svh}}header{padding-top:calc(env(safe-area-inset-top) + 20px);padding-left:calc(env(safe-area-inset-left) + 20px);padding-right:calc(env(safe-area-inset-right) + 20px)}.player-controls{bottom:calc(env(safe-area-inset-bottom) + 20px);left:calc(env(safe-area-inset-left) + 20px);right:calc(env(safe-area-inset-right) + 20px)}#player-close{top:calc(env(safe-area-inset-top) + 30px);right:calc(env(safe-area-inset-right) + 20px)}@media (max-width:768px){.menu-item{padding:6px 8px}.player-controls button,#player-close{padding:8px 4px;min-height:36px}.right-controls{gap:18px}}@media (max-width:768px){.dot-nav{top:auto;bottom:calc(env(safe-area-inset-bottom) + 20px);left:50%;right:auto;transform:translateX(-50%);flex-direction:row;gap:10px}.dot-nav .dot{width:7px;height:7px}}@media (max-width:768px){.projects-grid{grid-template-columns:1fr;grid-auto-rows:50svh;height:100svh}@supports not (height:100svh){.projects-grid{grid-auto-rows:calc(var(--vh) * 50);height:calc(var(--vh) * 100)}}.project-item{height:100%}.project-thumb,.project-thumb img,.project-thumb video{width:100%;height:100%;object-fit:cover}.project-caption h1{font-size:clamp(18px,6vw,28px)}.project-caption h2{font-size:11px}}@media (max-width:480px){.slide-caption h1{font-size:clamp(22px,7vw,36px)}.project-caption h1{font-size:clamp(20px,6.5vw,34px)}.player-caption h1{font-size:clamp(18px,6vw,30px)}}.touch-ui .project-thumb .project-overlay{opacity:0.35}.touch-ui .project-thumb:hover .project-overlay{opacity:0.35}@media (max-width:768px){#about{justify-content:flex-start;align-items:stretch;overflow-y:auto}#about{padding-top:calc(env(safe-area-inset-top) + 56px);padding-bottom:56px}.about-wrapper{max-width:100%;max-height:none;overflow:visible;padding:0 calc(env(safe-area-inset-right) + var(--pad)) 0 calc(env(safe-area-inset-left) + var(--pad));font-size:14px;line-height:1.6;text-align:left}.about-columns{display:flex;flex-direction:column;gap:28px}.about-left{width:auto;margin-top:40px}.about-right{width:100%;align-items:center;justify-content:flex-start;gap:18px}.external-links{opacity:1;transform:none;transition:none}.external-links a{width:100%;max-width:260px}.socials{width:200px;margin:6px auto 40px}#about.active .external-links li,#about.active .socials li{animation:fadeInUp 0.35s ease forwards}#about.active .external-links li:nth-child(1){animation-delay:0.15s}#about.active .external-links li:nth-child(2){animation-delay:0.25s}#about.active .socials li:nth-child(1){animation-delay:0.35s}#about.active .socials li:nth-child(2){animation-delay:0.45s}#about.active .socials li:nth-child(3){animation-delay:0.55s}#about.active .socials li:nth-child(4){animation-delay:0.65s}#about.active .socials li:nth-child(5){animation-delay:0.75s}}header{gap:clamp(6px,2vw,24px)}.logo-svg{height:clamp(34px,7.5vw,42px)}.logo-text{font-size:clamp(20px,4.8vw,28px)}nav ul{gap:clamp(4px,1.8vw,15px)}