/* =========================================================
   PRIMEIRO-CONTATO-UX01 — 2026-09-12
   Convite opcional do Prólogo. Sem alteração de layout.
   ========================================================= */

[data-action="prologue"]{
  position:relative;
  isolation:isolate;
}

[data-action="prologue"].prologue-invite-active{
  animation:prologue-invite-frame 5000ms linear both;
  animation-delay:var(--prologue-invite-delay,0ms);
}

[data-action="prologue"].prologue-invite-active::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(105deg,transparent 34%,rgba(72,231,255,.18) 49%,rgba(190,248,255,.28) 52%,transparent 67%);
  transform:translateX(-145%);
  opacity:0;
  animation:prologue-invite-sweep 5000ms linear both;
  animation-delay:var(--prologue-invite-delay,0ms);
}

[data-action="prologue"].prologue-unseen:not(.prologue-invite-active)::after,
#menuToggle.prologue-unseen::after{
  content:"";
  position:absolute;
  width:6px;
  height:6px;
  border:1px solid rgba(145,237,246,.82);
  background:rgba(72,231,255,.42);
  transform:rotate(45deg);
  pointer-events:none;
  box-shadow:0 0 5px rgba(72,231,255,.16);
}

[data-action="prologue"].prologue-unseen:not(.prologue-invite-active)::after{
  top:7px;
  right:8px;
}

#menuToggle{
  position:relative;
}

#menuToggle.prologue-unseen::after{
  top:5px;
  right:5px;
  animation:prologue-marker-in 450ms ease-out both;
}

[data-action="prologue"]:focus-visible{
  outline:2px solid #91edf6!important;
  outline-offset:3px;
}

@keyframes prologue-invite-frame{
  0%{border-color:rgba(255,255,255,.16);box-shadow:none;}
  9%{border-color:rgba(145,237,246,.62);box-shadow:0 0 6px rgba(72,231,255,.20),inset 0 0 6px rgba(72,231,255,.035);}
  27%{border-color:rgba(145,237,246,.68);box-shadow:0 0 6px rgba(72,231,255,.22),inset 0 0 6px rgba(72,231,255,.04);}
  80%{border-color:rgba(145,237,246,.46);box-shadow:0 0 5px rgba(72,231,255,.14),inset 0 0 5px rgba(72,231,255,.025);}
  100%{border-color:rgba(255,255,255,.16);box-shadow:none;}
}

@keyframes prologue-invite-sweep{
  0%,8%{opacity:0;transform:translateX(-145%);}
  9%{opacity:.85;transform:translateX(-145%);}
  27%{opacity:0;transform:translateX(145%);}
  100%{opacity:0;transform:translateX(145%);}
}

@keyframes prologue-marker-in{
  from{opacity:0;}
  to{opacity:1;}
}

@media(max-width:900px){
  /* POLIMENTO-FISICO-01/A: mantém o botão no header. A regra global
     position:relative existe apenas para ancorar o losango e não pode
     substituir o position:absolute consolidado do menu mobile. */
  #menuToggle{
    position:absolute;
    left:auto;
    right:max(12px,env(safe-area-inset-right,0px));
    top:max(10px,env(safe-area-inset-top,0px));
  }
  body:not(.menu-open) [data-action="prologue"].prologue-invite-active{
    animation:none;
    box-shadow:none;
  }
  body:not(.menu-open) [data-action="prologue"].prologue-invite-active::before{
    display:none;
  }
  body.menu-open #menuToggle.prologue-unseen::after{
    opacity:0;
    animation:none;
  }
}

@media(prefers-reduced-motion:reduce){
  [data-action="prologue"].prologue-invite-active{
    animation:none!important;
    border-color:rgba(145,237,246,.52);
    box-shadow:0 0 4px rgba(72,231,255,.12),inset 0 0 4px rgba(72,231,255,.02);
  }
  [data-action="prologue"].prologue-invite-active::before{
    display:none;
    animation:none!important;
  }
  #menuToggle.prologue-unseen::after{
    animation:none;
  }
}