:root{--bg-color: #F3F4F6;--text-color: #1F2937;--accent-color: #9CA3AF;--menu-bg: #1b7a8f;--menu-text: #E5E5E5;--font-main: "Archivo", sans-serif;--font-display: "Archivo", sans-serif;--font-tech: "JetBrains Mono", monospace;--font-serif: "Archivo", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-color);overflow:hidden;height:100vh;width:100vw;height:100dvh}.fixed-ui{position:fixed;top:2rem;left:2rem;right:2rem;display:flex;justify-content:space-between;align-items:center;z-index:500;mix-blend-mode:exclusion;color:#fff}.logo,.sound-btn{font-family:var(--font-tech);font-size:.7rem;letter-spacing:-.05em;text-transform:uppercase;font-weight:400}.ui-right{display:flex;gap:2rem;align-items:center}.sound-btn{cursor:pointer}.menu-btn{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;gap:4px;width:30px}.burger-line{width:100%;height:2px;background-color:#fff;transition:all .3s}.menu-btn:hover .burger-line:first-child{width:100%}.menu-btn:hover .burger-line:last-child{width:70%}#menu-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:var(--menu-bg);z-index:2000;display:flex;flex-direction:column;padding:2rem;transform:translateY(-100%);transition:transform .6s cubic-bezier(.8,0,.2,1);color:var(--menu-text)}#menu-overlay.active{transform:translateY(0)}#close-menu{position:absolute;top:2rem;right:2rem;width:60px;height:60px;border-radius:50%;background:transparent;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s}#close-menu:hover{background:#fff;color:#000;transform:rotate(90deg)}.menu-container{height:100%;display:flex;align-items:center;padding-left:5vw}.menu-list{display:flex;flex-direction:column}.menu-link{text-decoration:none;color:var(--menu-text);font-family:var(--font-serif);font-size:5vw;line-height:.9;text-transform:uppercase;display:flex;align-items:flex-start;position:relative;transition:opacity .3s;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:1rem}.menu-link:hover{opacity:1}.menu-list:hover .menu-link:not(:hover){opacity:.3}.idx{font-family:var(--font-tech);font-size:1rem;margin-right:2rem;margin-top:1.5vw;color:var(--accent-color)}.menu-footer{position:absolute;bottom:2rem;left:2rem;right:2rem;display:flex;justify-content:space-between;font-family:var(--font-tech);font-size:.7rem;opacity:.5}#viewport{position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;perspective:1000px}#scroll-container{display:flex;flex-direction:row;height:100%;width:fit-content;will-change:transform;padding:0 10vw;align-items:center}.gallery-item{height:70vh;width:40vw;margin-right:8vw;position:relative;display:flex;flex-direction:column;justify-content:center;flex-shrink:0}.cover-section{width:50vw;align-items:flex-start;padding-left:5vw}.meta-data{font-family:var(--font-tech);font-size:.6rem;display:flex;justify-content:space-between;width:300px;margin-bottom:1rem;border-bottom:1px solid currentColor;padding-bottom:.5rem}.main-cover{width:30vw;height:30vw;margin-bottom:-4rem;z-index:1}.main-title{font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:10vw;line-height:.8;z-index:2;mix-blend-mode:difference;color:var(--menu-bg);pointer-events:none}.track-section{width:35vw;justify-content:space-between;padding:5vh 0}.track-info{border-top:1px solid var(--text-color);padding-top:.5rem;display:flex;justify-content:space-between;font-family:var(--font-tech);margin-bottom:2rem;font-size:.7rem}.track-number{font-size:1.5rem;font-weight:700;font-family:var(--font-tech)}.track-title{font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:4vw;line-height:.9;margin-bottom:1rem;color:var(--text-color)}.image-wrapper{width:100%;height:100%;overflow:hidden;position:relative}.image-wrapper img{width:100%;height:120%;object-fit:cover;position:absolute;top:-10%;left:0;filter:grayscale(10%) contrast(105%)}.image-wrapper:hover img{transform:scale(1.2)}.small-image{width:80%;height:35vh;align-self:flex-end}.tall-image{width:100%;height:50vh}.inverted{flex-direction:column-reverse;justify-content:flex-end}.inverted .image-wrapper{margin-bottom:2rem}.play-track-btn{background:transparent;border:1px solid currentColor;color:var(--text-color);font-family:var(--font-tech);font-size:.7rem;padding:.5rem 1rem;cursor:pointer;text-transform:uppercase;margin-top:.5rem;transition:all .3s;margin-bottom:2rem}.play-track-btn:hover,.play-track-btn.playing{background:var(--text-color);color:var(--bg-color)}.credits-section{width:30vw;background:#111;color:#fff;padding:3rem;height:100vh;margin-right:0;justify-content:center}.credits-list ul{list-style:none;font-family:var(--font-tech);margin-bottom:4rem;opacity:.7;line-height:1.6}.buy-btn{display:inline-block;border:1px solid white;color:#fff;padding:1rem 2rem;text-decoration:none;font-family:var(--font-tech);text-transform:uppercase;transition:all .3s}.buy-btn:hover{background:#fff;color:#000}.noise-overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:999;opacity:.05;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")}#cursor{position:fixed;top:0;left:0;width:20px;height:20px;border:1px solid var(--text-color);border-radius:50%;pointer-events:none;z-index:1000;transform:translate(-50%,-50%);transition:width .3s,height .3s,background-color .3s;mix-blend-mode:difference}body.hovered #cursor{width:50px;height:50px;background-color:#fff;border-color:#fff}#loader{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--menu-bg);z-index:9999;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;transition:transform 1.2s cubic-bezier(.77,0,.175,1)}body.is-loaded #loader{transform:translateY(-100%)}.counter-wrap{font-family:var(--font-display);font-size:15vw;font-weight:800;line-height:1;display:flex}.symbol{font-size:2vw;align-self:flex-start;margin-top:2vw;font-family:var(--font-tech)}.loader-text{font-family:var(--font-tech);font-size:.7rem;margin-top:1rem;letter-spacing:.2em;opacity:.5}#enter-btn{margin-top:3rem;background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;padding:1rem 3rem;font-family:var(--font-tech);cursor:pointer;text-transform:uppercase;opacity:0;pointer-events:none;transition:all .5s}#enter-btn.visible{opacity:1;pointer-events:auto}#enter-btn:hover{background:#fff;color:#000}.char-wrap{display:inline-block;position:relative;overflow:hidden;height:1.1em;vertical-align:top}.char-orig,.char-clone{display:block;transition:transform .4s cubic-bezier(.77,0,.175,1);will-change:transform}.char-clone{position:absolute;top:0;left:0;transform:translateY(120%);color:var(--accent-color)}.char-space{display:inline-block;width:.3em}.track-title:hover .char-orig{transform:translateY(-100%)}.track-title:hover .char-clone{transform:translateY(0)}.anim-text-line{display:block;overflow:hidden;margin-bottom:-.2em}.anim-text-line-inner{display:block;transform:translateY(110%) rotate(2deg);transition:transform 1.2s cubic-bezier(.16,1,.3,1);will-change:transform;transform-origin:left center}.is-in-view .anim-text-line-inner,body.is-loaded .cover-section .anim-text-line-inner{transform:translateY(0) rotate(0)}.anim-text-line:nth-child(1) .anim-text-line-inner{transition-delay:.1s}.anim-text-line:nth-child(2) .anim-text-line-inner{transition-delay:.2s}.anim-text-line:nth-child(3) .anim-text-line-inner{transition-delay:.3s}.image-wrapper{clip-path:inset(0 100% 0 0);transition:clip-path 1.5s cubic-bezier(.77,0,.175,1);will-change:clip-path}.image-wrapper img{transform:scale(1.4);transition:transform 1.5s cubic-bezier(.77,0,.175,1)}.is-in-view .image-wrapper,body.is-loaded .cover-section .image-wrapper{clip-path:inset(0 0 0 0)}.is-in-view .image-wrapper img,body.is-loaded .cover-section .image-wrapper img{transform:scale(1)}.meta-data,.track-info,.play-track-btn,.track-number{opacity:0;transform:translateY(20px);transition:opacity 1s ease,transform 1s cubic-bezier(.16,1,.3,1)}.is-in-view .meta-data,.is-in-view .track-info,.is-in-view .play-track-btn,.is-in-view .track-number,body.is-loaded .cover-section .meta-data{opacity:1;transform:translateY(0)}.is-in-view .track-number{transition-delay:0s}.is-in-view .track-info{transition-delay:.2s}.is-in-view .play-track-btn{transition-delay:.4s}@media(max-width:768px){#scroll-container{display:flex;flex-direction:row;overflow-x:scroll!important;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;transform:none!important;width:100vw;height:100vh;padding:0!important;position:absolute;top:0;left:0}.counter-wrap{justify-content:center;font-size:20vh}.track-meta{display:none}.menu-footer{margin-bottom:50px}.gallery-item{width:100vw!important;height:100vh!important;min-height:100vh;margin-right:0!important;padding:0!important;scroll-snap-align:start;scroll-snap-stop:always;flex-shrink:0;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative}.cover-section{width:100vw!important;padding-left:0!important;align-items:center!important}.track-section{padding:2rem!important;box-sizing:border-box}.image-wrapper{position:absolute;top:0;left:0;width:100%!important;height:100%!important;z-index:-1;margin:0!important;opacity:.6}.content-wrapper,.track-details,.track-info,.meta-data,.main-title{z-index:10;position:relative;text-align:center}.track-title{font-size:15vw!important;text-align:center;width:100%}.meta-data{width:90%;margin:0 auto 2rem}}@media(max-width:480px){.menu-link{font-size:10vw;margin-left:-3vh}.track-title{font-size:14vw}.main-title{font-size:16vw;text-align:left;display:inline-block}.main-title:after{content:" →";font-size:.8em;margin-left:10px;display:inline-block;animation:fleche 2s infinite ease-in-out}@keyframes fleche{0%{transform:translate(0)}50%{transform:translate(30px)}to{transform:translate(0)}}.gallery-item{width:92vw;min-height:100vh;padding-bottom:5rem}.image-wrapper{height:45vh}}@media(max-width:768px)and (orientation:landscape){#scroll-container{padding-top:5vh}.gallery-item{min-height:100vh}.image-wrapper{height:60vh}.cover-section{min-height:100vh}.main-cover{width:50vh;height:50vh}}