.projects-page{width:100vw;height:100vh;display:flex;overflow:hidden;background:#000}.project-split{position:relative;flex:1 1;height:100%;display:flex;align-items:center;justify-content:center;transition:flex .8s cubic-bezier(.16,1,.3,1);cursor:pointer;overflow:hidden}.project-split:hover{flex:1.8 1}.projects-page:hover .project-split:not(:hover){filter:grayscale(100%) brightness(.5)}.project-bg{position:absolute;inset:0;background-size:cover;background-position:50%;transition:transform 1.2s cubic-bezier(.16,1,.3,1);z-index:0}.project-split:hover .project-bg{transform:scale(1.1)}.project-overlay{position:absolute;inset:0;background:rgba(0,0,0,.3);transition:background .5s ease;z-index:1}.project-split:hover .project-overlay{background:rgba(0,0,0,.1)}.project-content{position:relative;z-index:10;text-align:center;color:#fff;mix-blend-mode:difference}.project-title{font-family:Inter,sans-serif;font-size:4rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem;opacity:.9;transition:all .5s ease}.project-desc{font-size:1.2rem;font-weight:300;letter-spacing:.05em;opacity:0;transform:translateY(20px);transition:all .5s ease .1s;max-width:400px;margin:0 auto}.project-split:hover .project-desc{opacity:1;transform:translateY(0)}.project-btn{margin-top:2rem;padding:12px 32px;background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);border-radius:50px;color:#fff;font-size:.9rem;text-transform:uppercase;letter-spacing:.2em;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;transform:translateY(20px);transition:all .5s ease .2s}.project-split:hover .project-btn{opacity:1;transform:translateY(0)}.project-btn:hover{background:#fff;color:#000}@media (max-width:768px){.projects-page{flex-direction:column}.project-title{font-size:2.5rem}.project-split:hover{flex:1.5 1}}