:root {
  --cq-bg: #050708;
  --cq-text: #f2f5f5;
  --cq-green: #24bcbb;
  --cq-line: rgba(255, 255, 255, 0.1);
  --cq-header-height: 88px;
  /* AJ-GLOBAL-14 — a altura que o cabeçalho tem depois de a página rolar.
     É esta que interessa às âncoras: quando se clica num item do menu, a
     página sai do topo, o cabeçalho ganha .is-scrolled e encolhe para 76px.
     O scroll-padding-top usava os 88px do estado parado e punha o destino
     12px abaixo do necessário. */
  --cq-header-scrolled: 76px;

  /* AJ-GLOBAL-16 — o respiro vertical de uma seção no celular, declarado uma
     vez e herdado por todas.

     Até à r57 este valor estava escrito à mão em catorze sítios dentro do
     site.js, mais as excepções nas folhas de cada seção. Mudar o ritmo da
     página exigia catorze alterações coordenadas, e quatro seções tinham
     escapado à última passagem sem que nada o assinalasse.

     As propriedades personalizadas atravessam a fronteira da shadow DOM, como
     qualquer propriedade herdada. Declaradas aqui, chegam a todas as seções
     sem serem repetidas — é o mesmo mecanismo que a --cq-header-height já usa.

     SÃO DOIS VALORES, E A RAZÃO É ÓPTICA.
     O espaço declarado e o espaço percebido não são a mesma coisa. Uma seção
     que fecha com um cartão ou uma faixa dá ao olho um limite duro, e o vazio
     abaixo dela lê-se inteiro. Uma seção que fecha com uma linha de texto
     pequeno e cinzento não dá limite nenhum: o olho não tem onde ancorar, a
     seção parece ter acabado antes, e o mesmo vazio lê-se maior do que é.

     Por isso são dois valores, com oito pixéis de diferença. A unidade base é
     a do lado leve; o lado firme leva mais oito. Não é para o número ficar
     diferente — é para o vazio parecer igual.

     A calibragem parte de onde a r57 estava: as cinco costuras dominantes
     mediam 140px e o Roberto não as achou largas, achou-as desiguais. Com
     64 e 72 as costuras abertas ficam em 128 e 136, conforme a junta — o
     mesmo ritmo, sem os saltos. */
  --cq-secao-v: 64px;
  --cq-secao-v-firme: 72px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--cq-header-scrolled); background: var(--cq-bg); }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--cq-bg);
  color: var(--cq-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.menu-open { overflow: hidden; }
a, button { -webkit-tap-highlight-color: transparent; }

.skip-link {
  position: fixed; left: 18px; top: 14px; z-index: 1000;
  padding: 10px 14px; border-radius: 999px; background: var(--cq-green);
  color: #031011; font-weight: 700; text-decoration: none;
  transform: translateY(-160%); transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }

.global-header {
  position: fixed; inset: 0 0 auto; z-index: 100; height: var(--cq-header-height);
  border-bottom: 1px solid transparent;
  background: transparent;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  transition: height .3s ease;
}
.global-header.is-scrolled { height: 76px; }
.global-header__shell {
  width: min(1420px, 100%); height: 100%; margin: 0 auto; padding: 0 28px;
  display: flex; align-items: center; gap: 26px;
}
.global-brand { display: inline-flex; width: 184px; flex: 0 0 auto; }
.global-brand img { display: block; width: 100%; height: auto; }
.global-navigation { display: flex; align-items: center; justify-content: center; gap: 22px; margin-left: auto; }
.global-navigation a {
  position: relative; padding: 8px 0; color: #b8c1c2; font-size: 13px; white-space: nowrap;
  text-decoration: none; transition: color .2s ease;
}
.global-navigation a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: 2px; height: 1px;
  background: var(--cq-green); transition: right .25s ease;
}
.global-navigation a:hover, .global-navigation a:focus-visible, .global-navigation a.is-active { color: #fff; }
.global-navigation a:hover::after, .global-navigation a:focus-visible::after, .global-navigation a.is-active::after { right: 0; }
.global-cta {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
  padding: 0 19px; border: 1px solid rgba(36,188,187,.5); border-radius: 999px;
  color: #ecffff; font-size: 12px; font-weight: 650; text-decoration: none;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.global-cta:hover, .global-cta:focus-visible {
  border-color: var(--cq-green); background: rgba(36,188,187,.1); transform: translateY(-1px);
}
.global-cta--mobile { display: none; }
.global-menu { display: none; width: 44px; height: 44px; margin-left: auto; border: 0; background: transparent; cursor: pointer; }
.global-menu span { display: block; width: 23px; height: 1px; margin: 6px auto; background: #fff; transition: transform .3s ease; }

cq-hero, cq-company, cq-solutions, cq-mission, cq-method, cq-differentials,
cq-cases, cq-instagram, cq-reach, cq-contact, cq-footer {
  display: block; min-width: 0; background: var(--cq-bg);
}
cq-hero { min-height: 100svh; }
cq-company, cq-solutions, cq-mission, cq-method, cq-differentials, cq-cases,
cq-instagram, cq-reach, cq-contact {
  min-height: 420px; border-top: 1px solid rgba(255,255,255,.055);
}

.noscript-message {
  position: fixed; inset: auto 20px 20px; z-index: 200; margin: 0; padding: 14px 18px;
  border: 1px solid rgba(36,188,187,.4); border-radius: 14px; background: #0b1011; color: #fff;
}

@media (max-width: 1320px) {
  .global-header__shell { gap: 20px; }
  .global-navigation { gap: 17px; }
  .global-navigation a { font-size: 12.5px; }
  .global-brand { width: 168px; }
  .global-cta { padding: 0 16px; font-size: 11.5px; }
}

@media (max-width: 1100px) {
  .global-header__shell { gap: 0; }
  .global-brand { position: relative; z-index: 3; }
  .global-header > .global-header__shell > .global-cta { display: none; }
  .global-menu { position: relative; z-index: 3; display: block; }
  .global-menu[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .global-menu[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .global-navigation {
    position: fixed; inset: 0; z-index: 2; width: 100%; height: 100svh;
    padding: calc(var(--cq-header-height) + 26px) 24px 40px;
    display: flex; flex-direction: column;
    align-items: flex-start; justify-content: flex-start; gap: 0;
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    background: radial-gradient(circle at 75% 20%, rgba(36,188,187,.1), transparent 30%), #050708;
    opacity: 0; visibility: hidden; transform: translateY(-24px); pointer-events: none;
    transition: opacity .3s ease, visibility .3s ease, transform .4s cubic-bezier(.16,1,.3,1);
  }
  .global-navigation.is-open { opacity: 1; visibility: visible; transform: translateY(0); pointer-events: auto; }
  .global-navigation a {
    width: 100%; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.07);
    color: #eef3f3; font-size: clamp(19px, 3.4vw, 27px); letter-spacing: -.03em; white-space: normal;
  }
  .global-navigation a::after { display: none; }
  .global-navigation .global-cta--mobile {
    display: inline-flex; align-items: center; justify-content: center;
    width: 100%; min-height: 54px; margin-top: 26px; padding: 0 22px;
    border: 1px solid rgba(36,188,187,.5); border-bottom: 1px solid rgba(36,188,187,.5);
    border-radius: 999px; background: rgba(36,188,187,.08);
    color: #ecffff; font-size: 15px; font-weight: 650; letter-spacing: 0; text-align: center;
  }
}

@media (max-width: 820px) {
  /* AJ-GLOBAL-14 — no telemóvel o cabeçalho não encolhe ao rolar: as duas
     alturas são a mesma, e não há desfasamento nenhum a corrigir. */
  :root { --cq-header-height: 74px; --cq-header-scrolled: 74px; }
  .global-header, .global-header.is-scrolled { height: var(--cq-header-height); }
  .global-header__shell { padding: 0 20px; }
  .global-brand { width: 164px; }
  .global-navigation { padding: calc(var(--cq-header-height) + 22px) 22px 36px; }
  .global-navigation a { font-size: clamp(19px, 5.4vw, 28px); }
}

/* AJ-GLOBAL-09 — a preferência de movimento reduzido deixa de suprimir efeitos.
   Fica só o deslizar suave desligado, que não esconde nada: a página continua a
   ir ao mesmo sítio, instantaneamente. A regra que anulava todas as animações e
   transições com !important saiu. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* ==========================================================================
   AJ-GLOBAL-07 — Aviso de cookies
   Vive fora das seções, colado ao fundo do ecrã. O texto e os dois botões vêm
   do protótipo, onde já existiam e nunca chegaram a ser montados no site.
   ========================================================================== */
.cookie-banner {
  position: fixed; left: 22px; right: 22px; bottom: 22px; z-index: 120;
  max-width: 760px; margin: auto;
  display: flex; align-items: center; justify-content: space-between; gap: 26px;
  padding: 18px 20px;
  background: rgba(12, 15, 16, .94);
  border: 1px solid rgba(255, 255, 255, .15);
  /* AJ-GLOBAL-08 — a barra não tinha raio nenhum e ficava quadrada, sobretudo
     no telemóvel, onde ocupa quase toda a largura. */
  border-radius: 18px;
  backdrop-filter: blur(16px);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .55);
  transition: opacity .35s ease, transform .35s ease, visibility .35s;
}
.cookie-banner.is-hidden {
  opacity: 0; transform: translateY(30px); visibility: hidden; pointer-events: none;
}
.cookie-banner p { margin: 0; font-size: 11px; line-height: 1.5; color: #8e9899; }
.cookie-banner p a {
  color: var(--cq-green); text-decoration: underline; text-underline-offset: 3px;
}
.cookie-banner__acoes { display: flex; gap: 8px; flex: none; }
.cookie-banner__botao {
  padding: 10px 13px;
  border: 1px solid var(--cq-line); background: transparent;
  color: inherit; font-family: inherit; font-size: 10px; letter-spacing: .04em;
  border-radius: 999px;
  cursor: pointer; transition: border-color .25s ease, background .25s ease;
}
.cookie-banner__botao:hover { border-color: rgba(36, 188, 187, .5); }
.cookie-banner__botao--principal {
  background: var(--cq-green); border-color: var(--cq-green);
  color: #061010; font-weight: 600;
}
.cookie-banner__botao--principal:hover { background: #2ad0cf; border-color: #2ad0cf; }

@media (max-width: 820px) {
  .cookie-banner {
    left: 16px; right: 16px; bottom: 16px;
    flex-direction: column; align-items: flex-start; gap: 14px;
    padding: 18px;
    border-radius: 20px;
  }
  .cookie-banner__acoes { width: 100%; }
  .cookie-banner__botao { flex: 1; padding: 12px 10px; }
}