*{box-sizing:border-box}
html{background:#111;color:#f5f4f0;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
body{margin:0}
main{position:relative;isolation:isolate;height:100vh;height:100dvh;overflow:hidden}
header{position:absolute;inset:0 0 auto;z-index:2;isolation:isolate;text-align:center;padding:calc(40px + env(safe-area-inset-top,0px)) 20px 60px;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.72),rgba(0,0,0,.35) 65%,transparent)}
header::before,footer::before{content:"";position:absolute;inset:0;z-index:-1}
header::before{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
h1{font-size:clamp(68px,7.4vw,108px);letter-spacing:-.075em;line-height:1;margin:0 0 22px;font-weight:600;text-shadow:0 2px 24px #0003}
.tagline{font-size:17px;letter-spacing:-.025em;margin:0 0 11px;color:#fff}
.description{font-size:11px;letter-spacing:.025em;color:#dedede;margin:0}
section{height:100%}
.carousel{height:100%;width:100%;overflow:hidden;position:relative;cursor:grab;touch-action:none;user-select:none;outline-offset:-3px}
.carousel:active{cursor:grabbing}
.carousel:focus-visible{outline:1px solid #aaa}
.track{height:100%;position:relative}
.slide{position:absolute;left:0;top:0;height:100%;aspect-ratio:9/16;overflow:hidden;background:#1b1b1b;will-change:transform}
.slide img,.slide video{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;pointer-events:none}
.slide video{opacity:0;transition:opacity .2s}
.slide video.ready{opacity:1}
.under{position:absolute;z-index:2;bottom:calc(160px + env(safe-area-inset-bottom,0px));left:0;right:0;text-align:center;pointer-events:none}
.demo{font-size:9px;color:#dedede;letter-spacing:.03em;margin:0;text-shadow:0 1px 6px #000}
footer{position:absolute;bottom:0;left:0;right:0;z-index:2;isolation:isolate;text-align:center;padding:55px 20px calc(28px + env(safe-area-inset-bottom,0px));pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.4) 65%,transparent)}
footer::before{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);-webkit-mask-image:linear-gradient(transparent,#000 60%);mask-image:linear-gradient(transparent,#000 60%)}
h2{font-size:10px;font-weight:400;letter-spacing:.17em;margin:0 0 14px}
a{color:inherit;text-decoration:none}
a:hover{color:#aaa}
footer a{pointer-events:auto}
.email{font-size:21px;letter-spacing:-.03em}
.links{font-size:10px;color:#d5d5d5;margin:22px 0 0}
.links a{padding:8px 0}
.nojs{text-align:center;padding:40px}
[hidden]{display:none!important}
@media(max-width:600px){
  header{padding:calc(38px + env(safe-area-inset-top,0px)) 18px 55px}
  h1{font-size:75px;margin-bottom:18px}
  .tagline{font-size:15px}.description{font-size:10px}
  .slide{width:100vw;aspect-ratio:auto}
  footer{padding:55px 20px calc(22px + env(safe-area-inset-bottom,0px))}
  .email{font-size:22px}.links{margin-top:18px}
}
@media(prefers-reduced-motion:reduce){.slide video{transition:none}}
