/* ==========================================================================
   The Boardroom Edit, version five motion pass.
   1. Home hero: slow push-in on the sunset sky and skyline, a warm overlay
      that drifts from cream to dusk, and a staggered fade-up of the hero text.
   2. Background-video bands on inner pages (same treatment as the home band).
   Only transform/scale/translate and opacity are animated. Everything that
   moves sits inside prefers-reduced-motion:no-preference.
   ========================================================================== */

/* ---- 1. Home hero: living sky (layer copies the scene's own gradient) ---- */
.v5-sky{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.v5-sky>div{position:absolute;inset:0}
.v5-sky__pan{transform-origin:28% 88%;
  background:
    radial-gradient(ellipse 55% 60% at 24% 100%,var(--city-sun),transparent 72%),
    radial-gradient(ellipse 45% 40% at 82% 96%,var(--city-rose),transparent 70%),
    radial-gradient(ellipse 28% 7% at 72% 20%,var(--city-cloud),transparent 72%),
    radial-gradient(ellipse 22% 5% at 16% 34%,var(--city-cloud),transparent 72%),
    linear-gradient(180deg,var(--city-sky-top) 0%,var(--city-sky-mid) 48%,var(--city-sky-low) 100%)}
.v5-sky__warm{opacity:.85;background:linear-gradient(180deg,rgba(255,250,242,.46) 0%,rgba(255,246,234,.2) 42%,rgba(255,246,234,0) 72%)}
.v5-sky__dusk{opacity:0;background:
    radial-gradient(ellipse 70% 55% at 72% 100%,rgba(200,104,58,.24),transparent 72%),
    linear-gradient(180deg,rgba(150,92,82,.07) 0%,rgba(222,140,86,.16) 100%)}

@media (prefers-reduced-motion:no-preference){
  .v5-sky__pan{animation:v5-sky-drift 26s ease-in-out infinite alternate;will-change:transform}
  .v5-sky__warm{animation:v5-warm 20s ease-in-out infinite alternate}
  .v5-sky__dusk{animation:v5-dusk 20s ease-in-out infinite alternate}
  /* skyline: a gentler push-in, anchored on the water line (composes with the existing scroll parallax) */
  .v3-home .city-scene--home .city-skyline{transform-origin:50% 100%;animation:v5-skyline 30s ease-in-out infinite alternate}

  /* hero panel and text: soft staggered fade-up, buttons last */
  .v3-home .city-scene--home .page-header{animation:v5-panel-in 1.1s cubic-bezier(.2,.7,.2,1) .05s both}
  .v3-home .city-scene--home .page-header>:not(.btn-row),
  .v3-home .city-scene--home .page-header .btn-row>.btn{animation:v5-rise 1s cubic-bezier(.2,.7,.2,1) both}
  .v3-home .city-scene--home .page-header>.breadcrumb{animation-delay:.25s}
  .v3-home .city-scene--home .page-header>.kicker{animation-delay:.4s}
  .v3-home .city-scene--home .page-header>.nlp-hero-tagline{animation-delay:.55s}
  .v3-home .city-scene--home .page-header>h1{animation-delay:.7s;animation-duration:1.2s}
  .v3-home .city-scene--home .page-header>.page-lede{animation-delay:.92s}
  .v3-home .city-scene--home .page-header .btn-row>.btn:nth-child(1){animation-delay:1.18s}
  .v3-home .city-scene--home .page-header .btn-row>.btn:nth-child(2){animation-delay:1.34s}
  /* one gentle sheen across each button once they've arrived */
  .v3-home .city-scene--home .page-header .btn{position:relative;overflow:hidden;isolation:isolate}
  .v3-home .city-scene--home .page-header .btn::after{content:"";position:absolute;inset:-1px;z-index:-1;pointer-events:none;
    background:linear-gradient(105deg,transparent 28%,rgba(255,240,214,.34) 50%,transparent 72%);
    transform:translateX(-120%);animation:v5-sheen 1.7s cubic-bezier(.45,.05,.25,1) 2.1s 1 both}
  .v3-home .city-scene--home .page-header .btn-secondary::after{background:linear-gradient(105deg,transparent 28%,rgba(196,118,66,.2) 50%,transparent 72%);animation-delay:2.3s}
}
@keyframes v5-sky-drift{from{transform:scale(1) translate(0,0)}to{transform:scale(1.08) translate(-1.4%,-.9%)}}
@keyframes v5-skyline{from{scale:1}to{scale:1.035}}
@keyframes v5-warm{from{opacity:.85}to{opacity:.15}}
@keyframes v5-dusk{from{opacity:0}to{opacity:.9}}
@keyframes v5-panel-in{from{opacity:0;scale:.985}to{opacity:1;scale:1}}
@keyframes v5-rise{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
@keyframes v5-sheen{from{transform:translateX(-120%)}to{transform:translateX(120%)}}

/* ---- 2. Background-video bands on inner pages ---------------------------- */
.v5-vband{position:relative;overflow:hidden;isolation:isolate;border-radius:1.25rem;clip-path:inset(0 round 1.25rem)}
.v5-vband__media{position:relative;transform-origin:55% 50%}
.v5-vband__media img{display:block}
.v5-vband.nlp-band--skyline img{animation:none}
.v5-vband__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;opacity:0;transition:opacity 1.2s ease}
.v5-vband__media video.is-playing{opacity:1}
/* cream at the top, dark green settling into the base, warm clay tint */
.v5-vband__wash{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(247,243,236,.3) 0%,rgba(247,243,236,0) 40%),linear-gradient(0deg,rgba(27,56,45,.3) 0%,rgba(27,56,45,0) 46%)}
.v5-vband__wash::after{content:"";position:absolute;inset:0;background:rgba(214,150,96,.24);mix-blend-mode:multiply;opacity:.8}
.v5-vband .v3-videohero__toggle{left:auto;right:.75rem;bottom:.75rem}
@media (prefers-reduced-motion:no-preference){
  .v5-vband__media{animation:v5-band-drift 28s ease-in-out infinite alternate;will-change:transform}
  .v5-vband__wash::after{animation:v5-breathe 12s ease-in-out infinite alternate}
}
@keyframes v5-band-drift{from{transform:scale(1) translate(0,0)}to{transform:scale(1.07) translate(-1.2%,-.8%)}}
@keyframes v5-breathe{from{opacity:.55}to{opacity:1}}
