@font-face{font-family:Anton;src:url('./assets/Anton-Regular.ttf') format('truetype');font-display:swap;font-weight:400}
:root{--bone:#f0eee4;--ink:#131612;--red:#e8553c;--petrol:#173f40;--pad:clamp(18px,2.35vw,44px);--name-scale:1;--field-width:calc((100% - var(--pad) * 2) / 2);--field-top:68%;--field-height:26%;--statement-size:7vw;--statement-opacity:1;--type-shift:0px;--skew:0deg;--mobile-name-y:0px;--mobile-name-opacity:1;--mobile-film-top:calc(88px + min(32.6vw,22svh) + env(safe-area-inset-top));--mobile-film-left:0%;--mobile-film-width:100%;--mobile-copy-y:0px;--mobile-shade:1}
*{box-sizing:border-box}
html{background:var(--bone);color:var(--ink);scrollbar-color:var(--ink) var(--bone)}
body{margin:0;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
::selection{background:var(--red);color:var(--bone)}
body::after{content:'';position:fixed;inset:-128px;z-index:30;pointer-events:none;background:url('./assets/grain.png') repeat;background-size:128px 128px;opacity:.25;mix-blend-mode:soft-light;animation:grain-shift .85s steps(1,end) infinite;contain:strict}
@keyframes grain-shift{0%,100%{transform:translate(0,0)}12%{transform:translate(-23px,17px)}25%{transform:translate(33px,-29px)}37%{transform:translate(-47px,-11px)}50%{transform:translate(7px,43px)}62%{transform:translate(-19px,-37px)}75%{transform:translate(41px,21px)}87%{transform:translate(-31px,39px)}}
.page-hidden::after{animation-play-state:paused}
.art-cursor{display:none;position:fixed;left:0;top:0;z-index:40;pointer-events:none;width:0;height:0;opacity:0;mix-blend-mode:difference;transition:opacity .12s}
.cursor-arrow{position:absolute;width:42px;height:42px;left:-9px;top:-34px;overflow:visible;fill:none;stroke:#fff;stroke-width:5;stroke-linecap:square;stroke-linejoin:miter;transform-origin:9px 34px;transition:transform .28s cubic-bezier(.2,.75,.2,1)}
.cursor-disc{position:absolute;left:0;top:0;width:76px;height:76px;border:2px solid #fff;border-radius:50%;transform:translate(-50%,-50%) scale(0);transition:transform .28s cubic-bezier(.2,.75,.2,1)}
.art-cursor.over-film .cursor-disc{transform:translate(-50%,-50%) scale(1)}
.art-cursor.over-film .cursor-arrow{transform:translate(-9px,13px) rotate(90deg) scale(.63)}
.art-cursor.over-type .cursor-arrow{transform:rotate(-12deg) scale(1.25)}
.art-cursor.over-contact .cursor-disc{transform:translate(-50%,-50%) scale(1.15);background:#fff}
.art-cursor.over-contact .cursor-arrow{stroke:#000;transform:translate(-9px,13px) scale(.7)}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.art-cursor{display:block}.cursor-ready,.cursor-ready *{cursor:none!important}.art-cursor.is-visible{opacity:1}}
.signature{position:fixed;top:14px;left:var(--pad);width:108px;height:67px;z-index:10;pointer-events:none;color:var(--bone);background:transparent;mix-blend-mode:difference}
.signature .emblem{width:100%;height:100%}.signature .emblem .piece{fill:currentColor}
.signature path[stroke="#f0eee4"]{stroke:#000}
.signature.on-red{mix-blend-mode:normal}.signature.on-red path[stroke="#f0eee4"]{stroke:var(--red)}
.opening{height:290svh;position:relative}
.stage{height:100svh;min-height:580px;position:sticky;top:0;overflow:hidden;background:var(--bone)}
.wordmark{position:absolute;left:var(--pad);top:11%;margin:0;font:400 34.2vw/.98 Anton,'Arial Narrow',Impact,sans-serif;letter-spacing:-.055em;white-space:nowrap;transform:scale(var(--name-scale));transform-origin:left top}
.graphic-field{position:absolute;left:var(--pad);top:var(--field-top);width:var(--field-width);height:var(--field-height);background:var(--red);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cinema-poster,.cinema-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.cinema-film{opacity:0;transition:opacity .18s linear}.graphic-field.is-playing .cinema-film{opacity:1}.graphic-field.has-film .emblem{display:none}
.opening-statement{position:absolute;top:var(--field-top);right:var(--pad);width:calc((100% - var(--pad) * 2) / 2 - 32px);margin:0;font:400 var(--statement-size)/.95 Anton,'Arial Narrow',Impact,sans-serif;letter-spacing:-.035em;opacity:var(--statement-opacity)}
.opening-statement>span{display:block}
.graphic-field .emblem{width:clamp(310px,53%,750px);height:auto;max-height:95%;color:var(--ink)}
.emblem .ink{fill:currentColor}.emblem .limb{fill:none;stroke:currentColor;stroke-width:19;stroke-linecap:round;stroke-linejoin:round}
.emblem .piece{fill:var(--bone);transform-origin:290px 216px;animation:settle 3.6s linear infinite}
.graphic-field path[stroke="#f0eee4"]{stroke:var(--red)}
.emblem .arm{transform-origin:143px 154px;animation:hammer 3.6s cubic-bezier(.42,0,.21,1) infinite}
.emblem .partner-right .arm{animation-delay:-1.8s}
.emblem .contact{display:none}
@keyframes hammer{0%,12%,100%{transform:rotate(-54deg)}28%{transform:rotate(3deg)}34%{transform:rotate(-12deg)}45%,70%{transform:rotate(-8deg)}90%{transform:rotate(-54deg)}}
@keyframes settle{0%,26%,32%,76%,82%,100%{transform:translateY(0)}28%,78%{transform:translateY(2px)}}
.type-interlude{height:80svh;min-height:500px;display:flex;align-items:center;overflow:hidden;background:var(--bone)}
.ticker-offset{transform:translateX(var(--type-shift)) skewY(var(--skew));transform-origin:center;will-change:transform}
.ticker{display:flex;width:max-content;animation:marquee 36s linear infinite;font:400 27vw/.98 Anton,'Arial Narrow',Impact,sans-serif;letter-spacing:-.045em}
.ticker span{flex:none;white-space:nowrap}
@keyframes marquee{to{transform:translateX(-50%)}}
.closing{min-height:100svh;padding:var(--pad);background:var(--red);position:relative;overflow:hidden;display:flex;align-items:center}
.closing-statement{font:400 min(29vw,42svh)/.98 Anton,'Arial Narrow',Impact,sans-serif;letter-spacing:-.045em;transform:skewY(var(--skew));transform-origin:50% 50%}
.closing-statement span{display:block}
.end-signature{position:absolute;bottom:var(--pad);right:var(--pad);font:400 42px/1 Anton,sans-serif;letter-spacing:-.045em}
.contact{min-height:54svh;padding:clamp(84px,12svh,150px) var(--pad);background:var(--ink);color:var(--bone);display:flex;align-items:center}
.contact-link{display:flex;align-items:center;justify-content:space-between;gap:clamp(16px,4vw,70px);width:100%;padding:12px 0 24px;border-bottom:2px solid currentColor;color:inherit;text-decoration:none;font:400 clamp(64px,12.5vw,240px)/1.05 Anton,'Arial Narrow',Impact,sans-serif;letter-spacing:-.045em;text-transform:uppercase}
.contact-link span{transition:transform .25s cubic-bezier(.2,.75,.2,1)}
.contact-link svg{flex:none;width:clamp(44px,10vw,180px);height:auto;fill:none;stroke:currentColor;stroke-width:3;transition:transform .25s cubic-bezier(.2,.75,.2,1)}
.contact-link:focus-visible{outline:2px solid var(--bone);outline-offset:10px}
@media(hover:hover){.contact-link:hover span{transform:translateX(8px)}.contact-link:hover svg{transform:translate(6px,-6px)}}
.offscreen .arm,.offscreen .piece,.offscreen .ticker{animation-play-state:paused}
@media(max-width:760px),(max-width:1024px) and (orientation:portrait),(max-width:1000px) and (max-height:500px){
 :root{--pad:max(clamp(18px,2.35vw,44px),env(safe-area-inset-left),env(safe-area-inset-right))}
 .signature{width:96px;top:max(12px,env(safe-area-inset-top));height:60px}
 .opening{height:100svh}.stage{height:100svh;min-height:0;position:relative;padding:0;display:block}.motion-ready .opening{height:200svh}.motion-ready .stage{position:sticky}
 .wordmark{top:calc(82px + env(safe-area-inset-top));left:var(--pad);font-size:min(32.6vw,22svh);z-index:2;transform:translate3d(0,var(--mobile-name-y),0) scale(var(--name-scale));opacity:var(--mobile-name-opacity)}
 .graphic-field{left:var(--mobile-film-left);top:var(--mobile-film-top);width:var(--mobile-film-width);height:calc(100% - var(--mobile-film-top));max-height:none;min-height:0;will-change:top,height,left,width;background:var(--ink)}
 .graphic-field.has-film::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 12%,rgba(19,22,18,.08) 35%,rgba(19,22,18,.78) 78%,rgba(19,22,18,.88));opacity:var(--mobile-shade);pointer-events:none}
 .opening-statement{top:auto;right:auto;left:var(--pad);bottom:max(24px,env(safe-area-inset-bottom));width:calc(100% - var(--pad) * 2);font-size:min(26vw,14svh);line-height:.98;color:var(--bone);z-index:3;transform:translate3d(0,var(--mobile-copy-y),0);opacity:var(--statement-opacity)}
 .opening-statement>span>span{display:block}.opening-statement>span:last-child{margin-top:.035em}
 .graphic-field .emblem{width:86%;min-width:280px;max-height:90%}
 .type-interlude{min-height:260px;height:46svh}.ticker{font-size:55vw;line-height:1.05}
 .closing{min-height:90svh;padding:90px var(--pad) 95px;align-items:center}.closing-statement{width:100%;font-size:27vw;line-height:1.06}.closing-statement span:first-child{font-size:2.32em;line-height:.98;margin-left:-.035em}.closing-statement span:last-child{margin-top:.04em}.end-signature{font-size:32px;bottom:max(26px,env(safe-area-inset-bottom))}
 .contact{min-height:64svh;padding:76px var(--pad) max(48px,env(safe-area-inset-bottom))}.contact-link{position:relative;display:flex;align-items:flex-end;min-height:270px;font-size:15.5vw;line-height:1.15;padding:150px 0 22px;gap:0}.contact-link svg{position:absolute;top:0;right:0;width:25vw;max-width:130px;min-width:70px}.contact-link:active svg{transform:translate(5px,-5px)}
}
@media(max-width:1000px) and (max-height:500px){
 :root{--mobile-film-top:0px;--mobile-film-left:42%;--mobile-film-width:58%}
 .wordmark{font-size:min(14vw,28svh);top:76px}.opening-statement{font-size:min(7.8vw,15svh);width:calc(42% - var(--pad));color:var(--ink);bottom:18px}
 .graphic-field.has-film::after{background:linear-gradient(90deg,rgba(19,22,18,.1),transparent 30%)}
 .type-interlude{height:75svh}.ticker{font-size:35vw}.closing{min-height:100svh;padding:70px var(--pad)}.closing-statement{font-size:18vw;display:flex;align-items:baseline;gap:.16em}.closing-statement span:first-child{font-size:1em;margin:0}.closing-statement span:last-child{margin:0}.contact{min-height:100svh}.contact-link{font-size:12vw;min-height:210px;padding-top:100px}.contact-link svg{width:14vw}
}
@media(max-height:620px) and (min-width:1001px),(min-width:761px) and (min-height:501px) and (max-height:620px){.stage{min-height:0}.wordmark{font-size:29vw;top:9%}}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important}.ticker-offset,.closing-statement{transform:none}.emblem .arm{transform:rotate(-8deg)}
 .opening{height:auto}.stage{position:relative;height:auto;min-height:0;padding:110px var(--pad) 25px;display:flex;flex-direction:column;gap:50px}
 .wordmark{position:relative;top:auto;left:auto;transform:none;font-size:32.6vw}.opening-statement{position:relative;top:auto;right:auto;width:100%;font-size:19vw;opacity:1;order:1}.graphic-field{position:relative;left:auto;top:auto;width:100%;height:65svh;min-height:350px;order:2}
}
@media(prefers-reduced-motion:reduce) and (max-width:760px),(prefers-reduced-motion:reduce) and (max-width:1024px) and (orientation:portrait),(prefers-reduced-motion:reduce) and (max-width:1000px) and (max-height:500px){
 .stage{height:100svh;min-height:540px;position:relative;display:block;padding:0}.wordmark{position:absolute;top:calc(82px + env(safe-area-inset-top));left:var(--pad);font-size:min(32.6vw,22svh);opacity:1}
 .graphic-field{position:absolute;top:calc(88px + min(32.6vw,22svh) + env(safe-area-inset-top));left:0;width:100%;height:calc(100% - (88px + min(32.6vw,22svh) + env(safe-area-inset-top)));min-height:0}
 .opening-statement{position:absolute;top:auto;left:var(--pad);right:auto;bottom:24px;width:calc(100% - var(--pad) * 2);font-size:min(26vw,14svh);transform:none;color:var(--bone)}
 .graphic-field.has-film::after{opacity:1}
}
@media(prefers-reduced-motion:reduce) and (max-width:1000px) and (max-height:500px){
 .stage{min-height:0}.wordmark{top:76px;font-size:min(14vw,28svh)}.graphic-field{top:0;left:42%;width:58%;height:100%}.opening-statement{font-size:min(7.8vw,15svh);width:calc(42% - var(--pad));bottom:18px;color:var(--ink)}
}