/* KPCG site-wide motion language: layered, responsive and accessibility-aware. */
:root{
  --motion-ease:cubic-bezier(.22,.72,.2,1);
  --motion-spring:cubic-bezier(.16,1,.3,1);
  --motion-duration:760ms;
}

html{scroll-behavior:smooth}
body.motion-ready #app{transition:opacity 160ms ease,transform 160ms ease,filter 160ms ease}
body.motion-route-leaving #app{opacity:.2;transform:translateY(10px) scale(.997);filter:blur(3px)}
body.motion-route-entering #app>main{animation:motion-page-in 720ms var(--motion-spring) both}

.motion-progress{position:fixed;z-index:1600;left:0;top:0;width:100%;height:3px;pointer-events:none;transform-origin:left;background:linear-gradient(90deg,#c4861a,#0b5139 58%,#a84a2a);transform:scaleX(var(--scroll-progress,0));box-shadow:0 1px 8px rgba(11,81,57,.25)}

.motion-item{--motion-x:0px;--motion-y:34px;--motion-scale:.985;opacity:0;transform:translate3d(var(--motion-x),var(--motion-y),0) scale(var(--motion-scale));transition:opacity var(--motion-duration) var(--motion-ease),transform var(--motion-duration) var(--motion-spring),filter var(--motion-duration) var(--motion-ease);transition-delay:calc(var(--motion-order,0) * 58ms);filter:blur(3px);will-change:opacity,transform}
.motion-item[data-motion="left"]{--motion-x:-42px;--motion-y:0px}
.motion-item[data-motion="right"]{--motion-x:42px;--motion-y:0px}
.motion-item[data-motion="scale"]{--motion-y:12px;--motion-scale:.94}
.motion-item.motion-visible{opacity:1;transform:translate3d(0,0,0) scale(1);filter:none;will-change:auto}

.motion-heading{position:relative;width:max-content;max-width:100%}
.motion-heading:after{content:"";display:block;width:min(92px,28%);height:3px;margin-top:14px;background:linear-gradient(90deg,#c4861a,#0b5139);transform:scaleX(0);transform-origin:left;transition:transform 900ms var(--motion-spring) 220ms}
.motion-heading.motion-visible:after{transform:scaleX(1)}

.motion-image-wrap{overflow:hidden}
.motion-image{opacity:.55;transform:scale(1.075);filter:saturate(.72) contrast(.94);transition:opacity 900ms var(--motion-ease),transform 1.4s var(--motion-spring),filter 1.1s ease}
.motion-visible .motion-image,.motion-image.motion-image-ready{opacity:1;transform:scale(1.01);filter:saturate(1) contrast(1)}
.motion-image-wrap:hover .motion-image{transform:scale(1.055)}
/* The initial homepage hero is the LCP element. Keep its slideshow/Ken Burns
   movement, but do not delay first paint behind the generic image reveal. */
.v16-home-hero .v16-hero-slide.active img.motion-image{opacity:1;filter:saturate(.88) contrast(1.04);transition:transform 8s ease!important}

.motion-parallax{transform:translate3d(0,var(--motion-parallax-y,0px),0) scale(1.07)!important;transition:transform 160ms linear!important}

.motion-card{--tilt-x:0deg;--tilt-y:0deg;--lift:0px;transform-style:preserve-3d;transition:transform 360ms var(--motion-spring),box-shadow 360ms ease,border-color 260ms ease,background-color 260ms ease!important}
.motion-card.motion-visible{transform:perspective(900px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(var(--lift))}
.motion-card:hover,.motion-card:focus-within{--lift:-7px;box-shadow:0 22px 48px rgba(8,47,36,.14);border-color:rgba(11,81,57,.45)}
.motion-card>*{transition:transform 360ms var(--motion-spring)}
.motion-card:hover>*{transform:translateZ(8px)}

.btn,.icon-btn,.chip,.section-link,.relation-link,.v16-theme-link,.v16-agenda-item a{position:relative;overflow:hidden;isolation:isolate;transition:transform 260ms var(--motion-spring),box-shadow 260ms ease,background-color 260ms ease,color 260ms ease,border-color 260ms ease!important}
.btn:after,.chip:after{content:"";position:absolute;z-index:-1;inset:-2px;background:linear-gradient(110deg,transparent 22%,rgba(255,255,255,.36) 46%,transparent 68%);transform:translateX(-130%);transition:transform 620ms var(--motion-ease)}
.btn:hover:after,.chip:hover:after{transform:translateX(130%)}
.btn:hover,.icon-btn:hover{transform:translateY(-3px)}
.btn:active,.icon-btn:active,.chip:active{transform:translateY(0) scale(.97)}

.desktop-nav a,.footer-links a,.section-link{position:relative}
.desktop-nav a:after,.footer-links a:after,.section-link:after{content:"";position:absolute;left:10%;right:10%;bottom:4px;height:2px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform 340ms var(--motion-spring)}
.desktop-nav a:hover:after,.desktop-nav a[aria-current="page"]:after,.footer-links a:hover:after,.section-link:hover:after{transform:scaleX(1);transform-origin:left}

.site-header{animation:motion-header-drop 760ms var(--motion-spring) both}
.brand-mark,.brand-mark.asset{transition:transform 520ms var(--motion-spring),box-shadow 380ms ease}
.brand:hover .brand-mark{transform:rotate(-5deg) scale(1.08);box-shadow:0 10px 24px rgba(11,81,57,.2)}

.hero,.xp-hero,.ed-hero,.v16-home-hero{isolation:isolate}
.hero:before,.hero:after,.climate-orbit,.xp-signal,.v16-home-hero:before{animation:motion-ambient-drift 11s ease-in-out infinite alternate}
.hero-data .datum,.xp-metric,.v16-pulse-item{transition:transform 320ms var(--motion-spring),background-color 320ms ease}
.hero-data .datum:hover,.xp-metric:hover,.v16-pulse-item:hover{transform:translateY(-5px)}

.county-shape{transform-box:fill-box;transform-origin:center;transition:transform 260ms var(--motion-spring),filter 220ms ease,opacity 220ms ease,stroke-width 220ms ease!important}
.county-shape:hover,.county-shape:focus{transform:translateY(-3px) scale(1.025)}
.map-panel.motion-visible .county-shape{animation:motion-map-breathe 5.8s ease-in-out infinite alternate;animation-delay:calc(var(--county-order,0) * 45ms)}
.map-panel.motion-visible .county-shape:nth-of-type(2n){animation-duration:6.8s}
.map-panel.motion-visible .county-shape:nth-of-type(3n){animation-duration:7.6s}

.bars .bar{transform-origin:bottom;animation:motion-bar-grow 900ms var(--motion-spring) both}
.timeline-item:before,.live-dot,.v16-live-dot{animation:motion-pulse 2.2s ease-in-out infinite}
.table-wrap tbody tr{transition:transform 240ms var(--motion-spring),background-color 240ms ease}
.table-wrap tbody tr:hover{transform:translateX(5px)}
input,select,textarea{transition:border-color 240ms ease,box-shadow 240ms ease,transform 240ms var(--motion-spring)}
input:focus,select:focus,textarea:focus{transform:translateY(-2px)}
.drawer.open .menu-list>*{animation:motion-menu-in 480ms var(--motion-spring) both;animation-delay:calc(var(--motion-order,0) * 42ms)}
.modal-wrap.open .modal{animation:motion-modal-in 460ms var(--motion-spring) both}

@keyframes motion-page-in{from{opacity:0;transform:translateY(18px) scale(.995);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@keyframes motion-header-drop{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
@keyframes motion-ambient-drift{0%{transform:translate3d(-1%,0,0) rotate(-1deg)}100%{transform:translate3d(2%,2%,0) rotate(2deg)}}
@keyframes motion-map-breathe{from{filter:saturate(.94)}to{filter:saturate(1.08) brightness(1.025)}}
@keyframes motion-bar-grow{from{transform:scaleY(.04);opacity:.2}to{transform:scaleY(1);opacity:1}}
@keyframes motion-pulse{0%,100%{box-shadow:0 0 0 0 rgba(25,116,71,.08)}50%{box-shadow:0 0 0 7px rgba(25,116,71,.14)}}
@keyframes motion-menu-in{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
@keyframes motion-modal-in{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}

@media(max-width:760px){
  :root{--motion-duration:620ms}
  .motion-item{--motion-y:24px}
  .motion-card:hover,.motion-card:focus-within{--lift:-3px}
  .motion-card:hover>*{transform:none}
  .motion-parallax{transform:scale(1.035)!important}
  .map-panel.motion-visible .county-shape{animation:none}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  .motion-progress{display:none}
  body.motion-ready #app,.motion-item,.motion-heading:after,.motion-image,.motion-parallax,.motion-card,.motion-card>*,.btn,.icon-btn,.chip,.site-header,.brand-mark,.county-shape,input,select,textarea{animation:none!important;transition:none!important;transform:none!important;filter:none!important}
  .motion-item,.motion-image{opacity:1!important}
}
