/* O rodape do In Move: pagina do evento e telas de inscricao.

   Desde 2026-09-24 segue o print de Lucas: logotipo com "Movimento que te
   conecta.", navegacao, canais so em icone e a frase de fecho numa fileira;
   Privacidade, Termos de uso e Cookies numa faixa fina embaixo. A altura segue
   a marcacao dele (160 px a 1086 px de largura): uma fileira so a partir de
   941 px, logotipo menor e espacos curtos. A largura vem do container da
   pagina que inclui (`im-container` ou `im-reg-container`).

   As cores do rodape moram aqui, e nao no escopo de cada pagina: o mesmo
   rodape precisa sair igual nas duas. Literais permitidos: sidecar do In Move. */
.im-footer {
  --im-footer-suave: #d6c4dc;
  --im-footer-fio: #67496f;
  background: var(--im-deep);
  color: var(--im-white);
}
.im-footer__inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  grid-template-areas: "marca nav canais fecho";
  align-items: center;
  gap: var(--espaco-3) var(--espaco-8);
  padding-block: var(--espaco-6) var(--espaco-5);
}
.im-footer__brand { grid-area: marca; display: grid; gap: var(--espaco-1); }
.im-footer .im-footer__logo { display: inline-flex; align-items: center; width: fit-content; border-radius: var(--espaco-1); }
.im-footer__logo img { display: block; width: 7.5rem; height: auto; }
.im-footer__tagline { margin: 0; color: var(--im-footer-suave); font-size: var(--fs-14); line-height: 1.5; }
.im-footer__nav { grid-area: nav; }
.im-footer__nav ul,
.im-footer__documentos { display: flex; flex-wrap: wrap; gap: 0 var(--espaco-6); margin: 0; padding: 0; list-style: none; }
/* A navegacao tem as seis secoes da pagina do evento, nas duas paginas desde
   25/09. Os espacos encolhem com a largura para ela caber numa fileira a
   partir de ~1054 px, e o rodape ficar com a altura que Lucas marcou (160 px);
   abaixo disso as secoes quebram em duas linhas e ele fica com 169 px. */
.im-footer__inner { column-gap: clamp(1.25rem, 2.2vw, 2rem); }
.im-footer__nav ul { column-gap: clamp(1rem, 1.5vw, 1.5rem); }
.im-footer .im-footer__nav a,
.im-footer .im-footer__documentos a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--im-white);
  font-size: var(--fs-15);
  font-weight: 500;
  text-decoration: none;
}
.im-footer .im-footer__documentos a { min-height: 36px; font-size: var(--fs-14); }
.im-footer .im-footer__nav a:hover,
.im-footer .im-footer__documentos a:hover { color: var(--im-lime-luz); text-decoration: underline; text-underline-offset: 5px; }
.im-footer__contacts { grid-area: canais; display: flex; flex-wrap: wrap; align-items: center; gap: var(--espaco-1); }
.im-footer .im-footer__contacts a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  color: var(--im-white);
}
.im-footer .im-footer__contacts a:is(:hover, :focus-visible) { color: var(--im-lime-luz); }
.im-footer__contacts svg { width: 24px; height: 24px; flex: none; }
/* Os nomes dos canais continuam no link para o leitor de tela; so o icone aparece. */
.im-footer__contacts a > span {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.im-footer__fecho {
  grid-area: fecho;
  display: grid;
  grid-template-columns: max-content;
  padding-left: var(--espaco-6);
  border-left: 1px solid var(--im-footer-fio);
}
.im-footer__fecho p { margin: 0; color: var(--im-white); font-size: var(--fs-15); line-height: 1.6; }
.im-footer__risco {
  justify-self: end;
  width: 7.5rem;
  height: auto;
  margin-top: var(--espaco-1);
  fill: none;
  stroke: var(--im-lime-luz);
  stroke-width: 3;
  stroke-linecap: round;
}
.im-footer__base {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0 var(--espaco-6);
  border-top: 1px solid var(--im-footer-fio);
  color: var(--im-footer-suave);
  font-size: var(--fs-14);
}
.im-footer__base p { margin: 0; }
.im-footer a:focus-visible { outline: 2px solid var(--im-lime-luz); outline-offset: 5px; }
@media (max-width: 940px) {
  .im-footer__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "marca fecho" "nav canais";
  }
}
@media (max-width: 760px) {
  .im-footer__inner {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "marca" "nav" "canais" "fecho";
    gap: var(--espaco-4);
    padding-block: var(--espaco-8) var(--espaco-6);
  }
  .im-footer__contacts { margin-left: calc(-1 * var(--espaco-3)); }
  .im-footer__fecho { padding: var(--espaco-4) 0 0; border-left: 0; border-top: 1px solid var(--im-footer-fio); }
  .im-footer__base { flex-direction: column; align-items: flex-start; padding-block: var(--espaco-2); }
}
@media (forced-colors: active) {
  .im-footer { background: Canvas; color: CanvasText; }
  .im-footer .im-footer__nav a,
  .im-footer .im-footer__documentos a,
  .im-footer .im-footer__contacts a { color: LinkText; }
  .im-footer__fecho, .im-footer__base { border-color: CanvasText; }
  .im-footer__risco { stroke: CanvasText; }
  .im-footer a:focus-visible { outline-color: Highlight; }
}
