:root{--hover-steel:#b8c4d1}
.carbon-light{
  position:absolute;
  inset:14% 16%;
  z-index:0;
  pointer-events:none;
  opacity:0;
  background-image:radial-gradient(ellipse at center,rgba(255,255,255,.035) 0%,rgba(255,255,255,.014) 40%,rgba(255,255,255,0) 72%);
  background-size:440px 320px;
  background-repeat:no-repeat;
  background-position:calc(var(--carbon-x,50%) - 220px) calc(var(--carbon-y,50%) - 160px);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 35%,transparent 72%);
  mask-image:radial-gradient(ellipse at center,#000 35%,transparent 72%);
}

.raster-icon::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  background-color:currentColor;
  -webkit-mask-image:var(--icon-mask);
  mask-image:var(--icon-mask);
  -webkit-mask-size:contain;
  mask-size:contain;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  mask-mode:alpha;
}
.arrow::after{
  -webkit-mask-size:auto var(--arrow-art-height);
  mask-size:auto var(--arrow-art-height);
}
.icon-linkedin>img{opacity:0}
.icon-linkedin::after{opacity:1}
:is(.contact-trigger,.book):focus-visible .raster-icon>img{opacity:0}
:is(.contact-trigger,.book):focus-visible .raster-icon::after{opacity:1}
:is(.contact-trigger,.book,.linkedin,.email-group,.legal button):focus-visible{
  outline:2px solid #d1dfff;
  outline-offset:6px;
  color:var(--hover-steel);
}
@media(min-width:1051px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  html:not([data-motion="off"]) .carbon-light{
    transition:background-position 180ms ease-out,opacity 180ms ease-out;
  }
  html:not([data-motion="off"]) .carbon-light.is-active{opacity:1}
  html:not([data-motion="off"]) :is(.contact-trigger,.book,.linkedin,.email-group,.legal button){
    transition:color 180ms ease-out;
  }
  html:not([data-motion="off"]) :is(.contact-trigger,.book,.linkedin,.email-group,.legal button):not(:disabled):hover{
    color:var(--hover-steel);
  }
  html:not([data-motion="off"]) .raster-icon>img,
  html:not([data-motion="off"]) .raster-icon::after{
    transition:opacity 180ms ease-out;
  }
  html:not([data-motion="off"]) :is(.contact-trigger,.book,.linkedin,.email-group):not(:disabled):hover .raster-icon>img{
    opacity:0;
  }
  html:not([data-motion="off"]) :is(.contact-trigger,.book,.linkedin,.email-group):not(:disabled):hover .raster-icon::after{
    opacity:1;
  }
}
html[data-motion="off"] .carbon-light{display:none}
@media(max-width:1050px),(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse),(forced-colors:active){
  .carbon-light{display:none}
}
@media(forced-colors:active){
  .raster-icon::after{display:none}
  .raster-icon>img{opacity:1!important}
}