/* Hero vortex (hero-vortex.js, vortex.js): services pulled into the Signal half circle. */
.hero.v-vortex { min-height: calc(100svh - 64px); min-height: max(560px, calc(100svh - 64px)); padding-bottom: 120px; }
/* Headline, copy and CTAs stacked in a left column, centred vertically in the hero. */
.hero.v-vortex { display: grid; align-content: center; }
.hero.v-vortex .hero-top { grid-template-columns: minmax(0, 640px); align-items: start; row-gap: 28px; }
.hero.v-vortex h1 { font-size: clamp(32px, 4.4vw, 64px); }  /* three lines: "Your whole business / in one place. / And Ai that knows it." */
@media (max-width: 900px) { .hero.v-vortex h1 { font-size: clamp(32px, 8.4vw, 60px); } }
.hero.v-vortex .hero-side p { max-width: 30em; }
/* The full stop leaves the headline: it becomes the core in the corner. */
.hero.v-vortex h1 .stop { display: none; }
.hero.v-vortex h1 .nw::after { content: "."; }
.hero.v-vortex .hero-rings { -webkit-mask-image: none; mask-image: none; }
.hxv-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
.hxv-canvas[hidden], .hxv-core[hidden] { display: none; }
/* Centred in the right half of the hero, sitting on its bottom edge. */
.hxv-core { --pulse: 0; position: absolute; z-index: 0; left: 75%; translate: -50% 0; bottom: 0; width: 120px; height: 60px; pointer-events: none; }
.hxv-dome { position: absolute; inset: 0; border-radius: 120px 120px 0 0; background: linear-gradient(180deg, #FF7A45, var(--adaptum-signal) 55%, #E94A12);
  box-shadow: 0 -6px 30px rgb(255 90 31 / calc(.35 + var(--pulse) * .35)), inset 0 2px 0 rgb(255 255 255 / .35); transform: scale(calc(1 + var(--pulse) * .06)); transform-origin: 50% 100%; transition: transform .25s; }
.hxv-glow { position: absolute; left: 50%; bottom: 0; width: 520px; height: 520px; translate: -50% 50%; border-radius: 50%;
  background: radial-gradient(closest-side, rgb(255 90 31 / calc(.16 + var(--pulse) * .1)), rgb(255 90 31 / .04) 55%, transparent); }
@media (max-width: 700px) {
  /* Copy at the top; the open area below it (at least 220px) runs to the fold and holds the icon stream. */
  .hero.v-vortex { padding-bottom: 220px; align-content: start; }
  .hxv-core { left: auto; right: 32px; translate: none; bottom: 0; width: 96px; height: 48px; }
  .hxv-glow { width: 360px; height: 360px; }
}

/* Icons pass beneath the copy; a soft halo in the page colour keeps the type legible over them. */
.hero.v-vortex h1, .hero.v-vortex .hero-side p, .hero.v-vortex .lnk { text-shadow: 0 0 2px #FBFAF7, 0 0 10px #FBFAF7, 0 0 22px rgb(251 250 247 / .9); }