/* Mobile: retrato limpo em banda propria; copy separada em fundo solido. */
@media (max-width: 767px) {
  #root > main > header:first-child {
    min-height: 0 !important;
    overflow: hidden;
    background: #321c14;
  }

  #root > main > header:first-child > picture {
    position: relative;
    z-index: 0;
    display: block;
    width: 100%;
    height: 42svh;
    min-height: 320px;
    max-height: 390px;
    overflow: hidden;
  }

  #root > main > header:first-child > picture > img {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 7% !important;
  }

  /* Gradiente restrito a base da foto, apenas para transicao. */
  #root > main > header:first-child > picture + div {
    position: absolute !important;
    z-index: 1 !important;
    inset: auto 0 auto 0 !important;
    top: calc(min(max(42svh, 320px), 390px) - 92px) !important;
    width: 100%;
    height: 92px;
    background: linear-gradient(to bottom, transparent, #321c14) !important;
    pointer-events: none;
  }

  #root > main > header:first-child > picture + div + div {
    position: relative;
    z-index: 2;
    display: block !important;
    min-height: 0 !important;
    padding-top: 20px !important;
    padding-bottom: 38px !important;
    background: #321c14;
  }

  #root > main > header:first-child h1 {
    text-shadow: none;
  }
}