.h8.stage{opacity:0}.h8.stage.on{animation:.62s forwards h8-in}@keyframes h8-in{to{opacity:1}}@media (prefers-reduced-motion:reduce){.h8.stage{opacity:1;animation:none}}.px.h8nav{z-index:60;-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--hair-soft);background:#000000b8;position:fixed;top:0;left:0;right:0}.h8nav .nav-in{align-items:center;gap:20px;padding:17px 26px;display:flex}@media (max-width:640px){.h8nav .nav-in{padding:15px 18px}.h8nav .hide-sm{display:none}}.h8nav .mark{letter-spacing:.02em;margin-right:auto;font-size:14px;font-weight:600;text-decoration:none;color:var(--thread)!important}.h8nav a{color:var(--thread-2);letter-spacing:.06em;font-size:13px;text-decoration:none}.h8nav a:hover{color:var(--thread)}.h8nav .cta{background:var(--thread);border-radius:4px;padding:9px 15px;font-size:13px;font-weight:600;color:var(--ground)!important}.h8 .plate{padding-top:calc(64px + 2vh);overflow:hidden}.h8 .plate .word{margin-top:2vh;margin-bottom:-.24em}.h8.stage.on .wh.top{animation:1.1s cubic-bezier(.16,1,.3,1) both h8-settle-l}.h8.stage.on .wh.bot{animation:1.1s cubic-bezier(.16,1,.3,1) both h8-settle-r}@keyframes h8-settle-l{0%{translate:-4vw}to{translate:0}}@keyframes h8-settle-r{0%{translate:4vw}to{translate:0}}.h8 .about{padding-top:clamp(30px,5vh,60px);padding-bottom:clamp(70px,11vh,140px)}@media (min-width:900px){.h8 .about{grid-template-columns:1fr auto;align-items:start;gap:40px;display:grid}.h8 .about .copy{grid-area:1/1}.h8 .about .who{text-align:right;grid-area:1/2}}.h8 .who{margin-bottom:34px}.h8 .work{padding-top:clamp(60px,9vh,110px);padding-bottom:clamp(70px,11vh,130px)}.h8 .statement{border-top:1px solid var(--hair-soft);padding-top:18vh;padding-bottom:22vh}.h8 .case{border-top:1px solid var(--hair-soft);position:relative}.h8 .stagebox{will-change:transform;height:100vh;position:absolute;top:0;left:0;right:0;overflow:hidden}.h8 .caseinner{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:4vw;height:100%;padding-top:70px;display:grid}@media (max-width:900px){.h8 .caseinner{grid-template-rows:auto 1fr;grid-template-columns:1fr;gap:18px;padding-top:80px;padding-bottom:20px}}.h8 .chapters{min-height:46vh;position:relative}@media (max-width:900px){.h8 .chapters{min-height:30vh}}.h8 .chap{opacity:0;pointer-events:none;transition:opacity .52s,transform .7s cubic-bezier(.16,1,.3,1);position:absolute;top:34px;left:0;right:0;transform:translateY(24px)}.h8 .chap.on{opacity:1;transform:none}.h8 .chap .num{font-family:var(--mono);letter-spacing:.2em;color:var(--thread-dim);margin:0 0 18px;font-size:12px}.h8 .chap h3{letter-spacing:-.045em;margin:0 0 18px;font-size:clamp(32px,4.4vw,72px);font-weight:900;line-height:.96}.h8 .chap .body{color:var(--thread-2);max-width:34ch;margin:0;font-size:clamp(17px,1.5vw,22px);line-height:1.45}.h8 .caseend{position:absolute;bottom:0;left:0;right:0}.h8 .caseend .track{background:var(--hair);height:1px;display:block}.h8 .caseend .fill{background:var(--thread);transform-origin:0;height:1px;display:block;transform:scaleX(0)}.h8 .device{border:1px solid var(--hair);background:#0b0b0c;border-radius:12px;flex-direction:column;height:min(72vh,640px);display:flex;overflow:hidden;box-shadow:0 40px 120px #0009}@media (max-width:900px){.h8 .device{height:100%}}.h8 .device .screen{background:#fff;flex:1;position:relative;overflow:hidden}.h8 .device iframe{transform-origin:0 0;pointer-events:none;will-change:transform;border:0;width:1440px;height:15600px;position:absolute;top:0;left:0}.h8 .caseopen{opacity:0;pointer-events:none;justify-content:flex-end;transition:opacity .5s;display:flex;position:absolute;bottom:4vh;left:0;right:0}.h8 .caseopen.on{opacity:1;pointer-events:auto}.h8 .caseopen .frame{aspect-ratio:auto;background:0 0;border:0;width:auto;max-width:none;overflow:visible}.h8 .caseopen .frame .chrome,.h8 .caseopen .frame .view{display:none}.h8 .caseopen .frame .go{padding:14px 20px;font-size:15px;display:inline-block;position:static}.h8 .caseopen .frame:hover{transform:none}.h8 .h8foot{border-top:0;padding:0}.h8 .fbottom{padding-top:34px;padding-bottom:34px}.i9 .ending{border-top:1px solid var(--hair-soft)}
