/* =====================================================================
   site.css — estilos compartilhados injetados em todas as páginas
   ===================================================================== */

/* Bloqueia scroll horizontal em todas as páginas — safety net global.
   Usa `clip` em vez de `hidden` pra NÃO quebrar `position:sticky` dos
   descendentes (sticky precisa que o ancestral não crie contexto de scroll). */
html { overflow-x: clip !important; }
body { overflow-x: clip !important; }

/* =====================================================================
   NAV BURGER — DESIGN ÚNICO E UNIVERSAL (todas as páginas)
   ===================================================================== */
.nav-burger {
  display: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
  padding: 0;
}
.nav-burger svg {
  width: 22px;
  height: 22px;
  stroke: #fff;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
}

/* Burger mobile breakpoint + esconde links/CTA universal */
@media (max-width: 991px) {
  .nav-links, .nav-cta, .nav-social { display: none; }
  .nav-burger { display: inline-flex; }
}

/* =====================================================================
   NAV SOCIAL — ícones de redes sociais à direita do CTA "Vamos conversar"
   ===================================================================== */
.nav-social{
  display:inline-flex;align-items:center;gap:6px;
  margin-left:12px;
}
.nav-social .so{
  width:36px;height:36px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--mi-grafite);
  background:transparent;border:1px solid rgba(11,11,20,.10);
  transition:color .25s ease,background-color .25s ease,border-color .25s ease,transform .25s ease;
}
.nav-social .so:hover{
  color:#fff;background:var(--mi-cobalto);border-color:transparent;
  transform:translateY(-1px);
}
.nav-social .so svg{
  width:15px;height:15px;fill:currentColor;display:block;
  transform-origin:center;
  transition:transform .25s cubic-bezier(.22,1,.36,1);
}
/* Loops Lottie-like reaproveitando os keyframes do footer */
.nav-social .so[data-net="ig"] svg{ animation:soIgPulse 5.2s ease-in-out infinite .8s; }
.nav-social .so[data-net="li"] svg{ animation:soLiBounce 5.6s ease-in-out infinite 1.6s; }
.nav-social .so[data-net="fb"] svg{ animation:soFbPulse 5.4s ease-in-out infinite 2.4s; }
.nav-social .so[data-net="tk"] svg{ animation:soTkWiggle 5.8s ease-in-out infinite 3.2s; }
.nav-social .so:hover svg{
  animation-duration:.6s;animation-iteration-count:1;animation-delay:0s;
}
@media (prefers-reduced-motion: reduce){
  .nav-social .so svg{ animation:none !important; }
}

/* Páginas com nav escuro (home: hero escuro + scrolled em rgba(11,11,20,.78))
   pedem ícones brancos pra contrastar. Demais páginas usam o grafite default,
   que funciona tanto no topo (sobre fundo claro) quanto no scrolled (rgba branco). */
body.home .nav-social .so{
  color:rgba(255,255,255,.85);
  border-color:rgba(255,255,255,.22);
}
body.home .nav-social .so:hover{
  color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.35);
}
@media (max-width: 991px){
  .nav-social{ display:none !important; }
}

/* =====================================================================
   MOBILE NAV — páginas claras
   Top: fundo cobalto + elementos brancos
   Scrolled (sticky): fundo branco + elementos azuis (cobalto) pra leitura
   (Home com hero escuro tem override próprio)
   ===================================================================== */
@media (max-width: 991px) {
  .nav {
    background: var(--mi-cobalto);
    border-bottom-color: rgba(0,0,0,.08);
  }
  .nav-logo img {
    filter: brightness(0) invert(1);
    transition: filter .25s ease;
  }
  .nav-burger {
    background: rgba(255,255,255,.18);
    border-color: rgba(255,255,255,.30);
  }
  .nav-burger svg {
    stroke: #fff !important;
  }

  /* Estado SCROLLED: fundo branco + logo e burger em cobalto */
  .nav.scrolled {
    background: rgba(255,255,255,.96);
    backdrop-filter: saturate(160%) blur(14px);
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    box-shadow: 0 4px 18px rgba(0,0,0,.10);
    border-bottom-color: rgba(11,11,20,.06);
  }
  .nav.scrolled .nav-logo img {
    filter: none;  /* logo volta às cores originais (cobalto + limão) */
  }
  .nav.scrolled .nav-burger {
    background: rgba(0,161,249,.10);
    border-color: rgba(0,161,249,.26);
  }
  .nav.scrolled .nav-burger svg {
    stroke: var(--mi-cobalto) !important;
  }
}

