/* UNITED EARTH — image-free, permanent Welcome + Thank You bookends.
   The two panels match photo-scene dimensions. No image assets, no photo clones.
   CSS-only translucent, soft-focus atmosphere in the existing deep-ocean blue. */

/* Actual visual height — NOT merely the extra scroll distance.
   The caption stays vertically centered, but the empty areas above and below
   are each about HALF those in the previous full-viewport panel.
   No sticky fullscreen bookend; photographs immediately follow Welcome,
   and the final Thank You ends the collection with no ghost photo. */
.journey-scene.journey-bookend,
.journey-scene.journey-bookend.cover,
.journey-scene.journey-bookend.closing{
  height:max(58svh,360px);
  min-height:0;
  background:#071a2b;
}
.journey-bookend .journey-stage{
  position:relative;
  top:auto;
  width:100%;
  height:100%;
  overflow:hidden;
  background:#071a2b;
  isolation:isolate;
}
.journey-bookend .journey-stage::before{
  content:"";
  position:absolute;
  inset:-20%;
  z-index:0;
  background:
    radial-gradient(ellipse at 28% 25%,rgba(83,145,192,.35),transparent 48%),
    radial-gradient(ellipse at 77% 80%,rgba(20,76,119,.34),transparent 52%),
    linear-gradient(142deg,rgba(26,65,102,.70),rgba(4,22,39,.96));
  filter:blur(64px);
  transform:translateZ(0);
  pointer-events:none;
}
.journey-bookend.cover .journey-stage::after,
.journey-bookend.closing .journey-stage::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(2,13,25,.22);
  pointer-events:none;
}
.journey-bookend .journey-photo-backdrop,
.journey-bookend .journey-image,
.journey-bookend .journey-discover,
.journey-bookend .journey-scene-zoom{
  display:none!important;
}
.journey-bookend .journey-copy,
.journey-bookend.cover .journey-copy,
.journey-bookend.closing .journey-copy,
.journey-bookend.cover.is-landscape .journey-copy,
.journey-bookend.closing.is-landscape .journey-copy{
  position:absolute;
  z-index:4;
  top:0;right:0;bottom:0;left:0;
  inset:0;
  width:100%;
  height:100%;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:max(42px,calc(env(safe-area-inset-top) + 36px))
          max(25px,env(safe-area-inset-right))
          max(38px,calc(env(safe-area-inset-bottom) + 31px))
          max(25px,env(safe-area-inset-left));
  pointer-events:none;
  color:#fff;
}
.journey-bookend .journey-copy::before{display:none!important}
.journey-bookend .journey-copy-inner,
.journey-bookend.cover .journey-copy-inner,
.journey-bookend.closing .journey-copy-inner{
  width:100%;
  max-width:650px;
  min-width:0;
  padding:0;
  margin:auto;
}
.journey-bookend .journey-label,
.journey-bookend.cover .journey-label,
.journey-bookend.closing .journey-label{
  display:block;
  margin:0 auto 8px;
  text-align:center;
  color:rgba(255,255,255,.88);
  font:600 10px/1.55 system-ui,sans-serif;
  letter-spacing:.16em;
}
.journey-bookend .journey-copy h2,
.journey-bookend.cover .journey-copy h2,
.journey-bookend.closing .journey-copy h2{
  color:#fff;
  font-size:clamp(35px,8.5vw,67px);
  line-height:1.07;
  max-width:16ch;
  margin:0 auto 7px;
  text-align:center;
  text-shadow:0 2px 20px rgba(0,0,0,.15);
}
.journey-bookend .journey-copy p:not(.journey-label),
.journey-bookend.cover .journey-copy p:not(.journey-label),
.journey-bookend.closing .journey-copy p:not(.journey-label){
  color:rgba(255,255,255,.96);
  font-size:clamp(15px,3.7vw,21px);
  line-height:1.52;
  max-width:38ch;
  margin:0 auto;
  text-align:center;
}
.journey-bookend.cover .journey-scroll-hint{
  display:block;
  text-align:center;
  margin:12px auto 0;
  color:rgba(255,255,255,.77);
  letter-spacing:.14em;
  font:600 10px/1.55 system-ui,sans-serif;
}
.journey-bookend.closing .journey-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:12px auto 0;
  pointer-events:auto;
}
.journey-bookend.closing .journey-actions button{
  color:#fff;
  pointer-events:auto;
  border-color:rgba(255,255,255,.43);
  background:rgba(6,29,52,.33);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  font:500 12px/1.4 system-ui,sans-serif;
  border-radius:100px;
  padding:10px 18px;
}
.journey-bookend.closing .journey-actions button:focus-visible{
  outline:2px solid #fff;
  outline-offset:3px;
}
@media(min-width:800px){
  .journey-scene.journey-bookend,
  .journey-scene.journey-bookend.cover,
  .journey-scene.journey-bookend.closing{
    height:max(62svh,390px);
  }
}
@media(min-width:1100px) and (min-aspect-ratio:13/10) and (pointer:fine){
  /* Keep the same media-area width as ordinary desktop photographs. */
  .journey-bookend .journey-stage{
    background:linear-gradient(90deg,#071a2b 0%,
      #071a2b 73.5%,#031728 73.5%,#031728 100%);
  }
  .journey-bookend .journey-stage::before{
    right:auto;
    width:calc(73.5% + 20%);
  }
  .journey-bookend.cover .journey-stage::after,
  .journey-bookend.closing .journey-stage::after{
    background:linear-gradient(90deg,rgba(2,13,25,.22) 0%,
      rgba(2,13,25,.22) 73.5%,#031728 73.5%,#031728 100%);
  }
  .journey-bookend .journey-copy,
  .journey-bookend.cover .journey-copy,
  .journey-bookend.closing .journey-copy{
    left:0;right:auto;width:73.5%;
    padding:43px clamp(22px,4.5vw,78px);
  }
}
/* Short landscape screens need a little more height for two- or three-line
   translations; still significantly shorter than the prior fullscreen panel. */
@media(max-height:520px){
  .journey-scene.journey-bookend,
  .journey-scene.journey-bookend.cover,
  .journey-scene.journey-bookend.closing{
    height:max(78svh,300px);
  }
} 
@media(max-height:520px){
  .journey-bookend .journey-copy,
  .journey-bookend.cover .journey-copy,
  .journey-bookend.closing .journey-copy{
    padding-top:31px;padding-bottom:15px;
  }
  .journey-bookend .journey-copy h2,
  .journey-bookend.cover .journey-copy h2,
  .journey-bookend.closing .journey-copy h2{font-size:clamp(27px,5.8vh,40px)}
  .journey-bookend .journey-copy p:not(.journey-label){font-size:12px}
  .journey-bookend .journey-label{margin-bottom:4px}
  .journey-bookend.cover .journey-scroll-hint{margin-top:6px}
}
@media(prefers-reduced-motion:reduce){
  .journey-bookend .journey-stage::before{filter:blur(55px)}
}
html[dir=rtl] .journey-bookend .journey-copy,
html[dir=rtl] .journey-bookend .journey-copy-inner{
  text-align:center;
}
