/* Bottone "Book a call" di growthcab.com. Sorgente unica: gc-pages/site-cta.js (markup), questo file (aspetto).
   Pillola bianca con alone blu che gira piano, 5 facce di chi risponde alla call che si aprono a ventaglio,
   freccia blu che scatta. Ogni testo a 16px o piu'. Fermo con prefers-reduced-motion. */
@property --gc-cta-a{syntax:'<angle>';inherits:false;initial-value:0deg}
.gc-cta{--h:46px;--face:28px;--ov:-9px;--ic:34px;--fs:16px;--gap:10px;--pl:6px;--pr:6px;--e:cubic-bezier(.22,1,.36,1);
  position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:var(--gap);box-sizing:border-box;height:var(--h);margin:0;padding:0 var(--pr) 0 var(--pl);border:0;border-radius:999px;background:none;
  color:#0a0b0f;font:600 var(--fs)/1 'Inter','Inter Fallback',-apple-system,'Helvetica Neue',Helvetica,Arial,sans-serif;letter-spacing:-.012em;white-space:nowrap;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;
  box-shadow:0 18px 40px -18px rgba(47,107,255,.85),0 4px 14px -4px rgba(0,0,0,.55);transition:transform .35s var(--e),box-shadow .35s var(--e)}
.gc-cta--lg{--h:58px;--face:34px;--ov:-11px;--ic:46px;--fs:17px;--gap:14px;--pl:8px;--pr:6px}
.gc-cta--sm{--h:42px;--face:24px;--ov:-8px;--ic:30px;--fs:16px;--gap:8px;--pl:5px;--pr:5px}
.gc-cta--block{display:flex;width:100%}
.gc-cta--plain{--pl:20px}
.gc-cta--block .gc-cta-label{margin-right:auto}
/* alone: luce blu che ruota dietro la pillola */
.gc-cta::before{content:"";position:absolute;inset:-2px;z-index:-1;border-radius:inherit;background:conic-gradient(from var(--gc-cta-a),#2F6BFF,#9DB8FF 18%,#2F6BFF 36%,#7B6CFF 58%,#2F6BFF 78%,#9DB8FF 92%,#2F6BFF);filter:blur(9px);opacity:.55;animation:gc-cta-spin 6s linear infinite;transition:opacity .35s var(--e),filter .35s var(--e)}
/* superficie: bianco con luce dall'alto */
.gc-cta::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(180deg,#ffffff 0%,#f3f5fa 55%,#e8ecf5 100%);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(17,24,39,.08),0 0 0 1px rgba(255,255,255,.28)}
.gc-cta:hover{transform:translateY(-1px);box-shadow:0 22px 46px -16px rgba(47,107,255,.95),0 6px 16px -4px rgba(0,0,0,.6)}
.gc-cta:hover::before{opacity:.95;filter:blur(12px)}
.gc-cta:active{transform:translateY(0) scale(.985)}
.gc-cta:focus-visible{outline:2px solid #7FA4FF;outline-offset:4px}
/* facce: si sovrappongono, al passaggio si aprono a ventaglio */
.gc-cta-faces{display:flex;align-items:center;flex:none;padding-left:2px}
.gc-cta-faces img{position:relative;display:block;width:var(--face);height:var(--face);max-width:none;margin:0 0 0 var(--ov);border-radius:50%;object-fit:cover;background:#dfe3ec;
  box-shadow:0 0 0 2px #fff,0 3px 8px -2px rgba(15,23,42,.35);z-index:calc(10 - var(--n));transition:margin .5s var(--e),transform .5s var(--e);transition-delay:calc(var(--n)*30ms)}
.gc-cta-faces img:first-child{margin-left:0}
.gc-cta:hover .gc-cta-faces img:not(:first-child){margin-left:calc(var(--ov) + 5px)}
.gc-cta:hover .gc-cta-faces img{transform:translateY(-1px)}
.gc-cta-label{display:block;padding:0 2px}
/* freccia */
.gc-cta-ic{display:grid;place-items:center;flex:none;width:var(--ic);height:var(--ic);border-radius:50%;color:#fff;overflow:hidden;
  background:radial-gradient(120% 120% at 28% 18%,#6D98FF 0%,#2F6BFF 52%,#1D4FD8 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -2px 6px rgba(10,30,110,.35),0 6px 14px -4px rgba(47,107,255,.75)}
.gc-cta-ic svg{display:block;width:calc(var(--ic)*.42);height:calc(var(--ic)*.42)}
.gc-cta:hover .gc-cta-ic svg{animation:gc-cta-arrow .62s var(--e)}
.gc-cta-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@keyframes gc-cta-spin{to{--gc-cta-a:360deg}}
@keyframes gc-cta-arrow{0%{transform:none}45%{transform:translate(150%,-150%)}46%{transform:translate(-150%,150%)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){
  .gc-cta,.gc-cta::before,.gc-cta-faces img{transition:none}
  .gc-cta::before{animation:none}
  .gc-cta:hover .gc-cta-ic svg{animation:none}
  .gc-cta:hover .gc-cta-faces img:not(:first-child){margin-left:var(--ov)}
}
@media print{.gc-cta::before{display:none}}