/* Vector icons are used instead of Unicode so mobile browsers never substitute emoji. */
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}
.ui-icon{width:1em;height:1em;display:inline-block;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ui-icon .fill-shape{fill:currentColor;stroke:none}
.arrow-icon{width:13px;height:13px;vertical-align:-2px}
.logo-mark{width:27px;height:27px;object-fit:contain;flex:0 0 auto}
.header nav a{display:inline-flex;align-items:center;gap:5px}
.benefit-icon{width:29px;height:29px;color:#d7d7d7;display:block;margin-bottom:40px;stroke-width:1.3}
.card-arrow .arrow-icon{width:17px;height:17px}
.play-icon{width:20px;height:20px;margin:0;transform:none}
.card-meta>span,.case-study-link{display:flex;align-items:center;gap:5px}
.email-link .arrow-icon{margin-left:20px}
.social-links strong{display:flex;align-items:center;gap:6px}
footer>a:last-child{display:flex;align-items:center;gap:6px}
footer .logo-mark{width:22px;height:22px}
.back-link{display:inline-flex;align-items:center;gap:8px}
.case-meta{flex-wrap:wrap;gap:28px 70px}
.case-notes{margin-top:10px}
.case-text{grid-template-columns:minmax(180px,1fr) minmax(0,2fr)}
.next-icon{width:35px;height:35px;stroke-width:1.1}
@media(max-width:520px){.logo-mark{width:24px;height:24px}.benefit-icon{width:26px;height:26px}.case-text{grid-template-columns:1fr}.case-meta{gap:24px 34px}.next-icon{width:29px;height:29px}}
@media(max-width:520px){.project-page .header nav a:nth-child(2){display:inline-flex}.project-page .header nav{gap:14px}.project-page .header nav a{font-size:10px}}