/* Hero background and controls. */
.hero-shell{position:relative;min-height:0;overflow:visible;background:radial-gradient(ellipse at 52% 68%,#43a9e2 0,transparent 68%),linear-gradient(150deg,#0876b8,#288fcf)}
.hero-shell::before,.hero-shell::after{display:none}
.hero-shell .hero{flex:none;padding-bottom:20px}
.hero-artwork{position:relative;isolation:isolate;container-type:inline-size;align-self:center;width:min(1274px,calc(100vw - 20px));aspect-ratio:637/186}
.hero-artwork::before{content:"";position:absolute;z-index:-1;left:50%;top:0;transform:translateX(-50%);width:calc(100vw - 20px);height:calc(100% + 20px);background:url('/images/hero-cloud-banks.svg?v=2') center/100% 100% no-repeat;pointer-events:none}
.hero-artwork .hero-actions{position:absolute;top:5%;left:50%;transform:translateX(-50%);margin:0;white-space:nowrap;animation:none}
.hero-artwork .hero-arrow{animation:none!important}
.hero-artwork .hero-stage{position:absolute;inset:0;width:100%;height:100%;margin:0;perspective:none;isolation:auto;animation:none;transform-style:preserve-3d}
.hero-artwork .hero-stage::before{display:none}
.hero-artwork .hero-stage::after{inset:auto 0 0;height:20%;transform:none;filter:blur(5px);opacity:.22;background:radial-gradient(ellipse at 20% 100%,#e4f7ff 0,transparent 45%),radial-gradient(ellipse at 85% 90%,#e4f7ff 0,transparent 42%)}
.hero-artwork .stage-card{left:var(--x);top:calc(var(--cy) + var(--ribbon-drop,10%));width:var(--w);height:var(--h);transform-origin:center;transform:translate(-50%,-50%) perspective(1000px) rotateY(var(--ry)) rotateZ(var(--rz)) scale(calc(100cqw / 1274px * var(--size))) translateZ(var(--z));filter:drop-shadow(0 10px 14px #00477620)}
.hero-artwork .stage-card-inner{animation:none!important}
.hero-artwork .stage-results{--x:18%;--cy:52%;--w:98px;--h:128px;--size:.80;--ry:-37deg;--rz:-3deg;--z:-28px;opacity:.65}
.hero-artwork .stage-services{--x:26%;--cy:51%;--w:137px;--h:171px;--size:.76;--ry:-18deg;--rz:-2deg;--z:-16px;opacity:.83}
.hero-artwork .stage-impact{--x:36.5%;--cy:49.2%;--w:150px;--h:181px;--size:.95;--ry:-7deg;--rz:-1deg;--z:-5px;opacity:.95}
.hero-artwork .stage-core{--x:50%;--cy:49.2%;--w:174px;--h:204px;--size:.94;--ry:0deg;--rz:0deg;--z:0px;opacity:1}
.hero-artwork .stage-core .stage-card-inner{background:linear-gradient(145deg,#a9ddf76b,#55b8e477 48%,#8bd5ef52);border-color:#c9edff35;box-shadow:inset 0 1px 14px #d7f3ff30,0 8px 22px #176ca31c;backdrop-filter:blur(8px)}
.hero-artwork .stage-card-inner{box-shadow:0 6px 16px #154c7814,inset 0 1px 0 #ffffff70;border-color:#ffffff90}
.hero-artwork .stage-systems .stage-card-inner{box-shadow:0 7px 18px #154c7824,inset 0 1px 0 #ffffff25;border-color:#e5f1f1b0;background:linear-gradient(145deg,#1c211f,#101614)}
.hero-artwork .core-mark{background:#d6f4ff35;border-color:#e2f8ff50;box-shadow:0 4px 14px #0876b820,inset 0 1px 5px #ffffff45}
.hero-artwork .core-shine{opacity:.4}
.hero-artwork .stage-core strong{font-weight:500}
.hero-artwork .hero-stage::after{inset:48% -2% 0;height:auto;opacity:.3;filter:blur(7px);background:radial-gradient(ellipse at 12% 58%,#eaf6ff 0,transparent 24%),radial-gradient(ellipse at 88% 65%,#eaf6ff 0,transparent 25%)}
.hero-artwork .stage-systems{--x:63.5%;--cy:49.2%;--w:154px;--h:185px;--size:.92946;--ry:7deg;--rz:1deg;--z:-5px;opacity:.95}
.hero-artwork .stage-site{--x:74%;--cy:51%;--w:135px;--h:169px;--size:.76899;--ry:18deg;--rz:2deg;--z:-16px;opacity:.83}
.hero-artwork .stage-analytics{--x:82%;--cy:52%;--w:101px;--h:132px;--size:.77576;--ry:37deg;--rz:3deg;--z:-28px;opacity:.65}
.hero-artwork .hero-gallery-note{position:absolute;left:0;right:0;top:81%;margin:0;text-align:center;font-size:11px;line-height:1.4;color:#eaf7ff;text-shadow:0 1px 5px #0876b8;white-space:normal}
/* Reference geometry on a 1274 x 372 canvas: compact centre, receding edge planes. */
@media(min-width:768px){
 .hero-artwork{--ribbon-drop:4.5%}
 .hero-artwork .stage-card{transform:translate(-50%,-50%) scale(calc(100cqw / 1274px)) perspective(650px) rotateY(var(--ry)) rotateZ(var(--rz)) translateZ(var(--z)) scale(var(--size))}
 .hero-artwork .stage-results{--x:13.2%;--cy:57%;--size:1.04;--ry:-58deg;--rz:-4deg;--z:-42px;opacity:.58}
 .hero-artwork .stage-services{--x:22.8%;--cy:49%;--size:1.02;--ry:-29deg;--rz:-6deg;--z:-15px;opacity:.94}
 .hero-artwork .stage-impact{--x:36.5%;--cy:44.5%;--h:160px;--size:1.04;--ry:-9deg;--rz:-1deg;--z:0px;opacity:1}
 .hero-artwork .stage-core{--x:50%;--cy:44%;--h:174px;--size:.94;--ry:0deg;--rz:0deg;--z:0px}
 .hero-artwork .stage-systems{--x:64%;--cy:46%;--h:164px;--size:1.02;--ry:24deg;--rz:4deg;--z:-4px;opacity:1}
 .hero-artwork .stage-site{--x:76.5%;--cy:52%;--size:1.02;--ry:43deg;--rz:4deg;--z:-24px;opacity:.92}
 .hero-artwork .stage-analytics{--x:83.3%;--cy:57%;--size:1;--ry:76deg;--rz:2deg;--z:-45px;opacity:.42}
 .hero-artwork .stage-card-inner{border-radius:8px}
 .hero-artwork .stage-core .stage-card-inner{padding:12px}
 .hero-artwork .core-mark{width:38px;height:38px;margin-bottom:10px}
 .hero-artwork .stage-core strong{font-size:17px;margin:7px 0 10px}
 .hero-artwork .stage-core small{margin-top:9px}
}
@media(max-width:767px){
 .hero-artwork{--ribbon-drop:5%;width:calc(100vw - 12px);aspect-ratio:1.25}
 .hero-artwork::before{width:calc(100vw - 12px);background-size:auto 100%}
 .hero-artwork .stage-results,.hero-artwork .stage-impact,.hero-artwork .stage-site,.hero-artwork .stage-analytics{display:none}
 .hero-artwork .hero-actions{top:0}
 .hero-artwork .stage-services{--x:8%;--cy:54%;--size:3.3;--ry:-23deg}
 .hero-artwork .stage-core{--x:50%;--cy:52%;--size:3.5}
 .hero-artwork .stage-systems{--x:92%;--cy:54%;--size:3.05027;--ry:23deg;--rz:2deg;--z:-16px;opacity:.83}
 .hero-artwork .hero-gallery-note{top:88%;font-size:10px}
}

/* The card stage has been removed; keep the controls in normal flow. */
.hero-shell .hero-artwork{aspect-ratio:auto;height:auto;padding-bottom:80px}
.hero-artwork .hero-actions{position:relative;top:auto;left:auto;transform:none;justify-content:center}
.hero-parachute{position:absolute;z-index:4;left:50%;right:auto;bottom:-190px;width:clamp(250px,25vw,340px);height:auto;pointer-events:none;filter:drop-shadow(0 18px 20px #064c7938);transform:translateX(-50%);transform-origin:50% 80%}
@keyframes hero-parachute-arrive{from{opacity:0;transform:translate(-50%,45px) rotate(3deg) scale(.92)}to{opacity:1;transform:translate(-50%,0) rotate(0) scale(1)}}
@media(prefers-reduced-motion:no-preference){.hero-parachute{animation:hero-parachute-arrive .9s 3s cubic-bezier(.16,1,.3,1) both}}
@media(max-width:700px){.hero-parachute{left:50%;right:auto;bottom:-110px;width:clamp(190px,48vw,230px)}}

/* One restrained reveal: focal card first, then mirrored pairs moving outward. */
@keyframes hero-cloud-reveal{
 from{opacity:0}
 to{opacity:1}
}
@keyframes hero-control-reveal{
 from{opacity:0;translate:0 7px}
 to{opacity:1;translate:0 0}
}
@keyframes hero-card-reveal{
 from{opacity:0;transform:translateY(10px) scale(.96);filter:blur(4px) saturate(.88)}
 to{opacity:1;transform:translateY(0) scale(1);filter:blur(0) saturate(1)}
}
@keyframes hero-proof-reveal{
 from{opacity:0;translate:0 5px}
 to{opacity:1;translate:0 0}
}

@media(prefers-reduced-motion:no-preference){
 .hero-artwork::before{animation:hero-cloud-reveal .8s ease-out both}
 .hero-artwork .hero-actions{animation:hero-control-reveal .5s .12s cubic-bezier(.22,.8,.3,1) both}
 .hero-artwork .stage-card-inner{animation:hero-card-reveal .72s cubic-bezier(.16,1,.3,1) both!important}
 .hero-artwork .stage-core .stage-card-inner{animation-delay:.22s!important}
 .hero-artwork .stage-impact .stage-card-inner,
 .hero-artwork .stage-systems .stage-card-inner{animation-delay:.31s!important}
 .hero-artwork .stage-services .stage-card-inner,
 .hero-artwork .stage-site .stage-card-inner{animation-delay:.40s!important}
 .hero-artwork .stage-results .stage-card-inner,
 .hero-artwork .stage-analytics .stage-card-inner{animation-delay:.50s!important;animation-duration:.78s!important}
 .hero-artwork .hero-gallery-note{animation:hero-proof-reveal .5s .82s ease-out both}
}

@media(prefers-reduced-motion:reduce){
 .hero-artwork::before,
 .hero-artwork .hero-actions,
 .hero-artwork .stage-card-inner,
 .hero-artwork .hero-gallery-note{animation:none!important}
}