/* In-page "Talk to our AI agent" call button (see squawk-call.v1.js).
   State: [data-state] on .sv-call (idle | mic | verifying | connecting | live | ending | ended |
   failed | unavailable). Audio levels: --sv-in (caller) and --sv-out (AI voice), 0..1, set on
   .home_demo-wrap while live. Only transform/opacity animate, on dedicated layers: the Webflow
   circles behind carry heavy backdrop-filter blurs and must not repaint per frame. */

.sv-call {
  --sv-blue: var(--brand--royal-blue, #2166ec);
  --sv-ice: var(--brand--baby-blue-ice, #9dbdff);
  --sv-tangerine: var(--brand--tangerine, #f07c00);
  --sv-ink: var(--brand--deep-space-blue, #162739);
  --sv-size: 200px;
  position: relative;
  width: var(--sv-size);
  height: var(--sv-size);
  isolation: isolate;
}

.sv-call__btn {
  position: relative;
  z-index: 3;
  display: block;
  width: var(--sv-size);
  height: var(--sv-size);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 300ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.sv-call__btn:active { transform: scale(0.97); }
@media (hover: hover) {
  .sv-call__btn:hover { transform: scale(1.04); }
  .sv-call[data-state="idle"] .sv-call__btn:hover ~ .sv-call__rings .sv-call__ring { animation-duration: 1.6s; }
}
.sv-call__btn:focus-visible { outline: 3px solid var(--sv-blue); outline-offset: 6px; }
.sv-call__btn:disabled,
.sv-call__btn[aria-disabled="true"] { cursor: default; }
.sv-call[data-state="unavailable"] .sv-call__btn { opacity: 0.45; transform: none; }

.sv-call__icon {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  transition: opacity 320ms ease, transform 420ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.sv-call__icon--hangup { opacity: 0; transform: scale(0.8) rotate(-35deg); }
.sv-call:is([data-state="mic"], [data-state="verifying"], [data-state="connecting"], [data-state="live"], [data-state="ending"]) .sv-call__icon--call {
  opacity: 0;
  transform: scale(0.8) rotate(35deg);
}
.sv-call:is([data-state="mic"], [data-state="verifying"], [data-state="connecting"], [data-state="live"], [data-state="ending"]) .sv-call__icon--hangup {
  opacity: 1;
  transform: none;
}

.sv-call__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* ---- rings: idle invitation, connecting sonar, live AI-voice reaction ---- */
.sv-call__rings { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.sv-call__ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid var(--sv-blue);
  opacity: 0;
  transform: scale(1);
  will-change: transform, opacity;
}
.sv-call__ring:nth-child(2) { border-color: var(--sv-ice); }
.sv-call__ring:nth-child(3) { border-width: 1px; }

.sv-call[data-state="idle"] .sv-call__ring:nth-child(1) { animation: sv-breathe 3.2s ease-out infinite; }
.sv-call[data-state="idle"] .sv-call__ring:nth-child(2) { animation: sv-breathe 3.2s ease-out 1.6s infinite; }

.sv-call:is([data-state="mic"], [data-state="verifying"], [data-state="connecting"]) .sv-call__ring { animation: sv-sonar 1.8s cubic-bezier(0.15, 0.6, 0.3, 1) infinite; }
.sv-call:is([data-state="mic"], [data-state="verifying"], [data-state="connecting"]) .sv-call__ring:nth-child(2) { animation-delay: 0.6s; }
.sv-call:is([data-state="mic"], [data-state="verifying"], [data-state="connecting"]) .sv-call__ring:nth-child(3) { animation-delay: 1.2s; }
.sv-call[data-state="mic"] .sv-call__ring { animation-duration: 2.6s; }

.sv-call[data-state="live"] .sv-call__ring {
  --k: 0.4;
  opacity: calc(0.18 + var(--sv-out, 0) * 0.75);
  transform: scale(calc(1.06 + var(--sv-out, 0) * var(--k)));
}
.sv-call[data-state="live"] .sv-call__ring:nth-child(2) { --k: 0.6; opacity: calc(0.1 + var(--sv-out, 0) * 0.55); }
.sv-call[data-state="live"] .sv-call__ring:nth-child(3) { --k: 0.8; opacity: calc(0.05 + var(--sv-out, 0) * 0.4); }

.sv-call[data-state="ended"] .sv-call__ring:nth-child(1) { animation: sv-settle 900ms ease-out 1; }

.sv-call[data-state="failed"] .sv-call__ring:nth-child(1) {
  border-color: #d93c3c;
  animation: sv-settle 900ms ease-out 1;
}
.sv-call[data-state="failed"] .sv-call__btn { animation: sv-shake 420ms cubic-bezier(0.36, 0.07, 0.19, 0.97) 1; }

/* ---- caller voice: tangerine glow hugging the centre disc ---- */
.sv-call__glow {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: calc(var(--sv-size) * 0.4);
  height: calc(var(--sv-size) * 0.4);
  margin: calc(var(--sv-size) * -0.2) 0 0 calc(var(--sv-size) * -0.2);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(240, 124, 0, 0.55) 0%, rgba(240, 124, 0, 0) 70%);
  opacity: 0;
  transform: scale(1);
  pointer-events: none;
  will-change: transform, opacity;
}
.sv-call[data-state="live"] .sv-call__glow {
  opacity: calc(var(--sv-in, 0) * 1.1);
  transform: scale(calc(1.1 + var(--sv-in, 0) * 1.1));
}

/* ---- waveform under the button, driven by the AI voice ---- */
.sv-call__bars {
  position: absolute;
  left: 50%;
  bottom: -38px;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  gap: 4px;
  height: 28px;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity 300ms ease;
  pointer-events: none;
}
.sv-call__bars span {
  width: 4px;
  height: 28px;
  border-radius: 2px;
  background: linear-gradient(to top, var(--sv-blue), var(--sv-ice));
  transform-origin: 50% 100%;
  transform: scaleY(0.12);
  will-change: transform;
}
.sv-call[data-state="live"] .sv-call__bars { opacity: 1; }
.sv-call[data-state="live"] .sv-call__bars span {
  transform: scaleY(calc(0.12 + var(--sv-out, 0) * var(--k, 1)));
  animation: sv-jitter var(--d, 700ms) ease-in-out infinite alternate;
}
.sv-call__bars span:nth-child(1) { --k: 0.55; --d: 610ms; }
.sv-call__bars span:nth-child(2) { --k: 0.85; --d: 520ms; }
.sv-call__bars span:nth-child(3) { --k: 1; --d: 740ms; }
.sv-call__bars span:nth-child(4) { --k: 0.8; --d: 560ms; }
.sv-call__bars span:nth-child(5) { --k: 0.5; --d: 680ms; }

/* ---- status line (the circle's caption) ----
   The Webflow caption block (.home_ricle-bottom-text) is anchored by its bottom edge, so
   anything that adds height pushes the title up into the orb. Keep the status to one line on
   wide screens (a centred flex item overflows evenly). */
.sv-call-status { transition: color 200ms ease; min-height: 1.2em; text-align: center; }
@media (min-width: 768px) { .sv-call-status { white-space: nowrap; } }
@media (max-width: 767px) { .sv-call-status { max-width: 300px; } }
.sv-call-status[data-tone="error"] { color: #b42318; font-weight: 400; }
.sv-call-status[data-tone="live"] { color: var(--brand--royal-blue, #2166ec); }

/* The bot check runs invisibly. Google allows hiding the reCAPTCHA badge only when its notice is
   shown on the page: it sits in the homepage footer, under the copyright (.sv-recaptcha-note). */
.grecaptcha-badge { visibility: hidden !important; }
.sv-call__recaptcha { position: absolute; width: 0; height: 0; overflow: hidden; }
.sv-recaptcha-note { display: block; margin-top: 4px; }
.sv-recaptcha-note a { color: inherit; font-size: inherit; font-weight: inherit; text-decoration: underline; }

@keyframes sv-breathe {
  0% { opacity: 0.55; transform: scale(1); }
  70% { opacity: 0; transform: scale(1.22); }
  100% { opacity: 0; transform: scale(1.22); }
}
@keyframes sv-sonar {
  0% { opacity: 0.7; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.72); }
}
@keyframes sv-settle {
  0% { opacity: 0.8; transform: scale(1.15); }
  100% { opacity: 0; transform: scale(1); }
}
@keyframes sv-shake {
  10%, 90% { transform: translateX(-2px); }
  20%, 80% { transform: translateX(4px); }
  30%, 50%, 70% { transform: translateX(-6px); }
  40%, 60% { transform: translateX(6px); }
}
@keyframes sv-jitter {
  from { translate: 0 0; }
  to { translate: 0 -1px; }
}

@media (prefers-reduced-motion: reduce) {
  .sv-call__btn, .sv-call__icon { transition-duration: 1ms; }
  .sv-call .sv-call__ring, .sv-call .sv-call__btn, .sv-call .sv-call__bars span { animation: none !important; }
  .sv-call:is([data-state="mic"], [data-state="verifying"], [data-state="connecting"]) .sv-call__ring:nth-child(1) { opacity: 0.6; transform: scale(1.12); }
  .sv-call[data-state="live"] .sv-call__ring,
  .sv-call[data-state="live"] .sv-call__glow,
  .sv-call[data-state="live"] .sv-call__bars span { transition: none; transform: none; }
  .sv-call[data-state="live"] .sv-call__ring:nth-child(1) { opacity: 0.35; transform: scale(1.1); }
  .sv-call[data-state="live"] .sv-call__ring:nth-child(2),
  .sv-call[data-state="live"] .sv-call__ring:nth-child(3) { opacity: 0; }
  .sv-call[data-state="live"][data-speaking="ai"] .sv-call__ring:nth-child(1) { opacity: 0.9; }
  .sv-call[data-state="live"] .sv-call__glow { opacity: 0; }
  .sv-call[data-state="live"][data-speaking="caller"] .sv-call__glow { opacity: 0.8; transform: scale(2); }
  .sv-call[data-state="live"] .sv-call__bars span { transform: scaleY(0.3); }
  .sv-call[data-state="live"][data-speaking="ai"] .sv-call__bars span { transform: scaleY(0.8); }
}