/* Correções responsivas e proteção contra overflow horizontal. */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

main,
section,
header,
footer,
nav,
div,
article,
address {
  min-width: 0;
}

img,
video,
iframe {
  max-width: 100%;
}

@media (max-width: 850px) {
  .nav {
    width: 100%;
    padding-inline: 20px;
  }

  .nav nav.mobile-open {
    width: 100%;
    max-height: calc(100svh - 72px);
    overflow-y: auto;
  }

  .hero {
    width: 100%;
    min-height: 700px;
  }

  .hero-content {
    max-width: calc(100% - 48px);
  }

  .hero-content,
  .hero-content > *,
  .page-hero > * {
    min-width: 0;
    overflow-wrap: break-word;
  }

  .hero-actions,
  .home-cta > div,
  .location-actions {
    width: 100%;
  }

  .hero-actions .button,
  .home-cta .button,
  .location-actions .button {
    width: 100%;
    max-width: 390px;
    padding-inline: 16px;
    text-align: center;
  }

  .trust {
    width: auto;
    max-width: calc(100% - 48px);
  }

  .trust > div {
    min-width: 0;
    flex: 1 1 0;
  }

  .trust strong,
  .trust small {
    overflow-wrap: anywhere;
  }

  .manifest,
  .video-story,
  .split-story,
  .location,
  .photo-space,
  .process,
  .page-hero,
  .home-cta {
    width: 100%;
  }

  .video-frame,
  .video-frame video,
  .image-placeholder,
  .image-placeholder img,
  .map-wrap,
  .map-wrap iframe {
    width: 100%;
  }

  .video-frame video {
    aspect-ratio: 4 / 3;
  }

  .feature-grid,
  .feature,
  .photo-slots,
  .photo-slots button,
  .values,
  .treatment-cards,
  .treatment-cards article,
  .process > div,
  .contact-strip {
    width: 100%;
    max-width: 100%;
  }

  .feature:hover {
    transform: none;
  }

  .treatment-cards article {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 10px;
  }

  .treatment-cards small,
  .location address a,
  footer a,
  footer p {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .place-number {
    right: 20px;
    max-width: calc(100% - 40px);
  }

  .map-wrap {
    overflow: hidden;
  }

  footer,
  footer > div {
    width: 100%;
    max-width: 100%;
  }

  footer > div {
    gap: 14px 22px;
  }
}

@media (max-width: 390px) {
  .hero-content {
    margin-inline: 18px;
    max-width: calc(100% - 36px);
  }

  .trust {
    left: 18px;
    right: 18px;
    max-width: calc(100% - 36px);
  }

  .trust > div {
    padding: 10px;
  }

  .trust strong {
    font-size: 23px;
  }

  .trust small {
    font-size: 9px;
    line-height: 1.35;
  }

  .page-hero,
  .manifest,
  .video-story,
  .split-story,
  .location-info,
  .photo-space,
  .process,
  .home-cta,
  .treatment-cards {
    padding-inline: 18px;
  }

  .button {
    white-space: normal;
  }
}