/*
 * Desktop service icons. Insert .service-desktop-icon after .service-card-top.
 * No card sizing, padding, content typography or mobile layout overrides.
 * SVG shapes: Phosphor Icons, MIT, provided in ../icons/.
 */
.service-desktop-icon{display:none}

@media(min-width:801px){
  .services-track .service-card>.service-desktop-icon{
    position:relative;
    display:grid;
    place-items:center;
    flex:1 1 0;
    min-width:0;
    min-height:0;
    width:100%;
    pointer-events:none;
    user-select:none;
    isolation:isolate;
    container-type:size;
  }
  .service-desktop-icon .sd-icon-stack{
    position:relative;
    display:block;
    /* Fit the actual space between the existing header and body. */
    width:min(11vw,156px);
    height:min(11vw,156px);
    max-width:56%;
    max-height:100%;
    aspect-ratio:1;
    color:#ffe8d3;
    transform:translateY(-2px);
    transition:transform .45s cubic-bezier(.22,.75,.18,1),color .35s ease;
  }
  @supports(width:1cqh){
    .service-desktop-icon .sd-icon-stack{
      width:min(11vw,156px,max(0px,calc(100cqh - 12px)));
      height:auto;
    }
  }
  .service-desktop-icon .sd-icon{
    position:absolute;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    overflow:visible;
    fill:currentColor;
    stroke:none;
  }
  .service-desktop-icon .sd-icon-glow{
    z-index:0;
    color:#ff8b42;
    opacity:.24;
    filter:blur(10px);
    transform:translateY(5px) scale(1.08);
    transition:opacity .4s ease,color .4s ease;
  }
  .service-desktop-icon .sd-icon-core{
    z-index:1;
    opacity:.92;
    filter:blur(.55px) drop-shadow(0 2px 1px #ff8c3517);
  }
  .services-track .service-card:is(:hover,:focus-within,.is-featured) .sd-icon-stack{
    color:#fff3e5;
    transform:translateY(-5px) scale(1.025);
  }
  .services-track .service-card:is(:hover,:focus-within,.is-featured) .sd-icon-glow{
    color:#ffe4c8;
    opacity:.28;
  }
}

@media(min-width:801px) and (max-width:1025px){
  .service-desktop-icon .sd-icon-stack{width:min(17vw,164px);height:min(17vw,164px)}
  @supports(width:1cqh){
    .service-desktop-icon .sd-icon-stack{
      width:min(17vw,164px,max(0px,calc(100cqh - 14px)));
      height:auto;
    }
  }
}

@media(prefers-reduced-motion:reduce){
  .service-desktop-icon .sd-icon-stack,
  .service-desktop-icon .sd-icon-glow{transition:none!important}
  .services-track .service-card:is(:hover,:focus-within,.is-featured) .sd-icon-stack{transform:translateY(-2px)}
}
