/* PR-VIBECURB-07 · Gate 5.5 — fonte ampliada do navegador no hero desktop. */

@media (min-width: 1081px) {
  .vb-hero__action-block,
  .vb-hero__actions,
  .vb-hero__actions .vb-button,
  .vb-hero__actions .vb-link-arrow,
  .vb-hero__teacher-path,
  .vb-hero__teacher-path a,
  .vb-evidence-sheet--hero .vb-evidence-sheet__metric {
    min-width: 0;
    max-width: 100%;
  }

  .vb-hero__actions .vb-button {
    width: 100%;
    height: auto;
    justify-content: flex-start;
    text-align: left;
  }

  .vb-hero__actions .vb-button,
  .vb-hero__actions .vb-link-arrow,
  .vb-hero__teacher-path a {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.35;
  }

  .vb-hero__actions .vb-link-arrow {
    flex-wrap: wrap;
  }

  /* Mantém a coluna automática original: o número define a própria largura. */
  .vb-evidence-sheet--hero .vb-evidence-sheet__metric strong {
    font-size: clamp(72px, 7vw, 96px);
    white-space: nowrap;
  }

  .vb-evidence-sheet--hero .vb-evidence-sheet__metric span,
  .vb-evidence-sheet--hero .vb-evidence-sheet__metric small {
    min-width: 0;
    overflow-wrap: anywhere;
  }
}

/*
 * A fonte ampliada aumenta textos e paddings do rail, mas a largura original
 * permanece fixa em 74px. Esta faixa acompanha a escala sem cortar os rótulos.
 */
@media (min-width: 1081px) and (max-width: 82em) {
  :root {
    --vb-rail-collapsed: 5.25rem;
  }

  .vb-rail {
    width: var(--vb-rail-collapsed);
  }

  main,
  .vb-footer {
    margin-left: var(--vb-rail-collapsed);
  }

  .vb-rail a {
    grid-template-columns: 44px minmax(0, 1fr);
  }

  /*
   * O marcador permanece em uma linha; a coluna acompanha a escala da fonte
   * para que “Acompanhamento” não invada a cópia do Marco 05.
   */
  #implementacao .vb-activation__route li {
    grid-template-columns: 15rem minmax(0, 1fr);
  }

  /*
   * Os rótulos “Condição 01–05” precisam absorver a fonte e o padding ampliados
   * sem serem recortados pelo overflow defensivo das linhas do documento 08.
   */
  #planos .vb-access__clauses > div {
    grid-template-columns: 7rem minmax(0, 1fr);
  }

  /*
   * O carimbo mantém o mínimo original em 16px e cresce com a fonte ampliada,
   * evitando que “compreendido” e a nota final ultrapassem a moldura.
   */
  #contato .vb-dispatch__body {
    grid-template-columns: minmax(0, 1.5fr) minmax(max(240px, 15rem), .5fr);
  }

  /*
   * Em 24px, os quatro verbos não cabem com os separadores numa única linha.
   * A sequência mantém a ordem em duas linhas, com um conector intermediário.
   */
  #luma .vb-interpretive-layer__actions {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-template-rows: auto auto auto auto;
    column-gap: .55rem;
    row-gap: .65rem;
    align-items: center;
    translate: -40px 0;
  }

  #luma .vb-interpretive-layer__actions > span {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  #luma .vb-interpretive-layer__actions b {
    min-width: 0;
    text-align: center;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }

  #luma .vb-interpretive-layer__actions b:nth-of-type(1) {
    grid-column: 1;
    grid-row: 2;
  }

  #luma .vb-interpretive-layer__actions i:nth-of-type(1) {
    grid-column: 2;
    grid-row: 2;
  }

  #luma .vb-interpretive-layer__actions b:nth-of-type(2) {
    grid-column: 3;
    grid-row: 2;
  }

  #luma .vb-interpretive-layer__actions i:nth-of-type(2) {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: center;
    width: 2rem;
  }

  #luma .vb-interpretive-layer__actions b:nth-of-type(3) {
    grid-column: 1;
    grid-row: 4;
  }

  #luma .vb-interpretive-layer__actions i:nth-of-type(3) {
    grid-column: 2;
    grid-row: 4;
  }

  #luma .vb-interpretive-layer__actions b:nth-of-type(4) {
    grid-column: 3;
    grid-row: 4;
  }
}
