/* Client work uses the same Soft Studio tokens as the rest of the site. */
.selected-work .section-heading { max-width:680px }
.featured-work { display:grid;grid-template-columns:1.45fr 1fr;border:1px solid var(--line);border-radius:30px;overflow:hidden;background:var(--surface) }
.featured-work-visual { position:relative;display:flex;align-items:center;min-height:510px;padding:72px 62px 86px 32px;background:var(--lilac);isolation:isolate }
.featured-work-visual::before { content:"";position:absolute;width:300px;height:300px;border:1px solid color-mix(in srgb,var(--ink),transparent 88%);border-radius:50%;inset:16% auto auto 25%;z-index:-1 }
.work-visual-note { position:absolute;left:32px;top:28px;color:var(--muted);font-size:12px;letter-spacing:.03em }
.work-browser { min-width:0;border:1px solid #30223d20;border-radius:12px;background:#fcf9f5;overflow:hidden;box-shadow:0 20px 40px #30223d15;transform:translateZ(0) }
.work-browser-bar { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;color:#6b6073;background:#fcf9f5;font-size:10px;border-bottom:1px solid #e9e1e8 }
.browser-dots { display:flex;gap:4px }.browser-dots i { width:5px;height:5px;border-radius:50%;background:#c9bdcf }.browser-dots i:first-child { background:#e8b09d }
.work-browser img,.work-phone img { width:100%;height:auto }
.work-phone { width:190px;flex-shrink:0;border:6px solid #30223d;border-radius:26px;overflow:hidden;background:#fcf9f5;box-shadow:0 22px 38px #30223d20 }
.featured-work-visual>.work-browser { width:100%;transform:rotate(-3deg);transition:transform .5s ease }
.featured-work-visual>.work-phone { position:absolute;width:126px;right:25px;bottom:36px;transform:rotate(5deg);transition:transform .5s ease }
@media(hover:hover) and (prefers-reduced-motion:no-preference) { .featured-work-visual:hover>.work-browser { transform:rotate(-1deg) translateY(-5px) }.featured-work-visual:hover>.work-phone { transform:rotate(2deg) translateY(-9px) } }
.featured-work-copy { align-self:center;padding:44px 40px }.featured-work-copy h3 { font-size:clamp(30px,3.3vw,44px);line-height:1.12;margin-block:18px 20px;letter-spacing:-.04em }.featured-work-copy>p { color:var(--muted);font-size:16px;max-width:360px }.featured-work-copy>.text-link { margin-top:28px }
.work-tags { list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:22px 0 0 }.work-tags li { padding:5px 10px;border:1px solid var(--line);border-radius:20px;color:var(--muted);font-size:11px;font-weight:750 }
.case-intro { padding-block:60px 46px }.case-intro>.back-link { margin-bottom:45px }.case-intro h1 { font-size:clamp(40px,5.6vw,72px);line-height:1.12;letter-spacing:-.05em;margin-top:22px;max-width:1000px }.case-intro h1>span { color:var(--display-accent) }.case-intro-bottom { display:flex;align-items:center;justify-content:space-between;gap:40px;margin-top:30px }.case-intro-bottom>p { max-width:690px;color:var(--muted) }.case-intro-bottom .button { flex-shrink:0 }
.case-facts { display:grid;grid-template-columns:repeat(3,1fr);gap:24px;border-top:1px solid var(--line);margin:44px 0 0;padding-top:24px }.case-facts dt { font-size:10px;letter-spacing:.12em;font-weight:850;color:var(--muted) }.case-facts dd { margin:6px 0 0;font-size:14px }
.case-cover { margin-block:0 }.case-cover-stage { padding:48px 60px 0;border-radius:28px;background:var(--lilac);overflow:hidden }.case-cover .work-browser { border-radius:12px 12px 0 0;border-bottom:0 }.case-cover figcaption { font-size:11px;color:var(--muted);margin-top:12px;text-align:center }
.case-story { display:grid;grid-template-columns:1fr 2fr;gap:60px;border-bottom:1px solid var(--line) }.case-story>.eyebrow { margin-top:12px }.case-story h2,.case-section-copy h2 { font-size:clamp(30px,3.5vw,46px);line-height:1.2;letter-spacing:-.035em }.case-story p,.case-section-copy p { color:var(--muted);margin-top:22px;max-width:710px }
.case-detail { padding-top:100px }.case-detail>.case-section-copy { max-width:720px;margin-bottom:40px }.case-section-copy>.eyebrow { margin-bottom:18px }.case-product-stage { margin:0;padding:46px 60px;background:var(--peach);border-radius:28px }.case-features { display:grid;grid-template-columns:repeat(3,1fr);gap:38px;padding-top:46px }.case-feature-mark { display:block;width:23px;color:var(--accent);margin-bottom:18px }.case-feature-mark svg { width:100%;height:31px }.case-features h3 { font-size:20px;margin-bottom:10px }.case-features p { font-size:15px;color:var(--muted) }
.case-mobile { display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center }.case-mobile-stage { position:relative;display:flex;align-items:center;justify-content:center;min-height:630px;background:var(--lilac);border-radius:28px;overflow:hidden;isolation:isolate }.case-mobile-stage>.work-phone { width:205px;transform:rotate(-5deg);z-index:1 }.case-mobile-orbit { position:absolute;width:360px;height:360px;border:1px solid color-mix(in srgb,var(--ink),transparent 85%);border-radius:50% }.case-mobile-sticker { display:flex;align-items:center;gap:14px;position:absolute;bottom:52px;right:23px;padding:15px 19px;border:1px solid var(--line);background:var(--surface);border-radius:16px;transform:rotate(7deg);z-index:2;font-size:14px;font-weight:800 }.case-mobile-sticker svg { width:20px;height:26px;color:var(--accent) }.case-mobile .text-link { margin-top:28px }
.case-cta { text-align:center;padding:65px 30px;margin-bottom:100px;border:1px solid var(--line);border-radius:28px;background:var(--peach) }.case-cta h2 { max-width:750px;margin:18px auto;font-size:clamp(30px,4vw,48px);line-height:1.2 }.case-cta p { max-width:610px;margin:auto;color:var(--muted) }.case-cta .button { margin-top:28px }
@media(max-width:1100px) { .featured-work { grid-template-columns:1.2fr 1fr }.featured-work-visual { min-height:450px;padding-left:24px }.featured-work-copy { padding:32px }.case-intro-bottom { align-items:flex-start;flex-direction:column;gap:24px }.case-mobile { gap:45px }.case-mobile-sticker { right:12px;font-size:12px } }
@media(max-width:800px) { .featured-work { grid-template-columns:1fr }.featured-work-visual { min-height:0;padding:76px 90px 70px 36px }.featured-work-visual>.work-phone { width:145px;right:28px;bottom:24px }.featured-work-copy { padding:32px }.featured-work-copy h3 br { display:none }.featured-work-copy h3 br::after { content:" " }.featured-work-copy>p { max-width:100% }.case-story { grid-template-columns:1fr;gap:24px }.case-features { gap:24px }.case-mobile { gap:30px }.case-mobile-stage { min-height:580px }.case-mobile-stage>.work-phone { width:175px }.case-mobile-sticker { bottom:26px;right:20px }.case-cover-stage,.case-product-stage { padding:30px }.case-cover-stage { padding-bottom:0 } }
@media(max-width:600px) { .selected-work .section-heading { margin-bottom:26px }.featured-work { border-radius:22px }.featured-work-visual { padding:65px 48px 85px 18px }.work-visual-note { left:20px;top:22px;font-size:10px }.featured-work-visual>.work-phone { width:105px;right:14px;bottom:18px;border-width:4px;border-radius:19px }.work-browser { border-radius:8px }.work-browser-bar { padding:7px 9px;font-size:7px;gap:4px }.browser-dots { gap:3px }.browser-dots i { width:4px;height:4px }.featured-work-copy { padding:28px 22px }.featured-work-copy h3 { margin-top:12px }.featured-work-copy>p { font-size:15px }.case-intro { padding-top:32px }.case-intro>.back-link { margin-bottom:30px }.case-intro>.eyebrow { font-size:9px;letter-spacing:.08em }.case-intro h1 { font-size:clamp(34px,8vw,48px) }.case-intro-bottom { margin-top:24px;gap:24px }.case-intro-bottom>p { font-size:16px }.case-facts { grid-template-columns:1fr;gap:17px;margin-top:30px }.case-facts>div { display:grid;grid-template-columns:90px 1fr;gap:10px;align-items:baseline }.case-facts dd { margin:0;font-size:13px }.case-facts dt { font-size:9px }.case-cover-stage { padding:18px 14px 0;border-radius:18px }.case-cover figcaption { font-size:10px;max-width:280px;margin:10px auto 0 }.case-story { padding-block:65px;gap:20px }.case-detail { padding-top:65px }.case-product-stage { padding:20px 14px;border-radius:18px }.case-features { grid-template-columns:1fr;padding-top:30px;gap:26px }.case-features>div { padding-left:38px;position:relative }.case-feature-mark { position:absolute;left:0;top:2px;width:20px }.case-features h3 { font-size:19px }.case-mobile { grid-template-columns:1fr;padding-block:65px;gap:36px }.case-mobile-stage { min-height:590px }.case-mobile-stage>.work-phone { width:190px }.case-mobile-sticker { bottom:40px;right:24px }.case-cta { padding:40px 22px;margin-bottom:65px }.case-cta p { font-size:15px }.case-cta .button { font-size:13px;padding-inline:18px } }