@font-face{font-family:Manrope;src:url(assets/manrope-regular.woff2?h=b4f7e8ce09) format("woff2"),url(assets/manrope-regular.ttf?h=a13d9b41b0) format("truetype");font-weight:400 500;font-display:swap}@font-face{font-family:Manrope;src:url(assets/manrope-semibold.woff2?h=6f57f01a06) format("woff2"),url(assets/manrope-semibold.ttf?h=6bad1a7742) format("truetype");font-weight:600 800;font-display:swap}@font-face{font-family:Oswald;src:url(assets/oswald-bold.woff2?h=72ac79a818) format("woff2"),url(assets/oswald-bold.ttf?h=a6ee8b91ec) format("truetype");font-weight:700;font-display:swap}
:root{--paper:#f4f1ea;--ink:#141412;--logo-gradient:linear-gradient(90deg in oklch,#ff4b25 6%,#a9c77e 50%,#80a9ed 94%);--wash:var(--paper);--line:#bbb7ae;--accent:#ff4b25;--margin:4.7vw;font-family:Manrope,Arial,sans-serif;color:var(--ink);background:var(--wash);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;min-width:320px;-webkit-font-smoothing:antialiased;background:var(--wash)}[hidden]{display:none!important}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible{outline:2px solid var(--ink);outline-offset:5px}button:disabled{cursor:default}h1,p{margin:0}h1:focus{outline:none}.skip{position:fixed;top:-80px;left:15px;z-index:100;background:var(--ink);color:var(--paper);padding:12px}.skip:focus{top:10px}.header{height:86px;margin:0 var(--margin);display:flex;align-items:center;justify-content:space-between;position:absolute;inset:0 0 auto;z-index:20}.brand{padding:0;display:block;position:relative}.brand img{width:126px;height:auto;display:block;opacity:0}.brand-fill{position:absolute;inset:0;overflow:hidden;-webkit-mask:url(assets/munir-wordmark-mask.png?h=4f79f85270) center/100% 100% no-repeat;mask:url(assets/munir-wordmark-mask.png?h=4f79f85270) center/100% 100% no-repeat;pointer-events:none}.brand-fill::before{content:'';position:absolute;inset:0;background:var(--ink)}.brand-fill>i{position:absolute;left:0;right:0;top:0;height:170%;background:var(--logo-gradient);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20Q25 4 50 20T100 20T150 20T200 20V40H0Z'/%3E%3C/svg%3E") 0 0/50% 12% repeat-x,linear-gradient(#000,#000) 0 100%/100% 88.4% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20Q25 4 50 20T100 20T150 20T200 20V40H0Z'/%3E%3C/svg%3E") 0 0/50% 12% repeat-x,linear-gradient(#000,#000) 0 100%/100% 88.4% no-repeat;transform:translateY(58.8%);transition:transform .55s cubic-bezier(.45,0,.25,1);animation:logo-wave .9s linear infinite paused}.brand:focus-visible .brand-fill>i,.brand.is-filled .brand-fill>i{transform:translateY(-12%);animation-play-state:running}@media(hover:hover){.brand:hover .brand-fill>i{transform:translateY(-12%);animation-play-state:running}}.brand-fill{transform-origin:50% 100%}.brand.is-jump .brand-fill{animation:logo-jump .72s cubic-bezier(.3,.6,.4,1)}@keyframes logo-jump{0%{transform:none}12%{transform:scale(1.14,.8)}34%{transform:translateY(-46%) scale(.9,1.14) rotate(calc(var(--jump-tilt,1)*-3deg))}52%{transform:translateY(-58%) scale(1.02,.98) rotate(calc(var(--jump-tilt,1)*4deg))}74%{transform:translateY(0) scale(1.16,.8)}86%{transform:translateY(-12%) scale(.96,1.05)}100%{transform:none}}.brand.is-super .brand-fill{animation:logo-super 1.1s cubic-bezier(.3,.6,.4,1)}@keyframes logo-super{0%{transform:none}12%{transform:scale(1.2,.72)}45%{transform:translateY(-70%) scale(.9,1.15) rotate(180deg)}70%{transform:translateY(-40%) rotate(360deg)}86%{transform:translateY(0) scale(1.18,.8) rotate(360deg)}100%{transform:rotate(360deg)}}.logo-burst{position:fixed;left:0;top:0;width:100vw;height:100vh;z-index:110;pointer-events:none}.logo-cheer{position:fixed;z-index:111;pointer-events:none;padding:9px 14px;border-radius:999px;background:var(--ink);color:var(--paper);font-size:12px;font-weight:600;white-space:nowrap;animation:logo-cheer 2.4s cubic-bezier(.2,.8,.2,1) both}@keyframes logo-cheer{0%{opacity:0;transform:translateY(-6px) scale(.6)}12%{opacity:1;transform:translateY(0) scale(1.06)}20%{transform:scale(1)}82%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-8px)}}@keyframes logo-wave{to{-webkit-mask-position:100% 0,0 100%;mask-position:100% 0,0 100%}}.brand:hover{transform:rotate(-2deg);transition:transform .25s}.study-label{font-size:8px;letter-spacing:.16em;color:#767168}.back{font-size:13px;padding:12px 0}.back span{font-size:22px;margin-left:14px}.in-story .header{position:fixed}.in-story .study-label{display:none}.menu{padding:86px var(--margin) 0;min-height:100svh;display:flex;flex-direction:column}.menu-intro{padding:20px 0 27px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:.25em;line-height:1.6}.menu h1{font-size:36px;letter-spacing:-.055em;font-weight:400;line-height:1.2;margin-top:12px}.choices{display:grid;grid-template-rows:repeat(3,minmax(140px,1fr));flex:1;border-top:1px solid var(--line)}.choice{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,21vw) 56px;align-items:center;column-gap:32px;text-align:left;border-bottom:1px solid var(--line);padding:26px 24px 16px;min-width:0}.choice::before{content:'';position:absolute;inset:4px -10px;background:var(--accent);z-index:-1;opacity:0;transform:scaleY(0);transform-origin:50% 100%;transition:opacity .15s,transform .5s cubic-bezier(.2,.75,.2,1)}.choice:hover::before,.choice:focus-visible::before{opacity:1;transform:none}.choice small{position:absolute;left:25px;top:12px;font-size:9px;color:#777167}.choice>.choice-title{justify-self:start;font-family:Oswald,'Arial Narrow',sans-serif;font-size:min(5.8vw,12.5vh,112px);font-weight:700;letter-spacing:-.055em;line-height:1.1;white-space:nowrap}.choice-note{font-style:normal;font-size:14px;line-height:1.45;color:#6c675e;max-width:250px;text-wrap:balance;transition:color .2s}.choice:hover .choice-note,.choice:focus-visible .choice-note{color:var(--ink)}.choice i{font-style:normal;font-size:44px;font-weight:400;line-height:1;justify-self:end;transition:transform .35s cubic-bezier(.2,.75,.2,1)}.choice:hover i,.choice:focus-visible i{transform:rotate(45deg)}.menu-footer{display:flex;justify-content:space-between;gap:25px;padding:23px 0;font-size:11px;line-height:1.5;color:#767168}.menu.leaving .choice::before{opacity:0!important;transition:none}.menu.leaving .choices{opacity:0;transition:opacity .25s}.scroll-track{height:500svh}.scene{position:sticky;top:0;height:100svh;min-height:550px;overflow:hidden}.scene-copy{position:absolute;top:115px;left:var(--margin);right:var(--margin);z-index:2;pointer-events:none}.scene-copy h1{font-size:clamp(28px,3.8vw,54px);font-weight:500;letter-spacing:-.055em;line-height:1.12;margin:13px 0 12px;max-width:850px;text-wrap:balance}.scene-copy>p:last-child{font-size:14px;line-height:1.5;color:#6c675e;max-width:650px}.canvas-wrap{position:absolute;inset:235px 0 86px}.canvas-wrap canvas{display:block;width:100%;height:100%}.stages{position:absolute;right:20px;top:48%;display:flex;flex-direction:column;gap:3px;z-index:5}.stages button{display:grid;place-items:center;width:42px;height:42px;padding:10px;border-radius:50%}.stages button::before{content:'';display:block;width:5px;height:5px;border-radius:50%;background:var(--ink);opacity:.25;transition:transform .25s,opacity .25s}.stages button[aria-current=step]::before{transform:scale(1.65);opacity:1}.stages button:hover{background:#14141209}.scene-footer{position:absolute;left:var(--margin);right:var(--margin);bottom:27px;display:flex;justify-content:space-between;align-items:center;gap:15px;min-height:45px;font-size:11px;color:#777167}.scroll-hint>span{display:inline-block;margin-left:18px;font-size:22px;color:var(--ink)}.stage-counter{font-variant-numeric:tabular-nums;font-size:11px}.ending{display:flex;gap:18px;align-items:center}.ending button{min-height:44px;padding:10px 0;font-size:12px;color:var(--ink)}.ending .other{background:var(--ink);color:var(--paper);padding:12px 18px}.ending button>span{margin-left:12px;font-size:18px}.progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:#14141209}.progress i{display:block;height:100%;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}.curtain{position:fixed;inset:0;z-index:80;pointer-events:all;overflow:hidden;--wave-w:640px;--wave-h:11vh;--c1:#ff4b25;--c2:#a9c77e;--c3:#141412}.curtain>i{position:absolute;left:-4%;right:-4%;top:0;height:135vh;display:block;background:var(--c);transform:translateY(105vh);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20Q25 4 50 20T100 20T150 20T200 20V40H0Z'/%3E%3C/svg%3E") 0 0/var(--wave-w) var(--wave-h) repeat-x,linear-gradient(#000,#000) 0 calc(var(--wave-h) - 1px)/100% calc(100% - 2 * var(--wave-h) + 2px) no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20Q25 36 50 20T100 20T150 20T200 20V0H0Z'/%3E%3C/svg%3E") 0 100%/var(--wave-w) var(--wave-h) repeat-x;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20Q25 4 50 20T100 20T150 20T200 20V40H0Z'/%3E%3C/svg%3E") 0 0/var(--wave-w) var(--wave-h) repeat-x,linear-gradient(#000,#000) 0 calc(var(--wave-h) - 1px)/100% calc(100% - 2 * var(--wave-h) + 2px) no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 20Q25 36 50 20T100 20T150 20T200 20V0H0Z'/%3E%3C/svg%3E") 0 100%/var(--wave-w) var(--wave-h) repeat-x;animation:liquid-pass 1.2s cubic-bezier(.6,0,.3,1) both,liquid-wave 1s linear infinite}.curtain>i:nth-child(1){--c:var(--c1)}.curtain>i:nth-child(2){--c:var(--c2);animation-delay:.08s,0s;animation-direction:normal,reverse}.curtain>i:nth-child(3){--c:var(--c3);animation-delay:.16s,0s}.curtain-logo{position:absolute;left:50%;top:67.5vh;width:min(48vw,440px);aspect-ratio:912/232;translate:-50% -50%;background:#fff;-webkit-mask:url(assets/munir-wordmark-mask.png?h=4f79f85270) center/contain no-repeat;mask:url(assets/munir-wordmark-mask.png?h=4f79f85270) center/contain no-repeat;animation:liquid-logo 1.2s .16s cubic-bezier(.3,1.4,.5,1) both}@keyframes liquid-pass{0%{transform:translateY(105vh)}46%,56%{transform:translateY(-17.5vh)}100%{transform:translateY(-142vh)}}@keyframes liquid-wave{to{-webkit-mask-position:var(--wave-w) 0,0 calc(var(--wave-h) - 1px),calc(-1 * var(--wave-w)) 100%;mask-position:var(--wave-w) 0,0 calc(var(--wave-h) - 1px),calc(-1 * var(--wave-w)) 100%}}@keyframes liquid-logo{0%,22%{scale:.55;opacity:0;rotate:-8deg}44%{scale:1.08;opacity:1;rotate:3deg}54%{scale:.97;rotate:-1deg}62%,100%{scale:1;opacity:1;rotate:0deg}}.transitioning{overflow:hidden}@keyframes cover{0%{transform:translateY(105%)}43%,60%{transform:translateY(0)}100%{transform:translateY(-105%)}}
@media(min-width:701px) and (max-height:800px){.header{height:70px}.menu{padding-top:70px}.menu-intro{padding:12px 0 21px}.menu h1{font-size:30px;margin-top:10px}.menu-footer{padding:17px 0}.scene-copy{top:92px}.scene-copy h1{font-size:38px;margin:10px 0}.canvas-wrap{inset:200px 0 75px}.scene-footer{bottom:18px}}
@media(min-width:701px) and (max-width:1000px){.choice{grid-template-columns:minmax(0,1fr) 44px;grid-template-rows:auto auto;row-gap:10px}.choice>.choice-title{font-size:min(8vw,12vh)}.choice-note{grid-row:2;grid-column:1}.choice i{grid-column:2;grid-row:1/3}}
@media(max-width:700px){.curtain{--wave-w:320px;--wave-h:7vh}:root{--margin:6vw}.header{height:78px}.brand img{width:108px}.study-label{font-size:6px;max-width:120px;text-align:right}.back{font-size:11px}.back span{margin-left:6px;font-size:18px}.menu{padding-top:78px}.menu-intro{padding:20px 0 26px}.menu h1{font-size:30px}.eyebrow{font-size:8px}.choices{grid-template-rows:repeat(3,minmax(150px,1fr))}.choice{grid-template-columns:minmax(0,1fr) 30px;grid-template-rows:auto auto;row-gap:8px;column-gap:12px;padding:30px 10px 18px;align-content:center}.choice small{left:11px;top:13px;font-size:8px}.choice::before{inset:4px -7px}.choice>.choice-title{font-size:min(10.6vw,58px);white-space:normal;line-height:1.02;grid-column:1}.choice-note{grid-column:1;grid-row:2;font-size:12px;max-width:290px}.choice i{font-size:29px;grid-column:2;grid-row:1}.menu-footer{font-size:10px;padding:20px 0 25px;max-width:285px}.menu-footer>span:last-child{display:none}.scene{min-height:520px}.scene-copy{top:104px}.scene-copy h1{font-size:32px;line-height:1.1;margin:12px 0}.scene-copy>p:last-child{font-size:12px;max-width:310px}.canvas-wrap{inset:238px 0 130px}.stages{top:auto;right:50%;transform:translateX(50%);bottom:69px;flex-direction:row;gap:4px}.scene-footer{bottom:15px;font-size:10px;min-height:45px}.stage-counter{font-size:10px}.ending{gap:15px}.ending button{font-size:10px}.ending .other{padding:10px 12px}.ending button>span{margin-left:7px;font-size:14px}.scene-footer:has(.ending:not([hidden])) .stage-counter{display:none}.in-story:has(.ending:not([hidden])) .scroll-hint{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.curtain{display:none!important}.brand:hover{transform:none}}