.case-story *{box-sizing: border-box;}
.case-story{margin: 0px; color: var(--ink); font: 15px / 1.7 Manrope, Arial, sans-serif; background: rgb(255, 255, 255);}
.case-story a{color: inherit; text-decoration: none;}
.case-story button{font: inherit; cursor: pointer;}

.case-story .head{display: flex; align-items: center; gap: 24px; min-height: 94px;}
.case-story .logo{font-size: 36px; font-weight: 800; letter-spacing: -2px;}
.case-story .contact{margin-left: auto; line-height: 1.5;}
.case-story .contact strong{display: block;}
.case-story .contact small{color: var(--muted); font-size: 11px;}
.case-story .social{border: 1px solid var(--line); padding: 9px 14px; border-radius: 6px; font-size: 12px;}
.case-story .btn{display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; background: var(--yellow); padding: 14px 22px; border: 0px; border-radius: 6px; font-weight: 800; font-size: 13px;}
.case-story .btn:hover{background: rgb(244, 214, 0);}
.case-story .nav{display: flex; gap: 32px; padding: 15px 0px; border-top: 1px solid var(--line); font-size: 13px;}
.case-story .nav .audit{margin-left: auto; font-weight: 700;}
.case-story .tag{font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase; font-weight: 700;}
.case-story .hero{background: var(--ink); color: white; padding: 32px 0px 64px; overflow: hidden;}
.case-story .crumb{color: rgb(185, 190, 203); font-size: 12px; margin-bottom: 48px;}
.case-story .hero-grid{display: grid; grid-template-columns: 1.15fr 1fr; gap: 65px; align-items: center;}
.case-story h1{font-size: clamp(38px, 4.6vw, 66px); line-height: 1.08; letter-spacing: -3px; margin: 22px 0px;}
.case-story h1 em{font-style: normal; color: var(--yellow);}
.case-story .lead{font-size: 17px; line-height: 1.8; color: rgb(191, 198, 212); max-width: 550px;}
.case-story .direct{width: 166px; display: block; margin-top: 30px;}
.case-story .art{position: relative; background: var(--yellow); height: 410px; clip-path: polygon(12% 0px, 100% 0px, 100% 88%, 88% 100%, 0px 100%, 0px 12%); color: var(--ink); padding: 32px; isolation: isolate;}
.case-story .art svg{width: 100%; height: 285px;}
.case-story .art-top{display: flex; justify-content: space-between; font-size: 10px; letter-spacing: 1.5px;}
.case-story .art-bottom{position: absolute; bottom: 28px; left: 30px; right: 30px; display: flex; justify-content: space-between; align-items: center; font-size: 12px;}
.case-story .art-bottom strong{font-size: 24px; letter-spacing: -1px;}
.case-story .stats{display: grid; grid-template-columns: 1fr 1fr 1fr; margin-top: 55px; border-top: 1px solid rgba(255, 255, 255, 0.19); padding-top: 30px;}
.case-story .stat{padding: 0px 30px; border-left: 1px solid rgba(255, 255, 255, 0.19);}
.case-story .stat:first-child{padding-left: 0px; border: 0px;}
.case-story .stat b{font-size: 52px; letter-spacing: -2px; line-height: 1.2; display: block; color: var(--yellow);}
.case-story .stat span{color: rgb(197, 202, 213); font-size: 13px;}
.case-story .jump{border-bottom: 1px solid var(--line); background: rgb(255, 255, 255);}
.case-story .jump .wrap{display: flex; gap: 34px; padding-top: 18px; padding-bottom: 18px; font-size: 12px;}
.case-story .jump a:hover{color: rgb(102, 88, 0);}
.case-story .section{padding: 88px 0px;}
.case-story h2{font-size: clamp(30px, 3vw, 43px); line-height: 1.2; letter-spacing: -1.6px; margin: 14px 0px 25px;}
.case-story h3{font-size: 21px; line-height: 1.4; letter-spacing: -0.5px; margin: 14px 0px;}
.case-story p{margin: 0px 0px 16px;}
.case-story .split{display: grid; grid-template-columns: 1fr 1fr; gap: 90px;}
.case-story .muted{color: var(--muted);}
.case-story .large{font-size: 19px; line-height: 1.8;}
.case-story .facts{display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); margin-top: 34px;}
.case-story .facts div{padding: 22px 12px 0px 0px;}
.case-story .facts b{font-size: 29px; display: block;}
.case-story .facts span{font-size: 13px; color: var(--muted);}
.case-story .problem{padding: 30px; background: rgb(244, 245, 247); border-radius: 12px;}
.case-story .problem ol{padding-left: 22px; margin: 20px 0px 0px;}
.case-story .problem li{padding: 12px 0px 12px 8px; border-top: 1px solid var(--line);}
.case-story .gray{background: rgb(245, 246, 248);}
.case-story .section-top{display: flex; justify-content: space-between; gap: 30px; align-items: end; margin-bottom: 34px;}
.case-story .section-top p{max-width: 340px; color: var(--muted);}
.case-story .flow{display: grid; grid-template-columns: 1fr 45px 1.35fr 45px 1fr; align-items: center;}
.case-story .flow-card{border: 1px solid var(--line); padding: 25px; background: white; min-height: 238px; border-radius: 10px;}
.case-story .flow-card.accent{background: var(--ink); color: rgb(255, 255, 255); border: 0px;}
.case-story .flow-card .num{color: rgb(137, 144, 160); font-size: 11px;}
.case-story .flow-card p{font-size: 13px; color: var(--muted);}
.case-story .flow-card.accent p{color: rgb(191, 198, 212);}
.case-story .arrow{text-align: center; font-size: 25px;}
.case-story .chips{display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px;}
.case-story .chips span{padding: 6px 9px; border: 1px solid rgba(255, 255, 255, 0.208); border-radius: 4px; font-size: 10px;}
.case-story .caption{font-size: 11px; color: var(--muted); margin-top: 15px;}
.case-story .work{display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 34px; margin-top: 54px;}
.case-story .work article{border-top: 2px solid var(--ink); padding-top: 16px;}
.case-story .work .number{font-size: 12px; color: var(--muted);}
.case-story .work p{font-size: 14px; color: var(--muted);}
.case-story .results{background: var(--ink); color: white;}
.case-story .results .tag{color: var(--yellow);}
.case-story .charts{display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 40px;}
.case-story .chart{border: 1px solid rgba(255, 255, 255, 0.145); border-radius: 12px; padding: 30px;}
.case-story .chart-title{display: flex; justify-content: space-between; align-items: start; gap: 10px;}
.case-story .chart-title h3{margin: 0px;}
.case-story .delta{color: var(--yellow); font-size: 37px; line-height: 1; font-weight: 800;}
.case-story .row{margin-top: 22px;}
.case-story .row-label{display: flex; justify-content: space-between; color: rgb(197, 202, 213); font-size: 12px; margin-bottom: 7px;}
.case-story .bar{height: 35px; background: rgb(105, 112, 132); border-radius: 3px; display: flex; align-items: center; padding-left: 12px; font-size: 12px;}
.case-story .bar.after{background: var(--yellow); color: var(--ink); font-weight: 800;}
.case-story .results .caption{color: rgb(170, 179, 195); margin-top: 22px; max-width: 780px;}
.case-story .takeaway{display: grid; grid-template-columns: 70px 1fr; gap: 25px; align-items: start; margin-top: 44px;}
.case-story .takeaway .icon{font-size: 44px; color: var(--yellow);}
.case-story .takeaway p{max-width: 750px; color: rgb(190, 197, 212);}
.case-story .editor-note{border: 1px dashed rgb(198, 204, 214); padding: 20px 24px; border-radius: 8px; margin-top: 32px; font-size: 13px; color: rgb(102, 112, 131);}
.case-story .editor-note strong{color: var(--ink);}
.case-story details{border-bottom: 1px solid var(--line); padding: 22px 0px;}
.case-story summary{font-weight: 700; cursor: pointer;}
.case-story details p{color: var(--muted); margin: 16px 0px 0px;}
.case-story .cta{background: var(--yellow); border-radius: 15px; padding: 48px; display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: center;}
.case-story .cta h2{margin-top: 0px;}
.case-story .cta .btn{background: var(--ink); color: rgb(255, 255, 255);}
.case-story .footer{padding: 25px 0px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px;}
.case-story .preview{background: rgb(243, 244, 246); border-bottom: 1px solid rgb(228, 229, 233); text-align: center; font-size: 11px; padding: 7px 16px; color: rgb(107, 114, 131);}
.case-story .preview a{text-decoration: underline;}
.case-story .footer .wrap{display: flex; justify-content: space-between;}
.case-story a:focus-visible,.case-story summary:focus-visible{outline: rgb(127, 105, 240) solid 3px; outline-offset: 5px;}
@media (max-width: 800px){
.case-story .head{flex-wrap: wrap; gap: 10px; padding-top: 15px; padding-bottom: 15px;}
.case-story .logo{font-size: 29px;}
.case-story .contact{font-size: 13px;}
.case-story .social{padding: 8px 12px;}
.case-story .head > .btn{margin-left: auto;}
.case-story .nav{gap: 20px; overflow: auto; white-space: nowrap;}
.case-story .nav .audit{display: none;}
.case-story .hero-grid,.case-story .split,.case-story .cta{grid-template-columns: 1fr; gap: 30px;}
.case-story h1{letter-spacing: -1.7px;}
.case-story .hero{padding-bottom: 35px;}
.case-story .crumb{margin-bottom: 28px;}
.case-story .art{height: 340px; max-width: 520px; width: 100%; margin: auto;}
.case-story .art svg{height: 225px;}
.case-story .stats{margin-top: 32px;}
.case-story .stat{padding: 0px 12px;}
.case-story .stat b{font-size: 35px;}
.case-story .stat span{font-size: 11px;}
.case-story .jump .wrap{gap: 22px; overflow: auto; white-space: nowrap;}
.case-story .section{padding: 52px 0px;}
.case-story .section-top{display: block;}
.case-story .flow{grid-template-columns: 1fr;}
.case-story .flow-card{min-height: 0px;}
.case-story .arrow{transform: rotate(90deg); height: 40px;}
.case-story .work,.case-story .charts{grid-template-columns: 1fr;}
.case-story .work{gap: 20px; margin-top: 35px;}
.case-story .chart{padding: 22px;}
.case-story .cta{padding: 28px; gap: 12px;}
.case-story .takeaway{grid-template-columns: 40px 1fr; gap: 12px;}
.case-story .footer .wrap{gap: 16px; flex-wrap: wrap;}
.case-story .lead{font-size: 16px;}
.case-story .art-bottom strong{font-size: 21px;}
}
@media (prefers-reduced-motion: reduce){}
.case-story .hero{background: rgb(32, 35, 50); padding: 32px 0px 50px; position: relative;}
.case-story .hero::before{content: ""; position: absolute; inset: 0px; background: radial-gradient(at 85% 40%, rgba(66, 73, 65, 0.208), transparent 48%); pointer-events: none;}
.case-story .hero > .wrap{position: relative;}
.case-story .hero-grid{grid-template-columns: 1.15fr 1fr; gap: 50px;}
.case-story h1{font-size: clamp(40px, 4.65vw, 66px); font-weight: 800; line-height: 1.12; letter-spacing: -3px;}
.case-story .lead{font-size: 16px; max-width: 545px; color: rgb(183, 191, 206);}
.case-story .hero .tag{color: rgb(210, 216, 227);}
.case-story .direct{margin-top: 25px;}
.case-story .crumb{margin-bottom: 28px;}
.case-story .stats{margin-top: 30px; padding-top: 24px;}
.case-story .stat b{font-size: 48px;}
.case-story .catalog-art{height: 480px; position: relative; isolation: isolate; perspective: 1200px;}
.case-story .orbit{position: absolute; border: 1px solid rgba(255, 255, 255, 0.047); border-radius: 50%; width: 420px; height: 420px; left: 30px; top: 30px;}
.case-story .orbit-two{width: 520px; height: 520px; left: -20px; top: -20px;}
.case-story .back-sheet{position: absolute; width: 320px; height: 350px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 18px; left: 90px; top: 48px; background: rgb(44, 48, 65);}
.case-story .sheet-one{transform: rotate(14deg) translate(14px, -5px);}
.case-story .sheet-two{transform: rotate(6deg); background: rgb(58, 62, 75);}
.case-story .catalog-sheet{position: absolute; left: 40px; right: 38px; top: 24px; min-height: 361px; border-radius: 16px; background: rgb(242, 243, 238); color: rgb(35, 39, 56); padding: 26px 30px; transform: rotate(-5deg); box-shadow: rgba(0, 0, 0, 0.2) 0px 25px 60px; border: 1px solid rgb(255, 255, 255);}
.case-story .sheet-head{display: flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 800; letter-spacing: 1.3px; padding-bottom: 19px; border-bottom: 1px solid rgba(35, 39, 56, 0.125);}
.case-story .sheet-dot{height: 7px; width: 7px; border-radius: 50%; background: rgb(39, 43, 56);}
.case-story .sheet-arrow{margin-left: auto; font-size: 20px; line-height: 1;}
.case-story .sheet-title{font-size: 23px; line-height: 1.2; font-weight: 800; letter-spacing: -0.8px; margin-top: 20px;}
.case-story .sheet-title span{color: rgb(129, 134, 128);}
.case-story .catalog-count{font-size: 82px; font-weight: 800; letter-spacing: -6px; line-height: 1.15; margin-top: 5px;}
.case-story .catalog-count > span{font-size: 46px; vertical-align: top; margin-left: 6px;}
.case-story .count-label{font-size: 12px; color: rgb(119, 126, 130); margin: 0px 0px 20px;}
.case-story .data-row{display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid rgba(35, 39, 56, 0.106); padding: 9px 0px; font-size: 10px;}
.case-story .data-row > span{color: rgb(106, 114, 128);}
.case-story .result-ticket{position: absolute; bottom: 28px; right: 0px; width: 255px; background: rgb(255, 229, 43); color: rgb(36, 39, 56); padding: 18px 23px; display: flex; gap: 18px; align-items: center; transform: rotate(4deg); box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 40px; border-radius: 10px;}
.case-story .ticket-icon{width: 48px; height: 48px; border: 1px solid rgba(36, 39, 56, 0.25); border-radius: 50%; display: grid; place-items: center; font-size: 33px;}
.case-story .result-ticket div > span{font-size: 10px; display: block;}
.case-story .result-ticket strong{font-size: 48px; line-height: 1.12; letter-spacing: -2px;}
.case-story .result-ticket strong span{font-size: 30px;}
.case-story .ticket-dot{position: absolute; right: 10px; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: rgb(36, 39, 56);}
.case-story .art-footnote{position: absolute; bottom: 0px; left: 30px; color: rgb(146, 154, 170); font-size: 8px; letter-spacing: 1.3px;}
.case-story .section{padding: 95px 0px;}
.case-story .section h2{font-weight: 800; font-size: 44px; line-height: 1.15; letter-spacing: -1.9px;}
.case-story .tag{color: rgb(129, 136, 153); letter-spacing: 1.6px; font-size: 10px;}
.case-story .large{font-size: 17px;}
.case-story .problem{background: rgb(241, 242, 244); padding: 34px; border-radius: 16px; position: relative;}
.case-story .problem::before{content: ""; position: absolute; top: 0px; left: 34px; width: 45px; height: 4px; background: rgb(255, 229, 43);}
.case-story .problem h3{font-size: 29px; line-height: 1.2; font-weight: 800; letter-spacing: -1px;}
.case-story .problem li{font-size: 13px;}
.case-story .facts b{font-size: 30px; letter-spacing: -1px;}
.case-story .flow-card{box-shadow: rgba(36, 39, 56, 0.02) 0px 10px 30px; border-radius: 14px; min-height: 260px; padding: 30px;}
.case-story .flow-card.accent{background: rgb(255, 229, 43); color: rgb(36, 39, 56); transform: translateY(-12px);}
.case-story .flow-card.accent p,.case-story .flow-card.accent .num{color: rgb(111, 104, 45);}
.case-story .chips span{border-color: rgba(36, 39, 56, 0.19); font-size: 11px;}
.case-story .flow-card h3{font-size: 24px; font-weight: 800;}
.case-story .work{gap: 45px;}
.case-story .work article{border-top: 1px solid rgb(187, 193, 203);}
.case-story .work h3{font-size: 22px; font-weight: 800;}
.case-story .work .number{font-size: 10px; letter-spacing: 1px;}
.case-story .results{background: rgb(240, 241, 237); color: rgb(36, 39, 56); position: relative;}
.case-story .results .tag{color: rgb(115, 122, 131);}
.case-story .results h2{font-size: 64px; letter-spacing: -3px;}
.case-story .chart{border: 0px; background: rgb(255, 255, 255); border-radius: 16px; padding: 32px;}
.case-story .chart-title{margin-bottom: 35px;}
.case-story .delta{background: rgb(255, 229, 43); color: rgb(36, 39, 56); font-size: 29px; border-radius: 40px; padding: 10px 16px;}
.case-story .chart h3{font-size: 19px;}
.case-story .chart h3 .muted{font-size: 12px; font-weight: 500; letter-spacing: 0px;}
.case-story .row-label{color: rgb(119, 127, 138);}
.case-story .bar{height: 43px; background: rgb(223, 226, 231); color: rgb(81, 91, 107); border-radius: 4px;}
.case-story .bar.after{background: rgb(36, 39, 56); color: rgb(255, 255, 255);}
.case-story .results .caption{color: rgb(124, 132, 144); font-size: 11px;}
.case-story .takeaway{border-top: 1px solid rgb(207, 212, 211); padding-top: 28px;}
.case-story .takeaway .icon{color: rgb(36, 39, 56); background: rgb(255, 229, 43); border-radius: 50%; width: 56px; height: 56px; display: grid; place-items: center; font-size: 28px;}
.case-story .takeaway p{color: rgb(116, 124, 136);}
.case-story .takeaway h3{font-weight: 800;}
.case-story .cta{padding: 50px 55px; border-radius: 18px; background: rgb(255, 229, 43); position: relative; overflow: hidden;}
.case-story .cta h2{font-size: 42px;}
.case-story .cta .tag{color: rgb(110, 100, 28);}
.case-story .cta p{font-size: 14px;}
.case-story .editor-note{font-size: 11px; background: rgb(250, 250, 250);}
.case-story .jump{position: sticky; top: 0px; z-index: 3; box-shadow: rgba(36, 39, 56, 0.016) 0px 4px 16px;}
.case-story .jump a{padding: 2px 0px;}
.case-story .jump a:hover{color: rgb(36, 39, 56); text-decoration: underline rgb(220, 197, 0); text-underline-offset: 7px;}
.case-story .btn{transition: background 0.2s, transform 0.2s;}
.case-story .btn:hover{transform: translateY(-2px);}
@media (max-width: 800px){.case-story .hero-grid{grid-template-columns: 1fr; gap: 12px;}
.case-story .hero{padding-top: 22px;}
.case-story .hero h1{font-size: 42px; letter-spacing: -2px;}
.case-story .catalog-art{max-width: 460px; width: 100%; height: 445px; margin: 16px auto 0px;}
.case-story .catalog-sheet{left: 20px; right: 30px; padding: 23px; top: 20px;}
.case-story .catalog-count{font-size: 70px;}
.case-story .back-sheet{left: 50px; width: 270px;}
.case-story .result-ticket{right: 0px; bottom: 26px; width: 220px; padding: 14px 18px;}
.case-story .result-ticket strong{font-size: 42px;}
.case-story .art-footnote{left: 12px; font-size: 7px;}
.case-story .orbit{width: 320px; height: 320px; left: 0px;}
.case-story .orbit-two{width: 340px; height: 340px; left: 0px;}
.case-story .section{padding: 58px 0px;}
.case-story .section h2{font-size: 34px; letter-spacing: -1.5px;}
.case-story .section.results h2{font-size: 47px; letter-spacing: -2px;}
.case-story .flow-card{min-height: 0px; padding: 26px;}
.case-story .flow-card.accent{transform: none;}
.case-story .stats{gap: 0px;}
.case-story .stat b{font-size: 34px;}
.case-story .stat{padding: 0px 10px;}
.case-story .stat span{font-size: 10px;}
.case-story .cta{padding: 28px;}
.case-story .cta h2{font-size: 32px;}
.case-story .takeaway{grid-template-columns: 45px 1fr;}
.case-story .takeaway .icon{width: 40px; height: 40px;}
.case-story .problem{padding: 27px;}
.case-story .chart{padding: 24px;}
.case-story .delta{font-size: 26px; padding: 9px 13px;}
.case-story .work{gap: 24px;}
.case-story .sheet-title{font-size: 23px;}
.case-story .hero .lead{font-size: 15px;}
}
@media (max-width: 360px){.case-story .hero h1{font-size: 36px;}
.case-story .catalog-sheet{left: 8px; right: 18px;}
.case-story .catalog-count{font-size: 64px;}
.case-story .catalog-art{height: 438px;}
.case-story .back-sheet{width: 230px; left: 30px;}
.case-story .orbit,.case-story .orbit-two{width: 280px; height: 280px;}
.case-story .result-ticket{width: 210px;}
.case-story .stat b{font-size: 29px;}
.case-story .section.results h2{font-size: 40px;}
}
@media (prefers-reduced-motion: reduce){.case-story .btn{transition: none;}
.case-story .btn:hover{transform: none;}
}
.case-story .flow-card{min-width: 0px; overflow-wrap: anywhere;}
@media (max-width: 360px){.case-story .flow-card{padding: 22px;}
.case-story .flow-card h3{font-size: 21px;}
}
.case-story .hero .tag::before{content: ""; display: inline-block; width: 7px; height: 7px; background: rgb(255, 229, 43); border-radius: 50%; margin-right: 10px; vertical-align: 1px;}
.case-story .catalog-sheet{background: linear-gradient(130deg, rgb(255, 255, 255) 0%, rgb(240, 241, 235) 70%, rgb(233, 236, 229) 100%);}
.case-story .catalog-bars{display: inline-flex; gap: 3px; height: 14px; align-items: stretch; float: right;}
.case-story .catalog-bars i{display: block; width: 2px; background: rgb(36, 39, 56); opacity: 0.5;}
.case-story .catalog-bars i:nth-child(3n){width: 5px;}
.case-story .catalog-bars i:nth-child(4n){opacity: 0.2;}
.case-story .result-ticket{background: rgb(255, 229, 43); border: 1px solid rgb(255, 229, 43);}
.case-story .sheet-head{border-bottom-style: dashed;}
.case-story .art-footnote{font-size: 9px;}
.case-story .stat{position: relative;}
.case-story .stat b{font-variant-numeric: tabular-nums;}
.case-story .stat:first-child::after{content: "↘"; position: absolute; right: 28px; top: 0px; font-size: 27px; color: rgb(117, 125, 141);}
.case-story .stat:nth-child(2)::after{content: "↗"; position: absolute; right: 28px; top: 0px; font-size: 27px; color: rgb(117, 125, 141);}
.case-story .section > .wrap > .tag,.case-story .split > div > .tag,.case-story .section-top > div > .tag{display: inline-flex; align-items: center; gap: 12px;}
.case-story .section > .wrap > .tag::before,.case-story .split > div > .tag::before,.case-story .section-top > div > .tag::before{content: ""; display: block; width: 24px; height: 2px; background: rgb(176, 182, 191);}
.case-story .section-top > div > .tag::before{background: rgb(212, 187, 0);}
.case-story .facts{border-top: 0px; gap: 12px;}
.case-story .facts > div{background: rgb(245, 246, 248); border: 1px solid rgb(236, 238, 242); border-radius: 10px; padding: 22px;}
.case-story .facts > div:first-child{background: rgb(255, 229, 43); border-color: rgb(255, 229, 43);}
.case-story .problem{box-shadow: rgba(34, 39, 56, 0.02) 0px 15px 45px;}
.case-story .problem ol{list-style: none; counter-reset: issues 0; padding: 0px;}
.case-story .problem li{counter-increment: issues 1; padding-left: 35px; position: relative;}
.case-story .problem li::before{content: "0" counter(issues); position: absolute; left: 0px; top: 15px; font-size: 10px; color: rgb(140, 148, 162); font-weight: 700;}
.case-story .flow-card{position: relative; transition: transform 0.2s, box-shadow 0.2s;}
.case-story .flow-card::after{content: "↗"; position: absolute; right: 24px; top: 23px; font-size: 21px; color: rgb(175, 181, 190);}
.case-story .flow-card.accent::after{color: rgb(108, 97, 19);}
.case-story .flow-card:hover{transform: translateY(-5px); box-shadow: rgba(36, 39, 56, 0.047) 0px 15px 35px;}
.case-story .flow-card.accent:hover{transform: translateY(-17px);}
.case-story .flow-card .num{font-size: 10px; letter-spacing: 1.2px;}
.case-story .flow .arrow{color: rgb(155, 163, 174); font-size: 21px;}
.case-story .flow-card.accent{box-shadow: rgba(168, 152, 0, 0.125) 0px 15px 35px;}
.case-story .work article{position: relative; padding-top: 24px;}
.case-story .work .number{background: rgb(255, 255, 255); padding: 5px 9px; border: 1px solid rgb(224, 227, 232); border-radius: 4px;}
.case-story .results{overflow: hidden;}
.case-story .results::before{content: ""; position: absolute; right: -90px; top: -190px; width: 490px; height: 490px; border: 1px solid rgba(36, 39, 56, 0.03); border-radius: 50%; box-shadow: rgba(36, 39, 56, 0.008) 0px 0px 0px 60px, rgba(36, 39, 56, 0.008) 0px 0px 0px 120px; pointer-events: none;}
.case-story .results > .wrap{position: relative;}
.case-story .chart{box-shadow: rgba(36, 39, 56, 0.016) 0px 10px 30px; border: 1px solid rgb(228, 231, 226);}
.case-story .row{position: relative;}
.case-story .bar{position: relative; overflow: hidden;}
.case-story .bar.after::after{content: ""; position: absolute; right: 9px; top: 9px; height: 25px; width: 3px; background: rgb(255, 229, 43); border-radius: 2px;}
.case-story .chart-title h3{position: relative; padding-left: 15px;}
.case-story .chart-title h3::before{content: ""; position: absolute; left: 0px; top: 5px; width: 4px; height: 35px; background: rgb(255, 229, 43); border-radius: 2px;}
.case-story .takeaway{margin-top: 34px;}
.case-story .cta::after{content: "↗"; position: absolute; right: 22px; bottom: -65px; font-size: 260px; line-height: 1; font-weight: 400; color: rgba(36, 39, 56, 0.03); pointer-events: none;}
.case-story .cta > div{position: relative; z-index: 1;}
.case-story .cta .btn:hover{background: rgb(57, 62, 83);}
.case-story .jump a{position: relative;}
.case-story .jump a.is-active{font-weight: 800;}
.case-story .jump a.is-active::after{content: ""; position: absolute; height: 3px; background: rgb(238, 211, 30); bottom: -19px; left: 0px; right: 0px;}
.case-story .jump a:hover{text-decoration: none;}
.case-story .catalog-art:hover .catalog-sheet{transform: rotate(-3deg) translateY(-3px);}
.case-story .catalog-sheet{transition: transform 0.4s;}
.case-story .result-ticket{transition: transform 0.4s;}
.case-story .catalog-art:hover .result-ticket{transform: rotate(1deg) translateY(-4px);}
@media (max-width: 800px){.case-story .facts{gap: 10px;}
.case-story .facts > div{padding: 18px 12px;}
.case-story .facts b{font-size: 25px;}
.case-story .stat:first-child::after,.case-story .stat:nth-child(2)::after{display: none;}
.case-story .flow-card.accent:hover{transform: translateY(-5px);}
.case-story .work .number{font-size: 9px;}
.case-story .art-footnote{font-size: 7px;}
.case-story .results::before{right: -300px;}
.case-story .cta::after{font-size: 210px; bottom: -55px;}
.case-story .hero h1{font-size: 38px; letter-spacing: -1.9px;}
.case-story .hero .lead{line-height: 1.75;}
.case-story .chart-title h3{font-size: 18px;}
.case-story .jump a.is-active::after{bottom: -19px;}
}
@media (max-width: 360px){.case-story .hero h1{font-size: 33px; letter-spacing: -1.5px;}
.case-story .facts b{font-size: 23px;}
.case-story .facts span{font-size: 11px;}
}
@media (prefers-reduced-motion: reduce){.case-story .catalog-sheet,.case-story .result-ticket,.case-story .flow-card{transition: none;}
.case-story .catalog-art:hover .catalog-sheet{transform: rotate(-5deg);}
.case-story .catalog-art:hover .result-ticket{transform: rotate(4deg);}
.case-story .flow-card:hover{transform: none;}
.case-story .flow-card.accent:hover{transform: translateY(-12px);}
}
.case-story .case-icon{display: inline-flex; width: 46px; height: 46px; align-items: center; justify-content: center; background: rgb(255, 255, 255); border: 1px solid rgb(223, 227, 233); color: rgb(36, 39, 56); border-radius: 12px; flex-shrink: 0;}
.case-story .case-icon svg{width: 25px; height: 25px;}
.case-story .facts .case-icon{margin-bottom: 22px;}
.case-story .facts > div:first-child .case-icon{background: rgb(36, 39, 56); border-color: rgb(36, 39, 56); color: rgb(255, 229, 43);}
.case-story .facts > div:first-child span:not(.case-icon){color: rgb(81, 76, 40);}
.case-story .facts > div{padding: 24px;}
.case-story .facts b{font-size: 29px;}
.case-story .flow-icon{display: flex; margin: 23px 0px 18px; background: rgb(243, 244, 246); border-color: rgb(228, 231, 235); width: 54px; height: 54px; border-radius: 13px;}
.case-story .flow-card.accent .flow-icon{background: rgb(36, 39, 56); border-color: rgb(36, 39, 56); color: rgb(255, 229, 43);}
.case-story .flow-icon svg{width: 29px; height: 29px;}
.case-story .flow-card{min-height: 325px;}
.case-story .flow-card h3{margin-top: 0px;}
.case-story .work-top{display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 22px;}
.case-story .work-top .case-icon{border: 0px; background: rgb(232, 235, 239); width: 44px; height: 44px;}
.case-story .work h3{margin-top: 0px;}
.case-story .work article:hover .work-top .case-icon{background: rgb(255, 229, 43);}
.case-story .problem li::before{background: rgb(36, 39, 56); color: rgb(255, 255, 255); border-radius: 5px; width: 24px; height: 24px; display: grid; place-items: center; top: 14px;}
.case-story .problem li{padding-left: 38px;}
.case-story .catalog-sheet{background: linear-gradient(130deg, rgb(255, 255, 255), rgb(239, 241, 244));}
.case-story .results{background: rgb(241, 243, 245);}
.case-story .catalog-bars i{background: rgb(36, 39, 56);}
.case-story .sheet-title span{color: rgb(124, 133, 146);}
@media (max-width: 800px){.case-story .flow-card{min-height: 0px;}
.case-story .flow-icon{margin: 20px 0px 15px;}
.case-story .facts > div{padding: 18px 14px;}
.case-story .facts b{font-size: 25px;}
.case-story .case-icon{width: 40px; height: 40px;}
.case-story .case-icon svg{width: 23px; height: 23px;}
.case-story .work-top{margin-bottom: 15px;}
.case-story .facts .case-icon{margin-bottom: 15px;}
}
.case-story .review-nav{display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; background: rgb(236, 238, 242); padding: 12px 18px;}
.case-story .review-nav a{border: 1px solid rgb(216, 220, 227); border-radius: 6px; padding: 8px 13px; font-size: 11px; background: rgb(255, 255, 255);}
.case-story .review-nav a[aria-current]{background: rgb(36, 39, 56); color: rgb(255, 255, 255); border-color: rgb(36, 39, 56);}
.case-story .review-nav a:hover{border-color: rgb(36, 39, 56);}
.case-story .catalog-count{font-size: 70px;}
.case-story .hero h1{font-size: clamp(36px, 4.1vw, 59px);}
.case-story .outcome-grid{display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; margin-top: 35px;}
.case-story .outcome-major{background: rgb(36, 39, 56); color: rgb(255, 255, 255); border-radius: 16px; padding: 36px;}
.case-story .outcome-major strong{font-size: 70px; letter-spacing: -3px; color: rgb(255, 229, 43); display: block; line-height: 1.3;}
.case-story .outcome-major p{color: rgb(191, 198, 212);}
.case-story .outcome-list{background: white; border-radius: 16px; padding: 28px;}
.case-story .outcome-list h3{display: flex; gap: 15px; align-items: center;}
.case-story .outcome-list p{color: rgb(116, 125, 140); font-size: 14px;}
.case-story .catalog-count > span{font-size: 30px;}
.case-story .ticket-icon{flex-shrink: 0;}
.case-story .result-ticket strong{white-space: nowrap;}
.case-story .result-ticket{width: 270px;}
.case-story .result-ticket strong{font-size: 42px;}
@media (max-width: 800px){.case-story .review-nav{justify-content: flex-start; flex-wrap: nowrap; overflow: auto;}
.case-story .review-nav a{white-space: nowrap;}
.case-story .hero h1{font-size: 37px;}
.case-story .outcome-grid{grid-template-columns: 1fr;}
.case-story .outcome-major strong{font-size: 58px;}
.case-story .result-ticket{width: 245px;}
.case-story .catalog-count{font-size: 62px;}
}
@media (max-width: 360px){.case-story .hero h1{font-size: 32px;}
}
.case-story .result-board{display: grid; grid-template-columns: 1fr 1fr; gap: 0px; margin-top: 38px; border-radius: 18px; overflow: hidden; background: rgb(36, 39, 56); color: white;}
.case-story .result-tile{padding: 36px 38px; position: relative; min-width: 0px;}
.case-story .result-tile + .result-tile{border-left: 1px solid rgba(255, 255, 255, 0.145);}
.case-story .result-tile .result-top{display: flex; align-items: center; justify-content: space-between; color: rgb(173, 182, 199); font-size: 10px; letter-spacing: 1.3px;}
.case-story .result-tile .result-symbol{width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.208); border-radius: 50%; font-size: 25px; color: rgb(255, 229, 43);}
.case-story .result-tile .result-value{display: block; font-size: clamp(60px, 6.6vw, 94px); line-height: 1.15; letter-spacing: -5px; font-weight: 800; margin: 26px 0px 17px; color: rgb(255, 229, 43);}
.case-story .result-tile h3{font-size: 23px; margin: 0px 0px 12px; color: white;}
.case-story .result-tile p{font-size: 14px; max-width: 370px; color: rgb(184, 193, 208); margin: 0px;}
.case-story .result-tile:nth-child(2){background: rgb(255, 229, 43); color: rgb(36, 39, 56);}
.case-story .result-tile:nth-child(2) .result-value,.case-story .result-tile:nth-child(2) h3{color: rgb(36, 39, 56);}
.case-story .result-tile:nth-child(2) p,.case-story .result-tile:nth-child(2) .result-top{color: rgb(81, 75, 44);}
.case-story .result-tile:nth-child(2) .result-symbol{color: rgb(36, 39, 56); border-color: rgba(36, 39, 56, 0.25);}
.case-story .results .result-source{font-size: 11px; color: rgb(124, 132, 144); margin-top: 16px;}
.case-story .related-cases{padding: 0px 0px 65px;}
.case-story .related-cases h2{font-size: 28px;}
.case-story .related-links{display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;}
.case-story .related-links a{padding: 20px; border: 1px solid rgb(220, 224, 231); border-radius: 9px; font-weight: 700; font-size: 14px; display: flex; justify-content: space-between; gap: 14px;}
.case-story .related-links a:hover{background: rgb(255, 229, 43); border-color: rgb(255, 229, 43);}
@media (max-width: 800px){.case-story .result-board{grid-template-columns: 1fr;}
.case-story .result-tile{padding: 28px;}
.case-story .result-tile + .result-tile{border: 0px;}
.case-story .result-tile .result-value{font-size: 66px; letter-spacing: -3px;}
.case-story .related-links{grid-template-columns: 1fr;}
.case-story .related-cases{padding-bottom: 45px;}
}
@media (max-width: 360px){.case-story .result-tile .result-value{font-size: 57px;}
.case-story .result-tile h3{font-size: 21px;}
}
.case-story .deep-dive{padding: 80px 0px; background: rgb(255, 255, 255);}
.case-story .deep-heading{max-width: 900px;}
.case-story .deep-heading h2{font-size: 43px; line-height: 1.18; letter-spacing: -1.5px;}
.case-story .deep-heading > p{max-width: 760px; font-size: 17px; color: rgb(119, 128, 144);}
.case-story .logic-stage{display: grid; grid-template-columns: 1fr 1.2fr; margin: 36px 0px; border-radius: 18px; overflow: hidden; border: 1px solid rgb(225, 229, 235);}
.case-story .logic-poster{background: rgb(36, 39, 56); color: rgb(255, 255, 255); padding: 36px; position: relative; overflow: hidden;}
.case-story .logic-poster::after{content: "↗"; position: absolute; font-size: 180px; right: -12px; bottom: -55px; color: rgba(255, 255, 255, 0.03); pointer-events: none;}
.case-story .logic-poster .tag{color: rgb(170, 181, 199);}
.case-story .logic-poster h3{font-size: 36px; line-height: 1.25; letter-spacing: -1.2px; margin: 28px 0px; color: rgb(255, 229, 43);}
.case-story .logic-poster .logic-symbol{display: grid; place-items: center; width: 58px; height: 58px; background: rgb(255, 229, 43); color: rgb(36, 39, 56); border-radius: 14px; font-size: 30px; margin-top: 30px;}
.case-story .logic-axis{background: rgb(245, 246, 248); padding: 15px 32px;}
.case-story .logic-row{display: grid; grid-template-columns: 35px 1fr; gap: 16px; padding: 22px 0px; border-bottom: 1px solid rgb(220, 225, 232);}
.case-story .logic-row:last-child{border: 0px;}
.case-story .logic-number{width: 30px; height: 30px; background: rgb(255, 229, 43); border-radius: 7px; display: grid; place-items: center; font-size: 11px; font-weight: 800;}
.case-story .logic-row h3{margin: 0px 0px 8px; font-size: 18px;}
.case-story .logic-row p{color: rgb(120, 129, 142); font-size: 14px; margin: 0px;}
.case-story .decision-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;}
.case-story .decision{padding: 25px; border: 1px solid rgb(224, 229, 235); border-radius: 13px;}
.case-story .decision .decision-mark{font-size: 24px; color: rgb(36, 39, 56); display: flex; justify-content: space-between; align-items: center;}
.case-story .decision-mark small{font-size: 10px; letter-spacing: 1px; color: rgb(139, 148, 162);}
.case-story .decision h3{font-size: 21px; margin: 20px 0px 15px;}
.case-story .decision p{font-size: 14px; color: rgb(116, 128, 142); line-height: 1.9;}
.case-story .analysis-panel{margin: 40px 0px 0px; padding: 34px; border-radius: 15px; border: 1px solid rgb(216, 221, 229); background: rgb(255, 255, 255);}
.case-story .analysis-panel > h3{font-size: 26px; margin: 0px 0px 26px;}
.case-story .measure-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;}
.case-story .measure-grid article{border-top: 3px solid rgb(255, 229, 43); padding-top: 16px;}
.case-story .measure-grid h4{font-size: 16px; margin: 0px 0px 12px;}
.case-story .measure-grid p{font-size: 13px; color: rgb(124, 132, 147); margin: 0px;}
.case-story .analysis-summary{display: flex; align-items: flex-start; gap: 15px; border-top: 1px solid rgb(224, 228, 234); margin-top: 28px; padding-top: 24px;}
.case-story .analysis-summary span{width: 30px; height: 30px; display: grid; place-items: center; flex-shrink: 0; border-radius: 50%; background: rgb(255, 229, 43);}
.case-story .analysis-summary p{font-size: 14px; color: rgb(103, 113, 128); margin: 0px;}
.case-story .deep-note{font-size: 11px; color: rgb(138, 146, 160); margin-top: 18px;}
@media (max-width: 800px){.case-story .deep-dive{padding: 50px 0px;}
.case-story .deep-heading h2{font-size: 32px;}
.case-story .deep-heading > p{font-size: 15px;}
.case-story .logic-stage,.case-story .decision-grid,.case-story .measure-grid{grid-template-columns: 1fr;}
.case-story .logic-poster{padding: 28px;}
.case-story .logic-poster h3{font-size: 30px;}
.case-story .logic-axis{padding: 10px 24px;}
.case-story .decision{padding: 24px;}
.case-story .analysis-panel{padding: 24px;}
.case-story .analysis-panel > h3{font-size: 23px;}
.case-story .measure-grid{gap: 22px;}
.case-story .decision-grid{gap: 15px;}
}

