/* Sling Button adapted from React Bits by David Haz. See LICENSE.md. */
.about-contact{position:relative;-webkit-user-select:none;user-select:none}
.sling-button{
  --sl-size:56px;--sl-svg:80px;--sl-pad:#ededed;--sl-icon:#151515;
  --sl-accent:#ededed;--sl-well:#252525;--sl-band:#626262;--sl-stroke:3px;--sl-dot:8px;
  --sl-ease-out:cubic-bezier(.23,1,.32,1);
  position:relative;display:inline-block;width:var(--sl-size);height:var(--sl-size);flex:none;
}
.about-contact .contact-sling{position:absolute;z-index:3;top:clamp(28px,3.5vw,54px);right:clamp(28px,3.5vw,54px)}
.sling-button__hint{position:absolute;right:calc(100% + 18px);top:50%;display:flex;align-items:center;gap:7px;width:max-content;color:var(--sl-pad);font-size:12px;font-weight:400;line-height:1.4;white-space:nowrap;opacity:.58;transform:translateY(-50%);pointer-events:none;transition:opacity 500ms ease-out}
.sling-button__hint-arrow{display:block;width:10px;height:10px;flex:none;background:currentColor;-webkit-mask:var(--portfolio-chevron-mask,url('../ui/chevron-rounded.svg')) center/contain no-repeat;mask:var(--portfolio-chevron-mask,url('../ui/chevron-rounded.svg')) center/contain no-repeat}
.sling-button[data-hint-dismissed] .sling-button__hint{opacity:0}
.sling-button__fx{position:absolute;top:50%;left:50%;width:var(--sl-svg);height:var(--sl-svg);margin:calc(var(--sl-svg)/-2) 0 0 calc(var(--sl-svg)/-2);overflow:visible;pointer-events:none;shape-rendering:geometricPrecision}
.sling-button__well{fill:var(--sl-well);transition:fill 200ms ease}
.sling-button[data-sent] .sling-button__well{fill:var(--sl-accent)}
.sling-button__band{fill:none;stroke:var(--sl-band);stroke-width:var(--sl-stroke);stroke-linecap:round;transition:stroke-width 160ms var(--sl-ease-out)}
.sling-button__band--hot{stroke:var(--sl-accent)}
.sling-button__arc{fill:none;stroke:var(--sl-accent);stroke-width:var(--sl-stroke);stroke-linecap:butt;transition:stroke-width 160ms var(--sl-ease-out)}
.sling-button[data-armed] .sling-button__band,.sling-button[data-armed] .sling-button__arc{stroke-width:calc(var(--sl-stroke)*1.5)}
.sling-button__move{position:absolute;inset:0}
.sling-button__pad{position:relative;display:block;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:50%;background:none;cursor:grab;outline:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
.sling-button__pad::after{content:'';position:absolute;inset:-6px;border-radius:50%}
.sling-button__pad[data-held]{cursor:grabbing}
.sling-button__face{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border-radius:50%;background:var(--sl-pad);color:var(--sl-icon);transition:transform 160ms var(--sl-ease-out)}
.sling-button__pad[data-held] .sling-button__face{transform:scale(.97)}
.sling-button__pad[data-armed] .sling-button__face{transform:scale(1.04)}
.sling-button__icon{display:block;width:52%;height:52%;background:currentColor;-webkit-mask:var(--portfolio-contact-qr-mask,url('../ui/contact-qr-icon.svg')) center/contain no-repeat;mask:var(--portfolio-contact-qr-mask,url('../ui/contact-qr-icon.svg')) center/contain no-repeat}
.sling-button__dot{position:absolute;top:50%;left:50%;width:var(--sl-dot);height:var(--sl-dot);margin:calc(var(--sl-dot)/-2) 0 0 calc(var(--sl-dot)/-2);border-radius:50%;background:var(--sl-accent);opacity:0;pointer-events:none}
.sling-button__sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(hover:hover) and (pointer:fine){.sling-button__pad:not([data-held]):hover .sling-button__face{transform:scale(1.02)}}
@media(max-width:767px){.about-contact .contact-sling{--sl-size:48px;top:28px;right:28px}}
@media(prefers-reduced-motion:reduce){.sling-button__face{transform:none!important;transition:none}.sling-button__hint{transition-duration:150ms}}