.portfolio-index{width:100%;max-width:var(--site-max);background:var(--color-background-page);align-items:stretch;height:100dvh;margin-inline:auto;display:flex;overflow:hidden}.portfolio-index[data-touch-scroll=true],.portfolio-index[data-touch-scroll=true] .portfolio-index__pane--rail{touch-action:pan-y}.portfolio-index__pane{min-width:0;height:100%;min-height:0}.portfolio-index__pane--rail{z-index:1;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex:0 0 min(454px,42%);position:relative;overflow:hidden scroll}.portfolio-index__pane--rail::-webkit-scrollbar{display:none}.portfolio-index__pane-content{flex-direction:column;min-height:100%;display:flex}.portfolio-index__pane--stage{box-sizing:border-box;background:var(--color-background-page);touch-action:none;flex:auto;height:100%;padding:clamp(12px,2vw,24px);display:flex;overflow:hidden}.portfolio-index__well-inner,.portfolio-index__device,.portfolio-index__well-inner video,.portfolio-index__well-inner iframe,.portfolio-index__well-inner img{pointer-events:none}.portfolio-index__headline{box-sizing:border-box;flex-shrink:0;align-items:center;min-height:84px;padding:20px clamp(16px,3vw,24px) 8px;display:flex}.portfolio-index__intro{box-sizing:border-box;flex-direction:column;gap:24px;padding:8px clamp(16px,3vw,24px) 0;display:flex}.portfolio-index__rail{box-sizing:border-box;flex-direction:column;gap:24px;padding:24px clamp(16px,3vw,24px) 32px;display:flex}.portfolio-index__bio{font-variation-settings:var(--font-var-body);color:var(--color-text-primary);text-wrap:pretty;margin:0;font-size:16px;font-weight:400;line-height:1.5}.portfolio-index__bio-link{color:inherit;text-underline-offset:.14em;text-decoration:underline;text-decoration-thickness:1px}.portfolio-index__bio-link:hover{opacity:.72}.portfolio-index__bio-link:focus-visible,.portfolio-index__link:focus-visible,.portfolio-index__item:focus-visible,.portfolio-index__well-cta:focus-visible,.portfolio-index__well-device:focus-visible,.portfolio-index__modal-close:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px;border-radius:2px}.portfolio-index__links{box-sizing:border-box;flex-wrap:wrap;align-items:center;gap:16px;margin-top:auto;padding:8px clamp(16px,3vw,24px) 32px;display:flex}.portfolio-index__link{color:var(--color-text-primary);font-size:14px;line-height:1.4;text-decoration:none}.portfolio-index__link:hover{text-underline-offset:.14em;text-decoration:underline}.portfolio-index__section{flex-direction:column;gap:24px;display:flex}.portfolio-index__heading{font-variation-settings:var(--font-var-heading);color:var(--color-text-primary);margin:0;font-size:16px;font-weight:400;line-height:1.2}.portfolio-index__year-row{align-items:flex-start;gap:24px;display:flex}.portfolio-index__year{width:41px;color:var(--color-text-primary);opacity:.4;flex-shrink:0;margin:0;font-size:14px;line-height:1.4}.portfolio-index__items{flex-direction:column;gap:12px;min-width:0;display:flex}.portfolio-index__item{width:fit-content;max-width:100%;font:inherit;color:var(--color-text-primary);text-align:left;cursor:pointer;touch-action:pan-y;opacity:.42;transition:opacity var(--transition-fast);background:0 0;border:0;margin:0;padding:0;font-size:14px;line-height:1.4;text-decoration:none;display:block}.portfolio-index__item.is-active,.portfolio-index__item:hover{opacity:1}.portfolio-index__well{box-sizing:border-box;border-radius:clamp(16px,2vw,24px);flex-direction:column;align-items:stretch;width:100%;height:100%;min-height:100%;padding:0;transition:background-color .56s cubic-bezier(.22,1,.36,1);display:flex;position:relative;overflow:hidden}.portfolio-index__well-bar{box-sizing:border-box;flex-wrap:nowrap;flex-shrink:0;justify-content:space-between;align-items:flex-start;gap:clamp(16px,2.4vw,48px);padding:clamp(20px,4vw,48px);display:flex}.portfolio-index__well-summary{font-variation-settings:var(--font-var-heading);min-width:0;max-width:34rem;font-size:clamp(16px,1.8vw,24px);font-weight:var(--font-weight-medium);color:var(--color-text-primary);text-wrap:pretty;flex:0 34rem;margin:0;line-height:1.333}.portfolio-index__well-cta{border-radius:var(--border-radius-pill);background:var(--color-surface-elevated);color:var(--color-text-primary);font-variation-settings:var(--font-var-heading);font-size:16px;font-weight:var(--font-weight-semibold);white-space:nowrap;box-shadow:var(--shadow-pill);flex-shrink:0;justify-content:center;align-self:flex-start;align-items:center;gap:12px;padding:8px 16px;line-height:1.5;text-decoration:none;display:inline-flex}.portfolio-index__well-cta:hover{opacity:.72}.portfolio-index__well-cta svg{flex-shrink:0;display:block}.portfolio-index__well-stage{box-sizing:border-box;flex:auto;width:100%;min-width:0;min-height:0;padding:0 clamp(8px,1.8vmin,20px) clamp(8px,1.8vmin,20px);position:relative}.portfolio-index__well--phone{container:index-phone-well/size}.portfolio-index__well--phone .portfolio-index__well-inner{align-items:flex-start;container-type:normal}.portfolio-index__well--phone .portfolio-index__well-stage{padding:0;overflow:hidden}.portfolio-index__well--phone .portfolio-index__dissolve{align-items:flex-start}.portfolio-index__well-device{width:100%;min-width:0;height:100%;min-height:0;color:inherit;text-decoration:none;display:block;position:relative}.portfolio-index__dissolve{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.portfolio-index__dissolve--in{animation:.58s cubic-bezier(.22,1,.36,1) both index-preview-in}.portfolio-index__dissolve--out{animation:.38s both index-preview-out}@keyframes index-preview-in{0%{opacity:0;filter:blur(18px)}to{opacity:1;filter:blur()}}@keyframes index-preview-out{0%{opacity:1;filter:blur()}to{opacity:0;filter:blur(14px)}}@media (prefers-reduced-motion:reduce){.portfolio-index__well{transition:none}.portfolio-index__dissolve--in,.portfolio-index__dissolve--out{animation:none}}.portfolio-index__well-inner{justify-content:center;align-items:center;width:100%;min-width:0;height:100%;min-height:0;display:flex;container:index-preview/size}.portfolio-index__preview-slot{justify-content:center;align-items:center;width:100%;min-width:0;height:100%;min-height:0;display:flex}.portfolio-index__well--phone .portfolio-index__preview-slot{align-items:flex-start}.portfolio-index__preview-slot>*{max-width:100%;max-height:100%}.portfolio-index__preview-slot>.portfolio-index__device--desktop,.portfolio-index__preview-slot>.portfolio-index__device--phone,.portfolio-index__preview-slot>.portfolio-index__phone-stack{max-height:none}.portfolio-index__phone-stack{--index-phone-stack-gap:48px;justify-content:center;align-items:flex-start;gap:var(--index-phone-stack-gap);flex-direction:row;width:100%;min-width:0;height:100%;min-height:0;display:flex}.portfolio-index__well-inner .phone-stencil,.portfolio-index__well-inner .phone-stencil--card,.portfolio-index__preview-slot>.portfolio-index__device--phone{--phone-size-scale:1;--content-ar:var(--phone-default-ar);--index-phone-ar:calc(var(--phone-body-scale) / (1 / var(--phone-default-ar) + 2 * var(--phone-bezel-ratio)));--index-phone-well-height:calc(886 / 905);width:min(100cqw, calc(100cqh * var(--index-phone-well-height) * var(--index-phone-ar)));height:auto;aspect-ratio:var(--index-phone-ar);max-width:100%}.portfolio-index__well-inner .portfolio-index__phone-stack .phone-stencil,.portfolio-index__well-inner .portfolio-index__phone-stack .phone-stencil--card,.portfolio-index__preview-slot .portfolio-index__phone-stack .portfolio-index__device--phone{--phone-size-scale:.75;width:min(calc((100cqw - var(--index-phone-stack-gap)) / 2), calc(100cqh * var(--index-phone-well-height) * var(--index-phone-ar) * .75));margin-inline:0}.portfolio-index__phone-stack .phone-stencil__body,.portfolio-index__phone-stack .phone-stencil--card .phone-stencil__body{box-shadow:inset 0 0 0 calc(var(--body-w) * .0034) #ffffff24, inset 0 0 0 calc(var(--body-w) * .007) #00000073, 0 0 0 calc(var(--body-w) * .0016) #ffffff14, 0 0 0 calc(var(--body-w) * .0028) #0000008c}.portfolio-index__well-inner .phone-stencil--card .phone-stencil__body{--content-ar:var(--phone-default-ar);width:100%;max-width:100%;height:auto;max-height:100%}.portfolio-index__well-inner .phone-stencil--card .phone-stencil__screen{width:100%;height:auto;aspect-ratio:var(--phone-default-ar);max-width:100%}.portfolio-index__well-inner .phone-stencil__media{object-fit:cover}.portfolio-index__well-inner .browser-stencil__media,.portfolio-index__well-inner .browser-stencil__screen .lazy-video--intrinsic .lazy-video__el,.portfolio-index__well-inner .browser-stencil__screen .lazy-video--intrinsic .lazy-video__poster{object-fit:contain;object-position:center}.portfolio-index__preview-slot .portfolio-index__device--desktop.browser-stencil,.portfolio-index__preview-slot .browser-stencil.portfolio-index__device--desktop{width:min(100%, calc((100cqh - var(--browser-chrome)) * var(--content-ar)));box-sizing:border-box;max-width:100%;height:auto;max-height:100%}.portfolio-index__preview-slot .portfolio-index__device--desktop .browser-stencil__screen{aspect-ratio:auto;flex:none;width:100%;height:auto}.portfolio-index__image-wrap{width:min(100cqw,149.9cqh);max-height:100%}.portfolio-index__image,.portfolio-index__image--fill{object-fit:cover;border-radius:12px;width:100%;height:auto;max-height:100%}.portfolio-index__specimen{text-align:center;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:clamp(8px,2cqh,16px);padding:clamp(16px,4cqmin,32px);display:flex}@media (min-width:901px){.portfolio-index__preview-slot .portfolio-index__device--desktop.browser-stencil,.portfolio-index__preview-slot .browser-stencil.portfolio-index__device--desktop{width:min(80%, calc((100cqh - var(--browser-chrome)) * var(--content-ar)));max-width:80%}}.portfolio-index__specimen-word{font-variation-settings:var(--font-var-display);letter-spacing:-.04em;color:var(--color-text-primary);margin:0;font-size:clamp(32px,min(18cqw,22cqh),88px);line-height:1}.portfolio-index__specimen-meta{color:var(--color-text-secondary);margin:0;font-size:clamp(12px,2.4cqw,14px);line-height:1.4}@media (max-width:900px){.portfolio-index{flex-direction:column}.portfolio-index__pane--rail{flex:auto;order:0;width:100%;height:100%;min-height:0}.portfolio-index__pane--stage{display:none}.portfolio-index__headline{min-height:68px;padding:16px var(--site-gutter) 0}.portfolio-index__intro{padding:16px var(--site-gutter) 0}.portfolio-index__rail{padding:24px var(--site-gutter) 16px}.portfolio-index__links{padding:8px var(--site-gutter) 32px}.portfolio-index__well{border-radius:20px}.portfolio-index__well-bar{align-items:flex-start;gap:12px;padding:clamp(16px,4vw,24px)}.portfolio-index__well-summary{flex:auto;max-width:none;font-size:16px}.portfolio-index__well-cta{gap:8px;padding:6px 12px;font-size:14px}.portfolio-index__well-cta svg{width:16px;height:16px}}@media (max-width:600px){.portfolio-index__year-row{gap:16px}}.portfolio-index__modal{box-sizing:border-box;background:0 0;border:0;width:100%;max-width:100%;height:100%;max-height:100%;margin:0;padding:0;inset:0;overflow:hidden}.portfolio-index__modal[open]{animation:.42s cubic-bezier(.22,1,.36,1) both index-modal-in}.portfolio-index__modal[open]::backdrop{background:var(--color-overlay);animation:.42s cubic-bezier(.22,1,.36,1) both index-modal-backdrop-in}.portfolio-index__modal.is-leaving{animation:.28s both index-modal-out}.portfolio-index__modal.is-leaving::backdrop{animation:.28s both index-modal-backdrop-out}@keyframes index-modal-in{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes index-modal-out{0%{opacity:1;transform:none}to{opacity:0;transform:translateY(12px)}}@keyframes index-modal-backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes index-modal-backdrop-out{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.portfolio-index__modal[open],.portfolio-index__modal[open]::backdrop,.portfolio-index__modal.is-leaving,.portfolio-index__modal.is-leaving::backdrop{animation:none}}.portfolio-index__modal-frame{flex-direction:column;width:100%;height:100%;min-height:0;display:flex;position:relative}.portfolio-index__modal-close{top:max(12px, env(safe-area-inset-top));z-index:3;width:40px;height:40px;color:var(--color-text-primary);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;margin:0;padding:0;display:inline-flex;position:absolute;left:12px}.portfolio-index__modal-close:hover{opacity:.72}.portfolio-index__modal-well{background:var(--color-background-page);flex:auto;height:100%;min-height:0;overflow:hidden}.portfolio-index__modal-well .portfolio-index__well{border-radius:0;height:100%;min-height:100%}.portfolio-index__modal-well .portfolio-index__well-bar{flex-direction:column;justify-content:flex-start;align-items:stretch;gap:16px;padding:72px 20px 24px;position:relative}.portfolio-index__modal-well .portfolio-index__well-summary{flex:0 auto;max-width:none;font-size:18px;line-height:1.35}.portfolio-index__modal-well .portfolio-index__well-cta{top:max(16px, env(safe-area-inset-top));padding:8px 16px;font-size:16px;position:absolute;right:16px}.portfolio-index__modal-well .portfolio-index__well-stage{padding:12px 16px 28px}.portfolio-index__modal-well .portfolio-index__well--phone .portfolio-index__well-stage{padding:8px 16px 16px}.portfolio-index__modal-well .portfolio-index__well--phone .portfolio-index__well-inner{container:index-preview/size}.portfolio-index__modal-well .phone-stencil,.portfolio-index__modal-well .phone-stencil--card,.portfolio-index__modal-well .portfolio-index__device--phone{--index-phone-well-height:1;width:min(100cqw, calc(100cqh * var(--index-phone-ar)))}.portfolio-index__modal-well .portfolio-index__phone-stack .phone-stencil,.portfolio-index__modal-well .portfolio-index__phone-stack .phone-stencil--card,.portfolio-index__modal-well .portfolio-index__phone-stack .portfolio-index__device--phone{width:min(calc((100cqw - var(--index-phone-stack-gap,48px)) / 2), calc(100cqh * var(--index-phone-ar) * .75));margin-inline:0}
.work-page{background:var(--color-background-page);width:100%;max-width:100%;height:100dvh;overflow:hidden}.work-page__content{width:100%;min-width:0;height:100%;display:block}.work-page main#main-content{width:100%;min-width:0;height:100%}
