.project-collage{margin:0 auto;max-width:1500px;padding:30px var(--gutter) clamp(60px,8vw,110px);scroll-margin-top:calc(var(--header-height,80px) + 24px)}.collage-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:36px 8vw;align-items:end;border-top:1px solid color-mix(in srgb,currentColor 25%,transparent);padding-top:clamp(40px,6vw,80px);margin-bottom:clamp(40px,5vw,72px)}.collage-heading h2{font:400 clamp(44px,5.6vw,78px)/1.05 "Fraunces",serif;letter-spacing:-.03em}.collage-heading h2 em{font-weight:400}.collage-intro>p{font-size:18px;line-height:1.7;max-width:43ch}.collage-intro .collage-hint{font-size:15px;opacity:.72;margin-top:18px}.collage-board{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:44px 28px;align-items:start}.collage-board:before{content:"";position:absolute;inset:0 -3% 12%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 58% 45%,color-mix(in srgb,var(--project-color) 13%,transparent),transparent 67%)}.collage-detail{min-width:0;margin:0;grid-column:span 4}.collage-detail--lead{grid-column:1/span 8}.collage-detail--portrait{grid-column:9/span 4;grid-row:1/span 2;align-self:center;max-width:340px;justify-self:end;width:100%}.collage-photo{position:relative;display:block;border:1px solid color-mix(in srgb,currentColor 20%,transparent);border-radius:var(--control-radius,7px);background:color-mix(in srgb,var(--story-color) 92%,var(--story-ink));box-shadow:0 14px 40px -22px #0006;transition:transform .4s var(--ease-out),box-shadow .4s;cursor:zoom-in}.collage-photo img{width:100%;height:auto;border-radius:inherit}.collage-zoom{position:absolute;bottom:12px;right:12px;width:38px;height:38px;display:grid;place-items:center;background:var(--story-color);color:var(--story-ink);border:1px solid color-mix(in srgb,currentColor 25%,transparent);border-radius:50%;box-shadow:0 3px 12px #0002;transition:transform .3s}.collage-zoom svg{width:20px;height:20px}.collage-detail figcaption{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;margin-top:20px}.collage-number{font:13px/1.6 Fragment Mono,monospace;opacity:.65;padding-top:4px}.collage-detail h3{font:400 clamp(22px,2vw,27px)/1.2 "Fraunces",serif;letter-spacing:-.018em;text-wrap:balance}.collage-detail figcaption p{font-size:16px;line-height:1.65;opacity:.8;margin-top:10px;max-width:54ch}@media(hover:hover)and (pointer:fine){.collage-photo:hover{transform:translateY(-4px);box-shadow:0 24px 45px -24px #0008}.collage-photo:hover .collage-zoom{transform:scale(1.08)}}@media(max-width:899px){.collage-heading{grid-template-columns:1fr;gap:24px;margin-bottom:36px}.collage-intro>p{max-width:52ch}.collage-board{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 24px}.collage-detail{grid-column:2}.collage-detail--lead{grid-column:1/-1}.collage-detail--portrait{grid-column:1;grid-row:2/span 2;align-self:start;justify-self:start}}@media(max-width:600px){.project-collage{padding-top:0;padding-bottom:50px}.collage-heading h2{font-size:clamp(39px,10vw,52px)}.collage-intro>p{font-size:17px}.collage-board{display:flex;flex-direction:column;gap:38px}.collage-detail,.collage-detail--portrait{width:100%;max-width:none}.collage-detail--portrait .collage-photo{max-width:280px;margin-inline:auto}.collage-detail figcaption{margin-top:18px;gap:10px}.collage-detail h3{font-size:25px}.collage-zoom{width:36px;height:36px;bottom:10px;right:10px}}@media(prefers-reduced-motion:reduce){.collage-photo,.collage-zoom{transition:none}.collage-photo:hover,.collage-photo:hover .collage-zoom{transform:none}}.project-page[data-reduced=true] .collage-photo,.project-page[data-reduced=true] .collage-zoom{transition:none}.project-page[data-reduced=true] .collage-photo:hover,.project-page[data-reduced=true] .collage-photo:hover .collage-zoom{transform:none}body.portfolio.project-page{--story-color:var(--project-base,var(--paper));--story-ink:var(--base-ink,#0c1322);background:var(--story-color);color:var(--story-ink)}.project-header{position:fixed;inset:0 0 auto;z-index:30;background:var(--story-color);color:var(--story-ink);border:0;min-height:80px;display:flex;justify-content:space-between}.project-header .brand,.project-header .brand-dot{color:inherit}.brand-divider{opacity:.4;font-size:25px}.project-name{font:400 23px/1.2 Fraunces,serif;letter-spacing:-.025em}.project-header nav{flex-shrink:0}.project-header .language-link{color:inherit!important;border-color:currentColor}.project-header .external-link{color:inherit;font-size:14px}.project-story{padding-top:var(--header-height,80px)}.project-intro{min-height:calc(var(--view-height,700px)*.8);padding:50px 24px 40px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.project-eyebrow{font:13px/1.6 Fragment Mono,monospace;letter-spacing:.08em;text-transform:uppercase;margin:0 0 24px}.project-intro h1{font:400 clamp(44px,6.4vw,86px)/1.05 "Fraunces",serif;letter-spacing:-.035em;max-width:20ch;text-wrap:balance}.project-description{font-size:19px;line-height:1.65;max-width:52ch;margin:24px 0}.project-meta{display:flex;justify-content:center;flex-wrap:wrap;align-items:center;gap:12px 30px;font-size:14px;padding:0 0 24px;border-bottom:1px solid color-mix(in srgb,currentColor 30%,transparent)}.project-meta a{min-height:44px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:5px}.project-enter{margin-top:22px}.project-experience{position:relative;height:calc(var(--view-height,700px)*1.4);scroll-margin-top:var(--header-height,80px);overflow-x:clip}.project-stage{position:sticky;top:var(--header-height,80px);height:var(--view-height,700px);display:flex;flex-direction:column}.stage-tools{flex:none;display:flex;justify-content:center;align-items:center;min-height:62px;padding:6px 16px;visibility:hidden}.device-switch{display:flex;gap:4px;padding:4px;border:1px solid color-mix(in srgb,currentColor 30%,transparent);border-radius:50px;background:color-mix(in srgb,var(--story-color) 85%,#fff 15%)}.device-switch button{font-size:14px;min-height:44px;padding:8px 22px;border-radius:30px;transition:background .2s,color .2s,transform .2s}.device-switch button[aria-pressed=true]{background:#111;color:#fff;box-shadow:0 3px 9px #0002}.device-switch button:hover{transform:translateY(-1px)}.project-canvas{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;isolation:isolate}.project-device{flex:none;position:relative;width:min(calc((var(--canvas-height,560px) - 12px)*439/892),calc(100% - 32px));aspect-ratio:439/892;transform:translateY(var(--device-y,0px)) scale(var(--device-scale,.58));transform-origin:center top;filter:drop-shadow(0 16px 20px #0003)}.project-device{isolation:isolate}.project-device:before{content:"";position:absolute;inset:-8% -38%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 52%,var(--project-color) 8%,color-mix(in srgb,var(--project-color) 75%,transparent) 36%,color-mix(in srgb,var(--project-color) 32%,transparent) 55%,transparent 74%);filter:blur(24px);opacity:var(--device-glow,0);transform:scale(calc(.88 + var(--device-glow,0)*.12))}.project-device[data-device=laptop]:before{inset:-20% -8%}.project-frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}.laptop-frame{display:none}.project-screen{position:absolute;left:5.1%;top:2.2%;width:90.2%;height:95.8%;border-radius:14%/7%;overflow:hidden;background:#000;isolation:isolate}.project-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}.project-mount{position:absolute;inset:7.5% 0;overflow:hidden}.project-screen:after{content:"";position:absolute;left:34%;bottom:2.3%;width:32%;height:.55%;border-radius:999px;background:#dedede;pointer-events:none;z-index:2}.project-mount iframe{position:absolute;left:0;top:0;border:0;max-width:none;transform-origin:top left;background:#fff;color-scheme:normal}.project-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px;text-align:center;padding:24px;color:#fff;background:#000b;z-index:2}.placeholder-title{font:400 30px/1.1 Fraunces,serif}.placeholder-copy{font-size:15px;line-height:1.5}.project-placeholder small{font-size:13px}.project-placeholder .button{background:#fff;color:#111;font-size:14px;gap:12px;padding:12px 16px;min-height:48px}.project-device[data-device=laptop]{width:min(calc(100% - 24px),calc((var(--canvas-height,560px) - 12px)*3350/1936));aspect-ratio:3350/1936}.project-device[data-device=laptop] .project-screen{left:11.7910448%;top:6.4049587%;width:76.4179104%;height:82.6446281%;border-radius:0;background:#fff}.project-device[data-device=laptop] .project-mount{inset:0}.project-device[data-device=laptop] .project-screen:after{display:none}.project-device[data-device=laptop] .phone-frame{display:none}.project-device[data-device=laptop] .laptop-frame{display:block}.stage-footer{visibility:hidden;display:flex;gap:24px;align-items:center;justify-content:end;padding:8px 24px 12px;min-height:70px;flex:none}.project-status{font-size:14px;line-height:1.5;margin-right:auto}.project-help{font-size:14px;min-height:44px;text-decoration:underline;text-underline-offset:4px}.project-leave{margin-left:auto;min-height:48px;padding:10px 18px;font-size:15px;gap:24px}.project-leave span{font-size:23px}.project-help-panel{position:absolute;bottom:12px;right:24px;z-index:5;max-width:min(360px,calc(100% - 32px));background:#fff;color:#111;padding:25px 36px 25px 24px;box-shadow:0 12px 40px #0003;font-size:16px;border-radius:10px}.project-help-panel a{display:block;text-decoration:underline;text-underline-offset:4px;margin-top:16px}.project-retry{min-height:44px;padding-top:10px;font-size:15px}.project-dismiss{position:absolute;right:0;top:0;width:40px;height:40px;font-size:28px}.project-page[data-phase=live] :is(.stage-tools,.stage-footer){visibility:visible}.stage-tools{position:relative;z-index:4}.stage-tools:has(.project-scroll-cue){flex-direction:column;gap:9px;padding-bottom:24px}.project-scroll-cue{position:relative;width:auto;max-width:calc(100% - 52px);text-align:center;font:600 28px/1.12 Caveat,cursive;color:inherit;transform:rotate(-3deg);pointer-events:none;user-select:none;opacity:0;visibility:hidden;transition:opacity .35s}.project-scroll-cue svg{position:absolute;left:calc(100% - 8px);top:8px;width:48px;height:42px;overflow:visible;animation:project-scroll-invite 2.4s ease-in-out infinite;animation-play-state:paused}.project-scroll-cue path{stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.project-page[data-phase=live] .project-scroll-cue{opacity:1;visibility:visible}.project-page[data-phase=live] .project-scroll-cue svg{animation-play-state:running}@keyframes project-scroll-invite{0%,to{transform:translateY(-2px)}50%{transform:translateY(4px)}}@media(max-width:700px){.project-scroll-cue{font-size:24px;line-height:1.15}.project-scroll-cue svg{width:44px;height:38px}}.project-context{padding:clamp(64px,10vh,110px) var(--gutter);scroll-margin-top:var(--header-height,80px)}.project-context-heading{display:grid;grid-template-columns:1.3fr 1fr;align-items:end;gap:24px 8vw}.project-context-heading>.project-eyebrow{grid-column:1/-1;margin-bottom:0}.project-context h2,.project-contact h2{font:400 clamp(44px,6vw,78px)/1.05 "Fraunces",serif;letter-spacing:-.03em}.project-context h2 em,.project-contact h2 em{font-weight:400}.project-role{font-size:18px;max-width:35ch}.project-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin-top:56px}.project-notes article{border-top:1px solid color-mix(in srgb,currentColor 30%,transparent);padding-top:20px}.project-note-number{font:13px Fragment Mono,monospace}.project-notes h3{font:400 29px/1.15 Fraunces,serif;margin:28px 0 18px;max-width:20ch}.project-notes p{font-size:17px;line-height:1.7;max-width:38ch}.project-stack{display:flex;flex-wrap:wrap;gap:16px 32px;border-top:1px solid color-mix(in srgb,currentColor 30%,transparent);padding-top:24px;margin-top:50px;font-size:15px}.project-stack span{font-weight:600}.project-return{display:inline-block;min-height:44px;padding-top:24px;font-size:15px;text-decoration:underline;text-underline-offset:5px}.project-contact{min-height:calc(var(--view-height,700px)*.9);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:80px 24px}.project-contact h2{font-size:clamp(54px,8vw,112px)}.project-contact>.button{margin-top:38px}.project-next{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 24px;margin-top:70px;font:400 26px/1.3 Fraunces,serif;transition:transform .25s}.project-next span{flex-basis:100%;font:13px/1.6 Fragment Mono,monospace;text-transform:uppercase;letter-spacing:.07em}.project-next:hover{transform:translate(5px)}.project-next b{font-weight:400}.project-footer{padding:24px var(--gutter) 30px}.project-footer .footer-bottom{border-color:color-mix(in srgb,currentColor 30%,transparent)}.project-noscript{padding:24px var(--gutter)}.project-page :is(button,a):focus-visible{outline-color:currentColor}.project-page[data-reduced=true] .project-device{transform:none}.project-page[data-reduced=true] .project-device:before{transform:none}@media(max-width:700px){.project-header{min-height:92px;display:flex;flex-wrap:wrap;gap:0 16px;padding:10px 18px}.project-header .brandline{flex:1 1 100%;gap:10px}.project-header .brand{font-size:19px}.brand-divider{font-size:20px}.project-name{font-size:17px;max-width:18ch}.project-header nav{margin-left:auto;gap:18px}.project-header nav a{min-height:36px;font-size:13px}.project-intro{padding:35px 22px;min-height:calc(var(--view-height,700px)*.82)}.project-intro h1{font-size:45px}.project-eyebrow{font-size:13px;margin-bottom:20px}.project-description{font-size:17px;line-height:1.65;margin-block:22px}.project-meta{font-size:14px;gap:6px 18px;padding-bottom:18px}.project-enter{margin-top:20px}.stage-tools{min-height:60px}.device-switch button{min-height:44px;font-size:14px;padding:7px 21px}.stage-footer{gap:14px;padding:8px 18px;min-height:65px;justify-content:space-between}.project-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.project-help{font-size:14px}.project-leave{margin-left:auto;min-height:48px;font-size:15px;padding:10px 18px}.project-placeholder{padding:18px;gap:13px}.placeholder-title{font-size:27px}.placeholder-copy{font-size:14px;line-height:1.5}.project-device[data-device=laptop] .project-placeholder{gap:8px;padding:8px}.project-device[data-device=laptop] .placeholder-title{display:none}.project-device[data-device=laptop] .placeholder-copy{font-size:13px;line-height:1.4}.project-device[data-device=laptop] .project-placeholder small{display:none}.project-device[data-device=laptop] .project-placeholder .button{font-size:13px;min-height:40px;padding:8px 12px}.project-context{padding-block:60px}.project-context-heading{display:block}.project-context h2{font-size:45px;margin-block:22px}.project-role{font-size:17px}.project-notes{grid-template-columns:1fr;gap:34px;margin-top:35px}.project-notes h3{font-size:29px;margin:20px 0 14px;max-width:24ch}.project-notes p{font-size:17px}.project-stack{font-size:15px;display:block;line-height:1.8}.project-stack span{display:block;margin-bottom:8px}.project-contact{padding:60px 22px}.project-contact h2{font-size:63px}.project-next{font-size:25px;margin-top:56px}.project-footer .footer-bottom>p{flex-basis:65%}}.project-mobile-preview,.mobile-preview-copy{display:none}@media(max-width:899px),(hover:none)and (pointer:coarse){.project-stage,.desktop-preview-copy{display:none}.mobile-preview-copy{display:inline}.project-experience{height:auto;overflow:clip;padding:26px 18px 42px}.project-mobile-preview{display:flex;flex-direction:column;align-items:center}.preview-stack{position:relative;isolation:isolate;width:100%;max-width:540px;aspect-ratio:1.04;margin:0 auto 16px}.preview-stack:before{content:"";position:absolute;inset:-8%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 55% 50%,var(--project-color),transparent 66%);filter:blur(24px);opacity:calc(var(--device-glow,.55)*.5)}.preview-device{position:absolute;display:block;padding:0;border:0;background:transparent;cursor:pointer;touch-action:pan-y pinch-zoom;filter:drop-shadow(0 14px 13px #0004);transition:transform .6s cubic-bezier(.22,.8,.25,1),filter .6s;isolation:isolate}.preview-device--phone{width:46%;aspect-ratio:439/892;right:4%;top:0;transform-origin:75% 25%;z-index:2;transform:translateY(-6px)}.preview-device--phone:before{content:"";position:absolute;left:5.1%;top:2.2%;width:90.2%;height:95.8%;border-radius:14%/7%;background:linear-gradient(90deg,var(--phone-top-left),var(--phone-top-right)) top/100% 50% no-repeat,var(--phone-bottom);pointer-events:none}.preview-device--laptop{width:96%;aspect-ratio:3350/1936;left:0;top:30%;transform-origin:35% 75%;z-index:1;transform:translate(-5px,12px) scale(.9) rotate(-4deg)}.preview-stack[data-front=laptop] .preview-device--phone{z-index:1;transform:translate(4px,-12px) scale(.82) rotate(6deg);filter:drop-shadow(0 8px 10px #0003)}.preview-stack[data-front=laptop] .preview-device--laptop{z-index:2;transform:translateY(10px) rotate(-2deg);filter:drop-shadow(0 18px 15px #0004)}.preview-screen{position:absolute;display:block;overflow:hidden;background:#111;pointer-events:none}.preview-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}.preview-device--phone .preview-screen{left:5.1%;top:9.4%;width:90.2%;height:79.8%}.preview-device--laptop .preview-screen{left:11.7910448%;top:6.4049587%;width:76.4179104%;height:82.6446281%}.preview-frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.preview-device:focus-visible{outline:3px solid currentColor;outline-offset:7px;border-radius:12px}.preview-controls{text-align:center;position:relative;z-index:3}.preview-hint{font-size:15px;line-height:1.5;opacity:.75;margin:0 0 6px}.preview-swap{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:48px;padding:10px 6px;font-size:16px;text-decoration:underline;text-underline-offset:6px}.preview-visit{margin-top:24px;max-width:100%}.project-experience:focus-visible{outline-offset:-3px}.project-return{scroll-margin-top:var(--header-height,110px)}}@media(prefers-reduced-motion:reduce){.preview-device{transition:none}}.project-page[data-reduced=true] .preview-device{transition:none}@media(max-width:899px){.project-header{gap:6px 16px;flex-wrap:wrap;padding:8px var(--gutter)}.project-header .brandline{flex:1 1 100%;gap:10px}.project-header nav{margin-left:auto}.project-header nav a{min-height:44px}.project-name{min-width:0;overflow-wrap:anywhere}.project-context-heading{grid-template-columns:1fr;gap:18px}.project-role{max-width:48ch}.project-notes{grid-template-columns:1fr;gap:34px}.project-notes p{max-width:58ch}.project-contact h2{font-size:clamp(42px,10vw,78px);overflow-wrap:break-word}}@media(max-width:600px){.project-header .brand{font-size:18px}.project-header .project-name{font-size:16px;line-height:1.25}.project-header .brandline{gap:8px}.project-intro h1{font-size:clamp(36px,10.8vw,54px);overflow-wrap:break-word}.project-contact>.button{max-width:100%;gap:20px}.project-next{font-size:clamp(22px,6vw,28px)}}@media(max-width:899px)and (max-height:500px){.project-header{min-height:60px;flex-wrap:nowrap}.project-header .brandline{flex:1 1 auto}.project-header .brand{font-size:18px}.project-header .project-name{font-size:16px}.project-header nav{gap:12px}.stage-tools,.stage-tools:has(.project-scroll-cue){min-height:43px;padding:0 20px 12px}.project-scroll-cue{font-size:22px}.project-scroll-cue svg{height:30px;top:0}.stage-footer{min-height:56px;padding-top:2px;padding-bottom:6px}.project-leave{min-height:44px;padding-block:6px}.project-placeholder{padding:12px;gap:8px;overflow-y:auto;justify-content:start}.project-placeholder .placeholder-title,.project-placeholder small{display:none}}.project-mount{isolation:isolate}.project-mount:has(iframe):after{content:"";position:absolute;inset:0 0 0 auto;width:var(--embed-scrollbar-width,0px);background:var(--project-color);mix-blend-mode:multiply;pointer-events:none;z-index:1}.stage-footer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}.stage-footer .project-status{grid-column:1;margin-right:0}.stage-footer .project-help{grid-column:2;justify-self:center;text-align:center;white-space:nowrap}.stage-footer .project-leave{grid-column:3;justify-self:end;margin-left:0}@media(max-width:480px){.stage-footer:has(.project-help){grid-template-columns:1fr;row-gap:0;padding-top:0}.stage-footer .project-help{grid-column:1;grid-row:1}.stage-footer:has(.project-help) .project-leave{grid-column:1;grid-row:2;justify-self:center;min-height:44px;padding-block:7px}}.project-intro-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:24px 40px;margin-top:24px}.project-intro-actions .project-enter{margin-top:0}.project-intro-actions .sv-made-by{--sv-bg:transparent;--sv-ink:var(--story-ink);--sv-muted:color-mix(in srgb,var(--story-ink) 75%,transparent);--sv-line:color-mix(in srgb,var(--story-ink) 25%,transparent)}@media(max-width:600px){.project-intro-actions{flex-direction:column;gap:24px}}
