/* Hero orbit — scales with column width; logos stay aligned on small screens */
.hero-right--orbit {
  container-type: inline-size;
  container-name: hero-orbit;
  flex: 1 1 52%;
  max-width: 680px;
  min-width: 0;
  min-height: max(260px, min(600px, 100cqi));
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.orbit-wrap.orbit-wrap--lg {
  --orbit-size: min(600px, 100cqi, 92vw);
  --chip-outer: clamp(38px, 8cqi, 48px);
  --chip-inner: clamp(34px, 7.5cqi, 42px);
  --orbit-r-outer: calc(var(--orbit-size) * 0.4);
  --orbit-r-inner: calc(var(--orbit-size) * 0.25);
  position: relative;
  width: var(--orbit-size);
  height: var(--orbit-size);
  flex-shrink: 0;
  transform: none;
  transform-origin: center center;
}

.orbit-wrap--lg .ring {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.orbit-wrap--lg .r1 {
  width: 96%;
  height: 96%;
}

.orbit-wrap--lg .r2 {
  width: 71%;
  height: 71%;
}

.orbit-wrap--lg .r3 {
  width: 44%;
  height: 44%;
}

.orbit-wrap--lg .r4 {
  display: none;
}

.orbit-wrap--lg .rot-cw,
.orbit-wrap--lg .rot-ccw {
  position: absolute;
  inset: 2%;
  width: auto;
  height: auto;
  margin: 0;
  top: 2%;
  left: 2%;
  right: 2%;
  bottom: 2%;
}

/* Polar placement — radius scales with orbit box */
.orbit-point {
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--chip-size, var(--chip-outer));
  height: var(--chip-size, var(--chip-outer));
  margin: calc(var(--chip-size, var(--chip-outer)) / -2) 0 0
    calc(var(--chip-size, var(--chip-outer)) / -2);
  transform: rotate(var(--a)) translateY(calc(-1 * var(--orbit-r, var(--orbit-r-outer))))
    rotate(calc(-1 * var(--a)));
  z-index: 5;
}

.rot-cw .orbit-point {
  --orbit-r: var(--orbit-r-outer);
  --chip-size: var(--chip-outer);
}

.rot-ccw .orbit-point {
  --orbit-r: var(--orbit-r-inner);
  --chip-size: var(--chip-inner);
}

.rot-cw .orbit-point .ti-chip {
  animation: counterCW 22s linear infinite;
}

.rot-ccw .orbit-point .ti-chip {
  animation: counterCCW 16s linear infinite;
}

.orbit-point .ti-chip {
  position: static;
  width: 100%;
  height: 100%;
}

.orbit-wrap--lg .orbit-point .ti-chip,
.orbit-wrap--lg .ti-chip--brand {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.orbit-wrap--lg .ti-chip--brand img {
  width: 34px;
  height: 34px;
  max-width: 34px;
  max-height: 34px;
  object-fit: contain;
  display: block;
}

.orbit-wrap--lg .orbit-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 6;
}

.orbit-center--hub {
  width: clamp(84px, 22cqi, 112px);
  height: clamp(84px, 22cqi, 112px);
  background: linear-gradient(155deg, #2a9494 0%, #145e5e 50%, #0a4545 100%);
  box-shadow: 0 0 0 clamp(10px, 3cqi, 16px) rgba(20, 94, 94, 0.1),
    0 12px 32px rgba(20, 94, 94, 0.26);
  padding: 8px;
}

.orbit-logo--hub {
  width: 68%;
  height: 68%;
  max-width: 64px;
  max-height: 64px;
}

/* Narrow / stacked hero — slightly tighter radius */
@container hero-orbit (max-width: 420px) {
  .orbit-wrap.orbit-wrap--lg {
    --orbit-r-outer: calc(var(--orbit-size) * 0.39);
    --orbit-r-inner: calc(var(--orbit-size) * 0.24);
  }
}

@container hero-orbit (max-width: 340px) {
  .orbit-wrap.orbit-wrap--lg {
    --chip-outer: clamp(36px, 9cqi, 44px);
    --chip-inner: clamp(34px, 8cqi, 40px);
    --orbit-r-outer: calc(var(--orbit-size) * 0.36);
    --orbit-r-inner: calc(var(--orbit-size) * 0.22);
  }
}

@media (max-width: 1100px) {
  .hero-right--orbit {
    width: 100%;
    max-width: min(600px, 100%);
    margin: 0 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rot-cw,
  .rot-ccw,
  .orbit-point .ti-chip {
    animation: none !important;
  }
}