/*
 * Hawker Agent Orb
 * A local CSS-3D decorative component. It deliberately contains no external
 * image, canvas or WebGL dependency, so it can be used in a card, rail or
 * hero without adding a rendering runtime.
 */
[data-agent-orb-3d] {
  --agent-orb-x: 0px;
  --agent-orb-y: 0px;
  --agent-orb-tilt-x: 0deg;
  --agent-orb-tilt-y: 0deg;
  --agent-orb-gaze-x: 0px;
  --agent-orb-gaze-y: 0px;
  --agent-orb-glow: rgba(101, 153, 255, 0.42);
  --agent-orb-shell: #e4edff;
  --agent-orb-shadow: #7186ae;
  position: relative;
  display: block;
  width: min(100%, 31rem);
  aspect-ratio: 1 / .9;
  isolation: isolate;
  overflow: visible;
  perspective: 58rem;
  transform-style: preserve-3d;
}

[data-agent-orb-3d][data-agent-orb-variant="compact"] { width: min(100%, 12rem); }

.agent-orb-3d__scene {
  position: absolute;
  inset: 0;
  transform: translate3d(var(--agent-orb-x), var(--agent-orb-y), 0) rotateX(var(--agent-orb-tilt-x)) rotateY(var(--agent-orb-tilt-y));
  transform-origin: 58% 61%;
  transform-style: preserve-3d;
  transition: transform 380ms cubic-bezier(.16, 1, .3, 1);
  will-change: transform;
}

.agent-orb-3d__ambient,
.agent-orb-3d__floor,
.agent-orb-3d__orbit,
.agent-orb-3d__particle { pointer-events: none; }

.agent-orb-3d__ambient {
  position: absolute;
  z-index: 0;
  inset: 5% -4% -3%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 58% 56%, var(--agent-orb-glow), rgba(59, 112, 255, .13) 38%, rgba(27, 61, 133, .04) 56%, transparent 72%);
  filter: blur(18px);
  opacity: .82;
  transform: translateZ(-3rem);
  animation: agent-orb-ambient 5.8s ease-in-out infinite alternate;
}

.agent-orb-3d__floor {
  position: absolute;
  z-index: 1;
  right: 11%;
  bottom: 8%;
  left: 11%;
  height: 16%;
  border: 1px solid rgba(164, 205, 255, .48);
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(109, 159, 255, .24), rgba(46, 85, 170, .04) 60%, transparent 70%);
  box-shadow: inset 0 0 1.4rem rgba(148, 193, 255, .17), 0 0 2.7rem rgba(80, 136, 255, .28), 0 .6rem 2rem rgba(0, 7, 24, .5);
  transform: rotateX(68deg) translateZ(-1rem);
  animation: agent-orb-floor 5.8s ease-in-out infinite alternate;
}

.agent-orb-3d__floor::before,
.agent-orb-3d__floor::after {
  position: absolute;
  inset: 15%;
  border: 1px solid rgba(176, 212, 255, .28);
  border-radius: inherit;
  content: "";
}

.agent-orb-3d__floor::after { inset: 31%; border-color: rgba(218, 235, 255, .39); }

.agent-orb-3d__orbital-system {
  position: absolute;
  z-index: 2;
  inset: 9% 9% 7%;
  transform-style: preserve-3d;
  animation: agent-orb-system 13s linear infinite;
}

.agent-orb-3d__orbit {
  position: absolute;
  inset: 13%;
  border: 1px solid rgba(138, 184, 255, .29);
  border-radius: 50%;
  box-shadow: 0 0 1.6rem rgba(74, 126, 255, .13), inset 0 0 1rem rgba(96, 148, 255, .07);
  transform: rotateX(67deg) rotateZ(15deg) translateZ(-.45rem);
}

.agent-orb-3d__orbit--inner { inset: 28%; border-color: rgba(182, 214, 255, .24); transform: rotateX(74deg) rotateZ(-33deg) translateZ(.4rem); }

/* The lower shell makes the figure read as a small robot rather than a
   disembodied icon. It stays behind the head, with only its collar and
   rounded shoulders peeking through at compact sizes. */
