/*! WindspeedSEO Visual System - WP1D hero-shell layer v1.1.1
 * Shared hero-shell entrance grammar + the page modules (boundary / message tracker / check record / document index)
 * and the mid-page modules (process chain / lifecycle timeline / coverage / routing map). Loads after ws-visual.css.
 */
/* ============================================================ HERO SHELL (WP1D) */
/* Every primary page shares one hero band (kit class ws-hero-shell = size) and one entrance grammar (below); the page-specific
   module inside it carries its own sequence. Home keeps its Convergence Field rules above; the copy cadence here is the same
   Figma H2 cadence (eyebrow .10 s, H1 .22, lede .42, actions .60, sources .78) so every page opens with the same rhythm. */
.ws-js .ws-hero-shell .ws-hero-seq { opacity: 0; transform: translateY(14px); }
.ws-js .ws-hero-shell .ws-hero-eyebrow.ws-hero-seq { transform: translateY(10px); }
.ws-js .ws-hero-shell .ws-hero-title.ws-hero-seq   { transform: translateY(18px); }
.ws-js .ws-hero-shell .ws-btn-row.ws-hero-seq      { transform: translateY(12px); }
.ws-js .ws-hero-shell .ws-hero-proof.ws-hero-seq,
.ws-js .ws-hero-shell .ws-hero-meta.ws-hero-seq    { transform: translateY(10px); }
.ws-js .ws-hero-shell .ws-hero-aside.ws-hero-seq   { transform: translateY(16px) scale(.985); }
.ws-js .ws-hero-shell.ws-hero-in .ws-hero-seq { opacity: 1; transform: none; transition: opacity 600ms var(--ws-ease-out), transform 600ms var(--ws-ease-out); }
.ws-js .ws-hero-shell.ws-hero-in .ws-hero-eyebrow.ws-hero-seq { transition-delay: 100ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-hero-title.ws-hero-seq   { transition-delay: 220ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-hero-lede.ws-hero-seq    { transition-delay: 420ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-btn-row.ws-hero-seq      { transition-delay: 600ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-hero-proof.ws-hero-seq,
.ws-js .ws-hero-shell.ws-hero-in .ws-hero-meta.ws-hero-seq    { transition-delay: 780ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-hero-aside.ws-hero-seq   { transition-delay: 300ms; transition-duration: 700ms; }
/* light-page atmosphere: the glows recede on a pale surface */
.elementor .ws-hero--light.ws-atmosphere::before { background: radial-gradient(closest-side, rgba(76,156,200,.15), rgba(76,156,200,0)); }
.elementor .ws-hero--light.ws-atmosphere::after  { background: radial-gradient(closest-side, rgba(131,180,34,.11), rgba(131,180,34,0)); }

/* --------------------------------------------------------- Pricing: the boundary */
/* Sequence: Insights rows check in (0.8 s + 120 ms each) -> the green line draws (1.5 s) -> Managed rows arrive (2.0 s + 120 ms each) ->
   the VERIFIED badge resolves last (3.1 s). Blue leads into the decision, green only where work is carried out and checked. */
.ws-js .ws-hero-shell .ws-boundary-row { opacity: 0; transform: translateX(-10px); }
.ws-js .ws-hero-shell .ws-boundary-row .ws-boundary-mark { opacity: 0; transform: scale(.4); }
.ws-js .ws-hero-shell .ws-boundary-line { transform: scaleY(0); transform-origin: top center; }
.ws-js .ws-hero-shell .ws-boundary-label, .ws-js .ws-hero-shell .ws-boundary-foot { opacity: 0; }
.ws-js .ws-hero-shell .ws-boundary-badge { opacity: 0; transform: scale(.7); }
.ws-js .ws-hero-shell.ws-hero-in .ws-boundary-row { opacity: 1; transform: none; transition: opacity 420ms var(--ws-ease-out) var(--ws-delay, 0ms), transform 420ms var(--ws-ease-out) var(--ws-delay, 0ms); }
.ws-js .ws-hero-shell.ws-hero-in .ws-boundary-row .ws-boundary-mark { opacity: 1; transform: none; transition: opacity 300ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 180ms), transform 360ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 180ms); }
.ws-js .ws-hero-shell .ws-boundary-col--insights .ws-boundary-row { --ws-delay: calc(800ms + var(--ws-i, 0) * 120ms); }
.ws-js .ws-hero-shell .ws-boundary-col--managed  .ws-boundary-row { --ws-delay: calc(2000ms + var(--ws-i, 0) * 120ms); }
.ws-js .ws-hero-shell.ws-hero-in .ws-boundary-line { transform: none; transition: transform 600ms var(--ws-ease-out) 1500ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-boundary-label { opacity: 1; transition: opacity 400ms var(--ws-ease-out) 1800ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-boundary-foot { opacity: 1; transition: opacity 500ms var(--ws-ease-out) 2800ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-boundary-badge { opacity: 1; transform: none; transition: opacity 300ms var(--ws-ease-out) 3100ms, transform 420ms var(--ws-ease-out) 3100ms; }
@media (max-width: 1023px) { .ws-js .ws-hero-shell .ws-boundary-line { transform: scaleX(0); transform-origin: left center; } }
.elementor .ws-boundary-badge { display: inline-flex; align-items: center; height: 20px; padding-inline: 8px; margin-inline-start: 8px; border-radius: 9999px; border: 1px solid rgba(161,203,69,.55); background-color: rgba(161,203,69,.12); font-family: var(--ws-mono); font-size: 10px; line-height: 18px; letter-spacing: .08em; text-transform: uppercase; color: #D8ECAE; vertical-align: middle; }
.elementor .ws-boundary-mark { -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-position: center; mask-position: center; background-color: currentColor; }
.elementor .ws-boundary-mark--check { -webkit-mask-image: var(--ws-asset-icon-check); mask-image: var(--ws-asset-icon-check); }
.elementor .ws-boundary-mark--arrow { -webkit-mask-image: var(--ws-asset-icon-arrow-right); mask-image: var(--ws-asset-icon-arrow-right); }
.elementor .ws-boundary-mark--dash { -webkit-mask-image: none; mask-image: none; background: none; height: 18px; }
.elementor .ws-boundary-mark--dash::before { content: ""; display: block; width: 12px; height: 1.5px; margin: 8px 3px 0; background-color: currentColor; }
.elementor .ws-boundary-eyebrow, .elementor .ws-boundary-label { font-family: var(--ws-mono); }

/* --------------------------------------------------------- Contact: message tracker */
/* Sequence: message card + dot 1 (0.8 s) -> rail fills (1.0 s) -> read card + dot 2 (1.5 s) -> demo card + dot 3 (2.2 s) -> answered card + dot 4 green (2.9 s);
   the status chip flips SENT -> READ -> ANSWERED with each stage. Afterwards a slow pulse travels the rail (continuous, paused offscreen). */
.ws-js .ws-hero-shell .ws-route-card { opacity: 0; transform: translateY(12px); }
.ws-js .ws-hero-shell .ws-route-dot { transform: scale(.8); }
.ws-js .ws-hero-shell .ws-route-track-fill { transform: scaleY(0); transform-origin: top center; }
.ws-js .ws-hero-shell .ws-route-status p, .ws-js .ws-hero-shell .ws-route-status p.ws-route-status-item--done { opacity: 0; } /* outranks the no-JS final state below; the keyframes show each label in turn */
.ws-js .ws-hero-shell.ws-hero-in .ws-route-card { opacity: 1; transform: none; transition: opacity 480ms var(--ws-ease-out) var(--ws-delay, 0ms), transform 480ms var(--ws-ease-out) var(--ws-delay, 0ms); }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-card--message { --ws-delay: 800ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-card--read    { --ws-delay: 1500ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-card--demo    { --ws-delay: 2200ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-card--answer  { --ws-delay: 2900ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-track-fill { transform: none; transition: transform 2000ms linear 1000ms; }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-dot { transform: none; transition: border-color 260ms var(--ws-ease-out) var(--ws-delay, 0ms), background-color 260ms var(--ws-ease-out) var(--ws-delay, 0ms), color 260ms var(--ws-ease-out) var(--ws-delay, 0ms), box-shadow 260ms var(--ws-ease-out) var(--ws-delay, 0ms), transform 260ms var(--ws-ease-out) var(--ws-delay, 0ms); }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-dot--1 { --ws-delay: 800ms; border-color: #4C9CC8; color: #286788; box-shadow: 0 0 0 4px rgba(76,156,200,.14); }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-dot--2 { --ws-delay: 1500ms; border-color: #4C9CC8; color: #286788; box-shadow: 0 0 0 4px rgba(76,156,200,.14); }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-dot--3 { --ws-delay: 2200ms; border-color: #4C9CC8; color: #286788; box-shadow: 0 0 0 4px rgba(76,156,200,.14); }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-dot--4 { --ws-delay: 2900ms; border-color: #83B422; background-color: #A1CB45; color: #1C2B0A; box-shadow: 0 0 0 4px rgba(161,203,69,.18); }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-status-item--sent { animation: ws-status-sent 1ms linear 900ms forwards, ws-status-hide 1ms linear 1550ms forwards; }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-status-item--read { animation: ws-status-show 1ms linear 1550ms forwards, ws-status-hide 1ms linear 3000ms forwards; }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-status-item--done { animation: ws-status-show 1ms linear 3000ms forwards; }
@keyframes ws-status-sent { to { opacity: 1; } }
@keyframes ws-status-show { to { opacity: 1; } }
@keyframes ws-status-hide { to { opacity: 0; } }
/* after the sequence: a travelling pulse on the rail (the line stays lit). The pulse element spans the track; its 40 px band is a
   background sweep driven by transform only (translateY -100% -> 100%), so no layout property animates and it rests out of view. */
.elementor .ws-route-track .ws-route-track-pulse { position: absolute; inset: 0; min-width: 0; height: auto; background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.9), rgba(255,255,255,0)) 0 0 / 100% 40px no-repeat; transform: translateY(-100%); }
.ws-js .ws-hero-shell.ws-hero-in .ws-route-track-pulse { animation: ws-rail-pulse 4.2s linear 3600ms infinite; }
@keyframes ws-rail-pulse { 0% { transform: translateY(-100%); } 100% { transform: translateY(100%); } }
/* no-JS / late-JS final state: only ANSWERED is visible until the controller sequences the chip */
.elementor .ws-route-status p { opacity: 0; }
.elementor .ws-route-status p.ws-route-status-item--done { opacity: 1; }
.elementor .ws-route-glyph { width: 18px; height: 18px; min-width: 0; background-color: currentColor; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-position: center; mask-position: center; }
.elementor .ws-route-glyph--users { -webkit-mask-image: var(--ws-asset-icon-users); mask-image: var(--ws-asset-icon-users); }
.elementor .ws-route-glyph--check { -webkit-mask-image: var(--ws-asset-icon-check); mask-image: var(--ws-asset-icon-check); }
.elementor .ws-route-glyph--mail  { -webkit-mask-image: var(--ws-asset-icon-file-text); mask-image: var(--ws-asset-icon-file-text); }
.elementor .ws-route-kicker, .elementor .ws-route-status, .elementor .ws-route-dot { font-family: var(--ws-mono); }

/* --------------------------------------------------------- Resource: check record */
/* Sequence: the record enters with the aside (0.3 s), rows land one at a time (0.8 / 1.2 / 1.6 / 2.0 / 2.4 s) and each badge resolves 300 ms after its row. */
.ws-js .ws-hero-shell .ws-record-row { opacity: 0; transform: translateY(6px); }
.ws-js .ws-hero-shell .ws-record-badge { opacity: 0; transform: scale(.75); }
.ws-js .ws-hero-shell .ws-record-caption { opacity: 0; }
.ws-js .ws-hero-shell.ws-hero-in .ws-record-row { opacity: 1; transform: none; transition: opacity 360ms var(--ws-ease-out) calc(800ms + var(--ws-i, 0) * 400ms), transform 360ms var(--ws-ease-out) calc(800ms + var(--ws-i, 0) * 400ms); }
.ws-js .ws-hero-shell.ws-hero-in .ws-record-badge { opacity: 1; transform: none; transition: opacity 260ms var(--ws-ease-out) calc(1100ms + var(--ws-i, 0) * 400ms), transform 360ms var(--ws-ease-out) calc(1100ms + var(--ws-i, 0) * 400ms); }
.ws-js .ws-hero-shell.ws-hero-in .ws-record-caption { opacity: 1; transition: opacity 500ms var(--ws-ease-out) 2800ms; }
.elementor .ws-record-when, .elementor .ws-record-bar, .elementor .ws-record-cols, .elementor .ws-record-badge, .elementor .ws-record-sub { font-family: var(--ws-mono); }

/* --------------------------------------------------------- Legal: document index */
.ws-js .ws-hero-shell .ws-docindex-row { opacity: 0; transform: translateY(4px); }
.ws-js .ws-hero-shell.ws-hero-in .ws-docindex-row { opacity: 1; transform: none; transition: opacity 300ms var(--ws-ease-out) calc(800ms + var(--ws-i, 0) * 70ms), transform 300ms var(--ws-ease-out) calc(800ms + var(--ws-i, 0) * 70ms); }
.elementor .ws-docindex-kicker, .elementor .ws-docindex-num, .elementor .ws-hero-meta, .elementor .ws-numbered-kicker, .elementor .ws-numbered-num, .elementor .ws-routes-kicker { font-family: var(--ws-mono); }
.elementor .ws-prose-h2[id] { scroll-margin-top: 92px; } /* the anchored article / policy headings (index + chip links) clear the sticky header */

/* --------------------------------------------------------- Resource: process chain (mid-page, Figma 50:2 Figure 1 motion) */
/* On first view: nodes light in order and the coverage bars grow; afterwards the approved Figma hop travels 01->05 on a 6 s loop
   (each node lifts 5 px and scales 1.09 for 0.45 s, one second apart), paused offscreen and removed under reduced motion. */
.ws-js .ws-chain .ws-chain-node { opacity: .35; transform: scale(.85); }
.ws-js .ws-chain .ws-chain-arrow { transform: scaleX(0); transform-origin: left center; }
.ws-js .ws-chain .ws-chain-fill { transform: scaleX(0); transform-origin: left center; }
.ws-js .ws-chain.ws-in .ws-chain-node { opacity: 1; transform: none; transition: opacity 320ms var(--ws-ease-out) var(--ws-delay, 0ms), transform 320ms var(--ws-ease-out) var(--ws-delay, 0ms); }
.ws-js .ws-chain.ws-in .ws-chain-arrow { transform: none; transition: transform 380ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 160ms); }
.ws-js .ws-chain.ws-in .ws-chain-fill { transform: none; transition: transform 700ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 240ms); }
.ws-js .ws-chain .ws-chain-stage { --ws-delay: calc(var(--ws-i, 0) * 380ms + 120ms); }
.ws-js .ws-chain.ws-in .ws-chain-node { animation: ws-chain-hop 6s linear calc(2600ms + var(--ws-i, 0) * 1000ms) infinite; }
@keyframes ws-chain-hop { 0% { translate: 0 0; scale: 1; } 7.5% { translate: 0 -5px; scale: 1.09; animation-timing-function: ease-in-out; } 16.667%, 100% { translate: 0 0; scale: 1; } }
.elementor .ws-chain-node { font-family: var(--ws-mono); }

/* --------------------------------------------------------- Pricing: lifecycle timeline (mid-page) */
.ws-js .ws-timeline .ws-timeline-fill { transform: scaleX(0); transform-origin: left center; }
.ws-js .ws-timeline .ws-timeline-stage { opacity: 0; transform: translateY(8px); }
.ws-js .ws-timeline .ws-timeline-dot { transform: scale(.6); }
.ws-js .ws-timeline.ws-in .ws-timeline-fill { transform: none; transition: transform 1800ms linear 200ms; }
.ws-js .ws-timeline.ws-in .ws-timeline-stage { opacity: 1; transform: none; transition: opacity 420ms var(--ws-ease-out) var(--ws-delay, 0ms), transform 420ms var(--ws-ease-out) var(--ws-delay, 0ms); }
.ws-js .ws-timeline.ws-in .ws-timeline-dot { transform: none; transition: transform 320ms var(--ws-ease-out) var(--ws-delay, 0ms); }
.ws-js .ws-timeline .ws-timeline-stage { --ws-delay: calc(150ms + var(--ws-i, 0) * 550ms); }
@media (max-width: 767px) { .ws-js .ws-timeline .ws-timeline-fill { transform: scaleY(0); transform-origin: top center; } }
.elementor .ws-timeline-day { font-family: var(--ws-mono); }

/* --------------------------------------------------------- Pricing: coverage summary + Contact: routing map (mid-page) */
.ws-js .ws-coverage .ws-coverage-fill { transform: scaleX(0); transform-origin: left center; }
.ws-js .ws-coverage.ws-in .ws-coverage-fill { transform: none; transition: transform 900ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 200ms); }
.ws-js .ws-routes .ws-routes-link-fill { transform: scaleX(0); transform-origin: left center; }
.ws-js .ws-routes .ws-routes-to { opacity: 0; transform: translateX(8px); }
.ws-js .ws-routes.ws-in .ws-routes-link-fill { transform: none; transition: transform 520ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 200ms); }
.ws-js .ws-routes.ws-in .ws-routes-to { opacity: 1; transform: none; transition: opacity 360ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 600ms), transform 360ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 600ms); }
.ws-js .ws-routes .ws-routes-row { --ws-delay: calc(var(--ws-i, 0) * 260ms); }

/* --------------------------------------------------------- reduced motion + editor safety for the WP1D modules */
@media (prefers-reduced-motion: reduce) {
  .ws-js .ws-hero-shell .ws-hero-seq, .ws-js .ws-hero-shell .ws-boundary-row, .ws-js .ws-hero-shell .ws-boundary-mark, .ws-js .ws-hero-shell .ws-boundary-line,
  .ws-js .ws-hero-shell .ws-boundary-label, .ws-js .ws-hero-shell .ws-boundary-foot, .ws-js .ws-hero-shell .ws-boundary-badge,
  .ws-js .ws-hero-shell .ws-route-card, .ws-js .ws-hero-shell .ws-route-dot, .ws-js .ws-hero-shell .ws-route-track-fill,
  .ws-js .ws-hero-shell .ws-record-row, .ws-js .ws-hero-shell .ws-record-badge, .ws-js .ws-hero-shell .ws-record-caption, .ws-js .ws-hero-shell .ws-docindex-row,
  .ws-js .ws-chain .ws-chain-node, .ws-js .ws-chain .ws-chain-arrow, .ws-js .ws-chain .ws-chain-fill,
  .ws-js .ws-timeline .ws-timeline-fill, .ws-js .ws-timeline .ws-timeline-stage, .ws-js .ws-timeline .ws-timeline-dot,
  .ws-js .ws-coverage .ws-coverage-fill, .ws-js .ws-routes .ws-routes-link-fill, .ws-js .ws-routes .ws-routes-to { opacity: 1 !important; transform: none !important; transition: none !important; animation: none !important; }
  .ws-js .ws-hero-shell .ws-route-status p { opacity: 0 !important; animation: none !important; }
  .ws-js .ws-hero-shell .ws-route-status p.ws-route-status-item--done { opacity: 1 !important; }
  .ws-js .ws-hero-shell .ws-route-dot--1, .ws-js .ws-hero-shell .ws-route-dot--2, .ws-js .ws-hero-shell .ws-route-dot--3 { border-color: #4C9CC8; color: #286788; }
  .ws-js .ws-hero-shell .ws-route-dot--4 { border-color: #83B422; background-color: #A1CB45; color: #1C2B0A; }
  .elementor .ws-route-track-pulse { display: none; }
}
.ws-reduced .ws-hero-shell .ws-route-dot, .ws-reduced .ws-hero-shell .ws-boundary-row, .ws-reduced .ws-hero-shell .ws-boundary-mark, .ws-reduced .ws-hero-shell .ws-boundary-line, .ws-reduced .ws-hero-shell .ws-boundary-label,
.ws-reduced .ws-hero-shell .ws-boundary-foot, .ws-reduced .ws-hero-shell .ws-boundary-badge, .ws-reduced .ws-hero-shell .ws-route-card, .ws-reduced .ws-hero-shell .ws-route-track-fill,
.ws-reduced .ws-hero-shell .ws-record-row, .ws-reduced .ws-hero-shell .ws-record-badge, .ws-reduced .ws-hero-shell .ws-record-caption, .ws-reduced .ws-hero-shell .ws-docindex-row,
.ws-reduced .ws-chain-node, .ws-reduced .ws-chain-arrow, .ws-reduced .ws-chain-fill, .ws-reduced .ws-timeline-fill, .ws-reduced .ws-timeline-stage, .ws-reduced .ws-timeline-dot,
.ws-reduced .ws-coverage-fill, .ws-reduced .ws-routes-link-fill, .ws-reduced .ws-routes-to { opacity: 1 !important; transform: none !important; transition: none !important; animation: none !important; }
.ws-reduced .ws-hero-shell .ws-route-status p { opacity: 0 !important; animation: none !important; }
.ws-reduced .ws-hero-shell .ws-route-status p.ws-route-status-item--done { opacity: 1 !important; }
.ws-reduced .ws-hero-shell .ws-route-dot--1, .ws-reduced .ws-hero-shell .ws-route-dot--2, .ws-reduced .ws-hero-shell .ws-route-dot--3 { border-color: #4C9CC8; color: #286788; }
.ws-reduced .ws-hero-shell .ws-route-dot--4 { border-color: #83B422; background-color: #A1CB45; color: #1C2B0A; }
.ws-reduced .ws-route-track-pulse { display: none; }
.elementor-editor-active .ws-boundary-row, .elementor-editor-active .ws-boundary-mark, .elementor-editor-active .ws-boundary-line, .elementor-editor-active .ws-boundary-label, .elementor-editor-active .ws-boundary-foot,
.elementor-editor-active .ws-route-card, .elementor-editor-active .ws-record-row, .elementor-editor-active .ws-record-badge, .elementor-editor-active .ws-docindex-row, .elementor-editor-active .ws-hero-aside { opacity: 1 !important; transform: none !important; }

/* ======================================================== IMMERSIVE HEROES (v1.1.3) */
/* Owner direction 2026-09-27: every page hero matches Features — it fills the first screen below the
   site header and uses the dark field treatment. The height applies to every standard hero shell;
   the dark treatment is the kit's ws-hero--plans styling, restated here for the hero variants that
   were light (resource, compact/legal) so no page needs its own edit. */
.elementor .ws-hero.ws-hero-std {
  min-height: calc(100vh - 65px);
  min-height: calc(100svh - 65px);
  justify-content: center;
}
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) {
  color: var(--ws-text-inverse);
  background-color: var(--ws-color-neutral-1000);
  background-image: radial-gradient(ellipse 60% 55% at 50% -12%, rgba(76,156,200,.22), transparent 62%), radial-gradient(ellipse 34% 40% at 100% 104%, rgba(131,180,34,.12), transparent 58%), radial-gradient(ellipse 34% 40% at 0% 104%, rgba(76,156,200,.10), transparent 58%);
  border-block-end-width: 0; border-bottom: 0;
}
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-hero-title { color: var(--ws-text-inverse); text-wrap: balance; }
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-hero-lede { color: var(--ws-color-brand-slate-200); }
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-hero-eyebrow { color: var(--ws-color-accent-data-blue-300); }
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-hero-aside .ws-comp { background-color: rgba(255, 255, 255, .94); }
/* light-surface buttons become their dark-surface equivalents (ws-btn--light / ws-btn--inverse) */
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-btn--primary.ws-btn { color: var(--ws-color-brand-slate-950); background-color: var(--ws-color-neutral-0); border-color: var(--ws-color-neutral-0); }
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-btn--primary.ws-btn:hover,
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-btn--primary.ws-btn:focus-visible { color: var(--ws-color-brand-slate-950); background-color: var(--ws-color-neutral-100); border-color: var(--ws-color-neutral-100); }
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-btn--primary.ws-btn:active { background-color: var(--ws-color-neutral-200); }
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-btn--secondary.ws-btn { color: var(--ws-text-inverse); border-color: var(--ws-color-neutral-500); background-color: transparent; }
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-btn--secondary.ws-btn:hover,
.elementor .ws-hero.ws-hero-std:not(.ws-hero--plans) .ws-btn--secondary.ws-btn:focus-visible { color: var(--ws-text-inverse); background-color: rgba(255, 255, 255, .08); }
/* the Home convergence-field hero follows the same rule */
.elementor .ws-hero.ws-hero--field {
  min-height: calc(100vh - 65px);
  min-height: calc(100svh - 65px);
  justify-content: center;
}

/* ============================================================ MOTION ON EVERY PAGE (v1.2.0) */
/* Owner direction 2026-09-27: every page has motion. ws-visual.js v1.2.0 autoplays .ws-hero-std heroes,
   indexes diagram parts (--ws-ci), reveals sections on scroll and adds the convergence field to heroes
   that have no side panel. transform/opacity only, except the small signal dots (left/top on a 6px dot). */

/* the WordPress toolbar (logged-in editors) sits above the header: the first screen is shorter */
.admin-bar .elementor .ws-hero.ws-hero-std,
.admin-bar .elementor .ws-hero.ws-hero--field { min-height: calc(100vh - 97px); min-height: calc(100svh - 97px); }
@media (max-width: 782px) {
  .admin-bar .elementor .ws-hero.ws-hero-std,
  .admin-bar .elementor .ws-hero.ws-hero--field { min-height: calc(100vh - 111px); min-height: calc(100svh - 111px); }
}
/* a hero whose content would pass the fold gives up some padding first (ws-visual.js adds the class) */
.elementor .ws-hero.ws-hero-std.ws-hero-tight { padding-block: 40px 36px; }

/* ---- hero entrance: the hero-shell cadence, applied to the standard hero */
.ws-js .ws-hero-std .ws-hero-seq { opacity: 0; transform: translateY(14px); }
.ws-js .ws-hero-std .ws-hero-eyebrow.ws-hero-seq { transform: translateY(10px); }
.ws-js .ws-hero-std .ws-hero-title.ws-hero-seq { transform: translateY(18px); }
.ws-js .ws-hero-std .ws-btn-row.ws-hero-seq { transform: translateY(12px); }
.ws-js .ws-hero-std .ws-hero-aside { opacity: 0; transform: translateY(16px) scale(.985); }
.ws-js .ws-hero-std.ws-hero-in .ws-hero-seq,
.ws-js .ws-hero-std.ws-hero-in .ws-hero-aside { opacity: 1; transform: none; transition: opacity 600ms var(--ws-ease-out), transform 600ms var(--ws-ease-out); }
.ws-js .ws-hero-std.ws-hero-in .ws-hero-eyebrow.ws-hero-seq { transition-delay: 100ms; }
.ws-js .ws-hero-std.ws-hero-in .ws-hero-title.ws-hero-seq { transition-delay: 220ms; }
.ws-js .ws-hero-std.ws-hero-in .ws-hero-lede.ws-hero-seq { transition-delay: 420ms; }
.ws-js .ws-hero-std.ws-hero-in .ws-btn-row.ws-hero-seq { transition-delay: 600ms; }
.ws-js .ws-hero-std.ws-hero-in .ws-hero-proof.ws-hero-seq { transition-delay: 780ms; }
.ws-js .ws-hero-std.ws-hero-in .ws-hero-aside { transition-delay: 300ms; transition-duration: 700ms; }

/* ---- diagrams: parts build in order, connectors draw, then a signal keeps moving along them */
.ws-js .ws-comp .ws-comp-node, .ws-js .ws-comp .ws-comp-layer, .ws-js .ws-comp .ws-comp-zone,
.ws-js .ws-comp .ws-comp-gate, .ws-js .ws-comp .ws-comp-col-label, .ws-js .ws-comp .ws-comp-marker { opacity: 0; transform: translateY(8px); }
.ws-js .ws-comp.ws-in .ws-comp-node, .ws-js .ws-comp.ws-in .ws-comp-layer, .ws-js .ws-comp.ws-in .ws-comp-zone,
.ws-js .ws-comp.ws-in .ws-comp-gate, .ws-js .ws-comp.ws-in .ws-comp-col-label, .ws-js .ws-comp.ws-in .ws-comp-marker {
  opacity: 1; transform: none;
  transition: opacity 480ms var(--ws-ease-out) calc(var(--ws-comp-base, 200ms) + var(--ws-ci, 0) * 90ms),
              transform 480ms var(--ws-ease-out) calc(var(--ws-comp-base, 200ms) + var(--ws-ci, 0) * 90ms);
}
.ws-hero-std .ws-comp { --ws-comp-base: 650ms; }
.ws-js .ws-comp .ws-comp-link--h, .ws-js .ws-comp .ws-comp-gate-line { transform: scaleX(0); transform-origin: left center; }
.ws-js .ws-comp .ws-comp-gate--out .ws-comp-gate-line { transform-origin: right center; }
.ws-js .ws-comp .ws-comp-link--v { transform: scaleY(0); transform-origin: top center; }
.ws-js .ws-comp.ws-in .ws-comp-link--h, .ws-js .ws-comp.ws-in .ws-comp-gate-line, .ws-js .ws-comp.ws-in .ws-comp-link--v {
  transform: none; transition: transform 520ms var(--ws-ease-out) calc(var(--ws-comp-base, 200ms) + 120ms + var(--ws-ci, 0) * 90ms);
}

.ws-comp .ws-comp-link--h::after, .ws-comp .ws-comp-gate-line::after, .ws-comp .ws-comp-link--v::after {
  content: ""; position: absolute; width: 6px; height: 6px; border-radius: 9999px; pointer-events: none; opacity: 0;
  background: #6FB6DD; box-shadow: 0 0 8px 1px rgba(76, 156, 200, .65);
}
.ws-comp .ws-comp-link--h::after, .ws-comp .ws-comp-gate-line::after { top: 50%; left: 0; margin: -3px 0 0 -3px; }
.ws-comp .ws-comp-link--dashed.ws-comp-link--h::after { top: -1px; }
.ws-comp .ws-comp-link--v::after { left: 50%; top: 0; margin: -3px 0 0 -3px; }
.ws-comp .ws-comp-link--dashed.ws-comp-link--v::after { left: -1px; }
.ws-js .ws-comp.ws-in .ws-comp-link--h::after, .ws-js .ws-comp.ws-in .ws-comp-gate-line::after {
  animation: ws-signal-x 2.8s cubic-bezier(.45, 0, .55, 1) calc(var(--ws-comp-base, 200ms) + 1300ms + var(--ws-ci, 0) * 240ms) infinite;
}
.ws-js .ws-comp.ws-in .ws-comp-gate--out .ws-comp-gate-line::after { animation-name: ws-signal-x-back; }
.ws-js .ws-comp.ws-in .ws-comp-link--v::after {
  animation: ws-signal-y 2.4s cubic-bezier(.45, 0, .55, 1) calc(var(--ws-comp-base, 200ms) + 1300ms + var(--ws-ci, 0) * 240ms) infinite;
}
@keyframes ws-signal-x      { 0% { left: 0; opacity: 0; } 12% { opacity: 1; } 86% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
@keyframes ws-signal-x-back { 0% { left: 100%; opacity: 0; } 12% { opacity: 1; } 86% { opacity: 1; } 100% { left: 0; opacity: 0; } }
@keyframes ws-signal-y      { 0% { top: 0; opacity: 0; } 12% { opacity: 1; } 86% { opacity: 1; } 100% { top: 100%; opacity: 0; } }
@media (max-width: 599px) {
  /* stacked diagrams turn horizontal connectors vertical */
  .ws-comp .ws-comp-flow > .ws-comp-link--h::after { left: -1px; top: 0; }
  .ws-js .ws-comp.ws-in .ws-comp-flow > .ws-comp-link--h::after { animation-name: ws-signal-y; }
  .ws-js .ws-comp .ws-comp-flow > .ws-comp-link--h { transform: scaleY(0); transform-origin: top center; }
  .ws-js .ws-comp.ws-in .ws-comp-flow > .ws-comp-link--h { transform: none; }
}
/* the verified / done step breathes */
.ws-js .ws-comp.ws-in .ws-comp-node--ok, .ws-js .ws-comp.ws-in .ws-comp-layer--ok {
  animation: ws-ok-glow 3.4s ease-in-out calc(var(--ws-comp-base, 200ms) + 2200ms) infinite;
}
@keyframes ws-ok-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(161, 203, 69, 0); } 50% { box-shadow: 0 0 0 5px rgba(161, 203, 69, .16), 0 0 22px rgba(161, 203, 69, .22); } }

/* ---- a hero with no side panel gets the convergence field (injected by ws-visual.js, desktop only) */
.elementor .ws-hero-fielded > .ws-flow { z-index: 0; container-type: inline-size; --ws-flow-x: calc(50% + min(560px, 50cqw - 260px)); }
.elementor .ws-hero-fielded > :not(.ws-flow) { position: relative; z-index: 1; }
.elementor .ws-hero-fielded .ws-flow::after { right: calc(50% - 480px); background-image: linear-gradient(90deg, rgba(14,21,31,.95) 0%, rgba(14,21,31,.9) 58%, rgba(14,21,31,.45) 82%, rgba(14,21,31,0) 100%); }
.ws-js .ws-hero-fielded .ws-flow { opacity: 0; }
.ws-js .ws-hero-fielded.ws-hero-in .ws-flow { opacity: .8; transition: opacity 1400ms ease-out 200ms; }
.ws-js .ws-hero-fielded .ws-flow-layer, .ws-js .ws-hero-fielded .ws-flow-layer::before { animation-play-state: paused; }
.ws-js .ws-hero-fielded.ws-hero-in .ws-flow-layer, .ws-js .ws-hero-fielded.ws-hero-in .ws-flow-layer::before { animation-play-state: running; }

/* ---- reduced motion: final state, nothing moves */
@media (prefers-reduced-motion: reduce) {
  .ws-js .ws-hero-std .ws-hero-seq, .ws-js .ws-hero-std .ws-hero-aside,
  .ws-js .ws-comp .ws-comp-node, .ws-js .ws-comp .ws-comp-layer, .ws-js .ws-comp .ws-comp-zone, .ws-js .ws-comp .ws-comp-gate,
  .ws-js .ws-comp .ws-comp-col-label, .ws-js .ws-comp .ws-comp-marker, .ws-js .ws-comp .ws-comp-link--h, .ws-js .ws-comp .ws-comp-link--v,
  .ws-js .ws-comp .ws-comp-gate-line { opacity: 1 !important; transform: none !important; transition: none !important; }
  .ws-comp .ws-comp-link--h::after, .ws-comp .ws-comp-link--v::after, .ws-comp .ws-comp-gate-line::after { display: none; }
  .ws-js .ws-comp .ws-comp-node--ok, .ws-js .ws-comp .ws-comp-layer--ok { animation: none !important; }
  .ws-js .ws-hero-fielded .ws-flow { opacity: .8 !important; }
}
.ws-reduced .ws-comp .ws-comp-link--h::after, .ws-reduced .ws-comp .ws-comp-link--v::after, .ws-reduced .ws-comp .ws-comp-gate-line::after { display: none; }

/* timeline diagrams: Elementor's .e-con { width: 100% } stretched the track and the dashed return line
   past their stops; the kit positions them with left/right, so their width must come from those */
.elementor .ws-comp-timeline-track.e-con, .elementor .ws-comp-timeline-return.e-con { width: auto; }

/* ============================================== DIAGRAM TYPE SIZES (v1.2.1) */
/* The kit rule "html .elementor .ws-comp .e-paragraph-base { font-size: inherit; line-height: inherit }" outranks the
   kit's own label sizes, so every diagram label rendered at 16px body size, overflowed its box and was clipped
   (owner: "hero image does not look good, a lot of clipping"). These restate the kit's intended sizes, generated
   from the kit CSS, one class more specific. */
html .elementor .ws-comp .ws-comp-kicker.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-title.e-paragraph-base { font-size: var(--ws-type-body-small-size); line-height: 1.35; }
html .elementor .ws-comp .ws-comp-foot.e-paragraph-base { font-size: 12px; line-height: 1.35; }
html .elementor .ws-comp .ws-comp-node .ws-comp-small.e-paragraph-base { font-size: 11.5px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-link-label.e-paragraph-base { font-size: 9px; line-height: 1.2; }
html .elementor .ws-comp .ws-comp-note.e-paragraph-base { font-size: 12px; line-height: 1.35; }
html .elementor .ws-comp .ws-comp-col > .ws-comp-node .ws-comp-small.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-col-label.e-paragraph-base { font-size: 10px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-flow--dense .ws-comp-col > .ws-comp-node .ws-comp-small.e-paragraph-base { font-size: 10.5px; }
html .elementor .ws-comp .ws-comp-marker-label.e-paragraph-base { font-size: 9px; }
html .elementor .ws-comp .ws-comp-hub-center .ws-comp-node .ws-comp-small.e-paragraph-base { font-size: 10.5px; }
html .elementor .ws-comp .ws-comp-spoke .ws-comp-node .ws-comp-small.e-paragraph-base { font-size: 10.5px; }
html .elementor .ws-comp .ws-comp-axis-label.e-paragraph-base { font-size: 9px; line-height: 1.25; }
html .elementor .ws-comp .ws-comp-layer-label.e-paragraph-base { font-size: 13px; line-height: 1.2; }
html .elementor .ws-comp .ws-comp-layer-note.e-paragraph-base { font-size: 11px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-loop-core .ws-comp-small.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-stage-num.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-stage-name.e-paragraph-base { font-size: 12px; line-height: 1.2; }
html .elementor .ws-comp .ws-comp-stage-level.e-paragraph-base { font-size: 10px; line-height: 1.2; }
html .elementor .ws-comp .ws-comp-lane-label.e-paragraph-base { font-size: 12px; line-height: 1.25; }
html .elementor .ws-comp .ws-comp-cell-stage.e-paragraph-base { font-size: 9px; }
html .elementor .ws-comp .ws-comp-cell .ws-comp-small.e-paragraph-base { font-size: 10.5px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-legend.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-window-title.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-window-tab.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-panel-title.e-paragraph-base { font-size: 9.5px; }
html .elementor .ws-comp .ws-comp-verdict.e-paragraph-base { font-size: 13px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-metric-value.e-paragraph-base { font-size: 22px; line-height: 1; }
html .elementor .ws-comp .ws-comp-metric-delta.e-paragraph-base { font-size: 10.5px; }
html .elementor .ws-comp .ws-comp-panel-small.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-panel-row.e-paragraph-base { font-size: 12px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-milestone-when.e-paragraph-base { font-size: 9px; }
html .elementor .ws-comp .ws-comp-milestone-card .ws-comp-small.e-paragraph-base { font-size: 10.5px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-timeline-return-label.e-paragraph-base { font-size: 9px; }
html .elementor .ws-comp .ws-comp-zone-label.e-paragraph-base { font-size: 9.5px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-gate-label.e-paragraph-base { font-size: 9px; line-height: 1.25; }
html .elementor .ws-comp .ws-comp-tree-leaf.e-paragraph-base { font-size: 11px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-tree--dense .ws-comp-tree-leaf.e-paragraph-base { font-size: 10.5px; }
html .elementor .ws-comp .ws-comp-disc.e-paragraph-base { font-size: 12px; }
html .elementor .ws-comp .ws-comp-disc .ws-comp-small.e-paragraph-base { font-size: 10.5px; line-height: 1.3; }
html .elementor .ws-comp .ws-comp-disc-both.e-paragraph-base { font-size: 11px; }
html .elementor .ws-comp .ws-comp-disc-both .ws-comp-small.e-paragraph-base { font-size: 10px; line-height: 1.25; }
html .elementor .ws-comp .ws-comp-overlap-cap.e-paragraph-base { font-size: 10.5px; line-height: 1.25; }
@media (max-width: 599px) { html .elementor .ws-comp .ws-comp-milestone-when.e-paragraph-base { font-size: 8.5px; } }
html .elementor .ws-comp .ws-comp-node-text > .e-paragraph-base { line-height: 1.25; }
/* connector labels sit on top of the neighbouring boxes instead of being painted under them */
html .elementor .ws-comp .ws-comp-link-label.e-paragraph-base { z-index: 3; }

/* ============================================== BALANCED CARD GRIDS (v1.2.2) */
/* ws-grid--2 / --3 are auto-fit grids: at desktop width 4 cards land 3 + 1, 5 land 4 + 1, 9 land 4 + 4 + 1
   (owner: "3 cards on the first row and only one card on the second ... looks lopsided").
   Pick a column count that fills every row for the counts that orphan a card. */
@media (min-width: 1024px) {
  .elementor .ws-grid.ws-grid--2:has(> :nth-child(4):last-child),
  .elementor .ws-grid.ws-grid--3:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .elementor .ws-grid.ws-grid--2:has(> :nth-child(7):last-child),
  .elementor .ws-grid.ws-grid--3:has(> :nth-child(7):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .elementor .ws-grid.ws-grid--2:has(> :nth-child(5):last-child),
  .elementor .ws-grid.ws-grid--3:has(> :nth-child(5):last-child),
  .elementor .ws-grid.ws-grid--2:has(> :nth-child(6):last-child),
  .elementor .ws-grid.ws-grid--3:has(> :nth-child(6):last-child),
  .elementor .ws-grid.ws-grid--2:has(> :nth-child(9):last-child),
  .elementor .ws-grid.ws-grid--3:has(> :nth-child(9):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .elementor .ws-grid.ws-grid--2:has(> :nth-child(8):last-child),
  .elementor .ws-grid.ws-grid--3:has(> :nth-child(8):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* loop diagrams: .e-con { width: 100% } plus the kit's 68px side margins pushed the ring 136px past the panel's right edge */
.elementor .ws-comp-loop.e-con { width: auto; }

/* ============================================== SECTION MOTION (v1.3.0) */
/* Owner: "The hero looks great. Now the rest of the page needs motion." Below the hero every section now has
   visible entrances (ws-visual.js marks them .ws-reveal--auto), a slow ambient glow, drawn accents on cards and
   section headings, and hover lift on cards. Hover uses the translate property so it never waits on the
   entrance transition's delay. */

/* stronger, staggered entrances */
/* v1.3.2: the resting poses apply only until the element has entered (they used to outrank the entered state,
   leaving cards 34px low and overlapping the button rows under their grids) */
.ws-js .ws-reveal--auto:not(.ws-in) { transform: translateY(28px); }
.ws-js .ws-card.ws-reveal--auto:not(.ws-in), .ws-js .ws-faq-item.ws-reveal--auto:not(.ws-in) { transform: translateY(34px) scale(.97); }
.ws-js li.ws-reveal--auto:not(.ws-in) { transform: translateX(-20px); }
.ws-js .ws-reveal--auto.ws-in { transition-duration: 720ms; }

/* ambient glows drifting behind every section */
.elementor .ws-section { position: relative; isolation: isolate; overflow: hidden; }
.elementor .ws-section::before,
.elementor .ws-section::after { content: ""; position: absolute; z-index: -1; border-radius: 9999px; pointer-events: none; }
.elementor .ws-section::before { width: 720px; height: 720px; left: -260px; top: -300px; background: radial-gradient(closest-side, rgba(76, 156, 200, .11), rgba(76, 156, 200, 0)); animation: ws-orb-a 24s ease-in-out infinite alternate; }
.elementor .ws-section::after { width: 640px; height: 640px; right: -240px; bottom: -320px; background: radial-gradient(closest-side, rgba(161, 203, 69, .10), rgba(161, 203, 69, 0)); animation: ws-orb-b 30s ease-in-out infinite alternate; }
.elementor .ws-section:nth-of-type(even)::before { left: auto; right: -260px; animation-duration: 28s; }
.elementor .ws-section:nth-of-type(even)::after { right: auto; left: -240px; animation-duration: 34s; }
@keyframes ws-orb-a { to { transform: translate(220px, 160px) scale(1.18); } }
@keyframes ws-orb-b { to { transform: translate(-200px, -140px) scale(1.12); } }

/* every card on the site (cards, plan cards, dark tiles, side cards, KPI tiles): a blue-to-green accent bar draws
   across the top as the card lands (owner: "Any page that has a card now must have a gradient bar like that") */
.elementor :is(.ws-card, .ws-tile, .ws-side-card, .ws-kpi) { position: relative; overflow: hidden; }
.elementor .ws-card { transition: translate 240ms var(--ws-ease-out), box-shadow 240ms var(--ws-ease-out), border-color 160ms var(--ws-ease-out); }
.elementor :is(.ws-card, .ws-tile, .ws-side-card, .ws-kpi)::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #4C9CC8, #A1CB45); transform-origin: left center; }
.ws-js :is(.ws-card, .ws-tile, .ws-side-card, .ws-kpi)::before { transform: scaleX(0); }
.ws-js :is(.ws-card, .ws-tile, .ws-side-card, .ws-kpi).ws-in::before, .ws-js .ws-in :is(.ws-card, .ws-tile, .ws-side-card, .ws-kpi)::before { transform: scaleX(1); transition: transform 900ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 380ms); }
/* card icons pop in after their card */
.ws-js .ws-card-icon { opacity: 0; transform: scale(.6) rotate(-8deg); }
.ws-js .ws-card.ws-in .ws-card-icon, .ws-js .ws-in .ws-card .ws-card-icon { opacity: 1; transform: none; transition: opacity 420ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 300ms), transform 520ms cubic-bezier(.34, 1.56, .64, 1) calc(var(--ws-delay, 0ms) + 300ms); }
@media (hover: hover) and (pointer: fine) {
  .elementor .ws-card:hover .ws-card-icon { transform: scale(1.08); transition-delay: 0ms; }
  .elementor .ws-section .ws-card:hover { translate: 0 -5px; box-shadow: 0 18px 40px -18px rgba(23, 33, 48, .28); border-color: rgba(76, 156, 200, .45); }
  .elementor .ws-section .ws-card .ws-card-link { display: inline-block; transition: translate 200ms var(--ws-ease-out); }
  .elementor .ws-section .ws-card:hover .ws-card-link { translate: 4px 0; }
}

/* section headings: a short accent bar draws in under the heading */
.elementor .ws-section .ws-section-heading::after,
.elementor .ws-section .ws-prose-h2::after { content: ""; display: block; width: 56px; height: 3px; border-radius: 3px; margin-top: 14px; background: linear-gradient(90deg, #4C9CC8, #A1CB45); transform-origin: left center; }
.ws-js .ws-section .ws-section-heading::after, .ws-js .ws-section .ws-prose-h2::after { transform: scaleX(0); }
.ws-js .ws-section .ws-section-heading.ws-in::after, .ws-js .ws-section .ws-in .ws-section-heading::after,
.ws-js .ws-section .ws-prose-h2.ws-in::after, .ws-js .ws-section .ws-in .ws-prose-h2::after { transform: scaleX(1); transition: transform 800ms var(--ws-ease-out) calc(var(--ws-delay, 0ms) + 260ms); }

@media (prefers-reduced-motion: reduce) {
  .elementor .ws-section::before, .elementor .ws-section::after { animation: none !important; }
  .ws-js :is(.ws-card, .ws-tile, .ws-side-card, .ws-kpi)::before, .ws-js .ws-section .ws-section-heading::after, .ws-js .ws-section .ws-prose-h2::after, .ws-js .ws-card-icon { opacity: 1 !important; transform: none !important; transition: none !important; }
  .elementor .ws-section .ws-card:hover, .elementor .ws-section .ws-card:hover .ws-card-link { translate: none; }
}
.ws-reduced :is(.ws-card, .ws-tile, .ws-side-card, .ws-kpi)::before, .ws-reduced .ws-card-icon, .ws-reduced .ws-section .ws-section-heading::after, .ws-reduced .ws-section .ws-prose-h2::after { transform: none !important; }

/* button rows that follow a card grid get more room (owner: buttons crowding the cards above them) */
.elementor .ws-grid + .ws-btn-row { margin-block-start: 40px; }

/* ============================================== LOOP DIAGRAM MOTION (v1.3.3) */
/* The kit gives .ws-comp-loop-runner "animation: ws-loop-run" but the keyframes never shipped, so the runner sat still
   at the top-left corner (owner, How it works: "Hero needs motion too"). The runner now laps the track clockwise;
   each stage lights up as it passes (ws-visual.js sets --ws-hit from the stage's position on the track), and the
   stages fade in in order. The stages are placed with transform, so only opacity and scale animate here. */
@keyframes ws-loop-run {
  0%   { left: 10%;  top: 0; }
  34%  { left: 90%;  top: 0; }
  40%  { left: 100%; top: 14%; }
  58%  { left: 100%; top: 86%; }
  64%  { left: 90%;  top: 100%; }
  84%  { left: 10%;  top: 100%; }
  90%  { left: 0;    top: 86%; }
  96%  { left: 0;    top: 14%; }
  100% { left: 10%;  top: 0; }
}
.ws-js .ws-comp .ws-comp-loop-stage, .ws-js .ws-comp .ws-comp-loop-core, .ws-js .ws-comp .ws-comp-loop-track { opacity: 0; }
.ws-js .ws-comp.ws-in .ws-comp-loop-track { opacity: 1; transition: opacity 700ms var(--ws-ease-out) var(--ws-comp-base, 200ms); }
.ws-js .ws-comp.ws-in .ws-comp-loop-stage { opacity: 1; transition: opacity 480ms var(--ws-ease-out) calc(var(--ws-comp-base, 200ms) + 200ms + var(--ws-ci, 0) * 140ms);
  animation: ws-stage-hit 9s linear var(--ws-hit, 99s) infinite; }
.ws-js .ws-comp.ws-in .ws-comp-loop-core { opacity: 1; transition: opacity 600ms var(--ws-ease-out) calc(var(--ws-comp-base, 200ms) + 1100ms); }
@keyframes ws-stage-hit {
  0%, 12%, 100% { scale: 1; }
  4% { scale: 1.06; box-shadow: 0 0 0 6px rgba(161, 203, 69, .28), 0 0 26px rgba(161, 203, 69, .38); border-color: #A1CB45; }
}
@media (prefers-reduced-motion: reduce) {
  .ws-js .ws-comp .ws-comp-loop-stage, .ws-js .ws-comp .ws-comp-loop-core, .ws-js .ws-comp .ws-comp-loop-track { opacity: 1 !important; transition: none !important; animation: none !important; }
}
.ws-reduced .ws-comp .ws-comp-loop-stage, .ws-reduced .ws-comp .ws-comp-loop-core, .ws-reduced .ws-comp .ws-comp-loop-track { opacity: 1 !important; animation: none !important; }

/* ============================================== DIAGRAM SWEEP (v1.3.4) */
/* Owner (Insights): "Hero needs motion too." Signals on the connectors were too quiet on their own, so the boxes of
   every diagram now light up one after another along the flow, repeating every 7s. The verified/done boxes keep
   their own breathing glow. scale is used (not transform) because several diagram parts are placed with transform. */
.ws-js .ws-comp.ws-in .ws-comp-node:not(.ws-comp-node--ok),
.ws-js .ws-comp.ws-in .ws-comp-layer:not(.ws-comp-layer--ok),
.ws-js .ws-comp.ws-in .ws-comp-zone {
  animation: ws-comp-sweep 7s ease-in-out calc(var(--ws-comp-base, 200ms) + 2400ms + var(--ws-ci, 0) * 320ms) infinite;
}
@keyframes ws-comp-sweep {
  0%, 11%, 100% { scale: 1; }
  4% { scale: 1.035; border-color: #4C9CC8; box-shadow: 0 0 0 4px rgba(76, 156, 200, .18), 0 6px 22px -6px rgba(76, 156, 200, .45); }
}
.ws-comp .ws-comp-link--h::after, .ws-comp .ws-comp-gate-line::after, .ws-comp .ws-comp-link--v::after { width: 8px; height: 8px; margin: -4px 0 0 -4px; background: #7CC3EA; box-shadow: 0 0 10px 2px rgba(76, 156, 200, .75); }
@media (prefers-reduced-motion: reduce) {
  .ws-js .ws-comp .ws-comp-node, .ws-js .ws-comp .ws-comp-layer, .ws-js .ws-comp .ws-comp-zone { animation: none !important; }
}
.ws-reduced .ws-comp .ws-comp-node, .ws-reduced .ws-comp .ws-comp-layer, .ws-reduced .ws-comp .ws-comp-zone { animation: none !important; }

/* five cards: 3 on top, 2 centred underneath, instead of 3 + 2 with an empty slot (v1.3.5) */
@media (min-width: 1024px) {
  .elementor .ws-grid.ws-grid.ws-grid:has(> :nth-child(5):last-child) { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .elementor .ws-grid.ws-grid.ws-grid:has(> :nth-child(5):last-child) > * { grid-column: span 2; }
  .elementor .ws-grid.ws-grid.ws-grid:has(> :nth-child(5):last-child) > :nth-child(4) { grid-column: 2 / span 2; }
}
