/* V103 — final production polish: responsive fit, tablet/mobile stability and motion safety. */

/* Global box safety — nothing may push the page outside the viewport. */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}

main,
main > *,
section,
article,
header,
footer,
.container,
.site-header__inner,
.site-footer__top,
.site-footer__columns,
.section-heading,
.section-header,
.hero__grid,
.faq__layout,
.location-card,
.knowledge-file,
.team-profile,
.condition-card,
.visit-card-v38,
.review-card,
.faq-item {
  min-width: 0;
}

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

/* Long real-world strings (e-mail, links, legal data) stay inside their cards. */
.legal-document,
.legal-document p,
.legal-document li,
.legal-document a,
.site-footer__columns,
.site-footer__columns a,
.long-email-link,
.knowledge-file,
.knowledge-file p,
.team-profile__content,
.team-profile__content p,
.visit-card-v38,
.visit-card-v38 p,
.visit-card-v38 h3,
.condition-card,
.condition-card p,
.condition-card h3,
.faq-item,
.faq-item p,
.location-card,
.location-card p {
  overflow-wrap: anywhere;
  word-break: normal;
}

/* Phone number is the intentional exception — it must remain on one line. */
.faq-phone-nowrap,
a[href^="tel:"] .faq-phone-nowrap {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.button,
.button--small,
.button--compact {
  max-width: 100%;
  white-space: normal;
}

/* ----- Legal pages: one clean frame on every screen ----- */
.legal-section .legal-document {
  width: min(100%, 980px);
  margin-inline: auto;
  padding: clamp(24px, 4vw, 46px);
  border: 1px solid rgba(72, 63, 55, 0.12);
  border-radius: clamp(22px, 3vw, 34px);
  background: rgba(255, 253, 249, 0.96);
  box-shadow: 0 18px 48px rgba(80, 66, 54, 0.07);
}

.legal-section .legal-document h2,
.legal-section .legal-document h3,
.legal-section .legal-document p,
.legal-section .legal-document li,
.legal-section .legal-document a {
  max-width: 100%;
}

.legal-section .legal-document h2 {
  margin-top: 0;
  overflow-wrap: anywhere;
}

.legal-section .legal-document .rules-section-v98 + .rules-section-v98 {
  padding-top: 1rem;
  border-top: 1px solid rgba(72, 63, 55, 0.09);
}

.rules-full-v98 .rules-section-v98 h3 {
  margin: 1rem 0 .42rem;
  color: var(--color-heading);
  font-size: clamp(1.02rem, 1.6vw, 1.2rem);
  line-height: 1.35;
}

.rules-full-v98 .rules-section-v98 ul,
.rules-full-v98 .rules-section-v98 ol {
  max-width: 100%;
}

/* ----- Offer / massage cards ----- */
.visit-card-v38 {
  box-sizing: border-box;
  overflow: hidden;
}

.visit-card-v38 > * {
  min-width: 0;
  max-width: 100%;
}

.visit-card-v38 > strong {
  display: block;
  line-height: 1.35;
}

/* Keep CTA at the bottom without creating artificial card height. */
.visit-card-v38 .button {
  align-self: flex-start;
}

/* ----- Fixed mobile controls never leave the viewport ----- */
.site-language-switch-v86,
.mobile-action-bar,
.privacy-banner {
  max-width: calc(100vw - 20px);
}

.site-language-switch-v86 {
  box-sizing: border-box;
}

.mobile-action-bar {
  box-sizing: border-box;
}

/* ----- Motion: premium, but without horizontal clipping on touch devices ----- */
.v64-reveal {
  transition-duration: .72s !important;
  transition-timing-function: cubic-bezier(.16, 1, .3, 1) !important;
}

.v64-reveal--left { transform: translate3d(-28px, 0, 0) !important; }
.v64-reveal--right { transform: translate3d(28px, 0, 0) !important; }
.v64-reveal--up { transform: translate3d(0, 24px, 0) !important; }
.v64-reveal--title { transform: translate3d(0, 28px, 0) scale(.994) !important; }
.v64-reveal--card { transform: translate3d(0, 24px, 0) scale(.99) !important; filter: none !important; }
.v64-reveal--image { transform: translate3d(0, 20px, 0) scale(.992) !important; filter: none !important; }
.v64-reveal--pop { transform: translate3d(0, 18px, 0) scale(.985) !important; }

.v64-reveal.v64-visible {
  transform: translate3d(0, 0, 0) scale(1) !important;
  filter: none !important;
}

/* Do not animate a carousel card sideways while the user can swipe it. */
[data-v39-slider] > *,
[data-horizontal-viewport] > *,
[data-reviews-viewport] > * {
  max-width: 100%;
}

@media (max-width: 1180px) {
  .site-header__inner {
    max-width: 100%;
  }

  .site-header__actions {
    min-width: 0;
    flex-shrink: 0;
  }

  .brand,
  .brand--full,
  .brand--wordmark {
    min-width: 0;
  }

  .mobile-menu,
  .mobile-menu__nav,
  .mobile-menu__footer {
    max-width: 100vw;
  }

  /* On iPad/tablet, vertical entrance motion is safer and looks cleaner. */
  .v64-reveal--left,
  .v64-reveal--right,
  .v64-reveal--up,
  .v64-reveal--title,
  .v64-reveal--card,
  .v64-reveal--image,
  .v64-reveal--pop {
    transform: translate3d(0, 18px, 0) scale(.995) !important;
  }

  .v64-reveal {
    transition-duration: .62s !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  .container {
    width: min(calc(100% - 48px), var(--container));
  }

  .site-header__inner {
    gap: 12px !important;
  }

  .site-header .brand--full {
    flex: 1 1 auto !important;
    max-width: 260px !important;
  }

  .site-header__actions {
    gap: 5px !important;
  }

  .visit-card-v38 {
    padding: 28px !important;
  }

  .legal-section .legal-document {
    padding: 34px;
  }
}

@media (max-width: 760px) {
  .container {
    width: calc(100% - 32px);
  }

  .section,
  .legal-section.section {
    padding-left: 0;
    padding-right: 0;
  }

  .subpage-hero h1,
  .legal-hero h1,
  .section-heading h2,
  .section-header h2,
  .hero__title {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .visit-card-v38 {
    flex-basis: min(86vw, 500px) !important;
    width: min(86vw, 500px) !important;
    padding: 23px 20px !important;
  }

  .visit-card-v38 h3 {
    font-size: clamp(1.26rem, 6vw, 1.65rem) !important;
    line-height: 1.08;
  }

  .visit-card-v38 > strong {
    font-size: clamp(.94rem, 4.2vw, 1.06rem);
  }

  .legal-section .legal-document {
    padding: 22px 18px;
    border-radius: 24px;
  }

  .rules-full-v98 .rules-section-v98 {
    margin-bottom: .9rem !important;
  }

  .rules-full-v98 .rules-section-v98 h2 {
    font-size: clamp(1.08rem, 5.5vw, 1.32rem) !important;
    line-height: 1.3 !important;
  }

  .rules-full-v98 .rules-section-v98 p,
  .rules-full-v98 .rules-section-v98 li {
    font-size: .97rem;
    line-height: 1.5 !important;
  }

  .rules-full-v98 .rules-section-v98 ul,
  .rules-full-v98 .rules-section-v98 ol {
    padding-left: 1.2rem !important;
  }

  .site-language-switch-v86 {
    right: 10px !important;
    bottom: max(92px, calc(env(safe-area-inset-bottom) + 86px)) !important;
  }

  .mobile-action-bar {
    right: max(10px, env(safe-area-inset-right)) !important;
    left: max(10px, env(safe-area-inset-left)) !important;
  }

  .v64-reveal {
    transition-duration: .52s !important;
  }

  .v64-reveal--left,
  .v64-reveal--right,
  .v64-reveal--up,
  .v64-reveal--title,
  .v64-reveal--card,
  .v64-reveal--image,
  .v64-reveal--pop {
    transform: translate3d(0, 14px, 0) scale(.997) !important;
  }
}

@media (max-width: 430px) {
  .container {
    width: calc(100% - 28px);
  }

  .site-header__inner {
    padding-inline: 7px !important;
  }

  .site-header .brand--full {
    width: clamp(112px, 34vw, 124px) !important;
    flex-basis: clamp(112px, 34vw, 124px) !important;
  }

  .site-header .brand--full .brand__word {
    font-size: clamp(9.6px, 2.8vw, 11px) !important;
  }

  .site-header .brand--full .brand--wordmark small {
    font-size: clamp(4.8px, 1.45vw, 5.6px) !important;
  }

  .site-header .icon-button,
  .site-header .menu-toggle {
    min-width: 36px !important;
    width: 36px !important;
    min-height: 36px !important;
    height: 36px !important;
  }

  .header-socials .icon-button {
    min-width: 32px !important;
    width: 32px !important;
    min-height: 32px !important;
    height: 32px !important;
  }

  .legal-hero .eyebrow {
    letter-spacing: .1em;
    line-height: 1.45;
    overflow-wrap: anywhere;
  }

  .legal-section .legal-document {
    padding: 20px 16px;
  }

  .visit-card-v38 {
    flex-basis: calc(100vw - 44px) !important;
    width: calc(100vw - 44px) !important;
  }

  .mobile-action-bar {
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr) !important;
  }

  .mobile-action-bar a {
    min-width: 0;
    padding-inline: 8px;
    font-size: 13px;
  }
}

@media (max-width: 340px) {
  .site-header .header-socials {
    display: none !important;
  }

  .site-header .brand--full {
    width: 132px !important;
    flex-basis: 132px !important;
  }

  .legal-section .legal-document {
    padding: 18px 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v64-reveal,
  .v64-reveal--left,
  .v64-reveal--right,
  .v64-reveal--up,
  .v64-reveal--title,
  .v64-reveal--card,
  .v64-reveal--image,
  .v64-reveal--pop {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    animation: none !important;
    transition: none !important;
  }
}

/* V104 — subpage hero viewport safety.
   Older V76 entered the first hero column from the left. On iPhone/iPad the
   transform could temporarily move the text outside the viewport while body
   overflow was clipped. Keep the entrance animation, but make it vertical. */
.subpage-hero .subpage-hero__inner.v76-team-ready > *,
.subpage-hero .subpage-hero__inner.v76-team-ready > div:first-child,
.subpage-hero .subpage-hero__inner.v76-team-ready > .subpage-note {
  transform: translate3d(0, 18px, 0) !important;
}

.subpage-hero .subpage-hero__inner.v76-team-ready.v76-team-in > * {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
}

/* Every regular subpage keeps a real inset from both viewport edges. */
@media (max-width: 1180px) {
  .subpage-hero .container,
  .legal-hero .container,
  main > .section > .container,
  main > section > .container {
    box-sizing: border-box;
    min-width: 0;
    margin-left: auto;
    margin-right: auto;
  }

  .subpage-hero__inner,
  .subpage-hero__inner > *,
  .research-purpose__grid,
  .research-purpose__grid > *,
  .final-cta__inner,
  .final-cta__inner > * {
    min-width: 0;
    max-width: 100%;
  }
}

@media (max-width: 760px) {
  .subpage-hero .container,
  .legal-hero .container,
  main > section > .container {
    width: calc(100% - 32px) !important;
  }

  .subpage-hero h1,
  .subpage-hero__copy,
  .subpage-hero .eyebrow,
  .research-highlight,
  .research-purpose__copy,
  .final-cta__inner {
    margin-left: 0;
    margin-right: 0;
    max-width: 100% !important;
  }
}

@media (max-width: 430px) {
  .subpage-hero .container,
  .legal-hero .container,
  main > section > .container {
    width: calc(100% - 28px) !important;
  }
}
