/* Native same-origin page transitions; normal navigation remains the fallback. */
@view-transition {
  navigation: auto;
}

::view-transition-old(root) {
  animation-duration: 180ms;
  animation-timing-function: ease-out;
}

::view-transition-new(root) {
  animation-duration: 250ms;
  animation-timing-function: ease-out;
}

@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }

  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }
}

/* Values stay within the hero; the destination image is revealed over them. */
.chtc-value-transition {
  position: fixed;
  z-index: 1000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: rgba(250,248,245,.88);
  color: var(--transition-value-colour, #184e3d);
  pointer-events: none;
  animation: chtc-value-cover 180ms cubic-bezier(.22,.61,.36,1) both;
}
.chtc-value-transition span {
  font-size: clamp(32px, 8vw, 120px);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1;
  animation: chtc-value-zoom 180ms cubic-bezier(.22,.61,.36,1) both;
}
.chtc-value-arriving .course-offering-hero,
.chtc-value-arriving .home-editorial-blocks .rpb_homehero .custom-background,
.chtc-value-arriving .hd-hero { position: relative; }
.chtc-value-arriving .course-offering-hero::after,
.chtc-value-arriving .home-editorial-blocks .rpb_homehero .custom-background::after,
.chtc-value-arriving .hd-hero::after {
  content: var(--transition-value-word, "");
  position: absolute;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  background: #faf8f5;
  color: var(--transition-value-colour, #184e3d);
  font-size: clamp(32px, 8vw, 120px);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1;
  pointer-events: none;
  animation: chtc-hero-reveal 800ms cubic-bezier(.4,0,.2,1) both;
}
@keyframes chtc-value-cover { from { opacity: 0; } to { opacity: 1; } }
@keyframes chtc-value-zoom { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: scale(1); } }
@keyframes chtc-hero-reveal {
  0%, 8% { opacity: 1; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .chtc-value-transition,
  .chtc-value-arriving .course-offering-hero::after,
  .chtc-value-arriving .home-editorial-blocks .rpb_homehero .custom-background::after,
  .chtc-value-arriving .hd-hero::after { display: none; }
}

/* Remove existing hero overlays before introducing the value word. */
.chtc-value-departing .course-offering-hero__content,
.chtc-value-departing .home-editorial-blocks .overlay-image,
.chtc-value-departing .hd-hero-grid {
  opacity: 0 !important;
  transition: opacity 100ms ease-out;
}
.chtc-value-arriving .course-offering-hero__content,
.chtc-value-arriving .home-editorial-blocks .overlay-image,
.chtc-value-arriving .home-hero-message,
.chtc-value-arriving .hd-hero-grid {
  animation: chtc-hero-content-reveal 800ms cubic-bezier(.4,0,.2,1) both;
}
.chtc-value-transition { animation-delay: 80ms; }
.chtc-value-transition span { animation-delay: 80ms; }
@keyframes chtc-hero-content-reveal {
  0%, 18% { opacity: 0; }
  100% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .chtc-value-departing .course-offering-hero__content,
  .chtc-value-departing .home-editorial-blocks .overlay-image,
    .chtc-value-departing .hd-hero-grid { opacity: 1 !important; transition: none; }
  .chtc-value-arriving .course-offering-hero__content,
  .chtc-value-arriving .home-editorial-blocks .overlay-image,
  .chtc-value-arriving .home-hero-message,
  .chtc-value-arriving .hd-hero-grid { animation: none; }
}

/* Start closing the selected menu immediately, before the value appears. */
.chtc-menu-leaving .uk-navbar-dropdown,
.chtc-menu-leaving #mobile-menu,
.chtc-menu-leaving #mobile-menu .uk-offcanvas-bar {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 60ms linear !important;
}
/* Keep the value below the replacement image, rather than fading the word
   away on top of an already-visible photograph. */
.chtc-value-arriving .course-offering-hero:has(.course-offering-hero__image)::after {
  animation: none;
}
.chtc-value-arriving .course-offering-hero__image {
  z-index: 101;
  animation: chtc-hero-content-reveal 800ms cubic-bezier(.4,0,.2,1) both;
}
.chtc-value-arriving .course-offering-hero__overlay {
  z-index: 102;
  animation: chtc-hero-content-reveal 800ms cubic-bezier(.4,0,.2,1) both;
}
.chtc-value-arriving .course-offering-hero__frame {
  position: relative;
  z-index: 103;
}
@media (prefers-reduced-motion: reduce) {
  .chtc-menu-leaving .uk-navbar-dropdown,
  .chtc-menu-leaving #mobile-menu,
  .chtc-menu-leaving #mobile-menu .uk-offcanvas-bar { transition: none !important; }
  .chtc-value-arriving .course-offering-hero__image,
  .chtc-value-arriving .course-offering-hero__overlay { animation: none; }
}
@media (max-width: 760px) {
  .chtc-value-arriving .course-offering-hero--mobile-image-hidden::after {
    animation: chtc-hero-reveal 800ms cubic-bezier(.4,0,.2,1) both;
  }
}

/* Include the fast return to the hero within the sub-second animation budget. */
.chtc-value-transition--after-scroll,
.chtc-value-transition--after-scroll span {
  animation-duration: 80ms;
  animation-delay: 30ms;
}

/* Returning home: the old photo holds steady while the bands are already in place. */
.home-transition-stage { display: none; }
.chtc-value-arriving .home-hero-composition > .home-transition-stage {
  display: block;
  grid-area: 1 / 1;
  align-self: start;
  height: var(--home-photo-height);
  position: relative;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}
.chtc-value-arriving .home-transition-stage::before,
.chtc-value-arriving .home-transition-stage::after {
  position: absolute;
  inset: 0;
  content: "";
}
.chtc-value-arriving .home-transition-stage::before {
  background-image: linear-gradient(rgba(250,248,245,.55),rgba(250,248,245,.55)), var(--transition-previous-image, none);
  background-color: #faf8f5;
  background-size: cover;
  background-position: var(--transition-previous-position, center);
  animation: chtc-home-photo-reveal 800ms ease-in-out both;
}
.chtc-value-arriving .home-transition-stage::after {
  content: var(--transition-value-word, "");
  display: grid;
  place-items: center;
  color: var(--transition-value-colour);
  font-size: clamp(32px,8vw,120px);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1;
  animation: chtc-home-word-out 800ms ease-in-out both;
}
.chtc-value-arriving .home-editorial-blocks .home-hero-composition .custom-background::after {
  content: "";
  animation: none;
  display: none;
}
.chtc-value-arriving .home-editorial-blocks .home-hero-message {
  opacity: 1;
  animation: none;
}
.chtc-value-arriving .home-editorial-blocks .overlay-image {
  animation: chtc-content-last-in 800ms ease-out both;
}
@keyframes chtc-home-word-out { 0%, 10% { opacity: 1; } 40%, 100% { opacity: 0; } }
@keyframes chtc-home-photo-reveal { 0%, 30% { opacity: 1; } 85%, 100% { opacity: 0; } }
/* Give the cloud 320ms to appear, overlapping the final word fade. */
@keyframes chtc-home-cloud-in { 0%, 60% { opacity: 0; } 100% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .chtc-value-arriving .home-hero-composition > .home-transition-stage { display: none; }
  .chtc-value-arriving .home-editorial-blocks .overlay-image { animation: none; }
}

/* Reveal the incoming photograph first; keep the value legible above it until
   the latter part of the same 800ms sequence. */
.chtc-value-arriving .course-offering-hero:has(.course-offering-hero__image)::after {
  z-index: 104;
  background: transparent;
  text-shadow: 0 0 18px #faf8f5, 0 0 4px #faf8f5;
  animation: chtc-value-late-out 800ms ease-in-out both;
}
.chtc-value-arriving .course-offering-hero__image,
.chtc-value-arriving .course-offering-hero__overlay {
  animation: chtc-photo-first-in 800ms ease-in-out both;
}
.chtc-value-arriving .course-offering-hero__content {
  animation: chtc-content-last-in 800ms ease-out both;
}
.chtc-value-arriving .home-transition-stage::before {
  animation: chtc-photo-first-out 800ms ease-in-out both;
}
.chtc-value-arriving .home-transition-stage::after {
  text-shadow: 0 0 18px #faf8f5, 0 0 4px #faf8f5;
  animation: chtc-value-late-out 800ms ease-in-out both;
}
@keyframes chtc-photo-first-in { 0% { opacity: 0; } 60%, 100% { opacity: 1; } }
@keyframes chtc-photo-first-out { 0% { opacity: 1; } 60%, 100% { opacity: 0; } }
/* Dissolve the lettering without changing its position or size. */
@keyframes chtc-value-late-out {
  0%, 60% { opacity: 1; filter: blur(0); }
  82% { opacity: .45; filter: blur(2px); }
  100% { opacity: 0; filter: blur(6px); }
}
@keyframes chtc-content-last-in { 0%, 70% { opacity: 0; } 100% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .chtc-value-arriving .course-offering-hero__image,
  .chtc-value-arriving .course-offering-hero__overlay,
  .chtc-value-arriving .course-offering-hero__content { animation: none; }
}

/* The outgoing word is the continuity point: it must already be visible when
   the browser captures the departing page, even on a fast cached navigation. */
.chtc-value-transition,
.chtc-value-transition span {
  animation: none;
  opacity: 1;
}

/* Let the outgoing photo remain recognisable as its cloud gives way to the value. */
.chtc-value-transition,
.chtc-value-transition--after-scroll {
  background: rgba(250,248,245,.55);
  animation: chtc-value-cover 140ms ease-out both;
}
.chtc-value-transition span,
.chtc-value-transition--after-scroll span {
  animation: chtc-value-enter 110ms ease-out 20ms both;
}
@keyframes chtc-value-enter { from { opacity: 0; } to { opacity: 1; } }

/* Crossfade cloud and value together; keep the photo wash independent so it
   cannot delay or weaken the incoming lettering. */
.chtc-value-transition,
.chtc-value-transition--after-scroll {
  background: transparent;
  animation: none;
  opacity: 1;
}
.chtc-value-transition::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(250,248,245,.55);
  animation: chtc-value-cover 140ms ease-out both;
}
.chtc-value-transition span,
.chtc-value-transition--after-scroll span {
  position: relative;
  z-index: 1;
  animation: chtc-value-enter 100ms ease-out both;
}

