/* Commwiser — who-we-work-with: the audiences overview. The site's own steel; the dark block is on ink. */
.ix--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.ix--5 .ix__c{min-height:clamp(220px,17vw,250px)}
.ix--5 .ix__c h3{font-size:clamp(19px,1.5vw,23px)}
@media (max-width:1179px){.ix--5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.ix--5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.ix--5{grid-template-columns:minmax(0,1fr)}}
/* 02 services by audience: a grid, one dot where an audience draws on a service, in that service's colour */
.mx{margin-top:clamp(26px,2.8vw,40px)}
.mx__r{display:grid;grid-template-columns:minmax(0,1.7fr) repeat(6,minmax(0,1fr));align-items:center;border-bottom:1px solid var(--line)}
.mx__h{align-items:end;border-bottom-color:rgba(21,25,27,.3)}
.mx__h span{padding:0 4px 12px;text-align:center;font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:.12em;line-height:1.3;text-transform:uppercase;color:var(--c,var(--indigo))}
.mx__a{padding:clamp(14px,1.4vw,20px) 0;font-family:var(--display);font-size:clamp(18px,1.45vw,21px);line-height:1.2;color:var(--dust)}
.mx__x{display:grid;place-items:center;height:100%}
.mx__x i{display:block;width:5px;height:5px;border-radius:50%;background:rgba(21,25,27,.18)}
.mx__x.is-yes i{width:20px;height:20px;background:var(--c);box-shadow:0 0 0 5px color-mix(in srgb,var(--c) 14%,transparent)}
.mx__x b{display:none}
.mx__r:nth-child(2){--r:0}.mx__r:nth-child(3){--r:1}.mx__r:nth-child(4){--r:2}.mx__r:nth-child(5){--r:3}.mx__r:nth-child(6){--r:4}
.js .mx__x.is-yes i{scale:0}
.js .mx.is-play .mx__x.is-yes i{scale:1;transition:scale .45s var(--ease) calc(var(--r,0) * .14s + .1s)}
@media print{.js .mx__x.is-yes i{scale:1}}
/* 03 professional services: the model audience, its four sectors */
.ps4{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(28px,3vw,44px)}
.ps4 .tile{--tile:#47364F}
.ps4__say{margin-top:clamp(24px,2.6vw,38px);max-width:60ch;font-size:clamp(17px,1.25vw,18.5px);line-height:1.5;color:rgba(247,242,239,.8)}
@media (max-width:1179px){.ps4{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* phones: the grid becomes one card per audience, its services named */
@media (max-width:700px){
  .mx__r.mx__h{display:none}
  .mx__r{display:flex;flex-wrap:wrap;gap:8px;padding:14px 0 16px}
  .mx__a{flex-basis:100%;padding:0 0 4px}
  .mx__x{display:none}
  .mx__x.is-yes{display:inline-flex;align-items:center;gap:8px;height:auto;padding:6px 10px;border:1px solid var(--line)}
  .mx__x.is-yes i{width:10px;height:10px;box-shadow:none}
  .mx__x b{display:inline;font-family:var(--display);font-weight:400;font-size:15px;color:var(--dust)}
  .ps4{grid-template-columns:minmax(0,1fr)}
}