.pfa-anim{--pfa-speed:1}
.pfa-anim .pfa-stage{position:relative;max-width:1120px;margin:0 auto;overflow:hidden}
/* desktop shows the viewBox slice x 256..1669, y 120..800 (1413x680): the artwork's
   bbox is x 272..1653, y 137..784, so the raw 1920x1080 canvas carries ~270 units of
   dead margin per side - cropped here the same way as the mobile slice below */
.pfa-anim .pfa-stage::before{content:"";display:block;padding-top:48.1246%}
.pfa-anim .pfa-svg{display:block;position:absolute;top:-17.6471%;left:-18.1175%;width:135.8811%;height:auto}
.pfa-anim .pfa-bgrect,.pfa-anim .pfa-mask11{fill:var(--pfa-bg,#2A2C2C)}
.pfa-anim .pfa-mchips{opacity:0;pointer-events:none}
.pfa-anim .pfa-hit-mp{display:none}

/* ------------- portrait (mobile) -------------
   Same artwork, cropped to the viewBox slice x 534..1384, y 33..1113 (850x1080),
   which is the composition signed off in the portrait export. Only the connected-systems
   block is re-laid-out: the 9 items become horizontal chips on two centred rows (v2, Aug 2026),
   the first row taller so its tops still tuck under the oval. Chip widths come from the rendered
   text (see the layout script in module.html), so edited labels and translations stay padded.
   The crop is expressed as animatable percentages (::before aspect box + absolute svg), so
   crossing the 768px breakpoint morphs instead of snapping; the two node sets cross-fade
   via group opacity, which leaves their child reveal animations untouched (no restart on resize). */
@media (max-width:767px){
 /* full-bleed: cancel the layout wrapper's gutters so the artwork reaches both screen edges.
    Covers every "layout" choice (container / -small / -large / -fluid) plus the row+col
    wrappers that only exist when Container Width is not "max". */
 .pfa-anim>.container,.pfa-anim>.container-fluid{padding-left:0;padding-right:0;max-width:none}
 .pfa-anim>div>.row{margin-left:0;margin-right:0}
 .pfa-anim>div>.row>[class*="col-"]{padding-left:0;padding-right:0}
 .pfa-anim .pfa-stage::before{padding-top:127.0588%}
 .pfa-anim .pfa-svg{top:-3.0556%;left:-62.8235%;width:225.8824%}
 .pfa-anim .pfa-pillars{opacity:0;pointer-events:none}
 .pfa-anim .pfa-mchips{opacity:1;pointer-events:auto}
 .pfa-anim .pfa-hit-dp{display:none}
 .pfa-anim .pfa-hit-mp{display:block}
}

/* "Show mobile version at all widths" option: the portrait crop from the max-width:767px
   block above, held at every viewport width, sitting in a device bezel. Deliberately NOT
   full-bleed like real mobile - the frame only reads with the container gutters left in place,
   and the stage keeps its own 1120px cap.
   The bezel is the border itself, so the inner (screen) radius is border-radius minus
   border-width, and the existing overflow:hidden clips the artwork to it. Both are sized in
   cqw (a % of the stage's own width) so the frame keeps the same proportions at every width -
   a fixed 24px reads as 2% of a 1120px stage but 4.6% of a 520px one, which is why it looked
   twice as heavy in a narrow window. px values stay first as the no-container-query fallback.
   The section fill is dropped here so the frame reads as a device on the page rather than a
   dark band; --pfa-bg is a separate declaration, so the artwork inside stays dark.
   The crop is also tighter than the phone one. The portrait slice y 33..1113 leaves 271 units
   of empty canvas below the chips (content runs y 137..842); at phone width that reads as
   padding, but blown up inside a bezel it is a half-empty screen. Bottom margin is matched to
   the 104-unit top margin instead: y 33..946, so height 913 -> 913/850 = 107.4118% aspect and
   the svg offset becomes -33/913 = -3.6145%. Horizontal crop is untouched. */
.pfa-anim.pfa-force-mobile .sr-cover{container-type:inline-size}
/* frame matches the /products/delivery demo component's :host (padding:12px;
   border-radius:24px; background:rgba(255,255,255,.07); border:1px solid
   rgba(255,255,255,.16); box-shadow:0 30px 80px rgba(0,0,0,.45)). Here the 12px
   glass ring is the BORDER (the svg is %-positioned against the padding box, so
   real padding would let the artwork bleed under the ring) and the 1px hairline
   is a spread shadow just outside it. Colors assume a dark section background,
   so unlike the old solid bezel this mode KEEPS the module's own background
   (the instance's design_settings, normally #2b2b2b): the artwork canvas then
   matches the band behind it and the glass card floats on dark instead of the
   inner canvas reading as a black box on a light page.
   The reference's `0 30px 80px rgba(0,0,0,.45)` drop shadow is DELIBERATELY
   omitted: that component sits inside a large dark card, where the shadow is
   invisible, but here the module's dark band is only as tall as the artwork,
   so the shadow paints a near-black halo that reads as a black box (user
   confirmed by toggling this exact declaration off in DevTools, 2026-08-13).
   Keep the hairline in its OWN box-shadow so it survives that removal.
   This mode also needs the instance's own background OPAQUE: --pfa-bg is the
   colour every card/band gradient fades into (stops at offset .8 and 1), so an
   instance whose design_settings background sits at 0% opacity gets TRANSPARENT
   gradient tails - the product cards let the page through and read washed-out
   next to a normal instance, and the card has no solid screen behind the art. */
.pfa-anim.pfa-force-mobile .pfa-stage{box-sizing:border-box;border:12px solid rgba(255,255,255,.07);border-radius:24px;box-shadow:0 0 0 1px rgba(255,255,255,.16)}
/* Give the "screen" its own tone. Measured at 4x: page #2b2b2b, glass ring #393939,
   canvas #2b2b2b - i.e. inside and outside were IDENTICAL, so the frame read as a
   floating outline and its two concentric corner curves looked like a mistake. The
   reference component gets this separation for free (its screen is a light UI). Our
   artwork is dark, so the screen goes DARKER than the page instead: the ring then
   reads as a lit edge between two surfaces. --pfa-bg drives both the canvas rect and
   every gradient tail, so shifting it alone keeps the artwork internally consistent. */
@supports (color:color-mix(in srgb,#000 50%,#fff)){
 .pfa-anim.pfa-force-mobile{--pfa-bg:color-mix(in srgb,var(--pfa-bg-base,#2A2C2C) 85%,#000)}
}
.pfa-anim.pfa-force-mobile .pfa-stage::before{padding-top:107.4118%}
.pfa-anim.pfa-force-mobile .pfa-svg{top:-3.6145%;left:-62.8235%;width:225.8824%}
.pfa-anim.pfa-force-mobile .pfa-pillars{opacity:0;pointer-events:none}
.pfa-anim.pfa-force-mobile .pfa-mchips{opacity:1;pointer-events:auto}
.pfa-anim.pfa-force-mobile .pfa-hit-dp{display:none}
.pfa-anim.pfa-force-mobile .pfa-hit-mp{display:block}

/* ------------- interaction ------------- */
.pfa-anim .pfa-hit{pointer-events:all}
.pfa-anim .pfa-hit-ring{pointer-events:stroke}
.pfa-anim a.pfa-link{cursor:pointer}
.pfa-anim a.pfa-link:focus{outline:none}
.pfa-anim a.pfa-link:focus-visible .pfa-hit{stroke:#00B4C3;stroke-width:3;fill:rgba(0,180,195,.08)}
.pfa-anim a.pfa-link:focus-visible path.pfa-hit{fill:none;stroke:rgba(0,180,195,.55)}

.pfa-anim .pfa-card{transition:filter .25s ease}
.pfa-anim .pfa-pillar,.pfa-anim .pfa-mchip{transition:filter .25s ease}
.pfa-anim .pfa-ring{transition:filter .25s ease}
.pfa-anim .pfa-title{transition:filter .25s ease}
.pfa-anim .pfa-plabel,.pfa-anim .pfa-mclabel,.pfa-anim .pfa-rlabel,.pfa-anim .pfa-tlabel{transition:fill .2s ease,filter .25s ease}

.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-title:hover) .pfa-title,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-title:hover) .pfa-title{filter:brightness(1.45)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-title:hover) .pfa-tlabel,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-title:hover) .pfa-tlabel{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-c0:hover) .pfa-card.c0,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-c0:hover) .pfa-card.c0{filter:brightness(1.22) saturate(1.08)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-c1:hover) .pfa-card.c1,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-c1:hover) .pfa-card.c1{filter:brightness(1.22) saturate(1.08)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-c2:hover) .pfa-card.c2,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-c2:hover) .pfa-card.c2{filter:brightness(1.22) saturate(1.08)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-c3:hover) .pfa-card.c3,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-c3:hover) .pfa-card.c3{filter:brightness(1.22) saturate(1.08)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-c4:hover) .pfa-card.c4,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-c4:hover) .pfa-card.c4{filter:brightness(1.22) saturate(1.08)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p0:hover) .pfa-pillar.p0,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p0:hover) .pfa-pillar.p0{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p0:hover) .pfa-plabel.p0,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p0:hover) .pfa-plabel.p0{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p1:hover) .pfa-pillar.p1,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p1:hover) .pfa-pillar.p1{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p1:hover) .pfa-plabel.p1,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p1:hover) .pfa-plabel.p1{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p2:hover) .pfa-pillar.p2,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p2:hover) .pfa-pillar.p2{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p2:hover) .pfa-plabel.p2,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p2:hover) .pfa-plabel.p2{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p3:hover) .pfa-pillar.p3,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p3:hover) .pfa-pillar.p3{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p3:hover) .pfa-plabel.p3,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p3:hover) .pfa-plabel.p3{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p4:hover) .pfa-pillar.p4,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p4:hover) .pfa-pillar.p4{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p4:hover) .pfa-plabel.p4,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p4:hover) .pfa-plabel.p4{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p5:hover) .pfa-pillar.p5,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p5:hover) .pfa-pillar.p5{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p5:hover) .pfa-plabel.p5,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p5:hover) .pfa-plabel.p5{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p6:hover) .pfa-pillar.p6,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p6:hover) .pfa-pillar.p6{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p6:hover) .pfa-plabel.p6,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p6:hover) .pfa-plabel.p6{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p7:hover) .pfa-pillar.p7,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p7:hover) .pfa-pillar.p7{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p7:hover) .pfa-plabel.p7,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p7:hover) .pfa-plabel.p7{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p8:hover) .pfa-pillar.p8,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p8:hover) .pfa-pillar.p8{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-p8:hover) .pfa-plabel.p8,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-p8:hover) .pfa-plabel.p8{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-r-agentic:hover) .pfa-ring.ring-agentic,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-r-agentic:hover) .pfa-ring.ring-agentic{filter:brightness(1.22) saturate(1.08)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-r-data:hover) .pfa-ring.ring-data,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-r-data:hover) .pfa-ring.ring-data{filter:brightness(1.22) saturate(1.08)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-r-carrier:hover) .pfa-ring.ring-carrier,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-r-carrier:hover) .pfa-ring.ring-carrier{filter:brightness(1.22) saturate(1.08)}

