/* One interaction language across the static Omega website. */
.client-mark{position:relative;display:grid;place-items:center;width:100%;height:100%;min-width:0;padding:8px 9px 22px;border-radius:14px 4px 14px 4px;color:var(--navy)}
.client-mark img,.client-logos .client-mark img,.service-clients .client-mark img{grid-area:1/1;width:100%;height:100%;min-height:0;max-width:100%;max-height:100%;object-fit:contain}
.client-name{grid-area:1/1;max-width:100%;text-align:center;font-size:16px;font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.client-link{border:1px solid transparent;transition:border-color .2s,background .2s}
.client-link:hover,.client-link:focus-visible{text-decoration:none;border-color:var(--turquoise);background:var(--white)}
.client-link:active{background:var(--blue-pale);opacity:1}
.client-link-arrow{position:absolute;right:5px;bottom:5px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--blue-pale);transition:background .2s}
.client-link-arrow .icon{width:14px;height:14px}
.client-link-hint{position:absolute;left:10px;bottom:8px;opacity:0;font-size:12px;line-height:1;font-weight:600;color:var(--accent-text);transition:opacity .2s}
.client-link:is(:hover,:focus-visible) .client-link-hint{opacity:1}
.client-link:is(:hover,:focus-visible) .client-link-arrow{background:var(--turquoise)}
.client-logos li{overflow:visible}
.client-logos{grid-template-columns:repeat(var(--client-columns,6),minmax(0,1fr))}
.client-logos .client-mark img{max-width:160px}
.client-mark img[src*="midden-nederland-hallen.svg"]{background:var(--navy);padding:10px;border-radius:4px}
.client-logos .client-mark img[src*="midden-nederland-hallen.svg"]{max-width:140px;max-height:72px}
.client-logos .client-mark img[src*="van-wijnen.png"]{object-fit:cover;max-width:150px}
.client-logos .client-mark img[src*="nbc-events.png"]{object-fit:cover;max-width:125px}
.client-logos .logo-am .client-mark img{max-width:75px;max-height:75px}
.client-logos .logo-client-vanwonen .client-mark img,.service-clients .client-mark img[src*="quote-vanwonen.png"]{object-fit:cover}
.client-logos .client-mark img:is([src*="client-dura-vermeer.png"],[src*="client-amvest.png"],[src*="client-heijmans.png"]){object-fit:cover;max-width:140px}
.service-clients .client-mark img[src*="client-dura-vermeer.png"]{object-fit:cover}
.service-clients li{height:104px}
.service-clients .client-mark{padding:5px 8px 23px}
.client-wall .client-mark{padding:7px 9px 24px}
.client-wall .client-mark img{max-width:154px}

/* A quiet directional response, with the same treatment for keyboard focus. */
.button>.icon,.image-arrow>.icon,.reference-arrow>.icon,.service-list>a>.icon,.service-overview-row>.icon,.related-service>.icon{transition:transform .25s cubic-bezier(.22,.61,.36,1)}
.button:is(:hover,:focus-visible)>.icon,.service-list>a:is(:hover,:focus-visible)>.icon,.service-overview-row:is(:hover,:focus-visible)>.icon,.related-service:is(:hover,:focus-visible)>.icon{transform:translateX(4px)}
.text-link:focus-visible>.icon{transform:translateX(4px)}
.project-card:is(:hover,:focus-within) .image-arrow,.reference-card:is(:hover,:focus-within) .reference-arrow,.article-card:is(:hover,:focus-within) .reference-arrow,.careers-case:is(:hover,:focus-within) .reference-arrow{background:var(--turquoise)}
.project-card:is(:hover,:focus-within) .image-arrow>.icon,.reference-card:is(:hover,:focus-within) .reference-arrow>.icon,.article-card:is(:hover,:focus-within) .reference-arrow>.icon,.careers-case:is(:hover,:focus-within) .reference-arrow>.icon{transform:translateX(2px)}
.service-list>a,.service-overview-row{position:relative;isolation:isolate}
.service-list>a::before,.service-overview-row::before{content:"";position:absolute;z-index:-1;inset:7px -12px;border-radius:var(--radius-photo);background:var(--blue-pale);opacity:0;transition:opacity .25s}
.service-overview-row::before{display:none}
.service-list>a:is(:hover,:focus-visible)::before,.service-overview-row:is(:hover,:focus-visible)::before{opacity:1}
.service-list>a:hover .service-photo{outline:0}
.audience-photo img,.project-image-link img,.reference-image>img,.article-card-image img{transition:transform .65s cubic-bezier(.22,.61,.36,1)}
.audience-card:focus-within .audience-photo img,.project-card:focus-within .project-image-link img,.reference-card:focus-within .reference-image>img,.article-card:focus-within .article-card-image img{transform:scale(1.025)}
.audience-card:focus-within .text-link .icon{background:var(--turquoise)}

@media(hover:hover) and (pointer:fine){
  .audience-card:hover .audience-photo img,.project-card:hover .project-image-link img,.reference-card:hover .reference-image>img,.article-card:hover .article-card-image img{transform:scale(1.025)}
  .audience-card:hover .text-link .icon{background:var(--turquoise)}
}
.article-card:is(:hover,:focus-within) .article-card-graphic img{transform:none}
@media(hover:none){.client-link-hint{opacity:1}}
@media(max-width:900px){
  .client-logos{grid-template-columns:repeat(3,minmax(0,1fr))}
  #clients-municipalities .client-logos{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){.service-clients li{height:84px}}
@media(max-width:540px){
  .client-link-hint{font-size:10px;left:6px;bottom:9px}
  .client-link-arrow{right:3px;bottom:4px;width:22px;height:22px}
  .client-name{font-size:13px}
  .client-wall .client-mark{padding-inline:3px}
}
@media(prefers-reduced-motion:reduce){
  .client-link,.client-link-arrow,.client-link-hint,.button>.icon,.text-link>.icon,.image-arrow>.icon,.reference-arrow>.icon,.service-list>a>.icon,.service-overview-row>.icon,.related-service>.icon,.service-list>a::before,.service-overview-row::before,.audience-photo img,.project-image-link img,.reference-image>img,.article-card-image img{transition:none!important}
  .button:is(:hover,:focus-visible)>.icon,.text-link:is(:hover,:focus-visible)>.icon,.image-arrow>.icon,.reference-arrow>.icon,.service-list>a:is(:hover,:focus-visible)>.icon,.service-overview-row:is(:hover,:focus-visible)>.icon,.related-service:is(:hover,:focus-visible)>.icon,.audience-card:is(:hover,:focus-within) .audience-photo img,.project-card:is(:hover,:focus-within) .project-image-link img,.reference-card:is(:hover,:focus-within) .reference-image>img,.article-card:is(:hover,:focus-within) .article-card-image img{transform:none!important}
}
@media(forced-colors:active){
  .client-link{border-color:LinkText}
  .client-link-arrow{border:1px solid LinkText}
  .client-link-hint{color:LinkText;opacity:1}
  .service-list>a::before,.service-overview-row::before{display:none}
}
