/* Keep the photograph in the document's normal scrolling layer, so Safari can
   sample real image content behind its translucent toolbar. Only the carousel
   foreground receives the short opening hold; no viewport-fixed layer is used. */
@media(max-width:1100px), (pointer:coarse) {
  html,body {background-color:#27272b;}
  .page.pv-home {background-color:var(--white,#fff);}
}
.pv-home .pv-flow-opening {isolation:isolate;background:#27272b;}
.pv-home .pv-scene-journey.pv-carousel-journey.pv-flow-opening > .experience.pv-carousel {
  position:relative;top:auto;z-index:1;background:transparent;
  transform:translate3d(0,var(--pv-flow-offset,0px),0);
}
.pv-flow-opening > .pv-flow-background {
  position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;
}
.pv-flow-background .pv-carousel-backdrop,
.pv-flow-background .shade {position:absolute;inset:0;pointer-events:none;}
.pv-flow-background .pv-carousel-backdrop {z-index:0;overflow:hidden;}
.pv-flow-background .pv-carousel-backdrop img {
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;
  opacity:0;transform:scale(1.03);filter:saturate(.72) brightness(.8);transition:opacity .55s ease;
}
.pv-flow-background .pv-carousel-backdrop img.active {opacity:1;}
.pv-flow-background .shade {
  z-index:1;
  background:linear-gradient(90deg,rgba(39,39,43,0.83),rgba(39,39,43,0.59) 40%,rgba(39,39,43,0.36)),linear-gradient(0deg,rgba(39,39,43,0.82),transparent 40%);
}
.pv-flow-background .shade::after {
  content:"";position:absolute;inset:0;
  background:linear-gradient(125deg,rgba(207,231,246,.055),rgba(207,231,246,0) 55%),rgba(39,39,43,0.52);
  -webkit-backdrop-filter:blur(5px) saturate(.85);backdrop-filter:blur(5px) saturate(.85);
  -webkit-mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.6) 65%,rgba(0,0,0,.3));
  mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.6) 65%,rgba(0,0,0,.3));
}
@media(prefers-reduced-motion:reduce) {
  .pv-flow-background .pv-carousel-backdrop img {transform:none;transition:none;}
}

/* A retracting browser toolbar changes dvh and the journey's height. Size the
   phone photograph against the stable large viewport instead, independently
   of that container, so object-fit:cover does not zoom while scrolling.
   Apply before and after JS moves the backdrop; it still scrolls normally. */
@media(max-width:600px) and (orientation:portrait) {
  .pv-home .experience.pv-carousel .pv-carousel-backdrop,
  .pv-home .pv-flow-background .pv-carousel-backdrop {
    bottom:auto;
    height:calc(100vh + var(--pv-opening-hold,160px));
    height:calc(100lvh + var(--pv-opening-hold,160px));
  }
}

/* Keep the phone copy at its initial vertical position as the toolbar retracts;
   the photographs and lower controls follow the scroll distance separately. */
.pv-home .pv-flow-opening.pv-copy-anchored .experience.pv-carousel .copy-stack {
  align-self:start;margin-top:var(--pv-copy-gap,0px);
}
/* Native scroll timelines stay in step with composited scrolling. The final
   quarter of the hold releases gradually rather than stopping abruptly. */
@supports (animation-timeline:scroll(root block)) and (animation-range:0px 1px) {
  .pv-home .pv-scene-journey.pv-carousel-journey.pv-flow-opening.pv-native-scroll > .experience.pv-carousel {
    animation-name:pv-native-opening-hold;
    animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;
    animation-timeline:scroll(root block);
    animation-range:var(--pv-flow-start,0px) var(--pv-flow-end,1px);
    will-change:transform;
  }
  @keyframes pv-native-opening-hold {
    0% {transform:translate3d(0,0,0);}
    60% {transform:translate3d(0,calc(var(--pv-flow-hold,0px) * .75),0);animation-timing-function:cubic-bezier(.333333,.666667,.666667,1);}
    100% {transform:translate3d(0,var(--pv-flow-hold,0px),0);}
  }
}

/* Keep the foreground layout steady and reserve the full large-viewport
   background. Only the photograph group and timeline shift, driven by scroll.
   Clipping belongs to the journey so the shifted controls remain visible. */
