:root{
  --motion-fast:360ms;
  --motion-base:720ms;
  --motion-slow:980ms;
  --motion-ease:cubic-bezier(.22,1,.36,1);
  --motion-ease-soft:cubic-bezier(.16,1,.3,1);
}

.mission,.about,.ceo,.consult,.page-band,.category-strip,.trusted,.quote,.tby,.cta,.footer{overflow-x:clip}

.nav{
  transition:box-shadow var(--motion-fast) ease,border-color var(--motion-fast) ease;
}
.nav.motion-scrolled{
  border-bottom-color:rgba(10,29,63,.12);
  box-shadow:0 8px 28px rgba(7,22,48,.12);
}

.btn-red,.btn-gold{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transform:translateZ(0);
  transition:background .2s,filter .2s,transform var(--motion-fast) var(--motion-ease),box-shadow var(--motion-fast) ease;
}
.btn-red::after,.btn-gold::after{
  content:"";
  position:absolute;
  z-index:1;
  top:-50%;
  left:-42%;
  width:24%;
  height:200%;
  background:rgba(255,255,255,.2);
  transform:skewX(-18deg) translateX(0);
  transition:transform 720ms var(--motion-ease);
  pointer-events:none;
}

.hero-photo figure{
  transform:translate3d(var(--motion-x,0),var(--motion-y,0),0);
  transition:clip-path var(--motion-slow) var(--motion-ease-soft),transform 520ms var(--motion-ease);
}
.hero-photo figure img{
  transition:transform 1.2s var(--motion-ease-soft),filter 480ms ease;
}
.hero-photo .frame{
  transform-origin:center;
}
.hero-photo .slash{
  transform-origin:center bottom;
}

.motion-enabled .form .done{
  opacity:0;
  transform:translateY(14px);
}
.motion-enabled .form .done.is-visible{
  opacity:1;
  transform:none;
  transition:opacity var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease);
}
.form .done.is-visible .c{
  animation:successPulse 760ms var(--motion-ease) both;
}

@keyframes successPulse{
  0%{opacity:0;transform:scale(.72)}
  60%{opacity:1;transform:scale(1.08)}
  100%{opacity:1;transform:scale(1)}
}

@media (prefers-reduced-motion:no-preference){
  .motion-enabled .fade{animation:none}

  .motion-enabled [data-motion]{
    opacity:0;
    transform:translate3d(0,24px,0);
    transition-property:opacity,transform,clip-path;
    transition-duration:var(--motion-base);
    transition-timing-function:var(--motion-ease);
    transition-delay:var(--motion-delay,0ms);
  }
  .motion-enabled [data-motion="fade"]{transform:none}
  .motion-enabled [data-motion="left"]{transform:translate3d(-28px,0,0)}
  .motion-enabled [data-motion="right"]{transform:translate3d(28px,0,0)}
  .motion-enabled [data-motion="scale"]{transform:scale(.965)}
  .motion-enabled [data-motion="rule"]{
    opacity:1;
    transform:scaleX(0);
    transform-origin:left center;
  }
  .motion-enabled [data-motion].is-in{
    opacity:1;
    transform:none;
    will-change:auto;
  }

  .motion-enabled .hero-photo[data-motion] figure{
    clip-path:inset(0 100% 0 0);
  }
  .motion-enabled .hero-photo[data-motion].is-in figure{
    clip-path:inset(0 0 0 0);
  }
  .motion-enabled .hero-photo[data-motion] figure img{
    transform:scale(1.045);
  }
  .motion-enabled .hero-photo[data-motion].is-in figure img{
    transform:scale(1);
  }
  .motion-enabled .hero-photo[data-motion] .frame{
    opacity:0;
    transform:scale(.97);
    transition:opacity 760ms var(--motion-ease) 520ms,transform 760ms var(--motion-ease) 520ms;
  }
  .motion-enabled .hero-photo[data-motion].is-in .frame{
    opacity:1;
    transform:none;
  }
  .motion-enabled .hero-photo[data-motion] .slash{
    opacity:0;
    clip-path:inset(100% 0 0 0);
    transform:translateY(28px) skewX(-8deg);
    transition:opacity 460ms ease 420ms,clip-path 820ms var(--motion-ease) 420ms,transform 820ms var(--motion-ease) 420ms;
  }
  .motion-enabled .hero-photo[data-motion] .slash.red{
    transition-delay:510ms;
  }
  .motion-enabled .hero-photo[data-motion].is-in .slash{
    opacity:.9;
    clip-path:inset(0 0 0 0);
    transform:skewX(-8deg);
  }
  .motion-enabled .hero-photo[data-motion] .hero-card{
    opacity:0;
    transform:translate3d(-18px,12px,0);
    transition:opacity 640ms var(--motion-ease) 680ms,transform 640ms var(--motion-ease) 680ms;
  }
  .motion-enabled .hero-photo[data-motion].is-in .hero-card{
    opacity:1;
    transform:none;
  }

  .faq-list details[open] p{
    animation:detailReveal 420ms var(--motion-ease) both;
  }
}

@keyframes detailReveal{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:none}
}

@media (hover:hover) and (pointer:fine){
  .btn-red:hover,.btn-gold:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(7,22,48,.18);
  }
  .btn-red:hover::after,.btn-gold:hover::after{
    transform:skewX(-18deg) translateX(650%);
  }
  .motion-enabled .mcard[data-motion].is-in:hover{
    transform:translate3d(5px,0,0);
    border-color:rgba(198,164,92,.48);
    box-shadow:0 12px 32px rgba(7,22,48,.09);
  }
  .motion-enabled .award[data-motion].is-in:hover,
  .motion-enabled .service-item[data-motion].is-in:hover,
  .motion-enabled .person[data-motion].is-in:hover{
    transform:translate3d(0,-5px,0);
  }
  .mcard,.award,.service-item,.person{
    transition:opacity var(--motion-base) var(--motion-ease),transform var(--motion-base) var(--motion-ease),border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease;
  }
  .service-item img,.person img,.media-image img,.mission .photos img,.about .photo img,.ceo .photo img{
    transition:transform 820ms var(--motion-ease),filter var(--motion-fast) ease;
  }
  .person:hover img,.media-row:hover .media-image img,.mission .photos figure:hover img,.about .photo:hover img,.ceo .photo:hover img{
    transform:scale(1.025);
  }
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
  [data-motion]{opacity:1!important;transform:none!important;clip-path:none!important}
  .hero-photo figure,.hero-photo figure img,.hero-photo .frame,.hero-card{
    transform:none!important;
    clip-path:none!important;
  }
  .hero-photo .slash{opacity:.9!important;transform:skewX(-8deg)!important;clip-path:none!important}
}
