:root{--e:cubic-bezier(.22,1,.36,1);--spring:cubic-bezier(.34,1.45,.64,1)}
@view-transition{navigation:auto}
::view-transition-old(root){animation:sxo .55s ease both}
::view-transition-new(root){animation:sxi .75s ease both}
@keyframes sxo{to{opacity:0}}@keyframes sxi{from{opacity:0}}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body{overscroll-behavior-y:none}.txt p,.big,.lbl{text-wrap:balance}
::selection{background:#fff;color:#0E0B0C}
a{-webkit-tap-highlight-color:transparent}
.top a,.fl a{position:relative;border-bottom:0!important;transition:opacity .7s var(--e),transform .5s var(--spring)}
.top a::after,.fl a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:#fff;transform:scaleX(0);transform-origin:right;transition:transform .9s var(--e)}
.top a:hover::after,.fl a:hover::after,.top a[aria-current]::after,.top a:focus-visible::after{transform:scaleX(1);transform-origin:left}
.top a:active,.fl a:active{transform:scale(.96);opacity:.7;transition-duration:.15s}
a:focus-visible,button:focus-visible{outline:1px solid #fff;outline-offset:6px}
.sk{position:absolute;left:-999px;top:0;background:#fff;color:#0E0B0C;padding:10px 14px;z-index:99}.sk:focus{left:10px;top:10px}
.rv{opacity:0;transform:translateY(14px);transition:opacity 1.4s var(--e),transform 1.4s var(--e)}
.rv.in{opacity:1;transform:none}
.gg img{background:#0E0B0C;transition:transform 1.6s var(--e),filter 1s ease}
.gg .tile{display:block;overflow:hidden;cursor:zoom-in;transition:transform .7s var(--spring),box-shadow .7s var(--e),filter 1s ease;box-shadow:0 0 0 rgba(255,255,255,0)}
@media(hover:hover){.gg .tile:hover img{transform:scale(1.025)}.gg:hover .tile:not(:hover){filter:brightness(.7)}}
.gg .tile:active{transform:scale(.985);box-shadow:0 0 0 1px rgba(255,255,255,.18);transition-duration:.18s,.18s,.5s}
.lb{position:fixed;inset:0;margin:0;max-width:none;max-height:none;width:100%;height:100%;border:0;background:#0E0B0C;padding:0;color:#fff}
.lb::backdrop{background:#0E0B0C}.lb[open]{display:grid;place-items:center;animation:sxi .6s ease}
.lb img{max-width:92vw;max-height:88vh;width:auto;height:auto;transition:opacity .6s ease}
.lb button{position:absolute;background:none;border:0;color:#fff;font:inherit;font-size:13px;letter-spacing:.2em;text-transform:uppercase;padding:22px;cursor:pointer;transition:opacity .6s var(--e)}
.lb button:hover{opacity:.6}.lb button:active{transform:scale(.95)}
.lb .x{top:0;right:0}.lb .p{left:0;top:50%}.lb .n{right:0;top:50%}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}*,::view-transition-old(root),::view-transition-new(root){animation:none!important;transition:none!important}}
/* contact form + buttons */
.cf{max-width:26em;margin:0 auto;padding:4vh 7vw 2vh;text-align:left}
.cf .row{margin-bottom:2.4em;position:relative}
.cf label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.2em;color:#999;margin-bottom:.5em;transition:color .6s var(--e)}
.cf .row:focus-within label{color:#fff}
.cf input,.cf textarea{width:100%;background:transparent;border:0;border-bottom:1px solid #333;color:#fff;font:inherit;font-size:17px;padding:.5em 0;outline:none;transition:border-color .8s var(--e);border-radius:0}
.cf input:focus,.cf textarea:focus{border-bottom-color:#fff}
.cf textarea{resize:vertical;min-height:5em}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.go{display:block;margin:1em auto 0;background:none;border:1px solid #444;color:#fff;font:inherit;font-size:13px;text-transform:uppercase;letter-spacing:.2em;padding:1em 3em;cursor:pointer;transition:border-color .7s var(--e),transform .45s var(--spring),opacity .4s}
.go:hover{border-color:#fff}
.go:active{transform:scale(.95)}
.go:disabled{opacity:.55}
.st{text-align:center;font-size:14px;color:#999;min-height:1.6em;margin:1.4em 0 0;opacity:0;transition:opacity 1.2s var(--e)}
.st.ok,.st.err{opacity:1}
.st.err a{color:#fff}
.cb{display:flex;justify-content:center;gap:2.4em;padding:5vh 0 0;flex-wrap:wrap}
.bt{background:none;border:0;border-bottom:1px solid #555;color:#fff;font:inherit;font-size:13px;text-transform:uppercase;letter-spacing:.2em;text-decoration:none;padding:.5em .2em;cursor:pointer;transition:border-color .7s var(--e),opacity .7s var(--e),transform .45s var(--spring)}
.bt:hover{border-color:#fff}
.bt:active{transform:scale(.95);opacity:.7}
/* intro */
#intro{position:fixed;inset:0;background:#0E0B0C;z-index:60;display:grid;place-items:center}
#intro img{max-width:64.4vw;max-height:57.4vh;opacity:0;object-fit:contain}
#isk{position:absolute;top:24px;right:24px;background:none;border:0;color:#999;font:inherit;font-size:12px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;padding:12px;transition:color .6s var(--e)}
#isk:hover{color:#fff}
#pg{opacity:1}

/* v4 trailer polish */
::view-transition-old(root){animation:sxo .45s cubic-bezier(.4,0,.2,1) both}
::view-transition-new(root){animation:sxi 1s var(--e) .42s both}
.top{position:fixed!important;top:0;left:0;right:0;z-index:5;padding-bottom:36px!important;background:linear-gradient(#0E0B0C 50%,rgba(14,11,12,0))}
body{padding-top:72px!important}
body::after{content:"";position:fixed;left:0;right:0;bottom:0;height:120px;pointer-events:none;z-index:4;background:linear-gradient(rgba(14,11,12,0),rgba(14,11,12,.8) 55%,#0E0B0C)}.fm{padding-bottom:calc(150px + env(safe-area-inset-bottom))!important}
.hero{padding-top:12svh!important;padding-bottom:9svh!important;will-change:opacity,transform}
.txt{padding-top:10svh!important}
.hero .sb{display:inline-block;margin-top:4svh;background:#fff;color:#0E0B0C;border-radius:999px;padding:.75em 1.9em;font-size:13px;letter-spacing:.16em;text-transform:uppercase;line-height:1;white-space:nowrap;opacity:0;animation:sxp 1.6s var(--e) .9s both}
@keyframes sxp{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.hero .lbl{animation:sxp 1.8s var(--e) .1s both}
@media(max-width:700px){.hero .sb{font-size:11px;padding:.8em 1.5em;letter-spacing:.13em}}
.txt p.dm{opacity:.3;transition:opacity 1.4s var(--e)}
.txt p.dm.fc{opacity:1}
@media(prefers-reduced-motion:reduce){.hero .sb,.hero .lbl{animation:none!important;opacity:1}.txt p.dm{opacity:1}}

/* v5 icons */
.fm img{width:auto!important;height:min(32vw,176px)!important;display:inline-block}
#intro #iim{width:auto!important;height:min(32vw,176px)!important;max-width:none!important;max-height:none!important;object-fit:contain}

/* v6 spinner */
@keyframes spn{to{transform:rotate(360deg)}}
.spin{animation:spn .9s steps(8) infinite}
#intro #iim.sp{height:150px!important}
img[src^="ic-wind"]{height:min(22vw,120px)!important}
.st img{display:block;margin:0 auto;width:44px;height:44px}
@media(prefers-reduced-motion:reduce){.spin{animation:none!important}}

/* v7 slower, softer page-to-page */
.top{view-transition-name:nav}
::view-transition-group(nav){animation-duration:0s}
::view-transition-old(nav),::view-transition-new(nav){animation-duration:.9s;animation-timing-function:cubic-bezier(.45,0,.25,1)}
::view-transition-old(root){animation:sxo .75s cubic-bezier(.45,0,.25,1) both}
::view-transition-new(root){animation:sxi 1.5s cubic-bezier(.22,1,.36,1) .55s both}
.rv{transition-delay:var(--d,0s)}
.gg .tile.rv{transition:opacity 1.5s var(--e),transform 1.5s var(--e),box-shadow .7s var(--e),filter 1s ease;transition-delay:var(--d,0s),var(--d,0s),0s,0s}
.rv{transform:translateY(18px)}
@media(prefers-reduced-motion:reduce){.rv{transition-delay:0s!important}}

/* v8 page scrolls inside body so content ends at the layout edge, above Safari's bar; black below it */
html{height:100%;overflow:hidden;background:#0E0B0C}
body{height:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
body .fl{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;row-gap:14px}
body .fl a{margin:0 clamp(4px,1.6vw,14px)}
@media(max-width:430px){body .fl{letter-spacing:.14em;font-size:12px}}
@media(max-width:430px){body .top{font-size:10.5px!important;letter-spacing:.1em!important}body .top .r a{margin-left:clamp(7px,2.2vw,14px)!important}}
