/* Local, feathered readability follows each text group, never a whole photograph. */
:is(.xb-home-hero-title, .xb-home-hero-message, .xb-photo-text-group, .xb-day-hero-message,
    .xb-sunset-hero-message) {
  position: relative;
  isolation: isolate;
}
:is(.xb-home-hero-title, .xb-home-hero-message, .xb-photo-text-group, .xb-day-hero-message,
    .xb-sunset-hero-message)::before {
  content: "";
  position: absolute;
  inset: -.8em -1em;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse closest-side at center, rgb(0 0 0 / 38%) 0%, rgb(0 0 0 / 36%) 30%, rgb(0 0 0 / 18%) 65%, transparent 100%);
}
.xb-home-hero .xb-home-hero-title, .xb-home-hero .xb-home-hero-message { width: fit-content; max-width: 100%; }
.xb-home-hero::before { background: rgb(0 0 0 / 12%); }
.xb-day-hero-frame::before { background: rgb(0 0 0 / 18%); }
.xb-closing-frame::before { background: rgb(0 0 0 / 20%); }
.xb-experience-photo::after { background: none; }
.xb-experience-photo h3 { isolation: isolate; }
/* Outer layout boxes stay unchanged; only these inner groups own the cloud. */
.xb-photo-text-group { display: flow-root; width: fit-content; max-width: 100%; }
.xb-photo-text-list { margin: 0; padding: 0; list-style: none; }

/* Query the bounded photographic composition, rather than the full monitor. */
.xb-home-hero-content, .xb-day-hero-frame, .xb-sunset-hero-frame, .xb-closing-frame { container-type: inline-size; }
.xb-home-hero .xb-home-hero-title { font-size: clamp(2rem, 4.8cqi, 4rem); }
.xb-home-hero .xb-home-hero-message { font-size: clamp(.8125rem, 1.4cqi, 1.125rem); margin-top: clamp(1.25rem, 3.5cqi, 3rem); }
.xb-day-hero .xb-day-hero-title { font-size: clamp(2rem, 6.8cqi, 6.5rem); }
.xb-day-hero:lang(fr) .xb-day-hero-title, .xb-day-hero:lang(de) .xb-day-hero-title { font-size: clamp(1.5rem, 5.4cqi, 5.25rem); }
.xb-day-hero:not(:lang(zh)) .xb-day-hero-accent { font-size: clamp(1.125rem, 3.36cqi, 3.15rem); }
.xb-day-hero:not(:lang(zh)) .xb-day-hero-message { font-size: clamp(.8125rem, 2.31cqi, 2.275rem); }
.xb-sunset-hero .xb-sunset-hero-title { font-size: clamp(2rem, 6.5cqi, 5.5rem); }
.xb-sunset-hero:lang(fr) .xb-sunset-hero-title, .xb-sunset-hero:lang(nl) .xb-sunset-hero-title { font-size: clamp(1.125rem, 4.2cqi, 3.75rem); }
.xb-sunset-hero-accent { font-size: clamp(1rem, 2.75cqi, 2.5rem); }
.xb-sunset-hero-message { font-size: clamp(.8125rem, 1.85cqi, 1.75rem); }
.xb-day-hero-identifier, .xb-sunset-hero-identifier { font-size: clamp(.6875rem, 1.6cqi, 1.375rem); }
.xb-home-experiences .xb-experience-photo h3 { font-size: clamp(1.375rem, 6.5cqi, 2.75rem); bottom: clamp(.4rem, 2cqi, .75rem); }
.xb-home-experiences:lang(de) .xb-experience-photo--sunsetTour h3 { font-size: min(clamp(1.375rem, 6.5cqi, 2.75rem), calc((100cqi - 2rem) / 14.2)); }
.xb-home-experiences:lang(nl) .xb-experience-photo--sunsetTour h3 { font-size: min(clamp(1.375rem, 6.5cqi, 2.75rem), calc((100cqi - 2rem) / 13)); }
.xb-day-closing:not(:lang(zh)) .xb-closing-title, .xb-sunset-closing:not(:lang(zh)) .xb-closing-title { font-size: clamp(1.25rem, 2.52cqi, 2.625rem); }
.xb-new-web .xb-closing-words { font-size: clamp(.75rem, 1.3cqi, 1.125rem); }

/* Keep the two tour groups left/right at every width, including the upper-right counterweight. */
@media (max-width: 1100px) {
  .xb-day-hero .xb-day-hero-content, .xb-sunset-hero .xb-sunset-hero-content {
    flex-direction: row; align-items: flex-start; min-height: 0;
    gap: clamp(.75rem, 3cqi, 2rem); padding-block: clamp(1.5rem, 4cqi, 3rem);
  }
  .xb-day-hero-copy, .xb-sunset-hero-copy { width: 62%; }
  .xb-day-hero .xb-day-hero-message, .xb-sunset-hero .xb-sunset-hero-message {
    position: relative; inset: auto; align-self: flex-start; max-width: 30%; margin: .25rem 0 0;
    transform-origin: right top;
  }
  .xb-day-hero .xb-day-hero-accent, .xb-sunset-hero-accent { margin-top: clamp(.5rem, 1.5cqi, 1rem); }
  .xb-day-hero:lang(zh) .xb-type-script, .xb-sunset-hero:lang(zh) .xb-sunset-hero-accent,
  .xb-sunset-hero:lang(zh) .xb-sunset-hero-message { font-size: clamp(.8125rem, 2.3cqi, 1.5rem); }
}
@media (max-width: 900px) {
  .xb-new-web .xb-closing-title, .xb-new-web.xb-day-closing:not(:lang(zh)) .xb-closing-title,
  .xb-sunset-closing:not(:lang(zh)) .xb-closing-title { font-size: clamp(1.25rem, 3.4cqi, 2rem); }
  .xb-new-web:lang(zh) .xb-closing-title { font-size: clamp(1.125rem, 3cqi, 1.75rem); }
  .xb-new-web .xb-closing-copy { gap: clamp(.75rem, 2cqi, 1rem); padding: clamp(1.5rem, 4cqi, 2rem) clamp(1rem, 3cqi, 1.25rem); }
  .xb-new-web .xb-closing-words { font-size: clamp(.75rem, 1.7cqi, 1rem); }
}