#showcase{background-color:var(--page-background);min-height:100vh;padding:8rem 0}#showcase .showcase-container{width:var(--section-width);margin:0 auto}@media (max-width:768px){#showcase .showcase-container{width:90%}}#showcase .showcase-top{position:relative}#showcase .showcase-top .work-filter{gap:var(--button-gap);color:#fff;display:flex;position:relative}#showcase .showcase-top .work-filter button{font-size:var(--text-md);color:#fff;z-index:20;cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:1px solid #fff;padding:.5rem 1rem;position:relative;overflow:hidden}#showcase .showcase-top .work-filter button svg{width:1rem;height:1rem;margin-left:.5rem;transition:color .3s}#showcase .showcase-top .work-filter button span{text-transform:capitalize;transition:color .3s}#showcase .showcase-top .work-filter button a{text-transform:capitalize;border:none;text-decoration:none;transition:color .3s}#showcase .showcase-top .work-filter button:hover:after{clip-path:inset(0%);color:#000}#showcase .showcase-top .work-filter button:hover a,#showcase .showcase-top .work-filter button:hover span,#showcase .showcase-top .work-filter button:hover svg{color:#000}#showcase .showcase-top .work-filter .filter-2{padding:0;position:relative}#showcase .showcase-top .work-filter .filter-2 a{font-size:var(--text-md);padding:.5rem 1rem;text-decoration:none}#showcase .showcase-top .work-filter .filter-1:after{content:"";z-index:-10;clip-path:inset(0% 0% 0% 100%);background-color:#fff;border:none;width:100%;height:100%;transition:width .3s ease-in-out,clip-path .3s ease-in-out;display:block;position:absolute;bottom:0;left:0}#showcase .showcase-top .work-filter .filter-2:after{content:"";z-index:-10;clip-path:inset(0% 100% 0% 0%);background-color:#fff;border:none;width:100%;height:100%;transition:width .3s ease-in-out,clip-path .3s ease-in-out;display:block;position:absolute;bottom:0;left:0}#showcase .showcase-top .work-filter .filter-text-active{color:#000}#showcase .showcase-top .work-filter .filter-text-inactive{color:#fff}#showcase .showcase-top .work-filter-dropdown{clip-path:inset(0% 0% 100%);width:fit-content;margin-top:var(--button-gap);background-color:var(--page-background);z-index:100;border:1px solid #fff;flex-flow:column;padding:0;display:flex;position:absolute;top:100%;left:0}#showcase .showcase-top .work-filter-dropdown a{white-space:nowrap;text-align:left;color:#fff;width:100%;font-size:var(--text-md);background:0 0;border:none;padding:.5rem 5rem .5rem 1rem;text-decoration:none;display:block}#showcase .showcase-top .work-filter-dropdown .filter-checkbox{background-color:#fff;border:1px solid #fff;width:1rem;height:1rem;margin-right:.5rem;padding:0;display:inline-block;position:relative;overflow:hidden}#showcase .showcase-top .work-filter-dropdown .filter-checkbox:after{content:"";background-color:#000;width:110%;height:110%;transition:transform .2s,background-color .2s;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#showcase .showcase-top .work-filter-dropdown a:hover .filter-checkbox:after{background-color:#000;transform:translate(-50%,-50%)scale(.5)}#showcase .showcase-top .work-filter-dropdown a:hover{background-color:#ffffff1a}#showcase .showcase-bottom{margin-top:1.5rem}@media (max-width:768px){#showcase .showcase-bottom{margin-top:3rem}}#showcase .showcase-bottom h2{color:#fff;text-transform:capitalize;font-size:3rem}#showcase .showcase-bottom .showcase-video{width:100%;position:relative}#showcase .showcase-bottom .showcase-video video{width:100%;height:auto}@media (max-width:768px){#showcase .showcase-bottom .showcase-video{display:none}}#showcase .showcase-bottom .showcase-description{color:#fff;margin-top:1rem}#showcase .showcase-bottom .showcase-description p{font-size:var(--text-md);margin-bottom:.3rem}@media (max-width:768px){#showcase .showcase-bottom .showcase-description p{font-size:1.2rem;line-height:1.4rem}}#showcase .showcase-related{margin-top:3rem}#showcase .showcase-related h2{font-size:var(--text-md);color:#000;text-transform:capitalize;background-color:#fff;width:fit-content;padding:.3rem .5rem}@media (max-width:768px){#showcase .showcase-related h2{font-size:1.2rem}#showcase .showcase-related{margin-top:0}}#showcase .related{grid-template-columns:repeat(auto-fit,minmax(200px,300px));gap:1.5rem 1rem;margin-top:1.5rem;display:grid}@media (max-width:768px){#showcase .related{grid-template-columns:1fr;grid-auto-rows:auto}}#showcase .related .related-video-container{cursor:pointer;width:100%;height:100%;position:relative}#showcase .related .related-video-container .related-video{background-color:#000;width:100%;height:100%}#showcase .related .related-video-container .related-video video{width:100%;height:100%}#showcase .error-msg-container{justify-content:center;align-items:center;margin-top:1.5rem;display:flex}#showcase .error-msg{color:#fff;width:100%;font-size:1.2rem}