/* ═══ Como Novo · intro + menu hexagonal ═══════════════════════════
   Prefixo cni- em tudo, para não colidir com o CSS existente.       */

:root{
  --cni-beam:#37C4FF;
  --cni-void:#04070C;
  --cni-clear:#E9EEF4;
  --cni-mut:#78848F;
  --cni-steel:#18222E;
}
body.cni-bloqueado{overflow:hidden}

/* ── palco da intro ── */
.cni-intro{position:fixed;inset:0;z-index:9000;background:var(--cni-void);
  display:flex;align-items:center;justify-content:center}
.cni-intro[hidden]{display:none}

.cni-logo{position:relative;width:min(76vw,450px);aspect-ratio:785/526;
  transform-origin:center;overflow:visible;will-change:transform}
.cni-logo.cni-pousado{width:100%}

/* facetas: recebem o vídeo e depois a cor */
.cni-fc{position:absolute;inset:0;opacity:0;transition:opacity .3s ease}
.cni-fc.cni-live{opacity:1}
.cni-media{position:absolute;inset:0;overflow:hidden;background:#050C13}
.cni-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.86) contrast(1.1)}
.cni-solid{position:absolute;inset:0;opacity:0;transition:opacity .45s cubic-bezier(.4,0,.2,1);
  background:var(--cni-logo) center/100% 100% no-repeat}
.cni-fc.cni-set .cni-solid{opacity:1}
.cni-fc.cni-flash{animation:cniFlash .42s cubic-bezier(.2,0,.4,1)}
@keyframes cniFlash{0%{filter:brightness(4) saturate(.1)}55%{filter:brightness(1.5)}100%{filter:none}}

/* logótipo completo, revelado pela limpeza */
.cni-full{position:absolute;inset:0;z-index:4;background:var(--cni-logo) center/100% 100% no-repeat;
  clip-path:inset(0 calc(100% - var(--rx,0%)) 0 0)}
.cni-sweep{position:absolute;top:-8%;bottom:-8%;left:var(--rx,0%);width:3px;translate:-50% 0;z-index:5;
  background:linear-gradient(180deg,transparent,#fff 10%,#fff 90%,transparent);
  box-shadow:0 0 16px 3px #fff,0 0 60px 14px var(--cni-beam),0 0 130px 40px rgba(55,196,255,.4);
  opacity:0;transition:opacity .2s}
.cni-intro.cni-cleaning .cni-sweep{opacity:1}
.cni-intro.cni-done .cni-sweep{opacity:0}
.cni-intro.cni-cleaning .cni-logo{animation:cniPulse .9s cubic-bezier(.3,0,.3,1)}
@keyframes cniPulse{0%{transform:scale(1)}30%{transform:scale(1.035)}100%{transform:scale(1)}}

/* contorno do C e do N */
.cni-wire{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:6}
.cni-wire path{fill:none;stroke-linejoin:round;stroke-linecap:round}
.cni-wire .cni-line{stroke:var(--cni-beam);stroke-width:3.6;opacity:.95;
  filter:drop-shadow(0 0 8px rgba(55,196,255,.85))}
.cni-wire .cni-head{stroke:#fff;stroke-width:9;opacity:0;
  filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 28px var(--cni-beam)) drop-shadow(0 0 64px var(--cni-beam))}
.cni-intro.cni-lit .cni-wire .cni-line{filter:drop-shadow(0 0 16px var(--cni-beam)) drop-shadow(0 0 42px rgba(55,196,255,.75));
  transition:filter .5s ease}
.cni-intro.cni-cleaning .cni-wire .cni-line{opacity:0;transition:opacity .6s ease}

/* visor: tela grande sobre as letras */
.cni-viewers{position:absolute;inset:0;pointer-events:none;z-index:20}
.cni-vw{position:absolute;left:50%;top:50%;width:min(76vw,490px);aspect-ratio:1;
  translate:-50% -50%;transform-origin:50% 50%;overflow:hidden;border-radius:16px;background:#050C13;
  opacity:0;clip-path:inset(49.5% 0 49.5% 0);filter:brightness(2.2);
  box-shadow:0 0 0 1px rgba(55,196,255,.6),0 0 0 6px rgba(4,7,12,.9),
             0 34px 90px -24px rgba(0,0,0,.95),0 0 90px rgba(55,196,255,.24);
  transition:opacity .22s ease,clip-path .42s cubic-bezier(.16,.9,.2,1),
             transform .58s cubic-bezier(.6,0,.14,1),filter .5s ease,border-radius .5s ease}
.cni-vw video{width:100%;height:100%;object-fit:cover;filter:saturate(.86) contrast(1.1)}
.cni-vw::before{content:"";position:absolute;left:0;right:0;top:50%;height:3px;translate:0 -50%;z-index:3;
  background:#fff;box-shadow:0 0 20px 5px var(--cni-beam),0 0 56px 14px rgba(55,196,255,.6);
  opacity:0;transition:opacity .22s}
.cni-vw.cni-enter{opacity:1}
.cni-vw.cni-enter::before{opacity:1}
.cni-vw.cni-on{clip-path:inset(0 0 0 0);filter:brightness(1)}
.cni-vw.cni-on::before{opacity:0}
.cni-vw.cni-exit{border-radius:4px}
.cni-vw.cni-off{opacity:0;filter:blur(10px) brightness(1.9);
  transition:opacity .3s ease,filter .3s ease,transform .58s cubic-bezier(.6,0,.14,1)}

.cni-skip{position:absolute;bottom:22px;left:50%;translate:-50% 0;z-index:30;
  font:400 10px/1 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cni-mut);background:none;border:0;cursor:pointer;
  opacity:0;transition:opacity .4s .7s}
.cni-run .cni-skip{opacity:.6}
.cni-skip:hover{color:var(--cni-clear)}

/* ── o logótipo na barra de topo: é o botão do menu ── */
.cni-brand{position:relative;width:clamp(78px,11vw,104px);aspect-ratio:785/526;
  opacity:0;transition:opacity .35s ease;background:none;border:0;padding:0;flex:none}
.cni-brand.cni-visivel{opacity:1}
.cni-brand .cni-wire,.cni-brand .cni-viewers,.cni-brand .cni-sweep,.cni-brand .cni-fc{display:none}
.cni-brand .cni-full{clip-path:none}


@media(max-width:560px){
  .cni-brand{width:88px}
}
@media(prefers-reduced-motion:reduce){
  .cni-intro *{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
