/* Cross-device foundation — phones, tablets, desktop (iOS/Android/macOS/Windows) */

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  overflow-x: clip;
  max-width: 100%;
}

img,
video,
svg,
canvas,
iframe {
  max-width: 100%;
  height: auto;
}

.public-landing,
.access-gate,
#thermocool-app,
#root,
#vortex-ir-dash-host,
.ir-spa-block,
.ir-container,
.mandate-section {
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

#root *,
.access-gate *,
.public-landing * {
  overflow-wrap: anywhere;
  word-wrap: break-word;
}

#root pre,
#root code,
.access-gate pre,
.access-gate code {
  overflow-x: auto;
  max-width: 100%;
  white-space: pre-wrap;
}

#root table,
.ir-spa-block table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@supports not (overflow-x: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

/* Minimum touch target — 44×44 CSS px (Apple HIG / Material) */
a,
button,
[role="button"],
input[type="submit"],
input[type="button"],
input[type="reset"],
.public-landing__btn,
.access-gate__btn,
.hero-btn {
  touch-action: manipulation;
}

@media (pointer: coarse) {
  .public-landing__btn,
  .access-gate__btn,
  .hero-btn,
  .access-gate__mode-tab {
    min-height: 2.75rem;
    min-width: 2.75rem;
  }
}

/* iOS Safari dynamic viewport + notch */
@supports (height: 100dvh) {
  .public-landing,
  .access-gate.hero-video {
    min-height: 100dvh;
  }
}

/* Reduce motion globally when requested */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}