/* Uma secção = uma vista mínima. Scroll nativo, sem snap. O bloco de contacto fica de fora. */
html{
  scroll-snap-type:none!important;
  scroll-behavior:auto!important;
  height:auto!important;
  max-height:none!important;
}
body{
  height:auto!important;
  max-height:none!important;
}
@media (min-width:861px){
  .cover{
    position:relative!important;
    height:auto!important;
    min-height:calc(100vh - var(--menu-h,74px))!important;
    max-height:none!important;
    overflow:visible!important;
  }
}
@media (max-width:860px){
  .cover{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
}
@media (min-width:1280px){
  .cover,
  .qs-hero,
  .move,
  .how,
  #habilitacoes,
  .inner>.xp,
  .inner>.pb100,
  section.works,
  article.cp,
  section.feito,
  section.sx,
  section.aaeh,
  div.strip,
  article.doc>section{
    min-height:calc(100vh - var(--menu-h,74px));
    height:auto;
    box-sizing:border-box;
  }
  .qs-hero,
  .move,
  .how,
  #habilitacoes,
  article.doc>section,
  section.sx,
  section.feito{
    display:flex!important;
    flex-direction:column;
    justify-content:center;
    padding-top:48px!important;
    padding-bottom:48px!important;
  }
  .inner>.xp,
  .inner>.pb100,
  article.cp,
  section.aaeh{
    align-content:center;
    padding-top:48px!important;
    padding-bottom:48px!important;
  }
  .inner>.qs-hero,
  .inner>.xp:first-of-type,
  .inner>.pb100:first-of-type,
  main>div.strip:first-child,
  main>article.cp:first-child,
  article.doc>section:first-child{
    margin-top:var(--menu-h,74px)!important;
  }
  .ab__r{width:100%!important;padding-top:0!important}
  .ab{padding-bottom:0!important}
  .qs-eye{margin:0 0 24px!important}
  .qs-hero .qs-title,
  .move .qs-title,
  .how .qs-title,
  #habilitacoes>.qs-title{margin:0!important}
  .qs-cols,
  .how__lead,
  .move__cols{margin-top:32px!important}
  .how__steps,
  .qs-more,
  #habilitacoes .hab{margin-top:40px!important}
}
@media (max-width:1279px){
  .qs-hero,
  .move,
  .how,
  #habilitacoes,
  .inner>.xp,
  .inner>.pb100,
  section.works,
  article.cp,
  section.feito,
  section.sx,
  section.aaeh,
  div.strip,
  article.doc>section{
    min-height:0!important;
    height:auto!important;
    padding-top:48px!important;
    padding-bottom:48px!important;
  }
  .qs-eye{margin:0 0 24px!important}
  .qs-cols,
  .how__lead,
  .move__cols{margin-top:32px!important}
  .how__steps,
  .qs-more,
  #habilitacoes .hab{margin-top:40px!important}
}

/* Secções com altura do conteúdo. Espaço igual entre elas.
   A primeira eyebrow mantém a distância da Home. */
@media (min-width:861px){
  .ab{padding-bottom:120px!important}
  .ab__r{padding-top:0!important}
  .qs-hero,
  .move,
  .how,
  #habilitacoes,
  section.works{
    min-height:0!important;
    height:auto!important;
    justify-content:flex-start!important;
    align-content:start!important;
    padding-bottom:0!important;
  }
  .move,
  .how,
  #habilitacoes{
    margin-top:120px!important;
    padding-top:0!important;
  }
  .qs-hero{
    margin-top:var(--menu-h,74px)!important;
    padding-top:24px!important;
  }
  .qs-hero:has(.qs-mark){
    display:grid!important;
    grid-template-columns:minmax(0,1fr) clamp(180px,28vw,420px);
    column-gap:clamp(24px,3vw,48px);
    align-items:center;
  }
  .qs-hero:has(.qs-mark) > .qs-mark{
    position:relative!important;
    grid-column:2;
    grid-row:1 / span 6;
    top:auto!important;
    right:auto!important;
    width:100%!important;
    height:auto;
    margin:0;
    align-self:center;
    justify-self:end;
    z-index:0;
  }
  .qs-hero:has(.qs-mark) > .qs-eye,
  .qs-hero:has(.qs-mark) > .qs-title,
  .qs-hero:has(.qs-mark) > .qs-cols,
  .qs-hero:has(.qs-mark) > .qs-lead,
  .qs-hero:has(.qs-mark) > .qs-more{
    grid-column:1;
    position:relative;
    z-index:1;
    max-width:100%;
  }
  section.works{padding-top:0!important}
  main.wx{padding-top:calc(var(--menu-h,74px) + 24px)!important}
  article.doc{padding-top:calc(var(--menu-h,74px) + 24px)!important}
}
@media (max-width:860px){
  .ab{padding-bottom:72px!important}
  .ab__r{padding-top:0!important}
  .qs-hero,
  .move,
  .how,
  #habilitacoes,
  section.works{
    min-height:0!important;
    height:auto!important;
    justify-content:flex-start!important;
    padding-bottom:0!important;
  }
  .move,
  .how,
  #habilitacoes{
    margin-top:72px!important;
    padding-top:0!important;
  }
  .qs-hero{
    margin-top:0!important;
    padding-top:88px!important;
  }
  .qs-hero:has(.qs-mark){
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 72px;
    column-gap:16px;
    align-items:start;
  }
  .qs-hero:has(.qs-mark) > .qs-mark{
    position:relative!important;
    grid-column:2;
    grid-row:1;
    top:auto!important;
    right:auto!important;
    width:72px!important;
    height:auto;
    opacity:1;
    margin:0;
  }
  .qs-hero:has(.qs-mark) > .qs-eye{grid-column:1}
  .qs-hero:has(.qs-mark) > .qs-title,
  .qs-hero:has(.qs-mark) > .qs-cols,
  .qs-hero:has(.qs-mark) > .qs-more{grid-column:1 / -1}
  section.works{padding-top:0!important}
  main.wx{padding-top:88px!important}
  article.doc{padding-top:88px!important}
}