.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp0:hover) .pfa-mchip.mc0,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp0:hover) .pfa-mchip.mc0{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp0:hover) .pfa-mclabel.mc0,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp0:hover) .pfa-mclabel.mc0{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp1:hover) .pfa-mchip.mc1,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp1:hover) .pfa-mchip.mc1{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp1:hover) .pfa-mclabel.mc1,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp1:hover) .pfa-mclabel.mc1{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp2:hover) .pfa-mchip.mc2,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp2:hover) .pfa-mchip.mc2{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp2:hover) .pfa-mclabel.mc2,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp2:hover) .pfa-mclabel.mc2{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp3:hover) .pfa-mchip.mc3,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp3:hover) .pfa-mchip.mc3{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp3:hover) .pfa-mclabel.mc3,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp3:hover) .pfa-mclabel.mc3{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp4:hover) .pfa-mchip.mc4,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp4:hover) .pfa-mchip.mc4{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp4:hover) .pfa-mclabel.mc4,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp4:hover) .pfa-mclabel.mc4{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp5:hover) .pfa-mchip.mc5,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp5:hover) .pfa-mchip.mc5{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp5:hover) .pfa-mclabel.mc5,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp5:hover) .pfa-mclabel.mc5{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp6:hover) .pfa-mchip.mc6,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp6:hover) .pfa-mchip.mc6{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp6:hover) .pfa-mclabel.mc6,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp6:hover) .pfa-mclabel.mc6{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp7:hover) .pfa-mchip.mc7,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp7:hover) .pfa-mchip.mc7{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp7:hover) .pfa-mclabel.mc7,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp7:hover) .pfa-mclabel.mc7{fill:#FFFFFF}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp8:hover) .pfa-mchip.mc8,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp8:hover) .pfa-mchip.mc8{filter:brightness(1.35)}
.pfa-anim:not(.pfa-linked-only) .pfa-svg:has(.pfa-hit.h-mp8:hover) .pfa-mclabel.mc8,.pfa-anim.pfa-linked-only .pfa-svg:has(a.pfa-link .pfa-hit.h-mp8:hover) .pfa-mclabel.mc8{fill:#FFFFFF}
@media (prefers-reduced-motion:no-preference){
 .pfa-anim .pfa-stage::before{transition:padding-top .45s ease}
 .pfa-anim .pfa-svg{transition:top .45s ease,left .45s ease,width .45s ease}
 .pfa-anim .pfa-pillars,.pfa-anim .pfa-mchips{transition:opacity .45s ease}
 .pfa-anim.pfa-play .pfa-logo{animation:pfa-fade calc(.5s / var(--pfa-speed)) ease-out both}
 .pfa-anim.pfa-play .pfa-title{animation:pfa-barn calc(.5s / var(--pfa-speed)) cubic-bezier(.25,.6,.35,1) calc(.5s / var(--pfa-speed)) both}
 .pfa-anim.pfa-play .pfa-card{animation:pfa-rise calc(.5s / var(--pfa-speed)) cubic-bezier(.2,.7,.3,1) both}
 .pfa-anim.pfa-play .pfa-card.c0{animation-delay:calc(0.5s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-card.c1{animation-delay:calc(0.7s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-card.c2{animation-delay:calc(0.9s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-card.c3{animation-delay:calc(1.1s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-card.c4{animation-delay:calc(1.3s / var(--pfa-speed))}
 .pfa-anim.pfa-play .sweep-agentic{animation:pfa-sweep calc(2s / var(--pfa-speed)) linear calc(1.8s / var(--pfa-speed)) both}
 .pfa-anim:not(.pfa-play) .sweep-agentic{stroke-dashoffset:0}
 .pfa-anim.pfa-play .sweep-data{animation:pfa-sweep calc(2s / var(--pfa-speed)) linear calc(3.8s / var(--pfa-speed)) both}
 .pfa-anim:not(.pfa-play) .sweep-data{stroke-dashoffset:0}
 .pfa-anim.pfa-play .sweep-carrier{animation:pfa-sweep calc(2s / var(--pfa-speed)) linear calc(5.8s / var(--pfa-speed)) both}
 .pfa-anim:not(.pfa-play) .sweep-carrier{stroke-dashoffset:0}
 .pfa-anim.pfa-play .pfa-oval{stroke-dasharray:1 1;animation:pfa-sweep calc(2s / var(--pfa-speed)) linear calc(7.8s / var(--pfa-speed)) both}
 .pfa-anim.pfa-play .pfa-pillar{animation:pfa-wipeup calc(.5s / var(--pfa-speed)) linear both}
 .pfa-anim.pfa-play .pfa-pillar.p0{animation-delay:calc(9.8s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p1{animation-delay:calc(10.0s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p2{animation-delay:calc(10.2s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p3{animation-delay:calc(10.4s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p4{animation-delay:calc(10.6s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p5{animation-delay:calc(10.8s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p6{animation-delay:calc(11.0s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p7{animation-delay:calc(11.2s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-pillar.p8{animation-delay:calc(11.4s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip{animation:pfa-wipedown calc(.5s / var(--pfa-speed)) linear both}
 .pfa-anim.pfa-play .pfa-mchip.mc0{animation-delay:calc(9.8s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc1{animation-delay:calc(10.0s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc2{animation-delay:calc(10.2s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc3{animation-delay:calc(10.4s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc4{animation-delay:calc(10.6s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc5{animation-delay:calc(10.8s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc6{animation-delay:calc(11.0s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc7{animation-delay:calc(11.2s / var(--pfa-speed))}
 .pfa-anim.pfa-play .pfa-mchip.mc8{animation-delay:calc(11.4s / var(--pfa-speed))}
 /* ---- "Appear in sequence" style (animation_style = pop) ----
    Nothing draws in this style. Cards reveal exactly like the homepage Lottie
    (nShift_Final_WEB_anim.json): each card background grows down from under the
    title bar (scaleY 0->1, .5s, bezier .33/0/.21/1), the icon pops in with a
    .07s fade at +.13s, the label fades .2s while sliding up 21 units from +.13s,
    cards staggered .067s apart. The three ring bands then fade in TOGETHER,
    followed by the thin outside outline, and the connected systems drop into
    place from underneath the rings (they sit earlier in paint order, so while
    translated up they emerge from behind the bands). Same keyframes serve
    desktop pillars and mobile chips. */
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card{animation:none}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-cardbg{transform-box:fill-box;transform-origin:50% 0;animation:pfa-growdown calc(.5s / var(--pfa-speed)) cubic-bezier(.33,0,.21,1) both}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c0 .pfa-cardbg{animation-delay:calc(.5s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c1 .pfa-cardbg{animation-delay:calc(.567s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c2 .pfa-cardbg{animation-delay:calc(.633s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c3 .pfa-cardbg{animation-delay:calc(.7s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c4 .pfa-cardbg{animation-delay:calc(.767s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card svg{animation:pfa-fade calc(.07s / var(--pfa-speed)) linear both}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c0 svg{animation-delay:calc(.633s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c1 svg{animation-delay:calc(.7s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c2 svg{animation-delay:calc(.767s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c3 svg{animation-delay:calc(.833s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c4 svg{animation-delay:calc(.9s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card text{animation:pfa-cardtext-slide calc(.3s / var(--pfa-speed)) cubic-bezier(.33,0,.09,1) both,pfa-fade calc(.2s / var(--pfa-speed)) linear both}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c0 text{animation-delay:calc(.633s / var(--pfa-speed)),calc(.733s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c1 text{animation-delay:calc(.7s / var(--pfa-speed)),calc(.8s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c2 text{animation-delay:calc(.767s / var(--pfa-speed)),calc(.867s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c3 text{animation-delay:calc(.833s / var(--pfa-speed)),calc(.933s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-card.c4 text{animation-delay:calc(.9s / var(--pfa-speed)),calc(1.0s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .sweep-agentic,.pfa-anim.pfa-style-pop.pfa-play .sweep-data,.pfa-anim.pfa-style-pop.pfa-play .sweep-carrier{animation:none;stroke-dashoffset:0}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-ring{animation:pfa-fade calc(.3s / var(--pfa-speed)) ease-out calc(1.5s / var(--pfa-speed)) both}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-oval{animation:pfa-fade calc(.3s / var(--pfa-speed)) ease-out calc(1.85s / var(--pfa-speed)) both}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip{animation:pfa-fall calc(.6s / var(--pfa-speed)) both}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p0,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc0{animation-delay:calc(2.3s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p1,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc1{animation-delay:calc(2.4s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p2,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc2{animation-delay:calc(2.5s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p3,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc3{animation-delay:calc(2.6s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p4,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc4{animation-delay:calc(2.7s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p5,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc5{animation-delay:calc(2.8s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p6,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc6{animation-delay:calc(2.9s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p7,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc7{animation-delay:calc(3.0s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-play .pfa-pillar.p8,.pfa-anim.pfa-style-pop.pfa-play .pfa-mchip.mc8{animation-delay:calc(3.1s / var(--pfa-speed))}
 /* v3 (animation_style = pop2, class pfa-style-pop2 ON TOP of pfa-style-pop):
    identical to v2 except the connected systems all drop at the same time.
    The doubled class in the selector out-ties the per-pillar v2 delay rules
    (same 0,5,0 specificity, later in the file wins). */
 .pfa-anim.pfa-style-pop.pfa-style-pop2.pfa-play .pfa-pillar,.pfa-anim.pfa-style-pop.pfa-style-pop2.pfa-play .pfa-mchip{animation-delay:calc(2.3s / var(--pfa-speed))}
 /* v4 (animation_style = pop3, class pfa-style-pop3 ON TOP of pfa-style-pop):
    the connected systems reveal like the product cards instead of falling -
    each rect grows down from its top edge with the same Lottie bezier, its
    label fades in while sliding up, systems staggered .067s like the cards.
    The group-level fall is disabled; children animate instead. */
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip{animation:none}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-ring{animation-duration:calc(1s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-oval{animation-duration:calc(1s / var(--pfa-speed));animation-delay:calc(1.5s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip rect{transform-box:fill-box;transform-origin:50% 0;animation:pfa-growdown calc(.5s / var(--pfa-speed)) cubic-bezier(.33,0,.21,1) both}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip text{animation:pfa-cardtext-slide calc(.3s / var(--pfa-speed)) cubic-bezier(.33,0,.09,1) both,pfa-fade calc(.2s / var(--pfa-speed)) linear both}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p0 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc0 rect{animation-delay:calc(2.0s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p0 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc0 text{animation-delay:calc(2.133s / var(--pfa-speed)),calc(2.233s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p1 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc1 rect{animation-delay:calc(2.067s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p1 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc1 text{animation-delay:calc(2.2s / var(--pfa-speed)),calc(2.3s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p2 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc2 rect{animation-delay:calc(2.133s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p2 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc2 text{animation-delay:calc(2.267s / var(--pfa-speed)),calc(2.367s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p3 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc3 rect{animation-delay:calc(2.2s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p3 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc3 text{animation-delay:calc(2.333s / var(--pfa-speed)),calc(2.433s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p4 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc4 rect{animation-delay:calc(2.267s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p4 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc4 text{animation-delay:calc(2.4s / var(--pfa-speed)),calc(2.5s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p5 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc5 rect{animation-delay:calc(2.333s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p5 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc5 text{animation-delay:calc(2.467s / var(--pfa-speed)),calc(2.567s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p6 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc6 rect{animation-delay:calc(2.4s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p6 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc6 text{animation-delay:calc(2.533s / var(--pfa-speed)),calc(2.633s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p7 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc7 rect{animation-delay:calc(2.467s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p7 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc7 text{animation-delay:calc(2.6s / var(--pfa-speed)),calc(2.7s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p8 rect,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc8 rect{animation-delay:calc(2.533s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-pillar.p8 text,.pfa-anim.pfa-style-pop.pfa-style-pop3.pfa-play .pfa-mchip.mc8 text{animation-delay:calc(2.667s / var(--pfa-speed)),calc(2.767s / var(--pfa-speed))}
 /* v5 (animation_style = pop4, class pfa-style-pop4 ON TOP of pfa-style-pop):
    the connected systems use the original v1 wipe reveal, but top-down
    (pfa-wipedown) on desktop pillars too, staggered like v2's drop. */
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip{animation:pfa-wipedown calc(.5s / var(--pfa-speed)) linear both}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p0,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc0{animation-delay:calc(2.3s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p1,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc1{animation-delay:calc(2.4s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p2,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc2{animation-delay:calc(2.5s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p3,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc3{animation-delay:calc(2.6s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p4,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc4{animation-delay:calc(2.7s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p5,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc5{animation-delay:calc(2.8s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p6,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc6{animation-delay:calc(2.9s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p7,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc7{animation-delay:calc(3.0s / var(--pfa-speed))}
 .pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-pillar.p8,.pfa-anim.pfa-style-pop.pfa-style-pop4.pfa-play .pfa-mchip.mc8{animation-delay:calc(3.1s / var(--pfa-speed))}
 @keyframes pfa-fade{from{opacity:0}to{opacity:1}}
 @keyframes pfa-fall{0%{opacity:0;transform:translateY(-170px);animation-timing-function:cubic-bezier(.45,.05,.85,.6)}16%{opacity:1}72%{transform:translateY(0);animation-timing-function:ease-out}86%{transform:translateY(-9px);animation-timing-function:ease-in}100%{opacity:1;transform:translateY(0)}}
 @keyframes pfa-growdown{from{transform:scaleY(0)}to{transform:scaleY(1)}}
 @keyframes pfa-cardtext-slide{from{transform:translateY(21px)}to{transform:none}}
 @keyframes pfa-barn{0%{opacity:0;clip-path:inset(0 50% 0 50%)}2%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0)}}
 @keyframes pfa-rise{0%{opacity:0;transform:translateY(232px)}4%{opacity:1}100%{opacity:1;transform:none}}
 @keyframes pfa-sweep{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
 @keyframes pfa-wipeup{0%{opacity:0;clip-path:inset(100% 0 0 0)}4%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0)}}
 @keyframes pfa-wipedown{0%{opacity:0;clip-path:inset(0 0 100% 0)}4%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0)}}
}