/* Scroll-reveal + hero diagram animation, scoped to this website prototype only
   (not added to the shared design-system stylesheet). */

.idh-reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity 700ms var(--ease-standard),transform 700ms var(--ease-standard);
  will-change:opacity,transform;
}
.idh-reveal.idh-revealed{
  opacity:1;
  transform:translateY(0);
}

@media (prefers-reduced-motion: reduce){
  .idh-reveal{opacity:1;transform:none;transition:none;}
}

/* Hero network diagram: lines draw in, nodes pulse gently, once revealed */
.idh-diagram-line{
  stroke-dasharray:300;
  stroke-dashoffset:300;
}
.idh-revealed .idh-diagram-line{
  animation:idh-draw 1.3s var(--ease-standard) forwards;
}
.idh-revealed .idh-diagram-line.idh-line-2{ animation-delay:180ms; }
.idh-revealed .idh-diagram-line.idh-line-3{ animation-delay:360ms; }

@keyframes idh-draw{
  to{ stroke-dashoffset:0; }
}

.idh-diagram-node{
  transform-origin:center;
  transform-box:fill-box;
}
.idh-revealed .idh-diagram-node{
  animation:idh-pulse 2.6s ease-in-out infinite;
}
.idh-revealed .idh-diagram-node.idh-node-2{ animation-delay:250ms; }
.idh-revealed .idh-diagram-node.idh-node-3{ animation-delay:500ms; }

@keyframes idh-pulse{
  0%,100%{ opacity:1; }
  50%{ opacity:0.55; }
}

@media (prefers-reduced-motion: reduce){
  .idh-revealed .idh-diagram-line,
  .idh-revealed .idh-diagram-node{ animation:none; stroke-dashoffset:0; }
}

/* Gentle lift on hover for illustrated/trust cards that don't already have their own hover treatment */
.idh-hover-lift{
  transition:transform var(--duration-base) var(--ease-standard),box-shadow var(--duration-base) var(--ease-standard);
}
.idh-hover-lift:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-lg);
}