/* CTA redesign and Elementor integration, layered over the bundled reference. */
@font-face { font-family: 'Urbanist'; font-style: normal; font-weight: 800; font-display: swap; src: url('../fonts/Urbanist-800.ttf') format('truetype'); }
.clients-cta-section.jn-clients-footer,
.clients-cta-section.jn-clients-footer * { box-sizing: border-box; }
.clients-cta-section.jn-clients-footer {
  --section-padding-x: clamp(16px, 3vw, 48px);
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 0;
  padding: 0 var(--section-padding-x) var(--section-padding-x);
  background:
    radial-gradient(ellipse at 50% 30%, #7142ef80, transparent 48%),
    radial-gradient(ellipse at 8% 64%, #e6d5ff70, transparent 30%),
    radial-gradient(ellipse at 92% 64%, #e6d5ff70, transparent 30%),
    linear-gradient(180deg, var(--jn-cta-top, #09031a), var(--jn-cta-middle, #5129b5) 54%, var(--jn-cta-bottom, #ece4ff));
}
.jn-clients-footer .jn-cta-stage {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  max-width: 1440px;
  min-height: 800px;
  margin: 0 auto;
  padding: 400px 0 320px;
  isolation: isolate;
}
.jn-clients-footer .jn-cta-stage::before {
  content: '';
  position: absolute;
  inset: 10% 10% 5%;
  z-index: -1;
  border-radius: 50%;
  background: radial-gradient(ellipse, #7544ed66, transparent 68%);
  pointer-events: none;
}
.jn-clients-footer .clients-cta-content {
  position: relative;
  inset: auto;
  grid-column: auto;
  grid-row: auto;
  width: min(100%, 660px);
  margin: 0;
  padding: 0 16px;
  gap: 24px;
  transform: none;
}
.jn-clients-footer .clients-cta-content h2 {
  max-width: 100%;
  font-size: clamp(48px, 5.5vw, 82px);
  line-height: 1.02;
  letter-spacing: -.04em;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.jn-clients-footer .jn-cta-description {
  max-width: 450px;
  margin: 0 0 6px;
  color: #eee6ffcc;
  font: 400 clamp(16px, 1.5vw, 18px)/1.6 var(--font-secondary);
  text-wrap: pretty;
}
.jn-clients-footer .clients-cta-content .button {
  --button-height: 51px;
  --button-padding-x: 22px;
  --button-font-size: 17px;
  max-width: 100%;
  padding: 0 var(--button-padding-x);
  background: var(--button-bg);
}
.jn-clients-footer .clients-cta-content .button-arrow {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 0;
  background: transparent;
}
.jn-clients-footer .button-label { min-width: 0; }
.jn-clients-footer .jn-cta-phone {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 12px;
  font: 400 14px/1.5 var(--font-secondary);
}
.jn-clients-footer .jn-cta-phone-label { color: #eee6ffb3; }
.jn-clients-footer .jn-cta-phone-number {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #ffffff55;
  text-underline-offset: 5px;
}
.jn-clients-footer .jn-cta-phone-number:hover { text-decoration-color: currentColor; }
/* Drift belongs to the outer card; hover motion belongs to the inner surface. */
.jn-clients-footer .floating-project-card {
  --card-width: clamp(221px, 24.7vw, 351px);
  --card-ratio: 1.45;
  --card-radius: 18px;
  position: absolute;
  inset: auto;
  display: block;
  width: var(--card-width);
  max-width: 100%;
  aspect-ratio: var(--card-ratio);
  overflow: visible;
  border-radius: var(--card-radius);
  box-shadow: none;
  transform: translate3d(calc(var(--float-x, 0px) * var(--float-strength, 1)), calc(var(--float-y, 0px) * var(--float-strength, 1)), 0)
    translate3d(var(--float-card-drift-x, 0px), var(--float-card-drift-y, 0px), 0)
    rotate(calc(var(--card-rotate, 0deg) + var(--float-card-tilt, 0deg)));
}
.jn-clients-footer .jn-project-reveal {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
  transition: opacity 450ms ease, filter 650ms ease,
    transform 950ms cubic-bezier(.16, 1.35, .32, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
.jn-clients-footer .floating-project-card.is-reveal-pending .jn-project-reveal {
  transition: none;
  opacity: 0;
  filter: blur(14px);
  transform: translate3d(var(--reveal-x, -70px), 90px, 0) scale(.65) rotate(var(--reveal-rotate, -14deg));
}
.jn-clients-footer .floating-project-card:nth-child(even) { --reveal-x: 70px; --reveal-rotate: 14deg; }
.jn-clients-footer[data-motion="paused"] .jn-project-reveal { transition: none; }
.jn-clients-footer .cursor-trail-layer::before {
  content: '';
  position: absolute;
  left: var(--glow-x, 50%);
  top: var(--glow-y, 30%);
  width: clamp(240px, 38vw, 560px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #e3cdff38, #a16bff1a 38%, transparent 70%);
  opacity: var(--glow-opacity, 0);
  transform: translate(-50%, -50%);
  transition: left 220ms ease-out, top 220ms ease-out, opacity 450ms ease;
}
.jn-clients-footer .jn-project-surface {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 1px solid #ffffff60;
  border-radius: inherit;
  color: #fff;
  background: #180939;
  box-shadow: 0 20px 55px #10032040;
  transform: translateY(0) scale(1);
  transition: transform 400ms cubic-bezier(.2,.8,.2,1), box-shadow 400ms ease;
}
.jn-clients-footer .jn-project-surface > img,
.jn-clients-footer .jn-project-surface > video { display: block; width: 100%; height: 100%; object-fit: cover; transform: translateX(var(--image-pan, 0%)) scale(var(--image-zoom, 1)); transition: transform 600ms ease; }
.jn-clients-footer .floating-project-card:hover .jn-project-surface,
.jn-clients-footer .floating-project-card:focus-within .jn-project-surface { transform: translateY(-8px) scale(1.06); box-shadow: 0 30px 65px #10032060; }
.jn-clients-footer .floating-project-card:hover .jn-project-surface > img,
.jn-clients-footer .floating-project-card:focus-within .jn-project-surface > img { transform: translateX(var(--image-pan, 0%)) scale(calc(var(--image-zoom, 1) * 1.04)); }
.jn-clients-footer .jn-project-caption {
  position: absolute;
  inset: auto 0 0;
  display: grid;
  gap: 3px;
  padding: 24px 14px 12px;
  background: linear-gradient(transparent, #0b032bdd);
  font: 600 13px/1.3 var(--font-secondary);
  overflow-wrap: anywhere;
}
.jn-clients-footer .jn-project-caption small { color: #ffffffe0; font: 400 10px/1.4 var(--font-secondary); }
.jn-clients-footer .floating-project-card--one { top: 20%; left: 1%; --card-rotate: -11deg; }
.jn-clients-footer .floating-project-card--two { bottom: 15%; left: 4%; --card-width: clamp(195px, 19.5vw, 273px); --card-rotate: 8deg; }
.jn-clients-footer .floating-project-card--three { top: 152px; left: 35%; --card-width: clamp(195px, 18.2vw, 260px); --card-rotate: -6deg; }
.jn-clients-footer .floating-project-card--four { top: 17%; right: 1%; --card-rotate: 12deg; }
.jn-clients-footer .floating-project-card--five { bottom: 7%; right: 34%; --card-width: clamp(195px, 19.5vw, 273px); --card-rotate: -8deg; }
.jn-clients-footer .floating-project-card--six { bottom: 22%; right: 5%; --card-width: clamp(195px, 19.5vw, 273px); --card-rotate: 7deg; }
/* Keep the footer in document flow so content can grow without overlapping. */
.jn-clients-footer .site-footer-card {
  position: relative;
  inset: auto;
  grid-column: auto;
  grid-row: auto;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.3fr);
  gap: 40px clamp(28px, 5vw, 72px);
  width: 100%;
  max-width: 1360px;
  margin: 0 auto;
  padding: clamp(28px, 4vw, 56px);
  border: 1px solid #ffffff26;
  border-radius: 28px;
  background: radial-gradient(ellipse at 0 0, #45247d40, transparent 60%), #1a1a1a;
  box-shadow: 0 24px 80px #16053030;
}
.jn-clients-footer .site-footer-card > *,
.jn-clients-footer .footer-nav-group { min-width: 0; }
.jn-clients-footer .footer-brand > p {
  display: block;
  max-width: 390px;
  margin: 0 0 28px;
  font-size: clamp(21px, 2.2vw, 30px);
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.jn-clients-footer .footer-logo { max-width: 100%; margin-bottom: 24px; }
.jn-clients-footer .footer-logo > video { display: block; width: 100%; height: auto; object-fit: contain; }
.jn-clients-footer .footer-newsletter { display: grid; width: 100%; max-width: 360px; }
.jn-clients-footer .footer-newsletter-field { background: #1a1a1a; grid-template-columns: minmax(0, 1fr) 44px; height: 52px; }
.jn-clients-footer .footer-newsletter-field input { width: 100%; }
.jn-clients-footer .footer-nav-wrap { display: grid; align-items: start; padding: 6px 0 0; border: 0; }
.jn-clients-footer .footer-nav { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(20px, 3vw, 48px); }
.jn-clients-footer .footer-nav-group { gap: 14px; }
.jn-clients-footer .footer-nav-group > span { color: #ffffff70; margin-bottom: 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.jn-clients-footer .footer-nav a { width: fit-content; max-width: 100%; padding: 4px 0; font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.jn-clients-footer .footer-side { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; padding-top: 24px; border-top: 1px solid #ffffff1a; }
.jn-clients-footer .footer-socials { display: flex; flex-wrap: wrap; gap: 10px; }
.jn-clients-footer .footer-socials a { width: 44px; height: 44px; }
.jn-clients-footer .footer-side > p { color: #ffffff80; overflow-wrap: anywhere; }
.jn-clients-footer .jn-newsletter-notice[hidden] { display: none; }
.jn-clients-footer .jn-newsletter-notice { color: #ffffffc2; font: 400 14px/1.3 var(--font-secondary); }
.jn-clients-footer :is(a, button, input):focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.jn-clients-footer[data-editor="yes"] .button-label { height: auto; overflow: visible; }
.jn-clients-footer[data-editor="yes"] .button-label-track { transform: none; }
.jn-clients-footer[data-editor="yes"] .button-label-line[aria-hidden="true"] { display: none; }
@media (max-width: 1600px) {
  .jn-clients-footer .jn-cta-stage { min-height: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px 32px; padding: 208px 24px 104px; }
  .jn-clients-footer .clients-cta-content { grid-column: 1 / -1; grid-row: 2; width: min(100%, 700px); margin: 12px 0; }
  .jn-clients-footer .floating-project-card { position: relative; inset: auto; width: min(var(--card-width), 100%); }
  .jn-clients-footer .floating-project-card--one { grid-column: 1; grid-row: 1; justify-self: start; }
  .jn-clients-footer .floating-project-card--two { grid-column: 2; grid-row: 1; justify-self: center; }
  .jn-clients-footer .floating-project-card--three { grid-column: 3; grid-row: 1; justify-self: end; }
  .jn-clients-footer .floating-project-card--four { grid-column: 1; grid-row: 3; justify-self: start; }
  .jn-clients-footer .floating-project-card--five { grid-column: 2; grid-row: 3; justify-self: center; }
  .jn-clients-footer .floating-project-card--six { grid-column: 3; grid-row: 3; justify-self: end; }
}
@media (max-width: 700px) {
  .jn-clients-footer .site-footer-card { grid-template-columns: minmax(0, 1fr); gap: 30px; border-radius: 22px; }
  .jn-clients-footer .footer-nav-wrap { padding: 26px 0 0; border-top: 1px solid #ffffff1a; }
  .jn-clients-footer .footer-nav { gap: 22px; }
  .jn-clients-footer .footer-brand > p { max-width: 100%; }
  .jn-clients-footer .jn-cta-stage { gap: 48px 28px; padding: 196px 12px 88px; }
}
@media (max-width: 520px) {
  .jn-clients-footer .jn-cta-stage { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jn-clients-footer .clients-cta-content { padding: 0; gap: 20px; }
  .jn-clients-footer .clients-cta-content h2 { font-size: clamp(38px, 10.5vw, 54px); }
  .jn-clients-footer .floating-project-card { --card-width: 221px; --card-radius: 14px; }
  .jn-clients-footer .floating-project-card--two,
  .jn-clients-footer .floating-project-card--six { display: none; }
  .jn-clients-footer .floating-project-card--three,
  .jn-clients-footer .floating-project-card--five { grid-column: 2; }
  .jn-clients-footer .clients-cta-content .button { --button-font-size: 13px; --button-height: 48px; --button-padding-x: 18px; }
  .jn-clients-footer .footer-brand > p { font-size: 22px; }
  .jn-clients-footer .footer-newsletter { display: grid; }
}
@media (max-width: 380px) {
  .jn-clients-footer .site-footer-card { padding: 24px 20px; }
  .jn-clients-footer .footer-nav { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .jn-clients-footer .jn-project-surface > img,
  .jn-clients-footer .jn-project-surface > video { transform: none; }
  .jn-clients-footer .floating-project-card,
  .jn-clients-footer .jn-project-reveal,
  .jn-clients-footer .jn-project-surface,
  .jn-clients-footer .jn-project-surface > img,
  .jn-clients-footer .button,
  .jn-clients-footer .button-label-track,
  .jn-clients-footer .button-arrow svg,
  .jn-clients-footer .footer-nav a,
  .jn-clients-footer .footer-socials a { transition: none; }
  .jn-clients-footer .floating-project-card:hover .jn-project-surface,
  .jn-clients-footer .floating-project-card:focus-within .jn-project-surface,
  .jn-clients-footer .floating-project-card:hover .jn-project-surface > img,
  .jn-clients-footer .floating-project-card:focus-within .jn-project-surface > img { transform: none; }
  .jn-clients-footer .floating-project-card.is-reveal-pending .jn-project-reveal { opacity: 1; filter: none; transform: none; }
  .jn-clients-footer .cursor-trail-layer { display: none; }
}