/* ═══════════════════════════════════════════════════════════════════════
   mgmnt.work — landing : motion + responsive
   ═══════════════════════════════════════════════════════════════════════ */

[data-reveal] { opacity: 0; transform: translateY(26px) scale(0.985); transition: opacity .75s var(--ease), transform .75s var(--ease); will-change: opacity, transform; }
[data-reveal].is-in { opacity: 1; transform: none; }

/* hero app interior animates in once revealed */
.hero__app .kpi, .hero__app .row:not(.row--head) { opacity: 0; transform: translateY(10px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.hero__app.is-in .kpi { opacity: 1; transform: none; }
.hero__app.is-in .kpi:nth-child(1) { transition-delay: .22s; }
.hero__app.is-in .kpi:nth-child(2) { transition-delay: .28s; }
.hero__app.is-in .kpi:nth-child(3) { transition-delay: .34s; }
.hero__app.is-in .kpi:nth-child(4) { transition-delay: .40s; }
.hero__app.is-in .kpi:nth-child(5) { transition-delay: .46s; }
.hero__app.is-in .row:not(.row--head) { opacity: 1; transform: none; }
.hero__app.is-in .row:nth-child(2) { transition-delay: .50s; }
.hero__app.is-in .row:nth-child(3) { transition-delay: .56s; }
.hero__app.is-in .row:nth-child(4) { transition-delay: .62s; }
.hero__app.is-in .row:nth-child(5) { transition-delay: .68s; }
.hero__app.is-in .row:nth-child(6) { transition-delay: .74s; }

/* ── ambient + entrance animations (site-wide) ── */
@keyframes navIn { from { opacity: 0; transform: translateY(-16px); } to { opacity: 1; transform: none; } }
.nav { animation: navIn .7s var(--ease) both; }

/* hero copy children rise in on load, staggered */
@keyframes riseIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.hero__copy .kicker { animation: riseIn .7s var(--ease) both; animation-delay: .08s; }
.hero__copy .display { animation: riseIn .8s var(--ease) both; animation-delay: .16s; }
.hero__copy .hero__cta { animation: riseIn .7s var(--ease) both; animation-delay: .30s; }

/* quiet kicker dot pulse */
@keyframes dotPulse { 0%, 100% { box-shadow: 0 0 0 0 var(--accent-soft-2); } 50% { box-shadow: 0 0 0 5px transparent; } }
.kicker__dot { animation: dotPulse 4s ease-in-out infinite; }

/* platform hub: slow ring spin + breathing glow */
@keyframes hubSpin { to { transform: rotate(360deg); } }
@keyframes hubGlow { 0%, 100% { opacity: .65; transform: scale(0.98); } 50% { opacity: 1; transform: scale(1.04); } }
.hub::before { animation: hubSpin 48s linear infinite; }
.hub::after { animation: hubGlow 4.5s ease-in-out infinite; }

/* chart bars grow in */
@keyframes barGrow { from { height: 0; } to { height: var(--h); } }
.bars i { animation: barGrow 1s var(--ease) both; }
.bars i:nth-child(1) { animation-delay: .05s; }
.bars i:nth-child(2) { animation-delay: .13s; }
.bars i:nth-child(3) { animation-delay: .21s; }
.bars i:nth-child(4) { animation-delay: .29s; }
.bars i:nth-child(5) { animation-delay: .37s; }
.bars i:nth-child(6) { animation-delay: .45s; }

/* donut draws in */
@keyframes donutIn { from { opacity: 0; transform: rotate(-120deg) scale(0.6); } to { opacity: 1; transform: none; } }
.donut { animation: donutIn 1.1s var(--ease) both; animation-delay: .2s; }

/* extra hover micro-interactions */
.out__card { transition: transform .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease); }
.out__card:hover { transform: translateY(-3px); border-color: var(--border-2); box-shadow: var(--shadow-md); }
.schema__field { transition: transform .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease); }
.schema__field:hover { transform: translateX(4px); border-color: var(--border-2); }
.kpi { transition: border-color .18s var(--ease); }
.frame .kpi:hover { border-color: rgba(255,255,255,0.22); }

/* ── responsive ── */
@media (max-width: 1040px) {
  .promise, .custom, .pm { grid-template-columns: 1fr; gap: 36px; }
  .hub { max-width: 380px; }
  .prob, .quotes { grid-template-columns: 1fr; }
  .out { grid-template-columns: 1fr; }
  /* unpin scroll showcases on tablet/mobile — stack stage above steps */
  .sc, .gov__grid { grid-template-columns: 1fr; gap: 28px; }
  .sc__stage, .gov__stage { position: static; height: auto; }
  .sc__frame { position: relative; opacity: 1; transform: none; }
  .sc__frame:not(.is-active) { display: none; }
  .sc__step, .gov__item { min-height: 0; padding: 22px 0; opacity: 1; }
  .gov__item { border-left: none; padding-left: 0; border-top: 1px solid var(--dk-border); }
  .gov__viz { position: relative; inset: auto; opacity: 1; transform: none; }
  .gov__viz:not(.is-active) { display: none; }
}

@media (max-width: 760px) {
  body { font-size: 16px; }
  .nav { top: 8px; }
  .nav__links { display: none; }
  .nav__pill { gap: 0; }
  .section, .showcase { padding: 64px 0; }
  .cta { padding: 80px 0; }
  .hero { padding: 120px 0 64px; }
  .frag { grid-template-columns: 1fr; gap: 18px; text-align: center; }
  .frag__flow { display: none; }
  .frag__sources { gap: 8px; }
  .logos__inner { justify-content: center; }
  .footer__inner { grid-template-columns: 1fr; gap: 32px; }
  .footer__cols { grid-template-columns: repeat(2, 1fr); }
  .frame__app { grid-template-columns: 1fr; }
  .app__side { display: none; }
  .app__kpis { grid-template-columns: repeat(2, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
  [data-reveal], .hero__app .kpi, .hero__app .row { opacity: 1 !important; transform: none !important; transition: none !important; }
  .sc__frame, .gov__viz { transition: none !important; }
  /* disable ambient + entrance animations and the hero scale */
  .nav, .kicker__dot, .hub::before, .hub::after, .bars i, .donut,
  .hero__copy .kicker, .hero__copy .display, .hero__copy .hero__cta { animation: none !important; }
  .bars i { height: var(--h) !important; }
  .hero__frame { transform: none !important; }
}