/* UIN "Get Started" floating button (bottom-right).
   Character animation ported from the app header mascot
   (productivity-portal: assets/css/header-character.css).
   Markup: <a class="gs-floating"><span class="gs-character" data-svg=".../get-started-character.svg"></span><span class="gs-label">Get Started</span></a> */

.gs-floating{overflow:visible;position:fixed;right:24px;bottom:24px;z-index:2147483000;display:inline-flex;align-items:center;gap:10px;background:#000;color:#fff;text-decoration:none;padding:9px 18px 9px 10px;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.28);transition:background-color .2s ease,transform .2s ease}
.gs-floating:hover{background:#1c1c1c;transform:translateY(-1px)}
.gs-floating:active{transform:translateY(0)}
.gs-label{font-size:15px;font-weight:500;line-height:1;color:#fff;white-space:nowrap;letter-spacing:.1px}

/* Character box. Blue square shows even before/without JS; the SVG (injected by
   assets/js/get-started-button.js) covers it once loaded. */
.gs-character{display:block;width:28px;height:28px;flex:none;background:#0A66EA;border-radius:7px;overflow:visible;transform-origin:50% 62%;will-change:transform}
.gs-character .pp-character-svg{display:block;width:100%;height:100%;--x:0;--y:0;--wl:1;--wr:1;--hs:1;--ms:260ms}
.gs-character .pp-char-open,.gs-character .pp-char-happy,.gs-character .pp-char-line{fill:#fff}
.gs-character .pp-char-happy,.gs-character .pp-char-line{fill:none;stroke:#fff;stroke-width:15;stroke-linecap:round}
.gs-character .pp-char-happy,.gs-character .pp-char-line,.gs-character .pp-char-sparks{display:none}
.gs-character .pp-char-eye-l{transform:translate(calc(96px + var(--x) * 1px),calc(137px + var(--y) * 1px)) rotate(12deg) scale(var(--wl),var(--hs));transition:transform var(--ms) cubic-bezier(.2,.8,.2,1)}
.gs-character .pp-char-eye-r{transform:translate(calc(204px + var(--x) * 1px),calc(145px + var(--y) * 1px)) rotate(12deg) scale(var(--wr),var(--hs));transition:transform var(--ms) cubic-bezier(.2,.8,.2,1)}
.gs-character [data-face=happy] .pp-char-open,.gs-character [data-face=wink] .pp-char-eye-r .pp-char-open{display:none}
.gs-character [data-face=happy] .pp-char-happy{display:block}
.gs-character [data-face=wink] .pp-char-eye-r .pp-char-line{display:block}
.gs-character [data-face=happy] .pp-char-sparks{display:block}
.gs-character .pp-char-sparks circle{opacity:0;transform-box:fill-box;transform-origin:center;animation:pp-char-spark 1.4s ease-out infinite}
.gs-character .pp-char-sparks circle:nth-child(2){animation-delay:.12s}
.gs-character .pp-char-sparks circle:nth-child(3){animation-delay:.24s}
.gs-character .pp-char-sparks circle:nth-child(4){animation-delay:.36s}
.gs-character .pp-char-sparks circle:nth-child(5){animation-delay:.48s}
@keyframes pp-char-spark{0%{opacity:0;transform:scale(.3)}30%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(.3) translateY(-8px)}}

@media (max-width:479px){.gs-floating{right:16px;bottom:16px;padding:8px 14px 8px 9px}.gs-label{font-size:14px}}
@media (prefers-reduced-motion:reduce){.gs-floating{transition:none}.gs-character .pp-char-eye-l,.gs-character .pp-char-eye-r{transition:none}.gs-character .pp-char-sparks circle{animation:none}}

/* Hide the Webflow "Made in Webflow" badge injected by webflow.js. */
.w-webflow-badge{display:none!important}
