/* The published case-study destination replaces the retained coming-soon notice. */
@font-face{font-family:"Changeover Tile";font-style:normal;font-weight:400;font-display:swap;src:url("instrument-sans-regular.ttf") format("truetype")}
@font-face{font-family:"Changeover Tile";font-style:normal;font-weight:500 700;font-display:swap;src:url("instrument-sans-medium.ttf") format("truetype")}
#selected-work>#case-study-coming-soon[hidden]{display:none!important}
#selected-work>.changeover-project-cover{
  grid-column:1/-1;flex-basis:100%;width:100%;min-width:0;margin:0;
  box-sizing:border-box;display:block;overflow:hidden;padding:clamp(28px,4.1vw,62px);
  background:#101b2b;color:#f4f5ef;text-decoration:none;text-align:left;
  font-family:"Changeover Tile",Arial,sans-serif;
  transition:background-color .22s ease;
}
#selected-work>.changeover-project-cover+.ict-project-cover{margin-top:0}
.changeover-project-cover .changeover-tile-main{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center;
}
.changeover-project-cover .changeover-tile-copy{min-width:0}
.changeover-project-cover .changeover-tile-kicker{
  display:flex;gap:12px;align-items:center;margin:0;color:#c6d0da;
  font:400 11px/1.5 ui-monospace,"SFMono-Regular",Consolas,monospace;letter-spacing:.07em;text-transform:uppercase;
}
.changeover-tile-kicker>span{color:#81dac8}
.changeover-project-cover #changeover-tile-title{
  margin:23px 0 20px;color:#f4f5ef;text-align:left;
  font:500 clamp(44px,5.6vw,86px)/.99 "Changeover Tile",Arial,sans-serif;letter-spacing:-.058em;
}
.changeover-project-cover #changeover-tile-title>span{color:#d5ff70}
.changeover-project-cover #changeover-tile-summary{
  margin:0;color:#c6d0da;text-align:left;font:400 clamp(18px,1.65vw,24px)/1.4 "Changeover Tile",Arial,sans-serif;letter-spacing:-.015em;
}
.changeover-project-cover .changeover-tile-action{
  display:inline-flex;align-items:center;gap:18px;margin-top:28px;color:#f4f5ef;
  font:500 14px/1.5 "Changeover Tile",Arial,sans-serif;
}
.changeover-tile-action>span{color:#d5ff70;font-size:22px;line-height:1;transition:transform .22s ease}
.changeover-project-cover .changeover-tile-flow{min-width:0;padding-top:14px}
.changeover-tile-flow svg{display:block;width:100%;height:auto;overflow:visible}
.changeover-flow-line{fill:none;stroke:#566779;stroke-width:1.5}
.changeover-flow-junction{fill:#81dac8}
.changeover-flow-owner{fill:#d5ff70}
.changeover-flow-person{fill:#101b2b}
.changeover-flow-owner-text{fill:#101b2b;font:500 10px ui-monospace,"SFMono-Regular",Consolas,monospace;letter-spacing:.03em}
.changeover-flow-output{fill:#152438;stroke:#3b4f62;stroke-width:1}
.changeover-flow-icon{fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.changeover-flow-web{stroke:#d5ff70}.changeover-flow-content{stroke:#81dac8}.changeover-flow-campaigns{stroke:#ffb77b}
.changeover-flow-label{fill:#f4f5ef;font:400 16px "Changeover Tile",Arial,sans-serif;letter-spacing:-.015em}
.changeover-project-cover .changeover-flow-caption{
  display:block;text-align:right;margin-top:3px;color:#9aabbc;
  font:400 10px/1.5 ui-monospace,"SFMono-Regular",Consolas,monospace;letter-spacing:.06em;text-transform:uppercase;
}
.changeover-project-cover .changeover-tile-metrics{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;
  border-top:1px solid #3b4f62;margin-top:clamp(30px,4vw,54px);padding-top:25px;
}
.changeover-tile-metrics>div{min-width:0}
.changeover-tile-metrics>div+div{padding-left:26px;border-left:1px solid #3b4f62}
.changeover-tile-metrics strong{
  display:block;white-space:nowrap;color:#d5ff70;
  font:500 clamp(34px,4vw,57px)/1 "Changeover Tile",Arial,sans-serif;letter-spacing:-.055em;
}
.changeover-tile-metrics strong>span{font-size:.75em}
.changeover-tile-metrics>div:nth-child(2) strong{color:#81dac8}
.changeover-tile-metrics>div:nth-child(3) strong{color:#ffb77b}
.changeover-tile-metrics>div>span{display:block;margin-top:10px;color:#c6d0da;font:400 12px/1.45 "Changeover Tile",Arial,sans-serif}
#selected-work>.changeover-project-cover:focus-visible{outline:3px solid #d5ff70;outline-offset:-4px}
@media(hover:hover){
  #selected-work>.changeover-project-cover:hover{background:#142337}
  .changeover-project-cover:hover .changeover-tile-action>span{transform:translate(3px,-3px)}
}
@media(max-width:850px){
  .changeover-project-cover .changeover-tile-main{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px}
  .changeover-project-cover #changeover-tile-title{font-size:clamp(40px,6.3vw,58px)}
  .changeover-tile-metrics strong{font-size:40px}
}
@media(max-width:600px){
  #selected-work>.changeover-project-cover{padding:30px 25px}
  .changeover-project-cover .changeover-tile-main{grid-template-columns:minmax(0,1fr);gap:25px}
  .changeover-project-cover #changeover-tile-title{font-size:clamp(44px,10.5vw,60px);margin-top:21px}
  .changeover-project-cover #changeover-tile-summary{font-size:19px}
  .changeover-project-cover .changeover-tile-action{margin-top:22px}
  .changeover-project-cover .changeover-tile-flow{width:min(100%,360px);padding-top:0;justify-self:center}
  .changeover-project-cover .changeover-tile-metrics{gap:14px;margin-top:27px;padding-top:23px}
  .changeover-tile-metrics>div+div{padding-left:14px}
  .changeover-tile-metrics strong{font-size:clamp(28px,7.8vw,40px)}
  .changeover-tile-metrics>div>span{font-size:11px;line-height:1.4;margin-top:8px}
  .changeover-project-cover .changeover-flow-caption{font-size:9px}
}
@media(max-width:360px){
  #selected-work>.changeover-project-cover{padding:28px 21px}
  .changeover-project-cover .changeover-tile-kicker{gap:9px;font-size:10px}
  .changeover-project-cover .changeover-tile-metrics{gap:10px}
  .changeover-tile-metrics>div+div{padding-left:10px}
  .changeover-tile-metrics strong{font-size:28px}
}
@media(prefers-reduced-motion:reduce){
  #selected-work>.changeover-project-cover,.changeover-tile-action>span{transition:none}
  .changeover-project-cover:hover .changeover-tile-action>span{transform:none}
}

/* Compact desktop feature; keep the existing stacked mobile presentation. */
@media(min-width:933px){
  #selected-work>.changeover-project-cover{padding:28px 38px}
  .changeover-project-cover .changeover-tile-main{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px}
  .changeover-project-cover #changeover-tile-title{font-size:clamp(50px,4.1vw,60px);margin:14px 0 12px}
  .changeover-project-cover #changeover-tile-summary{font-size:18px}
  .changeover-project-cover .changeover-tile-action{margin-top:14px}
  .changeover-project-cover .changeover-tile-flow{width:min(100%,330px);padding-top:0;justify-self:center}
  .changeover-project-cover .changeover-tile-metrics{margin-top:22px;padding-top:18px;gap:22px}
  .changeover-tile-metrics>div{display:flex;align-items:center;gap:14px}
  .changeover-tile-metrics>div+div{padding-left:22px}
  .changeover-tile-metrics strong{font-size:40px;flex-shrink:0}
  .changeover-tile-metrics>div>span{margin-top:0;max-width:110px;font-size:11px}
}