.agent-orb-3d__body {
  position: absolute;
  z-index: 3;
  top: 48%;
  left: 31%;
  width: 39%;
  height: 33%;
  overflow: hidden;
  border: 1px solid rgba(228, 241, 255, .66);
  border-radius: 48% 48% 38% 38% / 60% 60% 37% 37%;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(255, 255, 255, .96) 0 11%, transparent 31%),
    linear-gradient(132deg, #f5f9ff 0 17%, #aec2e9 50%, #607aa8 100%);
  box-shadow: inset -.9rem -1rem 1.45rem rgba(29, 51, 98, .29), inset .65rem .35rem .9rem rgba(255, 255, 255, .7), 0 1.2rem 1.8rem rgba(0, 4, 18, .45), 0 0 1.8rem rgba(91, 145, 255, .24);
  transform: translate3d(0, 0, .62rem) rotateX(-12deg);
  transform-style: preserve-3d;
  animation: agent-orb-body-hover 5.8s ease-in-out infinite alternate;
}

.agent-orb-3d__body::before {
  position: absolute;
  top: 6%;
  left: 18%;
  width: 64%;
  height: 30%;
  border: 1px solid rgba(170, 204, 255, .52);
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(10, 28, 59, .86), rgba(68, 108, 178, .24));
  box-shadow: inset 0 -.4rem .7rem rgba(0, 8, 29, .45), 0 0 1.2rem rgba(87, 150, 255, .23);
  content: "";
  transform: translateZ(.72rem);
}

.agent-orb-3d__body::after {
  position: absolute;
  right: -11%;
  bottom: -19%;
  left: -11%;
  height: 58%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 0%, rgba(154, 197, 255, .5), transparent 54%);
  content: "";
  opacity: .64;
  transform: translateZ(-.18rem);
}

.agent-orb-3d__body-core,
.agent-orb-3d__body-band {
  position: absolute;
  z-index: 2;
  display: block;
  pointer-events: none;
}

.agent-orb-3d__body-core {
  top: 51%;
  left: 44%;
  width: 12%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #b9dbff;
  box-shadow: 0 0 .55rem #d2eaff, 0 0 1.3rem rgba(77, 145, 255, .92);
  transform: translateZ(1rem);
}

.agent-orb-3d__body-band {
  right: 13%;
  bottom: 13%;
  left: 13%;
  height: 16%;
  border-top: 1px solid rgba(235, 246, 255, .6);
  border-radius: 50%;
  box-shadow: 0 -.4rem .8rem rgba(89, 142, 255, .22);
  transform: translateZ(.7rem);
}

.agent-orb-3d__orb {
  position: absolute;
  z-index: 4;
  top: 12%;
  left: 25.5%;
  width: 49%;
  aspect-ratio: .98;
  border: 1px solid rgba(244, 249, 255, .9);
  border-radius: 49% 48% 47% 48% / 46% 47% 53% 54%;
  background:
    radial-gradient(circle at 31% 20%, rgba(255, 255, 255, .99) 0 3%, transparent 14%),
    radial-gradient(ellipse at 71% 84%, rgba(102, 143, 221, .74), transparent 33%),
    radial-gradient(ellipse at 33% 26%, #f8fbff 0 5%, rgba(233, 241, 255, .9) 34%, rgba(161, 181, 224, .96) 73%, #738bb9 100%);
  box-shadow:
    inset -1rem -1.45rem 1.8rem rgba(34, 55, 102, .33),
    inset .72rem .58rem 1.25rem rgba(255, 255, 255, .87),
    0 1.45rem 2.2rem rgba(0, 5, 21, .5),
    0 0 3rem rgba(118, 165, 255, .35);
  transform: translateZ(1.8rem) rotateX(-4deg) rotateY(-2deg);
  transform-style: preserve-3d;
  animation: agent-orb-hover 5.8s ease-in-out infinite alternate;
}

.agent-orb-3d__orb::before {
  position: absolute;
  z-index: 1;
  top: 6%;
  left: 10%;
  width: 43%;
  height: 18%;
  border-radius: 50%;
  background: linear-gradient(120deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .08) 68%, transparent 75%);
  content: "";
  filter: blur(.35rem);
  opacity: .76;
  transform: translateZ(1.8rem) rotate(-15deg);
}

