:root{--zinc-50: #fafafa;--zinc-100: #f4f4f5;--zinc-200: #e4e4e7;--zinc-300: #d4d4d8;--zinc-400: #a1a1aa;--zinc-500: #71717a;--zinc-600: #52525b;--zinc-700: #3f3f46;--zinc-800: #27272a;--zinc-900: #18181b;--zinc-950: #09090b;--bg-color: var(--zinc-950);--text-color: var(--zinc-50);--text-muted: var(--zinc-400);--accent-color: #ffffff;--foreground: var(--zinc-50);--primary: #ffffff;--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--glass-blur: 12px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .4);--shadow-heavy: 0 40px 100px rgba(0, 0, 0, .8);--font-primary: "Inter", sans-serif;--font-display: "Outfit", sans-serif;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-bold: 700;--font-weight-black: 900;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 2rem;--spacing-lg: 4rem;--spacing-xl: 8rem;--radius-sm: 2px;--radius-md: 4px;--radius-lg: 8px;--radius-xl: 16px;--easing-smooth: cubic-bezier(.25, .1, .25, 1);--easing-bounce: cubic-bezier(.68, -.55, .265, 1.55);--duration-fast: .2s;--duration-normal: .3s;--duration-slow: .5s;--focus-range-vertical: .5;--focus-range-horizontal: .9;--focus-scale-max-desktop: 1.4;--focus-scale-min-desktop: .85;--focus-scale-max-mobile: 1.2;--focus-scale-min-mobile: .85}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-primary);-webkit-font-smoothing:antialiased;overflow-x:hidden}img{display:block;max-width:100%;height:auto}.font-display{font-family:var(--font-display);font-weight:900;text-transform:uppercase}.font-primary{font-family:var(--font-primary);font-weight:300}.font-outfit{font-family:var(--font-display);font-weight:900;text-transform:uppercase}.font-inter{font-family:var(--font-primary);font-weight:300}.mix-blend{mix-blend-mode:difference}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:4px}@media(prefers-reduced-motion:reduce){*,:before,:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.fixed-nav{position:fixed;top:2rem;left:2rem;right:2rem;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;z-index:1000}.logo{font-size:1.5rem;letter-spacing:-.02em}.chapter-indicator{font-size:.8rem;opacity:.7;font-variant-numeric:tabular-nums}#hero{height:100vh;width:100%;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.hero-media{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.hero-img{width:100%;height:100%;object-fit:cover;transform:scale(1.5);opacity:0;transform-origin:center center}.hero-content{position:relative;z-index:2;text-align:center;mix-blend-mode:difference}.hero-content h1{font-size:clamp(4rem,15vw,20rem);line-height:.8;letter-spacing:-.05em;color:var(--accent-color);clip-path:polygon(0 0,100% 0,100% 100%,0% 100%)}.scroll-prompt{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);z-index:2;opacity:.5;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase}@media(max-width:768px){.hero-content h1{font-size:15vw}.hero-img{transform:scale(1.1)}}#lines{width:100%;position:relative;overflow:hidden;background:var(--bg-color)}.pin-wrap{height:100vh;display:flex;align-items:center;overflow:hidden}.horizontal-sequence{display:flex;gap:10vw;padding:0 10vw;height:80vh;align-items:center}.seq-panel{position:relative;width:60vw;height:100%;flex-shrink:0;display:flex;align-items:center;justify-content:center}@media(max-width:768px){.seq-panel{width:85vw;height:60vh}.horizontal-sequence{gap:5vw;padding:0 7.5vw}}.seq-img-wrap{width:100%;height:100%;overflow:hidden;border-radius:4px}.seq-img-wrap img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .5s ease}.seq-panel.active img{filter:grayscale(0)}.seq-text{position:absolute;bottom:2rem;left:2rem;padding:2rem;max-width:400px;transform:translateY(20px);opacity:0;transition:all .5s ease}.seq-panel.active .seq-text{transform:translateY(0);opacity:1}.seq-text h2{font-size:3rem;margin-bottom:.5rem}#cockpit{height:150vh;position:relative;z-index:2}.cockpit-container{height:100vh;width:100%;position:sticky;top:0;overflow:hidden}.cockpit-bg,.focus-ring-mask{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.cockpit-bg img,.focus-ring-mask img{width:100%;height:100%;object-fit:cover}.blur-layer{filter:blur(20px) brightness(.4);transform:scale(1.1)}.focus-ring-mask{clip-path:circle(0% at 50% 50%);z-index:2}.cockpit-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;text-align:center;pointer-events:none}.cockpit-text h2{font-size:8vw;line-height:1;color:var(--accent-color)}.cockpit-text p{margin-top:1rem;display:inline-block;padding:1rem 2rem}#details{padding:10rem 2rem;min-height:100vh;display:flex;flex-direction:column;align-items:center}.grid-header{text-align:center;margin-bottom:5rem}.grid-header h2{font-size:clamp(2rem,3.5rem,4.5rem);letter-spacing:.02em}.parallax-grid{display:flex;flex-direction:column;align-items:center;width:100%;max-width:800px;position:relative;padding-bottom:20vh}.grid-item{position:relative;width:70vw;max-width:700px;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-md);margin-top:-5vh;box-shadow:var(--shadow-heavy);background:var(--zinc-900);will-change:transform}.grid-item:nth-child(odd){align-self:flex-start;transform:rotate(-2deg)}.grid-item:nth-child(2n){align-self:flex-end;transform:rotate(2deg)}.grid-item:first-child{margin-top:0}.grid-item:nth-child(1){z-index:10}.grid-item:nth-child(2){z-index:9}.grid-item:nth-child(3){z-index:8}.grid-item:nth-child(4){z-index:7}.grid-item img{width:100%;height:160%;object-fit:cover;position:absolute;top:-30%;will-change:transform}@media(max-width:768px){.grid-item{width:90vw;height:40vh;margin-top:-8vh;align-self:center!important;transform:rotate(0)!important}.parallax-grid{padding-bottom:5vh}.grid-header h2{font-size:10vw}}.timeline-section{width:100%;height:100vh;overflow:hidden;position:relative;background-color:var(--bg-color);border-top:1px solid var(--zinc-800)}.timeline-section .pin-wrap{height:100vh;display:flex;align-items:center;width:100%;overflow:hidden}.timeline-track{display:flex;align-items:center;padding:0 5vw}.timeline-card{flex:0 0 auto;height:60vh;width:auto;margin-right:-5vw;position:relative;border-radius:var(--radius-md);overflow:hidden;background-color:var(--zinc-900);transition:z-index 0s linear;transform-origin:center center;will-change:transform,z-index}.timeline-card img{height:100%;width:auto;display:block;object-fit:contain;opacity:.8;filter:grayscale(100%);transition:all .5s ease}.timeline-card.title-card{width:30vw;background:transparent;display:flex;flex-direction:column;justify-content:center;border:none}.title-card h3{font-size:4rem;color:var(--foreground);margin-bottom:1rem;line-height:1}.title-card p{font-size:1rem;color:var(--zinc-400);border-left:2px solid var(--primary);padding-left:1rem}.timeline-card .file-id{position:absolute;bottom:1rem;left:1rem;font-size:.8rem;color:#fff;background:#000000b3;padding:.25rem .5rem;border-radius:var(--radius-md);opacity:0;transform:translateY(10px);transition:all .3s ease}.timeline-card:not(.title-card):hover{transform:scale(1.02);z-index:200}.timeline-card:not(.title-card):hover img{opacity:1;filter:grayscale(0%)}.timeline-card:not(.title-card):hover .file-id{opacity:1;transform:translateY(0)}@media(max-width:768px){.timeline-card{width:70vw;min-height:40vh;height:auto;margin-right:-15vw}.title-card{width:80vw!important}.title-card h3{font-size:3rem}.timeline-track{padding:0 10vw}}#outro{height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background-color:var(--bg-color)}.outro-img{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.outro-img img{width:100%;height:100%;object-fit:cover;opacity:.4}.outro-text{position:relative;z-index:2}.outro-text h2{font-size:10vw;text-align:center;line-height:.9;letter-spacing:-.05em;color:var(--accent-color)}
