/* A quiet, dimensional object for the homepage hero. No labels or diagram UI. */
.rcmObject.rcmHeroOrb {
  width: min(100%, 560px);
  height: 430px;
  display: block;
  justify-self: center;
  isolation: isolate;
  overflow: visible;
  filter: drop-shadow(0 18px 24px rgba(24, 104, 149, .07));
}
.rcmHeroOrb span { position: absolute; display: block; pointer-events: none; }
.rcmHeroOrb .orbAmbient {
  z-index: 0;
  width: 94%; height: 94%; left: 3%; top: 0;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(168, 224, 249, .25), rgba(219, 243, 253, .12) 41%, transparent 69%);
  filter: blur(14px);
  animation: orbAmbient 10s ease-in-out infinite;
}
.rcmHeroOrb .orbShadow {
  z-index: 0;
  width: 53%; height: 8%; left: 23.5%; bottom: 22px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(24, 101, 146, .20), rgba(55, 151, 200, .08) 50%, transparent 76%);
  filter: blur(13px);
  animation: orbShadow 8s ease-in-out infinite;
}
.rcmHeroOrb .orbRingBack,
.rcmHeroOrb .orbRingFront,
.rcmHeroOrb .orbRingFine {
  left: 50%; top: 48%; border-radius: 50%;
  transform-origin: center;
}
.rcmHeroOrb .orbRingBack {
  z-index: 1; width: 87%; height: 37%;
  border: 11px solid rgba(84, 169, 216, .25);
  box-shadow: inset 0 2px 5px rgba(255,255,255,.9), 0 7px 18px rgba(21, 96, 139, .08);
  transform: translate(-50%,-50%) rotate(-21deg);
  animation: orbRing 12s ease-in-out infinite;
}
.rcmHeroOrb .orbRingFine {
  z-index: 1; width: 67%; height: 76%;
  border: 1px solid rgba(43, 145, 200, .18);
  transform: translate(-50%,-50%) rotate(34deg);
  animation: orbFine 17s ease-in-out infinite;
}
.rcmHeroOrb .orbGlobe {
  z-index: 2; width: 59%; aspect-ratio: 1; left: 20.5%; top: 12%;
  border-radius: 50%; overflow: hidden;
  background:
    radial-gradient(circle at 26% 19%, rgba(255,255,255,.99) 0 3%, rgba(255,255,255,.75) 7%, transparent 28%),
    radial-gradient(circle at 28% 21%, #f8feff 0%, #c8edfb 21%, #81c9ea 43%, #3294ca 69%, #14557f 100%);
  box-shadow:
    inset 17px 20px 30px rgba(255,255,255,.63),
    inset -25px -32px 46px rgba(11, 73, 118, .30),
    inset -2px -2px 10px rgba(255,255,255,.25),
    21px 27px 45px rgba(29, 108, 154, .20),
    0 0 0 1px rgba(51, 152, 202, .16);
  animation: orbFloat 8s ease-in-out infinite;
}
.rcmHeroOrb .orbGlobe::before {
  content: ''; position: absolute; inset: 10% 10% 15% 14%; border-radius: 50%;
  background: linear-gradient(133deg, rgba(255,255,255,.43), transparent 45%, rgba(255,255,255,.07) 75%);
  transform: rotate(-23deg);
}
.rcmHeroOrb .orbGlobe::after {
  content: ''; position: absolute; width: 84%; height: 84%; left: -32%; top: -37%;
  border-radius: 50%; border: 2px solid rgba(255,255,255,.34);
  box-shadow: 0 0 20px rgba(255,255,255,.26);
}
.rcmHeroOrb .orbRingFront {
  z-index: 3; width: 87%; height: 37%;
  border: 11px solid transparent;
  border-bottom-color: #81c4e6;
  border-left-color: rgba(168, 220, 244, .65);
  box-shadow: 0 9px 12px -12px rgba(25, 104, 148, .15);
  transform: translate(-50%,-50%) rotate(-21deg);
  animation: orbRing 12s ease-in-out infinite;
}
.rcmHeroOrb .orbRingFront::after {
  content: ''; position: absolute; inset: -11px; border-radius: 50%;
  border-bottom: 2px solid rgba(255,255,255,.68);
}
.rcmHeroOrb .orbSpark {
  z-index: 4; width: 11px; height: 11px; border-radius: 50%;
  background: radial-gradient(circle at 30% 25%, #fff, #67bde9 70%, #258bc5);
  box-shadow: 0 0 0 7px rgba(69, 171, 224, .12), 0 8px 12px rgba(20, 101, 146, .12);
  animation: orbSpark 6s ease-in-out infinite;
}
.rcmHeroOrb .orbSparkOne { left: 11%; top: 39%; }
.rcmHeroOrb .orbSparkTwo { right: 10%; top: 21%; width: 7px; height: 7px; animation-delay: -2s; }
.rcmHeroOrb .orbSparkThree { right: 16%; bottom: 24%; width: 8px; height: 8px; animation-delay: -4s; }
@keyframes orbFloat { 50% { transform: translateY(-13px) rotate(2deg); } }
@keyframes orbRing { 50% { transform: translate(-50%,-52%) rotate(-17deg); } }
@keyframes orbFine { 50% { transform: translate(-50%,-50%) rotate(40deg); opacity: .65; } }
@keyframes orbSpark { 50% { transform: translateY(-13px) scale(1.13); } }
@keyframes orbAmbient { 50% { transform: scale(1.06); opacity: .72; } }
@keyframes orbShadow { 50% { transform: scale(.91); opacity: .68; } }
@media (max-width: 800px) {
  .rcmObject.rcmHeroOrb { height: 320px; max-width: 420px; }
  .rcmHeroOrb .orbRingBack, .rcmHeroOrb .orbRingFront { border-width: 8px; }
  .rcmHeroOrb .orbGlobe { width: 57%; left: 21.5%; top: 10%; }
}
@media (max-width: 480px) {
  .rcmObject.rcmHeroOrb { height: 270px; max-width: 360px; margin-top: 5px; }
  .rcmHeroOrb .orbGlobe { top: 9%; }
  .rcmHeroOrb .orbShadow { bottom: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .rcmHeroOrb .orbAmbient, .rcmHeroOrb .orbShadow, .rcmHeroOrb .orbRingBack,
  .rcmHeroOrb .orbRingFine, .rcmHeroOrb .orbGlobe, .rcmHeroOrb .orbRingFront,
  .rcmHeroOrb .orbSpark { animation: none !important; }
}