/* Títulos de secção, um só tamanho, em todas as páginas. A frase principal da Home fica de fora. */
:root{
  --title:clamp(32px,3.4vw,48px);
}
h1.qs-title,
h2.qs-title,
.move > .qs-title,
.how > .qs-title,
#habilitacoes > .qs-title,
.qs-hero > .qs-title{
  font-family:Geist,sans-serif!important;
  font-weight:600!important;
  font-size:var(--title)!important;
  max-width:none!important;
  line-height:1.1!important;
  letter-spacing:-.02em!important;
}

/* Fundo único, branco puro. O contacto preto fica de fora. */
:root{--bg:#FFFFFF!important}
html,body,main,.cover,.stage,.ab,.wx,article.doc{background:#FFFFFF!important;background-color:#FFFFFF!important}
#fazemos{background:transparent!important;background-color:transparent!important}
html body bright-contacto#contacto.bright-contacto{background:#0A0A0A!important;background-color:#0A0A0A!important}

/* Espaço antes do contacto = espaço entre secções (120 / 72).
   A página Contacto não leva esta folga. O guard do componente zera a margem;
   a especificidade extra volta a pô-la. O padding de .ab e do artigo legal não soma. */
@media (min-width:861px){
  html body bright-contacto#contacto.bright-contacto.bright-contacto{margin-top:120px!important}
  .ab,article.doc{padding-bottom:0!important}
}
@media (max-width:860px){
  html body bright-contacto#contacto.bright-contacto.bright-contacto{margin-top:72px!important}
  .ab,article.doc{padding-bottom:0!important}
}
html body main#conteudo:not(:has(section)) > bright-contacto#contacto.bright-contacto.bright-contacto{margin-top:0!important}

/* Cards: cantos retos, contorno fino, sem sombra. */
#fazemos .vm__i,
#funcionalidades .vm__i,
#escalas .vm__i{
  background:#fff!important;
  border:1px solid #E0E0E0!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:32px!important;
}
#fazemos .sol-tags li{
  border-radius:0!important;
  box-shadow:none!important;
}
#funcionalidades > .vm{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
}
#escalas > .vm{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
}
#funcionalidades .vm__n,
#escalas .vm__n{
  margin:0 0 14px!important;
  font-family:'IBM Plex Mono',ui-monospace,monospace!important;
  font-weight:400!important;
  font-size:12px!important;
  line-height:1!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  color:#0A0A0A!important;
}
#funcionalidades .vm h3,
#escalas .vm h3{
  margin:0 0 12px!important;
  font-family:Geist,sans-serif!important;
  font-weight:600!important;
  font-size:22px!important;
  line-height:1.25!important;
  letter-spacing:-.02em!important;
  text-transform:none!important;
  color:#0A0A0A!important;
  padding:0!important;
}
#funcionalidades .vm .t100,
#escalas .vm .t100{
  margin:0!important;
  color:#555!important;
}
@media (max-width:860px){
  #funcionalidades > .vm,
  #escalas > .vm{grid-template-columns:1fr!important}
  #fazemos .vm__i,#funcionalidades .vm__i,#escalas .vm__i{padding:24px!important}
}
