/* Correções resultantes da auditoria de layout e acessibilidade. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(177, 138, 85, 0.55);
  outline-offset: 3px;
}

.floating-note {
  left: 0;
  max-width: calc(100% - 40px);
}

/* Todas as fotografias ficam contidas no respetivo enquadramento. */
.hero-frame,
.portrait-frame,
.experience-image,
.gallery-item {
  overflow: hidden;
}

.hero-frame img,
.portrait-frame img,
.experience-image img,
.gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* A moldura do hero acompanha os quatro lados da fotografia. */
.hero-frame {
  overflow: visible;
}

.hero-frame::before {
  inset: -12px;
  pointer-events: none;
}

.hero-frame img {
  overflow: hidden;
}

.quote-mark {
  right: 0;
}

.whatsapp-float {
  font: 700 18px var(--sans);
}

@media (max-width: 950px) {
  .site-header nav {
    max-height: calc(100vh - 82px);
    overflow: auto;
    box-shadow: 0 18px 30px rgba(50, 20, 28, 0.12);
  }

  .hero-media {
    min-height: 0;
    height: auto;
    padding-top: 34px;
  }

  .hero-frame {
    width: 100%;
    height: auto;
    max-height: none;
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 620px) {
  .site-header nav {
    max-height: calc(100vh - 70px);
  }

  .floating-note {
    left: 11px;
    max-width: calc(100% - 22px);
  }

  .hero-media {
    min-height: 0;
    padding-top: 26px;
  }

  .hero-frame {
    height: auto;
    aspect-ratio: 4 / 5;
  }

  .hero-frame img {
    object-position: 58% center;
  }

  .quote-mark {
    right: 0;
  }
}