/*
 * Ajustes exclusivos para monitores widescreen e ultrawide.
 * Nenhuma regra deste arquivo altera resoluções abaixo de 1600 px.
 */

@media (min-width: 1600px) {
  :root {
    --widescreen-content: 82.5rem;
    --widescreen-editorial-shell: 92.5rem;
    --widescreen-surface: 113.75rem;
    --widescreen-edge: max(
      5rem,
      calc((100% - var(--widescreen-content)) / 2)
    );
    --widescreen-surface-padding: max(
      5rem,
      calc(
        (
            min(100vw - 1.875rem, var(--widescreen-surface)) -
              var(--widescreen-content)
          ) /
          2
      )
    );
  }

  /*
   * Faixa superior, header e conteúdos da hero compartilham o mesmo
   * eixo central, enquanto imagens e fundos continuam em largura total.
   */
  .announcement-bar,
  .site-header {
    padding-right: var(--widescreen-edge);
    padding-left: var(--widescreen-edge);
  }

  .hero-message {
    left: var(--widescreen-edge) !important;
  }

  .simulation-note {
    right: var(--widescreen-edge) !important;
  }

  .hero-copy {
    right: auto !important;
    left: var(--widescreen-edge) !important;
  }

  .hero-message h1 {
    font-size: clamp(3.2rem, 3.2vw, 4rem) !important;
  }

  .procedure-hero-v2__content {
    left: var(--widescreen-edge);
  }

  .local-hero .procedure-hero-v2__content,
  .local-hero h1 {
    width: min(calc(50vw - 1rem), 50rem) !important;
    max-width: calc(50vw - 1rem) !important;
  }

  .procedure-hero-v2__scroll {
    right: var(--widescreen-edge);
  }

  /*
   * Páginas de tratamentos e páginas editoriais passam a usar a mesma
   * coluna interna de 1320 px presente na home.
   */
  .procedure-overview,
  .procedure-related {
    width: min(
      calc(100% - 1.875rem),
      var(--widescreen-editorial-shell)
    );
  }

  /*
   * Mantém os fundos amplos das seções de conversão, FAQ e conteúdos
   * relacionados, contendo apenas seus elementos internos.
   */
  .procedure-conversion,
  .procedure-faq,
  .local-related-pages {
    padding-right: var(--widescreen-surface-padding);
    padding-left: var(--widescreen-surface-padding);
  }

  /*
   * Corrige o padding percentual que podia tornar o FAQ da home maior
   * do que o limite visual da própria seção em telas ultrawide.
   */
  .faq-section {
    width: calc(100% - 1.875rem) !important;
    max-width: var(--widescreen-surface) !important;
    padding-right: var(--widescreen-surface-padding) !important;
    padding-left: var(--widescreen-surface-padding) !important;
  }
}

@media (min-width: 2200px) {
  /*
   * Em ultrawide, a hero das páginas internas ganha mais altura para
   * evitar uma faixa excessivamente panorâmica sem alterar sua imagem.
   */
  .procedure-hero-v2 {
    height: min(60rem, calc(100svh - 1.875rem));
  }
}