/* ═══════════════════════════════════════════════════════════════
   FOOTER
   Estrutura: coluna esquerda (brand) + coluna direita (contacto)
   ═══════════════════════════════════════════════════════════════ */

.site-footer {
  background: #0A0A0A;       /* preto quase total — mais escuro que --color-dark */
  color: #ffffff;
  position: relative;        /* necessário para a orb animada em position:absolute */
  overflow: hidden;          /* corta a orb que ultrapassa os limites do footer */
}


/* ─── MAIN FOOTER ────────────────────────────────────────────── */
/* Grid de 2 colunas: logo/redes sociais à esquerda, contacto à direita */
.footer-inner {
  max-width: var(--container-max);       /* limita a largura máxima */
  margin-inline: auto;                   /* centrado horizontalmente */
  padding: var(--space-2xl) clamp(1.25rem, 5vw, 3rem); /* padding responsivo */
  display: grid;
  grid-template-columns: 280px 1fr;      /* coluna brand fixa, contacto ocupa o resto */
  gap: var(--space-2xl);                 /* espaço entre as colunas */
  align-items: start;                    /* alinha topo-a-topo */
}
/* em mobile as colunas empilham */
@media (max-width: 900px) { .footer-inner { grid-template-columns: 1fr; } }


/* ─── BRAND COLUMN ───────────────────────────────────────────── */
.footer-brand {
  position: relative;        /* ancora a orb decorativa em position:absolute */
}

/* esfera laranja (orb) animada que percorre o footer — puramente decorativa */
.footer-brand__glow {
  position: absolute;
  width: 500px; height: 500px;
  border-radius: 50%;        /* círculo perfeito */
  background: radial-gradient(circle, rgba(232,119,34,0.11) 0%, transparent 70%); /* gradiente radial laranja */
  top: 50%; left: -100px;   /* começa parcialmente fora do footer à esquerda */
  transform: translateY(-50%);           /* centrado verticalmente */
  pointer-events: none;                  /* não interfere com cliques */
  animation: footerOrbDrift 16s ease-in-out infinite; /* animação de deriva lenta */
  will-change: transform;               /* avisa o browser que o transform vai mudar — optimização GPU */
}
/* esfera laranja orb desloca-se horizontalmente de ponta a ponta do footer */
@keyframes footerOrbDrift {
  0%   { transform: translateY(-50%) translateX(0px); opacity: 0.7; }   /* posição inicial (esquerda) */
  25%  { transform: translateY(-60%) translateX(35vw); opacity: 1; }    /* a meio do footer */
  50%  { transform: translateY(-45%) translateX(70vw); opacity: 0.8; }  /* extremo direito */
  75%  { transform: translateY(-55%) translateX(35vw); opacity: 1; }    /* volta ao meio */
  100% { transform: translateY(-50%) translateX(0px); opacity: 0.7; }   /* regresso à esquerda */
}

.footer-logo__img {
  max-width: 140px;
  width: 100%;
  height: auto;
  display: block;
  filter: brightness(0) invert(1); /* converte o logo escuro para branco */
  transition: opacity 0.25s ease;
}
/* hover: reduz opacidade no logo para indicar interatividade */
.footer-logo:hover .footer-logo__img { opacity: 0.8; }

.footer-tagline {
  margin-top: 1.25rem;
  font-size: 0.87rem;
  color: rgba(255,255,255,0.38); /* muito subtil — não deve competir com o logo */
  line-height: 1.7;
  max-width: 240px;              /* limita largura para leitura confortável */
  position: relative;
}

/* ícones sociais circulares com borda e hover laranja */
.footer-social { display: flex; gap: 0.6rem; margin-top: 1.75rem; position: relative; z-index: 1; }
.footer-social__link {
  width: 38px; height: 38px;
  border-radius: 50%;                           /* círculo */
  border: 1px solid rgba(255,255,255,0.1);      /* borda muito subtil */
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,0.45);                /* ícone semi-transparente */
  transition: border-color 0.25s ease, color 0.25s ease, background 0.25s ease, transform 0.25s var(--ease);
}
.footer-social__link:hover {
  border-color: var(--color-accent);            /* borda laranja */
  color: var(--color-accent);                  /* ícone laranja */
  background: rgba(232,119,34,0.1);            /* fundo laranja muito subtil */
  transform: translateY(-3px);                 /* sobe ligeiramente */
}


/* ─── COLUNA DE CONTACTO ─────────────────────────────────────── */
/* justify-content: flex-end empurra o bloco de contacto para a direita */
.footer-links {
  display: flex;
  justify-content: flex-end;   /* empurra para a margem direita */
  align-items: flex-start;
}

/* título de secção dentro do footer ("CONTACTO", "MORADAS"…) */
.footer-col__title {
  font-family: var(--font-display);
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3); /* muito discreto */
  margin-bottom: 1.1rem;
  display: block;
}

/* morada em duas linhas com espaço entre elas */
.footer-address { font-size: 0.88rem; color: rgba(255,255,255,0.5); line-height: 1.7; }
.footer-address p { margin-bottom: 0.35rem; }
.footer-address a { color: rgba(255,255,255,0.5); transition: color 0.2s ease; }
.footer-address a:hover { color: var(--color-accent); }

/* linha divisória fina entre os blocos de morada */
.footer-contact-divider {
  height: 1px;
  background: rgba(255,255,255,0.08); /* linha quase invisível */
  margin: 0.75rem 0;
}

/* selector de idioma no rodapé da coluna de contacto */
.footer-lang { margin-top: 1.5rem; }
.footer-lang__links { display: flex; gap: 0.75rem; margin-top: 0.5rem; }
.footer-lang__links a {
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 700;
  color: rgba(255,255,255,0.3);      /* inactivo: muito discreto */
  transition: color 0.2s ease;
  letter-spacing: 0.06em;
}
.footer-lang__links a.active { color: var(--color-accent); } /* idioma activo: laranja */

/* hover: fica branco e desloca ligeiramente para a direita (PT-EN-DE) */
.footer-col a:hover { color: #ffffff; padding-left: 4px; }

/* linha decorativa com gradiente — aparece e desaparece nas extremidades */
.footer-bottom__line {
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.07) 30%, rgba(255,255,255,0.07) 70%, transparent 100%);
}

/* barra inferior: copyright à esquerda, link à direita */
.footer-bottom__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  padding: 1.25rem clamp(1.25rem, 5vw, 3rem); /* padding responsivo */
  display: flex;
  justify-content: space-between;             /* separa copyright do link */
  align-items: center;
  flex-wrap: wrap;                            /* em mobile passa para nova linha */
  gap: 0.5rem;
}
.footer-bottom p       { font-size: 0.78rem; color: rgba(255,255,255,0.25); } /* copyright muito discreto */
.footer-bottom a       { color: rgba(255,255,255,0.35); transition: color 0.2s ease; }
.footer-bottom a:hover { color: var(--color-accent); }
