*{margin:0;padding:0;box-sizing:border-box}body{font-family:Outfit,sans-serif;background:#0a0a0a;color:#fff}#bg-video{position:fixed;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.3}#bg-video-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0a0a0ab3;z-index:0;pointer-events:none}#canvas-container{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:1}main{position:relative;z-index:2}.work-item{position:relative;overflow:hidden;border-radius:8px;background:#ffffff08;cursor:pointer}.work-item .work-image{position:relative;padding-top:66.67%;overflow:hidden}.work-item .work-image img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.work-item .work-info{padding:1.2rem 1.5rem;background:#0a0a0afa;transform:translateY(101%);position:absolute;bottom:0;left:0;right:0;transition:transform .4s cubic-bezier(.4,0,.2,1);border-top:1px solid rgba(255,236,179,.1);height:auto;min-height:80px}.work-item .work-info h3,.work-item .work-info p{font-family:Outfit,sans-serif}.work-item .work-info h3{font-size:1.1rem;color:#ffecb3e6;font-weight:500;margin:0 0 8px;line-height:1.2;display:block}.work-item .work-info p{font-size:.8rem;color:#ffecb380;margin:2em 0 0;line-height:1.2;font-weight:300;display:block}.work-item:hover .work-image img{transform:scale(1.05)}.work-item:hover .work-info{transform:translateY(0)}#hero{height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding-bottom:0;transform:translateY(7vh)}#hero p{opacity:0}h1{font-family:Outfit,sans-serif;font-size:4rem;font-weight:600;letter-spacing:.1em;margin-bottom:1rem;opacity:0;color:#ffecb3e6}p{font-family:Outfit,sans-serif;font-weight:300;font-size:1rem;letter-spacing:.05em;color:#ffecb380}h3{color:#ffecb3e6}.scroll-indicator{font-family:Outfit,sans-serif;font-weight:300;letter-spacing:.05em;position:absolute;bottom:4vh;font-size:.9rem;opacity:0;color:#ffecb3cc}section{min-height:100vh;padding:100px 10vw;display:flex;flex-direction:column;justify-content:center}h2{font-size:2.5rem;margin-bottom:2rem;color:#ffecb3e6}.works-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:2rem}.services-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:3rem;margin-top:3rem}.service-item{padding:2rem;background:#ffffff08;border-radius:8px;transition:transform .3s ease}.service-item:hover{transform:translateY(-5px)}.service-item p{margin-top:2rem}.contact-button{display:inline-block;padding:1rem 2rem;margin-top:2rem;border:1px solid rgba(255,236,179,.1);color:#ffecb3e6;text-decoration:none;border-radius:4px;transition:all .3s ease}.contact-button:hover{background:#ffecb31a}#about{padding:120px 10vw}.about-content{max-width:1200px;margin:0 auto}.about-lead{font-size:1.8rem;line-height:1.6;margin-bottom:3rem;color:#ffecb3e6;font-weight:300}.about-description{display:grid;gap:3rem;margin-top:2rem}.about-description p{font-size:1.1rem;line-height:1.8;color:#ffecb380}.tech-stack{grid-column:1/-1;margin-top:2rem;padding:2rem;background:#ffffff08;border-radius:8px}.tech-stack h3{font-size:1.4rem;margin-bottom:1.5rem;color:#ffecb3e6}.tech-stack ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;list-style:none}.tech-stack li{color:#ffecb3cc;font-size:1rem;padding:.5rem 0}.istudio-logo{display:flex;flex-direction:column;justify-content:center;align-items:center;background:#ffecb305;padding:0}.istudio-logo span{font-family:Outfit,sans-serif;font-size:2.4rem;font-weight:600;color:#ffecb3d9;text-align:center;line-height:1.4;letter-spacing:.05em}.ill-logo{display:flex;flex-direction:column;justify-content:center;align-items:center;background:#ffecb305;padding:0}.ill-logo span{font-family:Outfit,sans-serif;font-size:2.4rem;font-weight:600;color:#ffecb3d9;text-align:center}.ill-logo span.ill-tagline{font-size:1rem;font-weight:300;margin-top:1rem;letter-spacing:.1em;color:#ffecb399}.work-item .istudio-logo,.work-item .ill-logo,.work-item .ovice-logo{padding-top:0;height:300px}.ovice-logo{display:flex;flex-direction:column;justify-content:center;align-items:center;background:#ffecb305;padding:0}.ovice-logo .ovice-text{font-family:Outfit,sans-serif;font-size:2.4rem;font-weight:600;color:#ffecb3d9;text-align:center;letter-spacing:.05em}.ovice-logo .ovice-tagline{font-size:1rem;font-weight:300;margin-top:1rem;letter-spacing:.1em;color:#ffecb399}.modal{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease}.modal.active{opacity:1;visibility:visible}.modal .modal-overlay{position:absolute;width:100%;height:100%;background:#0a0a0af2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modal .modal-container{position:relative;width:90%;max-width:1000px;margin:5vh auto;max-height:90vh;background:#ffffff05;border-radius:12px;overflow-y:auto;transform:translateY(30px);opacity:0;transition:all .5s cubic-bezier(.4,0,.2,1)}.modal.active .modal-container{transform:translateY(0);opacity:1}.modal .modal-close{position:absolute;top:2rem;right:2rem;width:32px;height:32px;background:none;border:none;cursor:pointer;z-index:10}.modal .modal-close span{position:absolute;width:100%;height:1px;background:#ffecb3e6;transform-origin:center;transition:transform .3s ease}.modal .modal-close span:first-child{transform:rotate(45deg)}.modal .modal-close span:last-child{transform:rotate(-45deg)}.modal .modal-close:hover span{background:#fff}.modal .modal-content{padding:4rem;color:#ffecb3e6;height:100%}.modal .modal-header{margin-bottom:3rem}.modal .modal-header h3{font-size:2.4rem;margin-bottom:1rem}.modal .modal-header .modal-subtitle{font-size:1.1rem;color:#ffecb380}.modal .project-details{display:grid;grid-template-columns:1fr 1fr;gap:4rem}.modal .project-details h4{font-size:1.2rem;margin-bottom:1.5rem;color:#ffecb3e6}.modal .project-details .project-description{font-size:1rem;line-height:1.8;color:#ffecb380}.modal .project-details .tech-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:1rem}.modal .project-details .tech-list li{color:#ffecb380;font-size:.9rem;padding:.5rem 1rem;background:#ffffff08;border-radius:4px}@media (max-width: 768px){.about-content{grid-template-columns:1fr;gap:2rem;padding:0 1rem}.about-content .about-lead{font-size:1.4rem;line-height:1.5;text-align:left}.works-grid{grid-template-columns:1fr;gap:2rem;padding:0 1rem}.services-list,.project-details{grid-template-columns:1fr;gap:2rem}.tech-list{grid-template-columns:repeat(2,1fr);gap:1rem}.modal .modal-container{margin:2vh auto;max-height:96vh}.modal .modal-content{padding:2rem}.modal .modal-header h3{font-size:1.8rem}.modal .project-details{grid-template-columns:1fr;gap:2rem}}