/* ============================================================
   Nexo HF — tela de carregamento + transição entre páginas
   ============================================================ */

/* ---------- entrada da página ----------
   Só opacity: transform no body viraria containing block
   dos elementos position:fixed (header, loader, botão WhatsApp). */
body{
  animation:nexo-page-in .45s ease both;
  transition:opacity .22s ease;
}
@keyframes nexo-page-in{
  from{opacity:0}
  to{opacity:1}
}
/* saída (classe aplicada pelo loader.js antes de navegar) */
html.page-exit body{opacity:0}

/* ---------- cortina de transição entre páginas ---------- */
.page-wipe{
  position:fixed;inset:0;z-index:9998;pointer-events:none;
  background:#050A12;border-top:3px solid #2BE3C6;
  box-shadow:0 -18px 60px rgba(43,227,198,.25);
  transform:translateY(103%);
  display:flex;align-items:center;justify-content:center;
}
.page-wipe img{width:min(200px,50vw);height:auto;opacity:.9}
/* subindo para cobrir (saída da página atual) */
html.wipe-in .page-wipe{
  transform:translateY(0);
  transition:transform .38s cubic-bezier(.65,0,.35,1);
}
/* cobrindo no instante em que a página nova abre */
html.wipe-cover .page-wipe{transform:translateY(0);transition:none}
/* saindo para cima (revela a página nova) */
html.wipe-out .page-wipe{
  transform:translateY(-103%);
  transition:transform .45s .05s cubic-bezier(.65,0,.35,1);
}
@media (prefers-reduced-motion:reduce){
  .page-wipe{display:none}
}

/* ---------- loader ---------- */
#loader{
  position:fixed;inset:0;z-index:9999;
  background:#030509;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .5s ease,visibility .5s ease;
}
#loader.done{opacity:0;visibility:hidden;pointer-events:none}
html.no-loader #loader{display:none}

.loader-in{display:flex;flex-direction:column;align-items:center;gap:24px}
.loader-in svg{width:72px;height:72px;overflow:visible}

/* logo oficial (imagem) no header, rodapé e loader */
.logo .logo-img{height:52px;width:auto;display:block}
footer .logo .logo-img{height:42px}
.loader-logo{width:min(300px,72vw);height:auto;animation:nexo-breathe 1.8s ease-in-out infinite}
@keyframes nexo-breathe{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(.97)}}

/* desenho da linha do logo */
.loader-in svg path{
  stroke-dasharray:160;stroke-dashoffset:160;
  animation:nexo-draw 1.1s ease-out forwards;
}
@keyframes nexo-draw{to{stroke-dashoffset:0}}

/* pulso dos nós */
.loader-in svg circle{
  transform-origin:center;transform-box:fill-box;
  animation:nexo-pulse 1.4s ease-in-out infinite;
}
.loader-in svg circle:nth-of-type(2){animation-delay:.2s}
.loader-in svg circle:nth-of-type(3){animation-delay:.4s}
@keyframes nexo-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.25);opacity:.75}}

.loader-name{
  font-family:'Unbounded','Segoe UI',system-ui,sans-serif;
  font-weight:700;font-size:.95rem;letter-spacing:.14em;color:#EAF2F8;
}
.loader-name b{color:#2BE3C6}
.loader-sub{
  font-family:'IBM Plex Mono',ui-monospace,monospace;
  font-size:.58rem;letter-spacing:.42em;text-transform:uppercase;color:#8C9BAD;
  margin-top:-12px;
}
.loader-bar{
  width:170px;height:2px;background:rgba(140,170,210,.18);
  border-radius:2px;overflow:hidden;margin-top:6px;
}
.loader-bar i{
  display:block;height:100%;width:100%;background:#2BE3C6;
  transform:translateX(-100%);
  animation:nexo-fill 1s .15s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes nexo-fill{to{transform:none}}

/* ---------- dropdown de soluções (desktop) ---------- */
.nav-drop{position:relative;display:flex;align-items:center}
.nav-drop .seta{font-size:.6em;color:#2BE3C6}
.nav-drop-menu{
  position:absolute;top:calc(100% + 14px);left:50%;
  transform:translate(-50%,8px);min-width:270px;
  background:#080D17;border:1px solid rgba(140,170,210,.28);
  padding:10px;display:flex;flex-direction:column;z-index:120;
  opacity:0;visibility:hidden;
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.9);
}
.nav-drop-menu::before{content:"";position:absolute;top:-16px;left:0;right:0;height:16px}
.nav-drop:hover .nav-drop-menu,
.nav-drop:focus-within .nav-drop-menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.nav-drop-menu a{
  display:flex;align-items:baseline;gap:12px;
  padding:11px 14px;text-decoration:none;color:#EAF2F8;
  font-weight:700;font-size:.88rem;transition:background .15s,color .15s;
}
.nav-drop-menu a:hover{background:rgba(43,227,198,.08);color:#2BE3C6}
.nav-drop-menu a span{font-family:'IBM Plex Mono',monospace;font-size:.62rem;color:#2BE3C6;letter-spacing:.08em}
.nav-drop-menu .todas{
  border-top:1px solid rgba(140,170,210,.13);margin-top:8px;
  font-family:'IBM Plex Mono',monospace;font-size:.68rem;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;color:#8C9BAD;
}
@media (max-width:960px){.nav-drop-menu{display:none}}

/* ---------- menu mobile ---------- */
.nav-burger{
  display:none;width:44px;height:44px;flex:none;
  border:1px solid rgba(140,170,210,.28);background:transparent;cursor:pointer;
  align-items:center;justify-content:center;flex-direction:column;gap:5px;
}
.nav-burger i{display:block;width:20px;height:2px;background:#EAF2F8;transition:transform .25s,opacity .25s}
.nav-burger[aria-expanded="true"] i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.nav-burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width:960px){
  nav.main a.nav-link{display:none !important}
  .nav-burger{display:flex}
}
.mob-menu{
  position:fixed;inset:0;z-index:95;background:rgba(3,5,9,.97);
  display:flex;flex-direction:column;justify-content:center;gap:4px;
  padding:100px clamp(28px,10vw,72px) 60px;
  opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;
}
.mob-menu.open{opacity:1;visibility:visible}
.mob-menu a{
  font-family:'Unbounded','Segoe UI',system-ui,sans-serif;font-weight:700;
  font-size:clamp(1.3rem,6.5vw,2rem);text-transform:uppercase;
  color:#EAF2F8;text-decoration:none;padding:12px 0;
  border-bottom:1px solid rgba(140,170,210,.13);
  display:flex;align-items:baseline;gap:16px;
}
.mob-menu a:hover{color:#2BE3C6}
.mob-menu a .n{font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:#2BE3C6;letter-spacing:.1em}
.mob-menu a.sub{
  font-size:clamp(.85rem,4vw,1.05rem);font-weight:600;text-transform:none;
  padding:8px 0 8px 34px;color:#8C9BAD;border-bottom:none;
}
.mob-menu a.sub:hover{color:#2BE3C6}
body.menu-open{overflow:hidden}

/* movimento reduzido: sem animações, o JS esconde o loader no load */
@media (prefers-reduced-motion:reduce){
  body{animation:none;transition:none}
  html.page-exit body{opacity:1;transform:none}
  .loader-in svg path{animation:none;stroke-dashoffset:0}
  .loader-in svg circle{animation:none}
  .loader-logo{animation:none}
  .loader-bar i{animation:none;transform:none}
}