/* ==========================================================================
   OliveiraCode · Link Hub · Motion
   Regras: só transform/opacity/clip-path; nada de blur ou box-shadow animado;
   loops pausam fora da tela ou com a aba oculta; reduced motion zera tudo.
   Timeline: luz ambiente → símbolo → texto → links.
   ========================================================================== */

@keyframes oc-ambient {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes oc-glow-in {
  from { opacity: 0; scale: .82; }
  to   { opacity: 1; scale: 1; }
}
/* Abertura do portal: a logo é revelada por uma íris a partir do símbolo. */
@keyframes oc-portal {
  0%   { clip-path: circle(0% at 50.1% 37.8%); opacity: 0; }
  12%  { opacity: 1; }
  100% { clip-path: circle(72% at 50.1% 37.8%); opacity: 1; }
}
@keyframes oc-rise {
  from { opacity: 0; transform: translate3d(0, 14px, 0); }
  to   { opacity: 1; transform: none; }
}
@keyframes oc-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes oc-draw {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@keyframes oc-beam {
  0%   { transform: translateX(-110%); }
  55%  { transform: translateX(270%); }
  100% { transform: translateX(270%); }
}
@keyframes oc-travel { to { offset-distance: 100%; } }
@keyframes oc-ping {
  0%   { opacity: .7; transform: scale(.6); }
  70%  { opacity: 0; transform: scale(1.9); }
  100% { opacity: 0; transform: scale(1.9); }
}
@keyframes oc-sweep {
  from { transform: translateX(-130%) skewX(-12deg); }
  to   { transform: translateX(330%) skewX(-12deg); }
}
@keyframes oc-sweep-hover {
  from { transform: translateX(-130%) skewX(-12deg); }
  to   { transform: translateX(330%) skewX(-12deg); }
}
@keyframes oc-ticker { to { transform: translate3d(-50%, 0, 0); } }
@keyframes oc-signal {
  0%   { transform: translate3d(0, -100%, 0); opacity: 0; }
  10%  { opacity: 1; }
  80%  { opacity: 1; }
  100% { transform: translate3d(0, 900%, 0); opacity: 0; }
}
@keyframes oc-reveal-failsafe { to { opacity: 1; transform: none; } }

/* --------------------------------------------------------------------------
   Entrada coreografada (curta: tudo visível em ~1.2s)
   -------------------------------------------------------------------------- */
.atmosphere__light { animation: oc-ambient 1.4s var(--ease-premium) both; }
.atmosphere__grid  { animation: oc-ambient 2s .2s var(--ease-premium) both; }

.stage__glow   { animation: oc-glow-in 1.4s .05s var(--ease-out) both; }
.brand__logo   { animation: oc-portal 1.15s .12s var(--ease-premium) both; }
.stage__orbits { animation: oc-fade 1.6s .5s var(--ease-premium) both; }

.topline { transform-origin: center; animation: oc-draw 1s .1s var(--ease-premium) both; }

.intro__item { animation: oc-rise .85s var(--ease-out) both; }
.intro__item:nth-child(1) { animation-delay: .38s; }
.intro__item:nth-child(2) { animation-delay: .45s; }
.intro__item:nth-child(3) { animation-delay: .54s; }
.intro__item:nth-child(4) { animation-delay: .62s; }

.links__list > li { animation: oc-rise .8s var(--ease-out) both; animation-delay: .6s; }
.links__list > li:nth-child(2) { animation-delay: .66s; }
.links__list > li:nth-child(3) { animation-delay: .72s; }
.links__list > li:nth-child(4) { animation-delay: .78s; }
.links__list > li:nth-child(5) { animation-delay: .84s; }
.links__list > li:nth-child(6) { animation-delay: .9s; }
.links__list > li:nth-child(n+7) { animation-delay: .96s; }

/* Varredura de luz: uma vez no CTA principal após a entrada, e no hover. */
.link-card--primary .link-card__sweep::before { animation: oc-sweep 1.3s 1.35s var(--ease-premium) both; }
.cta::after {
  content: '';
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: 0;
  width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .26) 50%, transparent);
  transform: translateX(-130%) skewX(-12deg);
  pointer-events: none;
}
.closing.is-in .cta::after { animation: oc-sweep 1.3s .5s var(--ease-premium) both; }

/* --------------------------------------------------------------------------
   Loops discretos (todos marcados com .loop)
   -------------------------------------------------------------------------- */
.topline__beam { animation: oc-beam 6.5s 1.4s var(--ease-premium) infinite; }

/* Satélite percorre a órbita principal (coordenadas do SVG). Sem suporte a
   offset-path, fica parado na extremidade direita, fora da marca. */
@supports (offset-path: path('M0 0')) {
  .orbit__sat {
    cx: 0;
    cy: 0;
    offset-path: path('M 1328 474 A 700 180 0 1 1 -72 474 A 700 180 0 1 1 1328 474');
    offset-rotate: 0deg;
    offset-distance: 0%;
    animation: oc-travel 18s linear infinite;
  }
}

