/* Ajustes isolados do modelo Home 3. */

/*
 * Imagem principal do hero.
 * A moldura participa do fluxo para continuar selecionável no Editor do Site.
 * O card permanece sobreposto por uma camada independente.
 */
.vpv-home3-portrait {
  position: relative;
  min-height: 0;
  padding-bottom: 2.75rem;
}

.vpv-home3-portrait-frame {
  position: relative !important;
  inset: auto !important;
  z-index: 1;
  width: 100%;
  min-height: 520px;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  isolation: isolate;
}

.vpv-home3-portrait-frame > .wp-block-image,
.vpv-home3-portrait-frame figure,
.vpv-home3-portrait-frame picture {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  overflow: hidden;
  border-radius: inherit;
}

.vpv-home3-portrait-frame img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
}

.vpv-home3-quote {
  position: absolute !important;
  z-index: 10;
  left: -2rem;
  bottom: 0;
  width: min(260px, 75%);
  margin: 0;
  transform: none;
  pointer-events: auto;
}

/*
 * Retrato circular da seção Sobre.
 * Mantido como estava, pois o enquadramento já está correto.
 */
.vpv-home3-about-photo {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}

.vpv-home3-about-photo > .wp-block-image,
.vpv-home3-about-photo figure,
.vpv-home3-about-photo picture {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  overflow: hidden;
  border-radius: 50%;
}

.vpv-home3-about-photo img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
  border-radius: 50%;
}

/* Facilita selecionar a moldura vazia no editor sem exibir instruções no site. */
.editor-styles-wrapper .vpv-home3-portrait-frame:empty {
  min-height: 520px;
  outline: 2px dashed rgba(35, 78, 82, 0.25);
  outline-offset: -10px;
}

@media (max-width: 781px) {
  .vpv-home3-portrait {
    padding-bottom: 4rem;
  }

  .vpv-home3-portrait-frame {
    min-height: 420px;
  }

  .vpv-home3-quote {
    left: 0.75rem;
    right: 0.75rem;
    bottom: 0;
    width: auto;
  }

  .editor-styles-wrapper .vpv-home3-portrait-frame:empty {
    min-height: 420px;
  }
}