@media(max-width:600px) and (orientation:portrait) {
  .pv-home .pv-scene-journey.pv-carousel-journey.pv-phone-layout-locked {
    --pv-phone-travel:max(0px,calc((100vh - var(--pv-phone-viewport-height)) * .65 - 10px));
    --pv-phone-travel:max(0px,calc((100lvh - var(--pv-phone-viewport-height)) * .65 - 10px));
    min-height:calc(max(var(--pv-phone-background-height),100vh) + var(--pv-phone-hold));
    min-height:calc(max(var(--pv-phone-background-height),100lvh) + var(--pv-phone-hold));
    overflow:hidden;overflow:clip;
  }
  .pv-home .pv-scene-journey.pv-carousel-journey.pv-phone-layout-locked > .experience.pv-carousel {
    min-height:var(--pv-phone-height);overflow:visible;
  }
  .pv-home .pv-phone-layout-locked .experience.pv-carousel .pv-carousel-main {
    padding-top:var(--pv-phone-main-top);padding-bottom:var(--pv-phone-main-bottom);
  }
  .pv-home .pv-phone-layout-locked .experience.pv-carousel .bottom-bar {
    margin-bottom:var(--pv-phone-bottom);
  }
  .pv-home .pv-phone-layout-locked .experience.pv-carousel :is(.pv-carousel-visual,.bottom-bar) {
    transform:translate3d(0,calc(var(--pv-phone-travel) * var(--pv-phone-follow-progress,0)),0);
    transition:none;
  }
  @supports (animation-timeline:scroll(root block)) and (animation-range:0px 1px) {
    .pv-home .pv-phone-layout-locked.pv-native-scroll .experience.pv-carousel :is(.pv-carousel-visual,.bottom-bar) {
      animation-name:pv-phone-follow-scroll;
      animation-duration:auto;animation-timing-function:linear;animation-fill-mode:both;
      animation-timeline:scroll(root block);
      animation-range:var(--pv-flow-start,0px) var(--pv-phone-follow-end,1px);
      will-change:transform;
    }
    @keyframes pv-phone-follow-scroll {
      from {transform:translate3d(0,0,0);}
      to {transform:translate3d(0,var(--pv-phone-travel),0);}
    }
  }
}
@media(max-width:600px) and (orientation:portrait) and (prefers-reduced-motion:reduce) {
  .pv-home .pv-scene-journey.pv-carousel-journey.pv-phone-layout-locked {--pv-phone-travel:0px;}
}

/* Phone composition follows the supplied portrait reference. Anchor the text,
   photograph, playback and timeline to the initial usable screen height, so
   Safari's retracting bars cannot rearrange them. The existing scroll motion
   is still applied to the image/navigation group independently. */
