:root{--bg: #ffffff;--ink: #212529;--head: #000;--grey: rgba(0, 0, 0, .4);--line: rgba(0, 0, 0, .12);--tile: #111111;--tile-ink: #ffffff;--pill: rgba(200, 200, 200, .63);--navc: #898989}*{box-sizing:border-box;margin:0}body{background:var(--bg);color:var(--ink);font:500 16px/1.5 Manrope,sans-serif}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:8px}.wrap{max-width:1200px;margin:0 auto;padding:0 32px}nav{position:sticky;top:0;z-index:10}nav .wrap{display:flex;justify-content:space-between;align-items:center;height:80px}.logo{width:40px;height:40px;border-radius:50%;background:#000;color:#fff;display:grid;place-items:center;font:900 16px Nunito}.links{display:flex;gap:8px;background:color-mix(in srgb,var(--bg) 75%,transparent);backdrop-filter:blur(8px);border-radius:100px}.links a{font:700 18px Manrope;color:var(--navc);padding:8px 16px;border-radius:100px}.links a.on{color:var(--head);background:var(--pill)}.links a:hover{color:var(--head)}@media(max-width:900px){.links a{font-size:16px;padding:8px 12px}.wrap{padding:0 20px}}.hero{display:grid;grid-template-columns:1fr 300px;padding-top:40px}.hero-l{padding:64px 48px 48px 0;border-right:1px solid var(--line);min-width:0}h1{font:900 64px/1.2 Nunito,sans-serif;letter-spacing:-.01em;color:var(--head)}.rot{display:grid;margin-top:4px}.rot h2{grid-area:1 / 1;font:800 64px/1.2 Manrope,sans-serif;letter-spacing:-.02em;color:var(--grey);opacity:0;filter:blur(12px);transition:opacity .8s,filter .8s}.rot h2.on{opacity:1;filter:none}.now{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:72px}.now h3,.side h3{font:700 20px/1.5 Manrope,sans-serif;color:var(--head)}.now p,.side p{font:600 20px/1.6 Manrope,sans-serif;color:var(--grey)}.side{padding:64px 0 48px 40px;display:flex;flex-direction:column;justify-content:center}.social{display:flex;gap:16px;margin-top:22px}.social a{display:block}.social svg{width:24px;height:24px;fill:var(--ink);display:block}.grid{display:grid;grid-template-columns:1fr 1fr;gap:72px 32px;padding:64px 0 96px}.card{display:block;min-width:0}.media{position:relative;aspect-ratio:457 / 297;border-radius:12px;overflow:hidden;background:var(--tile)}.media video,.media img{position:absolute;display:block;border-radius:8px;box-shadow:0 12px 32px -12px #00000059;transition:transform .5s cubic-bezier(.2,.7,.2,1)}.card:hover .media video,.card:hover .media img{transform:translateY(-6px)}.bleed{left:10%;top:12%;width:100%}.center{left:50%;top:50%;width:80%;translate:-50% -50%}.phone{left:50%;top:8%;height:130%;translate:-50% 0;border-radius:14px!important}.media .fill{inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;box-shadow:none}.card:hover .media .fill{transform:none}.pair{display:flex;gap:4%;position:absolute;inset:14% 8% auto}.pair img{position:static;width:48%;aspect-ratio:1;object-fit:cover}.type{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:0 8%;font:800 clamp(32px,4vw,52px)/1.05 Manrope,sans-serif;letter-spacing:-.03em;color:var(--tile-ink)}.card h3{font:700 24px/1.2 Manrope,sans-serif;margin-top:24px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:var(--head)}.badge{font:700 13px/1 Manrope,sans-serif;letter-spacing:.01em;text-transform:uppercase;color:var(--grey);border:1.5px solid var(--line);border-radius:100px;padding:4px 10px}.card p{color:var(--grey);line-height:1.7;margin-top:12px}.meta{font-weight:700;margin-top:14px}footer{border-top:1px solid var(--line);padding:32px 0 48px;color:var(--grey);font-weight:600}@media(max-width:900px){.hero{grid-template-columns:1fr}.hero-l{border:0;padding:32px 0 0}.side{padding:40px 0 0}h1,.rot h2{font-size:44px}.now{margin-top:40px}.grid{grid-template-columns:1fr;gap:56px}}@media(max-width:480px){h1,.rot h2{font-size:36px}.now{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.rot h2{transition:none}.media video,.media img{transition:none}}.writeup{max-width:760px;padding-top:48px;padding-bottom:96px}.back{display:inline-block;font-weight:700;color:var(--grey)}.back:hover{color:var(--head)}.writeup h1{font:800 48px/1.15 Manrope,sans-serif;letter-spacing:-.02em;margin-top:24px}.lede{font:600 20px/1.6 Manrope,sans-serif;color:var(--grey);margin-top:16px}.tags{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 40px}.tags li{font:700 13px/1 Manrope,sans-serif;color:var(--grey);border:1.5px solid var(--line);border-radius:100px;padding:6px 12px}.media.full{aspect-ratio:auto;display:flex;justify-content:center;padding:32px 0}.media.full video{position:static;max-height:640px;max-width:100%}.body h2{font:700 24px/1.3 Manrope,sans-serif;color:var(--head);margin-top:48px}.body p,.body ul{font-size:18px;line-height:1.75;margin-top:14px}.body ul{padding-left:1.2em}.body li+li{margin-top:8px}.body code{font-size:.9em;background:#0000000f;padding:2px 6px;border-radius:6px}.gh{display:inline-block;margin-top:56px;background:#000;color:#fff;font:700 18px Manrope,sans-serif;padding:16px 28px;border-radius:100px}.gh:hover{background:#333}@media(max-width:480px){.writeup h1{font-size:36px}}