/* =====================================================================
   MOBILE SERVICES CASCADE — accordion inline ao tocar em "Serviços"
   ===================================================================== */
.nav-services-mobile { display: none; }

@media (max-width: 991px) {
  /* Esconde o mega menu desktop no mobile */
  .mega { display: none !important; }

  /* Accordion mobile (gerado por site.js) */
  .nav-services-mobile {
    display: block;
    overflow: hidden;
    max-height: 0;
    transition: max-height .35s ease, padding .35s ease;
    padding: 0;
    margin-top: 0;
  }
  .nav-item-services.expanded .nav-services-mobile {
    max-height: 720px;
    padding: 6px 0 8px;
    margin-top: 4px;
  }
  .nav-services-mobile a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 18px 11px 22px;
    font-size: 14px;
    font-weight: 500;
    color: rgba(255,255,255,.82);
    border-radius: 10px;
    line-height: 1.3;
    transition: background-color .2s ease, color .2s ease;
  }
  .nav-services-mobile a:hover,
  .nav-services-mobile a:focus-visible {
    background: rgba(0,161,249,.10);
    color: #fff;
  }
  /* Ícone à esquerda de cada item */
  .nav-services-mobile .nav-svc-ico {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(0,161,249,.14);
    color: var(--mi-cobalto);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .2s ease, color .2s ease;
  }
  .nav-services-mobile .nav-svc-ico svg {
    width: 16px;
    height: 16px;
    display: block;
  }
  .nav-services-mobile a:hover .nav-svc-ico,
  .nav-services-mobile a:focus-visible .nav-svc-ico {
    background: var(--mi-cobalto);
    color: #fff;
  }
  .nav-services-mobile .nav-svc-name {
    flex: 1;
    min-width: 0;
  }
  .nav-services-mobile a.see-all {
    color: var(--mi-limao);
    font-weight: 600;
    font-family: var(--mono, monospace);
    font-size: 11px;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-top: 6px;
    border-top: 1px solid rgba(255,255,255,.08);
    padding: 14px 18px 12px 22px;
    justify-content: center;
  }
  .nav-services-mobile a.see-all:hover {
    background: rgba(245,210,58,.08);
  }
  /* "Serviços" no mobile vira cursor de toggle (sem cara de link) */
  .nav-item-services > a[role="button"] {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  /* Chevron animado no link "Serviços" */
  .nav-item-services > a::after {
    margin-left: auto;
  }
  .nav-item-services.expanded > a::after {
    transform: rotate(-135deg) translateY(0);
  }
}

/* =====================================================================
   BURGER ANIMATION — 3 linhas → X (inspirado em shadcn animated burger)
   ===================================================================== */
.nav-burger svg path {
  transform-origin: center;
  transition: transform .3s cubic-bezier(.5,.85,.25,1.1);
}
.nav-burger svg path.bl-top { transform: translateY(-7px); }
.nav-burger svg path.bl-mid { transition-timing-function: cubic-bezier(.5,.85,.25,1.8); }
.nav-burger svg path.bl-bot { transform: translateY(7px); }

.nav-burger[aria-expanded="true"] svg path.bl-top { transform: rotate(315deg); }
.nav-burger[aria-expanded="true"] svg path.bl-mid { transform: rotate(45deg); }
.nav-burger[aria-expanded="true"] svg path.bl-bot { transform: rotate(135deg); }

/* ===================== MEGA MENU ===================== */
.nav-links{position:relative;}
.nav-item-services{position:relative;}
.nav-item-services > a{display:inline-flex;align-items:center;gap:6px;}
.nav-item-services > a::after{
  content:"";width:8px;height:8px;border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);
  transition:transform .25s ease;opacity:.7;
}
.nav-item-services.open > a::after{transform:rotate(-135deg) translateY(0);}

