.scene{position:relative;aspect-ratio:4 / 3.35;border-radius:var(--r-xl) var(--r-xl) 0 0;overflow:hidden;background:var(--cotton-2);isolation:isolate}@media (min-width: 1024px){.scene{aspect-ratio:4 / 3.2;perspective:1400px}}.scene__ribbon{position:absolute;inset:auto -10% 14%;height:44%;background:var(--accent);transform:rotate(-7deg);z-index:0}.scene__ribbon:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,#ffffff38,#fff0 45%,#0000001f)}.scene__group{position:absolute;inset:0;transform:rotateX(var(--tilt-y, 0deg)) rotateY(var(--tilt-x, 0deg))}@media (hover: hover) and (min-width: 1024px) and (prefers-reduced-motion: no-preference){.scene__group{transition:transform var(--d-5) var(--ease-out);transform-style:preserve-3d}}.scene__browser{position:absolute;left:12%;top:6%;width:76%;aspect-ratio:16 / 10;background:#fff;border-radius:12px;box-shadow:var(--sh-xl);overflow:hidden;z-index:1}.scene__bar{height:28px;background:#f4f4f3;border-bottom:1px solid #E7E7E5;display:flex;align-items:center;gap:6px;padding:0 12px}.scene__bar i{width:9px;height:9px;border-radius:50%;background:#d9d9d6}.scene__bar .url{margin-left:10px;flex:1;height:16px;border-radius:4px;background:#fff;border:1px solid #E7E7E5;font:10px/16px var(--f-mono);color:var(--muted);padding:0 8px;overflow:hidden;white-space:nowrap}.scene__shots{position:absolute;inset:28px 0 0}.scene__shots picture,.scene__phone-screen picture{position:absolute;inset:0;display:block}.scene__shots img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0}.scene__shots img.is-active{opacity:1}.scene__phone{position:absolute;right:6%;bottom:0;width:24%;aspect-ratio:9 / 17;background:#111;border-radius:26px 26px 0 0;padding:8px 8px 0;box-shadow:var(--sh-xl);z-index:2}.scene__phone-screen{position:relative;width:100%;height:100%;border-radius:18px 18px 0 0;overflow:hidden;background:#fff}.scene__phone-screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0}.scene__phone-screen img.is-active{opacity:1}.scene.is-ready .scene__shots img,.scene.is-ready .scene__phone-screen img{transition:opacity .7s var(--ease-out)}.scene__shots img[data-project=panoptic]{object-position:center 12%}.scene__shots img[data-project=easystride]{object-position:center 4%}.scene__shots img[data-project=panoptic-search]{object-position:center 22%}.scene__phone:before{content:"";position:absolute;top:14px;left:50%;transform:translate(-50%);width:34%;height:5px;border-radius:3px;background:#000;z-index:1}.scene__card{position:absolute;left:24px;bottom:24px;width:min(46%,240px);background:#fff;border-radius:16px;box-shadow:var(--sh-lg);padding:14px 16px 12px;z-index:3}.scene__card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}.scene__card-head .name{font-family:var(--f-display);font-weight:600;font-size:clamp(.75rem,.6rem + .5vw,1rem);letter-spacing:-.01em}.scene__card-head .tag{font:8.5px/1 var(--f-mono);padding:4px 7px;border-radius:4px;background:#eef8f2;letter-spacing:.12em;text-transform:uppercase;color:var(--ok);display:inline-flex;align-items:center;gap:5px}.scene__card-head .tag:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px #1e9e5a2e}.scene__rows{display:grid;gap:6px}.scene__row{display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:clamp(.58rem,.45rem + .4vw,.78rem);color:var(--ink-soft);opacity:0;transform:translateY(6px);transition:opacity var(--d-5) var(--ease-out),transform var(--d-5) var(--ease-out)}.scene__row.is-in{opacity:1;transform:none}.scene__row .chk{width:14px;height:14px;border-radius:4px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:0 0 auto}.scene__row .chk svg{width:9px;height:9px}.scene__row b{color:var(--ink);font-weight:600}.scene__row>span:last-child{overflow:hidden;text-overflow:ellipsis}@media (max-width: 1199px){.scene__row .d{display:none}}.scene__bar-row{margin-top:10px;height:4px;border-radius:2px;background:var(--gray-100);overflow:hidden}.scene__bar-row i{display:block;height:100%;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 5.2s linear}.scene__bar-row i.is-run{transform:scaleX(1)}.scene__tabs{position:absolute;inset:5% 5% auto auto;display:flex;gap:6px;z-index:4}.scene__tabs button{width:8px;height:8px;border-radius:50%;background:#1d1e2033;transition:background var(--d-2) var(--ease-out),transform var(--d-2) var(--ease-out)}.scene__tabs button[aria-selected=true]{background:var(--ink);transform:scale(1.25)}@media (hover: hover){.scene__tabs button:hover{background:#1d1e2073}}@media (max-width: 1023px){.scene__tabs{display:none}}.scene__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media (prefers-reduced-motion: reduce){.scene__row{opacity:1;transform:none}.scene__bar-row{display:none}.scene__group{transform:none!important}}.flow{display:grid;gap:0;margin-top:var(--sp-md);position:relative;list-style:none;padding:0}@media (min-width: 900px){.flow{grid-template-columns:repeat(6,1fr);gap:0}}.flow__step{position:relative;padding:22px 18px 26px;border:1px solid var(--line);background:var(--paper);transition:background-color var(--d-3) var(--ease-out),border-color var(--d-3) var(--ease-out),opacity var(--d-3) var(--ease-out)}.flow__step+.flow__step{border-top:0}@media (min-width: 900px){.flow__step+.flow__step{border-top:1px solid var(--line);border-left:0}.flow__step:first-child{border-radius:var(--r-md) 0 0 var(--r-md)}.flow__step:last-child{border-radius:0 var(--r-md) var(--r-md) 0}}@media (max-width: 899px){.flow__step:first-child{border-radius:var(--r-md) var(--r-md) 0 0}.flow__step:last-child{border-radius:0 0 var(--r-md) var(--r-md)}}.flow__step .eyebrow{margin-bottom:12px;color:var(--muted);transition:color var(--d-3) var(--ease-out)}.flow__step h3{font-family:var(--f-display);font-weight:500;font-size:1.125rem;letter-spacing:-.01em;line-height:1.2}.flow__step p{margin-top:8px;font-size:.9rem;color:var(--ink-soft);line-height:1.45}.flow__step .arrow{position:absolute;right:-9px;top:50%;transform:translateY(-50%);width:18px;height:18px;border-radius:50%;background:var(--paper);border:1px solid var(--line);display:none;place-items:center;z-index:1;color:var(--accent);transition:background-color var(--d-3) var(--ease-out),color var(--d-3) var(--ease-out),transform var(--d-3) var(--ease-out)}@media (min-width: 900px){.flow__step:not(:last-child) .arrow{display:grid}}.flow__step--accent{background:var(--accent-soft)}.flow__step--core{background:var(--ink);color:#fff;border-color:var(--ink)}.flow__step--core .eyebrow,.flow__step--core p{color:#c9cbce}.flow__step--quiet{background:var(--gray-50)}.flow__step:focus-visible{outline-offset:-2px}.flow.is-active .flow__step:not(.is-current){opacity:.6}.flow.is-active .flow__step.is-current:not(.flow__step--core){background:var(--accent-soft);border-color:var(--accent)}.flow.is-active .flow__step.is-current .eyebrow{color:var(--accent)}.flow.is-active .flow__step.is-current .arrow{background:var(--accent);color:#fff;transform:translateY(-50%) scale(1.12)}.flow__pulse{position:absolute;left:0;top:-1px;height:3px;width:18%;background:var(--accent);border-radius:2px;animation:pulse-run 7s linear infinite;display:none}@media (min-width: 900px) and (prefers-reduced-motion: no-preference){.flow__pulse{display:block}}.flow.is-active .flow__pulse{animation-play-state:paused}@keyframes pulse-run{0%{transform:translate(-100%);opacity:0}8%{opacity:1}92%{opacity:1}to{transform:translate(555%);opacity:0}}@media (max-width: 899px){.flow{padding-left:20px}.flow:before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--line);z-index:0}.flow__step{border-radius:0!important}@media (prefers-reduced-motion: no-preference){.flow__pulse--v{display:block;position:absolute;left:-1px;top:0;width:3px;height:12%;background:var(--accent);border-radius:2px;animation:pulse-run-v 7s linear infinite}.flow.is-active .flow__pulse--v{animation-play-state:paused}@keyframes pulse-run-v{0%{transform:translateY(-100%);opacity:0}8%{opacity:1}92%{opacity:1}to{transform:translateY(750%);opacity:0}}}}@media (min-width: 900px){.flow__pulse--v{display:none}}@media (prefers-reduced-motion: reduce){.flow__step,.flow__step .eyebrow,.flow__step .arrow{transition:none}}.bento{display:grid;gap:var(--grid-gap)}@media (min-width: 768px){.bento{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.bento{grid-template-columns:repeat(12,1fr)}.bento>.span-8{grid-column:span 8}.bento>.span-4{grid-column:span 4}.bento>.span-6{grid-column:span 6}.bento>.span-12{grid-column:span 12}}.card{position:relative;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-sm);transition:transform var(--d-3) var(--ease-out),box-shadow var(--d-3) var(--ease-out),border-color var(--d-3) var(--ease-out)}@media (hover: hover){.card:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:#d5d9de}}.card--cotton{background:var(--cotton-2)}.card--ink{background:var(--ink);color:#fff;border-color:var(--ink)}.card--ink .card__body p{color:#c9cbce}.card--ink .card__body{padding-top:28px}.card--accent{background:var(--accent);color:#fff;border-color:var(--accent)}.card__media{position:relative;background:var(--gray-100);overflow:hidden;aspect-ratio:16 / 10}.card--ink .card__media{background:#2b2c2f}.card__media img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform var(--d-3) var(--ease-out)}@media (hover: hover){.card:hover .card__media img{transform:scale(1.03)}}.card__body{padding:24px;display:flex;flex-direction:column;flex:1}@media (min-width: 1200px){.card__body{padding:28px}}.card__body .eyebrow{margin-bottom:12px;color:var(--muted)}.card--ink .card__body .eyebrow{color:#9a9da1}.card__body h3{font-family:var(--f-display);font-weight:400;font-size:var(--fs-h3);line-height:1.1;letter-spacing:-.02em}.card__body p{margin-top:12px;color:var(--ink-soft);line-height:1.5}.card__body .link{margin-top:auto;padding-top:22px;align-self:flex-start}.card__body .tags{margin-top:16px}.card--feature .card__body h3{font-size:clamp(1.75rem,1.3rem + 1.4vw,2.5rem)}.card a.card__cover{position:absolute;inset:0;z-index:1}.card a.card__cover:focus-visible{outline-offset:2px}.card .card__body .link{position:relative;z-index:2}.ui-stack{position:relative;width:100%;height:100%;padding:18px;display:grid;place-items:center}.ui-chip{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:500;padding:8px 12px;border-radius:var(--r-pill);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-xs)}.ui-chip .dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}.tags{display:flex;flex-wrap:wrap;gap:6px}.tag{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px;border-radius:4px;background:var(--gray-100);color:var(--ink-soft)}.bg-ink .tag,.card--ink .tag{background:#ffffff1a;color:#d9dbde}.tag--accent{background:var(--accent-soft);color:var(--accent-ink)}.tag--live{background:#e3f6eb;color:#1a7a46}.work-grid{display:grid;gap:var(--grid-gap)}@media (min-width: 700px){.work-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1100px){.work-grid{grid-template-columns:repeat(3,1fr)}.work-grid>.is-wide{grid-column:span 2}}.work-card .card__media{aspect-ratio:16 / 10}.card__media--well{display:flex;align-items:center;justify-content:center;background:var(--cotton-2);padding:var(--sp-md);text-align:center}.card__media--well .card__media-name{font-family:var(--f-display);font-weight:400;font-size:28px;line-height:1.15;letter-spacing:-.01em;color:var(--muted)}.work-card .card__body h3{font-size:1.35rem;font-weight:500;letter-spacing:-.015em;color:var(--ink)}.work-card .card__body p{font-size:.95rem}.work-card .meta{display:flex;justify-content:space-between;gap:12px;align-items:center;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}.work-card .meta .status{display:inline-flex;align-items:center;gap:6px}.work-card .meta .status:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ok)}.work-card .meta .status.is-progress:before{background:#e8a400}.work-card .tag{background:var(--cotton-2);color:var(--ink)}.work-card{position:relative;perspective:1400px}.carousel__item .work-card{height:100%}.work-card__flip{position:relative;flex:1;display:flex;flex-direction:column;transition:transform var(--d-5) var(--ease-panel);transform-style:preserve-3d}.work-card__face{backface-visibility:hidden}.work-card__face--front{display:flex;flex-direction:column;flex:1}.work-card__face--back{position:absolute;inset:0;transform:rotateY(180deg);display:flex;flex-direction:column;gap:10px;padding:24px;background:var(--accent-deep);color:#fff}.work-card__face--back h3{font-family:var(--f-display);font-weight:400;color:#fff;font-size:clamp(1.2rem,1.05rem + .5vw,1.5rem);line-height:1.15;letter-spacing:-.02em;margin-bottom:auto}.work-card__fact-label{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:#ffffff9e}.work-card__fact{font-family:var(--f-display);font-weight:400;font-size:clamp(1.05rem,.95rem + .4vw,1.3rem);line-height:1.28;letter-spacing:-.01em}@media (hover: hover){.work-card:hover .work-card__flip,.work-card:focus-within .work-card__flip{transform:rotateY(180deg)}}.work-card.is-flipped .work-card__flip{transform:rotateY(180deg)}.work-card__toggle{position:absolute;z-index:3;top:12px;right:12px;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:var(--r-btn);padding:8px 12px;background:#fffffff0;color:var(--ink);font-family:var(--f-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background-color var(--d-2) var(--ease-out),color var(--d-2) var(--ease-out)}@media (hover: hover){.work-card__toggle:hover{background:var(--ink);color:#fff}}@media (hover: hover){.work-card__toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.work-card__toggle:focus-visible{width:auto;height:auto;padding:8px 12px;margin:0;overflow:visible;clip:auto;white-space:normal;outline:2px solid var(--accent);outline-offset:2px}}.work-card.is-flipped .work-card__toggle{background:var(--ink);color:#fff}@media (prefers-reduced-motion: reduce){.work-card__flip{transition:none;transform:none!important}.work-card__face--back{transform:none;opacity:0;pointer-events:none;transition:opacity var(--d-2) var(--ease-out)}.work-card__face--front{transition:opacity var(--d-2) var(--ease-out)}@media (hover: hover){.work-card:hover .work-card__face--back,.work-card:focus-within .work-card__face--back{opacity:1;pointer-events:auto}.work-card:hover .work-card__face--front,.work-card:focus-within .work-card__face--front{opacity:0}}.work-card.is-flipped .work-card__face--back{opacity:1;pointer-events:auto}.work-card.is-flipped .work-card__face--front{opacity:0}}.carousel{position:relative}.carousel__head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-sm);margin-bottom:var(--sp-sm)}.carousel__head .h2{max-width:46rem}.carousel__controls{display:flex;gap:12px;flex:none}.carousel__btn{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-btn);background:transparent;color:var(--ink);transition:background var(--d-2) var(--ease-out),color var(--d-2) var(--ease-out),border-color var(--d-2) var(--ease-out)}.carousel__btn svg{width:18px;height:18px;display:block}.carousel__btn[disabled]{opacity:.35;cursor:not-allowed}.bg-ink .carousel__btn{border-color:#fff6;color:#fff}@media (hover: hover){.carousel__btn:not([disabled]):hover{background:var(--ink);color:#fff;border-color:var(--ink)}.bg-ink .carousel__btn:not([disabled]):hover{background:#fff;color:var(--ink);border-color:#fff}}.carousel__viewport{position:relative}.carousel__track{display:flex;align-items:stretch;gap:var(--grid-gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-ms-overflow-style:none;scroll-padding-inline:var(--grid-pad);cursor:grab}.carousel .carousel__track[role=list]{padding-block:6px;padding-inline-start:var(--grid-pad);padding-inline-end:var(--grid-pad);margin-inline:auto;max-width:var(--grid-max)}.carousel__track::-webkit-scrollbar{display:none}.carousel__track.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}.carousel__track.is-dragging .carousel__item{pointer-events:none}.carousel--bleed .carousel__track[role=list]{max-width:none;padding-inline-end:0}.carousel__item{flex:none;display:flex;width:var(--carousel-item, min(100%, 360px));scroll-snap-align:start}.carousel__item>*{height:100%}.carousel--wide{--carousel-item: min(100%, 560px)}.carousel__progress{position:relative;height:2px;background:var(--line);border-radius:2px;overflow:hidden;margin-top:var(--sp-sm)}.bg-ink .carousel__progress{background:#ffffff29}.carousel__progress i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--accent)}.bg-ink .carousel__progress i{background:#fff}@supports (animation-timeline: scroll()){.carousel{timeline-scope:--carousel-scroll}.carousel__track{scroll-timeline:--carousel-scroll inline}.carousel__progress i{animation:carousel-progress linear;animation-timeline:--carousel-scroll;animation-range:0% 100%;transform:scaleX(0)}}@keyframes carousel-progress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media (prefers-reduced-motion: reduce){.carousel__track{scroll-behavior:auto}}
