.so-cases-grid{display:flex;flex-direction:column;gap:var(--so-block-gap,32px);header{align-items:center;display:flex;flex-wrap:wrap;gap:var(--so-block-gap,32px);justify-content:space-between;:is(h2,.button-wrapper){margin:0}};&.has-kapiataal-color{header{.button.primary{background-color:var(--kapitaal-color-bg);color:var(--kapitaal-color-text)}}}.cases-grid{display:grid;gap:var(--so-block-gap,32px);grid-template-columns:repeat(4,1fr);.read-more{align-items:center;color:var(--so-color-navy,#090a31);display:flex;font-size:14px;font-weight:600;gap:8px;line-height:18px;text-decoration:underline;&:before{content:"";inset:0;position:absolute}&:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='10' fill='none' viewBox='0 0 6 10'%3E%3Cpath fill='%23000' d='M0 9.115.885 10l5-5-5-5L0 .885 4.115 5z'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:container;content:"";display:block;height:12px;transition:var(--so-transition-speed) ease all;width:12px}@media (pointer:fine){&:hover{text-decoration:none;&:after{margin-left:4px}}}}.case-card{background-color:rgba(0,0,0,.3);display:flex;flex-direction:column;gap:24px;overflow:hidden;padding:24px;position:relative;&:before{background-color:rgba(0,0,0,.3);content:"";inset:0;position:absolute;z-index:1}nav{margin-bottom:auto;position:relative;z-index:2;ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;li{display:flex;height:fit-content;.blog-post-tag-link{height:28px}.blog-post-tag-link.post-type{background-color:var(--so-color-green);color:var(--so-color-white);&:hover{background-color:var(--so-color-forest-green)}&.cases{background-color:#5e4f9c;&:hover{background-color:#2a214e}}&.whitepapers{background-color:#00a0de;&:hover{background-color:#252647}}&.events{background-color:#b2338c;&:hover{background-color:#753060}}}.blog-post-tag-link:not(.post-type){background-color:transparent;border:1px solid var(--so-color-white);color:var(--so-color-white);&:hover{background-color:var(--so-color-white);color:var(--so-color-navy)}}}}}h3{color:var(--so-color-white,#fff);margin:0;position:relative;z-index:1}img{height:100%;inset:0;object-fit:cover;object-position:center;position:absolute;width:100%;z-index:0}.read-more{color:var(--so-color-white,#fff);z-index:1;&:before{content:"";inset:0;position:absolute;z-index:1}&:after{display:none}}&:first-of-type{order:1}&:last-of-type{grid-column:span 2;order:3}}.content-column{display:flex;flex-direction:column;gap:var(--so-block-gap,32px);order:2;.video-card{aspect-ratio:1/1;background-color:#252647;overflow:hidden;position:relative;width:100%;video{height:100%;inset:0;object-fit:cover;object-position:center;position:absolute;transform:scale(1.4);width:100%}&:has(video){background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath stroke-dasharray='16' stroke-dashoffset='16' d='M12 3a9 9 0 0 1 9 9'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' dur='0.3s' values='16;0'/%3E%3CanimateTransform attributeName='transform' dur='1.5s' repeatCount='indefinite' type='rotate' values='0 12 12;360 12 12'/%3E%3C/path%3E%3Cpath stroke-dasharray='64' stroke-dashoffset='64' stroke-opacity='.3' d='M12 3a9 9 0 1 1-.001 18.001A9 9 0 0 1 12 3'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' dur='1.2s' values='64;0'/%3E%3C/path%3E%3C/g%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:32px}a{align-items:flex-end;display:flex;inset:0;padding:24px;position:absolute;text-indent:-9999px;z-index:1;&:before{aspect-ratio:1/1;background-color:var(--so-color-white,#fff);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='12' fill='none' viewBox='0 0 10 12'%3E%3Cpath fill='%230c0c0c' d='M9.75 5.629 0 11.259V-.002z'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:12px;content:"";transform-origin:left bottom;transition:all var(--so-transition-speed) ease;width:48px}@media (pointer:fine){&:hover:before{background-color:var(--so-color-green);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='12' fill='none' viewBox='0 0 10 12'%3E%3Cpath fill='%23fff' d='M9.75 5.629 0 11.259V-.002z'/%3E%3C/svg%3E");transform:scale(1.1)}}}}.content-card{align-items:flex-start;aspect-ratio:1/1;background-color:var(--so-color-mint-mist,#d6ebe0);color:var(--so-color-navy,#090a31);display:flex;flex-direction:column;gap:16px;justify-content:flex-end;padding:24px;position:relative;width:100%;>img{filter:brightness(0);height:100%;margin-bottom:auto;max-height:32px;max-width:138px;object-fit:contain;object-position:left center;width:100%}>p{margin:8px 0 0}}}@media screen and (max-width:1140px){gap:16px;.content-column{gap:16px}}@media screen and (max-width:760px){grid-template-columns:repeat(2,1fr);.case-card:first-of-type,.content-column{grid-column:span 2}.case-card{aspect-ratio:4/3}.content-column{flex-direction:row;>*{flex:0 0 calc(50% - var(--so-block-gap, 32px)/2)}.content-card,.video-card{aspect-ratio:unset}}}@media screen and (max-width:460px){.content-column{.content-card,.video-card a{padding:16px}}.case-card{padding:16px}}}}.color-white .so-cases-grid header .button.outline{border-color:var(--so-color-white,#fff);color:var(--so-color-white,#fff)}