@import url("../../../assets/css/responsive.css");
*,*::after,*::before{box-sizing:border-box}:root{font-size:12px;--color-text:#2935ba;--color-bg:#1a0b37;--color-title:#9577cc;--color-link:#9577cc;--color-link-hover:#2935ba;--page-padding:1rem;--rheight:15vh}
body{margin:0;color:var(--color-text);font-family:"ouma-latin-variable",-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;font-variation-settings:"wght" 400;text-transform:uppercase;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--color-bg);overflow-x:hidden}
body::before{content:'';position:fixed;top:0;left:0;width:100%;height:calc(var(--rheight)+1px);pointer-events:none;z-index:2000;background-image:linear-gradient(0deg,rgb(0 0 0/68%),rgb(15 10 23/62%));box-shadow:0px 0px 10vh rgba(0,0,0,0.8)}.js.loading::before,.js.loading::after{content:'';position:fixed;z-index:1000}.js.loading::before{top:0;left:0;width:100%;height:100%;background:var(--color-bg)}.js.loading::after{top:50%;left:50%;width:60px;height:60px;margin:-30px 0 0-30px;border-radius:50%;opacity:0.4;background:var(--color-link);animation:loaderAnim 0.7s linear infinite alternate forwards}
@keyframes loaderAnim{to{opacity:1;transform:scale3d(0.5,0.5,1)}}
a{text-decoration:underline;color:var(--color-link);outline:none;cursor:pointer}
a:hover{text-decoration:none;color:var(--color-link-hover);outline:none}
a:focus{outline:none;background:lightgrey}
a:focus:not(:focus-visible){background:transparent}
a:focus-visible{outline:2px solid red;background:transparent}.unbutton{background:none;border:0;padding:0;margin:0;font:inherit;cursor:pointer}.unbutton:focus{outline:none}.frame{padding:1.5rem 2rem;display:grid;z-index:1000;position:fixed;bottom:0;left:0;width:100%;grid-row-gap:1rem;grid-column-gap:2rem;pointer-events:none;justify-items:start;grid-template-areas:'title' 'prev' 'back' 'sub' 'sponsor' 'demos'}.frame #cdawrap{justify-self:start}.frame a{pointer-events:auto}.frame__title{grid-area:title;font-size:inherit;margin:0}.frame__back{grid-area:back;justify-self:start}.frame__prev{grid-area:prev;justify-self:start}.frame__sub{grid-area:sub}.frame__demos{grid-area:demos;display:flex;gap:1rem}.wrap{position:fixed;overflow:hidden;background:var(--color-bg);width:100%;top:0;box-shadow:0-25px 45px rgba(0,0,0,0.3);height:var(--rheight);transform:scaleY(-1)}.demo-2 .wrap{box-shadow:0-25px 45px rgba(0,0,0,0.15)}.content{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,300px));grid-column-gap:10vw;grid-row-gap:10vh;padding:0 var(--page-padding)60vh;width:100%;margin:var(--rheight)auto 0;justify-content:center;align-items:start;background-image:url(../img/noise.png),radial-gradient(circle,rgb(38 3 130)0%,rgb(14 3 33)100%);background-size:400px,100%100vh;background-attachment:fixed}.demo-2 .content{justify-content:center;grid-template-columns:repeat(2,auto);grid-column-gap:5vw;align-items:center}.content--reflection{position:absolute;top:0;margin:0 auto}.item{position:relative;margin:0;aspect-ratio:2/3;width:100%}.demo-2 .item{max-width:300px;justify-self:center;align-self:center;aspect-ratio:0.75;width:100%}.demo-1 .item{perspective:1000px;transform-style:preserve-3d}.item__inner{width:100%;height:100%}.item__img{position:relative;overflow:hidden;display:grid;place-items:center;width:100%;height:100%}.item__img-inner{position:relative;width:100%;height:100%;background-position:50%0%;background-size:cover}.item__caption{display:grid;place-items:center;position:absolute;bottom:0;left:0;width:100%;mix-blend-mode:plus-lighter}.item__caption-title,.content__title{white-space:nowrap;font-size:inherit;margin:0;font-size:clamp(1.5rem,8vw,3rem);text-transform:uppercase}.item__caption-title{margin:2rem 0}.content__title{text-align:center;font-size:clamp(2rem,20vw,20rem);line-height:0.5;text-transform:uppercase;grid-column:1/-1;width:100%;color:var(--color-title);font-weight:600;font-family:"ivymode",sans-serif;mix-blend-mode:overlay;display:flex;justify-content:center}.content__title:not(:first-child){margin:10vh auto}.item__caption-meta{margin:0}.credits{grid-column:1/-1;text-align:center;font-size:1.25rem}
@media screen and(min-width:53em){body{--page-padding:2rem}.frame{grid-template-columns:auto auto 1fr 1fr;align-content:space-between;grid-template-areas:'title back prev sponsor demos'}.frame #cdawrap,.frame__sub{justify-self:end}}