.case-back{align-items:center;gap:12px;width:fit-content;margin:64px 0;display:flex;color:var(--portfolio-muted)!important}.case-back>span{background:#353535;border-radius:50%;place-items:center;width:48px;height:48px;display:grid}.case-hero{background:var(--portfolio-surface);border-radius:32px;min-height:290px;margin-bottom:8px;padding:44px;position:relative}.case-hero>div{max-width:50%}.case-hero h1{letter-spacing:-.02em;margin:0 0 16px;font-size:28px;font-weight:700;line-height:1.3}.case-hero p{color:var(--portfolio-muted);margin:0}.case-hero>img{object-fit:contain;width:371px;height:407px;position:absolute;bottom:0;right:108px}.store-labels{flex-wrap:wrap;gap:8px;margin-top:44px;display:flex}.store-labels span{white-space:nowrap;background:#353535;border-radius:24px;flex-shrink:0;padding:12px;font-size:14px}.case-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;display:grid}.case-metrics>div{background:var(--portfolio-surface);border-radius:32px;padding:44px}.case-metrics dt{color:var(--portfolio-muted);margin-bottom:24px}.case-metrics dd{margin:0;font-size:22px;font-weight:700;line-height:1.4}.case-context{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:64px 0;display:grid}.case-context>*{min-width:0}@media (max-width:600px){.case-study .case-context{grid-template-columns:minmax(0,1fr)}.case-context .case-prose{width:100%}}.case-prose{width:588px;max-width:100%;padding:64px 0}.case-context .case-prose{padding:0}.case-prose h2{letter-spacing:-.02em;margin:0 0 24px;font-size:22px;font-weight:700;line-height:1.4}.case-prose h3{color:var(--portfolio-muted);margin:0 0 24px;font-size:16px;font-weight:500}.case-prose p{margin:0 0 16px}.case-prose p:last-child{margin-bottom:0}.case-prose strong{color:var(--portfolio-muted);font-weight:700}.case-study figure{min-width:0;margin:0}.case-artwork{width:100%;height:auto;display:block}.case-context figure figcaption{text-align:center;color:var(--portfolio-text);background:#353535;border-radius:100px;margin-top:8px;padding:12px}.case-study .case-figure{margin-bottom:64px}.case-figure figcaption{color:var(--portfolio-muted);margin-bottom:24px}.case-state-list{padding:0 0 64px}.case-retention{max-width:588px;margin:64px 0}.case-footer{gap:24px;margin-top:64px;display:flex}.case-to-top{background:#353535;border-radius:50%;flex-shrink:0;place-items:center;width:84px;height:84px;display:grid}@media (max-width:1000px){.case-hero>img{width:30%;height:auto;right:24px}.case-hero>div{max-width:62%}.case-metrics>div{padding:24px}}@media (max-width:600px){.case-back{margin:32px 0}.case-hero{padding:24px 24px 0;overflow:hidden}.case-hero>div{max-width:none}.case-hero h1{font-size:24px}.case-hero>img{width:65%;margin:24px auto 0;display:block;position:relative;right:auto}.store-labels{margin-top:24px}.case-metrics{grid-template-columns:1fr}.case-metrics>div{border-radius:24px;justify-content:space-between;align-items:center;gap:16px;display:flex}.case-metrics dt{margin:0}.case-metrics dd{white-space:nowrap}.case-context{grid-template-columns:1fr;gap:24px;padding:40px 0}.case-prose{padding:40px 0}.case-study .case-figure{margin-bottom:40px}.case-state-list{padding:0 0 40px}.case-footer{gap:8px;margin-top:32px}.case-to-top{width:64px;height:64px}.case-retention{margin:40px 0}}.comparison-window{aspect-ratio:588/343;background:var(--portfolio-surface);border-radius:32px;overflow:hidden}.comparison-track{width:200%;height:100%;transition:transform .28s cubic-bezier(.23,1,.32,1);display:flex}.comparison-slide{flex-shrink:0;width:50%;position:relative;overflow:hidden}.comparison-slide>img{object-fit:contain;width:100%;height:100%;display:block}.comparison-tabs{background:var(--portfolio-surface);border-radius:100px;grid-template-columns:1fr 1fr;margin-top:8px;padding:4px;display:grid;position:relative}.comparison-tabs button{z-index:1;color:var(--portfolio-muted);background:0 0;border:0;border-radius:100px;min-height:48px;padding:12px;position:relative}.comparison-tabs button[aria-selected=true]{color:var(--portfolio-text)}.comparison-indicator{background:#353535;border-radius:100px;width:calc(50% - 4px);transition:transform .28s cubic-bezier(.23,1,.32,1);position:absolute;top:4px;bottom:4px;left:4px}.engagement-chart{position:relative}.chart-legend{color:#b0b0b0;flex-wrap:wrap;gap:24px;margin-bottom:16px;font-size:14px;display:flex}.chart-legend span{align-items:center;gap:8px;display:flex}.chart-legend i{width:18px;height:3px;display:inline-block}.movement-key{background:#aaa6ed}.activity-key{background:#6659ed}.chart-plot{position:relative}.chart-plot svg{width:100%;height:auto;display:block;overflow:visible}.chart-plot svg text{fill:#a1a1a1;font-family:inherit;font-size:14px}.chart-targets{grid-template-columns:.5fr repeat(6,1fr) .5fr;display:grid;position:absolute;inset:6.15% 2.03% 11.92% 5.07%}.chart-targets button{cursor:crosshair;background:0 0;border:0;flex:1;min-width:0;padding:0}.chart-tooltip{pointer-events:none;background:#1b1b1b;border:1px solid #414141;border-radius:16px;width:240px;padding:16px;font-size:13px;position:absolute;top:12%;transform:translate(-50%);box-shadow:0 12px 32px #0006}.chart-tooltip strong{margin-bottom:8px;display:block}.chart-tooltip span{color:#bbb;justify-content:space-between;gap:12px;display:flex}.chart-tooltip b{color:var(--portfolio-text)}.chart-note{color:var(--portfolio-muted);margin:12px 0 0;font-size:12px}.chart-scroll,.baseline-scroll{overscroll-behavior-x:contain;overflow-x:auto}@media (max-width:1000px){.chart-plot{min-width:840px}.chart-plot svg text{font-size:20px}.baseline-scroll .case-artwork{min-width:840px}}@media (max-width:600px){.comparison-window{border-radius:24px}.chart-tooltip{width:220px;padding:12px;font-size:12px}}@media (prefers-reduced-motion:reduce){.comparison-track,.comparison-indicator{transition:none}.card-forward:hover,.card-forward:hover svg{transform:none}}.case-study .store-labels span{border:1px solid #ffffff1a;align-items:center;gap:8px;padding:11px 12px;display:inline-flex}.case-study .store-labels svg{color:currentColor;flex-shrink:0}.case-study .case-back svg{transition:transform .2s cubic-bezier(.23,1,.32,1)}.case-study .case-back:active>span{transform:scale(.97)}.case-study .case-back>span{transition:transform .2s cubic-bezier(.23,1,.32,1)}@media (hover:hover) and (pointer:fine){.case-study .case-back:hover svg{transform:translate(-2px)}}@media (prefers-reduced-motion:reduce){.case-study .case-back svg{transform:none!important}}.case-study .comparison-indicator{transition:none}
