/* Stack section actions on phones; keep the wider-screen composition. */
@media (max-width: 750px) {
  /* Keep both comparison captions inside their own half of the photograph. */
  .threshold .balance-label {
    box-sizing: border-box;
    top: 24px;
    width: calc(50% - 24px);
    max-width: calc(50% - 24px);
    min-width: 0;
    padding: 12px 8px;
  }

  .threshold .balance-label.inside-label { left: 16px; right: auto; }
  .threshold .balance-label.outside-label { right: 16px; left: auto; }

  .threshold .balance-label > span {
    font-size: .625rem;
    line-height: 1.4;
    letter-spacing: .07em;
    min-height: 2.8em;
    margin-bottom: 8px;
    white-space: normal;
  }

  .threshold .balance-label > strong {
    display: block;
    max-width: 100%;
    font-size: clamp(1rem, 4.4vw, 1.5rem);
    line-height: 1.2;
    font-weight: 400;
    white-space: normal;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }

  .chapter-page-link {
    text-align: center;
    padding: 16px 24px 0;
  }

  .chapter-page-link > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    max-width: 100%;
    gap: .4rem;
    white-space: normal;
    overflow-wrap: anywhere;
    text-align: center;
  }

  .chapter-page-link .home-room-facts {
    max-width: 32ch;
    margin: 24px auto 16px;
    line-height: 1.65;
  }

  /* The breakfast link previously sat in a desktop absolute-positioned box. */
  .morning.morning-redesign > .chapter-page-link {
    position: relative;
    inset: auto;
    width: 100%;
    padding: 12px 24px 0;
    margin-inline: auto;
  }

  .room-journey .room-panel > .button,
  .hotel-welcome-copy > .text-button,
  .home-film .film-caption > .text-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    min-height: 48px;
    margin-inline: auto;
    text-align: center;
    white-space: normal;
  }

  .room-journey .room-arrows {
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    gap: 28px;
  }

  .room-journey .room-arrows button {
    min-width: 88px;
    min-height: 44px;
  }

  .threshold-foot {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
  }

  .threshold-foot > span { max-width: 100%; }

  .threshold-foot .text-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    text-align: center;
  }

  .memory-footer .button {
    justify-content: center;
    gap: 12px;
  }
}