/* Shared site motion — presence & hierarchy, transform/opacity only */

:root{
  --motion-ease:cubic-bezier(.22,.82,.2,1);
  --motion-fast:.2s;
  --motion-med:.55s;
  --motion-slow:.85s;
}

/* —— Entry: nav —— */
.site-header{
  animation:motion-fade-in .55s var(--motion-ease) both;
}

.site-header .brand,
.site-header .main-nav,
.site-header .header-actions{
  animation:motion-fade-in .6s var(--motion-ease) both;
}
.site-header .brand{animation-delay:.04s}
.site-header .main-nav{animation-delay:.12s}
.site-header .header-actions{animation-delay:.2s}

.account-area:not([hidden]){
  animation:motion-fade-in .45s var(--motion-ease) both;
}

/* —— Entry: hero stagger —— */
.hero-copy > h1,
.hero-copy > .lead,
.hero-copy > .hero-buttons{
  opacity:0;
  animation:motion-fade-up .75s var(--motion-ease) both;
}
.hero-copy > h1{animation-delay:.1s}
.hero-copy > .lead{animation-delay:.24s}
.hero-copy > .hero-buttons{animation-delay:.38s}

.hero-side{
  opacity:0;
  animation:motion-fade-in .7s var(--motion-ease) .5s both;
}

/* —— Atmosphere: slow yard drift (ken burns) —— */
.hero{
  animation:motion-hero-drift 32s ease-in-out infinite alternate;
}

.hero-atmosphere{
  animation:motion-atmosphere-breathe 18s ease-in-out infinite alternate;
}

/* —— Buttons: refined hover / press —— */
.solid-button,
.outline-button,
.ghost-button,
.dashboard-button,
.nb-07__cta{
  transition:
    transform var(--motion-fast) var(--motion-ease),
    opacity var(--motion-fast) ease,
    background .22s ease,
    border-color .22s ease,
    color .22s ease,
    box-shadow .22s ease;
}

.solid-button:hover,
.outline-button:hover,
.dashboard-button:hover:not(:disabled),
.nb-07__cta:hover{
  transform:translateY(-1px);
}

.solid-button:active,
.outline-button:active,
.dashboard-button:active:not(:disabled),
.nb-07__cta:active{
  transform:translateY(0);
  opacity:.9;
}

/* —— Scroll reveals —— */
.motion-reveal{
  opacity:0;
  transform:translate3d(0,18px,0);
  transition:
    opacity var(--motion-slow) var(--motion-ease),
    transform var(--motion-slow) var(--motion-ease);
  will-change:opacity,transform;
}
.motion-reveal.is-inview{
  opacity:1;
  transform:none;
  will-change:auto;
}
.motion-reveal.motion-delay-1{transition-delay:.08s}
.motion-reveal.motion-delay-2{transition-delay:.16s}
.motion-reveal.motion-delay-3{transition-delay:.24s}

.motion-reveal-stagger > *:nth-child(1){transition-delay:.04s}
.motion-reveal-stagger > *:nth-child(2){transition-delay:.1s}
.motion-reveal-stagger > *:nth-child(3){transition-delay:.16s}
.motion-reveal-stagger > *:nth-child(4){transition-delay:.22s}

.quick-stats.motion-reveal .stat,
.about-section.motion-reveal .values article{
  opacity:0;
  transform:translate3d(0,14px,0);
  transition:
    opacity .65s var(--motion-ease),
    transform .65s var(--motion-ease);
}
.quick-stats.motion-reveal.is-inview .stat,
.about-section.motion-reveal.is-inview .values article{
  opacity:1;
  transform:none;
}
.quick-stats.motion-reveal.is-inview .stat:nth-child(1),
.about-section.motion-reveal.is-inview .values article:nth-child(1){transition-delay:.04s}
.quick-stats.motion-reveal.is-inview .stat:nth-child(2),
.about-section.motion-reveal.is-inview .values article:nth-child(2){transition-delay:.1s}
.quick-stats.motion-reveal.is-inview .stat:nth-child(3),
.about-section.motion-reveal.is-inview .values article:nth-child(3){transition-delay:.16s}
.quick-stats.motion-reveal.is-inview .stat:nth-child(4){transition-delay:.22s}

/* —— Applications —— */
.application-intro > h1,
.application-intro > p{
  opacity:0;
  animation:motion-fade-up .7s var(--motion-ease) both;
}
.application-intro > h1{animation-delay:.08s}
.application-intro > p{animation-delay:.2s}

.application-login:not([hidden]),
.access-card:not([hidden]),
.application-status-panel:not([hidden]),
.application-wizard:not([hidden]){
  animation:motion-fade-up .55s var(--motion-ease) both;
}

.wizard-panel:not([hidden]){
  animation:motion-fade-up .42s var(--motion-ease) both;
}

.wizard-step-indicator{
  transition:opacity .2s ease,transform .2s var(--motion-ease),background .2s ease,border-color .2s ease,color .2s ease;
}

/* —— Admin (light) —— */
.admin-page .admin-cc-app:not([hidden]),
.admin-page .admin-access:not([hidden]){
  animation:motion-fade-in .4s var(--motion-ease) both;
}

/* —— Keyframes —— */
@keyframes motion-fade-in{
  from{opacity:0}
  to{opacity:1}
}

@keyframes motion-fade-up{
  from{opacity:0;transform:translate3d(0,16px,0)}
  to{opacity:1;transform:none}
}

@keyframes motion-hero-drift{
  from{background-position:48% 44%}
  to{background-position:54% 50%}
}

@keyframes motion-atmosphere-breathe{
  from{opacity:.48}
  to{opacity:.62}
}

/* —— Reduced motion —— */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}

  .site-header,
  .site-header .brand,
  .site-header .main-nav,
  .site-header .header-actions,
  .account-area:not([hidden]),
  .hero-copy > h1,
  .hero-copy > .lead,
  .hero-copy > .hero-buttons,
  .hero-side,
  .hero,
  .hero-atmosphere,
  .application-intro > h1,
  .application-intro > p,
  .application-login:not([hidden]),
  .access-card:not([hidden]),
  .application-status-panel:not([hidden]),
  .application-wizard:not([hidden]),
  .wizard-panel:not([hidden]),
  .admin-page .admin-cc-app:not([hidden]),
  .admin-page .admin-access:not([hidden]){
    animation:none!important;
    opacity:1!important;
    transform:none!important;
  }

  .motion-reveal,
  .motion-reveal.is-inview,
  .quick-stats.motion-reveal .stat,
  .about-section.motion-reveal .values article,
  .quick-stats.motion-reveal.is-inview .stat,
  .about-section.motion-reveal.is-inview .values article{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }

  .solid-button:hover,
  .outline-button:hover,
  .dashboard-button:hover:not(:disabled),
  .nb-07__cta:hover,
  .solid-button:active,
  .outline-button:active,
  .dashboard-button:active:not(:disabled),
  .nb-07__cta:active{
    transform:none;
  }
}