html,body{margin:0;padding:0}
a{color:#5939F5}a:hover{color:#4527d4}
.cs-page a{text-decoration:none}

/* ===== 1. Hero ===== */
.cs-hero{background:#FFFFFF;margin-top:80px;padding:40px 0 60px;min-height:0;display:block}
.cs-hero__inner{max-width:1400px;margin:0 auto;padding:0 260px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px}
.cs-hero__h1{margin:0;font-family:var(--font-display);font-weight:var(--fw-halbfett);font-size:60px;line-height:1.1;letter-spacing:-1.8px;color:#050E1E;text-wrap:balance}
.cs-hero__sub{margin:0;font-family:"Epilogue",var(--font-body);font-weight:500;font-size:20px;line-height:1.4;letter-spacing:-0.2px;color:#050E1E;text-wrap:pretty}

/* ===== 3. Client list ===== */
.cs-cl{background:#FFFFFF}
.cs-cl__row{position:relative;overflow:hidden;background:#FFFFFF;border-top:1px solid #050E1E;transition:background 300ms ease;display:block;color:#050E1E;text-decoration:none;cursor:pointer}
.cs-cl__row:hover,.cs-cl__row:focus{color:#050E1E}
.cs-cl__row:not(a){cursor:default}
.cs-cl__row:last-child{border-bottom:1px solid #050E1E}
.cs-cl__inner{display:flex;gap:190px;align-items:stretch}
.cs-cl__text{flex:0 0 565px;width:565px;box-sizing:border-box;padding:60px 0 60px 80px;display:flex;flex-direction:column;align-items:flex-start;gap:20px;position:relative;z-index:1}
.cs-cl__tagrow{display:flex}
.cs-cl__tag{display:inline-block;padding:4px 8px;border-radius:0;font-family:var(--font-display);font-weight:400;font-size:14px;line-height:1;color:#050E1E;background:#F2F2F2;transition:background 300ms ease}
.cs-cl__name{margin:0;font-family:var(--font-display);font-weight:400;font-size:40px;line-height:1.1;letter-spacing:-1.2px;color:#050E1E;transition:color 300ms ease}
.cs-cl__desc{margin:0;font-family:"Epilogue",var(--font-body);font-weight:400;font-size:16px;line-height:1.4;color:#050E1E;transition:color 300ms ease;text-wrap:pretty}
.cs-cl__more{display:inline-flex;align-items:center;gap:8px;margin-top:4px;font-family:var(--font-display);font-weight:600;font-size:16px;line-height:1;letter-spacing:-0.16px;color:#050E1E;transition:color 300ms ease}
.cs-cl__more svg{display:block;transition:transform 200ms ease}
.cs-cl__more:hover svg{transform:translateX(3px)}
.cs-cl__media{flex:1 1 auto;min-width:0;position:relative}
.cs-cl__imgwrap{position:absolute;left:0;right:80px;top:60px;bottom:0;overflow:hidden}
.cs-cl__img{display:block;width:100%;height:100%;object-fit:cover;transform:translateY(100%);transition:transform 500ms cubic-bezier(0.16,1,0.3,1)}
/* hover: ONLY the image slides up — no background/text/chip change */
.cs-cl__row:hover .cs-cl__img,.cs-cl__row:not(a) .cs-cl__img{transform:translateY(0)}

/* ===== 4. Share-your-story CTA ===== */
.cs-share{position:relative;overflow:hidden;background:#050E1E;padding:120px 0 200px}
.cs-share .fa-container{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
.cs-share__text{max-width:688px;margin:0 auto;display:flex;flex-direction:column;gap:20px;text-align:center;color:#FFFFFF}
.cs-share__h2{margin:0;font-family:var(--font-display);font-weight:var(--fw-halbfett);font-size:40px;line-height:1.0;color:#FFFFFF;text-wrap:balance}
.cs-share__body{margin:0;font-family:"Epilogue",sans-serif;font-weight:400;font-size:16px;line-height:1.5;letter-spacing:-0.16px;color:#FFFFFF;text-wrap:pretty}
.cs-share__btn{margin-top:40px;display:inline-flex;align-items:center;justify-content:center;padding:15px 20px;background:#FCEB4E;color:#050E1E;border:0;border-radius:0;box-shadow:none;font-family:var(--font-display);font-weight:var(--fw-halbfett);font-size:18px;line-height:1.2;letter-spacing:-0.18px;cursor:pointer;transition:background-color 200ms ease}
.cs-share__btn:hover,.cs-share__btn:focus-visible,.cs-share__btn:active{background:#50DDA4;color:#050E1E !important;opacity:1;text-decoration:none}
.cs-share__btn:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px}
.cs-share__img{position:absolute;z-index:1;height:auto;display:block;pointer-events:none;user-select:none;--py:0px;transform:translate3d(0,var(--py),0);will-change:transform}
.cs-share__img--1{left:15%;top:65px;width:12.6%}
.cs-share__img--3{right:17%;top:48px;width:12.9%}
.cs-share__img--2{left:21%;bottom:40px;width:12.9%;transform:translate3d(0,var(--py),0) rotate(-4.73deg)}
.cs-share__img--4{right:10%;bottom:56px;width:13.85%;transform:translate3d(0,var(--py),0) rotate(-4.73deg)}

/* ===== 5. Case-study slide-in panel ===== */
.csp-overlay{position:fixed;inset:0;z-index:10000;background:rgba(5,14,30,0.5);opacity:0;visibility:hidden;transition:opacity 300ms ease,visibility 0s linear 300ms}
.csp-overlay.is-open{opacity:1;visibility:visible;transition:opacity 300ms ease,visibility 0s}
.csp{position:fixed;inset:0;margin:auto;z-index:10001;width:min(1000px,calc(100vw - 32px));height:min(600px,calc(100vh - 32px));background:#FFFFFF;overflow:hidden;opacity:0;transform:translateY(16px);visibility:hidden;transition:opacity 300ms ease,transform 300ms ease,visibility 0s linear 300ms}
.csp.is-open{opacity:1;transform:translateY(0);visibility:visible;transition:opacity 300ms ease,transform 300ms ease,visibility 0s}
.csp__mascot{position:absolute;left:0;top:0;bottom:0;width:calc(100% - 600px);height:100%;box-sizing:border-box;padding:24px 24px 0;object-fit:contain;object-position:center bottom;z-index:0;pointer-events:none;user-select:none}
.csp__card{position:absolute;top:0;right:0;bottom:0;width:600px;max-width:100%;z-index:1;background:#FFFFFF;overflow:hidden}
@media (max-width:999px){.csp{width:min(600px,calc(100vw - 32px))}.csp__mascot{display:none}.csp__card{width:100%}}
.csp__scroll{position:absolute;inset:0;z-index:1;overflow-y:auto;overscroll-behavior:contain}
.csp__inner{padding:40px 80px 40px 40px;display:flex;flex-direction:column;gap:40px;box-sizing:border-box}
.csp__close{position:absolute;top:40px;right:40px;z-index:3;width:48px;height:48px;border-radius:50%;border:0;padding:0;background:#50DDA4;color:#050E1E;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color 200ms ease}
.csp__close:hover{background:#3fcf95}
.csp__close:focus-visible{outline:2px solid #5939F5;outline-offset:3px}
.csp__close svg{width:24px;height:24px;display:block}
.csp__intro{display:flex;flex-direction:column;gap:20px;padding-right:64px}
.csp__h{margin:0;font-family:var(--font-display);font-weight:var(--fw-halbfett);font-size:24px;line-height:1.0;color:#050E1E}
.csp__body{margin:0;font-family:"Epilogue",sans-serif;font-weight:400;font-size:16px;line-height:1.4;letter-spacing:-0.16px;color:#050E1E}
.csp__form{display:flex;flex-direction:column;gap:28px}
.csp__field{display:flex;flex-direction:column;gap:12px}
.csp__label{font-family:"Epilogue",sans-serif;font-weight:400;font-size:16px;line-height:1.4;color:#050E1E}
.csp__input{display:block;width:100%;box-sizing:border-box;height:48px;padding:9px 16px;background:#F6F6F6;border:0;border-radius:0;box-shadow:none;font-family:"Epilogue",sans-serif;font-weight:400;font-size:16px;line-height:1.4;color:#050E1E;-webkit-appearance:none;appearance:none}
.csp__input::placeholder{color:rgba(5,14,30,0.7);opacity:1}
.csp__input:focus{outline:2px solid #5939F5;outline-offset:0}
.csp__input--area{height:140px;resize:vertical;vertical-align:top}
.csp__selwrap{position:relative}
.csp__select{padding-right:48px;cursor:pointer}
.csp__select.is-empty{color:rgba(5,14,30,0.7)}
.csp__select option{color:#050E1E}
.csp__caret{position:absolute;right:16px;top:50%;transform:translateY(-50%);pointer-events:none;color:#050E1E}
.csp__check{display:flex;align-items:center;gap:12px;cursor:pointer}
.csp__check input{position:absolute;opacity:0;width:1px;height:1px}
.csp__box{flex:0 0 24px;width:24px;height:24px;border-radius:6px;box-sizing:border-box;border:2px solid #50DDA4;background:#FFFFFF;display:flex;align-items:center;justify-content:center;color:#FFFFFF;transition:background-color 150ms ease}
.csp__box svg{opacity:0}
.csp__check input:checked + .csp__box{background:#50DDA4}
.csp__check input:checked + .csp__box svg{opacity:1}
.csp__check input:focus-visible + .csp__box{outline:2px solid #5939F5;outline-offset:2px}
.csp__checklabel{font-family:"Epilogue",sans-serif;font-weight:400;font-size:14px;line-height:1.4;color:#050E1E}
.csp__submit{width:100%;padding:15px 20px;background:#5939F5;color:#F5F5F5;border:0;border-radius:0;box-shadow:none;font-family:var(--font-display);font-weight:var(--fw-halbfett);font-size:18px;line-height:1.2;letter-spacing:-0.18px;cursor:pointer;transition:background-color 200ms ease}
.csp__submit:hover,.csp__submit:focus-visible,.csp__submit:active{background:#4527d4;color:#F5F5F5}
.csp__submit:focus-visible{outline:2px solid #050E1E;outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  .csp,.csp.is-open,.csp-overlay,.csp-overlay.is-open{transition:none;transform:none}
}
@media (max-width:600px){
  .csp{width:calc(100vw - 24px);height:min(600px,calc(100vh - 24px))}
  .csp__inner{padding:24px 20px}
  .csp__close{top:24px;right:20px}
}

/* Tablet: side-by-side but image always shown (touch has no hover) */
@media (max-width:1199px){
  .cs-hero{padding:40px 0 60px}
  .cs-hero__inner{padding:0 40px}
  .cs-hero__h1{font-size:48px;letter-spacing:-1.4px}
  .cs-cl__inner{gap:56px}
  .cs-cl__text{flex-basis:46%;width:46%;padding:48px 0 48px 40px}
  .cs-cl__img{transform:translateY(0)}
  .cs-share{padding:80px 0 120px}
  .cs-share__img{display:none}
}
/* Mobile: stack text over image; image always visible, auto height */
@media (max-width:767px){
  .cs-hero{padding:48px 0}
  .cs-hero__inner{padding:0 16px}
  .cs-hero__h1{font-size:34px;letter-spacing:-1px}
  .cs-hero__sub{font-size:18px}
  .cs-cl__inner{flex-direction:column;gap:0}
  .cs-cl__text{flex:none;width:100%;padding:36px 20px}
  .cs-cl__name{font-size:28px;letter-spacing:-0.8px}
  .cs-cl__media{width:100%;flex:none}
  .cs-cl__imgwrap{position:static;top:auto;right:auto;bottom:auto;height:auto;overflow:visible}
  .cs-cl__img{position:static;transform:none;height:auto;width:100%}
  .cs-share{padding:60px 0 80px}
  .cs-share__h2{font-size:32px}
}

/* The shared trust pattern has a lighter, compact presentation on this index. */
.fa-social.fa-social--case-studies{background:#fff;padding:0 0 64px;color:#050e1e}
.fa-social--case-studies .fa-social__wrap{gap:28px}
.fa-social--case-studies .fa-social__head{gap:16px;max-width:760px}
.fa-social--case-studies .fa-social__title{color:#050e1e;font-size:20px;line-height:1.45;letter-spacing:-.3px}
.fa-social--case-studies .fa-social__rating{color:#050e1e;flex-wrap:wrap;justify-content:center;gap:10px}
.fa-social--case-studies .fa-social__muted{flex-basis:auto;font-size:16px;opacity:.75}
.fa-social--case-studies .fa-logo-item__mark{background-color:#050e1e}
.fa-social--case-studies .fa-logo-item{opacity:.7}
@media(max-width:640px){.fa-social.fa-social--case-studies{padding-bottom:40px}.fa-social--case-studies .fa-social__title{font-size:18px}.fa-social--case-studies .fa-social__wrap{gap:24px}}