.case-story{font-family:inherit}.case-story .hero{margin:0}.case-story .btn{font-family:inherit}.case-story .direct{height:auto}.case-story .related-cases{margin-top:45px}
.case-story .case-breadcrumb{color:#b9c1cf;font-size:12px;padding:0 0 30px}.case-story .case-breadcrumb a:hover{text-decoration:underline}.case-story h1,.case-story h2,.case-story h3,.case-story h4{font-family:inherit}.case-story .direct{width:166px;height:auto}.case-story .btn{cursor:pointer}.case-story .related-cases{padding-top:30px}.case-story .section{margin:0}
.case-story .hero{display:block;grid-template-columns:none;gap:0}.case-story .hero h1{max-width:none}.case-story .hero .lead{max-width:545px}

/* Case containers inherit the shared site .wrap grid at every breakpoint. */
/* Units must not inherit the oversized number's negative letter spacing. */
.case-story .catalog-count{white-space:nowrap}
.case-story .catalog-count>span{letter-spacing:0;display:inline-block;line-height:1.2;vertical-align:baseline;margin-left:8px;font-size:30px}
.case-story .result-ticket strong>span{letter-spacing:0;margin-left:4px;white-space:nowrap}
.case-story .data-row{align-items:flex-start}
.case-story .data-row strong{text-align:right}
@media(max-width:540px){.case-story .catalog-count>span{font-size:27px}.case-story .data-row{gap:12px}}
.case-story .stat span{display:block;line-height:1.5;margin-top:8px;font-size:13px}
@media(max-width:800px){.case-story .stat span{font-size:11px;line-height:1.5}}
/* Flow layout keeps the result ticket clear of the catalog's editable rows. */
.case-story .catalog-art{height:auto;min-height:0;padding:16px 0 12px}
.case-story .catalog-sheet{position:relative;inset:auto;margin:12px 38px 0 40px}
.case-story .result-ticket{position:relative;inset:auto;margin:32px 0 0 auto}
@media(max-width:800px){.case-story .catalog-art{height:auto;max-width:460px}.case-story .catalog-sheet{inset:auto;margin:12px 30px 0 20px}.case-story .result-ticket{inset:auto;margin:30px 0 0 auto}}
@media(max-width:360px){.case-story .catalog-sheet{margin-left:8px;margin-right:18px}}