*,:after,:before{box-sizing:border-box}:root{font-size:18px}body,html,main{height:100%;width:100%;position:relative}body{margin:0;--color-text:#000;--color-text-alt:#848484;--color-title:#d3d3d3;--color-bg:#dcdcdc;--color-link:#e3154d;--color-link-hover:#000;color:var(--color-text);background-color:var(--color-bg);--cursor-stroke:#e3154d;--cursor-fill:none;--cursor-stroke-width:1px;--cursor-text:#000;font-family:tenon,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{text-decoration:underline;color:var(--color-link);outline:none}a:focus,a:hover{text-decoration:none;color:var(--color-link-hover);outline:none}.unbutton{background:none;border:0;padding:0;margin:0;font:inherit;cursor:pointer}.unbutton:focus{outline:none}.js .loading:after,.js .loading:before{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:.4;background:var(--color-link);animation:loaderAnim .7s linear infinite alternate forwards}@keyframes loaderAnim{to{opacity:1;transform:scale3d(.5,.5,1)}}.message{z-index:100;background:var(--color-text);color:var(--color-bg);padding:.5rem;font-size:.75rem;position:relative}.no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.frame{padding:1rem 5vw;position:relative;z-index:1000}.frame__title{font-size:1rem;margin:0 0 1rem;font-weight:400}.frame__links{display:inline}.frame__demos a:not(:last-child),.frame__links a:not(:last-child){margin-right:1rem}.frame__demos{margin:1rem 0}.frame__demo--current,.frame__demo--current:hover{color:var(--color-text);text-decoration:none}.content{display:flex;flex-direction:column;width:100vw;height:300px;justify-content:center;position:relative;align-items:center}.grid{position:absolute;width:120%;height:120%;top:-10%;left:-10%;display:grid;grid-template-columns:repeat(50,2%);grid-template-rows:repeat(50,2%);perspective:1000px}.grid--inactive{pointer-events:none}.grid__item{grid-area:var(--grid-row)/var(--grid-column)/span 12/span 5}.grid__item,.grid__item-img{position:relative;will-change:transform}.grid__item-img{width:100%;height:100%;background-size:cover;background-position:50% 50%;border-radius:10px}.char{will-change:transform}.pos-1{--grid-row:10;--grid-column:1}.pos-2{--grid-row:1;--grid-column:18}.pos-3{--grid-row:1;--grid-column:29}.pos-4{--grid-row:15;--grid-column:12}.pos-5{--grid-row:17;--grid-column:25}.pos-6{--grid-row:20;--grid-column:43}.pos-7{--grid-row:35;--grid-column:5}.pos-8{--grid-row:40;--grid-column:14}.pos-9{--grid-row:37;--grid-column:29}.pos-10{--grid-row:35;--grid-column:42}.pos-11{--grid-row:1;--grid-column:44}.pos-12{--grid-row:32;--grid-column:20}.pos-13{--grid-row:22;--grid-column:2}.pos-14{--grid-row:9;--grid-column:38}.pos-15{--grid-row:4;--grid-column:7}.pos-16{--grid-row:28;--grid-column:36}.content__title{font-size:12vw;margin:0;line-height:1.2;position:relative;color:var(--color-title);text-transform:uppercase;pointer-events:none}.content__title-line{display:block;position:relative;overflow:hidden;line-height:1}.content__title-line--1{margin-left:5vw}.content__title-line--2{margin-right:-5vw}.preview{position:relative;pointer-events:none}.js .preview{width:100%;height:100%;position:absolute;top:0;left:0}.preview__item{position:relative;margin:0 auto;padding:0 5vw;display:grid;grid-template-rows:auto auto auto;grid-template-columns:50% 50%;grid-template-areas:"preview-back preview-back" "preview-img preview-title" "preview-content preview-content"}.js .preview__item{perspective:1000px}.js .preview__item:not(.preview__item--open){position:absolute;overflow:hidden;height:0;opacity:0}.js .preview__item--open{pointer-events:auto}.preview__item-back{grid-area:preview-back;justify-self:start;font-size:.857rem;text-transform:uppercase;font-weight:500;padding-left:90px;margin-bottom:1rem;background:url(arrow.2103f144.svg) no-repeat 0 50%}.preview__item-title{grid-area:preview-title;font-family:dystopian,sans-serif;font-size:12vw;font-size:clamp(1.5rem,12vw,20vh);margin:0;grid-column-start:1;align-self:center;padding-left:1rem;position:relative;overflow:hidden;pointer-events:none}.preview__item-imgwrap{width:100px;height:150px;border-radius:10px;overflow:hidden;grid-area:preview-img;transform-origin:50% 100%}.preview__item-img{width:100%;height:100%;background-size:cover;background-position:50% 50%}.preview__item-content{grid-area:preview-content;max-width:calc(1100px - 50vh);min-height:440px;line-height:1}.preview__item-meta{color:var(--color-text-alt);text-transform:uppercase;font-size:.857rem;padding:1rem 0 0}.preview__item-meta span{display:block}.preview__item-info{display:block;color:var(--color-link);margin:1rem 0}.preview__item-button{color:#fff;border:0;border-radius:2rem;text-transform:uppercase;font:inherit;font-size:.875rem;font-weight:500;background:#000;padding:1rem 2rem;display:inline-block;cursor:pointer;margin-bottom:1rem}.preview__item-button:active,.preview__item-button:focus,.preview__item-button:hover{outline:none;background:var(--color-link)}.cursor{display:none}@media screen and (min-width:53em){body,html,main{overflow:hidden}.message{display:none}.frame{position:fixed;z-index:100;top:0;left:0;display:grid;align-content:space-between;width:100%;max-width:none;height:100%;padding:1rem 1.5rem;grid-gap:6vw;pointer-events:none;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto auto;grid-template-areas:"title links ..." "... ... ..." "... ... ..."}.frame__title-wrap{grid-area:title;display:flex}.frame__title{margin:0}.frame__tagline{position:relative;margin:0 0 0 1rem;padding:0 0 0 1rem;opacity:.5}.frame__demos{margin:0;grid-area:demos;justify-self:end}.frame__links{grid-area:links;padding:0}.frame a{pointer-events:auto}.content{height:100%}.preview__item{height:100%;width:80vw;grid-template-columns:47% 53%;grid-template-rows:minmax(max(5rem,18vh),1fr) auto auto 1fr;grid-template-areas:"... ..." "preview-back ..." "preview-title preview-title" "preview-img preview-content"}.preview__item-title{justify-self:center;padding:0}.preview__item-meta{padding:1rem 0}.preview__item-info{margin:1rem 0 3rem}.preview__item-imgwrap{width:100%;height:100%;grid-row-start:3;border-radius:10px 10px 0 0}.preview__item-content{padding:0 0 0 4rem}}@media (any-pointer:fine){.cursor{display:block;width:100%;height:100%;z-index:9999}.cursor,.cursor__svg{position:absolute;top:0;left:0;pointer-events:none}.cursor__svg-circle{fill:var(--cursor-fill);stroke:var(--cursor-stroke);stroke-width:var(--cursor-stroke-width)}.cursor__text{position:absolute;top:1.875rem;left:80px;font-size:.857rem;text-transform:uppercase;font-weight:500;fill:var(--cursor-text)}}.splitting .char,.splitting .word{display:inline-block}.splitting .char{position:relative}.splitting .char:after,.splitting .char:before{content:attr(data-char);position:absolute;top:0;left:0;visibility:hidden;transition:inherit;user-select:none}.splitting{--word-center:calc(var(--word-total)/2 - 0.5);--char-center:calc(var(--char-total)/2 - 0.5);--line-center:calc(var(--line-total)/2 - 0.5)}.splitting .word{--word-percent:calc(var(--word-index)/var(--word-total));--line-percent:calc(var(--line-index)/var(--line-total))}.splitting .char{--char-percent:calc(var(--char-index)/var(--char-total));--char-offset:calc(var(--char-index) - var(--char-center));--distance:calc(var(--char-offset)*var(--char-offset)/var(--char-center));--distance-sine:calc(var(--char-offset)/var(--char-center));--distance-percent:calc(var(--distance)/var(--char-center))}.splitting.cells img{width:100%;display:block}@supports (display:grid){.splitting.cells{position:relative;overflow:hidden;background-size:cover;visibility:hidden}.splitting .cell-grid{background:inherit;position:absolute;top:0;left:0;width:100%;height:100%;display:grid;grid-template:repeat(var(--row-total),1fr)/repeat(var(--col-total),1fr)}.splitting .cell{background:inherit;position:relative;overflow:hidden}.splitting .cell-inner{background:inherit;position:absolute;visibility:visible;width:calc(100%*var(--col-total));height:calc(100%*var(--row-total));left:calc(-100%*var(--col-index));top:calc(-100%*var(--row-index))}.splitting .cell{--center-x:calc(var(--col-total)/2 - 0.5);--center-y:calc(var(--row-total)/2 - 0.5);--offset-x:calc(var(--col-index) - var(--center-x));--offset-y:calc(var(--row-index) - var(--center-y));--distance-x:calc(var(--offset-x)*var(--offset-x)/var(--center-x));--distance-y:calc(var(--offset-y)*var(--offset-y)/var(--center-y))}}