@font-face{font-family:Bloc Display;src:url('assets/fonts/RobotoCondensed.ttf') format('truetype');font-weight:100 900;font-display:swap}
@font-face{font-family:Bloc Body;src:url('assets/fonts/Inter.ttf') format('truetype');font-weight:100 900;font-display:swap}
:root{--ink:#0B0B0B;--paper:#F3F0E8;--pink:#FC025C;--grey:#8A8882}
*{box-sizing:border-box}html{background:var(--ink)}body{margin:0;color:var(--ink);font-family:Bloc Body,Arial,sans-serif}h1,p{margin:0}::selection{background:var(--paper);color:var(--ink)}
.wall{min-height:100svh;display:grid;place-items:center;padding:64px 36px;background:var(--ink);position:relative;overflow:hidden}
.wall:before{content:'';position:absolute;inset:0;background:url('assets/print-grain.svg');opacity:.27;pointer-events:none}
.poster-wrap{width:min(840px,100%);position:relative;transform:rotate(-1.2deg)}
.back-sheet{position:absolute;inset:15px -12px -10px 13px;background:var(--grey);transform:rotate(2.2deg);clip-path:polygon(0 1%,99% 0,100% 99%,1% 100%)}
.poster{background:var(--pink);padding:38px 46px 33px;position:relative;isolation:isolate;box-shadow:9px 16px 0 #0006;clip-path:polygon(0 .2%,18% 0,43% .3%,72% 0,100% .4%,99.7% 22%,100% 58%,99.5% 100%,68% 99.7%,42% 100%,18% 99.6%,.3% 100%,0 73%,.3% 38%)}
.poster:after{content:'';position:absolute;inset:0;background:url('assets/print-grain.svg');mix-blend-mode:multiply;opacity:.29;pointer-events:none;z-index:4}
.brand-slip{background:var(--paper);width:min(515px,90%);padding:16px 22px 14px;transform:rotate(-2deg);margin:0 0 21px -7px;clip-path:polygon(0 1%,31% 0,53% 2%,100% 0,99.5% 98%,75% 100%,33% 98%,.5% 100%)}
.brand{width:100%;aspect-ratio:4.2;position:relative;overflow:hidden}.brand img{width:107%;max-width:none;position:absolute;left:-4%;top:-39%;height:auto}
.kicker{font:11px/1.5 monospace;letter-spacing:.03em;margin-bottom:28px;margin-left:7px}
h1{font:900 126px/.95 Bloc Display,'Arial Narrow',sans-serif;letter-spacing:-.04em;margin:0 0 0 -9px}
.cut-row{display:flex;align-items:center;gap:4px;width:max-content;max-width:100%}
.cut-row span{background:var(--ink);color:var(--paper);display:inline-block;padding:1px .075em 9px;line-height:1;transform:rotate(-3deg);position:relative}
.cut-row span:nth-child(2n){transform:rotate(3deg)}
.cut-row span:nth-child(3n){background:var(--paper);color:var(--ink);font-family:Bloc Body,Arial,sans-serif;font-size:.9em;letter-spacing:-.08em;transform:rotate(-2deg);font-weight:900}
.cut-row span:nth-child(4){transform:rotate(6deg);padding-left:.1em;padding-right:.1em}
.coming{transform:rotate(1deg)}.coming span:nth-child(1){font-family:Georgia,serif;font-weight:900;font-size:.99em}.coming span:nth-child(2){top:-5px}.coming span:nth-child(5){top:6px}
.soon{font-size:1.36em;margin:21px 0 0 38px;transform:rotate(-2deg);gap:5px}.soon span:nth-child(2){font-family:Georgia,serif;font-weight:900;font-size:.96em}.soon span:nth-child(3){transform:rotate(4deg)}.soon span:nth-child(4){top:6px}.soon .dot{padding:0 .015em 9px;background:none;color:var(--ink);transform:rotate(0);align-self:end;font-size:.75em}
.scribble{width:91%;margin:10px 0 13px 8px;transform:rotate(-2deg);height:37px}.scribble svg{width:100%;height:100%;fill:none;stroke:var(--ink);stroke-width:5;stroke-linecap:round}
.tagline{display:table;font:900 42px/.97 Bloc Display,'Arial Narrow',sans-serif;letter-spacing:-.02em;color:var(--paper);background:var(--ink);padding:11px 16px 15px;transform:rotate(2deg);margin:0 0 29px 18px}
.colophon{border-top:3px solid var(--ink);padding-top:17px;display:flex;align-items:center;justify-content:space-between;gap:20px}.domain{font:700 17px/1.4 monospace;letter-spacing:-.035em}.watch{font:900 italic 22px/.95 Bloc Display,'Arial Narrow',sans-serif;transform:rotate(-3deg);white-space:nowrap}.watch span{font-style:normal;font-size:36px;margin-left:11px;vertical-align:middle}
.tape{position:absolute;width:157px;height:54px;background:var(--paper);opacity:.69;z-index:6;box-shadow:0 1px 1px #0004;clip-path:polygon(0 8%,3% 2%,7% 7%,10% 0,15% 5%,19% 1%,24% 4%,96% 0,94% 12%,99% 18%,96% 26%,100% 38%,96% 47%,99% 55%,97% 63%,100% 76%,96% 84%,99% 96%,58% 100%,31% 98%,0 100%,3% 90%,0 80%,3% 67%,0 51%,3% 40%,0 24%,3% 16%)}
.tape:before{content:'';position:absolute;inset:4px 0;border-top:1px solid #8A88824d;border-bottom:1px solid #8A88824d;transform:rotate(-1deg)}.tape:after{content:'';position:absolute;inset:0;background:url('assets/tape-grain.svg');opacity:.75;mix-blend-mode:multiply}
.tape-top-left{top:9px;left:-51px;transform:rotate(-38deg)}.tape-top-right{top:4px;right:-45px;transform:rotate(39deg);width:164px}.tape-bottom-left{bottom:18px;left:-53px;transform:rotate(34deg);width:142px}.tape-bottom-right{bottom:9px;right:-47px;transform:rotate(-34deg);height:59px}
@media(min-width:1000px) and (max-height:900px){.wall{padding:39px 36px}.poster-wrap{width:720px}.poster{padding:25px 38px 24px}.brand-slip{width:430px;padding:11px 18px;margin-bottom:13px}.kicker{margin-bottom:21px;font-size:10px}h1{font-size:109px}.soon{margin-top:18px;font-size:1.29em}.scribble{height:29px;margin-top:7px;margin-bottom:10px}.tagline{font-size:34px;margin-bottom:22px}.colophon{padding-top:13px}.domain{font-size:15px}.watch{font-size:20px}}
@media(max-width:760px){.wall{padding:43px 23px;min-height:100svh}.poster-wrap{width:min(590px,100%);transform:rotate(-1deg)}.poster{padding:29px 22px 27px}.brand-slip{width:98%;padding:14px 14px;margin:0 0 23px -3px}.kicker{font-size:9px;margin:0 0 22px 2px;max-width:260px}h1{font-size:clamp(51px,11.6vw,92px);margin-left:-4px}.cut-row{gap:2px}.soon{font-size:1.34em;gap:2px;margin:17px 0 0 9px}.cut-row span{padding-bottom:6px}.scribble{width:95%;height:28px;margin:9px 0 11px}.tagline{font-size:clamp(25px,6.3vw,36px);padding:9px 12px 12px;margin-left:6px;margin-bottom:27px}.colophon{display:block;padding-top:14px}.domain{font-size:clamp(12px,3.5vw,16px)}.watch{margin:15px 0 0 4px;font-size:20px}.watch span{font-size:28px}.tape{width:104px;height:38px}.tape-top-left{left:-34px;top:6px}.tape-top-right{right:-31px;top:4px;width:109px}.tape-bottom-left{left:-32px;bottom:15px;width:95px}.tape-bottom-right{right:-30px;bottom:11px;height:40px;width:104px}.back-sheet{inset:11px -8px -8px 8px}}
@media(max-width:360px){.wall{padding:37px 20px}.poster{padding:27px 18px 24px}h1{font-size:11.5vw}.kicker{font-size:8px}.tagline{font-size:25px}}
@media(min-width:1000px) and (max-height:900px){.poster{padding-top:21px;padding-bottom:20px}.brand-slip{width:390px}.kicker{margin-bottom:15px}h1{font-size:96px}.soon{font-size:1.24em;margin-top:11px}.tagline{font-size:30px;margin-bottom:18px}}
.colophon{padding-left:38px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}