/*
 * Shared visual rhythm.
 * Normalizes heading hierarchy and removes the competing section-intro layouts
 * that accumulated during the static prototype phase.
 */

body main h1,
body main h2,
body main h3 {
  font-family: "Manrope", sans-serif;
  text-wrap: balance;
}

body main h1 {
  font-weight: 650;
  line-height: 0.96;
  letter-spacing: -0.065em;
}

body main h2:not(.rf-preserve-size) {
  font-size: 50px !important;
  font-weight: 650;
  line-height: 1.08 !important;
  letter-spacing: -0.048em !important;
}

body main h2 em,
body main h1 em {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  line-height: inherit;
  letter-spacing: -0.035em;
}

body main h3 {
  line-height: 1.12;
  letter-spacing: -0.035em;
}

/*
 * One action-arrow system across the full site.
 * The mask keeps the icon crisp at every size and inherits each button color.
 */
:where(
  .menu-primary,
  .hero-actions a,
  .cap-poster a[href],
  .home-contact-form > button,
  .pre-footer-cta a,
  .services-hero-actions a,
  .service-story-copy > a,
  .services-testimonial > a,
  .contact-v2-actions a,
  .button-primary,
  .arrow-link,
  .platform-row a,
  .mini-footer-bottom a,
  .rf-footer-button
) {
  gap: 10px;
}

:where(
  .menu-primary,
  .hero-actions a,
  .cap-poster a[href],
  .home-contact-form > button,
  .pre-footer-cta a,
  .services-hero-actions a,
  .service-story-copy > a,
  .services-testimonial > a,
  .contact-v2-actions a,
  .button-primary,
  .arrow-link,
  .platform-row a,
  .mini-footer-bottom a,
  .rf-footer-button
)::after {
  content: "" !important;
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  display: block;
  background: currentColor;
  -webkit-mask: url("../images/action-arrow.svg") center / contain no-repeat;
  mask: url("../images/action-arrow.svg") center / contain no-repeat;
  transition: transform 180ms ease;
}

:where(
  .menu-primary,
  .hero-actions a,
  .cap-poster a[href],
  .home-contact-form > button,
  .pre-footer-cta a,
  .services-hero-actions a,
  .service-story-copy > a,
  .services-testimonial > a,
  .contact-v2-actions a,
  .button-primary,
  .arrow-link,
  .platform-row a,
  .mini-footer-bottom a,
  .rf-footer-button
):hover::after {
  transform: translate(2px, -2px);
}

.section-heading,
.process-heading,
.work-intro,
.capability-showcase-heading,
.ip-heading {
  max-width: 930px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: start !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  text-align: left !important;
}

.section-heading,
.process-heading,
.work-intro {
  margin-bottom: clamp(58px, 7vw, 88px) !important;
}

.capability-showcase-heading {
  margin-bottom: clamp(48px, 6vw, 74px) !important;
}

.ip-heading {
  margin-bottom: clamp(52px, 7vw, 84px) !important;
}

.section-heading > .section-label,
.work-intro > .section-label,
.capability-showcase-heading > p,
.ip-heading > .ip-label {
  margin: 0 !important;
}

.section-heading > div,
.capability-showcase-heading > div,
.ip-heading-copy {
  max-width: 880px !important;
}

.section-heading > div > p,
.capability-showcase-heading > div > p,
.ip-heading-copy > p {
  max-width: 700px !important;
  margin-top: 20px !important;
  font-size: 17px;
  line-height: 1.62;
}

.section-label,
.ip-label,
.services-eyebrow,
.service-story-index,
.services-testimonial > p {
  font-family: "DM Sans", sans-serif !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase;
}

.proof-copy {
  max-width: 650px;
}

.proof-copy h2 {
  max-width: 630px;
}

.proof-copy > p {
  max-width: 610px;
  font-size: 17px;
  line-height: 1.62;
}

/*
 * Shared description size.
 * UI labels, metadata and illustration microcopy intentionally stay compact.
 */
