/* AVERQION — shared native six-node A identity component.
   The visual geometry, node proportions, gradients and motion timings mirror
   the homepage's native brand-orbit. The detail-page frame is only a container;
   the A artwork itself remains HTML/SVG/CSS/Canvas, never a bitmap. */

.solution-orbit-frame {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  width: 100%;
  max-width: 560px;
  aspect-ratio: 1;
  min-width: 0;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(142, 158, 255, .34);
  border-radius: 22px;
  background:
    radial-gradient(ellipse 58% 58% at 48% 48%, rgba(61, 91, 231, .34), transparent 72%),
    radial-gradient(ellipse 70% 70% at 52% 48%, rgba(133, 66, 220, .23), transparent 74%),
    radial-gradient(ellipse 90% 90% at 50% 50%, rgba(25, 71, 190, .24), transparent 78%),
    linear-gradient(145deg, #111044 0%, #111C5B 48%, #21104D 100%);
  box-shadow: 0 22px 54px rgba(31, 19, 81, .24), inset 0 1px 0 rgba(255, 255, 255, .07);
}

.solution-orbit-frame::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .23;
  background-image:
    linear-gradient(rgba(181, 195, 255, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(181, 195, 255, .12) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(circle, #000 12%, transparent 86%);
}

.solution-orbit-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 34%, rgba(5, 7, 39, .18) 100%);
}

/* Match the homepage sculpture's 100% scale rather than the former 82% inset. */
.solution-orbit-frame .brand-orbit {
  width: min(100%, 620px);
  max-width: 620px;
  aspect-ratio: 1;
  position: relative;
  justify-self: center;
  isolation: isolate;
  display: grid;
  place-items: center;
  overflow: visible;
  z-index: 1;
}

.solution-orbit-frame .orbit-ambient {
  position: absolute;
  border-radius: 50%;
  filter: blur(48px);
  pointer-events: none;
  z-index: -2;
}

.solution-orbit-frame .orbit-ambient-a {
  width: 70%;
  height: 70%;
  background: rgba(52, 91, 255, .19);
  animation: aboOrbitGlow 8s ease-in-out infinite alternate;
}

.solution-orbit-frame .orbit-ambient-b {
  width: 48%;
  height: 48%;
  background: rgba(148, 77, 255, .16);
  transform: translate(20%, 18%);
  animation: aboOrbitGlow 10s ease-in-out infinite alternate-reverse;
}

.solution-orbit-frame .orbit-starfield {
  position: absolute;
  inset: 8%;
  border-radius: 50%;
  opacity: .38;
  pointer-events: none;
  background-image: radial-gradient(circle, rgba(178, 198, 255, .78) 1px, transparent 1.7px);
  background-size: 29px 29px;
  mask-image: radial-gradient(circle, #000 8%, rgba(0, 0, 0, .7) 48%, transparent 72%);
  animation: aboStarDrift 22s linear infinite;
}

.solution-orbit-frame .brand-orbit-particles {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: block;
  pointer-events: none;
  overflow: visible;
}

.solution-orbit-frame .orbit-guide {
  position: absolute;
  inset: 4%;
  width: 92%;
  height: 92%;
  z-index: 0;
  overflow: visible;
  filter: drop-shadow(0 0 8px rgba(95, 145, 255, .24));
  animation: aboGuideSpin 58s linear infinite;
}

.solution-orbit-frame .orbit-globe {
  position: absolute;
  z-index: 0;
  width: 58%;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 44%, rgba(68, 105, 230, .14), rgba(28, 30, 105, .04) 62%, transparent 72%);
  box-shadow: inset 0 0 40px rgba(104, 140, 255, .08), 0 0 50px rgba(53, 91, 255, .08);
  animation: aboGlobeFloat 7s ease-in-out infinite;
}

.solution-orbit-frame .orbit-globe svg {
  width: 100%;
  height: 100%;
  overflow: visible;
  animation: aboGlobeTurn 42s linear infinite;
}

.solution-orbit-frame .orbit-globe g {
  animation: aboParticlePulse 3.8s ease-in-out infinite alternate;
}

.solution-orbit-frame .brand-a-core {
  position: absolute;
  z-index: 4;
  width: 29%;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 28%;
  transform: rotate(45deg);
  border: 1.5px solid rgba(210, 224, 255, .75);
  background: linear-gradient(145deg, rgba(101, 144, 255, .16), rgba(32, 28, 105, .18));
  box-shadow: 0 0 18px rgba(95, 147, 255, .45), inset 0 0 24px rgba(168, 187, 255, .10);
}

.solution-orbit-frame .brand-a-emblem {
  width: 78%;
  height: 78%;
  overflow: visible;
  transform: rotate(-45deg);
  filter: drop-shadow(0 0 10px rgba(111, 170, 255, .48));
}

.solution-orbit-frame .brand-a-core i {
  position: absolute;
  inset: -14%;
  border: 1px solid rgba(128, 170, 255, .25);
  border-radius: 34%;
  transform: rotate(0deg);
  animation: aboACorePulse 4.2s ease-in-out infinite;
}

.solution-orbit-frame .orbit-rotation {
  position: absolute;
  z-index: 5;
  inset: 0;
  border-radius: 50%;
  animation: aboOrbitSpin 34s linear infinite;
}

.solution-orbit-frame .orbit-node {
  position: absolute;
  width: clamp(64px, 9.5vw, 88px);
  height: clamp(64px, 9.5vw, 88px);
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 28%, rgba(111, 155, 255, .27), rgba(30, 34, 112, .70) 72%);
  border: 1px solid rgba(172, 197, 255, .72);
  box-shadow:
    0 0 0 5px rgba(90, 130, 255, .045),
    0 0 22px rgba(78, 128, 255, .35),
    inset 0 0 18px rgba(166, 190, 255, .17);
  backdrop-filter: blur(8px);
}

