/* Prévia da Impacta (armadura 3D) — fica por cima de tudo até a pessoa entrar no site */
html.im-intro-on,html.im-intro-on body{overflow:hidden}
html.im-intro-on .nav,html.im-intro-on .dock,html.im-intro-on .wa-float,html.im-intro-on .rail,html.im-intro-on .rail-m,html.im-intro-on .cursor{visibility:hidden}
/* o site esconde a seta do sistema (cursor próprio); na prévia ela volta, com a mãozinha nos botões */
html.has-cursor .im-intro,html.has-cursor .im-intro *{cursor:default}
html.has-cursor .im-intro :is(a,button),html.has-cursor .im-intro :is(a,button) *{cursor:pointer}

.im-intro{position:fixed;inset:0;z-index:3000;overflow:hidden;color:#fff;font-family:var(--font,Geist,system-ui,sans-serif);
  background:
    radial-gradient(55% 60% at 72% 42%,rgb(255 90 31 / .22),transparent 70%),
    radial-gradient(45% 50% at 85% 75%,rgb(255 0 149 / .16),transparent 70%),
    radial-gradient(50% 55% at 10% 15%,rgb(78 2 255 / .2),transparent 70%),
    #07070a;
  transition:opacity .8s cubic-bezier(.19,1,.22,1),transform .9s cubic-bezier(.19,1,.22,1)}
.im-intro::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(rgb(255 255 255 / .035) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,rgb(255 255 255 / .035) 1px,transparent 1px) 0 0/56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 75% 70% at 65% 45%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 75% 70% at 65% 45%,#000 20%,transparent 75%)}
.im-intro::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgb(7 7 10 / .92) 0%,rgb(7 7 10 / .55) 38%,transparent 62%),linear-gradient(0deg,rgb(7 7 10 / .85),transparent 40%)}
.im-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}

