/* =============================================================================
   Verthus — quem-somos.css (frente Verthus Geral, azul-marinho). Carregamento
   diferido. Blocos próprios de /quem-somos; hero, réguas, grade de células,
   fechamento e rodapé vêm do critical.css, base.css, components.css e home.css.
   ============================================================================= */

/* Item atual do menu */
.nav-links a[aria-current="page"] { opacity: 1; text-decoration: underline; text-underline-offset: 6px; }

/* Bloco de texto em duas colunas: título à esquerda, texto à direita */
.qs-bloco {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 24px 64px;
  align-items: start;
}
.qs-texto { display: flex; flex-direction: column; gap: 16px; max-width: 60ch; }
.qs-texto p { font-size: 17px; color: var(--c-texto-2); }
.qs-texto .qs-destaque {
  margin-top: 12px;
  padding-top: 24px;
  border-top: var(--regua) solid var(--c-pri);
  font-family: var(--font-titulo);
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.3;
  color: var(--c-texto);
  max-width: 34ch;
}
.qs-rodape-bloco {
  margin-top: 28px;
  font-family: var(--font-titulo);
  font-size: 22px;
  line-height: 1.3;
  max-width: 40ch;
}

/* 03 — O que a gente faz diferente: três "não" e um "sim" */
.qs-nao { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr); }
.qs-nao > div {
  padding: 24px 20px;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 16px;
  font-weight: 500;
  background: var(--cinza-claro);
  color: var(--c-texto-2);
}
.qs-nao .comp__traco { margin-top: 1px; }
.qs-nao > .qs-sim {
  background: var(--c-pri);
  color: var(--branco);
  font-family: var(--font-titulo);
  font-weight: 700;
  font-size: clamp(20px, 1.8vw, 24px);
  line-height: 1.3;
}
.qs-sim .ic { width: 20px; height: 20px; stroke-width: 2.5; margin-top: 5px; }

/* 04 — Como a gente trabalha: comportamentos numerados */
.qs-valores { list-style: none; margin: 0; padding: 0; }
.qs-valor {
  padding: 28px 22px 26px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 240px;
}
.qs-valor__n {
  font-family: var(--font-titulo);
  font-weight: 700;
  font-size: 44px;
  line-height: 1;
  color: var(--c-pri);
  letter-spacing: -0.02em;
}
.qs-valor p:not(.qs-valor__n) { font-size: 15px; line-height: 1.55; color: var(--c-texto-2); }
.qs-valor strong { font-weight: 600; color: var(--c-texto); }
.qs-valor--destaque { background: var(--c-pri); }
.qs-valor--destaque .qs-valor__n,
.qs-valor--destaque p:not(.qs-valor__n),
.qs-valor--destaque strong { color: var(--branco); }

/* 05 — Quem cuida */
.qs-pessoa {
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--branco);
}
.qs-pessoa h3 {
  font-family: var(--font-titulo);
  font-weight: 700;
  font-size: 26px;
  line-height: 1.2;
}
.qs-pessoa p { font-size: 15px; color: var(--c-texto-2); }
.qs-crc {
  margin-top: 28px;
  padding: 18px 22px;
  background: var(--branco);
  border-left: var(--regua) solid var(--c-pri);
  font-size: 16px;
  max-width: 72ch;
}
.qs-crc strong { font-weight: 600; }

/* 06 — Onde estamos */
.qs-onde .link-seta { font-size: 15px; }
.qs-onde .link-seta .ic { width: 14px; height: 14px; stroke-width: 2.5; }
.qs-onde__links { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }

/* ---------- Responsivo ---------- */
@media (max-width: 960px) {
  .qs-bloco { grid-template-columns: 1fr; }
  .qs-nao { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .qs-nao > .qs-sim { grid-column: 1 / -1; }
  .qs-valores.cells--5 > .qs-valor--destaque { grid-column: 1 / -1; min-height: 0; }
}
@media (max-width: 640px) {
  .qs-nao { grid-template-columns: 1fr; }
  .qs-valor { min-height: 0; }
}
