/* Light crossing a structural seam, adapted from Transitions Pro's organic shimmer. */
.home .rule{position:relative;overflow:hidden}
.home .rule::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#b8c6a7 42%,#FFFFFF 50%,#b8c6a7 58%,transparent);transform:translateX(-110%);opacity:0}
.home .seam-awake .rule::after{animation:seam-light 1600ms cubic-bezier(.22,1,.36,1) both}
@keyframes seam-light{0%{transform:translateX(-110%);opacity:0}20%{opacity:.9}100%{transform:translateX(110%);opacity:0}}
/* The spring timing follows the supplied card-stack recipe, with tiny travel. */
.site-nav a{position:relative}
.site-nav a::after{content:'';position:absolute;inset-inline:0;bottom:.35rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 410ms cubic-bezier(.31,2.34,.64,1)}
.site-nav a:focus-visible::after{transform:scaleX(1)}
.home .nav-arrow{display:inline-block;transition:transform 410ms cubic-bezier(.31,2.34,.64,1)}
@media(hover:hover){.site-nav a:hover::after{transform:scaleX(1)}.site-nav a:hover .nav-arrow{transform:translate(3px,-3px)}
 .home .vector-label{transition:color 360ms ease,translate 410ms cubic-bezier(.31,2.34,.64,1)}
 .home .vector-node:hover .vector-label{color:#d6dec4;translate:.3rem 0}
}
.site-nav a:focus-visible .nav-arrow{transform:translate(3px,-3px)}
@media(prefers-reduced-motion:reduce){.home .seam-awake .rule::after{animation:none}.site-nav a::after,.home .nav-arrow,.home .vector-label{transition:none}.home .vector-node:hover .vector-label,.site-nav a:hover .nav-arrow,.site-nav a:focus-visible .nav-arrow{transform:none;translate:none}}
@media(forced-colors:active){.home .rule::after{display:none}.site-nav a::after{background:LinkText}}

/* Contact rim wash: supplied Transitions Pro get-pro-button recipe. */
/* The pill: plain white button chrome. Only `position: relative` and
   `overflow: hidden` matter to the effect — restyle the rest freely. */
.t-pro-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 18px;
  border: 0;
  cursor: pointer;
  background: #fff;
  border-radius: 50px;
  overflow: hidden;
  font-weight: 500;
  font-size: 13px;
  line-height: 1.4;
  color: #0f0f0f;
  white-space: nowrap;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  box-shadow:
    0 1px 3px 0 rgba(0, 0, 0, 0.04),
    inset 0 0 0 1px rgba(0, 0, 0, 0.06),
    inset 0 -1px 0 0 rgba(0, 0, 0, 0.1),
    inset 0 0 0 1px rgba(196, 196, 196, 0.1);
}

/* The wash. Seven Figma radial gradients preserved as inline-SVG
   layers (their rotated ellipses can't be expressed with CSS
   radial-gradient()), blown up to 180% so the blobs sweep
   corner-to-corner as they orbit. */
