#project-detail{padding:8rem 0 2rem}.project-detail-title{font-size:clamp(3rem,6vw,8rem);font-weight:400;letter-spacing:var(--ls);line-height:var(--lh-sm);margin-bottom:2rem}.project-detail-year{font-size:var(--fs-lg);margin:0;letter-spacing:var(--ls)}.project-detail-data{display:flex;flex-direction:column;gap:3rem;margin-top:2rem}.project-detail-items{display:grid;grid-template-columns:1fr 1fr}.project-detail-items .tech{width:50%}.project-detail-items p{font-size:var(--fs-lg);line-height:var(--lh-lg);letter-spacing:var(--ls);margin:0}.project-detail-link{position:relative;display:block;width:-moz-fit-content;width:fit-content}.project-detail-items a{font-size:var(--fs-md);font-weight:500;text-transform:uppercase;letter-spacing:normal;line-height:var(--lh-sm)}.project-detail-link.preview{grid-column:2}.project-detail-link .material-symbols-outlined{display:inline-block;font-size:18px;position:absolute;right:-1.3rem;top:5px}.project-detail-thumbnail-wrapper{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;background-color:var(--color-surface);margin:1rem 0 5rem}.project-detail-thumbnail{position:absolute;inset:0;transform:translateZ(0);width:100%;height:110%!important;object-fit:cover;will-change:transform}.responsibilities-head{font-size:var(--fs-md);text-transform:uppercase;color:var(--color-gray);letter-spacing:var(--ls);margin:0}.responsibilities-wrapper{display:grid;grid-template-columns:repeat(2,1fr)}.project-detail-task{display:grid;grid-template-columns:repeat(1,1fr);grid-gap:1rem;gap:1rem}.task-line{display:flex;align-items:start;justify-content:start}.project-detail-client p,.project-detail-task p{font-size:var(--fs-md);line-height:var(--lh-lg);letter-spacing:normal;font-weight:500!important;margin:0}.task-number{min-width:50px;max-width:50px}.project-detail-images{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:20px;gap:20px;margin:5rem 0}.project-detail-image-wrapper{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;margin-bottom:0;background-color:var(--color-surface)}.project-detail-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease}.project-detail-image.loaded{opacity:1}.project-detail-client{display:grid;grid-template-columns:repeat(2,1fr)}.project-detail-client p:first-child{color:var(--color-gray)}.project-detail-next-wrapper{margin-top:8rem;display:flex;flex-direction:column}.project-detail-next-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.project-detail-next-header span,.project-detail-view-all{font-size:var(--fs-md);text-transform:uppercase;letter-spacing:normal;line-height:var(--lh-md);font-weight:400}.project-detail-view-all{font-weight:500}.project-detail-next{display:flex;align-items:center;justify-content:center;width:100%;min-height:18rem;background:var(--color-surface);padding:3rem 2rem;font-size:clamp(2rem,5vw,4rem);font-weight:400;letter-spacing:var(--ls-sm);line-height:var(--lh-sm);text-align:center;position:relative}.project-detail-next:hover{text-decoration:underline}.project-detail-next .corner{position:absolute;width:13px;height:13px}.project-detail-next .corner.tl{top:1rem;left:1rem;border-top:1px solid var(--color-text);border-left:1px solid var(--color-text)}.project-detail-next .corner.tr{top:1rem;right:1rem;border-top:1px solid var(--color-text);border-right:1px solid var(--color-text)}.project-detail-next .corner.bl{bottom:1rem;left:1rem;border-bottom:1px solid var(--color-text);border-left:1px solid var(--color-text)}.project-detail-next .corner.br{bottom:1rem;right:1rem;border-bottom:1px solid var(--color-text);border-right:1px solid var(--color-text)}@media (max-width:640px){#project-detail{padding:6rem 0 10px}.project-detail-title{font-size:13vw;margin-bottom:1rem}.project-detail-data{gap:3rem;margin-top:4rem}.project-detail-link .material-symbols-outlined{top:-2px}.project-detail-items .role{width:90%}.project-detail-items .tech{width:100%}.project-detail-items p{font-size:var(--fs-md);line-height:var(--lh-md)}.project-detail-thumbnail-wrapper{aspect-ratio:1/1;margin:1rem 0}.project-detail-client p,.project-detail-task p,.project-detail-year{font-size:.9375rem;font-weight:400!important}.project-detail-client,.project-detail-task,.responsibilities-wrapper{grid-template-columns:1fr;gap:1.5rem}.task-number{min-width:30px;max-width:30px}.project-detail-images{grid-template-columns:1fr;gap:10px;margin-bottom:1rem}.project-detail-client p:first-child{font-size:var(--fs-md)}.project-detail-next{min-height:15rem}.project-detail-items a,.project-detail-next-header span,.project-detail-view-all{font-size:var(--fs-sm)}}