.status__dot::after { animation: oc-ping 2.8s 1.6s var(--ease-out) infinite; }

.ticker__track { animation: oc-ticker 48s linear infinite; }
.ticker.is-off .ticker__track { animation-play-state: paused; }

.signal span { animation: oc-signal 7s 2s var(--ease-premium) infinite; }
.signal--right span { animation-delay: 5.5s; }

/* Aba em segundo plano (Page Visibility API) */
.is-hidden .loop,
.is-hidden .loop *,
.is-hidden .loop::after,
.is-hidden .status__dot::after { animation-play-state: paused !important; }

/* --------------------------------------------------------------------------
   Microinterações
   -------------------------------------------------------------------------- */
.link-card,
.cta,
.aux-link,
.footer__credit a {
  transition:
    transform .45s var(--ease-premium),
    border-color .35s var(--ease-premium),
    background-color .35s var(--ease-premium),
    color .3s var(--ease-premium);
}
.link-card::before,
.link-card::after { transition: opacity .4s var(--ease-premium); }
.link-card__arrow,
.link-card__arrow svg,
.link-card__icon,
.cta__arrow { transition: transform .45s var(--ease-premium), background-color .35s, color .35s, border-color .35s; }

/* Pressed: feedback real no toque e no clique */
.link-card:active,
.cta:active {
  transform: translateY(0) scale(.985);
  transition-duration: .12s;
}
.aux-link:active { transform: scale(.97); transition-duration: .12s; }

/* Foco por teclado ganha o mesmo destaque do hover */
.link-card:focus-visible { border-radius: var(--radius-card); border-color: rgba(53, 180, 255, .5); }
.link-card:focus-visible .link-card__arrow svg { transform: translate(2px, -2px); }

/* Hover só em dispositivos com hover real (sem hover preso no toque) */
@media (hover: hover) and (pointer: fine) {
  .link-card:hover {
    transform: translateY(-3px);
    border-color: rgba(53, 180, 255, .34);
  }
  .link-card:hover::before,
  .link-card:hover::after { opacity: 1; }
  .link-card:hover .link-card__arrow {
    border-color: rgba(53, 180, 255, .45);
    color: var(--blue-bright);
  }
  .link-card:hover .link-card__arrow svg { transform: translate(2px, -2px); }
  .link-card:hover .link-card__icon { transform: translateY(-1px); }
  .link-card--primary:hover { border-color: rgba(170, 220, 255, .6); }
  .link-card--primary:hover .link-card__arrow { color: var(--blue-deep); transform: scale(1.06); }
  .link-card--primary:hover .link-card__sweep::before { animation: oc-sweep-hover 1.1s var(--ease-premium) both; }
  .link-card:active { transform: translateY(-1px) scale(.99); }

  .cta:hover { transform: translateY(-2px); border-color: rgba(170, 220, 255, .6); }
  .cta:hover .cta__arrow { transform: translate(2px, -2px); }
  .cta:hover::after { animation: oc-sweep-hover 1.1s var(--ease-premium) both; }

  .aux-link:hover { color: var(--text); border-color: var(--border); }
  .footer__credit a:hover { color: var(--text); border-bottom-color: rgba(53, 180, 255, .6); }
}

/* --------------------------------------------------------------------------
   Parallax muito leve (vars --px/--py de -1 a 1, só pointer fino)
   -------------------------------------------------------------------------- */
.stage__orbits { transform: translate3d(calc(var(--px, 0) * -6px), calc(var(--py, 0) * -3px), 0); }
.stage__glow   { transform: translate3d(calc(var(--px, 0) * 8px), calc(var(--py, 0) * 6px), 0); }
.stage.is-parallax .stage__orbits,
.stage.is-parallax .stage__glow { transition: transform .9s var(--ease-out); }

/* --------------------------------------------------------------------------
   Reveal on scroll. Só esconde quando há JS; failsafe se motion.js falhar.
   -------------------------------------------------------------------------- */
.js .reveal {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.js:not(.motion-ready) .reveal { animation: oc-reveal-failsafe .6s 2.5s both; }
.js .reveal.is-in { opacity: 1; transform: none; }

.js .service::before { transform: scaleX(0); transition: transform 1.2s var(--ease-out); }
.js .service.is-in::before { transform: scaleX(1); }
.js .services__list .service:nth-child(2) { transition-delay: .08s; }
.js .services__list .service:nth-child(3) { transition-delay: .16s; }
.js .services__list .service:nth-child(2)::before { transition-delay: .14s; }
.js .services__list .service:nth-child(3)::before { transition-delay: .28s; }

/* --------------------------------------------------------------------------
   Movimento reduzido: sem loops, deslocamentos ou atrasos. Tudo visível.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    transition-delay: 0s !important;
  }
  .loop, .loop *, .status__dot::after,
  .link-card__sweep::before, .cta::after { animation: none !important; }
  .topline__beam, .signal, .atmosphere__particles { display: none !important; }
  .js .reveal, .js .service::before { opacity: 1; transform: none; }
  .stage__orbits, .stage__glow { transform: none !important; }
  .link-card:hover { transform: none; }
}