/* ============================================================
   Real State — Grupo HP · motion.css
   Vocabulário de movimento em CSS + fallbacks de acessibilidade.
   A curva "dock" ecoa as docas: chega rápido, encosta sem quicar.
   ============================================================ */

:root {
  --ease-dock: cubic-bezier(0.5, 0, 0.1, 1);
  --ease-precision: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-structural: cubic-bezier(0.83, 0, 0.17, 1);
}

/* Placeholder "blueprint vivo" (media.js injeta a estrutura) */
.blueprint {
  position: absolute; inset: 0;
  display: grid; place-items: center;
  background:
    linear-gradient(155deg, var(--mult-azul-profundo) 0%, var(--mult-azul) 100%);
}
.blueprint::before { /* grade técnica sutil */
  content: ""; position: absolute; inset: 0; opacity: 0.05;
  background-image:
    linear-gradient(var(--mult-branco) 1px, transparent 1px),
    linear-gradient(90deg, var(--mult-branco) 1px, transparent 1px);
  background-size: 48px 48px;
}
.blueprint svg { width: min(64%, 520px); height: auto; opacity: 0.9; }
.blueprint__scanner {
  position: absolute; top: 0; bottom: 0; width: 1px; left: 0;
  background: var(--mult-amarelo-doca); opacity: 0.7;
  box-shadow: 0 0 12px 0 var(--mult-amarelo-doca);
}

/* Página entra suave (anti-flash entre navegações MPA) */
@media (prefers-reduced-motion: no-preference) {
  body { animation: page-in 300ms var(--ease-precision) both; }
  @keyframes page-in { from { opacity: 0; } to { opacity: 1; } }
}

/* Estados que o motion.js anima — só valem com JS + motion ok.
   A classe .motion-ok é adicionada ao <html> pelo motion.js;
   sem ela, nada fica escondido. */
.motion-ok [data-reveal],
.motion-ok [data-stagger-group] > * { will-change: transform, opacity; }

/* Reduced motion: mata loops e transições longas */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .blueprint__scanner { display: none; }
}

/* Promoção de camada só com motion ligado (gate .motion-ok) —
   sem motion, nenhum elemento fica promovido à toa. */
.motion-ok .blueprint__scanner { will-change: transform; }