.works-page-section{background-color:var(--bg-100)}.works-page-header{display:flex;width:100%;justify-content:center;align-items:center;text-align:center;margin-bottom:var(--space-lg);gap:var(--space-md);flex-direction:column}.works-page-title{font-size:var(--text-3xl);font-weight:600;color:var(--primary-100);line-height:1;text-transform:uppercase;opacity:0;transform:translate(-50px);transition:all .8s ease-out}.works-page-title.animate-in{opacity:1;transform:translate(0)}.works-page-description{font-size:var(--text-sm);font-weight:400;color:var(--primary-200);max-width:35ch;line-height:1.6;margin:0;opacity:0;transform:translate(50px);transition:all .8s ease-out .2s}.works-page-description.animate-in{opacity:1;transform:translate(0)}.works-wrapper{height:100vh}.works-list{justify-content:flex-start;align-items:center;height:100%;display:flex;position:relative;padding:.2rem}.work-item{margin-inline:auto;width:100%;height:100%;display:flex;flex-direction:column;position:absolute;inset:0%;background-color:var(--bg-100);overflow:hidden}.work-media{position:relative;width:100%;height:auto;aspect-ratio:1;overflow:hidden;cursor:pointer;border-radius:12px}.work-image{object-fit:cover;width:100%;height:100%;transition:none}.view-work-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:var(--bg-100);color:#fff;border:none;border-radius:100vw;padding:24px 20px;cursor:pointer;transition:all .3s ease;opacity:0;display:flex;flex-direction:column;align-items:center;gap:4px;font-family:inherit;text-decoration:none}.work-media:hover .view-work-btn{opacity:1}.view-work-btn:hover{background-color:#fff;color:#000;transform:translate(-50%,-50%) scale(1.05)}.btn-text{font-size:8px;line-height:1;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.work-content{color:var(--primary-100);flex-flow:column;justify-content:flex-start;align-items:flex-start;padding:var(--space-lg);display:flex;position:relative;width:100%;height:auto;min-height:300px;background:transparent}.work-number{font-size:.8rem;height:2rem;width:2rem;margin-bottom:.5rem;border-radius:50%;background-color:var(--bg-100);color:var(--primary-100);display:flex;align-items:center;justify-content:center;font-weight:600;position:absolute;top:-1rem;left:var(--space-lg);border:2px solid var(--primary-100)}.work-title{font-size:var(--text-lg);font-weight:700;line-height:1.2;color:var(--primary-100);margin-block:.5rem}.work-description{font-size:var(--text-sm);line-height:1.4;color:var(--accent-100);margin-bottom:var(--space-md);max-width:100%}.work-tags{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.work-tag{background-color:var(--primary-100);color:var(--bg-100);padding:var(--space-xs) var(--space-sm);border-radius:20px;font-size:var(--text-xs);font-weight:500;text-transform:uppercase;letter-spacing:.05em}@media (min-width: 576px){.works-page-header-section{padding:var(--space-xl) 0}.works-page-title{font-size:var(--text-4xl)}.works-page-description{font-size:var(--text-base)}.work-content{min-height:200px;padding:var(--space-xl)}.work-number{font-size:1rem;height:2.5rem;width:2.5rem;top:-1.25rem;left:var(--space-xl)}.work-title{font-size:var(--text-xl)}.work-description{font-size:var(--text-base)}.view-work-btn{padding:32px 28px}.btn-text{font-size:9px}}@media (min-width: 768px){.works-page-header{text-align:left;margin-bottom:var(--space-2xl);flex-direction:row;align-items:flex-end;gap:var(--space-lg);min-height:200px}.works-page-header>div{display:flex;align-items:flex-end;height:100%}.works-page-title{font-size:var(--text-5xl)}.works-page-description{font-size:var(--text-xs);max-width:35ch}.work-media{height:auto;aspect-ratio:1}.work-content{min-height:250px;max-height:200px;padding:2rem}.work-number{font-size:1.5rem;height:3rem;width:3rem;top:-1.5rem;left:2rem}.work-title{font-size:var(--text-2xl)}.work-description{font-size:var(--text-base)}.view-work-btn{padding:40px 36px}.btn-text{font-size:10px}}@media (min-width: 1024px){.works-page-title{font-size:var(--text-5xl)}}@media (min-width: 1024px) and (max-width: 1366px){.works-wrapper{max-width:90vw;margin-inline:auto;aspect-ratio:1}.work-content{min-height:200px;max-height:180px;padding:1.5rem}.work-title{font-size:var(--text-xl)}.work-description{font-size:var(--text-sm)}}
