/* PR-VIBECURB-07 · Gate 5.1 — reflow defensivo em 360/390 px portrait. */

@media (max-width: 420px) and (orientation: portrait) {
  .vb-header__inner,
  .vb-header__inner > *,
  .vb-brand,
  .vb-menu-button,
  .vb-section,
  .vb-section .vb-container,
  .vb-section [class*="__frame"],
  .vb-section [class*="__intro"],
  .vb-section [class*="__header"],
  .vb-section [class*="__footer"],
  .vb-footer__grid,
  .vb-footer__grid > * {
    min-width: 0;
    max-width: 100%;
  }

  .vb-header__inner {
    gap: .55rem;
  }

  .vb-brand {
    flex: 1 1 auto;
    overflow: hidden;
  }

  .vb-brand__logo {
    width: min(132px, 38vw);
    max-width: 100%;
  }

  .vb-menu-button {
    flex: 0 1 min(172px, 49vw);
  }

  .vb-menu-button__folio strong,
  .vb-menu-button__action span {
    min-width: 0;
    overflow-wrap: break-word;
  }

  .vb-hero__mast,
  .vb-evidence-sheet header,
  .vb-evidence-sheet footer,
  #gestao .vb-evidence-room__board > header,
  #professores .vb-notebook__attachment > header,
  #professores .vb-notebook__attachment footer,
  #planos .vb-access__institutional > footer,
  .vb-footer__bottom {
    flex-wrap: wrap;
  }

  .vb-evidence-sheet--hero {
    width: calc(100% - 1.35rem);
    max-width: 100%;
    margin-right: 0;
  }

  .vb-evidence-sheet__index {
    left: -1.15rem;
  }

  .vb-evidence-sheet__metric,
  #gestao .vb-evidence-room__metrics,
  #gestao .vb-evidence-room__cases,
  #gestao .vb-evidence-room__history,
  #professores .vb-notebook__attachment dl,
  #planos .vb-access__header,
  #planos .vb-access__individual-paths,
  .vb-footer__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #gestao .vb-evidence-room__instruments {
    grid-template-columns:
      minmax(0, .9fr)
      minmax(0, 1.16fr)
      minmax(0, .94fr);
  }

  #gestao .vb-evidence-room__instruments article,
  #gestao .vb-evidence-room__instruments button,
  #gestao .vb-evidence-room__board,
  #gestao .vb-evidence-room__panel,
  #professores .vb-notebook__entries li,
  #professores .vb-notebook__attachment,
  #luma .vb-interpretive-layer__inputs article,
  #luma .vb-interpretive-layer__outputs article,
  #luma .vb-interpretive-layer__core,
  #planos .vb-access__institutional,
  #planos .vb-access__appendix {
    min-width: 0;
    max-width: 100%;
  }

  #gestao .vb-evidence-room__instruments button,
  #gestao .vb-evidence-room__mobile-label {
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }

  #gestao .vb-evidence-room__board *,
  #professores .vb-notebook__attachment *,
  #planos .vb-access__institutional *,
  #planos .vb-access__appendix *,
  .vb-footer__contact a {
    overflow-wrap: anywhere;
  }

  #luma .vb-interpretive-layer__actions {
    grid-template-columns:
      minmax(0, .9fr) auto
      minmax(0, .9fr) auto
      minmax(0, .85fr) auto
      minmax(0, 1.35fr);
    max-width: 100%;
  }

  #luma .vb-interpretive-layer__actions > span {
    min-width: 0;
    white-space: normal;
    overflow-wrap: break-word;
  }

  #luma .vb-interpretive-layer__actions b {
    min-width: 0;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
    letter-spacing: .035em;
  }

  #luma .vb-interpretive-layer__actions i {
    min-width: .35rem;
  }

  #planos .vb-access__header > div {
    border-right: 0;
  }

  #planos .vb-access__header > div:not(:last-child) {
    border-bottom: 1px solid rgba(242, 236, 221, .22);
  }

  #planos .vb-access__appendix {
    box-shadow: -7px 8px 0 rgba(34, 183, 173, .28);
  }

  .vb-footer__contact a,
  .vb-footer__bottom {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* Gate 5.2 — landscape com pouca altura, sem comprimir conteúdo ou controles. */
@media (max-width: 1080px) and (max-height: 520px) and (orientation: landscape) {
  :root {
    --vb-header-h: 56px;
  }

  body.vb-page {
    padding-top: var(--vb-header-h);
  }

  .vb-header {
    height: var(--vb-header-h);
  }

  .vb-header__inner {
    min-height: var(--vb-header-h);
    padding-block: .25rem;
  }

  /* Gate 5.4 — em zoom 200%, usa o símbolo compacto sem esmagar o lockup horizontal. */
  .vb-brand {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
  }

  .vb-brand__logo {
    display: none;
  }

  .vb-brand__mark {
    display: block !important;
    width: 38px;
    height: 38px;
    object-fit: contain;
  }

  .vb-menu-button {
    min-height: 42px;
    padding-block: .25rem;
  }

  .vb-nav.vb-nav--mobile-portal {
    top: calc(var(--vb-header-h) + 4px);
    max-height: calc(100dvh - var(--vb-header-h) - 8px);
    padding: .45rem;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .vb-nav.vb-nav--mobile-portal a {
    min-height: 36px;
    padding-block: .42rem;
  }

  .vb-section {
    padding-block: clamp(2.5rem, 8vh, 3.25rem);
    scroll-margin-top: calc(var(--vb-header-h) + .5rem);
  }

  .vb-hero,
  .vb-hero__cover {
    min-height: auto;
  }

  .vb-hero {
    overflow: visible;
  }

  .vb-hero__cover {
    padding-block: .75rem 1.35rem;
  }

  .vb-hero__cover .vb-kicker {
    margin-block: .8rem .45rem;
  }

  .vb-hero__continue {
    margin-top: 1.4rem;
    margin-bottom: .6rem;
  }

  .vb-hero__continuation {
    padding-block: 1.75rem 1.25rem;
    scroll-margin-top: calc(var(--vb-header-h) + .5rem);
  }

  #gestao .vb-evidence-room__desk,
  #gestao .vb-evidence-room__board,
  #gestao .vb-evidence-room__panel,
  #luma .vb-interpretive-layer__core {
    min-width: 0;
    max-width: 100%;
  }

  #gestao .vb-evidence-room__board > header,
  #gestao .vb-evidence-room__panel > * {
    max-width: 100%;
  }

  #luma .vb-interpretive-layer__core {
    min-height: 430px;
  }

  :is(
    #gestao .vb-evidence-room__header,
    #professores .vb-notebook__header,
    #luma .vb-interpretive-layer__header,
    #governanca .vb-protocol__header,
    #implementacao .vb-activation__header,
    #planos .vb-access__header
  ) > div:nth-child(1) {
    --vb-motion-delay: 0ms !important;
  }

  :is(
    #gestao .vb-evidence-room__header,
    #professores .vb-notebook__header,
    #luma .vb-interpretive-layer__header,
    #governanca .vb-protocol__header,
    #implementacao .vb-activation__header,
    #planos .vb-access__header
  ) > div:nth-child(2) {
    --vb-motion-delay: 35ms !important;
  }

  :is(
    #gestao .vb-evidence-room__header,
    #professores .vb-notebook__header,
    #luma .vb-interpretive-layer__header,
    #governanca .vb-protocol__header,
    #implementacao .vb-activation__header,
    #planos .vb-access__header
  ) > div:nth-child(3) {
    --vb-motion-delay: 70ms !important;
  }

  :is(
    #gestao .vb-evidence-room__intro,
    #professores .vb-notebook__intro,
    #luma .vb-interpretive-layer__intro,
    #governanca .vb-protocol__intro,
    #implementacao .vb-activation__intro,
    #planos .vb-access__intro
  ) > :first-child {
    --vb-motion-delay: 110ms !important;
  }

  :is(
    #gestao .vb-evidence-room__intro,
    #professores .vb-notebook__intro,
    #luma .vb-interpretive-layer__intro,
    #governanca .vb-protocol__intro,
    #implementacao .vb-activation__intro,
    #planos .vb-access__intro
  ) > h2 {
    --vb-motion-delay: 170ms !important;
  }
}