.agent-orb-3d__orb::after {
  position: absolute;
  z-index: 1;
  right: 12%;
  bottom: 8%;
  width: 31%;
  height: 15%;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(229, 241, 255, .56), transparent 68%);
  content: "";
  filter: blur(.42rem);
  opacity: .66;
  transform: translateZ(1.1rem) rotate(-9deg);
}

.agent-orb-3d__shell-seam {
  position: absolute;
  z-index: 2;
  top: 11%;
  right: 6%;
  bottom: 11%;
  left: 6%;
  display: block;
  border: 1px solid rgba(108, 139, 203, .33);
  border-top-color: rgba(255, 255, 255, .42);
  border-right-color: transparent;
  border-bottom-color: rgba(47, 71, 126, .48);
  border-left-color: transparent;
  border-radius: inherit;
  opacity: .54;
  transform: translateZ(.74rem) rotate(-10deg);
}

/* Ear pods are separate 3D layers rather than a pair of circles painted on
   the shell. This is what keeps the silhouette legible when the hero grows. */
.agent-orb-3d__ear {
  position: absolute;
  z-index: 0;
  top: 25%;
  width: 31%;
  aspect-ratio: .91;
  overflow: hidden;
  border: 1px solid rgba(233, 243, 255, .74);
  border-radius: 49% 51% 51% 49% / 47% 52% 48% 53%;
  background: radial-gradient(circle at 33% 22%, #fbfdff, #bdd0f2 48%, #6b82b6 100%);
  box-shadow: inset -.6rem -.7rem 1rem rgba(43, 64, 112, .35), inset .38rem .3rem .7rem rgba(255, 255, 255, .75), 0 .55rem 1rem rgba(0, 4, 20, .34), 0 0 1.2rem rgba(100, 158, 255, .17);
  transform-style: preserve-3d;
}

.agent-orb-3d__ear--left { left: -16%; transform: translateZ(-.65rem) rotateY(44deg) rotateZ(-10deg); }
.agent-orb-3d__ear--right { right: -16%; transform: translateZ(-.65rem) rotateY(-44deg) rotateZ(10deg); }

.agent-orb-3d__ear-ring,
.agent-orb-3d__ear-core {
  position: absolute;
  display: block;
  border-radius: 50%;
  content: "";
}

.agent-orb-3d__ear-ring {
  inset: 18%;
  border: 1px solid rgba(140, 187, 255, .76);
  background: radial-gradient(circle, rgba(16, 33, 70, .88) 0 42%, rgba(86, 144, 249, .42) 45%, transparent 68%);
  box-shadow: inset 0 0 .55rem rgba(100, 170, 255, .8), 0 0 .95rem rgba(76, 145, 255, .36);
  transform: translateZ(.84rem);
}

.agent-orb-3d__ear-core {
  top: 35%;
  left: 35%;
  width: 30%;
  aspect-ratio: 1;
  background: #cce8ff;
  box-shadow: 0 0 .45rem #cce8ff, 0 0 .9rem rgba(80, 151, 255, .9);
  transform: translateZ(1.05rem);
}

.agent-orb-3d__face {
  position: absolute;
  z-index: 3;
  top: 20%;
  left: 14%;
  width: 72%;
  height: 51%;
  overflow: hidden;
  border: 1px solid rgba(190, 218, 255, .78);
  border-radius: 47% 47% 49% 49% / 46% 46% 53% 53%;
  background:
    radial-gradient(ellipse at 50% 118%, rgba(76, 141, 255, .46), transparent 45%),
    radial-gradient(ellipse at 40% 12%, rgba(102, 163, 255, .34), transparent 39%),
    linear-gradient(145deg, #071020, #0e2141 53%, #040812);
  box-shadow: inset .5rem .45rem .9rem rgba(96, 145, 255, .17), inset -.5rem -.8rem 1rem rgba(0, 0, 0, .66), 0 0 1.35rem rgba(81, 142, 255, .41);
  transform: translateZ(1.18rem) rotateX(2deg);
}

.agent-orb-3d__face::before {
  position: absolute;
  top: -15%;
  left: -31%;
  width: 82%;
  height: 47%;
  border-radius: 50%;
  background: linear-gradient(112deg, rgba(255, 255, 255, .58), rgba(183, 216, 255, .06) 58%, transparent 64%);
  content: "";
  filter: blur(1px);
  opacity: .72;
  transform: rotate(-16deg);
}

.agent-orb-3d__face::after {
  position: absolute;
  right: 12%;
  bottom: 10%;
  left: 12%;
  height: 19%;
  border-top: 1px solid rgba(128, 184, 255, .25);
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 100%, rgba(97, 163, 255, .28), transparent 66%);
  box-shadow: 0 -.55rem 1.15rem rgba(58, 120, 255, .1);
  content: "";
  opacity: .72;
}

/* A separate, faint scan plane gives the visor a real depth layer rather
   than baking a UI treatment into the shell. It is decorative only: no
   state, signal or identity is encoded in the scan. */
.agent-orb-3d__visor-grid {
  position: absolute;
  inset: 12% 9% 14%;
  display: block;
  border-radius: inherit;
  background:
    linear-gradient(90deg, rgba(164, 207, 255, .08) 1px, transparent 1px),
    linear-gradient(rgba(164, 207, 255, .07) 1px, transparent 1px);
  background-size: .42rem .42rem;
  box-shadow: inset 0 0 1.2rem rgba(77, 143, 255, .08);
  opacity: .46;
  transform: translateZ(.66rem) skewX(-6deg);
  animation: agent-orb-visor-scan 5.1s ease-in-out infinite alternate;
}

.agent-orb-3d__eyes {
  position: absolute;
  z-index: 4;
  top: 43%;
  right: 20%;
  left: 20%;
  display: flex;
  justify-content: space-between;
  transform: translate3d(var(--agent-orb-gaze-x), var(--agent-orb-gaze-y), 1.8rem);
  transition: transform 320ms cubic-bezier(.16, 1, .3, 1);
}

.agent-orb-3d__eyes i {
  display: block;
  position: relative;
  width: 12%;
  aspect-ratio: .48;
  border: 1px solid rgba(207, 234, 255, .78);
  border-radius: 50%;
  background: linear-gradient(90deg, #74aaff, #e1f4ff 53%, #6e9eff);
  box-shadow: 0 0 .45rem #adceff, 0 0 1.35rem rgba(86, 151, 255, .98), inset 0 0 .34rem #fff;
  animation: agent-orb-eye 4.2s ease-in-out infinite alternate;
}

.agent-orb-3d__eyes i::after {
  position: absolute;
  top: 17%;
  left: 27%;
  width: 36%;
  height: 24%;
  border-radius: 50%;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 0 .35rem rgba(255, 255, 255, .72);
  content: "";
}

.agent-orb-3d__eyes i:last-child { animation-delay: -1.3s; }

.agent-orb-3d__antenna {
  position: absolute;
  z-index: 3;
  top: -9%;
  left: 46.5%;
  width: 7%;
  height: 18%;
  border: 1px solid rgba(207, 226, 255, .6);
  border-radius: 999px;
  background: linear-gradient(90deg, #8093b8, #eff7ff 54%, #94a9d0);
  box-shadow: 0 0 .85rem rgba(119, 168, 255, .31), inset -.16rem 0 .25rem rgba(46, 67, 121, .24);
  transform: translateZ(.42rem) rotateZ(-6deg);
}

.agent-orb-3d__antenna::before {
  position: absolute;
  top: -105%;
  left: -182%;
  width: 464%;
  aspect-ratio: 1;
  border: 1px solid rgba(150, 197, 255, .43);
  border-radius: 50%;
  background: radial-gradient(circle, transparent 42%, rgba(132, 183, 255, .28) 47%, transparent 58%);
  box-shadow: 0 0 1.35rem rgba(107, 162, 255, .32);
  content: "";
  opacity: .68;
  transform: translateZ(.36rem);
}

.agent-orb-3d__beacon {
  position: absolute;
  z-index: 2;
  top: -49%;
  left: -112%;
  display: block;
  width: 324%;
  aspect-ratio: 1;
  border: 1px solid rgba(222, 241, 255, .82);
  border-radius: 50%;
  background: radial-gradient(circle at 34% 27%, #fff, #bedbff 33%, #5a8ee7 68%, #16386f 100%);
  box-shadow: 0 0 .75rem rgba(193, 224, 255, .94), 0 0 1.85rem rgba(80, 150, 255, .66);
  transform: translateZ(1.25rem);
  animation: agent-orb-beacon 3.8s ease-in-out infinite alternate;
}

.agent-orb-3d__particle {
  position: absolute;
  z-index: 5;
  width: .35rem;
  aspect-ratio: 1;
  border: 1px solid rgba(201, 224, 255, .74);
  border-radius: 50%;
  background: #b8d5ff;
  box-shadow: 0 0 .65rem #8ab8ff;
  animation: agent-orb-particle 5.6s ease-in-out infinite alternate;
}

.agent-orb-3d__particle--one { top: 24%; left: 14%; animation-delay: -1.7s; }
.agent-orb-3d__particle--two { top: 17%; right: 17%; width: .22rem; animation-delay: -3.8s; }
.agent-orb-3d__particle--three { right: 9%; bottom: 31%; width: .27rem; animation-delay: -.6s; }
.agent-orb-3d__particle--four { bottom: 20%; left: 18%; width: .2rem; animation-delay: -4.4s; }

[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__ambient,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__orbital-system,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__floor,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__body,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__orb,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__visor-grid,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__beacon,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__eyes i,
[data-agent-orb-3d][data-agent-orb-visible="false"] .agent-orb-3d__particle { animation-play-state: paused; }

[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__ambient,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__orbital-system,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__floor,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__body,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__orb,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__visor-grid,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__beacon,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__eyes i,
[data-agent-orb-3d][data-agent-orb-motion="reduced"] .agent-orb-3d__particle { animation: none; }

@keyframes agent-orb-ambient {
  from { opacity: .55; scale: .94; }
  to { opacity: .93; scale: 1.07; }
}

@keyframes agent-orb-floor {
  from { opacity: .68; transform: rotateX(68deg) translate3d(0, 0, -1rem) scale(.96); }
  to { opacity: 1; transform: rotateX(68deg) translate3d(0, 0, -1rem) scale(1.04); }
}

@keyframes agent-orb-system {
  from { transform: rotateZ(0deg); }
  to { transform: rotateZ(360deg); }
}

@keyframes agent-orb-body-hover {
  from { transform: translate3d(0, .5%, .62rem) rotateX(-12deg) rotateZ(-.7deg); }
  to { transform: translate3d(0, 2.8%, .7rem) rotateX(-9deg) rotateZ(.7deg); }
}

@keyframes agent-orb-hover {
  from { transform: translate3d(0, -1.5%, 1.8rem) rotateX(-4deg) rotateY(-2deg) rotateZ(-1.5deg); }
  to { transform: translate3d(0, 3%, 2rem) rotateX(-1deg) rotateY(1deg) rotateZ(1.5deg); }
}

@keyframes agent-orb-eye {
  from { opacity: .72; scale: 1 .9; }
  to { opacity: 1; scale: 1.1 1.04; }
}

@keyframes agent-orb-visor-scan {
  from { opacity: .18; background-position: 0 0, 0 0; }
  to { opacity: .58; background-position: .42rem 0, 0 .42rem; }
}

@keyframes agent-orb-beacon {
  from { filter: brightness(.82); scale: .88; }
  to { filter: brightness(1.18); scale: 1.12; }
}

@keyframes agent-orb-particle {
  from { opacity: .35; transform: translate3d(-.35rem, -.75rem, 1rem); }
  to { opacity: 1; transform: translate3d(.5rem, .55rem, 2.25rem); }
}

@media (prefers-reduced-motion: reduce) {
  [data-agent-orb-3d] .agent-orb-3d__ambient,
  [data-agent-orb-3d] .agent-orb-3d__orbital-system,
  [data-agent-orb-3d] .agent-orb-3d__floor,
  [data-agent-orb-3d] .agent-orb-3d__body,
  [data-agent-orb-3d] .agent-orb-3d__orb,
  [data-agent-orb-3d] .agent-orb-3d__visor-grid,
  [data-agent-orb-3d] .agent-orb-3d__beacon,
  [data-agent-orb-3d] .agent-orb-3d__eyes i,
  [data-agent-orb-3d] .agent-orb-3d__particle { animation: none; }
  [data-agent-orb-3d] .agent-orb-3d__scene,
  [data-agent-orb-3d] .agent-orb-3d__eyes { transition: none; }
}
