*{margin:0;padding:0;box-sizing:border-box}:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;line-height:1.5;font-weight:400;background-color:#0a0a0a;color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-width:320px;min-height:100vh;background:#0a0a0a}h1,h2,h3,h4,h5,h6{line-height:1.2;font-weight:700;color:#fff}p{margin:1rem 0;color:#a0a0a0}img{max-width:100%;height:auto;display:block;transition:transform .3s ease}.works-page{min-height:100vh;padding:4rem 5%;background-color:#0a0a0a}.works-hero{padding:8rem 0;text-align:center}.hero-title-container{display:flex;justify-content:center;align-items:center;margin-bottom:3rem}.works-hero-title{font-size:clamp(3.5rem,10vw,7rem);font-weight:700;letter-spacing:-.02em;line-height:1;display:flex;flex-direction:column;gap:.5em}.works-hero-title span{display:block;white-space:nowrap}.title-with-icon{display:flex!important;align-items:center;justify-content:center;gap:1em}.hero-icon{font-size:.8em;margin-top:.2em}.works-hero-text{font-size:1.1rem;color:#a0a0a0;max-width:600px;margin:0 auto}.works-grid-section{margin:4rem 0}.section-header{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.section-number{font-size:1rem;color:#666}.section-title{font-size:1.5rem;letter-spacing:.05em}.works-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;background-color:#fff;padding:3px}.work-item{position:relative;aspect-ratio:4/3;overflow:hidden;background-color:#0a0a0a}.work-item.large{grid-column:span 2}.work-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.work-item:hover img{transform:scale(1.05)}.work-info{position:absolute;bottom:2rem;left:2rem;z-index:2}.work-info h3{font-size:1.5rem;margin-bottom:.5rem}.work-category{font-size:.9rem;color:#a0a0a0}.principles-section{margin:8rem 0;text-align:center}.principles-title{font-size:clamp(2rem,5vw,3.5rem);margin-bottom:4rem;line-height:1.2}.principles-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:4rem;max-width:1200px;margin:0 auto}.principle-item{display:flex;flex-direction:column;align-items:center;gap:1rem}.principle-icon{font-size:2rem;margin-bottom:1rem}.principle-item h3{font-size:1.25rem;margin-bottom:.5rem}.principle-item p{font-size:1rem;color:#a0a0a0;max-width:300px}@media (max-width: 768px){.works-grid{grid-template-columns:1fr}.work-item.large{grid-column:auto}.principles-grid{grid-template-columns:1fr;gap:3rem}.works-hero-title{font-size:clamp(2.5rem,8vw,4rem)}.title-with-icon{flex-direction:column;gap:.5em}.hero-icon{margin:.5em 0}}.animated-text-section{min-height:60vh;background-color:var(--background-color);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:4rem 2rem;position:relative;overflow:hidden}.parallax-content{width:100%;display:flex;flex-direction:column;align-items:center;will-change:transform}.typewriter-container{font-family:Helvetica Neue,Arial,sans-serif;font-size:clamp(2.5rem,6vw,5rem);font-weight:300;color:var(--text-color);text-align:center;letter-spacing:.05em;line-height:1.2;margin-bottom:2rem;will-change:transform,opacity}.subtitle-container{font-family:Helvetica Neue,Arial,sans-serif;font-size:clamp(1rem,2vw,1.5rem);font-weight:300;color:#ffffffb3;text-align:center;letter-spacing:.05em;line-height:1.6;max-width:800px;will-change:transform,opacity}.Typewriter__cursor{color:var(--text-color);font-weight:100}@media (max-width: 768px){.animated-text-section{padding:3rem 1.5rem}.parallax-content{transform:none!important}}.node-graph-container{width:100%;height:100%;position:relative;overflow:hidden;background-color:#282828;border-radius:8px}.node-graph{width:100%;height:100%;cursor:default}.grid path{pointer-events:none}.connection-group{pointer-events:none}.node-connection{fill:none;stroke:#44f;stroke-width:2}.arrow-head{fill:#44f;stroke:none}.node{cursor:default}.node-body{filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.node-rect{stroke:#0000004d;stroke-width:1}.node-mask-icon{fill:#0003;stroke:none}.node-header{cursor:move}.node-text{fill:#fff;font-family:Lucida Grande,Lucida Sans Unicode,Arial,sans-serif;font-size:11px;-webkit-user-select:none;user-select:none;pointer-events:none}.node-input,.node-output{fill:#282828;stroke:#44f;stroke-width:1}.node:hover .node-rect{stroke:#3a3a3a}.node:hover .node-input,.node:hover .node-output{fill:#5a5a5a}.node-type-input:hover .node-rect{stroke:#95a5a6}.node-type-works:hover .node-rect{stroke:#00d1a7}.node-type-original_creations:hover .node-rect{stroke:#3498db}.node-type-merge:hover .node-rect{stroke:#a29bfe}.node-type-output:hover .node-rect{stroke:#ff7675}:root{--text-color: #ffffff;--background-color: #0B0B0B}html,body{margin:0;padding:0;overflow-x:hidden;width:100%}body{background:var(--background-color);min-height:100vh}.app{position:relative;width:100%}.header{position:fixed;top:0;left:0;right:0;padding:2rem;z-index:100;display:flex;justify-content:space-between;align-items:center;background:#19191933;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.hero{min-height:100vh;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0;margin:0;position:relative;overflow:hidden;width:100vw;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw}.hero-background{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;will-change:transform}.hero-background img{width:100%;height:100%;object-fit:cover;display:block}.hero-content{text-align:center;z-index:2;padding:0 2rem;position:relative}.hero h1{font-size:clamp(1.5rem,2.5vw,2.5rem);line-height:1;font-weight:400;color:var(--text-color);letter-spacing:.4em;margin:0;text-transform:uppercase;white-space:nowrap}.hero p{font-size:.875rem;color:var(--text-color);opacity:.7;letter-spacing:.3em;margin-top:1.5rem;text-transform:uppercase}@media (max-width: 768px){.hero h1{font-size:clamp(1rem,2vw,1.5rem);letter-spacing:.3em}.hero p{font-size:.75rem;letter-spacing:.2em}}.featured-grid{min-height:100vh;height:100vh;width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;background:var(--background-color);padding:0;box-sizing:border-box}.grid-container{height:100%;display:grid;grid-template-columns:2fr 1fr;grid-template-rows:100%;gap:0;width:100%;margin:0 auto}.grid-left{display:grid;grid-template-rows:60% 40%;gap:0}.grid-left .grid-item:last-child img{object-position:center 66%}.grid-right{display:grid;grid-template-rows:repeat(3,1fr);gap:0}.grid-item{position:relative;overflow:hidden;background:#0f0f0f}.grid-item img{width:100%;height:100%;object-fit:cover;display:block}.grid-item:hover img{transform:none}@media (max-width: 768px){.featured-grid{height:auto}.grid-container{grid-template-columns:1fr;grid-template-rows:auto}.grid-left{display:grid;grid-template-rows:repeat(2,60vh)}.grid-right{display:grid;grid-template-rows:repeat(3,60vh)}}.work-category{padding:8rem 2rem;text-align:center}.category-title{font-size:clamp(2rem,3vw,3.5rem);font-weight:400;color:var(--text-color);letter-spacing:.05em;margin:0;text-transform:none;position:relative;display:inline-block;font-family:Helvetica Neue,Arial,sans-serif}.category-title:after{content:"";position:absolute;bottom:-.75rem;left:50%;transform:translate(-50%);width:30%;height:1px;background:#ffffff26}@media (max-width: 768px){.category-title{font-size:clamp(1.5rem,2.5vw,2rem);letter-spacing:.03em}}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;padding:0;background-color:#fffc;width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;margin-top:3rem}.project-item{position:relative;cursor:pointer;overflow:hidden;border-radius:0;aspect-ratio:16/9;background-color:var(--background-color)}.project-image{width:100%;height:100%;object-fit:cover;display:block}[alt="Becks Project"].project-image{object-fit:cover;transform:scale(1.3)}.project-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease}.project-title{color:#fff;font-size:2rem;letter-spacing:.1em}#original .project-title{text-transform:lowercase}.work-category:not(#original) .project-title{text-transform:capitalize}.project-item:hover .project-overlay{opacity:1}.project-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:1000;padding:2rem}.modal-content{background:var(--background-color);width:90%;max-width:1200px;height:80vh;display:flex;border-radius:12px;overflow:hidden;position:relative;background:linear-gradient(to right,var(--background-color) 0%,var(--background-color) 35%,rgba(11,11,11,.98) 42%,rgba(11,11,11,.95) 45%,rgba(8,8,8,.93) 48%,rgba(5,5,5,.92) 50%,rgba(3,3,3,.91) 52%,rgba(0,0,0,.9) 55%,rgba(0,0,0,.9) 100%)}.modal-text{flex:1;padding:3rem 4rem;overflow-y:auto;display:flex;flex-direction:column;justify-content:center}.modal-text h2{margin-bottom:1.5rem}.modal-text p{margin:0;line-height:1.6}.modal-video{flex:1;display:flex;align-items:center;justify-content:center;position:relative;width:100%;padding:2rem}.modal-video iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;height:90%;border:none;border-radius:12px;overflow:hidden}.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--text-color);font-size:2rem;cursor:pointer;z-index:1}.vimeo-link{color:var(--text-color);text-decoration:none;display:inline-block;margin-top:1rem;padding:.5rem 1rem;border:1px solid var(--text-color);border-radius:4px;transition:all .3s ease}.vimeo-link:hover{background:var(--text-color);color:var(--background-color)}@media (max-width: 768px){.projects-grid{grid-template-columns:1fr}.modal-content{flex-direction:column;height:90vh;background:linear-gradient(to bottom,var(--background-color) 0%,var(--background-color) 35%,rgba(11,11,11,.98) 42%,rgba(11,11,11,.95) 45%,rgba(8,8,8,.93) 48%,rgba(5,5,5,.92) 50%,rgba(3,3,3,.91) 52%,rgba(0,0,0,.9) 55%,rgba(0,0,0,.9) 100%)}.modal-text,.modal-video{flex:none;width:100%}.modal-text{height:40%;padding:2rem}.modal-video{height:60%;padding:1.5rem}.modal-video iframe{width:95%;height:95%}}.main-content{padding-top:80px;min-height:calc(100vh - 80px)}.page-container{max-width:1400px;margin:0 auto;padding:2rem}.page-title{font-size:clamp(2.5rem,5vw,4rem);font-weight:300;color:var(--text-color);text-align:center;margin-bottom:3rem;letter-spacing:.05em}.header a{color:var(--text-color);text-decoration:none;font-size:.9rem;letter-spacing:1px;margin-left:2rem;transition:opacity .3s ease}.header a:hover{opacity:.7}.contact-page{text-align:center}.contact-content{max-width:800px;margin:0 auto}.contact-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:4rem}.contact-item{padding:1.5rem}.contact-item h3{font-size:1.2rem;font-weight:300;margin-bottom:1rem;color:var(--text-color)}.contact-item a,.contact-item p{color:#ffffffb3;text-decoration:none;transition:color .3s ease}.contact-item a:hover{color:var(--text-color)}.contact-message{font-size:1.2rem;line-height:1.6;color:#ffffffb3}.contact-message p{margin:1rem 0}@media (max-width: 768px){.header{padding:1rem;flex-direction:column;gap:1rem}.header nav{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}.header a{margin:0}.page-container{padding:1rem}.contact-info{grid-template-columns:1fr}}.node-graph-section{padding:4rem 2rem;background-color:#1a1a1a;min-height:80vh;display:flex;flex-direction:column;align-items:center}.node-graph-section .category-title{margin-bottom:2rem;color:#fff}.node-graph-container{width:100%;height:60vh;position:relative;overflow:hidden;background-color:#141414;border-radius:8px;box-shadow:0 4px 6px #0000001a}.node-graph{width:100%;height:100%}.node-connection{fill:none;stroke:#4a4a4a;stroke-width:2}.node-rect{fill:#2a2a2a;stroke:#3a3a3a;stroke-width:2}.node-type-input .node-rect{fill:#2d3436;stroke:#636e72}.node-type-works .node-rect{fill:#2d3436;stroke:#00b894}.node-type-original_creations .node-rect{fill:#2d3436;stroke:#0984e3}.node-type-merge .node-rect{fill:#2d3436;stroke:#6c5ce7}.node-type-output .node-rect{fill:#2d3436;stroke:#e17055}.node-text{fill:#fff;text-anchor:middle;font-size:14px;-webkit-user-select:none;user-select:none}.node-input,.node-output{fill:#4a4a4a;stroke:#6a6a6a;stroke-width:1}
