/* Verbatim from Fractal Hero Animated (Home).dc.html <style>.
   (Standalone body/a/@property/@keyframes resets omitted — the page style
   provides them; keeping the hero's navy body reset would override the page.) */

.fr-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:0.625rem;padding:1rem 1.75rem;font-family:var(--font-sans);font-weight:var(--fw-medium);font-size:1.0625rem;line-height:1.1;letter-spacing:.005em;text-decoration:none;border-radius:var(--radius-md);cursor:pointer;white-space:nowrap;transition:background var(--dur) var(--ease-out),border-color var(--dur) var(--ease-out),filter var(--dur) var(--ease-out),transform var(--dur-fast) var(--ease-out)}
.fr-btn:active{transform:translateY(1px) scale(.99)}
.fr-btn-arrow{transition:transform var(--dur) var(--ease-out)}
.fr-btn:hover .fr-btn-arrow{transform:translateX(4px)}
.fr-btn--gradient,.fr-btn--gradient:hover{background:linear-gradient(100deg,var(--blue-action),var(--cyan));background-origin:border-box;background-clip:border-box;color:#fff;border:0.09375rem solid transparent}
.fr-btn--gradient:hover{filter:brightness(1.05)}
.fr-btn--flow,.fr-btn--flow:hover{background:linear-gradient(var(--navy),var(--navy)) padding-box,conic-gradient(from var(--fr-angle),var(--cyan),var(--blue-action),var(--blue),var(--cyan)) border-box;color:var(--on-dark);border:0.09375rem solid transparent}
.fr-btn--flow:hover{animation:fr-border-flow 3.2s linear infinite}
@media (prefers-reduced-motion:reduce){.fr-btn--flow:hover{animation:none}.fr-btn:hover .fr-btn-arrow{transform:none}}
/* Updated DS treatment: the ONE large accent word gets the blue→cyan
   gradient clipped to the glyphs. On navy the low end shifts to the
   brighter --blue; at display size both ends clear AA large-text 3:1.
   (The 12px eyebrow stays SOLID cyan — a gradient there would dip to
   --blue ≈ 3.7:1, under the 4.5:1 AA needs for small text.) */
.fr-accent-word{color:var(--blue-action);background:linear-gradient(100deg,var(--blue-action) 0%,var(--cyan) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding:0.14em 0.1em;margin:0 -0.1em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.fr-accent-word--on-dark{color:var(--cyan);background:linear-gradient(100deg,var(--blue) 0%,var(--cyan) 55%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media (max-width:640px){.hero-lead{display:none !important}}
.fr-client{font-family:var(--font-sans);font-weight:var(--fw-medium);font-size:0.875rem;letter-spacing:.06em;color:var(--on-dark-muted);opacity:.7;text-transform:uppercase;white-space:nowrap}
.fr-glint-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block;
  -webkit-mask-image:radial-gradient(118% 118% at 50% 40%, transparent 0%, transparent 28%, #000 70%);
          mask-image:radial-gradient(118% 118% at 50% 40%, transparent 0%, transparent 28%, #000 70%);}