@media(max-width:600px) and (orientation:portrait) {
  .pv-home .pv-scene-journey.pv-carousel-journey > .experience.pv-carousel {
    --pv-reference-top:var(--pv-phone-safe-top,var(--pv-safe-top,0px));
    --pv-reference-height:calc(var(--pv-phone-height,100dvh) - var(--pv-reference-top) - var(--pv-phone-safe-bottom,var(--pv-safe-bottom,0px)));
    --pv-reference-button:clamp(36px,8.65vw,48px);
    --pv-type-clearance:clamp(0px,calc(740px - var(--pv-reference-height)),12px);
    --pv-reference-play-gap:max(8px,calc(var(--pv-reference-height) * .19 - 27.7778vw - var(--pv-reference-button) * .5));
    --edge:max(4.4vw,var(--pv-safe-left,0px),var(--pv-safe-right,0px));
    padding-bottom:var(--pv-safe-bottom,0px);
  }
  .pv-home .pv-scene-journey .experience.pv-carousel .masthead {
    flex:0 0 auto;min-height:66px;height:calc(var(--pv-reference-height) * .093);
    padding:0;gap:10px;
  }
  .pv-home .experience.pv-carousel .masthead .wordmark {
    font-size:clamp(11px,3.243vw,18px);gap:1.8vw;
  }
  .pv-home .experience.pv-carousel .wordmark .wordmark-sub {
    font-size:clamp(4px,.973vw,5.4px);margin-top:1.44vw;
  }
  .pv-home .experience.pv-carousel .pv-glass-symbol {width:6.486vw;flex-basis:6.486vw;}
  .pv-home .experience.pv-carousel .pv-header-actions {gap:clamp(8px,2.88vw,16px);}
  .pv-home .experience.pv-carousel .pv-header-actions .contact {
    display:flex;font-size:clamp(10px,2.162vw,12px);gap:clamp(7px,2.162vw,12px);
    min-height:44px;padding:7px 0;
  }
  .pv-home .experience.pv-carousel .pv-menu summary {
    min-height:44px;padding:6px clamp(8px,2.162vw,12px);gap:clamp(7px,2.162vw,12px);
  }
  .pv-home .experience.pv-carousel .pv-menu-label {font-size:clamp(10px,2.162vw,12px);}
  .pv-home .experience.pv-carousel .pv-menu-icon {width:clamp(14px,3.6vw,20px);}
  .pv-home .experience.pv-carousel .pv-menu-icon::before {width:100%;}
  .pv-home .experience.pv-carousel .pv-menu-icon::after {width:70%;left:30%;}
  .pv-home .experience.pv-carousel .pv-menu[open] .pv-menu-icon::after {width:100%;left:0;}
  .pv-home .experience.pv-carousel .pv-pulse-dot {width:clamp(6px,1.62vw,9px);height:clamp(6px,1.62vw,9px);flex-basis:clamp(6px,1.62vw,9px);}
  .pv-home .pv-scene-journey.pv-carousel-journey .experience.pv-carousel .pv-carousel-main {
    position:static;display:block;padding:0;
  }
  .pv-home .pv-scene-journey.pv-carousel-journey .experience.pv-carousel .copy-stack {
    position:absolute;left:var(--edge);right:var(--edge);
    top:calc(var(--pv-reference-top) + var(--pv-reference-height) * .175 - var(--pv-type-clearance));
    width:auto;max-width:none;margin:0;padding:0;text-align:center;
  }
  .pv-home .pv-scene-journey .experience.pv-carousel .scene-copy .eyebrow {
    font-size:clamp(8.47px,1.96262vw,10.89px);gap:1.8vw;margin-bottom:min(2.7vw,calc(var(--pv-reference-height) * .0151));letter-spacing:.12em;
  }
  .pv-home .pv-scene-journey .experience.pv-carousel .scene-copy .eyebrow > span {width:3.6vw;}
  .pv-home .pv-scene-journey .experience.pv-carousel .scene-copy :is(h1,h2) {
    font-size:min(10.4665vw,calc(var(--pv-reference-height) * .0583704));line-height:1.19;
  }
  .pv-home .pv-scene-journey .experience.pv-carousel .scene-copy .description {
    font-size:clamp(13.31px,3.05162vw,16.94px);line-height:1.55;
    max-width:79.86vw;margin:min(3.24vw,calc(var(--pv-reference-height) * .0181)) auto min(2.16vw,calc(var(--pv-reference-height) * .0121));
  }
  .pv-home .pv-scene-journey .experience.pv-carousel .scene-copy .discover {
    font-size:clamp(12.1px,2.61602vw,14.52px);gap:2.34vw;min-height:clamp(32px,7.93vw,44px);padding:1.26vw 0 1.8vw;
    position:relative;
  }
  .pv-home .experience.pv-carousel .discover::after {
    content:"";position:absolute;inset:50% 0 auto;height:max(44px,100%);transform:translateY(-50%);
  }
  .pv-home .pv-scene-journey .experience.pv-carousel .pv-carousel-visual {
    position:absolute;left:0;right:0;
    top:calc(var(--pv-reference-top) + var(--pv-reference-height) * .64 - 27.7778vw);
    gap:var(--pv-reference-play-gap);
  }
  .pv-home .experience.pv-carousel .photographs {aspect-ratio:1.8;}
  .pv-home .experience.pv-carousel .photograph {width:82%;border-radius:2.34vw;}
  .pv-home .pv-scene-journey .experience.pv-carousel .playback {gap:1.44vw;}
  .pv-home .pv-scene-journey .experience.pv-carousel .playback button {
    width:var(--pv-reference-button);height:var(--pv-reference-button);font-size:clamp(20px,3.964vw,22px);
    position:relative;
  }
  .pv-home .experience.pv-carousel .playback button::before {
    content:"";position:absolute;inset:50% auto auto 50%;width:max(44px,100%);height:max(44px,100%);transform:translate(-50%,-50%);
  }
  .pv-home .experience.pv-carousel .playback #play {font-size:clamp(16px,3.24vw,18px);}
  .pv-home .pv-scene-journey.pv-carousel-journey .experience.pv-carousel .bottom-bar {
    position:absolute;left:max(2.5vw,var(--pv-safe-left,0px));right:max(2.5vw,var(--pv-safe-right,0px));
    top:calc(var(--pv-reference-top) + max(calc(var(--pv-reference-height) * .877 - 10px),calc(var(--pv-reference-height) * .64 + 27.7778vw + var(--pv-reference-play-gap) + var(--pv-reference-button) + 8px)));
    margin:0;gap:0;
  }
  .pv-home .experience.pv-carousel .chapters {gap:1.26vw;}
  .pv-home .experience.pv-carousel .chapter-label {font-size:clamp(12.1px,2.61602vw,14.52px);}
  .pv-home .experience.pv-carousel .chapter .track,
  .pv-home .experience.pv-carousel .chapter.active .track {height:clamp(2px,.54vw,3px);margin-bottom:2.25vw;}
  @media(max-width:360px) {
    .pv-home .experience.pv-carousel .pv-header-actions {gap:6px;}
    .pv-home .experience.pv-carousel .masthead {gap:6px;}
    .pv-home .pv-scene-journey.pv-carousel-journey .experience.pv-carousel .copy-stack {
      top:calc(var(--pv-reference-top) + var(--pv-reference-height) * .16 - var(--pv-type-clearance));
    }
    .pv-home .pv-scene-journey .experience.pv-carousel .scene-copy .description {max-width:87.12vw;}
  }
}