/* sites do portfólio passando atrás da armadura (mesmo cartão do topo do site) */
/* no computador os cartões surgem depois do texto (não passam por trás do título) */
.im-vt{position:absolute;left:0;right:0;top:var(--vt-top,30%);overflow:hidden;pointer-events:none;
  -webkit-mask-image:var(--vt-mask);mask-image:var(--vt-mask);
  --vt-mask:linear-gradient(90deg,transparent 0%,transparent 34%,#000 50%,#000 94%,transparent 100%)}
.im-vt-track{display:flex;gap:18px;width:max-content;animation:im-vt 70s linear infinite}
@keyframes im-vt{to{transform:translateX(-50%)}}
.im-vt-card{flex:none;width:var(--vt-w,340px);border:1px solid rgb(255 255 255 / .2);border-radius:6px;overflow:hidden;background:#111;box-shadow:0 30px 60px -30px rgb(0 0 0 / .9),0 0 0 1px rgb(0 0 0 / .4)}
.im-vt-bar{height:26px;display:flex;align-items:center;gap:5px;padding:0 10px;background:#141414;font-family:var(--mono,monospace);font-size:9.5px;letter-spacing:.14em;color:rgb(255 255 255 / .55)}
.im-vt-bar i{width:6px;height:6px;background:rgb(255 255 255 / .28)}
.im-vt-bar span{margin-left:auto}
.im-vt-media{position:relative;aspect-ratio:16/9;background:#0b0b0e}
.im-vt-media img,.im-vt-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.im-vt-media video{opacity:0;transition:opacity .5s}
.im-vt-media video.is-on{opacity:1}
.im-intro.is-go .im-vt{transition:opacity 1.2s .6s,filter 1.2s .6s;opacity:.35;filter:blur(2px)}
@media (prefers-reduced-motion:reduce){.im-vt-track{animation:none}}
.im-intro.is-out{opacity:0;transform:scale(1.05);pointer-events:none}

.im-top{position:absolute;z-index:2;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:22px var(--pad-x,32px)}
.im-logo{display:flex;align-items:center;gap:10px;font-family:var(--brand,"Arial Black",sans-serif);font-weight:900;font-size:17px;letter-spacing:.08em}
.im-logo b{margin-left:-.25em;font-weight:400;opacity:.62}
.im-logo i{width:30px;height:30px;flex:none;font-style:normal;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22lg-mark%22%20x1%3D%2210%22%20y1%3D%2238%22%20x2%3D%2238%22%20y2%3D%2210%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%234E02FF%22%2F%3E%3Cstop%20offset%3D%22.5%22%20stop-color%3D%22%23FF0095%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23FF8400%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D%2248%22%20height%3D%2248%22%20rx%3D%2211%22%20fill%3D%22%230A0A0A%22%2F%3E%3Crect%20x%3D%22.5%22%20y%3D%22.5%22%20width%3D%2247%22%20height%3D%2247%22%20rx%3D%2210.5%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-opacity%3D%22.14%22%2F%3E%3Cpath%20d%3D%22M10%2018v-8h8M30%2010h8v8M38%2030v8h-8M18%2038h-8v-8%22%20fill%3D%22none%22%20stroke%3D%22url(%23lg-mark)%22%20stroke-width%3D%222.8%22%2F%3E%3Crect%20x%3D%2220.5%22%20y%3D%2215%22%20width%3D%227%22%20height%3D%2218%22%20rx%3D%221%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E") center/100% 100% no-repeat;font-size:0;color:transparent}
.im-loc{font-family:var(--mono,monospace);font-size:11px;letter-spacing:.2em;color:rgb(255 255 255 / .6)}

.im-panel{position:absolute;z-index:2;left:var(--pad-x,32px);bottom:clamp(28px,6vh,64px);width:min(600px,calc(100% - 2 * var(--pad-x,32px)));display:grid;gap:18px;transition:opacity .5s,transform .6s cubic-bezier(.19,1,.22,1)}
.im-orig{display:flex;align-items:center;gap:10px;margin:0;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:rgb(255 255 255 / .8)}
.im-orig b{font-family:var(--brand,"Arial Black",sans-serif);font-weight:900;font-size:20px;letter-spacing:0;background:linear-gradient(90deg,#FF8400,#FF0095);-webkit-background-clip:text;background-clip:text;color:transparent}
.im-title{margin:0;font-weight:600;font-size:clamp(40px,5.6vw,88px);line-height:.92;letter-spacing:-.055em}
.im-title em{font-style:normal;background:linear-gradient(90deg,#FF8400,#FF0095 55%,#A600FF);-webkit-background-clip:text;background-clip:text;color:transparent}
.im-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0;font-size:14px;color:rgb(255 255 255 / .72)}
.im-meta b{color:#46d369;font-weight:600}
.im-meta .hd{padding:1px 6px;border:1px solid rgb(255 255 255 / .45);border-radius:3px;font-size:11px;font-weight:600}
.im-desc{margin:0;max-width:52ch;font-size:clamp(15px,1.2vw,18px);line-height:1.5;color:rgb(255 255 255 / .82)}
.im-ctas{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.im-enter[disabled]{opacity:.55;pointer-events:none}
.im-intro.is-ready .im-enter{animation:im-pulse 2.2s ease-in-out infinite}
@keyframes im-pulse{50%{box-shadow:0 0 32px #f60a,0 0 12px #6100b788}}
.im-plans{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 22px;border-radius:4px;background:rgb(255 255 255 / .12);border:1px solid rgb(255 255 255 / .18);color:#fff;text-decoration:none;font-weight:600;font-size:14px;letter-spacing:.06em;text-transform:uppercase;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .3s}
.im-plans:hover{background:rgb(255 255 255 / .2)}
.im-load{display:grid;gap:8px;max-width:420px;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgb(255 255 255 / .62)}
.im-load span{display:flex;justify-content:space-between}
.im-load b{color:#fff;font-weight:500}
.im-load em{font-style:normal}
.im-load p{margin:0;height:2px;background:rgb(255 255 255 / .14);overflow:hidden}
.im-load i{display:block;height:100%;background:linear-gradient(90deg,#4E02FF,#FF0095,#FF8400);transform:scaleX(0);transform-origin:0 50%}
.im-intro.is-ready .im-load{opacity:0;visibility:hidden;max-height:0;overflow:hidden;margin-top:-12px;transition:opacity .4s,max-height .4s,margin .4s,visibility 0s .4s}
.im-cast{margin:0;font-size:12px;color:rgb(255 255 255 / .5)}

.im-sound{position:absolute;z-index:2;right:var(--pad-x,32px);bottom:clamp(28px,6vh,64px);display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 14px;border:1px solid rgb(255 255 255 / .22);border-radius:999px;background:rgb(255 255 255 / .06);color:#fff;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.im-sound i{width:7px;height:7px;border-radius:50%;background:#46d369;box-shadow:0 0 10px #46d369}
.im-sound[aria-pressed=false] i{background:#666;box-shadow:none}

.im-hud{position:absolute;z-index:2;top:15%;right:var(--pad-x,32px);display:grid;gap:8px;font-family:var(--mono,monospace);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgb(255 255 255 / .45);text-align:right}
.im-hud b{color:#FF8a3a;font-weight:500}

/* saída: os olhos estouram a tela */
.im-flash{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(circle at 70% 40%,#fff 0%,#ffd0a0 18%,#ff5a1f 45%,#ff0095 75%,#4e02ff 100%)}
.im-intro.is-flash .im-flash{animation:im-flash .9s ease-out forwards}
@keyframes im-flash{0%{opacity:0}25%{opacity:1}100%{opacity:0}}
.im-intro.is-go .im-panel,.im-intro.is-go .im-sound,.im-intro.is-go .im-hud{opacity:0;transform:translateY(16px);pointer-events:none}

/* celular: armadura no alto, texto embaixo */
@media (max-width:899px),(max-aspect-ratio:19/20){
  .im-intro::after{background:linear-gradient(0deg,rgb(7 7 10 / .97) 0%,rgb(7 7 10 / .85) 38%,transparent 62%)}
  .im-top{padding:16px}
  .im-panel{left:16px;right:16px;width:auto;bottom:max(18px,env(safe-area-inset-bottom));gap:12px}
  .im-title{font-size:clamp(34px,9.6vw,52px)}
  .im-meta{font-size:12.5px}
  .im-desc{font-size:14.5px}
  .im-ctas{display:grid;grid-template-columns:1fr;gap:10px}
  .im-ctas .cta{width:100%}
  .im-ctas .cta-label{flex:1}
  .im-plans{justify-content:center;min-height:48px}
  .im-sound{top:14px;right:16px;bottom:auto;min-height:34px;padding:0 12px}
  .im-loc,.im-hud,.im-cast{display:none}
  .im-vt{--vt-top:20%;--vt-w:210px;--vt-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
  .im-vt-track{gap:12px;animation-duration:55s}
  .im-vt-bar{height:20px;font-size:8px}
}
@media (max-width:899px) and (max-height:700px){.im-desc{display:none}.im-title{font-size:32px}}

/* canto da prévia: seletor de idioma (no lugar do "Som ligado") + som em botão redondo */
.im-corner{position:absolute;z-index:3;right:var(--pad-x,32px);bottom:clamp(28px,6vh,64px);display:flex;align-items:center;gap:8px;transition:opacity .4s,transform .4s}
.im-corner .im-sound{position:static;width:40px;height:40px;min-height:40px;padding:0;justify-content:center}
.im-corner .im-sound span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.im-intro.is-go .im-corner{opacity:0;transform:translateY(16px);pointer-events:none}
.im-corner .lang-menu{top:auto;bottom:calc(100% + 8px)}
@media (max-width:899px),(max-aspect-ratio:19/20){
  .im-corner{top:14px;right:16px;bottom:auto}
  .im-corner .im-sound{width:36px;height:36px;min-height:36px}
  .im-corner .lang-menu{top:calc(100% + 8px);bottom:auto}
}
/* celular estreito: "IMPACTA BRANDING" + som + idioma cabem na mesma linha */
@media (max-width:420px){
  .im-logo{gap:8px;font-size:13px;letter-spacing:.06em}
  .im-logo i{width:26px;height:26px}
  .im-corner{gap:6px;right:12px}
  .im-corner .im-sound{width:32px;height:32px;min-height:32px}
  .im-corner .lang-btn{height:32px;padding:0 9px 0 8px;gap:6px}
  .im-corner .lang-car{display:none}
}