/* Momentos de marca — HOME (copia de trabajo, no afecta el sitio original) */
/* Solo transform y opacity, salvo el trazo del sello (stroke-dasharray), pedido explícitamente. */

/* ---------- 7. Sello de confirmación — carga-comunal.html (#diagnostic-form / .diag-result) ---------- */
.diag-result{
  position:relative;
  overflow:hidden;
}
.diag-result > *:not(.diag-seal){
  transition:opacity 360ms ease 60ms;
}
.diag-result.is-confirming > *:not(.diag-seal){
  opacity:.1;
}
.diag-result.is-confirmed > *:not(.diag-seal){
  opacity:1;
  transition:opacity 420ms ease 120ms;
}

.diag-seal{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) scale(.82);
  opacity:0;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  transition:opacity 260ms ease, transform 260ms ease;
}
.diag-result.is-confirming .diag-seal,
.diag-result.is-confirmed .diag-seal{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}
.diag-result.is-confirmed .diag-seal{
  opacity:0;
  transform:translate(-50%,-50%) scale(1.06);
  transition:opacity 300ms ease 260ms, transform 300ms ease 260ms;
}

.diag-seal-circle{
  fill:none;
  stroke:var(--purple);
  stroke-width:6;
  stroke-linecap:round;
  stroke-dasharray:var(--seal-len,327);
  stroke-dashoffset:var(--seal-len,327);
  transition:stroke-dashoffset 480ms cubic-bezier(.2,.8,.2,1);
}
.diag-seal-check{
  fill:none;
  stroke:var(--purple);
  stroke-width:7;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:var(--check-len,68);
  stroke-dashoffset:var(--check-len,68);
  transition:stroke-dashoffset 320ms cubic-bezier(.2,.8,.2,1) 380ms;
}
.diag-result.is-confirming .diag-seal-circle,
.diag-result.is-confirmed .diag-seal-circle,
.diag-result.is-confirming .diag-seal-check,
.diag-result.is-confirmed .diag-seal-check{
  stroke-dashoffset:0;
}

/* ---------- 8. Órbita que mira — index.html (.orbit / .orbit-node-*) ---------- */
@media (hover:hover) and (pointer:fine){
  .orbit-center-badge{
    transition:transform 520ms cubic-bezier(.2,.8,.2,1);
  }
  .orbit:has(.orbit-node-telecom:hover) .orbit-center-badge{
    transform:rotate(-3deg) scale(1.04);
  }
  .orbit:has(.orbit-node-ingenieria:hover) .orbit-center-badge{
    transform:rotate(7deg) scale(1.04);
  }
  .orbit:has(.orbit-node-movilidad:hover) .orbit-center-badge{
    transform:rotate(-7deg) scale(1.04);
  }
  .orbit:has(.orbit-node-iluminacion:hover) .orbit-center-badge{
    transform:rotate(3deg) scale(1.04);
  }
  .orbit-ring{transition:background 260ms ease}
  .orbit:has(.orbit-node-movilidad:hover) .orbit-ring{
    background:conic-gradient(from -90deg,#6B2BE2 0deg 78deg,transparent 78deg 90deg,#5A6069 90deg 168deg,transparent 168deg 180deg,#6B7078 180deg 258deg,transparent 258deg 270deg,#4A4E56 270deg 348deg,transparent 348deg 360deg);
  }
  .orbit:has(.orbit-node-iluminacion:hover) .orbit-ring{
    background:conic-gradient(from -90deg,#4A4E56 0deg 78deg,transparent 78deg 90deg,#6B2BE2 90deg 168deg,transparent 168deg 180deg,#6B7078 180deg 258deg,transparent 258deg 270deg,#4A4E56 270deg 348deg,transparent 348deg 360deg);
  }
  .orbit:has(.orbit-node-ingenieria:hover) .orbit-ring{
    background:conic-gradient(from -90deg,#4A4E56 0deg 78deg,transparent 78deg 90deg,#5A6069 90deg 168deg,transparent 168deg 180deg,#6B2BE2 180deg 258deg,transparent 258deg 270deg,#4A4E56 270deg 348deg,transparent 348deg 360deg);
  }
  .orbit:has(.orbit-node-telecom:hover) .orbit-ring{
    background:conic-gradient(from -90deg,#4A4E56 0deg 78deg,transparent 78deg 90deg,#5A6069 90deg 168deg,transparent 168deg 180deg,#6B7078 180deg 258deg,transparent 258deg 270deg,#6B2BE2 270deg 348deg,transparent 348deg 360deg);
  }
}

.orbit-node::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:radial-gradient(circle at 50% 30%,rgba(107,43,226,.4),transparent 70%);
  opacity:0;
  transition:opacity var(--dur-base) var(--ease-out);
  pointer-events:none;
}
.orbit-node:hover::after,
.orbit-node:focus-visible::after{
  opacity:1;
}

/* ---------- 9. Hero con respiración — index.html (.hero-orbit) ---------- */
.hero-orbit{
  animation:home-hero-breathe 12s ease-in-out infinite;
  transform-origin:60% 45%;
  will-change:transform;
}

@keyframes home-hero-breathe{
  0%,100%{ transform:scale(1) translate3d(0,0,0); }
  50%{ transform:scale(1.03) translate3d(-6px,-5px,0); }
}

@media (prefers-reduced-motion: reduce){
  .hero-orbit{
    animation:none;
  }
  .orbit-center-badge{
    transition:none;
  }
  .diag-seal,
  .diag-seal-circle,
  .diag-seal-check,
  .diag-result > *:not(.diag-seal){
    transition:none;
  }
}