/* Camada editorial D3 do site público. Carregar apenas nas páginas institucionais;
   não participa da cotação, área do cliente, portal, proposta ou painel. */

#conteudo.cm-editorial {
  --cm-editorial-measure: 68ch;
}

#conteudo.cm-editorial > .hero-curto {
  min-height: clamp(28rem, 58vw, 42rem);
  align-items: flex-end;
  background: var(--cm-surface-dark-deep);
}

#conteudo.cm-editorial > .hero-curto::after {
  background:
    linear-gradient(90deg, rgb(11 13 16 / 88%) 0%, rgb(11 13 16 / 54%) 58%, rgb(11 13 16 / 8%) 100%),
    linear-gradient(0deg, rgb(11 13 16 / 72%) 0%, transparent 68%);
}

#conteudo.cm-editorial > .hero-curto .contem {
  padding-block: clamp(64px, 9vw, 112px);
}

#conteudo.cm-editorial > .hero-curto .sobre-titulo {
  color: var(--cm-on-dark-muted);
}

#conteudo.cm-editorial > .hero-curto h1 {
  max-width: 14ch;
  font-size: clamp(2.7rem, 6.5vw, 5rem);
  color: var(--cm-on-dark);
}

#conteudo.cm-editorial > .hero-curto .lead {
  max-width: var(--cm-editorial-measure);
  color: var(--cm-on-dark-muted);
}

#conteudo.cm-editorial > .secao {
  position: relative;
}

#conteudo.cm-editorial > .secao:not(.secao-alt) {
  background: var(--cm-canvas);
}

#conteudo.cm-editorial > .secao-alt {
  background: var(--cm-canvas-parchment);
}

#conteudo.cm-editorial .cabeca h2,
#conteudo.cm-editorial .grade-2 h2 {
  max-width: 19ch;
}

#conteudo.cm-editorial .grade-2 .lead {
  max-width: var(--cm-editorial-measure);
}

#conteudo.cm-editorial .foto,
#conteudo.cm-editorial .card,
#conteudo.cm-editorial .galeria figure {
  border-radius: var(--cm-radius-md);
  background: var(--cm-surface);
}

#conteudo.cm-editorial .foto img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

#conteudo.cm-editorial .card {
  border: 1px solid var(--cm-hairline);
}

#conteudo.cm-editorial .card img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

#conteudo.cm-editorial .lista {
  gap: var(--cm-space-3);
}

#conteudo.cm-editorial .lista li {
  max-width: 64ch;
  padding-block: 3px;
}

#conteudo.cm-editorial .etapas {
  gap: var(--cm-space-2);
}

#conteudo.cm-editorial .etapas li {
  border: 1px solid var(--cm-hairline);
  border-radius: var(--cm-radius-md);
}

#conteudo.cm-editorial .cta-faixa {
  background: var(--cm-surface-dark);
}

#conteudo.cm-editorial .cta-faixa .contem {
  padding-block: clamp(52px, 8vw, 88px);
}

#conteudo.cm-editorial .documento-legal {
  margin-inline: auto;
  padding-block: clamp(48px, 7vw, 80px);
  max-width: var(--cm-reading-width);
}

#conteudo.cm-editorial .documento-legal :is(p, li) {
  line-height: 1.75;
}

/* Composição da home aprovada: texto e etapas à esquerda, peça conceitual à direita. */
#conteudo.cm-home > .hero-home-conceitual {
  min-height: clamp(42rem, 78vh, 54rem);
  align-items: center;
  background: var(--cm-surface-dark-deep);
}

#conteudo.cm-home > .hero-home-conceitual picture {
  left: auto;
  width: min(62%, 1100px);
}

#conteudo.cm-home > .hero-home-conceitual picture img {
  object-position: center;
}

#conteudo.cm-home > .hero-home-conceitual::after {
  background:
    linear-gradient(90deg, rgb(11 13 16 / 98%) 0%, rgb(11 13 16 / 94%) 38%, rgb(11 13 16 / 72%) 61%, rgb(11 13 16 / 18%) 100%),
    linear-gradient(0deg, rgb(11 13 16 / 55%) 0%, transparent 58%);
}