/* A readable loading cue sits 30px above the value without moving its centre. */
.chtc-transition-loading { display: none; }
.chtc-value-transition > .chtc-transition-loading,
.chtc-value-arriving .course-offering-hero > .chtc-transition-loading,
.chtc-value-arriving .home-transition-stage > .chtc-transition-loading {
  display: block;
  position: absolute;
  z-index: 105;
  left: 50%;
  bottom: calc(50% + clamp(16px, 4vw, 60px) + 30px);
  transform: translateX(-50%);
  margin: 0;
  color: #46534d;
  text-shadow: 0 0 12px #faf8f5, 0 0 3px #faf8f5;
  font-family: inherit;
  font-size: clamp(18px, 2vw, 26px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .18em;
  white-space: nowrap;
  pointer-events: none;
}
.chtc-value-arriving .course-offering-hero > .chtc-transition-loading,
.chtc-value-arriving .home-transition-stage > .chtc-transition-loading {
  animation: chtc-value-late-out 800ms ease-in-out both;
}
.chtc-transition-loading > .chtc-transition-dots {
  display: inline-block;
  position: static;
  z-index: auto;
  width: 1.05em;
  margin-left: .25em;
  font: inherit;
  letter-spacing: 0;
  opacity: 1;
  animation: none;
}
.chtc-transition-dots > i {
  display: inline-block;
  width: .35em;
  font-style: normal;
  opacity: .15;
  animation: chtc-loading-dot 1.2s ease-in-out infinite;
}
.chtc-transition-dots > i:nth-child(2) { animation-delay: .15s; }
.chtc-transition-dots > i:nth-child(3) { animation-delay: .3s; }
@keyframes chtc-loading-dot {
  0%, 75%, 100% { opacity: .15; }
  30%, 45% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .chtc-transition-loading { display: none !important; }
  .chtc-transition-dots > i { animation: none; }
}
/* Keep both labels at the exact departing viewport coordinates. Hero heights
   and header offsets belong to the photograph, never to the continuity text. */
.chtc-value-arriving.chtc-value-positioned .course-offering-hero::after,
.chtc-value-arriving.chtc-value-positioned .home-transition-stage::after,
.chtc-value-arriving.chtc-value-positioned .hd-hero::after{
 position:fixed;inset:auto;left:var(--transition-word-x);top:var(--transition-word-y);
 width:max-content;height:auto;transform:translate(-50%,-50%);
 font-size:var(--transition-word-size);font-family:var(--transition-word-font,inherit);
 background:transparent;z-index:104;
}
.chtc-value-arriving.chtc-value-positioned .course-offering-hero>.chtc-transition-loading,
.chtc-value-arriving.chtc-value-positioned .home-transition-stage>.chtc-transition-loading{
 position:fixed;left:var(--transition-loading-x);top:var(--transition-loading-top);bottom:auto;
 transform:translateX(-50%);font-size:var(--transition-loading-size);
 font-family:var(--transition-loading-font,inherit);z-index:105;
}

/* The Training & Development landing hero uses the same continuity handoff. */
.chtc-value-departing .training-full-hero .about-hero-copy {
  opacity:0!important;transition:opacity 100ms ease-out;
}
.chtc-value-arriving .training-full-hero::before {
  content:"";position:absolute;inset:0;z-index:100;pointer-events:none;
  background-image:linear-gradient(rgba(250,248,245,.55),rgba(250,248,245,.55)),var(--transition-previous-image,none);
  background-color:#faf8f5;background-size:cover;
  background-position:var(--transition-previous-position,center);
  animation:chtc-photo-first-out 800ms ease-in-out both;
}
.chtc-value-arriving .training-full-hero::after {
  content:var(--transition-value-word,"");position:absolute;inset:0;z-index:104;
  display:grid;place-items:center;pointer-events:none;
  color:var(--transition-value-colour,#184e3d);
  font-size:clamp(32px,8vw,120px);font-weight:800;letter-spacing:-.035em;line-height:1;
  text-shadow:0 0 18px #faf8f5,0 0 4px #faf8f5;
  animation:chtc-value-late-out 800ms ease-in-out both;
}
.chtc-value-arriving .training-full-hero .about-hero-copy {
  position:relative;z-index:103;animation:chtc-content-last-in 800ms ease-out both;
}
.chtc-value-arriving .training-full-hero>.chtc-transition-loading {
  display:block;position:absolute;z-index:105;left:50%;
  bottom:calc(50% + clamp(16px,4vw,60px) + 30px);transform:translateX(-50%);
  margin:0;color:#46534d;text-shadow:0 0 12px #faf8f5,0 0 3px #faf8f5;
  font-family:inherit;font-size:clamp(18px,2vw,26px);font-weight:600;
  line-height:1;letter-spacing:.18em;white-space:nowrap;pointer-events:none;
  animation:chtc-value-late-out 800ms ease-in-out both;
}
.chtc-value-arriving.chtc-value-positioned .training-full-hero::after {
  position:fixed;inset:auto;left:var(--transition-word-x);top:var(--transition-word-y);
  width:max-content;height:auto;transform:translate(-50%,-50%);
  font-size:var(--transition-word-size);font-family:var(--transition-word-font,inherit);
}
.chtc-value-arriving.chtc-value-positioned .training-full-hero>.chtc-transition-loading {
  position:fixed;left:var(--transition-loading-x);top:var(--transition-loading-top);bottom:auto;
  font-size:var(--transition-loading-size);font-family:var(--transition-loading-font,inherit);
}
@media(prefers-reduced-motion:reduce){
  .chtc-value-arriving .training-full-hero::before,
  .chtc-value-arriving .training-full-hero::after{display:none}
  .chtc-value-arriving .training-full-hero .about-hero-copy{animation:none}
  .chtc-value-departing .training-full-hero .about-hero-copy{opacity:1!important;transition:none}
}

/* Returning home: finish dissolving the cue before revealing the word cloud. */
.chtc-value-arriving .home-transition-stage::after,
.chtc-value-arriving .home-transition-stage>.chtc-transition-loading {
  animation-duration:650ms;
}
.chtc-value-arriving .home-editorial-blocks .overlay-image {
  animation:chtc-home-cloud-after-loading 350ms ease-in-out 650ms both;
}
@keyframes chtc-home-cloud-after-loading {
  from{opacity:0}to{opacity:1}
}
@media(prefers-reduced-motion:reduce){
  .chtc-value-arriving .home-editorial-blocks .overlay-image{animation:none}
}