/* =========================================================
   PAGE — Quem Somos / Sobre o Grupo Hub
   ========================================================= */

.about-grupo {
  padding-block: var(--space-12);
}

.about-grupo__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-10);
  align-items: center;
}
@media (min-width: 1024px) {
  .about-grupo__grid {
    grid-template-columns: 1.2fr 1fr;
    gap: var(--space-12);
  }
}

/* Título: azul (padrão) + accent rosa em bold (segunda linha) */
.about-grupo__title {
  color: var(--color-blue);
  font-size: 32px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin: 0 0 var(--space-6);
}
@media (min-width: 768px)  { .about-grupo__title { font-size: 40px; } }
@media (min-width: 1024px) { .about-grupo__title { font-size: 48px; } }

.about-grupo__title-accent {
  display: block;
  color: var(--color-pink);
  font-weight: 700;
}

.about-grupo__paragraph {
  color: #000;
  font-size: 18px;
  line-height: 1.65;
  margin: 0 0 var(--space-5);
}
.about-grupo__paragraph:last-child { margin-bottom: 0; }
.about-grupo__paragraph--bold { font-weight: 700; }

/* Visual à direita — logo com tamanho controlado */
.about-grupo__visual {
  display: flex;
  justify-content: center;
}

.about-grupo__img {
  width: 100%;
  max-width: 486px;
  max-height: 520px;
  height: auto;
  object-fit: contain;
  display: block;
}

/* =========================================================
   O QUE NOS MOVE — foto de fundo + overlay azul
   Texto branco alinhado à esquerda
   ========================================================= */
.nos-move {
  position: relative;
  background-color: var(--color-blue);
  background-image:
    linear-gradient(90deg, rgba(31, 78, 150, 0.85), rgba(31, 78, 150, 0.6)),
    url('../../../images/hub-talent/acreditamos.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
  padding-block: var(--space-12);
}

.nos-move__eyebrow {
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.18em;
  color: rgba(255, 255, 255, 0.9);
  margin: 0 0 var(--space-5);
}

.nos-move__title {
  font-size: 28px;
  font-weight: 400;
  line-height: 1.25;
  color: #fff;
  margin: 0;
  max-width: 700px;
}
@media (min-width: 768px)  { .nos-move__title { font-size: 36px; } }
@media (min-width: 1024px) { .nos-move__title { font-size: 42px; } }

.nos-move__divider {
  border: 0;
  height: 1px;
  background: rgba(255, 255, 255, 0.5);
  margin: var(--space-8) 0;
}

.nos-move__paragraph {
  font-size: 18px;
  line-height: 1.65;
  color: #fff;
  margin: 0 0 var(--space-5);
  max-width: 1200px;
}
.nos-move__paragraph:last-child { margin-bottom: 0; }

/* =========================================================
   ADAPTAMOS — bloco azul sólido, textos brancos centralizados.
   Colado no .nos-move (sem gap entre eles).
   ========================================================= */
.adaptamos {
  background: var(--color-blue);
  color: #fff;
  padding-block: var(--space-10);
  text-align: center;
}

.adaptamos__lead {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
  color: #fff;
  margin: 0 0 var(--space-3);
}
@media (min-width: 1024px) { .adaptamos__lead { font-size: 24px; } }

.adaptamos__title {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0;
}
@media (min-width: 768px)  { .adaptamos__title { font-size: 36px; } }
@media (min-width: 1024px) { .adaptamos__title { font-size: 42px; } }

/* =========================================================
   ONE-SIZE — imagem + texto + imagem
   Mobile: 1 coluna empilhada (imagem 1, texto, imagem 2)
   Desktop ≥1024px: 3 colunas (imagem 1 | texto | imagem 2)
   ========================================================= */
.one-size {
  padding-block: var(--space-12);
}

.one-size__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-8);
  align-items: center;
}
@media (min-width: 1024px) {
  .one-size__grid {
    grid-template-columns: 1fr 1.4fr 1fr;
    gap: var(--space-10);
  }
}

