/* iPhone/Safari UX path.
   Keeps Spline, canvas and CSS animation alive while making touch scroll,
   input focus and mobile viewport sizing predictable. */

html.is-ios,
html.is-ios body,
html.is-touch,
html.is-touch body {
  -webkit-text-size-adjust: 100%;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: none;
}

html {
  scroll-padding-top: 78px;
}

#progress-bar {
  contain: layout paint style;
  will-change: width;
}

html.is-ios body,
html.is-touch body {
  overflow-x: clip;
  touch-action: pan-y;
}

html.mob-menu-open,
html.mob-menu-open body {
  overflow: hidden !important;
  overscroll-behavior: none;
}

html.is-ios *,
html.is-ios *::before,
html.is-ios *::after {
  -webkit-tap-highlight-color: rgba(0, 238, 255, 0.16);
}

html.is-touch #cursor,
html.is-touch #synapseCanvas {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

html.is-touch a,
html.is-touch button,
html.is-touch input,
html.is-touch select,
html.is-touch textarea,
html.is-touch .channel,
html.is-touch .svc-card,
html.is-touch .team-card,
html.is-touch .caso-card,
html.is-touch .step {
  cursor: pointer !important;
  touch-action: manipulation;
}

html.is-ios input,
html.is-ios select,
html.is-ios textarea,
html.is-ios .chat-input-area input,
html.is-ios .field input,
html.is-ios .field select,
html.is-ios .field textarea {
  font-size: 16px !important;
}

html.is-ios .field input,
html.is-ios .field select,
html.is-ios .field textarea {
  min-height: 48px;
}

html.is-ios #contacto {
  scroll-margin-top: 78px;
  touch-action: pan-y;
  isolation: isolate;
}

html.is-ios #contacto::before,
html.is-ios #contacto::after {
  pointer-events: none !important;
}

html.is-ios .contacto-inner,
html.is-ios .contacto-form,
html.is-ios .contacto-channels {
  min-width: 0;
  touch-action: pan-y;
}

html.is-ios .chat-messages,
html.is-ios #mob-overlay,
html.is-ios .sn-items {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

html.is-ios #chat-modal {
  min-height: 100dvh;
}

html.is-ios .chat-box {
  height: min(82dvh, 720px) !important;
  max-height: calc(100dvh - 28px) !important;
}

html.is-touch .hero-spline-wrap,
html.is-touch .hero-spline-wrap spline-viewer,
html.is-touch #canvas3d,
html.is-touch #brainCanvas {
  touch-action: pan-y !important;
  pointer-events: none !important;
}

html.is-ios .hero-spline-wrap spline-viewer,
html.is-ios #canvas3d,
html.is-ios #brainCanvas {
  pointer-events: none !important;
}

html.is-ios .hero-spline-wrap {
  pointer-events: none !important;
  overflow: hidden !important;
}

html.is-ios #nav.scrolled,
html.is-touch #nav.scrolled,
html.is-touch #mob-home,
html.is-touch #mob-hamburger,
html.is-touch #mob-overlay,
html.is-touch .chat-box,
html.is-touch #svc-nav-inner,
html.is-ios #mob-home,
html.is-ios #mob-hamburger,
html.is-ios #mob-overlay,
html.is-ios .chat-box,
html.is-ios #svc-nav-inner {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html.is-touch #mob-home,
html.is-touch #mob-hamburger {
  top: max(12px, env(safe-area-inset-top));
  width: 44px;
  height: 44px;
  contain: layout paint style;
}

html.is-touch #mob-home {
  left: max(12px, env(safe-area-inset-left));
}

html.is-touch #mob-hamburger {
  right: max(12px, env(safe-area-inset-right));
}

html.is-touch #mob-overlay {
  display: flex !important;
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(0, -8px, 0);
  transition: opacity 0.16s ease, transform 0.16s ease, visibility 0s linear 0.16s !important;
  min-height: 100dvh;
  max-height: 100dvh;
  padding-top: calc(78px + env(safe-area-inset-top));
  padding-right: max(20px, env(safe-area-inset-right));
  padding-left: max(20px, env(safe-area-inset-left));
  padding-bottom: calc(28px + env(safe-area-inset-bottom));
  contain: layout paint style;
  will-change: opacity, transform;
  touch-action: pan-y;
}

html.is-touch #mob-overlay.open {
  visibility: visible;
  pointer-events: auto;
  opacity: 1;
  transform: translate3d(0, 0, 0);
  transition-delay: 0s !important;
}

html.is-touch .mob-svc-grid,
html.is-touch .mob-svc-item,
html.is-touch .mob-nav-cta {
  contain: layout paint style;
}

html.is-touch .mob-svc-item:hover,
html.is-touch .svc-card:hover,
html.is-touch .team-card:hover,
html.is-touch .caso-card:hover,
html.is-touch .tier-card:hover,
html.is-touch .channel:hover,
html.is-touch .step:hover {
  transform: none !important;
}

html.is-touch .aurora {
  filter: blur(56px) !important;
}

html.is-touch #chat-fab {
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  width: 54px;
  height: 54px;
  touch-action: manipulation;
}

html.is-ios .reveal {
  transition-duration: 0.34s !important;
}

html.is-ios video,
html.is-ios spline-viewer,
html.is-ios canvas {
  transform: translateZ(0);
}

html.is-touch .svc-card,
html.is-touch .test-card,
html.is-touch .team-card,
html.is-touch .caso-card,
html.is-touch .stat-card,
html.is-touch .garantia-banner,
html.is-touch .contacto-form,
html.is-touch .channel {
  contain: layout paint style;
}

@supports (height: 100svh) {
  html.is-ios #hero {
    min-height: 100svh;
  }

  html.is-ios #mob-overlay {
    min-height: 100svh;
    max-height: 100svh;
  }
}

@media (max-width: 760px), (pointer: coarse) {
  html.is-ios,
  html.is-ios body {
    scroll-behavior: auto !important;
  }

  html.is-ios .form-row {
    grid-template-columns: 1fr !important;
  }

  html.is-ios .form-submit,
  html.is-ios .mob-nav-cta {
    min-height: 48px;
  }
}