.case-hero{padding:65px 0 0;overflow:hidden}.case-hero h1{font-size:clamp(42px,5vw,70px)}.case-hero h1 span{color:var(--mint)}.case-intro{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin:35px 0 55px}.case-intro>p{font-size:19px;color:#d2d0e5}.case-facts{display:grid;gap:16px;border-left:1px solid #393454;padding-left:35px}.case-facts span{font-size:9px;letter-spacing:1.5px;color:#aaa4c7}.case-facts b{display:block;color:white;font-size:14px;letter-spacing:0;margin-top:3px}.case-hero-image{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center;background:#201b4c;border-radius:18px 18px 0 0;padding:40px 45px 0;max-height:500px;overflow:hidden}.case-hero-image>img{width:100%;height:auto;border-radius:10px 10px 0 0;align-self:start}.case-hero-image>div{padding-bottom:35px}.case-hero-image h2{font-size:32px}.case-hero-image p{font-size:15px}.case-opening{display:grid;grid-template-columns:1fr 1fr;gap:75px}.case-opening h2{font-size:36px}.case-route{padding:50px 0}.case-route h2{font-size:30px}.route-links{display:flex;flex-wrap:wrap;gap:10px}.route-links a{background:white;border:1px solid var(--line);border-radius:30px;padding:9px 17px;font-size:12px;font-weight:bold}.route-links a:hover{border-color:#269f89;color:#228875}.route-note{font-size:12px;max-width:800px;margin:23px 0 0}.case-step:nth-of-type(2n){background:var(--soft)}.step-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:85px;align-items:start}.step-number{display:block;font-size:55px;color:#94b4aa;line-height:1;margin-bottom:22px;font-weight:bold;letter-spacing:-2px}.step-copy{position:sticky;top:130px}.step-copy h2{font-size:35px}.step-copy p{font-size:15px}.build-lesson{border-left:3px solid var(--mint);padding:5px 0 5px 20px;margin-top:30px}.build-lesson>span{font-size:9px;letter-spacing:1.7px;color:#248b78;font-weight:bold}.build-lesson p{font-size:15px;font-weight:bold;color:var(--ink);margin:9px 0 0}.case-step figure{margin:0;min-width:0}.image-zoom{padding:0;display:block;width:100%;border:1px solid #dfe5ee;background:#f5f6f7;border-radius:12px;overflow:hidden;box-shadow:0 16px 40px #11103f09}.image-zoom img{width:100%;height:auto;display:block}.image-zoom>span{display:block;background:white;padding:11px;color:#258a78;font-size:11px;text-align:right}.case-step figcaption{font-size:10px;color:#777184;margin-top:13px}.case-cta{text-align:center}.case-cta p:not(.eyebrow){max-width:620px;margin:0 auto 28px}.case-return{display:block;margin:24px 0 0;font-size:13px}.back-link{font-size:13px}.image-dialog{width:min(1000px,calc(100% - 24px));max-height:95vh;padding:42px 15px 15px;overflow:auto}.image-dialog>img{display:block;max-width:100%;height:auto;margin:auto}.image-dialog>p{text-align:center;font-size:11px;margin:14px 0 0}.image-dialog .close-dialog{position:sticky;display:block;margin-left:auto;top:0;background:white;z-index:1;border-radius:50%;width:34px;height:34px;line-height:1}.case-opening p{font-size:15px}@media(max-width:800px){.case-hero{padding-top:40px}.case-hero h1{font-size:45px;letter-spacing:-2px}.case-intro{grid-template-columns:1fr;gap:20px;margin-bottom:35px}.case-intro>p{font-size:17px}.case-facts{grid-template-columns:repeat(3,1fr);padding-left:0;border-left:0;gap:15px}.case-facts b{font-size:11px}.case-hero-image{gap:25px;padding:25px 25px 0;max-height:370px}.case-hero-image h2{font-size:25px}.case-hero-image p{font-size:12px}.case-hero-image .eyebrow{font-size:9px}.case-opening{grid-template-columns:1fr;gap:10px}.step-layout{grid-template-columns:1fr;gap:25px}.step-copy{position:static}.step-number{font-size:42px}.step-copy h2{font-size:30px}.case-step figure{max-width:650px;width:100%;margin:auto}.back-link{font-size:11px}.case-opening h2{font-size:32px}}@media(max-width:480px){.case-hero-image{grid-template-columns:1fr;max-height:none;padding:25px;gap:22px}.case-hero-image>img{max-height:310px;object-fit:cover;object-position:top;border-radius:7px}.case-hero-image>div{padding-bottom:0}.case-hero-image p{font-size:14px}.case-hero-image h2{font-size:27px}.case-facts{grid-template-columns:1fr;gap:12px}.case-hero h1{font-size:41px}.route-links a{font-size:11px;padding:8px 13px}.case-route h2{font-size:27px}.case-opening h2{font-size:30px}.back-link{max-width:100px;text-align:right;line-height:1.4}}

.real-case-art img{width:86%;height:auto;align-self:start;margin-top:24px;transform:rotate(-4deg);border-radius:6px;box-shadow:0 12px 30px #11103f12}.real-case-art .art-tag{background:#ece7f3;padding:5px 0}
