.diensten{display:grid;gap:var(--so-block-gap);grid-template-columns:repeat(3,1fr);@media (width <= 1024px){grid-template-columns:repeat(2,1fr)}@media (width <= 768px){grid-template-columns:repeat(1,1fr)}}.dienst{background-color:var(--so-color-white);border:1px solid #dfe5e9;display:flex;flex-direction:column;min-height:428px;position:relative;transition:var(--so-transition-speed) ease all;&:hover{border:1px solid var(--so-color-navy)}&:hover .dienst-link a:after{background-color:var(--so-color-forest-green)}}.dienst-content{background-color:var(--so-color-mint-mist);border-left:4px solid var(--so-color-white);border-right:4px solid var(--so-color-white);border-top:4px solid var(--so-color-white);display:flex;flex:1;flex-direction:column;padding:24px;h4{margin-bottom:10px;margin-top:12px}p{font-size:16px;margin-top:0}}.dienst-image{align-items:center;background-color:var(--so-color-white);display:flex;height:32px;justify-content:center;padding:8px;width:32px}.dienst-link{align-items:center;color:var(--so-color-navy);display:flex;font-size:14px;font-weight:700;gap:16px;justify-content:space-between;padding:16px 20px 12px;text-decoration:none;&:before{content:"";inset:0;position:absolute;z-index:1}&:after{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='7' height='10' fill='none' viewBox='0 0 7 10'%3E%3Cpath fill='%23fff' d='M3.833 5 0 1.167 1.167 0l5 5-5 5L0 8.833z'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:7px;content:"";height:40px;width:40px}}.dienst-tags{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;margin-top:auto;.dienst-tags-title{color:#757575;font-size:12px;line-height:1.3333333333333;text-transform:uppercase;width:100%}.dienst-tag{background-color:var(--diensten-kleur,var(--so-color-white));color:var(--diensten-tekst-kleur,var(--so-color-navy));display:block;font-size:12px;font-weight:700;letter-spacing:-.01em;padding:3px 8px;text-decoration:none;text-transform:uppercase;width:fit-content;z-index:2;a&{transition:var(--so-transition-speed) ease background-color;&:hover{background-color:var(--diensten-kleur-hover,var(--so-color-white))}}.dienst:not(.dienst-show-all-tags) &.dienst-hidden{display:none}}}p.dienst-more-tags{cursor:pointer;display:flex;gap:4px;margin:12px 0 0;width:fit-content;z-index:2;.dienst.dienst-show-all-tags &{display:none}>span{font-size:14px;letter-spacing:-.01em;text-decoration:underline;&.dienst-more-tags-badge{align-items:center;background-color:var(--diensten-kleur,var(--so-color-green));color:var(--diensten-tekst-kleur,var(--so-color-white));display:flex;font-weight:700;height:24px;justify-content:center;text-decoration:none;transition:var(--so-transition-speed) ease background-color;width:24px}}&:hover .dienst-more-tags-badge{background-color:var(--diensten-kleur-hover,var(--so-color-white))}}