body main :where(
  .hero-copy > p,
  .services-hero-bottom > p,
  .service-spectrum-heading > span,
  .capability-showcase-heading > div > p,
  .cap-poster-copy > p,
  .cap-stack-item > p,
  .cap-launch-copy > p,
  .proof-copy > p,
  .process-list li > p,
  .home-contact-copy > p,
  .inner-hero-bottom > p,
  .ip-heading-copy > p,
  .split-copy > p:not(.ip-label),
  .article-body > p,
  .value-card > p,
  .case-content > p:first-of-type,
  .service-detail-card > p,
  .platform-row > p,
  .service-story-copy > p:not(.service-story-index),
  .service-brief > p,
  .balance-services-heading > span,
  .balance-services-grid article > p,
  .contact-v2-intro,
  .contact-v2-copy > p:not(:first-child),
  .contact-v2-next-grid article > p
) {
  font-size: 17px !important;
}

.site-footer .footer-column h2 {
  font-size: 12px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em !important;
}

.site-footer .footer-contact > h2 {
  font-size: 30px !important;
  line-height: 1.16 !important;
}

.site-header .hero-color-wash {
  filter: blur(20px) !important;
  opacity: 0.42 !important;
}

/* Keep the selected-work intro on the same grid as its project cards. */
.work-section .work-intro {
  width: min(1280px, calc(100% - 72px)) !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

/* Shared inner-page hero: centered content with one animated wave. */
.inner-page .inner-hero {
  min-height: 760px !important;
  display: flex !important;
  align-items: center !important;
  padding: 160px 0 90px !important;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(248, 252, 255, 0.86), rgba(253, 249, 255, 0.94)),
    #fbfbfe !important;
  color: #17171b !important;
  isolation: isolate;
}

.inner-page .inner-hero::before,
.inner-page .inner-hero::after {
  display: none !important;
}

