/* 11 · Horizonte: fotografia panorâmica, azul profundo e escala ampla. */
:root {
  --fundo: #fcfdff;
  --superficie: #eef3f9;
  --tinta: #152a42;
  --tinta-suave: #536478;
  --destaque: #215688;
  --inverso: #132940;
  --acento-claro: #c4e0fb;
}
.topo { border: 0; }
.topo .botao { border-radius: 3px; }
.hero { position: relative; isolation: isolate; padding: 74px 0 84px; background: #11243a; color: #fff; }
.hero .miolo { display: block; }
.hero__texto { max-width: 740px; gap: 25px; }
.hero__titulo { font-size: clamp(48.5px, calc(5.78 * var(--vw)), 79px); font-weight: 400; line-height: 1.06; }
.hero__destaque { display: block; color: #c4e0fb; }
.hero__lead { max-width: 53ch; color: #f0f5fb; }
.hero__proposito { max-width: 59ch; color: #d3ddeb; }
.hero .rotulo { display: flex; align-items: center; gap: 14px; color: #c4e0fb; }
.hero .rotulo::before { content: ""; width: 36px; height: 1px; background: currentColor; }
.hero__visual--foto { position: absolute; inset: 0; z-index: -2; height: 100%; border-radius: 0; }
.hero__visual img { object-position: 68% center; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10,28,49,.98) 4%, rgba(10,28,49,.92) 36%, rgba(10,28,49,.38) 100%); }
.hero__nota { right: 28px; bottom: 20px; }
.hero .botao--principal { background: #c4e0fb; color: #132940; }
.hero .botao--principal:hover { background: white; }
.hero .botao--secundario { color: white; border-color: #a1b4c8; }
.hero .botao--secundario:hover { background: #203b58; }
.numeros { background: var(--inverso); border: 0; padding: 30px 0; }
.numero { grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: center; border-color: #425369; }
.numero__valor { color: var(--acento-claro); font-size: 50.5px; }
.numero__rotulo { color: #d3ddeb; font-size: 13px; }
.mudancas .cabeca { display: grid; grid-template-columns: 1fr 2fr; }
.mudancas .rotulo { padding-top: 10px; }
.mudancas .cabeca__titulo { max-width: 26ch; }
.troca { border: 0; border-top: 1px solid var(--linha); padding: 28px 14px 28px 0; }
.jornada .miolo { padding-top: 8px; }
.sistemas__grade { gap: 30px; }
.sistema { border: 0; }
.sistema__foto { aspect-ratio: 4 / 3; }
.sistema__corpo { padding-inline: 0; }
.sistema__nome { font-size: 27.5px; }
.faixa { border-top: 2px solid var(--tinta); }
.proposito { background: var(--superficie); }
.proposito .miolo { align-items: start; grid-template-columns: 1fr 2fr; }
.proposito .rotulo { grid-row: span 3; padding-top: 10px; }
.papeis { background: var(--fundo); }
.papel { background: var(--superficie); border: 0; }
.passo { border-bottom: 8px solid var(--acento-claro); }
@media (max-width: 960px) {
  .hero__texto { max-width: 700px; }
  .numero { padding-block: 8px; }
  .mudancas .cabeca, .proposito .miolo { grid-template-columns: 1fr; }
  .proposito .rotulo { grid-row: auto; }
}
@media (max-width: 600px) {
  .hero { padding: 52px 0 68px; }
  .hero__titulo { font-size: 45px; }
  .hero::after { background: rgba(10,28,49,.88); }
  .hero__visual img { object-position: 72% center; }
  .numero { grid-template-columns: 1fr; gap: 10px; }
  .numero__valor { font-size: 44px; }
}
