/* Keep the original theme assets and type sizes. Adapt word wrapping and
   content flow where translations are longer than the original copy. */
html:lang(en) body,
html:lang(fr) body {
  word-break: normal;
  overflow-wrap: break-word;
}
html:lang(en) p,
html:lang(fr) p {
  hyphens: auto;
}
html:lang(ko) body {
  word-break: keep-all;
  overflow-wrap: break-word;
}
/* The original membership intro intentionally keeps short Japanese lines
   unbroken on phones. Longer translations must still be readable in the SAME
   container. Only wrapping changes: no widths, positions, spacing or artwork. */
@media (max-width: 767px) {
  html:not(:lang(ja)) .sp-nowrap {
    white-space: normal !important;
  }
}
/* Fixed-width comparison-table labels likewise keep their original columns. */
html:lang(en) .mct-row-label,
html:lang(fr) .mct-row-label {
  white-space: normal !important;
}

/* The English Yuzawa heading wraps to more lines than the Japanese copy.
   Let its illustration follow the copy instead of anchoring it over the text. */
@media (min-width: 769px) {
  html:lang(en) .pg.stay__uonuma > .lead > .inner > .img {
    position: relative;
    bottom: auto;
    margin-top: 32px;
  }

  /* Let the blue panel's full text size the row, instead of absolutely
     centring it against the photo. Preserve the artwork, columns and type. */
  html:lang(en) .pg:is(.stay__matsumoto, .stay__oze, .stay__uonuma) .like .box {
    align-items: center;
  }
  html:lang(en) .pg:is(.stay__matsumoto, .stay__oze, .stay__uonuma) .like .box .txt .txtbox {
    position: relative;
    top: auto;
    transform: none;
  }

  /* Reserve space for the hikers below the translated introduction. */
  html:lang(en) .home .travel .inner {
    padding-bottom: 80px;
  }

  /* The Oze hikers belong above the whole row, not above a photo whose
     vertical alignment changes when the English description grows. */
  html:lang(en) .home .stay__oze .img {
    position: static;
  }
  html:lang(en) .home .stay__oze .img .illust {
    top: auto;
    bottom: calc(100% + 24px);
    left: 0;
    width: 45%;
  }

  /* Follow the complete registration notice, including multi-line English. */
  html:lang(en) .pg.about .foot .img {
    position: relative;
    margin: -80px 0 0 auto;
  }

  /* The original bubbles are absolutely centred against the illustration.
     Let English paragraphs determine row height so neighbouring bubbles cannot
     cover their last lines. Keep each bubble's artwork, inset and column. */
  html:lang(en) .pg.about .list .box {
    align-items: center;
  }
  html:lang(en) .pg.about .list :is(#about__1, #about__2, #about__3, #about__4) .txt p {
    position: relative;
    top: auto;
    transform: none;
    z-index: 0;
  }
  html:lang(en) .pg.about .list .box .img {
    position: relative;
    z-index: 1;
  }
}

/* The third decorative speech bubble extends beyond the viewport even in
   Japanese. Clip its background overflow without changing text geometry. */
.home,
.pg.about,
.pg:is(.stay__matsumoto__plan, .stay__oze__plan, .stay__uonuma__plan) {
  overflow-x: clip;
}

/* At tablet widths the original absolutely positioned artwork can reach
   several lines above its section. Reserve its space in both languages. */
@media (max-width: 768px) {
  .home .travel .illust {
    position: relative;
    left: auto;
    bottom: auto;
    width: min(80%, 360px);
    margin: 32px 0 -100px auto;
  }
  .pg.stay__matsumoto #eat .title__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: 1fr auto;
    align-items: end;
    column-gap: 16px;
  }
  .pg.stay__matsumoto #eat .title__inner > :is(h2, .jp) {
    grid-column: 1;
  }
  .pg.stay__matsumoto #eat .title .illust {
    position: relative;
    grid-column: 2;
    grid-row: 1 / 3;
    width: clamp(70px, 18vw, 130px);
    right: auto;
    bottom: auto;
  }

  /* Keep the original image and starting position, but let a longer English
     introduction determine the section height before the following copy. */
  html:lang(en) .pg.stay__uonuma__room .head {
    display: grid;
    background: #f5ede0;
  }
  html:lang(en) .pg.stay__uonuma__room .head > .box {
    position: relative;
    grid-area: 1 / 1;
    align-self: start;
    top: auto;
    left: auto;
    transform: none;
    margin-top: 62.75vw;
    padding-bottom: 48px;
    z-index: 1;
  }
  html:lang(en) .pg.stay__uonuma__room .head > .img {
    grid-area: 1 / 1;
    align-self: start;
    z-index: 0;
  }
}