/* Refuerzo para pantallas táctiles, tabletas y zonas seguras de dispositivos móviles. */
img { max-width: 100%; }

button, a, input, textarea { touch-action: manipulation; }

@media (max-width: 850px) {
  .site-header {
    padding-left: max(1.35rem, env(safe-area-inset-left));
    padding-right: max(1.35rem, env(safe-area-inset-right));
  }

  .nav-toggle {
    min-width: 44px;
    min-height: 44px;
    display: grid;
    place-content: center;
  }

  .site-header nav,
  body.on-dark-panel .site-header nav {
    color: var(--ink);
    background: #fff;
  }

  .site-header nav a {
    display: flex;
    align-items: center;
    min-height: 44px;
  }

  body.on-dark-panel .site-header nav .nav-cta {
    border-color: var(--ink);
  }

  .hero-copy { max-width: 42rem; }
  .hero-portrait {
    height: auto;
    margin: 1rem auto 2.5rem;
  }

  .hero-portrait img {
    height: auto !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center top;
  }

  .portrait-note {
    bottom: -1.3rem;
    max-width: calc(100% - 1rem);
  }
  .contact-form { width: 100%; }
  .contact-form input,
  .contact-form textarea { min-height: 44px; }
  .contact-form textarea { min-height: 100px; }
}

@media (max-width: 480px) {
  .site-header { gap: .5rem; }
  .brand { gap: .45rem; }
  .brand-mark { font-size: 1.45rem; }
  .hero { padding-left: 1.1rem; padding-right: 1.1rem; }
  .section { padding-left: 1.1rem; padding-right: 1.1rem; }
  .hero h1 { font-size: clamp(2.45rem, 14vw, 3.25rem); }
  .trust-list { row-gap: .35rem; }
  .service-grid article { min-height: 164px; }
  .portrait-note { left: -.35rem; }
}

@media (max-height: 650px) and (min-width: 851px) {
  .hero-portrait { height: min(62svh, 440px); }
  .hero { padding-top: 5.3rem; }
}