.sample-project-page{background-color:var(--base-100)}.sample-project-page h3{font-size:4rem}.sample-project-page .project-header{text-align:center;flex-direction:column;justify-content:flex-end;align-items:center;gap:1.5em;width:100%;height:50svh;padding-bottom:3em;display:flex}.sample-project-page .project-header p{margin-bottom:2rem}.sample-project-page .project-banner-img{width:100%;height:100svh;position:relative;overflow:hidden}.sample-project-page .project-video-controls{z-index:2;opacity:0;visibility:hidden;gap:.75rem;transition:opacity .3s,transform .3s,visibility .3s;display:flex;position:absolute;bottom:2rem;right:2rem;transform:translateY(.5rem)}.sample-project-page .project-banner-img:hover .project-video-controls,.sample-project-page .project-banner-img:focus-within .project-video-controls{opacity:1;visibility:visible;transform:translateY(0)}.sample-project-page .project-video-control-btn{background-color:var(--base-400);-webkit-backdrop-filter:blur(8px);width:3rem;height:3rem;color:var(--base-100);cursor:pointer;border:none;border-radius:100%;justify-content:center;align-items:center;transition:background-color .2s,transform .2s;display:flex}.sample-project-page .project-video-control-btn:hover{background-color:var(--base-400);transform:scale(1.08)}.sample-project-page .project-video-control-btn:active{transform:scale(.94)}@media (max-width:1000px){.sample-project-page .project-video-controls{bottom:1.25rem;right:1.25rem}}.sample-project-page img,.sample-project-page video{object-fit:cover;width:100%;height:100%}.sample-project-page .project-banner-img-wrapper{width:100%;height:100%;position:absolute;top:0;left:0}.sample-project-page .project-details{text-align:center;flex-direction:column;align-items:center;gap:4rem;width:55%;margin:0 auto 4rem;padding:8rem 1rem 2rem;display:flex}.sample-project-page .details{flex-direction:column;gap:1rem;margin-bottom:4rem;display:flex}.sample-project-page .project-images{background-color:var(--fg);color:var(--bg);padding:4em 2em}.sample-project-page .project-images-container{flex-direction:column;gap:2em;width:75%;margin:0 auto;display:flex}.sample-project-page .project-img{border-radius:1rem;width:100%;height:80svh;position:relative;overflow:hidden}.sample-project-page .project-img-wrapper{width:100%;height:100%;position:absolute;top:0;left:0}.sample-project-page .next-project{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1.5em;width:100%;height:100svh;display:flex;overflow:hidden}.sample-project-page .next-project-img{border-radius:1rem;width:35%;height:400px;position:relative;overflow:hidden}.sample-project-page .next-project-img-wrapper{width:100%;height:100%;position:absolute;top:0;left:0}@media (max-width:1000px){.sample-project-page .project-header{padding:1.25em 1.25em 3em}.sample-project-page .project-details{gap:3em;width:100%;padding:6em 1.25em}.sample-project-page h3{font-size:2rem}.sample-project-page .project-images{padding:4em 1.25em}.sample-project-page .project-images-container{gap:1.25em;width:100%}.sample-project-page .next-project{padding:1.25em}.sample-project-page .next-project-img{width:75%}.sample-project-page .project-img{height:65svh}}
