/* ========== ARQUITECTURA CONTROLADA (órbita) ========== */
.architecture { overflow: hidden; }
.arch-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 60px; align-items: center; }
.arch-copy .section-title { margin-bottom: 20px; }

.orbit {
  --size: min(540px, 86vw);
  --r: calc(var(--size) * .42);
  position: relative;
  width: var(--size);
  height: var(--size);
  margin: 0 auto;
}
.orbit-glow {
  position: absolute; inset: 18%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(15, 118, 110, .45), transparent 70%);
  filter: blur(30px);
  animation: breathe 6s ease-in-out infinite;
}
.orbit-ring {
  position: absolute; inset: 8%;
  border-radius: 50%;
  border: 1px dashed rgba(248, 250, 252, .25);
  animation: spin 26s linear infinite;
}
.orbit-ring::after {           /* punto de luz que recorre el anillo */
  content: "";
  position: absolute; top: -5px; left: 50%;
  width: 9px; height: 9px; margin-left: -4.5px;
  border-radius: 50%;
  background: var(--accent-text);
  box-shadow: 0 0 16px 4px var(--accent-glow);
}
.orbit-ring.inner { inset: 30%; border-style: solid; border-color: var(--line); animation: none; }
.orbit-ring.inner::after { display: none; }

.orbit-center {
  --c: calc(var(--size) * .2);
  position: absolute; left: 50%; top: 50%;
  display: grid; place-items: center;
  width: var(--c); height: var(--c);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 30%, var(--panel), var(--bg) 75%);
  border: 1px solid rgba(45, 212, 191, .45);
  box-shadow: 0 0 0 12px rgba(45, 212, 191, .05), 0 0 60px -10px var(--accent-glow);
}
.orbit-center img { width: 55%; height: auto; }

/* Cada icono se coloca en el anillo por su ángulo (--a) */
.orbit-item {
  position: absolute; left: 50%; top: 50%;
  width: 0; height: 0;
  transform: rotate(var(--a)) translateY(calc(var(--r) * -1)) rotate(calc(var(--a) * -1));
}
.orbit-dot {
  --d: clamp(44px, calc(var(--size) * .11), 60px);
  position: absolute;
  left: calc(var(--d) / -2); top: calc(var(--d) / -2);
  display: grid; place-items: center;
  width: var(--d); height: var(--d);
  border-radius: 50%;
  background: var(--bg);
  border: 1px solid var(--line2);
  color: var(--ink-soft);
  box-shadow: inset 0 0 16px rgba(248, 250, 252, .06);
  transition: all .4s var(--ease);
}
.orbit-label {
  position: absolute; left: 50%;
  top: calc(clamp(44px, calc(var(--size) * .11), 60px) / 2 + 6px);
  transform: translateX(-50%);
  color: var(--muted);
  font-size: 13px; font-weight: 400;
  white-space: nowrap;
}
.orbit:hover .orbit-dot { border-color: rgba(45, 212, 191, .45); color: var(--accent-text); }

@keyframes breathe { 0%, 100% { opacity: .7; transform: scale(1); } 50% { opacity: 1; transform: scale(1.08); } }

@media (max-width: 991px) {
  .arch-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .orbit-dot .ico { width: 18px; height: 18px; }
  .orbit-label { font-size: 12px; }
}