.op-page{--op-ground: #1c1c1c;--op-tile: #242424;--op-ink: #242424;--op-on-fill: #f3f2f2;--op-link: #0099ff;--op-pill: #efefef;--op-radius: 16px;--op-gutter: 16px;--op-gap: 12px;--op-cols: 2;--op-max: 1200px;--op-reserve: 150px;--op-fast: .12s;--op-default: .24s;--op-slow: .32s;--op-ease-out: cubic-bezier(0, 0, .2, 1);--op-ease-emph: cubic-bezier(.2, 0, 0, 1);position:absolute;inset:0;container-type:inline-size;overflow-y:auto;overscroll-behavior:contain;background:var(--op-ground);color:#fff;font-family:Space Grotesk Variable,Space Grotesk,system-ui,sans-serif;font-weight:500;-webkit-font-smoothing:antialiased;padding:0 var(--op-gutter) 120px}@media(min-width:640px){.op-page{--op-gutter: 24px;--op-gap: 16px;--op-cols: 4;--op-reserve: 132px}}@media(min-width:1024px){.op-page{--op-gutter: 32px;--op-gap: 24px;--op-reserve: 176px}}.op-header{display:flex;flex-direction:column;align-items:center;padding-top:84px}.op-date{margin:0;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;color:#ffffffb8}.op-name{margin:28px 0 44px;font-size:clamp(56px,12vw,96px);font-weight:600;line-height:1.2;letter-spacing:-.01em;text-wrap:balance}@media(min-width:1200px){.op-header{padding-top:108px}.op-date{position:absolute;top:24px;right:48px;font-size:20px;color:#fff}.op-name{margin:0 0 80px}}.op-grid{--op-cell: calc((min(100cqw, var(--op-max)) - (var(--op-cols) - 1) * var(--op-gap)) / var(--op-cols));display:grid;grid-template-columns:repeat(var(--op-cols),1fr);grid-template-rows:minmax(var(--op-cell),auto);grid-auto-rows:var(--op-cell);gap:var(--op-gap);max-width:var(--op-max);margin:0 auto}.op-bio,.op-tile-instant,.op-tile-flipkit,.op-tile-blueprint,.op-tile-wfoc{grid-column:span 2}.op-tile-instant,.op-tile-flipkit,.op-tile-blueprint,.op-tile-wfoc,.op-tile-pieces,.op-tile-slowly{grid-row:span 2}.op-tile-glyph{grid-column:1 / -1;grid-row:span 2}@media(min-width:640px){.op-tile-instant{grid-column:3 / span 2;grid-row:1 / span 2}}@media(min-width:1024px){.op-tile-slowly{grid-row:span 1}.op-tile-glyph{grid-column:auto;grid-row:span 1}}.op-bio{display:flex;flex-direction:column;justify-content:center;gap:24px;padding:24px;border-radius:var(--op-radius);background:#fff;color:var(--op-ink);font-size:17px;line-height:1.25}.op-bio p{margin:0;text-wrap:pretty}.op-bio a{color:var(--op-link);text-decoration:none;border-radius:2px;transition:color var(--op-fast) var(--op-ease-out)}.op-bio a:hover{color:#07c}@media(min-width:640px){.op-bio{padding:clamp(18px,2.8vw,34px);font-size:clamp(14px,1.45vw,20px);line-height:1.2}}.op-socials,.op-paintings{position:relative;overflow:hidden;border-radius:var(--op-radius);background:#fff}.op-label{position:absolute;top:6%;left:50%;translate:-50% 0;z-index:1;padding:.4em 1.1em;border-radius:999px;background:var(--op-pill);color:#1c1c1c;font-size:clamp(14px,1.45vw,20px);line-height:1.2;white-space:nowrap}.op-social{position:absolute;color:#000;border-radius:6px;transition:rotate var(--op-fast) var(--op-ease-out),scale var(--op-fast) var(--op-ease-out)}.op-social svg{display:block;width:100%;height:auto}.op-social-instagram{left:5%;top:29%;width:26%;rotate:-9deg}.op-social-linkedin{left:68%;top:37%;width:25%;rotate:6deg}.op-social-mail{left:35%;top:65%;width:24%;rotate:-3deg}.op-social:hover,.op-social:focus-visible{rotate:0deg;scale:1.06}.op-paintings img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:scale var(--op-slow) var(--op-ease-emph)}.op-paintings:hover img{scale:1.04}.op-tile{position:relative;display:block;overflow:hidden;border-radius:var(--op-radius);background:var(--op-tile);color:var(--op-on-fill);text-decoration:none;isolation:isolate;transition:background-color var(--op-default) var(--op-ease-out),scale var(--op-fast) var(--op-ease-out)}.op-tile:active{scale:.99}.op-media{position:absolute;inset:0;overflow:hidden;border-radius:var(--op-radius);background:var(--op-tile);transition:inset var(--op-slow) var(--op-ease-emph),border-radius var(--op-slow) var(--op-ease-emph)}.op-media img,.op-media video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}.op-tile-instant .op-media{background:#fdda79}.op-tile-instant .op-media img{inset:0;margin:auto;width:87%;height:auto;object-fit:contain}.op-tile-blueprint .op-media img{inset:9% auto auto 9%;width:138%;height:auto;border-top-left-radius:12px}.op-tile-pieces .op-media img{inset:14% auto auto -62%;width:175%;height:auto}.op-corner{position:absolute;top:clamp(16px,6%,36px);right:clamp(16px,6%,36px);z-index:1;display:flex;align-items:center;gap:12px}.op-tag,.op-arrow{background:#00000038;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);color:#fff}.op-tag{padding:8px 16px;border-radius:999px;font-size:15px;line-height:1.2;white-space:nowrap;opacity:0;translate:4px 0;transition:opacity var(--op-default) var(--op-ease-out),translate var(--op-default) var(--op-ease-out)}.op-arrow{display:grid;place-items:center;width:41px;height:41px;border-radius:999px}.op-arrow svg{transition:translate var(--op-fast) var(--op-ease-out)}.op-caption{position:absolute;top:calc(100% - var(--op-tile-reserve) + 16px);left:24px;right:24px;opacity:0;translate:0 8px;transition:opacity var(--op-fast) var(--op-ease-out),translate var(--op-fast) var(--op-ease-out)}.op-caption h2{margin:0;font-size:clamp(26px,3.3vw,40px);font-weight:500;line-height:1.2;text-wrap:balance}.op-caption p{max-width:300px;margin:6px 0 0;font-size:clamp(14px,1.4vw,16px);line-height:1.2;text-wrap:pretty}.op-tile{--op-tile-reserve: var(--op-reserve)}@media(min-width:1024px){.op-tile-slowly,.op-tile-glyph{--op-tile-reserve: calc(var(--op-reserve) - 24px)}.op-tile-slowly .op-caption h2,.op-tile-glyph .op-caption h2{font-size:clamp(22px,2.4vw,32px)}.op-tile-slowly .op-caption p,.op-tile-glyph .op-caption p{font-size:14px}}.op-tile:focus-visible{outline:2px solid var(--op-link);outline-offset:4px}.op-tile:is(:hover,:focus-visible){background:var(--op-fill)}.op-tile:is(:hover,:focus-visible) .op-media{inset:12px 12px var(--op-tile-reserve) 12px;border-radius:10px}.op-tile:is(:hover,:focus-visible) .op-tag{opacity:1;translate:0 0}.op-tile:is(:hover,:focus-visible) .op-arrow svg{translate:2px -2px}.op-tile:is(:hover,:focus-visible) .op-caption{opacity:1;translate:0 0;transition-duration:var(--op-default);transition-delay:60ms}@media(hover:none){.op-tile{background:var(--op-fill)}.op-tile .op-media{inset:10px 10px var(--op-tile-reserve) 10px;border-radius:10px}.op-tile .op-tag,.op-tile .op-caption{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){.op-page *{transition-duration:0ms!important;transition-delay:0ms!important}}