.solution-orbit-frame .orbit-node::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(201, 218, 255, .16);
  border-radius: 50%;
}

.solution-orbit-frame .orbit-node::after {
  content: "";
  position: absolute;
  inset: -8px;
  border: 1px solid rgba(113, 164, 255, .20);
  border-radius: 50%;
  animation: aboNodeHalo 3.6s ease-out infinite;
}

.solution-orbit-frame .node-icon {
  width: 42%;
  height: 42%;
  display: grid;
  place-items: center;
  color: #fff;
  filter: drop-shadow(0 0 6px rgba(145, 184, 255, .7));
  animation: aboOrbitCounterSpin 34s linear infinite;
}

.solution-orbit-frame .node-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.solution-orbit-frame .node-one { left: 50%; top: -1%; transform: translateX(-50%); }
.solution-orbit-frame .node-two { right: 5%; top: 22%; }
.solution-orbit-frame .node-three { right: 5%; bottom: 22%; }
.solution-orbit-frame .node-four { left: 50%; bottom: -1%; transform: translateX(-50%); }
.solution-orbit-frame .node-five { left: 5%; bottom: 22%; }
.solution-orbit-frame .node-six { left: 5%; top: 22%; }

.solution-orbit-frame .orbit-node:nth-child(2)::after { animation-delay: .6s; }
.solution-orbit-frame .orbit-node:nth-child(3)::after { animation-delay: 1.2s; }
.solution-orbit-frame .orbit-node:nth-child(4)::after { animation-delay: 1.8s; }
.solution-orbit-frame .orbit-node:nth-child(5)::after { animation-delay: 2.4s; }
.solution-orbit-frame .orbit-node:nth-child(6)::after { animation-delay: 3s; }

.solution-orbit-frame .brand-orbit.is-paused * {
  animation-play-state: paused !important;
}

@keyframes aboOrbitSpin { to { transform: rotate(360deg); } }
@keyframes aboOrbitCounterSpin { to { transform: rotate(-360deg); } }
@keyframes aboGuideSpin { to { transform: rotate(360deg); } }
@keyframes aboGlobeTurn { to { transform: rotate(360deg); } }
@keyframes aboGlobeFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes aboOrbitGlow { from { opacity: .55; scale: .94; } to { opacity: 1; scale: 1.06; } }
@keyframes aboStarDrift { to { transform: rotate(360deg); } }
@keyframes aboParticlePulse { from { opacity: .55; } to { opacity: 1; } }
@keyframes aboACorePulse { 0%, 100% { opacity: .35; scale: .96; } 50% { opacity: .9; scale: 1.08; } }
@keyframes aboNodeHalo { 0% { transform: scale(.92); opacity: .55; } 100% { transform: scale(1.32); opacity: 0; } }

@media (max-width: 980px) {
  .solution-orbit-frame .brand-orbit { width: min(100%, 620px); }
}

@media (max-width: 600px) {
  .solution-orbit-frame { border-radius: 16px; }
  .solution-orbit-frame .brand-orbit { width: 100%; }
  .solution-orbit-frame .orbit-node {
    width: clamp(54px, 15vw, 68px);
    height: clamp(54px, 15vw, 68px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .solution-orbit-frame .brand-orbit-particles { display: none; }
  .solution-orbit-frame .orbit-ambient-a,
  .solution-orbit-frame .orbit-ambient-b,
  .solution-orbit-frame .orbit-starfield,
  .solution-orbit-frame .orbit-globe,
  .solution-orbit-frame .orbit-globe svg,
  .solution-orbit-frame .orbit-globe g,
  .solution-orbit-frame .brand-a-core i,
  .solution-orbit-frame .orbit-rotation,
  .solution-orbit-frame .orbit-guide,
  .solution-orbit-frame .orbit-node::after,
  .solution-orbit-frame .node-icon { animation: none !important; }
}