.t-pro-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background-image:
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 67 42' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)' opacity='0.88'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(0.34726 -1.3118e-7 8.6482e-7 0.89585 33.5 21)'><stop stop-color='rgba(0,110,245,1)' offset='0'/><stop stop-color='rgba(0,110,245,0)' offset='1'/></radialGradient></defs></svg>"),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 67 42' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)' opacity='0.5'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(-1.3 0.25 -1.2633 -2.7471 33.5 21)'><stop stop-color='rgba(0,110,245,1)' offset='0'/><stop stop-color='rgba(0,110,245,0)' offset='1'/></radialGradient></defs></svg>"),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 67 42' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)' opacity='0.4'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(1.05 -0.8 0.46018 3.6184 33.5 21)'><stop stop-color='rgba(204,0,167,1)' offset='0'/><stop stop-color='rgba(170,0,204,0)' offset='0.71709'/></radialGradient></defs></svg>"),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 67 42' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(-0.51067 -3.3275e-16 -4.3352e-14 -1.1396 33.5 21)'><stop stop-color='rgba(204,0,167,1)' offset='0'/><stop stop-color='rgba(170,0,204,0)' offset='1'/></radialGradient></defs></svg>"),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 67 42' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(-0.45 -0.75 1.9052 -0.7091 33.5 21)'><stop stop-color='rgba(255,173,85,1)' offset='0'/><stop stop-color='rgba(255,173,85,0)' offset='1'/></radialGradient></defs></svg>"),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 67 42' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(1.25 -0.35 -0.4013 3.5959 33.5 21)'><stop stop-color='rgba(0,204,68,1)' offset='0'/><stop stop-color='rgba(0,196,102,0.75)' offset='0.25'/><stop stop-color='rgba(0,187,136,0.5)' offset='0.5'/><stop stop-color='rgba(0,170,204,0)' offset='1'/></radialGradient></defs></svg>"),
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 67 42' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(-0.87391 0.73043 -4.1482 -1.9503 33.5 21)'><stop stop-color='rgba(0,170,204,1)' offset='0'/><stop stop-color='rgba(0,170,204,0)' offset='1'/></radialGradient></defs></svg>");
  background-size: 180% 180%, 180% 180%, 180% 180%, 180% 180%,
                   180% 180%, 180% 180%, 180% 180%;
  background-repeat: no-repeat;
  /* Rim-only wash: the mask clears the centre so the label sits on
     clean white and the colour reads as a glow creeping in from the
     edges. The ellipse is deliberately smaller than the pill (46%)
     so full opacity is reached INSIDE the border — sizing it past
     the edge would clip the opaque end of the ramp and leave the
     whole wash near-invisible. */
  -webkit-mask-image: radial-gradient(
    ellipse 46% 46% at 50% 50%,
    transparent var(--probtn-core,50%),
    black calc(var(--probtn-core,50%) + var(--probtn-core-blur,150%))
  );
  mask-image: radial-gradient(
    ellipse 46% 46% at 50% 50%,
    transparent var(--probtn-core,50%),
    black calc(var(--probtn-core,50%) + var(--probtn-core-blur,150%))
  );
  opacity: var(--probtn-strength,.32);
  animation:
    t-pro-btn-hue var(--probtn-hue-dur,8000ms) linear infinite,
    t-pro-btn-drift var(--probtn-drift-dur,10000ms) ease-in-out infinite;
}

/* The label rides above the wash. */
.t-pro-btn-label {
  position: relative;
  z-index: 1;
}

/* Full hue cycle — ends where it starts, so the loop is seamless.
   The saturate boost keeps the washes punchy at the 180% blow-up;
   the blur turns blobs into atmosphere. Compositor-only. */
@keyframes t-pro-btn-hue {
  from { filter: hue-rotate(0deg) saturate(1.3) blur(var(--probtn-blur,6px)); }
  to   { filter: hue-rotate(-360deg) saturate(1.3) blur(var(--probtn-blur,6px)); }
}
/* Blob travel — the same perimeter orbit as the Pro gradient text,
   minus its static grey-ramp layer: each blob is pinned to the ring
   of edge stops TL,T,TR,R,BR,B,BL,L and advances two ring stops per
   keyframe — a full lap around the pill per cycle, so colour hugs
   and travels the rim while the mask keeps the middle clean. */
@keyframes t-pro-btn-drift {
  0%, 100% {
    background-position:
      100% 0%, 0% 50%, 100% 50%, 0% 100%,
      0% 0%, 50% 0%, 50% 100%;
  }
  25% {
    background-position:
      100% 100%, 50% 0%, 50% 100%, 0% 0%,
      100% 0%, 100% 50%, 0% 50%;
  }
  50% {
    background-position:
      0% 100%, 100% 0%, 0% 100%, 100% 0%,
      100% 100%, 100% 100%, 0% 0%;
  }
  75% {
    background-position:
      0% 0%, 100% 100%, 0% 0%, 100% 100%,
      50% 100%, 0% 100%, 100% 50%;
  }
}

/* Reduced motion — required: the wash freezes on its first frame,
   which still reads as a premium rim glow. */
@media (prefers-reduced-motion: reduce) {
  .t-pro-btn::before { animation: none; }
}

.intake .t-pro-btn{height:auto;white-space:normal;min-height:3rem;border-radius:.3125rem;--probtn-strength:.32;--probtn-core:50%;--probtn-core-blur:150%;--probtn-blur:6px;--probtn-hue-dur:8000ms;--probtn-drift-dur:10000ms}
.t-pro-btn::before{animation-play-state:paused}
.t-pro-btn:focus-visible::before{animation-play-state:running}
@media(hover:hover){.t-pro-btn:hover::before{animation-play-state:running}}
@media(forced-colors:active){.t-pro-btn::before{display:none}.intake .t-pro-btn{background:ButtonFace;color:ButtonText}}
