/*
  ACT I — Sinal & Construção (Phase 2)
  ------------------------------------
  Namespace: tudo aqui vive sob #act-i / .neo-act-i, nunca vaza para nav,
  formulário, modal ou tipografia do site legado. Consome os tokens de
  css/neo-cinematic-foundation.css (--neo-*), carregado antes deste arquivo.
  Estado inicial/final e toda a timeline ficam em js/acts/act-i.js — este
  arquivo só define layout/posição, nunca dispara animação sozinho.
*/

#act-i {
  /* AD-03: removido da abertura — ver
     dev/impl-ciclo-1/reports/AD-03-DECISAO-ABERTURA.md. display:none
     substitui o layout abaixo (preservado, não excluído) enquanto a
     seção ficar fora da abertura ativa; reverter é remover esta linha. */
  display: none;
  height: 100vh;
  position: relative;
  overflow: hidden;
  background: var(--neo-bg, #05050A);
  align-items: center;
  justify-content: center;
}

.neo-act-i__space {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 55% 55% at 50% 40%, rgba(79, 168, 255, 0.06) 0%, transparent 70%),
    radial-gradient(ellipse 40% 40% at 50% 65%, rgba(168, 85, 247, 0.04) 0%, transparent 70%);
  will-change: opacity;
}

.neo-act-i__viewport {
  position: relative;
  width: min(60vw, 640px);
  aspect-ratio: 220 / 250;
}

/* ---- grupo de identidade: eixo + círculo + glints, recua junto na
   "revelação espacial" sem afetar a escala do monitor/NX ---- */
.neo-act-i__identity-group {
  position: absolute;
  inset: 0;
}

.neo-act-i__axis {
  position: absolute;
  left: 45%;
  top: 6%;
  width: 10%;
  height: 72%;
  transform-origin: top center;
  will-change: transform, opacity;
}

.neo-act-i__circle {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  transform-origin: center;
  will-change: transform, opacity;
}
.neo-act-i__circle ellipse {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
}

.neo-act-i__glints {
  position: absolute;
  left: 22%;
  top: 7%;
  width: 56%;
  height: 24%;
  overflow: visible;
}
.neo-act-i__glint {
  transform-box: fill-box;
  transform-origin: center;
  will-change: transform, opacity;
}

/* ---- monitor: layers posicionados via JS a partir de
   assets/manifests/monitor-layers.json (fonte de verdade única) ---- */
.neo-act-i__monitor {
  position: absolute;
  left: 50%;
  top: 54%;
  transform: translate(-50%, -50%);
  width: min(66vw, 740px);
  aspect-ratio: 1536 / 1024;
  will-change: opacity, transform;
}
.neo-act-i__monitor img {
  position: absolute;
  will-change: opacity, transform;
}
.neo-act-i__monitor .neo-monitor-screen { z-index: var(--neo-z-monitor-screen, 30); }
.neo-act-i__monitor .neo-monitor-chassis,
.neo-act-i__monitor .neo-monitor-stand,
.neo-act-i__monitor .neo-monitor-base { z-index: var(--neo-z-monitor-body, 20); }

/* ---- NX: wrapper neutro — trocar o <img> por SVG oficial no futuro não
   exige tocar em timeline/posição/escala/transform-origin (seção 11/29). ---- */
.neo-act-i__nx {
  position: absolute;
  left: 50%;
  top: 4%;
  width: 15%;
  aspect-ratio: 257 / 177;
  transform: translate(-50%, 0);
  will-change: opacity, transform;
}
.neo-act-i__nx img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 768px) {
  /* custo de blur/glow reduzido em mobile — decisão por orçamento, não
     narrativa (ratificação R1); nenhum elemento é removido. */
  .neo-act-i__axis,
  .neo-act-i__circle,
  .neo-act-i__glints { filter: none !important; }
}

/* A regra reduced-motion que existia aqui (altura auto/padding pro estado
   estático) ficou sem efeito depois do AD-03: #act-i agora é display:none
   sempre, para todo visitante, não só para reduced-motion — então não há
   mais um estado "estático visível" deste ato pra dimensionar. */