.case-page{--product-accent:#416543;--stage:#e4e9df;--stage-line:#c5cec1}
.case-seepegel{--product-accent:#34758a;--stage:#e1edef;--stage-line:#bdcfd1}
.case-workify{--product-accent:var(--accent);--stage:#eddfd0;--stage-line:#d2bdab}
.case-hero{background:var(--stage);padding:0 var(--pad);overflow:hidden}
.case-breadcrumb{display:flex;align-items:center;gap:22px;font-size:11px;padding:22px 0;border-bottom:1px solid var(--stage-line)}
.case-breadcrumb>a{display:inline-flex;align-items:center;min-height:24px;border-bottom:1px solid currentColor}
.case-breadcrumb>a:hover{color:var(--accent)}
.case-breadcrumb>span:not(.status){color:var(--muted)}
.case-breadcrumb .status{margin-left:auto;color:var(--product-accent)}
.case-masthead{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:15px 0}
.case-masthead h1{font-size:clamp(85px,10.5vw,220px);font-weight:700;line-height:1.05;letter-spacing:-.075em}
.case-masthead h1>span{display:inline-block;width:.07em;height:.07em;border-radius:50%;background:var(--product-accent);color:transparent;margin-left:.06em;overflow:hidden}
.case-masthead>.eyebrow{text-align:right;line-height:1.9;font-size:10px}
.case-lead{display:grid;grid-template-columns:.82fr 1.45fr;align-items:center;gap:5vw;padding:7px 0 26px;min-width:0}
.case-promise{padding:0 0 8px}
.case-promise>.eyebrow{font-size:9px;margin-bottom:20px;color:var(--product-accent)}
.case-promise h2{font-size:clamp(28px,2.95vw,53px);letter-spacing:-.055em;line-height:1.15}
.case-promise>p:not(.eyebrow){font-size:13px;line-height:1.85;max-width:345px;margin-top:22px;color:#535e50}
.case-seepegel .case-promise>p:not(.eyebrow){color:#50656a}
.case-workify .case-promise>p:not(.eyebrow){color:#6e5b4d}
.case-promise>.button{margin-top:27px}
.case-hero-art{min-width:0;padding:20px 8px 10px;position:relative;max-width:720px;justify-self:end;width:100%}
.screenshot-link{position:relative;display:block;cursor:zoom-in}
.screenshot-link img{width:100%}
.zoom-label{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;gap:15px;font-size:10px;background:var(--paper);color:var(--ink);padding:10px 14px;box-shadow:0 2px 15px #00000012;opacity:0;transform:translateY(5px);transition:opacity .2s,transform .2s}
.screenshot-link:hover .zoom-label,.screenshot-link:focus-visible .zoom-label{opacity:1;transform:none}
.zoom-label .icon{width:16px;height:16px}
.hero-screen{transform:rotate(-3deg);transition:transform .7s var(--ease);border-radius:9px;box-shadow:0 24px 50px -30px #223b3750}
.hero-screen img{border-radius:9px}
.hero-screen:hover{transform:rotate(0)}
.case-hero-art>figcaption{font-size:9px;line-height:1.5;color:#52614e;margin:28px 0 0}
.art-seepegel{padding:12px 14% 28px 0}
.hero-map{transform:rotate(-3deg);border:6px solid #f8faf7;border-radius:6px;box-shadow:0 24px 50px -25px #2b485440;transition:transform .7s var(--ease)}
.hero-map:hover{transform:rotate(0)}
.hero-phone{position:absolute;right:1%;bottom:10%;width:24%;border:5px solid #20353b;border-radius:20px;transform:rotate(5deg);box-shadow:0 20px 35px -20px #20353b80;pointer-events:none}
.art-seepegel>figcaption{color:#50666b;max-width:76%;margin-top:30px}
.case-hero-foot{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--stage-line);padding:14px 0;font-size:10px;color:#5e695a}
.case-hero-foot>a{display:inline-flex;gap:18px;align-items:center;min-height:24px}
.case-hero-foot .icon{width:14px}
.case-hero-foot>a:hover{color:var(--accent)}
.case-story{padding:108px var(--pad) 65px;display:grid;grid-template-columns:1fr 2.2fr;gap:60px}
.story-label{padding-top:10px}
.story-label>span{display:block;font-size:11px;line-height:1.9;color:var(--muted);margin-top:22px}
.case-story h2{font-size:clamp(38px,4.65vw,84px);letter-spacing:-.06em;line-height:1.13}
.case-story>div>p{max-width:620px;font-size:14px;line-height:1.9;color:var(--muted);margin-top:28px}
.case-credit{display:flex;align-items:baseline;gap:26px;border-top:1px solid var(--line);margin-top:35px;padding-top:18px;font-size:10px}
.case-credit>span{flex:none;text-transform:uppercase;letter-spacing:.1em}
.case-credit>p{color:var(--muted);max-width:460px}
.case-capabilities{padding:0 var(--pad) 100px}
.case-capabilities article{display:grid;grid-template-columns:.16fr 1fr 1fr;gap:40px;align-items:start;border-top:1px solid var(--line);padding:32px 0}
.capability-index{font-size:13px;color:var(--product-accent);padding-top:3px}
.case-capabilities .eyebrow{font-size:9px;color:var(--muted)}
.case-capabilities h3{font-size:clamp(26px,2.6vw,44px);line-height:1.25;letter-spacing:-.045em;margin-top:9px}
.case-capabilities article>p{font-size:13px;line-height:1.9;color:var(--muted);max-width:420px;padding-top:3px}
.case-showcase{padding:75px var(--pad) 30px;background:#263d30;color:var(--paper)}
.showcase-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:50px;margin-bottom:42px}
.showcase-heading .eyebrow{color:#b8cab6;margin-bottom:24px}
.showcase-heading h2{font-size:clamp(36px,4.2vw,74px);line-height:1.13;letter-spacing:-.06em}
.showcase-heading>p{font-size:12px;line-height:1.9;color:#bac9b7;padding-bottom:4px}
.showcase-image{max-width:1120px;margin:0 auto}
.showcase-image .screenshot-link{overflow:hidden;border-radius:5px}
.showcase-image figcaption{font-size:9px;color:#b6c5b3;margin-top:18px;line-height:1.7}
.showcase-bottom{display:flex;justify-content:space-between;align-items:center;gap:28px;border-top:1px solid #c1cec23d;padding:25px 0 0;margin-top:38px;font-size:10px;color:#bccab8}
.showcase-bottom .quiet-link{color:var(--paper)}
.case-app{background:var(--stage);padding:90px var(--pad);display:grid;grid-template-columns:1fr 1.25fr;gap:7vw;align-items:start}
.app-copy{position:sticky;top:55px;padding-top:35px}
.app-copy>.eyebrow{color:var(--product-accent)}
.app-copy h2{font-size:clamp(38px,4.3vw,74px);line-height:1.12;letter-spacing:-.06em;margin-top:24px}
.app-copy>p:not(.eyebrow){font-size:13px;max-width:345px;line-height:1.9;margin-top:25px;color:#50656a}
.app-copy .button{margin-top:26px}
.app-footnote{font-size:9px;color:#526c72;line-height:1.8;margin-top:38px}
.app-gallery{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:660px}
.app-gallery figure:last-child{margin-top:88px}
.app-gallery .screenshot-link{border:5px solid #18313c;border-radius:24px;overflow:hidden;box-shadow:0 20px 40px -20px #18313c50;transition:transform .5s var(--ease)}
.app-gallery .screenshot-link:hover{transform:translateY(-7px)}
.app-gallery .zoom-label{display:none}
.app-gallery figcaption{font-size:9px;line-height:1.7;color:#45616b;margin-top:20px}
.next-project{padding:65px var(--pad);display:grid;grid-template-columns:1fr 2fr auto;gap:30px;align-items:center;border-bottom:1px solid var(--line)}
.next-name{font-size:clamp(50px,7.5vw,125px);line-height:1.1;letter-spacing:-.075em}
.next-name>span{display:inline-block;width:.075em;height:.075em;border-radius:50%;background:var(--accent);color:transparent;margin-left:.06em;overflow:hidden}
.next-project .round-arrow{width:60px;height:60px}
.next-project:hover .next-name{color:var(--accent)}
.workshop{min-width:0;background:#d5b296;color:#543a2c;padding:24px 32px;position:relative;overflow:hidden;background-image:linear-gradient(#74452b15 1px,transparent 1px),linear-gradient(90deg,#74452b15 1px,transparent 1px);background-size:32px 32px}
.workshop-top{display:flex;justify-content:space-between;gap:20px;font-size:9px}
.workshop-type{font-size:clamp(55px,7.6vw,150px);font-weight:700;line-height:.98;letter-spacing:-.075em;padding:32px 0 38px}
.workshop-type>span{font-weight:400;font-size:.78em;letter-spacing:-.065em}
.workshop-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.workshop-bottom>span{font-size:10px;line-height:1.7;text-align:right}
.workshop-mark{width:46px;height:46px;color:#7b4329}
.story-workify{padding-bottom:100px}
#screenshot-dialog{padding:0;border:0;width:min(94vw,1450px);max-width:94vw;max-height:90svh;overflow:auto;background:var(--paper)}
#screenshot-dialog::backdrop{background:#141f1ae8}
#screenshot-dialog>img{width:100%;height:auto;max-height:88svh;object-fit:contain}
.dialog-close{position:sticky;top:12px;left:calc(100% - 54px);z-index:2;margin-bottom:-46px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:var(--ink);color:white;border:1px solid #ffffff60;border-radius:50%}
.dialog-open{overflow:hidden}
.case-masthead{animation:wordmark-in .8s var(--ease) both}
.case-lead{animation:content-in .8s var(--ease) .12s both}
@media(min-width:1700px){.case-lead{padding-bottom:55px}.case-promise>p:not(.eyebrow){font-size:15px;max-width:420px}.case-hero-art{max-width:1050px;justify-self:end;width:100%}}
@media(max-width:1050px){.case-masthead h1{font-size:13vw}.case-lead{gap:4vw;grid-template-columns:.9fr 1.3fr}.case-promise h2{font-size:3.4vw}.case-promise>p:not(.eyebrow){font-size:12px;margin-top:16px}.case-promise>.eyebrow{font-size:8px;margin-bottom:14px}.case-promise>.button{margin-top:20px}.case-story{gap:35px;grid-template-columns:.8fr 2fr}.case-capabilities article{gap:24px;grid-template-columns:.12fr 1fr 1fr}.case-capabilities article>p{font-size:12px}.case-app{gap:5vw}.app-gallery{gap:20px}.app-gallery .screenshot-link{border-width:4px;border-radius:19px}.app-copy{padding-top:15px}.workshop{padding:22px}.showcase-heading>p{max-width:230px}}
@media(max-width:720px){
.case-breadcrumb{padding:14px 0;gap:16px;font-size:9px;flex-wrap:wrap}.case-breadcrumb .status{gap:5px}.case-breadcrumb>span:not(.status){display:none}
.case-masthead{padding:20px 0 24px;align-items:flex-start}.case-masthead h1{font-size:20vw;line-height:1;letter-spacing:-.075em}.case-masthead>.eyebrow{display:none}
.case-lead{grid-template-columns:1fr;gap:26px;padding:0 0 20px}.case-promise{padding:0}.case-promise>.eyebrow{font-size:8px;margin-bottom:13px}.case-promise h2{font-size:clamp(28px,7.5vw,47px);line-height:1.14}.case-promise>p:not(.eyebrow){font-size:12px;margin-top:16px;line-height:1.75;max-width:390px}.case-promise>.button{margin-top:18px;font-size:10px;padding:10px 15px}
.case-hero-art{padding:10px 5px 2px}.hero-screen,.hero-screen img{border-radius:5px}.case-hero-art>figcaption{font-size:8px;margin-top:20px}
.art-seepegel{padding:5px 16% 12px 0}.hero-map{border-width:3px;border-radius:4px}.hero-phone{width:24%;border-width:3px;border-radius:11px;right:2%;bottom:12%}.art-seepegel>figcaption{max-width:80%;margin-top:18px;font-size:8px}
.case-hero-foot{font-size:8px;gap:15px;padding:13px 0}.case-hero-foot>a{font-size:0;gap:0;flex-shrink:0}.case-hero-foot .icon{width:16px;height:16px}
.case-story{padding:58px var(--pad) 35px;grid-template-columns:1fr;gap:28px}.story-label{padding:0}.story-label>span{display:none}.case-story h2{font-size:clamp(32px,8.7vw,53px)}.case-story>div>p{font-size:12px;line-height:1.9;margin-top:22px}.case-credit{gap:20px;margin-top:26px;padding-top:16px;font-size:9px}
.case-capabilities{padding-bottom:50px}.case-capabilities article{grid-template-columns:26px 1fr;column-gap:12px;row-gap:14px;padding:25px 0}.capability-index{grid-row:1/3;font-size:11px}.case-capabilities article>p{grid-column:2;padding-top:0;font-size:12px;max-width:none}.case-capabilities h3{font-size:27px;margin-top:7px}.case-capabilities .eyebrow{font-size:8px}
.case-showcase{padding:48px var(--pad) 24px}.showcase-heading{display:block;margin-bottom:28px}.showcase-heading .eyebrow{margin-bottom:22px}.showcase-heading h2{font-size:clamp(30px,8.5vw,50px)}.showcase-heading>p{font-size:11px;margin-top:22px;max-width:none}.showcase-image{margin:0 -8px}.showcase-image figcaption{font-size:8px;margin-top:13px}.showcase-bottom{align-items:flex-start;flex-direction:column;gap:18px;font-size:9px;margin-top:26px;padding-top:22px}
.case-app{padding:50px var(--pad);grid-template-columns:1fr;gap:35px}.app-copy{position:static;padding-top:0}.app-copy h2{font-size:clamp(37px,10vw,55px);margin-top:22px}.app-copy>p:not(.eyebrow){font-size:12px;max-width:380px;margin-top:20px}.app-copy .button{margin-top:22px}.app-footnote{margin-top:22px;font-size:8px}.app-footnote>br{display:none}.app-gallery{gap:17px;width:100%;max-width:480px;justify-self:center}.app-gallery figure:last-child{margin-top:50px}.app-gallery .screenshot-link{border-width:3px;border-radius:15px}.app-gallery figcaption{font-size:8px;margin-top:13px}
.next-project{grid-template-columns:1fr auto;padding:38px var(--pad);gap:22px}.next-project>.eyebrow{grid-column:1/-1;font-size:9px}.next-name{font-size:15vw}.next-project .round-arrow{width:44px;height:44px}
.workshop{padding:20px}.workshop-top{font-size:8px}.workshop-type{font-size:16vw;padding:28px 0}.workshop-bottom>span{font-size:8px}.workshop-mark{width:34px;height:34px}.story-workify{padding-bottom:60px}
.zoom-label{display:none}
}
@media(prefers-reduced-motion:reduce){.case-masthead,.case-lead{animation:none}.hero-screen,.hero-map,.hero-phone{transform:none}.app-copy{position:static}}
@media(min-width:721px) and (max-height:820px){.case-masthead{padding:12px 0}.case-masthead h1{font-size:9vw}.case-hero-art{max-width:610px}.case-lead{padding-bottom:20px}}