#conteudo.cm-home > .hero-home-conceitual .contem {
  padding-block: clamp(72px, 11vh, 132px);
}

#conteudo.cm-home > .hero-home-conceitual h1 {
  max-width: 10ch;
  font-size: clamp(3rem, 7vw, 5.5rem);
}

#conteudo.cm-home > .hero-home-conceitual .lead {
  max-width: 58ch;
}

#conteudo.cm-home > .hero-home-conceitual .passos-card {
  align-self: center;
  border: 1px solid var(--cm-hairline-dark);
  border-radius: var(--cm-radius-lg);
  background: rgb(11 13 16 / 74%);
  box-shadow: none;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

#conteudo.cm-home > .hero-home-conceitual .passos-card li::before {
  background: var(--cm-action);
  color: var(--cm-on-action);
}

#conteudo.cm-home > .secao:nth-of-type(odd):not(.secao-alt) {
  background: var(--cm-canvas-parchment);
}

#conteudo.cm-home .como-cards li {
  border: 1px solid var(--cm-hairline);
  border-radius: var(--cm-radius-md);
  background: var(--cm-surface);
}

@media (max-width: 900px) {
  #conteudo.cm-home > .hero-home-conceitual picture {
    width: 74%;
  }

  #conteudo.cm-home > .hero-home-conceitual::after {
    background:
      linear-gradient(90deg, rgb(11 13 16 / 96%) 0%, rgb(11 13 16 / 86%) 56%, rgb(11 13 16 / 36%) 100%),
      linear-gradient(0deg, rgb(11 13 16 / 76%) 0%, transparent 64%);
  }
}

@media (max-width: 640px) {
  #conteudo.cm-editorial > .hero-curto {
    min-height: min(72vh, 38rem);
  }

  #conteudo.cm-editorial > .hero-curto::after {
    background:
      linear-gradient(90deg, rgb(11 13 16 / 78%), rgb(11 13 16 / 38%)),
      linear-gradient(0deg, rgb(11 13 16 / 78%) 0%, transparent 68%);
  }

  #conteudo.cm-editorial > .hero-curto .contem {
    padding-block: 56px 48px;
  }

  #conteudo.cm-home > .hero-home-conceitual {
    min-height: auto;
    align-items: flex-end;
  }

  #conteudo.cm-home > .hero-home-conceitual picture {
    inset: 0 0 auto auto;
    width: 100%;
    height: min(58vh, 440px);
  }

  #conteudo.cm-home > .hero-home-conceitual::after {
    background:
      linear-gradient(180deg, rgb(11 13 16 / 12%) 0%, rgb(11 13 16 / 42%) 30%, rgb(11 13 16 / 96%) 56%, #0b0d10 100%);
  }

  #conteudo.cm-home > .hero-home-conceitual .contem {
    padding-block: clamp(250px, 51vh, 410px) 40px;
  }

  #conteudo.cm-home > .hero-home-conceitual h1 {
    max-width: 12ch;
    font-size: clamp(2.7rem, 12vw, 4rem);
  }

  #conteudo.cm-home > .hero-home-conceitual .hero-duas {
    gap: 22px;
  }

  #conteudo.cm-home > .hero-home-conceitual .passos-card {
    background: rgb(19 22 26 / 92%);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  #conteudo.cm-home .hero-conceitual-aviso {
    max-width: calc(100% - 72px);
  }
}

@media (prefers-reduced-motion: reduce) {
  #conteudo.cm-editorial *,
  #conteudo.cm-editorial *::before,
  #conteudo.cm-editorial *::after {
    scroll-behavior: auto;
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

@media (forced-colors: active) {
  #conteudo.cm-editorial .card,
  #conteudo.cm-editorial .etapas li,
  #conteudo.cm-editorial .foto {
    border: 1px solid CanvasText;
  }
}