.mega{
  position:fixed;left:50%;top:90px;
  transform:translateX(-50%) translateY(-8px);
  width:min(960px, calc(100vw - 32px));
  background:rgba(11,11,20,.92);
  backdrop-filter:saturate(160%) blur(22px);
  -webkit-backdrop-filter:saturate(160%) blur(22px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  padding:24px;
  box-shadow:0 24px 60px rgba(0,0,0,.5);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .25s ease, transform .25s ease, visibility .25s;
  z-index:90;
}
.nav.scrolled ~ .mega,.nav.scrolled .mega{top:74px;}
.mega.open{
  opacity:1;visibility:visible;pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}
.mega-grid{
  display:grid;grid-template-columns:repeat(3, 1fr);gap:8px;
}
.mega-item{
  display:flex;align-items:flex-start;gap:14px;
  padding:14px;border-radius:14px;
  text-decoration:none;color:#fff;
  transition:background-color .2s ease, transform .2s ease;
}
.mega-item:hover{background:rgba(0,161,249,.10);transform:translateX(2px);}
.mega-icon{
  flex-shrink:0;width:42px;height:42px;border-radius:10px;
  background:rgba(255,255,255,.06);
  display:flex;align-items:center;justify-content:center;
  color:var(--mi-cobalto);
  transition:background-color .2s ease, color .2s ease;
}
.mega-item:hover .mega-icon{background:var(--mi-cobalto);color:#fff;}
.mega-icon svg{width:20px;height:20px;}
.mega-text{display:flex;flex-direction:column;gap:2px;min-width:0;}
.mega-title{
  font-family:var(--display, 'Source Sans 3'), sans-serif;
  font-weight:600;font-size:14px;line-height:1.2;color:#fff;
}
.mega-desc{
  font-family:var(--sans, 'Inter'), sans-serif;
  font-size:12px;line-height:1.4;color:rgba(247,247,245,.55);
}
.mega-foot{
  margin-top:18px;padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  font-family:var(--mono, 'JetBrains Mono'), monospace;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
}
.mega-foot > span{color:var(--mi-celeste, #4DBEFF);}
.mega-foot a{
  color:var(--mi-limao, #F5D23A);
  display:inline-flex;align-items:center;gap:8px;
}
.mega-foot a:hover{opacity:.8;}
.mega-foot a svg{width:14px;height:14px;stroke:currentColor;fill:none;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  transition:transform .2s ease;}
.mega-foot a:hover svg{transform:translateX(3px);}

@media (max-width:991px){
  .mega{display:none !important;}
}

/* ===================== MOBILE MENU OVERLAY ===================== */
@media (max-width:991px){
  .nav-links.open{
    display:flex !important;
    position:fixed;top:72px;right:16px;left:16px;
    flex-direction:column;gap:4px;align-items:stretch;
    background:rgba(11,11,20,.96);
    backdrop-filter:saturate(160%) blur(18px);
    border:1px solid rgba(255,255,255,.08);
    border-radius:18px;
    padding:14px;z-index:85;
    box-shadow:0 20px 48px rgba(0,0,0,.5);
  }
  .nav-links.open a{
    padding:14px 18px;color:#fff;
    border-radius:10px;
  }
  .nav-links.open a:hover{background:rgba(0,161,249,.14);}
  body.menu-open{overflow:hidden;}
}

/* ===================== ACTIVE NAV LINK ===================== */
.nav-links a.is-active{
  color:#fff;background:rgba(0,161,249,.12);
}

/* =====================================================================
   SOCIAL ICONS — sólidos & monocromáticos com animações tipo Lottie
   Regra única e canônica (com !important pra blindar contra cache antigo).
   ===================================================================== */
.foot .social svg,
.foot .social .so svg,
.foot .social a[data-net] svg{
  width:16px !important;
  height:16px !important;
  fill:currentColor !important;
  stroke:none !important;
  transform-origin:center;
  transition:transform .25s cubic-bezier(.22,1,.36,1);
  display:block;
}

/* Loops Lottie-like: cada rede com sua personalidade, com pulso breve a cada ~5s */
.foot .social .so[data-net="ig"] svg,
.links-social .so[data-net="ig"] svg{
  animation:soIgPulse 5.2s ease-in-out infinite .8s;
}
.foot .social .so[data-net="li"] svg,
.links-social .so[data-net="li"] svg{
  animation:soLiBounce 5.6s ease-in-out infinite 1.6s;
}
.foot .social .so[data-net="fb"] svg,
.links-social .so[data-net="fb"] svg{
  animation:soFbPulse 5.4s ease-in-out infinite 2.4s;
}
.foot .social .so[data-net="tk"] svg,
.links-social .so[data-net="tk"] svg{
  animation:soTkWiggle 5.8s ease-in-out infinite 3.2s;
}

/* Hover energiza mais forte */
.foot .social .so:hover svg,
.links-social .so:hover svg{
  animation-duration:.6s;
  animation-iteration-count:1;
  animation-delay:0s;
}

@keyframes soIgPulse{
  0%, 88%, 100% { transform:scale(1); }
  91% { transform:scale(1.18) rotate(-4deg); }
  95% { transform:scale(.94) rotate(2deg); }
  98% { transform:scale(1.06); }
}
@keyframes soLiBounce{
  0%, 88%, 100% { transform:translateY(0); }
  91% { transform:translateY(-3px); }
  94% { transform:translateY(1px); }
  97% { transform:translateY(-1px); }
}
@keyframes soFbPulse{
  0%, 88%, 100% { transform:scale(1); }
  92% { transform:scale(1.15); }
  96% { transform:scale(.96); }
}
@keyframes soTkWiggle{
  0%, 86%, 100% { transform:rotate(0); }
  89% { transform:rotate(-12deg); }
  92% { transform:rotate(10deg); }
  95% { transform:rotate(-5deg); }
  98% { transform:rotate(2deg); }
}

@media (prefers-reduced-motion: reduce){
  .foot .social .so svg,
  .foot .social a[data-net] svg,
  .links-social .so svg{
    animation:none !important;
  }
}

/* =====================================================================
   FOOTER (markup em /partials/footer.html — estilos canônicos aqui)
   ===================================================================== */
.foot{background:var(--mi-carvao);color:var(--mi-prata);}
.foot-main{padding:80px 0 36px;}

/* ---- Newsletter "Antídoto para o óbvio" (acima do rodapé principal) ---- */
.foot-newsletter{
  position:relative;overflow:hidden;
  background:var(--mi-branco);
  border-bottom:1px solid rgba(11,11,20,.08);
  padding:96px 0;
  color:var(--mi-carvao);
}
.foot-newsletter::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(60% 80% at 12% 50%, rgba(0,161,249,.07), transparent 70%),
    radial-gradient(40% 60% at 88% 100%, rgba(245,210,58,.10), transparent 70%);
}
.foot-newsletter > .shell{position:relative;z-index:1;}
.foot-newsletter-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:64px;align-items:center;
}
.foot-newsletter-eyebrow{
  display:inline-block;font-family:var(--mono);font-size:12px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--mi-cobalto);
  margin-bottom:18px;
}
.foot-newsletter-title{
  font-family:var(--display);font-weight:700;
  font-size:clamp(30px,3vw,46px);line-height:1.1;letter-spacing:-0.022em;
  color:var(--mi-carvao);margin:0 0 18px;
}
.foot-newsletter-sub{
  font-size:15px;line-height:1.6;color:var(--mi-pewter);margin:0;max-width:540px;
}
.foot-newsletter-text .foot-newsletter-form{margin-top:32px;max-width:560px;}
.foot-newsletter-vh{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.foot-newsletter-row{
  display:flex;align-items:stretch;gap:8px;
  background:rgba(11,11,20,.035);
  border:1px solid rgba(11,11,20,.10);
  border-radius:100px;
  padding:6px 6px 6px 8px;
  transition:border-color .2s,background-color .2s;
}
.foot-newsletter-row:focus-within{
  border-color:var(--mi-cobalto);
  background:rgba(0,161,249,.05);
  box-shadow:0 0 0 4px rgba(0,161,249,.12);
}
.foot-newsletter-row input[type="email"]{
  flex:1;min-width:0;
  background:transparent;border:0;outline:0;
  padding:14px 14px;font-size:15px;color:var(--mi-carvao);font-family:var(--sans);
}
.foot-newsletter-row input[type="email"]::placeholder{color:rgba(11,11,20,.40);}
/* Anula o fundo branco/amarelo do autofill — mantém o campo na cor do row */
.foot-newsletter-row input:-webkit-autofill,
.foot-newsletter-row input:-webkit-autofill:hover,
.foot-newsletter-row input:-webkit-autofill:focus,
.foot-newsletter-row input:-webkit-autofill:active{
  -webkit-text-fill-color:var(--mi-carvao) !important;
  caret-color:var(--mi-carvao) !important;
  transition:background-color 600000s ease-in-out 0s, color 600000s ease-in-out 0s !important;
  background-color:transparent !important;
}
.foot-newsletter-btn{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--mi-cobalto);color:#fff;
  font-family:var(--mono);font-size:13px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  padding:14px 22px;border-radius:100px;
  border:0;cursor:pointer;white-space:nowrap;
  transition:transform .2s,background-color .2s,box-shadow .2s;
}
.foot-newsletter-btn svg{width:16px;height:16px;transition:transform .2s;}
.foot-newsletter-btn:hover{
  background:#0090e0;transform:translateY(-1px);
  box-shadow:0 8px 22px rgba(0,161,249,.28);
}
.foot-newsletter-btn:hover svg{transform:translateX(2px);}
.foot-newsletter-btn:disabled{opacity:.6;cursor:wait;}
.foot-newsletter-msg{
  margin:14px 0 0;min-height:18px;
  font-size:13px;font-family:var(--mono);letter-spacing:.04em;
  color:var(--mi-pewter);transition:color .2s;
}
.foot-newsletter-msg.is-error{color:#d84545;}
.foot-newsletter-msg.is-ok{color:#1a8f3e;}
.foot-newsletter-form.is-sent .foot-newsletter-row,
.foot-newsletter-form.is-sent .foot-newsletter-consent{opacity:.55;pointer-events:none;}

/* Consent checkbox (LGPD) — alinhado à direita do formulário */
.foot-newsletter-consent{
  display:flex;align-items:center;gap:10px;
  margin:14px 0 0 auto;width:fit-content;cursor:pointer;
  font-size:13px;line-height:1.5;color:var(--mi-pewter);
}
@media (max-width:560px){
  .foot-newsletter-consent{margin:14px 0 0;align-items:flex-start;}
}
.foot-newsletter-consent input[type="checkbox"]{
  position:absolute;opacity:0;width:0;height:0;pointer-events:none;
}
.foot-newsletter-consent-box{
  flex-shrink:0;width:18px;height:18px;border-radius:5px;
  background:#fff;border:1.5px solid rgba(11,11,20,.22);
  display:inline-flex;align-items:center;justify-content:center;
  color:#fff;margin-top:1px;
  transition:background-color .2s,border-color .2s,transform .2s;
}
.foot-newsletter-consent-box svg{
  width:12px;height:12px;
  opacity:0;transform:scale(.5);
  transition:opacity .2s,transform .2s cubic-bezier(.22,1,.36,1);
}
.foot-newsletter-consent input:checked + .foot-newsletter-consent-box{
  background:var(--mi-cobalto);border-color:var(--mi-cobalto);
}
.foot-newsletter-consent input:checked + .foot-newsletter-consent-box svg{
  opacity:1;transform:scale(1);
}
.foot-newsletter-consent input:focus-visible + .foot-newsletter-consent-box{
  box-shadow:0 0 0 3px rgba(0,161,249,.30);
}
.foot-newsletter-consent:hover .foot-newsletter-consent-box{border-color:rgba(11,11,20,.45);}
.foot-newsletter-consent-text a{
  color:var(--mi-carvao);border-bottom:1px solid rgba(11,11,20,.30);
  transition:color .2s,border-color .2s;
}
.foot-newsletter-consent-text a:hover{
  color:var(--mi-cobalto);border-bottom-color:var(--mi-cobalto);
}
.foot-newsletter-form.is-invalid-consent .foot-newsletter-consent-box{
  border-color:#d84545;animation:miConsentShake .35s ease;
}
@keyframes miConsentShake{
  0%,100%{transform:translateX(0);}
  25%{transform:translateX(-3px);}
  75%{transform:translateX(3px);}
}

/* Ilustração do cientista (col. direita, 50%) — centralizada V/H */
.foot-newsletter-illustration{
  position:relative;
  width:100%;max-width:320px;
  margin:0 auto;            /* centraliza horizontalmente na coluna */
  /* O grid com align-items:center cuida da centralização vertical */
}
/* Sombra elíptica suave nos pés — sincronizada com o float do personagem */
.foot-newsletter-illustration::after{
  content:"";
  position:absolute;left:50%;bottom:-2%;
  width:54%;height:18px;
  transform:translateX(-50%);transform-origin:50% 50%;
  background:radial-gradient(ellipse at center,
    rgba(11,11,20,.22) 0%,
    rgba(11,11,20,.10) 45%,
    rgba(11,11,20,0) 75%);
  filter:blur(2px);
  z-index:0;pointer-events:none;
  animation:miShadowPulse 6s ease-in-out infinite;
}
.foot-newsletter-illustration-img{
  width:100%;height:auto;display:block;
  position:relative;z-index:1;
  animation:miCientistaFloat 6s ease-in-out infinite;
}
.foot-newsletter-bubbles{
  /* Container posicionado sobre o topo do frasco mais alto. Bottom do
     container = topo do frasco. As bolhas sobem do bottom até além do
     topo do container, escapando bem acima do frasco. */
  position:absolute;
  left:24%;top:-22%;
  width:18%;height:32%;
  pointer-events:none;z-index:2;
}

/* Bolhas minimalistas: círculo branco com borda amarela limão */
.foot-bubble{
  position:absolute;bottom:0;left:50%;
  width:var(--bsize, 9px);height:var(--bsize, 9px);
  border-radius:50%;
  background:#fff;
  border:1.5px solid var(--mi-limao);
  opacity:0;
  transform:translate(-50%, 0) scale(.4);
  animation:miBubbleRise 3.4s ease-out infinite;
  animation-fill-mode:both;
}
/* 16 bolhas, delays a cada ~0.21s pra criar fluxo contínuo e denso */
.foot-bubble:nth-child(1) {--bsize:10px;--bdrift:-7px; left:50%; animation-delay:0s;}
.foot-bubble:nth-child(2) {--bsize:7px; --bdrift:8px;  left:55%; animation-delay:.21s;}
.foot-bubble:nth-child(3) {--bsize:12px;--bdrift:-4px; left:42%; animation-delay:.42s;}
.foot-bubble:nth-child(4) {--bsize:8px; --bdrift:6px;  left:52%; animation-delay:.63s;}
.foot-bubble:nth-child(5) {--bsize:9px; --bdrift:-9px; left:46%; animation-delay:.84s;}
.foot-bubble:nth-child(6) {--bsize:6px; --bdrift:7px;  left:51%; animation-delay:1.05s;}
.foot-bubble:nth-child(7) {--bsize:11px;--bdrift:-5px; left:47%; animation-delay:1.26s;}
.foot-bubble:nth-child(8) {--bsize:7px; --bdrift:9px;  left:54%; animation-delay:1.47s;}
.foot-bubble:nth-child(9) {--bsize:9px; --bdrift:-6px; left:48%; animation-delay:1.68s;}
.foot-bubble:nth-child(10){--bsize:8px; --bdrift:5px;  left:50%; animation-delay:1.89s;}
.foot-bubble:nth-child(11){--bsize:11px;--bdrift:-8px; left:46%; animation-delay:2.10s;}
.foot-bubble:nth-child(12){--bsize:6px; --bdrift:6px;  left:53%; animation-delay:2.31s;}
.foot-bubble:nth-child(13){--bsize:9px; --bdrift:-3px; left:49%; animation-delay:2.52s;}
.foot-bubble:nth-child(14){--bsize:7px; --bdrift:9px;  left:51%; animation-delay:2.73s;}
.foot-bubble:nth-child(15){--bsize:10px;--bdrift:-7px; left:48%; animation-delay:2.94s;}
.foot-bubble:nth-child(16){--bsize:8px; --bdrift:7px;  left:52%; animation-delay:3.15s;}

@keyframes miBubbleRise{
  0%   {opacity:0;   transform:translate(-50%, 0) scale(.4);}
  10%  {opacity:1;   transform:translate(-50%, -8%) scale(.7);}
  55%  {opacity:.95; transform:translate(calc(-50% + var(--bdrift, 0px)), -55%) scale(1);}
  100% {opacity:0;   transform:translate(calc(-50% + var(--bdrift, 0px)), -110%) scale(1.1);}
}
@keyframes miCientistaFloat{
  0%,100%{transform:translateY(0);}
  50%   {transform:translateY(-6px);}
}
@keyframes miShadowPulse{
  0%,100%{transform:translateX(-50%) scale(1, 1);   opacity:.85;}
  50%    {transform:translateX(-50%) scale(.82, .85);opacity:.55;}
}

/* ---- Aviões de papel + envelopes orbitando a cabeça ---- */
.foot-newsletter-orbit{
  position:absolute;inset:0;
  pointer-events:none;        /* só os filhos absolutos individualmente reagem */
  z-index:3;
}
.orbit-item{
  position:absolute;
  width:var(--bsize, 30px);
  height:var(--bsize, 30px);
  /* ordem do transform: empurrão do mouse PRIMEIRO, rotação base + scale depois */
  transform:
    translate(var(--push-x, 0px), var(--push-y, 0px))
    rotate(calc(var(--brot, 0deg) + var(--push-rot, 0deg)))
    scale(var(--push-scale, 1));
  transition:transform .45s cubic-bezier(.22,1,.36,1);
  will-change:transform;
}
.orbit-float{
  display:block;width:100%;height:100%;
  /* float gentle independente do empurrão do mouse */
  animation:orbitFloat var(--fdur, 5s) ease-in-out infinite;
  animation-delay:var(--fdelay, 0s);
}
.orbit-icon{
  display:block;width:100%;height:100%;
  filter:drop-shadow(0 4px 6px rgba(11,11,20,.12));
}
.orbit-item.plane    .orbit-icon{color:var(--mi-cobalto);}
.orbit-item.envelope .orbit-icon{color:var(--mi-cobalto);}

@keyframes orbitFloat{
  0%,100%{transform:translate(0, 0);}
  50%   {transform:translate(var(--fx, 4px), var(--fy, -8px));}
}

@media (prefers-reduced-motion: reduce){
  .foot-newsletter-illustration-img,
  .foot-newsletter-illustration::after,
  .orbit-float{animation:none;}
  .foot-bubble{animation:none;opacity:.5;}
}

@media (max-width:880px){
  .foot-newsletter{padding:64px 0;}
  .foot-newsletter-grid{grid-template-columns:1fr;gap:48px;}
  .foot-newsletter-illustration{max-width:240px;}
}
@media (max-width:560px){
  .foot-newsletter-row{flex-direction:column;border-radius:18px;padding:8px;gap:10px;}
  .foot-newsletter-row input[type="email"]{padding:12px 14px;}
  .foot-newsletter-btn{justify-content:center;border-radius:100px;}
}

.foot-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1fr auto;gap:24px;align-items:start;}
@media (max-width:1100px){.foot-grid{grid-template-columns:1fr 1fr 1fr;gap:28px;}}
@media (max-width:768px){.foot-grid{grid-template-columns:1fr 1fr;gap:32px;}}
@media (max-width:480px){.foot-grid{grid-template-columns:1fr;}}

/* Coluna do selo AnaMid — canto direito, alinhada com as demais */
.foot-col.foot-anamid h4{margin-bottom:14px;}
.foot-col.foot-anamid a{display:inline-block;line-height:0;
  transition:transform .3s ease,opacity .3s ease;opacity:.92;}
.foot-col.foot-anamid a:hover{transform:translateY(-2px);opacity:1;}
.foot-col.foot-anamid img{display:block;width:110px;height:auto;border-radius:8px;}
@media (max-width:1100px){
  .foot-col.foot-anamid{grid-column:1 / -1;}
}

.foot-brand img{height:64px;margin-bottom:18px;}
.foot-brand-social{margin-top:8px;}
.foot-col h4{font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  color:var(--mi-neblina);text-transform:uppercase;margin:0 0 18px;font-weight:600;}
.foot-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.foot-col li{font-size:14px;color:var(--mi-prata);line-height:1.5;}
.foot-col a{font-size:14px;color:var(--mi-prata);transition:color .2s;}
.foot-col a:hover{color:var(--mi-cobalto);}

/* Ícones nos itens das colunas Navegação, Serviços e Contato (footer) */
.foot-nav li a,
.foot-services li a,
.foot-contact li{
  display:flex;align-items:flex-start;gap:10px;
}
.foot-icon{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;color:var(--mi-cobalto);opacity:.9;margin-top:2px;
}
.foot-icon svg{width:100%;height:100%;display:block;}
.foot-nav li a:hover .foot-icon,
.foot-services li a:hover .foot-icon{opacity:1;}
.foot-bottom-link{color:inherit;border-bottom:1px solid rgba(255,255,255,.18);transition:color .2s,border-color .2s;}
.foot-bottom-link:hover{color:var(--mi-cobalto);border-bottom-color:var(--mi-cobalto);}
.foot-bottom{margin-top:64px;padding-top:32px;border-top:1px solid rgba(255,255,255,.08);
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  flex-wrap:wrap;font-size:12px;color:var(--mi-neblina);font-family:var(--mono);}
.foot .social{display:flex;gap:10px;}
.foot .social a{width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;color:var(--mi-prata);
  transition:background-color .2s,color .2s,border-color .2s;}
.foot .social a:hover{background:var(--mi-cobalto);color:#fff;border-color:transparent;}
/* (Regra antiga de stroke removida — substituída pelo override sólido acima) */

/* Brain animado (inspirado no Lottie 7000519) — usado no rodapé "Feito com" */
.brain-wrap{position:relative;display:inline-block;cursor:help;line-height:0;}
.brain-wrap::after{content:"Feito com cérebro!";position:absolute;
  bottom:calc(100% + 10px);left:50%;
  transform:translateX(-50%) translateY(4px);
  background:var(--mi-cobalto);color:var(--mi-branco);
  padding:7px 12px;border-radius:6px;font-size:11px;white-space:nowrap;
  font-family:var(--mono);letter-spacing:.04em;font-weight:600;
  opacity:0;pointer-events:none;transition:opacity .22s,transform .22s;
  box-shadow:0 6px 18px rgba(0,0,0,.25);}
.brain-wrap::before{content:"";position:absolute;bottom:calc(100% + 4px);left:50%;
  transform:translateX(-50%);border:5px solid transparent;
  border-top-color:var(--mi-cobalto);opacity:0;transition:opacity .22s;}
.brain-wrap:hover::after,.brain-wrap:hover::before,
.brain-wrap:focus-visible::after,.brain-wrap:focus-visible::before{opacity:1;}
.brain-wrap:hover::after{transform:translateX(-50%) translateY(0);}
/* ===================== BRAIN ICON (universal) =====================
   SVG do cérebro animado usado em: hero (.rev-eyebrow), footer (.foot-bottom)
   e bio page (links.html). Compartilha animações.
   Tamanho é definido por contexto. */
.brain-icon{
  display:inline-block;
  vertical-align:middle;
  color:var(--mi-cobalto);
  overflow:visible;
}
.brain-icon .brain-shell{
  transform-origin:50% 50%;
  animation:brainBreathe 2.8s ease-in-out infinite;
}
.brain-icon .brain-aura{
  transform-origin:50% 50%;
  animation:brainAuraPulse 2.8s ease-in-out infinite;
}
.brain-icon .gyrus{
  stroke-dasharray:3 4;
  animation:brainGyrusFlow 2.4s linear infinite;
}
.brain-icon .gyrus.g2{ animation-delay:-.6s; }
.brain-icon .gyrus.g3{ animation-delay:-1.2s; }
.brain-icon .gyrus.g4{ animation-delay:-1.8s; }
.brain-icon .spark{
  opacity:0;
  transform-origin:center;
  transform-box:fill-box;
  animation:brainSparkFire 2.8s ease-in-out infinite;
}
.brain-icon .spark.s1{ animation-delay:0s; }
.brain-icon .spark.s2{ animation-delay:.30s; }
.brain-icon .spark.s3{ animation-delay:.55s; }
.brain-icon .spark.s4{ animation-delay:.80s; }
.brain-icon .spark.s5{ animation-delay:1.05s; }
.brain-icon .spark.s6{ animation-delay:1.30s; }
.brain-icon .spark.s7{ animation-delay:1.55s; }

@keyframes brainBreathe{
  0%, 100% { transform:scale(1); }
  50%      { transform:scale(1.05); }
}
@keyframes brainAuraPulse{
  0%, 100% { opacity:.55; transform:scale(.92); }
  50%      { opacity:1;   transform:scale(1.08); }
}
@keyframes brainGyrusFlow{
  to { stroke-dashoffset:-14; }
}
@keyframes brainSparkFire{
  0%, 75%, 100% { opacity:0; transform:scale(.5); }
  6%   { opacity:1; transform:scale(1.5); }
  18%  { opacity:1; transform:scale(1.1); }
  30%  { opacity:0; transform:scale(.7); }
}
@media (prefers-reduced-motion: reduce){
  .brain-icon *{ animation:none !important; }
}

/* Per-context size: hero é grande (54px), footer é pequeno (24px) */
.foot-bottom .brain-icon{
  width:24px;
  height:24px;
  margin:0 4px;
  vertical-align:-7px;
}

/* =====================================================================
   PAGE TRANSITION (saída — quando o usuário clica em link interno)
   Cortina cobalto sobe de baixo cobrindo a página, com topo ondulado.
   A revelação na nova página é tratada por <style> inline em cada
   arquivo HTML pra evitar FOUC.
   ===================================================================== */
.mi-page-cover{
  position:fixed; left:0; right:0; bottom:0;
  height:calc(100vh + 30px); /* extra pra esconder a onda no topo no estado final */
  background:#00A1F9; /* mi-cobalto */
  z-index:9999; pointer-events:none;
  -webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,2 C200,1 400,3 600,2 C800,1 1000,3 1200,2 L1200,100 L0,100 Z' fill='white'/></svg>");
          mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 100' preserveAspectRatio='none'><path d='M0,2 C200,1 400,3 600,2 C800,1 1000,3 1200,2 L1200,100 L0,100 Z' fill='white'/></svg>");
  -webkit-mask-size:100% 100%; mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  transform:translateY(100%);
  animation:miCoverIn .65s cubic-bezier(.86,0,.07,1) forwards;
}
@keyframes miCoverIn{
  0%{transform:translateY(100%);}
  100%{transform:translateY(0);}
}
@media (prefers-reduced-motion: reduce){
  .mi-page-cover{ animation:none; transform:translateY(0); }
}