.one-size__visual {
  display: flex;
  justify-content: center;
}

.one-size__img {
  width: 100%;
  max-width: 380px;
  height: auto;
  display: block;
  object-fit: contain;
}

.one-size__content {
  text-align: center;
}

.one-size__paragraph {
  font-size: 18px;
  line-height: 1.65;
  color: #000;
  margin: 0 0 var(--space-5);
}
.one-size__paragraph:last-child { margin-bottom: 0; }
.one-size__paragraph--bold { font-weight: 700; }

/* =========================================================
   FIT GERENCIAL — imagem + título mesclado (FIT rosa + gerencial azul)
   Mobile: imagem em cima, conteúdo embaixo
   Desktop ≥1024px: imagem (esquerda) + conteúdo (direita)
   ========================================================= */
.fit-block {
  padding-block: var(--space-12);
}

.fit-block__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-8);
  align-items: center;
}
@media (min-width: 1024px) {
  .fit-block__grid {
    grid-template-columns: 1fr 1.1fr;
    gap: var(--space-10);
  }
}

.fit-block__visual {
  display: flex;
  justify-content: center;
}

.fit-block__img {
  width: 100%;
  max-width: 560px;
  height: auto;
  display: block;
  object-fit: contain;
}

/* Título mesclado: "FIT" gigante rosa em cima + "gerencial" azul embaixo */
.fit-block__title {
  margin: 0 0 var(--space-6);
  line-height: 0.95;
  letter-spacing: -0.02em;
}

.fit-block__title-fit {
  display: block;
  color: var(--color-pink);
  font-weight: 700;
  font-size: 64px;
}
@media (min-width: 768px)  { .fit-block__title-fit { font-size: 88px; } }
@media (min-width: 1024px) { .fit-block__title-fit { font-size: 106px; } }

.fit-block__title-sub {
  display: block;
  color: var(--color-blue);
  font-weight: 400;
  font-size: 38px;
  margin-top: var(--space-1);
}
@media (min-width: 768px)  { .fit-block__title-sub { font-size: 52px; } }
@media (min-width: 1024px) { .fit-block__title-sub { font-size: 64px; } }

.fit-block__paragraph {
  font-size: 18px;
  line-height: 1.65;
  color: #000;
  margin: 0 0 var(--space-5);
}
.fit-block__paragraph:last-child { margin-bottom: 0; }

/* =========================================================
   GERACIONAL — intro + 3 cards com linha colorida no topo
   Mobile: 1 coluna; Tablet+: 3 colunas
   ========================================================= */
.geracional {
  padding-block: var(--space-12);
}

.geracional__intro {
  margin: 0 0 var(--space-10);
}

.geracional__paragraph {
  font-size: 20px;
  line-height: 1.65;
  color: #000;
  margin: 0 0 var(--space-5);
}
.geracional__paragraph:last-child { margin-bottom: 0; }

.geracional__cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
}
@media (min-width: 768px) {
  .geracional__cards { grid-template-columns: repeat(3, 1fr); gap: var(--space-8); }
}

.geracional-card {
  text-align: left;
}

.geracional-card__line {
  display: block;
  width: 100%;
  height: 6px;
  border-radius: 3px;
  margin-bottom: var(--space-5);
}

.geracional-card--blue   .geracional-card__line { background: var(--color-blue); }
.geracional-card--pink   .geracional-card__line { background: var(--color-pink); }
.geracional-card--purple .geracional-card__line { background: #6B5BD9; }

.geracional-card__text {
  font-size: 18px;
  line-height: 1.5;
  color: #000;
  margin: 0;
}

/* Bloco "Acreditamos..." — foto de fundo + overlay azul */
.purpose {
  background-image:
    linear-gradient(90deg, rgba(31, 78, 150, 0.78), rgba(31, 78, 150, 0.55)),
    url('../../../images/quem-somos/acreditamos.webp');
}