/**
 * PM Media — fit · readable · never stuck (mobile + laptop)
 * Cache-bust via ?v= on index.html
 */

/* ── Global: no sideways bleed; text always wraps ── */
html {
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body {
  overflow-x: clip;
  max-width: 100%;
}
img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
  height: auto;
}
h1, h2, h3, h4, p, li, label, figcaption, .lead, .eyebrow, .btn {
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

/* Never leave reveal layers invisible if JS stalls */
.pm50-reveal.is-visible,
.pm50-stagger-child.is-visible,
.pm-fx-reveal.is-in {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

/* ── Call QR modal: short phones can scroll; X always reachable ── */
.pm-call-qr-modal.is-open {
  align-items: center;
  justify-content: center;
  padding: max(0.75rem, env(safe-area-inset-top)) max(0.75rem, env(safe-area-inset-right))
    max(0.75rem, env(safe-area-inset-bottom)) max(0.75rem, env(safe-area-inset-left));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.pm-call-qr-card {
  max-height: min(92dvh, calc(100vh - 1.5rem));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.pm-call-qr-x {
  position: sticky;
  top: 0;
  float: right;
  z-index: 2;
  width: 44px;
  height: 44px;
  margin: -0.25rem -0.25rem 0 0;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.55);
}

/* ── Lightbox: caption + Close always on screen ── */
.pm-visual-viewer {
  box-sizing: border-box;
  padding-bottom: max(0.5rem, env(safe-area-inset-bottom));
}
.pm-visual-viewer p {
  overflow: visible;
  white-space: normal;
  text-transform: none;
  letter-spacing: 0.02em;
  font-size: clamp(0.78rem, 2.8vw, 0.9rem);
  line-height: 1.35;
  max-height: none;
}

/* ── Sticky / docks never cover primary copy permanently ── */
@media (max-width: 920px), (pointer: coarse) {
  /* Force all reveal text/images clear — no wait for scroll */
  .pm50-reveal,
  .pm50-stagger-child,
  .pm-fx-reveal,
  .section.pm-fx-reveal,
  .pm50-char {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
  }

  /* Prefer dvh so iOS chrome doesn't clip CTAs */
  .hero,
  .hero.pm-noon-hero {
    min-height: auto;
    padding-inline: max(1rem, env(safe-area-inset-left)) max(1rem, env(safe-area-inset-right));
  }

  .hero-cta,
  .pm-noon-cta {
    grid-template-columns: 1fr;
  }
  @media (min-width: 380px) {
    .hero-cta,
    .pm-noon-cta {
      grid-template-columns: 1fr 1fr;
    }
  }
  .hero-cta .btn,
  .pm-noon-cta .btn,
  .pm-sticky-cta .btn,
  .sp-vel-primary,
  .sp-vel-secondary {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.25 !important;
    min-height: 48px;
    height: auto;
    padding-block: 0.85rem;
  }

  /* Magnetic shine must not clip label */
  html.pm-50k-cinema .hero-cta .btn,
  html.pm-50k-cinema .btn-primary {
    overflow: visible;
  }
  html.pm-50k-cinema .hero-cta .btn::after,
  html.pm-50k-cinema .btn-primary::after {
    display: none;
  }

  h1, .hero-title-noon, h2, .lead, .pm-noon-lead, figcaption {
    max-width: 100%;
    overflow: visible;
  }

  /* Page bar + docks: keep inside viewport */
  .pm-page-bar {
    max-width: calc(100% - 16px);
    left: 50%;
    right: auto;
  }

  #sp-vel-sticky,
  .pm-sticky-cta {
    max-width: 100%;
    left: 0;
    right: 0;
    box-sizing: border-box;
  }

  /* Chat open: full usable panel, text readable */
  .chat-widget.is-open .chat-panel {
    max-height: min(78dvh, calc(100dvh - 5.5rem));
  }
  .chat-msg,
  .chat-bubble,
  #chat-messages p,
  #chat-messages .msg {
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
  }

  /* Forms / book: fields fit */
  #book input,
  #book textarea,
  #book select,
  .form-card input,
  .form-card textarea,
  .form-card select {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
    font-size: 16px; /* stop iOS zoom-on-focus */
  }

  /* Grids never force horizontal scroll */
  .visual-world-grid,
  .visual-world-grid--niches,
  .visual-world-grid--system,
  .video-grid,
  .pm-academy-modules,
  .pm-floors-grid {
    width: 100%;
    max-width: 100%;
  }

  /* On phone: hide QR figure in call modal — dial is the path */
  html.pm-native-dial .pm-call-qr-figure {
    display: none;
  }
}

/* ── Laptop: keep smooth scroll; never permanently lock ── */
@media (min-width: 921px) and (hover: hover) and (pointer: fine) {
  html {
    scroll-behavior: smooth;
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
  }
}

/* Unlock classes only while overlays exist — safety if JS forgets */
html:not(.pm-visual-open):not(.pm-call-qr-open):not(.pm-menu-open):not(.neon-menu-open) body {
  touch-action: manipulation;
}