.inner-hero-wave {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.inner-page .inner-hero-shell {
  width: min(1040px, calc(100% - 72px)) !important;
  display: flex;
  position: relative;
  z-index: 1;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
  text-align: center;
}

.inner-page .inner-kicker {
  width: max-content;
  justify-content: center;
  margin: 0 auto 28px !important;
  padding: 10px 15px;
  border: 1px solid rgba(37, 40, 53, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 0 10px 34px rgba(60, 54, 94, 0.08);
  color: #40424c !important;
  backdrop-filter: blur(12px);
}

.inner-page .inner-kicker::before {
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: #7657e8;
}

.inner-page .inner-hero h1,
.services-page-main .services-hero h1,
.contact-v2-main .contact-v2-hero h1 {
  max-width: 920px !important;
  margin: 0 auto 28px !important;
  color: #17171b !important;
  font-size: clamp(52px, 4.75vw, 74px) !important;
  font-weight: 650 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.055em !important;
  text-align: center;
}

.inner-page .inner-hero h1 em,
.services-page-main .services-hero h1 em,
.contact-v2-main .contact-v2-hero h1 em {
  color: #7657e8 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-style: italic;
  font-weight: 400 !important;
}

.services-page-main .services-hero-inner,
.contact-v2-main .contact-v2-hero-inner {
  text-align: center;
}

.services-page-main .services-eyebrow,
.contact-v2-main .contact-v2-eyebrow,
.contact-v2-main .contact-v2-intro {
  margin-right: auto;
  margin-left: auto;
}

.services-page-main .services-hero-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  text-align: center;
}

.services-page-main .services-hero-actions,
.contact-v2-main .contact-v2-actions {
  justify-content: center;
}

.inner-page .inner-hero-bottom {
  width: 100%;
  display: flex !important;
  flex-direction: column;
  align-items: center !important;
  justify-content: center;
  gap: 24px !important;
}

.inner-page .inner-hero-bottom > p {
  max-width: 720px !important;
  margin: 0 auto !important;
  color: rgba(23, 23, 27, 0.7) !important;
  line-height: 1.65;
  text-align: center;
}

.inner-page .inner-hero .hero-code-card {
  width: min(360px, 100%);
  padding: 16px 20px;
  border-color: rgba(118, 87, 232, 0.13) !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: 0 18px 55px rgba(51, 45, 88, 0.1) !important;
  text-align: left;
}

.inner-page .inner-hero .hero-code-card span {
  color: rgba(23, 23, 27, 0.5) !important;
}

.inner-page .inner-hero .hero-code-card code {
  color: #4b4d58 !important;
}

.inner-page .inner-hero .hero-code-card b {
  color: #7657e8 !important;
}

@media (max-width: 760px) {
  body main h2:not(.rf-preserve-size) {
    font-size: 42px !important;
  }

  .section-heading,
  .process-heading,
  .work-intro,
  .capability-showcase-heading,
  .ip-heading {
    gap: 14px !important;
  }

  .inner-page .inner-hero {
    min-height: 700px !important;
    padding: 132px 0 72px !important;
  }

  .inner-page .inner-hero-shell {
    width: calc(100% - 32px) !important;
  }

  .inner-page .inner-hero h1,
  .services-page-main .services-hero h1,
  .contact-v2-main .contact-v2-hero h1 {
    font-size: clamp(54px, 15vw, 76px) !important;
  }
}

@media (max-width: 430px) {
  body main h2:not(.rf-preserve-size) {
    font-size: 38px !important;
  }
}

/* Homepage hero: neutral moving wave paths */
.site-header {
  background: #edf0f3 !important;
}

.site-header .hero-art {
  display: block !important;
  z-index: 8 !important;
  overflow: hidden;
  background: transparent !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}

.site-header .hero-color-wash {
  display: none !important;
  animation: none !important;
  background: none !important;
  filter: none !important;
}

/* Visible fallback while the canvas initializes. */
.site-header .hero-art::before,
.site-header .hero-art::after {
  content: "";
  position: absolute;
  display: block !important;
  width: 138%;
  height: 48%;
  left: -19%;
  border: 2px solid rgba(111, 124, 140, 0.42);
  border-left-color: transparent;
  border-right-color: transparent;
  border-radius: 50%;
  background: none !important;
  filter: none !important;
  pointer-events: none;
}

.site-header .hero-art::before {
  top: 13%;
  transform: rotate(-4deg);
}

.site-header .hero-art::after {
  top: 49%;
  transform: rotate(3deg);
}

.site-header.has-wave-canvas .hero-art::before,
.site-header.has-wave-canvas .hero-art::after {
  opacity: 0.18;
}

.site-header .color-wave-canvas {
  display: none !important;
  z-index: 0 !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}

.site-header .hero-shade {
  z-index: 9 !important;
  background: linear-gradient(90deg, rgba(237, 240, 243, 0.12), transparent 52%, rgba(237, 240, 243, 0.2)) !important;
}

.site-header .hero-content {
  z-index: 10;
}

/* CSS wave system: visible without JavaScript and animated by the browser. */
.site-header .hero-wave-system {
  position: absolute;
  inset: 0;
  z-index: 3;
  overflow: hidden;
  pointer-events: none;
}

.site-header .hero-wave-lane {
  position: absolute;
  display: block;
  width: 132%;
  height: clamp(170px, 20vw, 310px);
  left: -16%;
  border: 2px solid rgba(93, 106, 121, 0.54);
  border-left-color: transparent;
  border-right-color: transparent;
  border-radius: 50%;
  transform-origin: center;
  will-change: transform;
}

.site-header .hero-wave-lane-one {
  top: 2%;
  transform: rotate(-5deg);
  animation: rf-wave-dance-one 12s ease-in-out infinite alternate;
}

.site-header .hero-wave-lane-two {
  top: 22%;
  height: clamp(210px, 24vw, 370px);
  transform: rotate(4deg);
  animation: rf-wave-dance-two 15s ease-in-out infinite alternate;
}

.site-header .hero-wave-lane-three {
  top: 49%;
  transform: rotate(-3deg);
  animation: rf-wave-dance-three 13s ease-in-out infinite alternate;
}

.site-header .hero-wave-lane-four {
  top: 69%;
  height: clamp(145px, 17vw, 255px);
  transform: rotate(3deg);
  animation: rf-wave-dance-four 16s ease-in-out infinite alternate;
}

.site-header .hero-wave-signal {
  position: absolute;
  display: block;
  top: calc(50% - 5px);
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #3d6dff;
  box-shadow: 0 0 0 4px rgba(61, 109, 255, 0.14), 0 0 22px 7px rgba(61, 109, 255, 0.34);
  will-change: transform;
}

.site-header .hero-wave-lane-one .hero-wave-signal {
  animation: rf-signal-one 9s linear infinite;
}

.site-header .hero-wave-lane-two .hero-wave-signal {
  animation: rf-signal-two 11s linear infinite -3.5s;
}

.site-header .hero-wave-lane-three .hero-wave-signal {
  animation: rf-signal-three 10s linear infinite -6.5s;
}

.site-header .hero-wave-lane-four .hero-wave-signal {
  animation: rf-signal-four 12s linear infinite -2s;
}

@keyframes rf-wave-dance-one {
  from { transform: translate3d(-2%, -10px, 0) rotate(-5deg) scaleY(0.94); }
  to { transform: translate3d(2%, 16px, 0) rotate(-1deg) scaleY(1.05); }
}

@keyframes rf-wave-dance-two {
  from { transform: translate3d(2%, 15px, 0) rotate(4deg) scaleY(1.04); }
  to { transform: translate3d(-2%, -14px, 0) rotate(0deg) scaleY(0.93); }
}

@keyframes rf-wave-dance-three {
  from { transform: translate3d(-1%, -15px, 0) rotate(-3deg) scaleY(0.95); }
  to { transform: translate3d(3%, 12px, 0) rotate(2deg) scaleY(1.06); }
}

@keyframes rf-wave-dance-four {
  from { transform: translate3d(2%, 10px, 0) rotate(3deg) scaleY(1.05); }
  to { transform: translate3d(-2%, -8px, 0) rotate(-1deg) scaleY(0.93); }
}

@keyframes rf-signal-one {
  0% { transform: translate3d(-5vw, -14px, 0); opacity: 0; }
  8%, 88% { opacity: 1; }
  25% { transform: translate3d(32vw, 27px, 0); }
  50% { transform: translate3d(68vw, -20px, 0); }
  75% { transform: translate3d(102vw, 18px, 0); }
  100% { transform: translate3d(138vw, -10px, 0); opacity: 0; }
}

@keyframes rf-signal-two {
  0% { transform: translate3d(138vw, 13px, 0); opacity: 0; }
  8%, 88% { opacity: 1; }
  25% { transform: translate3d(102vw, -24px, 0); }
  50% { transform: translate3d(68vw, 19px, 0); }
  75% { transform: translate3d(32vw, -18px, 0); }
  100% { transform: translate3d(-5vw, 12px, 0); opacity: 0; }
}

@keyframes rf-signal-three {
  0% { transform: translate3d(-5vw, 12px, 0); opacity: 0; }
  8%, 88% { opacity: 1; }
  25% { transform: translate3d(33vw, -22px, 0); }
  50% { transform: translate3d(68vw, 20px, 0); }
  75% { transform: translate3d(103vw, -15px, 0); }
  100% { transform: translate3d(138vw, 9px, 0); opacity: 0; }
}

@keyframes rf-signal-four {
  0% { transform: translate3d(138vw, -10px, 0); opacity: 0; }
  8%, 88% { opacity: 1; }
  25% { transform: translate3d(103vw, 19px, 0); }
  50% { transform: translate3d(68vw, -16px, 0); }
  75% { transform: translate3d(31vw, 18px, 0); }
  100% { transform: translate3d(-5vw, -9px, 0); opacity: 0; }
}

.site-header .hero-copy,
.site-header .hero-kicker,
.site-header .hero-kicker b,
.site-header .hero-copy h1,
.site-header .hero-copy > p,
.site-header .hero-actions .hero-primary {
  color: #161a20 !important;
  -webkit-text-fill-color: #161a20 !important;
}

.site-header .hero-copy h1 {
  max-width: 760px;
  font-size: clamp(62px, 5.7vw, 94px) !important;
  font-weight: 800 !important;
  line-height: 0.88 !important;
  letter-spacing: -0.075em !important;
}

.site-header .hero-copy h1 .hero-line {
  color: #161a20 !important;
  -webkit-text-fill-color: #161a20 !important;
}

.site-header .hero-copy h1 .hero-line-accent {
  color: #4b68ec !important;
  -webkit-text-fill-color: #4b68ec !important;
  text-shadow: none;
}

.site-header .hero-copy > p {
  color: #586270 !important;
  -webkit-text-fill-color: #586270 !important;
}

.site-header .hero-actions .hero-primary {
  background: #172033 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 16px 34px rgba(29, 42, 63, 0.16) !important;
}

.site-header .hero-kicker b {
  border-color: rgba(22, 26, 32, 0.12) !important;
  background: rgba(255, 255, 255, 0.56) !important;
  color: #3e4857 !important;
  -webkit-text-fill-color: #3e4857 !important;
  box-shadow: none !important;
}

@media (max-width: 720px) {
  .site-header .hero-copy h1 {
    font-size: clamp(52px, 13.4vw, 74px) !important;
  }
}

/* Homepage hero: a centred, product-engineering banner. */
.site-header {
  min-height: max(780px, 100svh) !important;
  background: #030405 !important;
}

.site-header .hero-art {
  z-index: 0 !important;
  background: #030405 !important;
}

.site-header .hero-shade {
  z-index: 1 !important;
  background: linear-gradient(180deg, rgba(3, 4, 5, 0.06), rgba(3, 4, 5, 0.32)) !important;
}

.site-header .hero-wave-system,
.site-header .hero-art::before,
.site-header .hero-art::after,
.site-header .color-wave-canvas {
  display: none !important;
}

.site-header .hero-outline-forms {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
}

.site-header .hero-outline {
  position: absolute;
  display: block;
  width: clamp(370px, 36vw, 620px);
  height: clamp(490px, 46vw, 760px);
  border: 1px solid rgba(198, 214, 255, 0.13);
  border-radius: 84px 180px 120px 220px;
  background: linear-gradient(145deg, rgba(104, 125, 255, 0.035), transparent 55%);
  transform: rotate(-17deg);
}

.site-header .hero-outline-left {
  left: clamp(-380px, -18vw, -150px);
  top: 25%;
}

.site-header .hero-outline-right {
  right: clamp(-390px, -18vw, -150px);
  top: 17%;
  transform: rotate(17deg);
}

.site-header .hero-outline-bottom {
  width: min(1080px, 76vw);
  height: 230px;
  left: 50%;
  bottom: -154px;
  border-radius: 50%;
  transform: translateX(-50%) rotate(0deg);
}

.site-header .hero-spectrum-fold {
  position: absolute;
  z-index: 2;
  top: 53%;
  left: 50%;
  width: clamp(210px, 18vw, 310px);
  aspect-ratio: 0.82;
  transform: translate(-50%, -4%) rotate(45deg) skew(-6deg, -5deg);
  overflow: hidden;
  clip-path: polygon(51% 0, 100% 30%, 85% 88%, 51% 100%, 2% 68%, 9% 23%);
  filter: drop-shadow(0 22px 45px rgba(62, 91, 237, 0.2));
  animation: rf-fold-float 9s ease-in-out infinite alternate;
}

.site-header .hero-fold-glass,
.site-header .hero-fold-core {
  position: absolute;
  inset: 0;
  display: block;
}

.site-header .hero-fold-glass {
  background:
    radial-gradient(circle at 23% 22%, rgba(149, 218, 255, 0.96), transparent 23%),
    radial-gradient(circle at 79% 69%, rgba(104, 78, 239, 0.86), transparent 33%),
    linear-gradient(138deg, #07142e 4%, #1556bc 43%, #8a67ee 72%, #e067ab 100%);
  animation: rf-fold-colour 10s ease-in-out infinite alternate;
}

.site-header .hero-fold-core {
  clip-path: polygon(53% 0, 100% 30%, 66% 58%, 53% 100%, 29% 62%, 8% 24%);
  background:
    linear-gradient(115deg, transparent 0 38%, rgba(255, 255, 255, 0.4) 48%, transparent 59%),
    radial-gradient(circle at 74% 24%, rgba(255, 105, 176, 0.84), transparent 29%),
    linear-gradient(166deg, #0f2761, #04a6d9 49%, #ff5a74 100%);
  mix-blend-mode: screen;
  opacity: 0.88;
}

.site-header .hero-content {
  z-index: 4;
  min-height: max(780px, 100svh) !important;
  justify-content: center !important;
  padding: 154px 0 96px !important;
}

.site-header .hero-layout {
  display: block !important;
  width: min(980px, 100%);
  margin: 0 auto;
  text-align: center;
}

.site-header .hero-copy {
  display: flex !important;
  flex-direction: column;
  align-items: center;
}

.site-header .service-demo-card {
  display: none !important;
}

.site-header .hero-kicker {
  margin: 0 0 26px !important;
}

.site-header .hero-kicker b {
  border-color: rgba(255, 255, 255, 0.15) !important;
  background: rgba(255, 255, 255, 0.05) !important;
  color: rgba(255, 255, 255, 0.78) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.78) !important;
}

.site-header .hero-copy h1 {
  max-width: 900px;
  margin: 0;
  color: #f7f8fc !important;
  font-size: clamp(64px, 7.1vw, 112px) !important;
  font-weight: 620 !important;
  line-height: 0.91 !important;
  letter-spacing: -0.078em !important;
}

.site-header .hero-copy h1 .hero-line {
  color: #f7f8fc !important;
  -webkit-text-fill-color: #f7f8fc !important;
}

.site-header .hero-copy h1 .hero-line-accent {
  color: #a9c8ff !important;
  -webkit-text-fill-color: #a9c8ff !important;
}

.site-header .hero-copy > p {
  max-width: 570px !important;
  margin-top: 266px !important;
  color: rgba(239, 244, 255, 0.74) !important;
  -webkit-text-fill-color: rgba(239, 244, 255, 0.74) !important;
  text-align: center;
}

.site-header .hero-actions {
  margin-top: 22px !important;
}

.site-header .hero-actions .hero-primary {
  min-height: 52px;
  border: 1px solid rgba(214, 226, 255, 0.36) !important;
  border-radius: 999px !important;
  background: rgba(232, 239, 255, 0.1) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: none !important;
  backdrop-filter: blur(12px);
}

.site-header .hero-platforms {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 46px;
  color: rgba(232, 239, 255, 0.48);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.site-header .hero-platforms i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #7b8cff;
}

@keyframes rf-fold-float {
  from { transform: translate(-50%, -2%) rotate(42deg) skew(-6deg, -5deg) scale(0.96); }
  to { transform: translate(-50%, 5%) rotate(48deg) skew(-3deg, -7deg) scale(1.04); }
}

@keyframes rf-fold-colour {
  from { filter: hue-rotate(0deg) saturate(1); }
  to { filter: hue-rotate(22deg) saturate(1.2); }
}

@media (max-width: 760px) {
  .site-header .hero-content {
    min-height: 760px !important;
    padding: 124px 0 60px !important;
  }

  .site-header .hero-copy h1 {
    font-size: clamp(55px, 14.4vw, 78px) !important;
  }

  .site-header .hero-spectrum-fold {
    top: 50%;
    width: clamp(175px, 46vw, 260px);
  }

  .site-header .hero-copy > p {
    margin-top: 215px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-header .hero-spectrum-fold,
  .site-header .hero-fold-glass {
    animation: none !important;
  }
}

/* Restored light wave hero. */
.site-header {
  min-height: 820px !important;
  background: #edf0f3 !important;
}

.site-header .hero-art {
  z-index: 8 !important;
  background: transparent !important;
}

.site-header .hero-shade {
  z-index: 9 !important;
  background: linear-gradient(90deg, rgba(237, 240, 243, 0.1), transparent 52%, rgba(237, 240, 243, 0.16)) !important;
}

.site-header .hero-wave-system {
  display: block !important;
}

.site-header .hero-art::before,
.site-header .hero-art::after {
  display: block !important;
}

.site-header .hero-outline-forms,
.site-header .hero-spectrum-fold,
.site-header .hero-platforms,
.site-header .color-wave-canvas {
  display: none !important;
}

.site-header .hero-content {
  z-index: 10;
  min-height: 820px !important;
  justify-content: flex-end !important;
  padding: 140px 0 58px !important;
}

.site-header .hero-layout {
  display: grid !important;
  width: auto;
  margin: 0;
  grid-template-columns: minmax(0, 0.93fr) minmax(480px, 0.78fr) !important;
  gap: clamp(60px, 6vw, 96px) !important;
  text-align: left;
}

.site-header .hero-copy {
  display: block !important;
  text-align: left;
}

.site-header .service-demo-card {
  display: block !important;
}

.site-header .hero-kicker {
  margin: 0 0 34px !important;
}

.site-header .hero-kicker b {
  border-color: rgba(22, 26, 32, 0.12) !important;
  background: rgba(255, 255, 255, 0.56) !important;
  color: #3e4857 !important;
  -webkit-text-fill-color: #3e4857 !important;
}

.site-header .hero-copy h1 {
  max-width: 760px;
  margin: 0;
  color: #161a20 !important;
  font-size: clamp(62px, 5.7vw, 94px) !important;
  font-weight: 800 !important;
  line-height: 0.88 !important;
  letter-spacing: -0.075em !important;
}

.site-header .hero-copy h1 .hero-line {
  color: #161a20 !important;
  -webkit-text-fill-color: #161a20 !important;
}

.site-header .hero-copy h1 .hero-line-accent {
  color: #4b68ec !important;
  -webkit-text-fill-color: #4b68ec !important;
}

.site-header .hero-copy > p {
  max-width: 570px !important;
  margin-top: 22px !important;
  color: #586270 !important;
  -webkit-text-fill-color: #586270 !important;
  text-align: left;
}

.site-header .hero-actions {
  margin-top: 31px !important;
}

.site-header .hero-actions .hero-primary {
  min-height: 50px;
  border: 0 !important;
  border-radius: 7px !important;
  background: #172033 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 16px 34px rgba(29, 42, 63, 0.16) !important;
}

@media (max-width: 900px) {
  .site-header .hero-content {
    min-height: 760px !important;
    padding: 128px 0 52px !important;
  }

  .site-header .hero-layout {
    grid-template-columns: 1fr !important;
  }
}

/* Soft brand-wave treatment for the homepage hero. */
.site-header {
  background: #f8f9fd !important;
}

.site-header .hero-art {
  background: #f8f9fd !important;
}

.site-header .hero-shade {
  background: linear-gradient(90deg, rgba(248, 249, 253, 0.14), rgba(248, 249, 253, 0.02) 52%, rgba(248, 249, 253, 0.13)) !important;
}

.site-header .hero-wave-system {
  z-index: 3;
  display: block !important;
  opacity: 0.92;
}

.site-header .hero-wave-lane {
  height: clamp(190px, 21vw, 340px);
  border: 0;
  border-radius: 48% 52% 45% 55% / 62% 48% 52% 38%;
  filter: blur(21px);
  opacity: 0.66;
}

.site-header .hero-wave-lane-one {
  top: 17%;
  background: linear-gradient(94deg, rgba(107, 205, 255, 0.56), rgba(149, 117, 247, 0.52) 51%, rgba(255, 136, 213, 0.48));
}

.site-header .hero-wave-lane-two {
  top: 34%;
  background: linear-gradient(88deg, rgba(126, 160, 255, 0.46), rgba(193, 109, 243, 0.64) 48%, rgba(255, 156, 221, 0.46));
}

.site-header .hero-wave-lane-three {
  top: 55%;
  background: linear-gradient(94deg, rgba(255, 226, 166, 0.34), rgba(124, 187, 255, 0.47) 42%, rgba(177, 137, 255, 0.52) 70%, rgba(255, 168, 219, 0.45));
}

.site-header .hero-wave-lane-four {
  top: 74%;
  background: linear-gradient(88deg, rgba(205, 226, 255, 0.38), rgba(128, 151, 255, 0.52) 45%, rgba(239, 166, 255, 0.43));
}

.site-header .hero-wave-signal {
  display: none;
}

.site-header .hero-art::before,
.site-header .hero-art::after {
  border-color: rgba(103, 112, 178, 0.13);
  border-left-color: transparent;
  border-right-color: transparent;
  opacity: 0.86;
}

.site-header .hero-copy h1,
.site-header .hero-copy h1 .hero-line,
.site-header .hero-copy h1 .hero-line-accent {
  color: #171821 !important;
  -webkit-text-fill-color: #171821 !important;
}

.site-header .hero-copy h1 {
  max-width: 690px;
  font-size: clamp(62px, 5.45vw, 90px) !important;
  font-weight: 780 !important;
  line-height: 0.88 !important;
}

.site-header .hero-copy > p {
  color: #555d6b !important;
  -webkit-text-fill-color: #555d6b !important;
}

.site-header .hero-kicker b {
  background: rgba(255, 255, 255, 0.72) !important;
}

.site-header .hero-actions .hero-primary {
  border-radius: 7px !important;
  background: linear-gradient(105deg, #8f57e9, #596adf) !important;
  box-shadow: 0 16px 35px rgba(105, 90, 222, 0.26) !important;
}

/* Dark version of the same brand-wave composition. */
.site-header {
  background: #050608 !important;
}

.site-header .hero-art {
  background: #050608 !important;
}

.site-header .hero-shade {
  background: linear-gradient(90deg, rgba(5, 6, 8, 0.24), rgba(5, 6, 8, 0.04) 52%, rgba(5, 6, 8, 0.2)) !important;
}

.site-header .hero-wave-system {
  opacity: 0.72;
}

.site-header .hero-wave-lane-one {
  background: linear-gradient(94deg, rgba(25, 115, 220, 0.48), rgba(100, 63, 222, 0.53) 51%, rgba(226, 79, 173, 0.42));
}

.site-header .hero-wave-lane-two {
  background: linear-gradient(88deg, rgba(44, 81, 205, 0.42), rgba(137, 62, 211, 0.55) 48%, rgba(236, 91, 174, 0.39));
}

.site-header .hero-wave-lane-three {
  background: linear-gradient(94deg, rgba(72, 120, 255, 0.32), rgba(71, 148, 235, 0.39) 42%, rgba(125, 83, 235, 0.48) 70%, rgba(226, 93, 176, 0.38));
}

.site-header .hero-wave-lane-four {
  background: linear-gradient(88deg, rgba(33, 94, 193, 0.33), rgba(79, 84, 218, 0.46) 45%, rgba(207, 83, 190, 0.36));
}

.site-header .hero-art::before,
.site-header .hero-art::after {
  border-color: rgba(191, 210, 255, 0.16);
  border-left-color: transparent;
  border-right-color: transparent;
}

.site-header .hero-copy h1,
.site-header .hero-copy h1 .hero-line {
  color: #f7f8fc !important;
  -webkit-text-fill-color: #f7f8fc !important;
}

.site-header .hero-copy h1 .hero-line-accent {
  color: #a9c8ff !important;
  -webkit-text-fill-color: #a9c8ff !important;
}

.site-header .hero-copy > p {
  color: rgba(235, 240, 250, 0.74) !important;
  -webkit-text-fill-color: rgba(235, 240, 250, 0.74) !important;
}

.site-header .hero-kicker b {
  border-color: rgba(255, 255, 255, 0.14) !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.82) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.82) !important;
}

/* Canvas-owned black wave background. */
.site-header {
  background: #050608 !important;
}

.site-header .hero-art {
  background: #050608 !important;
}

.site-header .hero-wave-system,
.site-header .hero-art::before,
.site-header .hero-art::after {
  display: none !important;
}

.site-header .color-wave-canvas {
  position: absolute;
  inset: 0;
  z-index: 3 !important;
  display: block !important;
  width: 100%;
  height: 100%;
  opacity: 1 !important;
  pointer-events: none;
  mix-blend-mode: normal !important;
}

.site-header .hero-shade {
  background: linear-gradient(90deg, rgba(5, 6, 8, 0.2), transparent 53%, rgba(5, 6, 8, 0.18)) !important;
}

/* Home hero balance: keep the visual focus central with a calmer two-wave field. */
@media (min-width: 901px) {
  .site-header .hero-content {
    min-height: 820px !important;
    padding: 118px 0 118px !important;
  }

  .site-header .hero-layout {
    transform: translateY(-78px);
  }
}

@media (max-width: 900px) {
  .site-header .hero-content {
    padding-bottom: 82px !important;
  }
}