/* ==========================================================================
   Closing CTA — shared by the services pages
   ========================================================================== */
.s-cta {
  position: relative; overflow: clip;
  background: var(--off-white); color: var(--black);
  padding-block: clamp(6rem, 12vw, 13rem);
}
.s-cta__marquee {
  position: absolute; left: 0; top: 50%;
  translate: 0 -50%;
  white-space: nowrap;
  font-size: clamp(6rem, 2rem + 17vw, 24rem);
  font-weight: 700; line-height: 1; letter-spacing: -0.05em;
  color: transparent;
  -webkit-text-stroke: 1.5px rgb(0 0 0 / 0.08);
  pointer-events: none; user-select: none;
}
.s-cta__marquee span { display: inline-block; }
.s-cta__inner { position: relative; }
.s-cta__title {
  margin-top: 1.25rem;
  font-size: clamp(3rem, 0.6rem + 8.4vw, 10.5rem);
  font-weight: 700; line-height: 0.92; letter-spacing: -0.055em;
}
.s-cta__title .mask { display: block; width: fit-content; }
.s-cta__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 2.5rem 4rem; margin-top: clamp(2.5rem, 5vw, 5.5rem); }
.s-cta__text { max-width: 26em; font-size: clamp(1.05rem, 0.8rem + 0.6vw, 1.6rem); line-height: 1.4; letter-spacing: -0.02em; color: var(--gray-ink); }
.s-cta__btn { display: inline-flex; align-items: center; gap: clamp(1rem, 2vw, 2.25rem); font-size: clamp(1.15rem, 0.8rem + 0.85vw, 2rem); font-weight: 600; letter-spacing: -0.03em; }
.s-cta__label { position: relative; padding-bottom: 0.2rem; }
.s-cta__label::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: currentColor; transform: scaleX(0.25); transform-origin: 0 50%;
  transition: transform 0.7s var(--ease-out);
}
.s-cta__circle {
  display: grid; place-items: center;
  width: clamp(5.5rem, 3.5rem + 6vw, 10.5rem); aspect-ratio: 1; border-radius: 50%;
  background: linear-gradient(135deg, #7a45e0, #3f6ff2);
  color: var(--white);
  transition: scale 0.6s var(--ease-out);
}
.s-cta__circle svg { width: 36%; height: 18%; rotate: -45deg; transition: rotate 0.6s var(--ease-out); }
.s-cta__btn:is(:hover, :focus-visible) .s-cta__label::after { transform: none; }
.s-cta__btn:is(:hover, :focus-visible) .s-cta__circle { scale: 1.08; }
.s-cta__btn:is(:hover, :focus-visible) .s-cta__circle svg { rotate: 0deg; }

/* dark closing variant */
.s-cta--dark { background: var(--black); color: var(--white); }
.s-cta--dark .s-cta__marquee { -webkit-text-stroke-color: rgb(255 255 255 / 0.09); }
.s-cta--dark .s-cta__text { color: rgb(255 255 255 / 0.66); }

.s-cta__eyebrow {
  display: inline-flex; align-items: center; gap: 0.9rem;
  font-size: var(--fs-small); font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
}
.s-cta__eyebrow::before { content: ""; width: 2rem; height: 1px; background: currentColor; opacity: 0.4; }

@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) and (animation-range: entry) {
    .s-cta__marquee span { animation: s-drift linear both; animation-timeline: view(); }
    @keyframes s-drift { from { translate: 5% 0; } to { translate: -35% 0; } }
  }
}

@media (max-width: 48em) {
  .s-cta__row { flex-direction: column; align-items: flex-start; }
}
